/*
Theme Name: Ascensores Clark
Theme URI: https://ascensoresclark.com/
Author: TiFactor
Author URI: https://tifactor.com/
Description: Tema de uso corporativo para la empresa Ascensores Clark
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ascensoresclark.com
*/
@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

body{
  --cp: #fc2439;
  --cph: #c81f30;
  --cs: #1a222f;
  --gris: #edf1f3;
  --tw: #ffffff;
  --tb: #1a222f;
  --black:#001;
  height: 100%;
  padding: 0;
  margin: 0;
  font-size: 24px;
  font-family: "Montserrat", sans-serif;
}

input:-webkit-autofill,input:-webkit-autofill:hover,input:-webkit-autofill:focus,input:-webkit-autofill,textarea:-webkit-autofill,textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,select:-webkit-autofill,select:-webkit-autofill:hover,select:-webkit-autofill:focus{-webkit-box-shadow:0 0 0px 0px rgba(0,0,0,0.8) inset;transition:background-color 5000s ease-in-out 0s;-webkit-text-fill-color:var(--cs);}
[type="radio"]:checked+span:after, [type="radio"].with-gap:checked+span:before, [type="radio"].with-gap:checked+span:after{border: 2px solid var(--cs);}
[type="radio"]:checked+span:after, [type="radio"].with-gap:checked+span:after { background-color: var(--cs);}

.bgcp{background-color: var(--cp);color: var(--tw);}
.bgcs{background-color: var(--cs);color: var(--tw);}

.bgcp:hover,.bgcp:active,.bgcp:focus{background-color: var(--cph);color: var(--tw);}
.bgcs:hover,.bgcs:active,.bgcs:focus{background-color: var(--cs);}
*[class^="tw"]{color:var(--tw)}
*[class^="tcp"]{color: var(--cp);}
*[class^="tcs"]{color: var(--cs)}
.tcp5,.tcs5{font-weight: 500;}
.tcp7,.tcs7{font-weight: 700;}
.tw4{font-weight: 400;}
.tw5{font-weight: 500;}
.tw7{font-weight: 700;}
section{padding: 4rem 0;font-weight:300;}

p, ul li, ol li{font-size: 1rem;line-height: initial;font-weight: 300;}
a.btn, a.btn-large{font-weight: 500;font-size: 1.1rem;color: var(--tw);font-weight: 500;}
a.btn-large{line-height: 3.9rem;}
a.btn i{font-size: 1rem;margin-left: .4rem;margin-right: 0;}
input.bgcp:focus{background-color: var(--cp);}
ul.checked li, ul.plus li, ul.check{display: flex;align-items: center;margin: .3rem 0;}
ul.checked li:before{font-family: 'icomoon';margin-right: 1rem;vertical-align: middle;color: var(--cs);content: "\e902";font-size: 1rem;color: var(--cp);}
ul.plus li:before{font-family: 'icomoon';margin-right: 1rem;vertical-align: middle;color: var(--cs);content: "\e901";font-size: 1rem; color: var(--cp);}
ul.check li:before{font-family: 'icomoon';margin-right: 1rem;vertical-align: middle;color: var(--cs);content: "\e908";font-size: 1.3rem; color: var(--cp);}
#formulario{background-color: var(--cs);color: var(--tw);}
#formulario h2{/* color: var(--tw); */margin-bottom: 3rem;}
#form-cotiza .saludo{margin-bottom: 1.5rem;font-size: 1rem;}
.input-field>label{color: var(--tw);}
#form-cotiza input, #form-cotiza textarea {color: var(--tw);font-size: 1rem;font-weight: 500;}
#form-cotiza .l-captcha .l8 .l4{padding: 0;}
#form-cotiza .lv-cp{font-weight: 700;color: var(--tw);font-size: 1.2rem;margin-bottom: .5rem;}
.datepicker-calendar input{color: var(--tw);}
.datepicker-calendar svg{fill: var(--tw);}
.l-captcha i{padding: 0;}
#formulario #formsend{cursor: pointer;color: var(--tw);padding: 1rem 2.5rem;font-size: 1.2rem;}
.grecaptcha-badge{display: none !important;}
.enviando{width: 200px;background-color: #d1f4fd !important;color: #30394f !important;    display: flex; align-items: center;  width: 260px;}
.enviando .preloader-wrapper{margin-right: 1rem;}
.spinner-white{ border-color: var(--tw);}
.parallax-container{z-index: 0;}
.modal{ width: 65%; max-height: 800px; top: 10% !important; background-color: rgba(0,0,0,.8); max-height: 100%; color: var(--tw); padding: 0; border: 1px solid rgba(255,255,255,.1);
  }
#wrap-video i{ transform: rotate( 180deg );  -webkit-transform: rotate( 180deg); display: block; margin: 0; color: var(--tw); position: absolute;  top: 32px;  left: 35px;
      font-size: 1.5rem;padding: 0;}
.owl-carousel{z-index: 0;}
.owl-theme .owl-nav {margin-top: 10px;text-align: center; -webkit-tap-highlight-color: transparent;}
.owl-theme .owl-nav [class*="owl-"] { color: #fff; font-size: 14px; margin: 5px;padding: 4px 7px; background: var(--sky);display: inline-block;cursor: pointer; border-radius: 3px;}
.owl-theme .owl-nav [class*="owl-"]:hover {color: var(--cp);text-decoration: none;}
.owl-theme .owl-nav .disabled { opacity: 0.5; cursor: default;}
.owl-theme .owl-nav.disabled + .owl-dots {margin-top: 50px;}
.owl-theme .owl-dots { text-align: center; -webkit-tap-highlight-color: transparent;}
.owl-theme .owl-dots .owl-dot {display: inline-block;zoom: 1; display: inline;}
.owl-theme .owl-dots .owl-dot span {width: 50px;height: 8px;margin: 5px 7px;background:var(--sky);display: block;-webkit-backface-visibility: visible;transition: opacity 200ms ease;border-radius: 30px;background-color: #c5c2c2;}
#clientes .owl-theme .owl-dots .owl-dot span{width: 14px; height: 14px;}
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span { background-color: var(--cp);}
.preloader-background{display:flex;align-items:center;justify-content:center;background-color: transparent;position:fixed;z-index:9999999;top:0;left:0;right:0;bottom:0;height: 5px;}
.preloader-box{position: absolute;top: 0;width: 100%}
.preloader-box .progress{width: 100%;margin: 0;z-index: 2;overflow: visible;}

.main-header{height: 130px;position: relative;z-index: 2;/* background-color: var(--cs); */}
.single .main-header,.page-id-883 .main-header, .page-id-886 .main-header, .search .main-header{background-color: var(--cs);}

.home .main-header,.page-id-704 .main-header,.page-id-706 .main-header,.page-id-709 .main-header,.page-id-711 .main-header,.page-id-713 .main-header,.page-id-716 .main-header,.page-id-718 .main-header, .page-id-722 .main-header  {background-color: transparent;}
.main-header .container, .container{width: 90%;max-width: 90%;}

.main-header i{color: var(--cp);font-size: 1.4rem;}

nav{box-shadow:none;background: transparent;}
nav .nav-wrapper{height: 90px;}
nav .row .col{padding: 0;}
.wrap-menu{display: flex;justify-content: space-between;padding-top: .5rem}
.wrap-menu .box-menu-header div{font-size: 1.2rem;font-weight: 300;margin-right: 1.2rem;}
.welcome{padding: 1.5rem .8rem;text-align: center;height: 55px;line-height: 0;position: relative;}
.welcome a{display: block;text-align: left;}

nav .menu-top{display: flex;justify-content: space-between;height: 30px;align-items: center;}

.fixed-menu{
  background-color: var(--black);
  position: fixed;
  z-index: 999;
  top: 0;
  width: 100%;
  padding: 0;
  padding: 0;
  height: 85px;
  border-bottom: 1px solid  rgba(0,0,0,.1);
  -webkit-box-shadow: 0 0px 0px 0 rgb(0 0 0 / 14%), 0 0px 0px -1px rgb(0 0 0 / 12%), 0 0px 5px 0 rgb(0 0 0 / 20%);
  box-shadow: 0 0px 0px 0 rgb(0 0 0 / 14%), 0 0px 0px -1px rgb(0 0 0 / 12%), 0 0px 5px 0 rgb(0 0 0 / 20%);
  transition: all 1s;
  border-bottom: 1px solid rgba(0,196,242,.3)
  }
  .fixed-menu .box-menu-header{height: 50px;}
  .fixed-menu .welcome{height: 60px;padding: .45rem 0 0 0;}
  .fixed-menu .welcome img{width: 40%;}
  .fixed-menu .menu-main li a{line-height: 1.5rem;}


 nav ul a{color: var(--tw);}
 nav ul.menu-main li a:hover, nav ul.menu-main li a.active { border-bottom: 4px solid var(cp); transition: all .2s;}
 nav ul.menu-main li .dropdown-content a:hover, nav ul.menu-main li .dropdown-content .a.active { border-bottom: 0;background-color:  rgba(82,143,65,.4); transition: all .2s;}
 nav.fixed-menu ul.menu-main li a:hover, nav.fixed-menu ul.menu-main li a.active {height: 52px;}

.home nav ul a{color: var(--tw);}
nav.fixed-menu ul a{color: var(--tw);}

nav i{font-size: 1rem;height: initial;margin-right: .5rem;}
nav .menu-top{border-bottom: 1px solid rgba(255,255,255,.5);}
nav ul.social-menu li{line-height: 0;}
nav ul.social-menu li a{color: var(--tw);}
nav ul.social-menu li a i{display: block;font-size: 1.2rem;}
nav ul.social-menu li:hover i{transform: scale(1.2); transition: 1s ease;color: var(--cp);}
nav .contacto-lang{display: flex;align-items: center;}

nav ul.ct li:first-child{border-right: 1px solid rgba(255,255,255, .4);}
nav ul.ct li{font-size: 1rem;margin: 0 1rem;line-height: 2.5rem;}
nav ul.ct li a{color: var(--tw);display: inline-block;padding: 0 1rem;}

nav .box-menu-header {display: flex;justify-content: flex-end;align-items: center;}
nav .menu-main li {position: relative;    margin: 0 0.5rem;}
nav .menu-main li .dropdown-content li{ margin: 0;}
ul.menu-main li a {padding: .5rem 1rem;font-size: 1rem;height: 55px;line-height: 2.8rem;font-weight: 300;}
.fixed-menu ul.menu-main li a{height: 55px;}
ul li a.dropdown-trigger{padding: .5rem 2.4rem;line-height: 2.8rem;}
ul.menu-main .dropdown-content li a{padding: .5rem 1rem;height: auto;}
ul.menu-main li a:hover,ul.menu-main li a.active{border-bottom: 5px solid var(--cp);}

nav .menu-main+a{height: 40px;line-height: 2.9rem;margin-left: 1rem;}
nav .menu-main+a i{color: var(--cs);font-size: 1.3rem;/* font-weight: 500; */}
#menu-servicios li a{line-height: 2rem;height: 68px;}
ul.menu-main li a.dropdown-trigger:after { content: ""; position: absolute; width: 0;  height: 0;  top: 45%;  right: 5px;  border-left: 5px solid transparent;  border-right: 5px solid transparent;
  border-top: 6px solid var(--tw);}
  ul.dropdown-content {width: 350px !important;top: 75px !important;background-color: rgba(0,0,0,0.8);overflow: hidden;}
  ul.dropdown-content li a:hover,
  .select-dropdown.dropdown-content li:hover{background-color: var(--cs);}
  
.fixed-menu ul.dropdown-content{top: 70px !important;}
.dropdown-content li>a, .dropdown-content li>span{color: var(--tw);}

.bg-cover{background-size: cover;height: 95vh;}
#home-cover{background-image: url('assets/images/bg-cover.webp');margin-top: -130px;height: 102vh;}
#nosotros-cover{background-image: url('assets/images/bg-nosotros.webp');margin-top: -130px;height: 70vh;}
#contacto-cover{background-image: url('assets/images/bg-contacto.webp');margin-top: -130px;height: 40vh;}
#bg-contacto{background-image: url('images/bg-contacto.webp');margin-top: -130px;height: 70vh;}

.bg-cover .container{width: 90%;max-width: 90%;margin-top: 12rem;position: relative;}
.bg-secciones{margin-top: 10px;}
.bg-cover .cover-content{width: 45%;position: relative;color: var(--tw);}
.bg-cover .cover-content .tcp5{font-size: 1.6rem;}

.bg-cover .cover-content h1{font-size: 6rem;font-weight: 700;margin-top: 0;}
.bg-cover .cover-content p{font-size: 1.2rem;}
.bg-cover .cover-content .btn-large i{font-size: 3rem; margin-left: 0;  margin-right: 0.5rem;text-align: center;}


#productos-destacados .pd{display: flex;flex-wrap: wrap;align-items: c;}
#productos-destacados .pd article{width: 18%;margin: 1.5rem 1%;}

#productos-destacados figure{overflow: hidden;/* background-color: var(--cs); */margin: 0;}
#productos-destacados .pd-title{color: var(--tb);font-size: 1.2rem;font-weight: 400;}
#productos-destacados figcaption+a{opacity: 0;}

#productos-destacados figure img{
  width: 100%;
  max-width: none;
  width: -webkit-calc(100% + 20px);
  width: calc(100% + 20px);
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(-10px,0,0);
  transform: translate3d(-10px,0,0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
#productos-destacados figure:hover{background-color: rgba(0,0,0,0.4);transition: all;}
#productos-destacados figure:hover img{opacity: 0.6;-webkit-transform: translate3d(0,0,0);transform: translate3d(0,0,0);}
#productos-destacados figure figcaption{
  margin-top: 1.5rem;
  position: relative;
  }


#productos-destacados figure a.btn-large{
  opacity: 0;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  -webkit-transform: translate3d(0,-150%,0);
  transform: translate3d(0,-120%,0);
  }

#productos-destacados figure:hover a.btn-large{
    opacity: 1;
    -webkit-transform: translate3d(0,-150%,0);
    transform: translate3d(0%,-340%,0);
}

#categorias{background-color: var(--cs); background-image: url('assets/images/bg-categorias.webp');  background-position: left bottom ; background-repeat: no-repeat; color: var(--tw);}
#categorias .w-lista-categorias{display: flex;flex-wrap: wrap; justify-content: space-around;align-items: flex-start;}
#categorias article{display: flex;flex-wrap: wrap;justify-content: space-between;align-items: flex-start;width: 31%;margin: 1.5rem 1%;}
#categorias article h3{width: 100%;}


#categorias article h3+div{width: 45%;margin-right: 2%;}
#categorias article .lista-categorias{width: 50%;}

#categorias article img{width: 100%;height: auto;/* display: block; */}
#categorias article img+a{display: block;width: 100%;}
#categorias article ul{margin: 0;}
#marcas{background-color: var(--gris);}
#marcas .row:first-of-type +.row{display: flex;flex-wrap: wrap;justify-content: space-around;}
#marcas article, #marcas article img{border-radius: 12px;}
#marcas article{width: 23%;margin: 2rem 1%;font-size: 0;position: relative;}
#marcas article:hover{
  -webkit-box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.14), 0 4px 4px -6px rgba(0, 0, 0, 0.12), 0 4px 18px 0 rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.14), 0 4px 4px -6px rgba(0, 0, 0, 0.12), 0 4px 18px 0 rgba(0, 0, 0, 0.2); transition: all;
  }
  #marcas article img{width: 100%;height: auto;}
#marcas article a{border-radius: 50%;/* display: none; */}

#marcas article a{
  position: absolute;
  bottom: 42px;
  right: 22px;
  height: 57px;
  width: 57px;
  line-height: 57px;
  text-align: center;
  border-radius: 50%;
  color: #fff;
  font-size: 20px;
  -webkit-transition: 1s;
  -o-transition: 1s;
  transition: 1s;
  opacity: 0;
  -webkit-transform: scale(.5);
  -ms-transform: scale(.5);
  transform: scale(.5);
}
#marcas article:hover a {
  opacity: 1;
  -webkit-transform: scale(1) rotate(360deg);
  -ms-transform: scale(1) rotate(360deg);
  transform: scale(1) rotate(360deg);
}
#marcas article .btn:hover::after{display: none;}
#marcas article .btn:hover i{color: var(--tw);}
/*#cta{background-color: var(--cp);background-image: url('assets/images/bg-cta.jpg');background-position: top right;background-repeat: no-repeat;color: var(--tw);background-size: contain;}*/
#cta{background-image: url('assets/images/bg-cta.jpg');color: var(--tw);background-size: cover;}
#cta .container, #formulario .container, #clientes .container, #footer .container, #nosotros .container{width: 70%;max-width: 70%;}
#cta .col+.col div{margin: 3rem 0 1rem 0;}
#why ul{display: flex; justify-content: space-around;flex-wrap: wrap;counter-reset: contador}
#why ul li{margin: 1.5rem 0;text-align: center;position: relative;}
#why ul li:before{content: counter(contador);counter-increment: contador;width: 35px;height: 35px;background-color: var(--cp);color: var(--tw);border-radius: 50%;line-height: 2.3rem;font-size: 1.2rem;flex-shrink: 0;display: block;position: absolute;left: -15px;top: 26%;}
#why ul li:hover:before{background-color: var(--cs);color: tw;}

#why ul li i{background-color: var(--cs);padding: 2rem 6rem;color: var(--tw);display: inline-block;font-size: 5.5rem;}
#why ul li:hover i{background-color: var(--cp);  transition: all .8s;}
#why ul li:hover i{color: var(--tw);}
#why ul li p{font-size: 1.4rem;}
#why ul li:hover p{color: var(--tb); transition: all .8s;}
#clientes{background-color: var(--gris);}
#clientes h2{margin-bottom: 4rem;}
#clientes .owl-theme .owl-dots .owl-dot span { width: 80px; height: 8px; border-radius: 0;}
.whatsappchat {position: fixed;bottom: 20px;right: 20px;display: block;z-index: 999!important;animation-name:pulse_whatsapp;animation-duration: 1.5s;
  animation-timing-function: ease-out;  animation-iteration-count: infinite;border-radius: 50%;-webkit-border-radius:50%}
  @keyframes pulse_whatsapp{0%{box-shadow:0 0 0 0 rgba(37,211,102,1)}80%{box-shadow:0 0 0 14px transparent}}
.whatsappchat a {width: 55px;height: 55px;background: #51c14f;display: block;border-radius: 50%;text-align: center;}
.whatsappchat a i {font-size: 2.5rem;color: var(--tw);line-height: 3.87rem;margin: 0;border-radius: 50%;padding: 0;text-align: center;}
#footer{background-color: var(--cp);color: var(--tw);}
#footer .container{padding-top: 4rem;}
#footer h2{margin-top: 0;}
#footer ul li{display: flex;margin: 1rem 0; align-items: center;}
#footer ul li strong{display: block;}
#footer ul li a, #footer ul li div{color: var(--tw);margin-left: .5rem;}
.pie{margin-bottom: 0;border-top: 1px solid rgba(255,255,255,.3);}
.pie .col:nth-of-type(2){display: flex; align-items: center;justify-content: space-around;}
.pie ul {display: flex;justify-content: space-around;}
#footer .pie ul li {margin: 0 .5rem;}
#footer p, #footer div,  #footer li{font-size: 1.2rem;}
.pie .col:last-of-type{text-align: right;}

a.btn{height: 40px;}
.btn-large, a.btn, button.btn-large{position: relative;z-index: 0;/* border-radius: 4px; */}
.btn-large:hover,.btn:hover{color: var(--cp);font-weight: 700;}

.btn-large:after,
.btn:after{content: "";position: absolute;right: -2px;width: 0;height: 100%;background-color: var(--tw);transition: all .3s ease 0s;z-index: -1;border-radius: 2px;}
button.btn-large:after{z-index: -1;}

.btn-large:hover:after,
a.btn:hover:after,
a.btn:hover i{width: 100%;color: var(--cp);left: 0;/* height: 100%; */}
#nosotros .col +.col{padding-left: 4rem;}
#nosotros ul{margin-top: 0;}
#nosotros ul h3{margin-top: 1rem;}
#nosotros img{width: 100%;}
#contactanos ul{display: flex;justify-content: space-around;margin-top: 6rem;}
#contactanos ul li h3{font-weight: 700;}
#contactanos ul li a, #contactanos ul li p{color: var(--cs);font-weight: 500;}
#contactanos ul li i{font-size: 5rem;color: var(--cp);}
.grecaptcha-badge{display: none !important;}
.enviando{background-color: #f98893 !important;color: #eddede !important;display: flex;align-items: center;width: 260px;}
.enviando .preloader-wrapper{margin-right: 1rem;}

#btn-enviar.enviando{width: 280px;}
#btn-enviar::after{display: none;}
#btn-enviar:hover{color: var(--tw);}
.spinner-white{ border-color: var(--tw);}
.page-template-gracias .main-header,.error404 .main-header{background-color: var(--cs);}
#bg-gracias .row{margin-bottom: 3rem;}
#bg-gracias h1,#page-404 h1{color: var(--tb);}
#bg-gracias h1 i{display: block;  margin: 2rem 0;  font-size: 5rem;}
#page-404{padding-bottom: 0;}
.s-head.bg-cover{height: initial;}
.s-head.bg-cover .container{margin-top: 0;}
.error-404{padding-top: 0;}
.error-404 .page-content{text-align: center;}

#delivery{width: 100%; background: linear-gradient( 115deg, #ff1635 50%, #e30613 50%);color: var(--tw);position: relative;}
#delivery ul{display: flex;}
#delivery ul li{width: 30%; text-align: center;margin: 1rem 1.3%;}
#delivery ul li i{font-size: 5rem; color: var(--tw);}
#delivery ul li h4{font-size: 1.4rem;font-weight: 700;}
#delivery a.btn-large{background-color: #70a83b;color: var(--tw);}
#delivery a.btn-large:hover{color: var(--cp);}
#delivery img{position: absolute;left: 5px;bottom: 0; width: 28%;}

/*****************150%*******************/
@media screen and (max-width: 1440px){
  body{
    font-size: 18px;
  }
  [type="radio"]:not(:checked)+span, [type="radio"]:checked+span{font-size: .8rem;}
  h2 {font-size: 2.1rem;}
  p, ul li, ol li{font-size: .8rem;}
  a.btn{font-size: .7rem;height: 24px;line-height: 1.6rem;padding: 0 1rem;}
  a.btn-large{font-size: .7rem;height: 40px;line-height: 2.5rem;padding: 0 1rem;}
  
  nav ul a{font-size: .8rem;}
  nav i{font-size: .7rem;}
  nav .welcome img{width: 70%;}
  .fixed-menu{height: 80px;}
  nav ul.social-menu li a i, .main-header i, .fixed-menu ul.social-menu li a i,.main-header .fixed-menu i{font-size: 1rem;}
  
  .fixed-menu .welcome img{width: 70%;}
  .fixed-menu ul.menu-main li a{line-height: 2.5rem;}
  ul.menu-main li a{font-size: .8rem;}
  ul.menu-main .dropdown-content li a { padding: 0 1rem;   height: auto;}
  ul.menu-main li a.dropdown-trigger:after {content: ""; top: 45%; right: 15px;border-left: 4px solid transparent; border-right: 4px solid transparent;border-top: 4px solid var(--tw);}
  nav .menu-main+a {  height: 32px;  line-height: 2.2rem;   margin-left: 1rem;}
  .bg-cover .container {width: 100%;max-width: 88%;margin-top: 7rem;}
  #home-cover .container{margin-top: 9rem;}
  .bg-cover .cover-content h1 {font-size: 2.5rem;font-weight: 700;margin-top: 0;}
  .bg-cover .cover-content p{font-size: .95rem;margin-bottom: 1.4rem;}
  
  #productos-destacados .pd-title{font-size: 1rem;}
  #why ul li i{padding: 2rem 3.6rem;margin-right: 0;}
  #why ul li p {font-size: 1.1rem;}
  #btn-enviar{width: 280px;}
  #footer p, #footer div, #footer li{font-size: .9rem;}
  #footer img{width: 90%;}
}
/**********************************************SMARTPHONE***************************************************/
@media screen and (max-width:360px) {

  }

@media screen and (min-width:320px) and (max-width:480px){
h1{font-size: 1.8rem;}
h2{font-size: 1.6rem;line-height: initial;}
h3{font-size: 1.6rem;}
p, ul li, ol li{font-size: 1.1rem;}
a.btn, a.btn-large{font-size: 1.1rem;/* padding: 1.8rem 2rem; *//* line-height: .5rem; */}
#categorias a.btn-large{padding: 1rem 0;line-height: .9rem;}
h2+p.center{width: 100%;/* color: var(--tw); */font-weight: 500;}
.modal{width: 100%;height: auto;}
#slide-out{z-index: 9999;}
.sidenav .collapsible-header:hover, .sidenav.fixed .collapsible-header:hover, .sidenav li>a:hover {background-color: var(--cp); color: var(--tw);}
#slide-out > li:first-child {padding: 1rem 0.3rem 2rem 1rem;background: var(--cs);margin-bottom: 0;border-bottom: 3px solid var(--cp);/* margin: 0; */}
#slide-out > li:first-child a{padding: 0;}
#slide-out > li:first-child img{margin-top: .5rem;width: 50%;}
.collapsible-body ul{background-color: #f1f1f1;}

.sidenav ul.collapsible>li:first-of-type {margin-top: 1rem;}
ul.collapsible li a.collapsible-header{padding: 0 2.5rem;}
#slide-out ul.collapsible li.active>a {background-color: var(--cp1);color: var(--tw);}
#slide-out ul.collapsible li a.collapsible-header:after { content: ""; position: absolute; width: 0; height: 0; top: 40%; right: 25px; border-left: 5px solid transparent; border-right: 5px solid transparent;
  border-top: 6px solid #333;}
#slide-out ul.collapsible li.active a.collapsible-header:after { border-top: 6px solid #fff;}
.sidenav li>a{font-size: 1.2rem;}
.show-btn{display: block!important;}
.main-header{height: 64px;}
.fixed-menu{ height: 65px;}
.fixed-menu .menu-top{height: 0;}
nav .nav-wrapper{height: 60px;}
nav .menu-top, nav .box-menu-header div,nav .contacto-lang{ display: none; }
.welcome{line-height: 2rem;height: 55px;padding: 1rem 0;text-align: left;width: 50%;}
.fixed-menu .welcome{padding: .5rem;}
.fixed-menu .welcome img {width: 110%;}
nav .welcome img {width: 100%;}
.welcome a{width: 100%;display: initial;padding-left: 0;}
nav .box-menu-header a{display: none;}
.btn-fixed-menu a.btn-floating{border-radius: 0;background-color: var(--cp);text-align: center;width: 45px;height: 40px;line-height: 2.9rem;box-shadow: none;/* padding: .5rem; */display: block;position: relative;}
.btn-fixed-menu a.btn-floating i{margin: 0;line-height: 2.7rem;color: var(--tw);font-size: 2rem;}
.call{position: fixed;top: 2px;right: 6rem;z-index: 999999999;color: var(--tw);width: 50px;height: 50px;padding: .5rem;line-height: 3.5rem;/* font-size: 1rem; */}
.call i{color: var(--tw);font-size: 2rem;}
.fixed-menu .call i{color: var(--tw);font-size: 2rem;}
.btn-fixed-menu {position: fixed;top: 14px;right: 18px;z-index: 999;}

.bg-cover{height: 100vh;margin-top: -64px !important;background-size: cover;/* background-position: top; */background-repeat: no-repeat;}
#home-cover{background-image: url('assets/images/bg-cover-s.webp');}

#nosotros-cover{background-image: url('assets/images/bg-nosotros-s.webp');margin-top: -130px;height: 60vh;background-size: cover;}
#contacto-cover{background-image: url('assets/images/bg-contacto-s.webp');margin-top: -130px;height: 60vh;background-size: cover;}

#gracias{background-image: url('assets/images/bg-gracias-s.webp');}

.bg-cover .container{position: unset;}
.bg-cover .cover-content{position: absolute;width: 90%;bottom: 2rem;}
#nosotros-cover .cover-content,
#contacto-cover .cover-content{bottom: 25rem;}
.bg-cover .cover-content h1{margin-top: 0;font-size: 1.8rem;margin-bottom: .5rem;/* padding-left: 2.2rem; */padding-top: 0;}

.bg-cover .cover-content p {width: 100%;padding-left: 0rem;margin-bottom: 1rem;font-size: 1rem;}
#home-cover .cover-content p{margin-bottom: 2rem;}

#cta .container, #formulario .container, #footer .container, #nosotros .container{width: 90%;max-width: 90%;}
#productos-destacados .pd article, #categorias article{width: 100%;/* margin: 1rem 1%; */}
#productos-destacados .pd article{margin: 1rem 0;}
#categorias article h3{font-size: 1.3rem;}
#marcas article{width: 100%;margin: 1rem 0;}
#cta{background-color: var(--cs);background-image: none;}
#cta a.btn-large{width: 100%;}
#why ul li{width: 48%;margin: 1rem 1%;}
#why ul li:before{left: -6px;}
#why ul li i {padding: 2rem;}
#clientes h2{font-size: 1.5rem;}
#formulario h2{font-size: 1.8rem;}
#footer p, #footer div, #footer li{font-size: 1rem;}
.pie .col:last-of-type{text-align: center;}
#nosotros .col +.col { padding-left: 0;}
#contactanos ul{display: block;}
#contactanos ul li{margin: 5rem 0;}


#delivery ul{flex-direction: column;}
#delivery ul li{width: 100%; text-align: center;margin: 1rem 0;}
#delivery img{position: relative; width: 100%}
}

/*******************************TABLET*******************************/
@media screen and (max-width: 768px) and (min-width: 480px){
  h1{font-size: 2.8rem;}
  h2{font-size: 2.5rem;line-height: initial;}
  h3{font-size: 1.8rem;line-height: initial;}
  p, ul li, ol li {font-size: 1.6rem;line-height: initial;}
  a.btn, a.btn-large{font-size: 1.2rem;height: 50px;line-height: 3.5rem;}

  .modal{width: 90%;height: 45%;}
  nav .contacto-lang ul.ct li:first-child{display: none;}
  nav .contacto-lang li{position: absolute;top: 2rem;right: 9rem;/* font-size: 1.6rem; */}
  .fixed-menu{height: 80px;}
  .sidenav{width: 450px;}
  .sidenav li{margin: 1.5rem 0;}
  .sidenav>li+li{margin-top: 0;}
  .sidenav ul.collapsible>li:first-of-type{margin-top: 2rem;}
  .sidenav li>a{font-size: 1.6rem;}
  #slide-out > li:first-child {padding: 1rem 0.3rem 4rem 1rem;background: var(--cs);margin-bottom: 0;border-bottom: 6px solid var(--cp);margin: 0;}
  #slide-out ul.collapsible li.active>a {background-color: var(--cp1);color: var(--tw);padding: 1rem 2.5rem;}
  /* #slide-out > li:first-child {padding: 2.5rem 0 3.5rem 2rem;background: var(--cp);margin-bottom: 3rem;margin-top: 0;} */
  #slide-out > li:first-child img { margin-top: 0.5rem;  width: 50%;}
  #slide-out > li:first-child a{ padding: 0;}
  .collapsible-body ul{background-color: #f1f1f1;}
  .collapsible-body ul li:last-child a{line-height: 1.5rem;}
  ul.collapsible li a.collapsible-header{padding: 1rem 2.5rem 0 2.5rem;}
  #slide-out ul.collapsible li a.collapsible-header:after { content: ""; position: absolute; width: 0; height: 0; top: 40%; right: 25px; border-left: 5px solid transparent; border-right: 5px solid transparent;
    border-top: 6px solid #333;}
  #slide-out ul.collapsible li.active a.collapsible-header:after { border-top: 6px solid #fff;}
  .input-field>label{font-size: 1.2rem;}
  .main-header{height: 90px;}
  .main-header i{font-size: 1.8rem;}
.fixed-menu{height: 80px;}
.fixed-menu .menu-top{height: 0;}
nav .box-menu-header div{display: none;}
.box-menu-header a{width: 120px; height: 50px; line-height: 3.4rem; font-size: 1.4rem;}
nav .menu-top{display: none;}
ul.social-menu{display: none;}

nav .contacto-lang li a{font-size: 1.6rem;}
.menu-top .lg{position: absolute;top: 32px;left: initial;right: 18%;}
.menu-top .lg img{width: 25px !important;height: 18px!important;}
.welcome{line-height: 5.5rem;height: 80px;padding-left: 0;}
.welcome{line-height: 2rem;height: 55px;padding: 1rem 0;text-align: left;width: 32%;}
.fixed-menu .welcome{padding: 1.3rem 0;}
.fixed-menu .welcome img {width: 65%;}
.welcome a{width: 100%;display: initial;padding-left: 0;}
nav .box-menu-header a{display: none;}
.btn-fixed-menu a.btn-floating{border-radius: 0;background-color: var(--cs);text-align: center;width: 40px;height: 35px;line-height: 0rem;/* color: var(--cp); */}
.btn-fixed-menu a.btn-floating i{margin: 0;line-height: 2.7rem;color: var(--tw);}
.call{position: fixed;top: 14px;right: 5.8rem;z-index: 999999999;color: var(--tw);width: 50px;height: 50px;padding: .5rem;line-height: 2.5rem;/* font-size: 1rem; */}
.call i{color: var(--tw);font-size: 1.8rem;}
.fixed-menu .call i{color: var(--cp);}
.btn-fixed-menu {position: fixed;top: 18px;right: 25px;z-index: 999;}
.btn-fixed-menu a.btn-floating{border-radius: 0;background-color: transparent;text-align: center;width: 40px;height: 35px;line-height: 0rem;box-shadow: none}
.btn-fixed-menu a.btn-floating i{margin: 0;line-height: 2.7rem;color: var(--tw);font-size: 1.9rem;}
.bg-protax,#bg-blog,#bg-categoria{position: relative;height: 60vh;}
.bg-cover{height: 100vh;margin-top: -90px !important;background-size: cover;background-position: top;background-repeat: no-repeat;}
#home-cover{background-image: url('assets/images/bg-cover-s.webp');margin-top: -64px;}
#nosotros-cover{background-image: url('assets/images/bg-nosotros-s.webp');margin-top: -130px;height: 60vh;background-size: cover;}
#contacto-cover{background-image: url('assets/images/bg-contacto-s.webp');margin-top: -130px;height: 60vh;background-size: cover;}

#gracias{background-image: url('assets/images/bg-gracias-m.webp');}


.bg-cover .container{position: unset;}
.bg-cover .cover-content{position: absolute;width: 85%;bottom: 5rem;}
#nosotros-cover .cover-content,#contacto-cover .cover-content{position: absolute;width: 85%;bottom: 35rem;}

.bg-cover h1{margin-top: 0;font-size: 3.2rem;margin-bottom: .5rem;/* padding-left: 2.2rem; */padding-top: .9rem;}
.bg-cover .cover-content .tcp5{font-size: 2.2rem;}
.bg-cover .cover-content h1{font-size: 3.5rem;}
.bg-cover .cover-content p {width: 100%;/* padding-left: 0rem; */margin-bottom: 1rem;font-size: 1.4rem;}
#home-cover .cover-content p{margin-bottom: 2rem;}
#productos-destacados .pd article{width: 31%;}
#productos-destacados .pd-title{font-weight: 500;}
#categorias article{width: 100%;}
#marcas article{width: 46%;margin: 1rem 2%;}
#cta { background-image: none; background-color: var(--cs);}
#why ul li i {padding: 2rem 4rem;margin-right: 0;}
#why ul li:before{left: -15px;}
#why ul li p {font-size: 1.4rem;}
#cta .container, #formulario .container, #clientes .container, #footer .container, #nosotros .container{width: 90%;max-width: 90%;}
#footer img { width: initial;}
#footer p, #footer div, #footer li {font-size: 1.6rem;}
#nosotros .col +.col { padding-left: 0;}
#contactanos ul{display: block;}
#contactanos ul li{margin: 5rem 0;}
#delivery img{position: relative; width: 60%; margin: 0 auto;display: block;}

}

/*************************************LAPTOP HD Y TV*************************************/
@media screen and (min-width: 1440px) and (max-width: 1920px){
  h1{font-size: 4rem;}
  h2{font-size: 2.5rem;font-weight: 700;}
  h3{font-size: 1.8rem;font-weight: 500;line-height: initial;}
  p, ul li,ol li{font-size: 1rem;line-height: initial;}
  ul.menu-main li a{padding: 1rem 1rem;font-size: 1rem;height: 75px;line-height: 2.8rem;}
  
  ul li a.dropdown-trigger {padding: 1rem 2.4rem;font-size: 1.1rem;height: 95px;}
  .fixed-menu ul.menu-main li a{height: 70px;line-height: 2.5rem;}
  .fixed-menu ul li a.dropdown-trigger{height: 70px;}
  nav.fixed-menu ul.menu-main li a:hover, nav.fixed-menu ul.menu-main li a.active {height: 70px;width: 100%;line-height: 2.5rem;}
  ul.menu-main li a.dropdown-trigger:after{top: 34px;}
  h2+p.center{width: 90%}
  .fixed-menu{height: 115px;}
  nav .nav-wrapper {height: 110px;background: transparent;}
  .welcome{height: 75px;}
  .fixed-menu .welcome {height: 60px;padding: 0.3rem 0 0 0;}
  .fixed-menu .welcome img{width: 100%;/* margin: 0 0 .5rem 0; */}
  nav .menu-top{height: 50px}
  nav .box-menu-header{margin-top: unset;}
  nav .menu-main+a{font-size: 1rem;}
  .fixed-menu .box-menu-header{height:  60px}
  #home-cover {margin-top: -130px;height: 100vh;}
  .bg-cover .container {width: 100%;max-width: 88%;margin-top: 12rem;}
  .bg-secciones .container{margin-top: 8rem;}
  .bg-cover .cover-content h1{font-size: 3rem;}
  .bg-cover .cover-content p{font-size: 1.1rem;}
  #productos-destacados .pd-title{font-size: 1rem;}
  #categorias article h3{font-size: 1.4rem;}
  #why ul li i{font-size: 4.5rem;}
  #btn-enviar{width: 280px;}  
  #footer p, #footer div, #footer li{font-size: 1rem;}
}

@media screen and (min-width:1920px){
  h2{font-size: 3rem;}
  p, ul li,ol li{font-size: 1.3rem;line-height: initial;}
  ul.menu-main li a{padding: 1.2rem 1.5rem;font-size: 1.2rem;height: 75px;line-height: 2.8rem;}
  ul.menu-main li a.dropdown-trigger:after { top: 38px;}
  .bg-cover .container {width: 100%;max-width: 88%;margin-top: 16rem;}
  .bg-secciones .container{margin-top: 10rem;}
  .bg-cover h1 {font-size: 3.2rem;/* padding-top: 1.9rem; */}
  
  .bg-cover .cover-content h1 {font-size: 4rem;}
  .bg-cover .cover-content p {font-size: 1.5rem;}
  .bg-cover .cover-content .tcp5{font-size: 2.4rem;}

  #productos-destacados .pd-title {font-size: 1.3rem;}
  #categorias article h3 {font-size: 2rem;}
  #why ul li i{font-size: 7.5rem;}  
}

/*************************************ICON STYLE*************************************/
@font-face {
  font-family: 'icomoon';
  src:  url('assets/fonts/icomoon.eot?54zg9b');
  src:  url('assets/fonts/icomoon.eot?54zg9b#iefix') format('embedded-opentype'),
    url('assets/fonts/icomoon.ttf?54zg9b') format('truetype'),
    url('assets/fonts/icomoon.woff?54zg9b') format('woff'),
    url('assets/fonts/icomoon.svg?54zg9b#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: never;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-24horas:before {
  content: "\e900";
}
.icon-angle-right:before {
  content: "\e901";
}
.icon-checked:before {
  content: "\e902";
}
.icon-delivery:before {
  content: "\e903";
}
.icon-email:before {
  content: "\e904";
}
.icon-facebook:before {
  content: "\e905";
}
.icon-handshake:before {
  content: "\e906";
}
.icon-instagram:before {
  content: "\e907";
}
.icon-like:before {
  content: "\e908";
}
.icon-linkedin:before {
  content: "\e909";
}
.icon-map:before {
  content: "\e90a";
}
.icon-menu:before {
  content: "\e90b";
}
.icon-operator:before {
  content: "\e90c";
}
.icon-payment:before {
  content: "\e90d";
}
.icon-quality:before {
  content: "\e90e";
}
.icon-smile:before {
  content: "\e90f";
}
.icon-telephone:before {
  content: "\e910";
}
.icon-tiktok:before {
  content: "\e911";
}
.icon-whatsapp:before {
  content: "\e912";
}
.icon-youtube:before {
  content: "\e913";
}