body {
  min-height: 75rem !important;
  padding-top: 0 !important;
}
*{
  font-family: 'Poppins', sans-serif;
  color: #333;
  scroll-behavior: smooth;
}
html{
  color: #333;
  font-family: 'Poppins', sans-serif;
  scroll-behavior: smooth;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
  font-family: 'Poppins', sans-serif;
  color: #333;
}
.font-poppins{
  font-family: 'Poppins', sans-serif;
}
.grales{
  width: 100%;
  float: left;
}
.font-10{
  font-size: 10px;
}
.font-11{
  font-size: 11px;
}
.font-12{
  font-size: 12px;
}
.font-13{
  font-size: 13px;
}
.font-14{
  font-size: 14px;
}
.font-15{
  font-size: 15px;
}
.font-16{
  font-size: 16px;
}
.font-17{
  font-size: 17px;
}
.font-18{
  font-size: 18px;
}
.font-19{
  font-size: 19px;
}
.font-20{
  font-size: 20px !important;
}
.font-21{
  font-size: 21px;
}
.font-22{
  font-size: 22px;
}
.font-23{
  font-size: 23px;
}
.font-24{
  font-size: 24px;
}
.font-25{
  font-size: 25px;
}
.font-30{
  font-size: 30px;
}
.font-35{
  font-size: 35px;
}
.font-40{
  font-size: 40px;
}
.font-45{
  font-size: 45px;
}
.font-50{
  font-size: 50px;
}
.font-55{
  font-size: 55px;
}
.font-60{
  font-size: 60px;
}
.font-65{
  font-size: 65px;
}
.font-70{
  font-size: 70px;
}
.fw-100{
  font-weight: 100;
}
.fw-200{
  font-weight: 200;
}
.fw-300{
  font-weight: 300;
}
.fw-400{
  font-weight: 400;
}
.fw-500{
  font-weight: 500;
}
.fw-600{
  font-weight: 600;
}
.fw-700{
  font-weight: 700;
}
.fw-800{
  font-weight: 800;
}
.fw-900{
  font-weight: 900;
}
.color-blanco{
  color: #fff;
}
.enlace-blanco{
  color: #fff;
  text-decoration: none;
}
.enlace-blanco:hover{
  color: #fff;
  text-decoration: none;
}
.enlace-negro{
  color: #000;
  text-decoration: none;
}
.enlace-negro:hover{
  color: #000;
  text-decoration: none;
}
.color-gris{
  color: #333333;
}
.bg-gris{
  background-color: #333333;
}
.color-amarillo{
  color: #ffbb00;
}
.bg-amarillo{
  background-color: #ffbb00;
}
.color-verde{
  color: #53f3c3;
}
.bg-verde{
  background-color: #53f3c3;
}
.color-azul{
  color: #3e9fdd;
}
.bg-azul{
  background-color: #3e9fdd;
}
.color-negro{
  color: #000;
}
.bg-negro{
  background-color: #000;
}
.btn-colores{
  background-color: #E10C18;
  text-align: center;
  color: #fff;
  font-weight: 600;
  text-decoration: none;
  font-size: 16px;
  padding: 10px 20px;
  background-image: url(../images/borde-btn.jpg);
  background-position: bottom;
  background-repeat: no-repeat;
  width: auto;
  display: inline-flex;
}
.btn-colores:hover{
  color: #fff;
  text-decoration: none;
}
.text-end{
  text-align: right;
}
.text-justify{
  text-align: justify;
}
.borde{
  background-image: url(../images/linea-buton.jpg);
  background-repeat: no-repeat;
  height: 4px;
  margin: 5px 0 25px 0;
}
.color-rojo{
  color: #E10C18;
}
.color-verde{
  color: green;
}
.bg-rojo{
  background-color: #E10C18;
}
.color-rojo-obs{
  color: #802629;
}
.bg-rojo-obs{
background-color: #802629;
}
.btn-rojo{
  background-color: #E10C18;
  color: #fff;
  border: 1px solid #fff;
  padding: 10px 30px;
  text-decoration: none;
  -webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-ms-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.btn-rojo:hover{
  background-color: #fff;
  color: #E10C18;
  border: 1px solid #E10C18;
  padding: 10px 30px;
  text-decoration: none;
}
.bg-azul{
background-color: #29AAE1;
}
.bg-naranja{
background-color: #F6921E;
}
/************* GENERALES *******************/
/************* MENU *******************/
#top{
  width: 100%;
  float: left;
  background-image: url(../images/linea-top.jpg);
  height: 10px;
  background-position: center;
  background-repeat: no-repeat;
  background-repeat: repeat-x;
  z-index: 2000;
}
.navbar-brand {
  color: #333;
  text-decoration: none;
  white-space: nowrap;
}
.nav-item{
  padding: 0 10px;
}
.nav-item a{
  color: #fff;
  border-bottom: 1px solid transparent;
  font-size: 14px;
}
.nav-item a:hover{
  color: #fff;
  border-bottom: 1px solid #fff;
}
.logo-menu{
  width: 190px;
}
.logo-pie{
  width: 180px;
}
#menu-pie{
  float: right;
}
#menu-pie .nav-item{
  display: list-item;
  text-align: -webkit-match-parent;
  list-style: none;
  float: left;
}
#menu-pie .nav-item .nav-link{
  padding: 10px;
}
.navbar{
  background-image: url(../images/bg-transp.png);
  background-repeat: repeat-x;
  background-position: top;
}
.navbar-toggler:focus{
  outline: 0;
}
.wid35{
  width: 35px;
}
#logo-der-cpi{
  display: block;
}
/************* MENU *******************/
/****** ESC01 ******/
#esc01{
  background-image: url(../images/slider03.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  text-align: center;
  color: #fff;
}
.logo-princ{
  width: 187px;
}
.sli-pri{
  min-height: 80vh
}
#el-conteo{
  display: flex;
  flex-wrap: wrap;
}
#el-conteo .item-fecha{
  width: 70%;
}
#el-conteo .item-reloj{
  width: 30%;
}
/** RELOJ **/
#countdown{
  display:flex;
  justify-content:left;
  align-items:left;
  font-size:15px;
  text-align:center;
  color:#fff
}
.countdown-item{
  display:inline-block;
  margin-right:10px;
  font-size:22px;
  border-radius:10px;
  padding:5px;
  color:#fff;
}
.countdown-item-label{
  font-size:10px;
  color:#fff
}
.countdown-item-days .countdown-item-label{
  display:block
}
.countdown-number{
  color: #fff;
  font-weight: 600;
  font-size: 30px;
}
/** RELOJ **/
.slide-marcas01 .carousel-inner{
  overflow: visible;
}
.slide-marcas01 .carousel-control-prev {
  width: 12%;
  opacity: .3;
}
.slide-marcas01 .carousel-control-next{
  width: 12%;
  opacity: .3;
}
.ov-esc{
  overflow: hidden;
}
/****** ESC01 ******/
/****** ESC02 *****/
#esc02{
  /*background-image: url(../images/bg-gafete2.png);
  background-position: 130px center;
  background-repeat: no-repeat;
  background-size: contain;*/
}
.logo-250{
  width: 250px;
}
.logo-200{
  width: 200px;
}
/****** ESC02 *****/
/****** ESC03 *****/
#esc03{
  display: flex;
  flex-wrap: wrap;
  background-color: #eeeeee;
}
#esc03 .itemesc03{
  width: 50%;
  background-color: #efefef;
}
.log-ind-ponentes{
  width: 200px;
}
/****** ESC03 *****/
/****** ESC05 *****/
#esc05 .container-fluid{
  padding: 0;
}
#carousel .col{
  padding: 0;
}
#carousel .col img{
  width: 100%;
}
.navbar-toggler-icon .material-symbols-outlined{
  font-size: 30px !important;
}
.carousel-control-next, .carousel-control-prev {
  width: 3%;
  opacity: .3;
}
#elbotonf{
  position: relative;
  z-index: 100;
  margin-top: 0px;
  margin-bottom: -50px;
}
/****** ESC05 *****/
/****** ESC06 *****/
#esc06{
  height: 560px;
  background-image: url(../images/bg-amarillo.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
/****** ESC06 *****/
/****** ESC07 *****/
#esc07{
  padding-top: 150px !important;
  padding-bottom: 60px !important;
}
.tarjeta{
  background-repeat: no-repeat;
  background-position: right center;
  background-size: 120px 120px;
  padding: 30px 35px;
  height: 200px;
  box-shadow: inset 0 0 0 3px white, 8px 8px 20px rgba(255, 255, 255, 0.5);
}
.bg-punto1{
  border: #ffbb00 5px solid;
  background-image: url(../images/ico01.png);
}
.bg-punto2{
  border: #53f3c3 5px solid;
  background-image: url(../images/ico02.png);
}
.bg-punto3{
  border: #3e9fdd 5px solid;
  background-image: url(../images/ico03.png);
}
.bg-puntorojo{
  border: #802629 5px solid;
  background-image: url(../images/ico04.png);
}
/****** ESC07 *****/
/****** ESC08 *****/
#esc08{
  background-color: #eeeeee;
}
.image-phone{
  margin-top: -100px;
  width: 350px;
}
/****** ESC08 *****/
/************** WHATSAPP ********/
.btn-whatsapp {
  position: fixed;
  z-index: 100;
  right: 40px;
  bottom: 40px;
}

.btn-whatsapp:before, .btn-whatsapp:after {
  content: "";
  position: absolute;
  top: 7px;
  left: 7px;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background-color: #25D366;
  opacity: 0;
  animation: onda 1.7s infinite;
}

.btn-whatsapp img {
  width: 60px;
  position: relative;
  z-index: 2;
}

.btn-whatsapp:before {
  animation-delay: 1s;
}

.btn-whatsapp:after {
  animation-delay: 1.3s;
}

@keyframes onda {
  0% {
      transform: scale(1);
  }

  15% {
      opacity: 1;
  }

  100% {
      opacity: 0;
      transform: scale(2.5);
  }
}
/************** WHATSApp ****************/

.loading .content-loading {
    display: block;
}

.content-loading {
    width: 100%;
    height: 100%;
    display: none;
    overflow: hidden;
    position: fixed;
    background-color: #000;
    z-index: 1000;
    color: #fff;
    padding-top: 5%;
    background-repeat: no-repeat;
    background-image: url(../images/loader.gif);
    background-position: center;
}
/************* PIE *******************/
#banner-pie{
  background-image: url(../images/bg-pie.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.btn-blanco{
  background-color: transparent;
  border: 2px solid #fff;
  padding: 10px 20px;
  text-align: center;
  color: #fff;
  text-decoration: none;
  -webkit-transition: all .2s ease-in-out;
  -moz-transition: all .2s ease-in-out;
  -ms-transition: all .2s ease-in-out;
  -o-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}
.btn-blanco:hover{
  background-color: #E10C18;
  border: 2px solid #fff;
  padding: 10px 20px;
  text-align: center;
  color: #fff;
  text-decoration: none;
}
.logo-pie{
  width: 160px;
}
#datos-pie{
  background-color: #333333;
}
.dis-f{
  display: flex;
}
.vcentro{
  align-items: center;
}
#datos-pie ul li{
  margin-bottom: 10px;
}
.icos-top {
  width: 20px;
}
/************* PIE *******************/
/************* PAQUETES **************/
#escpaquetes{
  background-image: url(../images/bg-paquetes-gral.jpg);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
  color: #fff;
  background-color: #E10C18;
}
.nav-link {
  display: block;
  padding: var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x);
  font-size: var(--bs-nav-link-font-size);
  font-weight: var(--bs-nav-link-font-weight);
  color: #fff;
  text-decoration: none;
  background: 0 0;
  border: 0;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
}
.nav-link:focus, .nav-link:hover {
  color: #fff;
  background-color: #E10C18;
}
.card-subtitle{
  text-align: center;
}
.color-inactivo{
  color: #d1d1d1;
}
.lista-datos{
  list-style: none;
}
.lista-datos .fa-solid{
  margin-right: 10px;;
}
/************* PAQUETES **************/
.li-beneficios{
  margin: 0;
  padding: 0;
}
.li-beneficios li{
  list-style: none;
  font-size: 18px;
  padding: 8px 0;
}
.li-beneficios li i{
  margin-right: 15px;
}
.li-none{
  list-style: none;
}
/*************** ESC 09 *************************/
#esc09{
  background-color: #333333;
}
.ulno{
  margin: 0;
  padding: 0;
}

#boleto {
    background-image: url(../images/slider03.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
	/* height:10rem; */
}

#boleto .sli-pri{
  min-height: 40vh
}

.link-terminos{
	text-decoration: none;
    color: #000;
    font-size: 1rem;
    border-bottom: 2px solid;
	font-weight:bold;
}

.link-terminos:hover, .link-terminos:focus, .link-terminos:active{
	color: #000;
	font-weight:bold;
	text-decoration: none;
}

.list-pago{
	border: 2px solid #6B6F74;
    border-radius: 10px;
    min-height: 6rem;
    margin-bottom: 0.5rem;
	cursor:pointer;
}

.list-pago:hover{
	background-color:#dee2e6;
}

.list-pago.active{
	background-color:#dee2e6;
}

.bloqueado .list-pago{
	opacity:0.5;
	cursor:not-allowed;
}

.bloqueado .list-pago.active{
	opacity:1;
}

#b2b_marcas{
	height:auto;
	white-space: nowrap;
    width: 100%;
    overflow-x: auto;
}

.box-marca-b2b:first-child{
	border-left:2px solid rgba(225,12,24,0.5)!important;
}

.box-marca-b2b{
	border-right:2px solid rgba(225,12,24,0.5)!important;
}

.box-marca-b2b .box-logo-b2b{
	height:10rem;
	align-content:center;
	text-align:center;
}

.box-time-b2b{
	height: 62.5vh;
}

.box-time-b2b button.active{
	background-color:rgba(225,12,24,0.5);
}

.box-time-b2b button.mib2b{
	background-color:rgba(107, 111, 116,0.5);
}

.hr-b2b{
	height: 3px;
	background-color: rgba(225,12,24,0.5);
	margin-top: 0;
}

.img-b2b{
	width:6rem;
	height:6rem;
	border: 2px solid rgba(107,111,116,0.5);
	box-shadow: 0px 0px 10px rgba(107, 111, 116, 1);
}

.btn-b2b{
	padding:1rem;
	border:1px solid rgba(107, 111, 116, 1);
	border-radius:10px;
	background-color:#fff;
}

.box-time-b2b button:hover, .box-time-b2b button:focus, .box-time-b2b button:active{
	box-shadow: 0px 0px 10px rgba(107, 111, 116,0.5);
}

.bg-time-active{
	background-color:rgba(225,12,24,0.5);
}

.bg-mib2b{
	background-color:rgba(107, 111, 116,0.5);
}

.badge-b2b{
	display: inline-block;
    padding: 0.5rem 1rem;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25rem;
	box-shadow: 0px 0px 10px rgba(107, 111, 116, 1);
}

.slick-prev, .slick-next {
    font-size: 1.5rem;
}

.slick-prev i, .slick-next i{
	color:rgba(225,12,24,0.5);
}

.slick-prev:hover i, .slick-next:hover i{
	color:rgba(225,12,24,1);
}
.slick-prev:before, .slick-next:before {
    content: '';
}

.slick-dots {
    bottom: -4rem;
}
/*************** ESC 09 *************************/
/*--------------------------------------------------------------
# Media Query
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Notebook
--------------------------------------------------------------*/
@media only screen and (max-width: 1280px) {
  html {
    font-size: 95%;
  }
}

@media screen and (max-width: 1199px) {
  html {
      font-size: 95%;
  }
}
/*--------------------------------------------------------------
## Netbook
--------------------------------------------------------------*/
@media only screen and (max-width: 1024px) {
  html {
    font-size: 90%;
  }
}
/*--------------------------------------------------------------
## iPad
--------------------------------------------------------------*/
@media only screen and (max-width: 960px) {
  html {
    font-size: 85%;
  }
}
/*--------------------------------------------------------------
## iPad
--------------------------------------------------------------*/
@media only screen and (max-width: 768px) {
  html {
    font-size: 80%;
  }
}
/*--------------------------------------------------------------
## iPad
--------------------------------------------------------------*/
@media only screen and (max-width: 480px) {
  html {
    font-size: 75%;
  }
  #el-conteo .item-fecha{
      width: 100%;
      float: left;
  }
  #el-conteo .item-reloj{
      width: 100%;
      float: left;
  }
  .nav-item{
      padding: 0 10px;
      background-image: url(../images/bg-transp-completo.png);
  }
  .al-centro{
      text-align: center !important;
  }
  #countdown {
      justify-content: center;
  }
  #esc02 {
      background-image: none;
  }
  #esc03 .itemesc03 {
      width: 100%;
      float: left;
  }
  #esc06{
      height: 810px;
  }
  #esc06 p{
      font-size: 15px;
  }
  .image-phone {
      margin-top: 30px;
      width: 100%;
  }
  #esc07 h6{
      font-size: 20px;
  }
  .tarjeta p{
      font-size: 18px;
  }
  #elbotonf{
      margin-top: 0;
      margin-bottom: 0;
  }
  #elbotonf .btn-colores{
      margin-top: 0;
      margin-bottom: 0;
      width: 100%;
      text-align: center;
      display: block;
  }
  .carousel-control-next, .carousel-control-prev {
      width: 8%;
  }
  #esc07 {
      padding-top: 230px !important;
  }
  .navbar-toggler{
      padding: 20px;
  }
  .text-slide{
    font-size: 31px;
  }
  .tarjeta {
    height: 250px;
  } 
  #logo-der-cpi{
    display: none;
  }
  .col-sm-2{
    width: 50% !important;
  }
  .logo-menu {
    width: 140px;
  }
  .navbar-toggler:focus{
    padding: 13px;
    border: 0;
    box-shadow: none !important;
    outline: none;
  }
  #top {
    background-repeat: repeat-y;
    background-size: contain;
  }
  
  .slick-dots {
    bottom: -6rem;
  }
}