/*
* Mobile - FONTS
* Mobile - BUTTONS
* Mobile - HEADER
* Mobile - INDEX HERO
* Mobile - INDEX CATEGORIES
* Mobile - INDEX GOODDEALS
* Mobile - INDEX RECORDS
* Mobile - INDEX INTEGRATION SECTION
* Mobile - Rentals and SALES pages
* Mobile - RECORDS AND PROJECTS PAGES
* Mobile - CONTACT PAGE
* Mobile - CART PAGE
* Mobile - Footer
*
* FONTS ON TABLETT
*
*/

@media screen and (max-width: 575px) {
  .categories,
  .good-deals,
  .projects-cat,
  .projects,
  .brands {
    padding: 3rem 0;
  }
  h1 {
    font-size: var(--l);
  }

  h2 {
    font-size: var(--m);
    margin-bottom: 1rem;
  }

  p,
  h4 {
    font-size: var(--s);
    margin-bottom: 1rem;
  }

}

@media screen and (max-width: 767px) {

  .categories,
  .good-deals,
  .projects-cat,
  .projects,
  .brands {
    padding: 3rem 0;
  }

  /*****
    FONTS MOBILE
  */
  h1 {
    font-size: var(--xl);
  }
  h2 {
    font-size: var(--l);
    margin-bottom: 1rem;
  }
  p, h4 {
    font-size: var(--s);
    margin-bottom: 2rem;
  }


  /*
    BUTTONS MOBILE
  */
  .cta-white,
  .cta-dark {
    padding: 10px 20px;
    font-size: var(--xs);
  }
  .records .btn-ctr,
  .integration .btn-ctr {
    flex-direction: column;
    gap: 3rem;
  }
  .cart-img {
    height: 60px;
    width: 100%;
  }


  /*****
    HEADER MOBILE
  */
  .top-nav {
    height: 90px;
  }
  .navbar .container-fluid {
    display: flex;
    justify-content: end;
  }
  .navbar-collapse {
    text-align: end;
    padding: 10px;
  }
  .navbar,
  .top-nav,
  .show
  {
    background-color: rgba(0, 0, 0, 0.7);
  }
  .navbar-toggler {
    border: inherit;
  }
  .navbar-toggler-icon {
    background-image: url('../imgs/icons/noun-menu-white.svg');
  }
  .nav-link {
    font-size: var(--m);
  }
  .navbar .dropdown-menu li {
    text-align: end;
    font-size: 17px;
  }
  .audiopool-logo {
    width: 75px;
    position: absolute;
    top: 25px;
    left: 25;
  }
  .bg-body-transparent {
    background-color: transparent;
  }
  .top-nav-buttons {
    display: flex;
    flex-direction: column;
    gap: 0;
  }
  #music-icon {
    position: absolute;
    top: 25px;
    right: 25px;
  }
  .top-nav-info,
  .contact-info {
    display: none;
  }
  .play {
    display: none;
  }
  .cart-nav {
    position: absolute;
    top: 10px;
    right: 10px;
  }

  /**
    MOBILE INDEX HERO 
  */
  .hero-bg-vid,
  .short-desc-ctr,
  .swiper-text,
  .good-deals .col-md-12:first-child {
    display: none;
  }
  .home.hero .hero-bg-tablett {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .swiper-container,
  .swipper-wrapper {
    display: flex;
    justify-content: center;
  }
  .swiper-container {
    height: 80vh;
  }
  .swiper-slide {
    flex-direction: column-reverse;
    justify-content: center;
    align-items: center;
    gap: 1rem;
  }
  .slide-text-box {
    text-align: center;
    align-items: center;
  }
  .hero-product-img {
    width: 130px !important;
  }


  /******
    MOBILE INDEX CATEGORIES
  */
  .category-item {
    flex: 0 0 70%;
    /* Two columns on tablets and larger screens */
  }
  
  
  /***
    MOBILE INDEX GOODDEALS
  */
  .category-wrapper img {
    width: 270px;
    height: auto;
  }
  .gooddeals-png {
    display: none;
  }


  /***
    MOBILE INDEX RECORDS
  */
  .records .col-lg-5,
  .integration {
   padding: 2rem;
  }
  .records .col-lg-5 .btn-ctr,
  .integration .btn-ctr {
    text-align: center;
  }
  .integration-img {
    display: none;
  }

  
  /*+
    MOBILE INDEX INTEGRATION SECTION
  **/
  .integration img {
    display: none; 
  }


  /******
    MOBILE Rentals and SALES pages
  */
  .rentals.hero,
  .sales.hero,
  .record.hero,
  .projects.hero,
  .brands.hero,
  .contact.hero {
    margin-top: 90px;
    height: 30vh;
  }
  .h1-ctr h1 {
    padding-top: 0;
  }
  .short-desc,
  .short-desc-bg {
    display: none;
  }
  .mobile-nav {
    display: block;
    text-align: center;
  }
  .mobile-nav .slick-track {
    display: flex;
    align-items: center;
    width: 100% !important;
    gap: 1rem;
  }
  .desktop-nav {
    display: none;
  }
  .products-list {
    padding: 80px 20px;
  }
  .product-card-ctr {
    gap: 0.5rem;
  }
  .product-card {
    width: 80%;
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
  }
  .pc-img-box {
    width: 100%;
    height: auto;
  }
  .pc-body {
    height: 100%;
    display: flex;
    flex-direction: column;
  }
  .pc-content {
    display: flex;
    flex-direction: column;
    justify-content: center; 
  }
  .pc-cb-info h3 {
    font-size: var(--m);
  }
  .pc-cb-info h6 {
    font-size: var(--s);
  }
  .pc-data {
    display: none;
  }
  .pc-footer {
    height: 40%;
    justify-content: space-evenly;
  }
  .pc-footer input {
    width: 30%;
  }
  .product-info {
    padding: 0 2rem;
  }
  .product-img {
    height: 50%;
    height: auto;
  }
  .product-info input.quantity-input.form-control {
    width: 60px;
    height: 60px;
  }


  /***
    RECORDS AND PROJECTS PAGES MOBILE
  **/
  .record .short-desc,
  .projects .short-desc {
    display: none;
  }


  /*****
    CONTACT PAGE
  */
  .contact h2 {
    margin-bottom: 0.5rem;
  }
  .form-ctr,
  .info-ctr {
    padding: 1rem;
  }
  form .cta-ctr {
    display: flex;
    justify-content: center;
  }


  /****
    CART PAGE
  */
  .cart .table-responsive td:nth-child(2) {
    width: 100%;
  }
  .cart .table-responsive thead,
  .cart .table-responsive td:nth-child(3) {
    display: none !important;
  }
  .cart .table-responsive input {
    width: 50px;
  }


  /*******
  Footer
  */
  .footer {
    padding: 2rem;
    text-align: center;
  }
  .footer-img {
    width: 75%;
    height: auto;
    margin-bottom: 3rem;
  }
}

@media screen and (min-width: 768px) and (max-width: 1199px) {

  .top-nav {
    height: 110px;
  }
  .categories,
  .good-deals,
  .projects-cat,
  .projects,
  .brands {
    padding: 5rem 0;
  }

  /****
    FONTS ON TABLETT
  */
  h1 {
    font-size: var(--xxl);
  }

  h2 {
    font-size: var(--l);
    margin-bottom: 1rem;
  }

  p,
  h4 {
    font-size: var(--m);
    margin-bottom: 1rem;
  }

  /****
    NAVBAR TABLETT
  */
  .navbar .container-fluid {
    display: flex;
    justify-content: end;
  }
  .navbar-collapse {
    text-align: end;
  }
  .navbar {
    background-color: rgba(0, 0, 0, 0.5);
  }
  .navbar-toggler {
    border: inherit;
  }
  .navbar-toggler-icon {
    background-image: url('../imgs/icons/noun-menu-white.svg');
  }
  .nav-link {
    font-size: var(--m);
  }
  .audiopool-logo {
    width: 110px;
    position: absolute;
    top: 25px;
    left: 25;
  }
  .top-nav-buttons {
    display: flex;
    align-items: center;
    gap: 0;
  }
  .top-nav-info,
  .contact-info {
    display: none;
  }


  /****
    INDEX HERO SECTION TABLETT
  */
  .home.hero .hero-bg-tablett {
    display: none;
  }
  .swiper-container {
    height: 80vh;  
  }
  .swiper-slide {
    flex-direction: column-reverse;
  }
  .slide-img-box img {
    width: 40%;
  }
  .hero-product-img {
    width: 200px;
    margin-bottom: 1rem;
  }
  .hero .cta-ctr {
    padding-bottom: 20px;
  }
  .hero-btn {
    display: block;
  }
  .slide-text-box {
    align-items: center;
  }

  /****
    BUTTONS ON TABLETT
  */
  .cta-white,
  .cta-dark {
    padding: 10px 20px;
    font-size: var(--xs);
  }
  .category-item {
     flex: 0 0 40%;
     box-sizing: border-box;
     padding: 10px;
  }


  /*****
   INDEX GoodDeals SECTION
  */
  .good-deals .row {
    min-height: 250px;
  }
  .good-deals .col-lg-4, .col-lg-8 {
    display: flex;
  }
  .good-deals .col-lg-4 {
    align-items: center;
  }
  .good-deals .col-lg-8 {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
  }
  .gooddeals-png {
    position: absolute;
    left: 0;
    height: 350px;
    width: auto;
  }


  /****
    INDEX Integration SECTION
  */
  .integration img {
   right: -5%; 
  }


  /****
    INDEX RECORD SECTION
  */
  .records .col-sm-12 {
    padding: 1rem;
  }


  /*******
    RENTALS ANS SALES PAGE TABLETT
  */
  .rentals.hero,
  .sales.hero,
  .record.hero,
  .projects.hero,
  .brands.hero,
  .contact.hero {
    margin-top: 60px;
    height: 50vh;
  }
  .short-desc-bg {
    position: absolute;
    bottom: 0;
    right: 0;
    height: 130px;
  }
  .short-desc {
    bottom: 20px;
    right: 20px;
  }
  .short-desc {
    width: 300px;
  }
  .desktop-nav {
    display: block;
    text-align: center;
  }
  .mobile-nav {
    display: none;
  }
  .desktop-nav .navbar-nav{
    display: flex;
    flex-direction: row;
    column-gap: 2rem;
  }
  .product-card-ctr {
    padding: 2rem;
    gap: 0.5rem;
  }
  .product-card {
    width: 230px;
    margin-bottom: 1rem;
  }
  .pc-content-box {
    height: 150px;
    width: 230px;
  }
  .pc-data {
    display: none;
  }
  .pc-footer {
    justify-content: space-evenly;
  }
  .pc-footer input {
    width: 30%;
  }
  .product-info {
    padding: 0 2rem;
  }

  /****
    PROJECTS AND INTEGRATION PAGES TABLETT
  */
  .record .short-desc,
  .projects .short-desc {
    margin-top: 0;
    width: 300px;
  }

  /****
    CONTACT PAGE
  */
  .contact {
    padding: 2rem;
  }
  #contact_submit {
    margin-bottom: 3rem;
  }
  /*******
  Footer
  */
  .footer {
    padding: 2rem;
    text-align: center;
  }

  .footer img {
    width : 50%;
    height: auto;
    margin-bottom: 3rem;
  }
}

@media screen and (min-width: 1200px) {

  /****
  LAPTOP Fonts
  */
  h1 {
    font-size: var(--xxxl);
  }
  h2:not(.home.hero h2) {
    font-size: var(--xxl);
    margin-bottom: 2rem;
  }
  p, h4 {
    font-size: var(--m);
  }
  .categories,
  .good-deals,
  .projects-cat,
  .projects,
  .brands {
    padding: 7rem 0;
  }

  /****
    LAPTOP BUTTONS
  */
  .cta-white,
  .cta-dark {
    padding: 20px 40px;
    font-size: var(--s);
    margin: 10px;
  }


  /*****
    LAPTOP NAVIGATION
  */
  .top-nav {
    height: 110px;
  }
  .top-nav-buttons {
    display: flex;
    gap: 1rem;
  }
  .contact-info {
    display: flex;
    align-items: center;
    gap: 0.5rem;
  }
  .navbar-nav {
    gap: 1rem;
  }
  .nav-link {
    font-size: 20px;
  }
  .mobile-nav {
    display: none !important;
  }
  .desktop-nav {
    display: block;
  }
  

  /*****
    LAPTOP INDEX HERO
  */
  .home.hero .hero-bg-tablett {
    display: none;
  }
  .home.hero .hero-bg {
    display: block;
    background-size: cover;
  }
  .swiper-container {
    height: 80vh;
  }
  .slide-text-box {
    text-align: end;
    align-items: end;
  }
  .swiper-text {
    margin-bottom: 2rem;
    max-width: 500px;
    font-weight: bold; 
  }
  .hero-product-img {
    width: 300px;
    height: auto;
    margin-bottom: 1rem;
  }
  .hero-product-img:hover {
    cursor: pointer;
  }
  .hero-btn {
    display: none;
  }


  /***
    LAPTOP INDEX GOODDEALS
  */
  .category-wrapper img {
    width: 370px;
    height: auto;
  }
  .good-deals .row {
    min-height: 550px;
  }


  /***
    LAPTOP INDEX GOODDEALS
  */
  .gooddeals-png {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: auto;
  }


  /***
    LAPTOP INDEX RECORDS
  */
  .records .col-lg-5 {
    height: 700px;
    padding: 3rem;
  }
  .integration {
    height: 550px;
    padding: 5rem;
  }


  /****
    LAPTOP INDEX INTEGRATION SECTION
  */
  .integration img
  {
    right: 0;
  }


  /***
    LAPTOP RENTALS ANS SALES PAGES
  */
  .rentals.hero,
  .sales.hero,
  .record.hero,
  .projects.hero,
  .brands.hero,
  .contact.hero {
    margin-top: 110px;
    height: 50vh;
  }

  .short-desc-bg {
    position: absolute;
    bottom: 0;
    right: 0;
    height: 130px;
  }

  .short-desc {
    bottom: 20px;
    right: 20px;
  }

  /* Rental/Sales products cards */
  .rentals .short-desc,
  .sales .short-desc,
  .record .short-desc,
  .projects .short-desc {
    right: 20px;
    bottom: 20px;
  }
  .product-card-ctr {
    padding-top: 5rem;
    gap: 1rem;
  }
  .product-card {
    margin-bottom: 1rem;
    max-width: 15vw;
  }
  .pc-img-box {
    width: 100%;
    height: auto;
  }
  .product-content {
    min-height: 200px;
  }


  /***
    LAPTOP RECORDS AND PROJECTS PAGES
  */
  .project-img {
    width: 100%;
    height: auto;
    padding: 10px;
  }
  .record.intro {
    padding: 5rem;
  }
  .intro .img-box img:nth-child(2) {
    bottom: 10%;
    left: -8%;
  }
  .record .card-header img {
    width: 292px;
    height: 219px;
  }
  .calendar,
  .location {
    padding: 5px;
  }


  /****
    LAPTOP CONTACT PAGE
  */

  .contact h2 {
    margin-bottom: 2rem;
  }
  .form-ctr,
  .info-ctr {
    padding: 3rem;
  }


  /****
    LAPTOP CART PAGE
  */
  .cart .table-responsive input {
    width: 50px;
  }


  /***
    LAPTOP FOOTER
  */
  .footer-img {
    width: 75%;
    height: auto;
  }
}

@media screen and (min-width: 1900px) {
  .rentals .short-desc,
  .sales .short-desc,
  .record .short-desc,
  .projects .short-desc
  {
    right: 0;
    bottom: 40px;
  }

}