@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,100..900;1,100..900&display=swap');

.archivo { font-family: "Archivo", sans-serif; }

/* VARIABLES */
:root{
    --main-color:#ff8a6b;
    --main-color-light:#e6e6e6;
    --main-color-dark:#000;
}

.bg-yellow-cus{background-color:#fad982;}
.black-menu{background-color: #000000cf;}

.mt-custom { margin-top: 69px; }

.filter-white { filter: grayscale(100) brightness(0) invert(1); }

@media (min-width: 1023px) {
    .mt-custom { margin-top: 0px; }   
}

@keyframes rollLeft {
  0% {
    opacity: 0;
    transform: translate3d(-100%, 0, 0) rotate(120deg);
  }
  100% {
    opacity: 1;
    transform: translateZ(0);
  }
}

@keyframes rollRight {
  0% {
    opacity: 0;
    transform: translate3d(100%, 0, 0) rotate(-120deg);
  }
  100% {
    opacity: 1;
    transform: translateZ(0);
  }
}

.blur-custom { 
    background: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(40px); 
}

.rollLeft { animation-name: rollLeft; animation-duration: 1s; animation-fill-mode: both; }
.rollRight { animation-name: rollRight; animation-duration: 1s; animation-fill-mode: both; }

.overlay-nav{ background-color: #000000eb; visibility: hidden; opacity: 0; transition: visibility 0s, opacity 0.3s ease-in; }

.overlay-nav.visible{ visibility: visible; opacity: 1; }

/* MAIN COLOR */
.text-main-color { color: var(--main-color); }
.group:hover .group-hover\:text-main-color { color: var(--main-color); }
.hover\:text-main-color:hover { color: var(--main-color); }
.focus\:text-main-color:focus { color: var(--main-color); }
.bg-main-color { background-color: var(--main-color); }
.group:hover .group-hover\:bg-main-color { background-color: var(--main-color); }
.hover\:bg-main-color:hover { background-color: var(--main-color); }
.focus\:bg-main-color:focus { background-color: var(--main-color); }
.border-main-color { border-color: var(--main-color); }
.hover\:border-main-color:hover { border-color: var(--main-color); }
.focus\:border-main-color:focus { border-color: var(--main-color); }
.fill-main-color { fill: var(--main-color); }
.hover\:fill-main-color:hover { fill: var(--main-color); }
.focus\:fill-main-color:focus { fill: var(--main-color); }
.stroke-main-color { stroke: var(--main-color); }
.hover\:stroke-main-color:hover { stroke: var(--main-color); }
.focus\:stroke-main-color:focus { stroke: var(--main-color); }

/* MAIN COLOR LIGHT */
.text-main-color-light { color: var(--main-color-light); }
.group:hover .group-hover\:text-main-color-light { color: var(--main-color-light); }
.hover\:text-main-color-light:hover { color: var(--main-color-light); }
.focus\:text-main-color-light:focus { color: var(--main-color-light); }
.bg-main-color-light { background-color: var(--main-color-light); }
.group:hover .group-hover\:bg-main-color-light { background-color: var(--main-color-light); }
.hover\:bg-main-color-light:hover { background-color: var(--main-color-light); }
.focus\:bg-main-color-light:focus { background-color: var(--main-color-light); }
.border-main-color-light { border-color: var(--main-color-light); }
.hover\:border-main-color-light:hover { border-color: var(--main-color-light); }
.focus\:border-main-color-light:focus { border-color: var(--main-color-light); }
.fill-main-color-light { fill: var(--main-color-light); }
.hover\:fill-main-color-light:hover { fill: var(--main-color-light); }
.focus\:fill-main-color-light:focus { fill: var(--main-color-light); }
.stroke-main-color-light { stroke: var(--main-color-light); }
.hover\:stroke-main-color-light:hover { stroke: var(--main-color-light); }
.focus\:stroke-main-color-light:focus { stroke: var(--main-color-light); }

/* MAIN COLOR DARK */
.text-main-color-dark { color: var(--main-color-dark); }
.group:hover .group-hover\:text-main-color-dark { color: var(--main-color-dark); }
.hover\:text-main-color-dark:hover { color: var(--main-color-dark); }
.focus\:text-main-color-dark:focus { color: var(--main-color-dark); }
.bg-main-color-dark { background-color: var(--main-color-dark); }
.group:hover .group-hover\:bg-main-color-dark { background-color: var(--main-color-dark); }
.hover\:bg-main-color-dark:hover { background-color: var(--main-color-dark); }
.focus\:bg-main-color-dark:focus { background-color: var(--main-color-dark); }
.border-main-color-dark { border-color: var(--main-color-dark); }
.hover\:border-main-color-dark:hover { border-color: var(--main-color-dark); }
.focus\:border-main-color-dark:focus { border-color: var(--main-color-dark); }
.fill-main-color-dark { fill: var(--main-color-dark); }
.hover\:fill-main-color-dark:hover { fill: var(--main-color-dark); }
.focus\:fill-main-color-dark:focus { fill: var(--main-color-dark); }
.stroke-main-color-dark { stroke: var(--main-color-dark); }
.hover\:stroke-main-color-dark:hover { stroke: var(--main-color-dark); }
.focus\:stroke-main-color-dark:focus { stroke: var(--main-color-dark); }

/* BASE CLASES PROPIAS */
@font-face { font-family: 'SFCompactDisplay'; font-style: normal; font-weight: normal; src: url('/template/estandar/fonts/sf-compact-display-thin-58646eb43a785.woff') format('woff'); font-display: swap; }
@font-face { font-family: 'SFCompactDisplay'; font-style: normal; font-weight: bold; src: url('/template/estandar/fonts/sf-compact-display-medium-5864711817c30.woff') format('woff'); font-display: swap; }

*{font-family:'SFCompactDisplay' }
p{font-family:'SFCompactDisplay';font-size: 21px;}
.text-politica p{ font-size:14px}
.swal2-content{text-align:left}
.text-sm p{font-size: inherit;}
button[data-action="stop"],button[data-action="start"]{display:none;}
:focus,input:focus,button:hover,button:focus{outline:none;}

.transition3s{transition: all .3s ease-in-out;}
.transition2s{transition: all .2s ease-in-out;}

.img::after{content:"";display:block;padding-top:60%;}

.hp-1\/7::after{content:"";display:block;padding-top:70%;}
.hp-1\/6::after{content:"";display:block;padding-top:60%;}
.hp-1\/5::after{content:"";display:block;padding-top:50%;}
.hp-1\/4::after{content:"";display:block;padding-top:40%;}
.hp-1\/3::after{content:"";display:block;padding-top:30%;}

.svg{left: -18px;}
.top-50{top:50%;}
.rotateAngle{transform: rotate(180deg)!important;}
.translateY50{transform: translateY(-50%);}
.left-50{left:50%;transform: translateX(-50%);}
.w-screen-4\/12{width:33.33vw;}
.w-screen-5\/12{width:42vw;}
.w-screen-6\/12{width:50vw;}
.max-w-none{max-width:none;}
.w-300{width: 250px;}
.w-300-v2{width: 290px;}
.max-h-lg{max-height: 900px;}
.border-t-1{border-top-width: 1px}
.bg-black-menu{background-color: #0000009e;}
.border-white-opacity{border-color:#ffffff73;}

/*menu icon*/
.menu.toggled{transform: translateX(100%);}
.text-orange-empresa{color:#e3c365}

.iconMenu{
width: 60px;
height: 45px;
position: relative;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-o-transition: .5s ease-in-out;
transition: .5s ease-in-out;
cursor: pointer;
}

.iconMenu span{
display: block;
position: absolute;
height: 4px;
width: 100%;
background: #fff;
border-radius: 9px;
opacity: 1;
left: 0;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .25s ease-in-out;
-moz-transition: .25s ease-in-out;
-o-transition: .25s ease-in-out;
transition: .25s ease-in-out;
}
.iconMenu span:nth-child(1) {
top: 0px;
width: 100%;
}

.iconMenu span:nth-child(2),.iconMenu span:nth-child(3) {
top: 18px;
}

.iconMenu span:nth-child(4) {
top: 36px;
width: 70%;
right: 0;
left: auto;
}

.iconMenu.open span:nth-child(1) {
top: 18px;
width: 0%;
left: 50%;
}

.iconMenu.open span:nth-child(2) {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}

.iconMenu.open span:nth-child(3) {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
}

.iconMenu.open span:nth-child(4) {
top: 18px;
width: 0%;
left: 50%;
}
.rounded-2lg{border-radius: 1.4rem;}
.shadow-inner-xs{box-shadow: inset -2px 4px 7px -4px rgb(0, 0, 0);}
.zn-1{z-index: -1}
.zn-2{z-index: -2}
.banner .tns-controls{display:none;}
#banner p>span{color: #ff8a6b;}
.marcas .tns-controls{display:none;}
.checkbox input:checked + div{color:#63b3ed}
.checkbox input:checked + div>img{opacity:1}
.bg-degradado{
background: rgb(2,0,36);
background: linear-gradient(180deg, rgba(2,0,36,1) 0%, rgba(0,0,0,1) 25%, rgba(255,255,255,0) 100%);
}
.text-gray-iconos{color:#000;}
.last\:border-0:last-child{border:none;}
@media screen and (min-width:992px){
    .menu{margin-top: 145px}
}

