body{
  overflow-x: hidden;
  width: 100vw !important;
}

.navbar{
  height: 13% !important;
  width: 100vw !important;
}

.navbar.scrolled{
  height: 15% !important;
}

.overlay {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 10000;
  top: 0;
  left: 0;
  background-image: linear-gradient(90deg, #113f7c, #091f4e);
  overflow-x: hidden;
  transition: 0.5s;
}
  
  .container-navbar{
    margin-top: -45px !important;
    width: 100vw !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /*----------------ICONOS NAVBAR----------------*/

   /*---MENU OPEN---*/
  .open-menu{
    font-size: 13px;
    color: #fff !important;
    cursor:pointer;
    padding: 5px 40px;
    height: 40px;
    width: auto !important;
    margin-left: 2%;
    font-family: 'VWHeadLight';
    z-index: 1000;
  }

  .open-menu:hover{
    color: #50d1f1 !important;
  }

  .open-menu.scrolledp{
    color: #091e4d !important;
    transition: 0.2s ease;
  }

  .open-menu.scrolledp:hover{
    color: #1263e6 !important;
  }

  /*---BARS MENU OPEN---*/
  
  .icon-menu:before{
    font-size: 25px !important;
    margin-right: 15px;
    color: #ffffff !important;
  }

  .icon-menu:hover:before{
    color: #50def1 !important;
  } 

  .icon-menu.scrolledspan:before{
    color: #091e4d !important;
  }

  .icon-menu.scrolledspan:hover:before{
    color: #1263e6 !important;
  }

  /*---SEARCH

  .ico-search{
    padding-right: 80px;
    text-decoration: none !important;
  }

  .ico-lupa {
    fill:#ffffff;
    height: 25px;
    width: 25px;
  }

  .ico-lupa:hover {
    fill: #50def1 !important;
  }

  .ico-lupa g rect .scrolledtext {
    fill: #0d3677 !important;
  }

  .ico-lupa.scrolledtext:hover{
    fill: #1263e6 !important;
  }---*/

  /*---VOLKSWAGEN LOGO---*/

  .icon-logo-vw{
    text-decoration: none !important;
    cursor: pointer;
  }

  .icon-logo-vw:before{
    font-size: 80px;
    color: #ffffff;
  }

  .icon-logo-vw.scrolledtext:before{
    color: #091e4d;
  }

  .borde-navbar{
    height: 2px;
    background-color: #fff;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .borde-navbar.scrolleddiv{
    background-color: #091e4d;
  }

  #logoVW{
    transition: 0.5s;
  } 

  /*---BG NAVBAR---*/

  .bgcolor{
      background-color: transparent !important;
      transition: 0.2s ease;
  }

  .bgcolor.scrolled{
      background-color: transparent !important;
  }

  .bgcolor.scrolled{
    background-color: rgba(255, 255, 255, 0.95) !important;
  }

  /*----------------CONTENIDO SIDENAV----------------*/

  .overlay-content {
    font-family: 'VWHeadLight';
    position: relative;
    top: 12%;
    width: 100%;
    text-align: left;
    margin-top: 20px;
    margin-left: 10%;
  }

  .seccion-izq-overlay a {
    padding: 10px;
    text-decoration: none;
    font-size: 25px !important;
    color: #fff;
    display: block;
    transition: 0.3s;
    font-family: 'VWHeadLight' !important;
  }

  .seccion-der-overlay a {
    padding: 5px;
    text-decoration: none;
    font-size: 20px;
    color: #fff;
    display: block;
    transition: 0.3s;
    font-family: 'VWHeadLight' !important;
  }

  .borde-izq{
    border-left: 1px solid #fff;
    height: 70%;
    margin-top: 10%;
    padding-right: 50px;
}

  .seccion-der-overlay h6 {
    padding: 5px;
    text-decoration: none;
    font-size: 20px;
    color: #fff;
    display: block;
    transition: 0.3s;
    font-family: 'VWHeadRegular' !important;
  }

  .seccion-der-overlay p {
    padding: 5px;
    text-decoration: none;
    font-size: 18px;
    color: #fff;
    display: block;
    transition: 0.3s;
    font-family: 'VWTextlight';
  } 

  .bold{
    font-family: 'VWTextBold';
  }

  .img-seccion-der{
    height: 30% !important;
    width: auto;
    padding: 10px 0px;
}
  
  .closebtn {
    font-family: 'VWTextLight';
    position: absolute;
    top: 30px;
    left: 90px;
    font-size: 15px;
    text-decoration: none;
    color: #fff;
  }

  .closebtn img{
    height: 15px !important; 
    width: 15px !important;
    margin-right: 8px !important;
    transition: transform 0.4s ease-in-out;
  }

  @media screen and (max-height: 450px) {
    .overlay a {font-size: 20px}
    .overlay .closebtn {
    font-size: 40px;
    top: 15px;
    right: 35px;
    }
}

/*----------------TABLET HORIZONTAL (LG 1024px)----------------*/

@media (max-width:1199px) {

    .borde-izq{
        border-left: 1px solid #fff;
        height: 60%;
        margin-top: 10%;
        padding-right: 50px;
    }

    .seccion-izq-overlay a {
      padding: 15px;
      font-size: 30px;
    }  

    .seccion-der-overlay a {
      font-size: 18px;
    }
  
    .seccion-der-overlay h6 {
      font-size: 22px;
    }
  
    .seccion-der-overlay p {
      font-size: 15px;
    }

    .img-seccion-der{
      height: 30% !important;
    }

    .borde-izq{
        padding-right: 20px;
    }

    .icon-logo-vw:before{
      font-size: 70px;
    }

}

/*----------------TABLET VERTICAL (MD 768px)----------------*/

@media (max-width:991px) {
  .navbar.scrolled{
    height: 13% !important;
  }

  .overlay-content {
      top: 10%;
  }

  .open-menu{
      padding: 10px 70px;
  }

  .ico-search{
      padding-right: 70px;
  }

  .closebtn {
      left: 70px;
  }

  .seccion-izq-overlay a {
    padding: 8px !important;
    font-size: 30px;
  }

  .seccion-der-overlay a {
    font-size:22px;
  }

  .seccion-der-overlay h6 {
    font-size: 26px;
  }

  .seccion-der-overlay p {
    font-size: 22px;
  }

  .img-seccion-der{
    height: 50% !important;
  }

  .borde-izq{
      padding-right: 20px;
  }

  .icon-logo-vw:before{
    font-size: 80px;
  }


}

/*----------------MOVIL HORIZANTAL (SM 576px)----------------*/

@media (max-width:850px) {
    .open-menu{
        padding: 10px 30px;
      }

    .ico-search{
        padding-right: 30px;
    }

    .closebtn {
        left: 40px;
        font-size: 20px !important;
      }

    .overlay-content {
        top: 10%;
      }

    .seccion-izq-overlay a {
        padding: 8px;
        font-size: 25px;
    }

    .seccion-der-overlay a {
        font-size:18px;
      }
    
      .seccion-der-overlay h6 {
        font-size: 22px;
      }
    
      .seccion-der-overlay p {
        font-size: 18px;
      }

      .img-seccion-der{
        height: 30% !important;
    }

}

/*----------------MOVIL VERTICAL (SM 320px)----------------*/

@media (max-width:500px) {

  .icon-logo-vw:before{
    font-size: 60px;
  }

}