:root {
  --c-color-blue1: #009ADA;
  --c-color-blue2: #005386;
  --c-color-gray: #323E48;
  --c-color-yellow: #FFDF00;
  --c-color-red: #BF0411;
}
html{
	scroll-behavior: smooth !important;
}
body{
	font-family: 'Montserrat', sans-serif;
}
.custom-font{
	font-family: "Space Ranger", sans-serif !important;
}
.custom-font-3d{
	font-family: "Space Ranger", sans-serif !important;
	font-style: oblique;
}
.text-c-blue1{ color: var(--c-color-blue1); }
.text-c-blue2{ color: var(--c-color-blue2); }
.text-c-yellow{ color: var(--c-color-yellow); }
.text-c-red{ color: var(--c-color-red); }
.text-c-gray{ color: var(--c-color-gray); }
.bg-c-blue1{ background-color: var(--c-color-blue1); }
.bg-c-blue2{ background-color: var(--c-color-blue2); }
.bg-c-gray{ background-color: var(--c-color-gray); }
.bg-c-red{ background-color: var(--c-color-red); }
.btn-c-red{
	background-color: #9D2442;
	color: #ffffff;
}
.btn-c-red:hover, .btn-c-red:active{
	background-color: #C54E66;
	color: #ffffff;
}
.bg-novedades{
	background-image: url('../img/bg-novedades.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.bg-sec-light{
	background-image: url('../img/bg-light.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.bg-sec-01{
	background-image: url('../img/bg-01.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.bg-sec-02{
	background-image: url('../img/bg-02.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.bg-sec-03{
	background-image: url('../img/bg-03.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.bg-sec-04{
	background-image: url('../img/bg-04.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.bg-sec-05{
	background-image: url('../img/bg-05.svg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}
.bg-sec-text{
	background-color: #0B0D1A;
	background-image: url('../img/bg-texture.png');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}
.bg-sec-text-02{
	background-color: #ffffff;
	background-image: url('../img/bg-texture-02.png');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.bg-sec-footer{
	background-image: url('../img/bg-footer.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}
.bg-counter{
	background: #F0F0F073;
}
.bg-c-grad-gray1{
	background: linear-gradient(115deg, #ffffff, #e6e0e0);
}
.bg-c-grad-gray2{
	background: linear-gradient(180deg, #ffffff, #e6e0e0);
}
.btn-c-blue{
	background: linear-gradient(115deg, #005487 0%, #0C99D7 100%);
	border: none;
	color: #ffffff;
	border-radius: 15px;
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}
.btn-c-blue:hover{
	background: linear-gradient(115deg, #0C99D7 0%, #005487 100%);
	color: #ffffff;
	border: none;
	border-radius: 15px;
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}
.btn-c-card{
	background: #C54E66;
	color: #ffffff;
	border: solid 1px #C54E66;
	border-radius: 0px 0px 20px 20px;
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}
.btn-c-card:hover, .btn-c-card:active{
	background: #9D2442;
	color: #ffffff;
	border: solid 1px #9D2442;
	border-radius: 0px 0px 20px 20px;
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}
.btn-c-blue1{
	background: var(--c-color-blue1);
	color: #ffffff;
	border: solid 1px var(--c-color-blue1);
	border-radius: 0px 0px 20px 20px;
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}
.btn-c-blue1:hover, .btn-c-blue1:active{
	background: transparent;
	color: var(--c-color-blue1);
	border: solid 1px var(--c-color-blue1);
	border-radius: 0px 0px 20px 20px;
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}
.btn-c-blue2{
	background: var(--c-color-blue2);
	color: #ffffff;
	border: solid 1px var(--c-color-blue2);
	border-radius: 0px 0px 20px 20px;
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}
.btn-c-blue2:hover, .btn-c-blue2:active{
	background: transparent;
	color: var(--c-color-blue2);
	border: solid 1px var(--c-color-blue2);
	border-radius: 0px 0px 20px 20px;
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}
.custom-card{	
	background: #FFFFFFC4;
	color: #000000;
	border-radius: 10px;
	padding: 15px 25px;
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}
.custom-card:hover{
	background: #FFFFFF;
	color: #000000;
	border-radius: 10px;
	padding: 15px 25px;
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}
#form input, #form select{
	height: 50px;
	border-radius: 10px;
}
hr.title{
	opacity: 1;
	border-top-width: 8px;
	width: 100px;
}
.box-c-shadow{
	box-shadow: 0 20px 40px rgba(0,0,0,0.4);
}
#nav-tab .nav-link{
	background: #dcd9d7;
	color: #8a8a8d;
	font-weight: bolder;
	text-transform: uppercase;
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}
#nav-tab .nav-link.active, #nav-tab .nav-link:hover{
	background: #ffffff;
	color: var(--c-color-blue1);
	font-weight: bolder;
	text-transform: uppercase;
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}
#navbarNav .nav-link{
	font-weight: normal;
	color: #ffffff;
	border-bottom: solid 5px #ffffff;
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}
#navbarNav .nav-link.active{ font-weight: bolder; }
#navbarNav .nav-link.active, #navbarNav .nav-link:hover{
	color: #ffffff;
	border-bottom: solid 5px var(--c-color-blue1);
	transition: all .5s cubic-bezier(.3,.95,.3,.95);
}

/*-- Cards --*/

.swiper-pagination-bullet{
	background: #ffffff !important;
}

.swiper-pagination-bullet {
  width: 40px !important;
  height: 40px !important;
  text-align: center;
  line-height: 40px;
  font-size: 16px;
}

.ccontainer .ccard .icon {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background-size: cover !important;

  background-repeat: no-repeat !important;

  background-position: center center !important;

}



.ccontainer .ccard .icon .fa {

  position: absolute;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  font-size: 80px;

  color: #fff;

}



.ccontainer .ccard .slide {

  width: 100%;

  aspect-ratio: 2/1.2;

  transition: 0.5s;

}



.ccontainer .ccard .slide.slide1 {

  position: relative;

  display: flex;

  justify-content: center;

  align-items: center;

  z-index: 1;

  transition: .7s;

  transform: translateY(calc((100%) - 100px));

}



.ccontainer .ccard:hover .slide.slide1{

  transform: translateY(0px);

}



.ccontainer .ccard .slide.slide2 {

  position: relative;

  display: flex;

  justify-content: center;

  align-items: center;

  padding: 10px 20px;

  box-sizing: border-box;

  transition: .8s;

  transform: translateY(-100px);

  box-shadow: 0 20px 40px rgba(0,0,0,0.4);

  background-color: #252D63;

}



.ccontainer .ccard:hover .slide.slide2{

  transform: translateY(0);

}



.ccontainer .ccard .slide.slide2 .content h3 {

  margin: 0 0 10px 0;

  padding: 0;

  color: #fff;

}



.hrc{

	border-color: #D9D9D9;

	width: 30%;

	opacity: 1;

}

.hrc2{

	border-color: #000000;

	width: 30%;

	opacity: 1;

}



/*-- Animaciones --*/



.slide-left-right {

  animation-duration: 3s;

  animation-name: slideinR;

}



@keyframes slideinR {

  from {

    margin-right: 100%;

    width: 300%;

  }



  to {

    margin-right: 0%;

    width: 100%;

  }

}



/*------------------- Contador ------------------*/

.contenedor h1 {

  font-weight: bolder;

  letter-spacing: .125rem;

  text-transform: uppercase;

  color: #ffffff;

  font-family: "Inter", sans-serif;

}



.contenedor li {

  display: inline-block;

  font-size: 1.5em;

  list-style-type: none;

  padding: 1em;

  color: #ffffff;

  font-family: "Inter", sans-serif;

}



.contenedor li span {

  display: block;

  font-size: 4.5rem;

}



.contenedor .emoji {

  display: none;

  padding: 1rem;

}



.contenedor .emoji span {

  font-size: 4rem;

  padding: 0 .5rem;

}

@media all and (min-width: 799px) {
	.cbr{
		margin-right: 1.5rem;
		border-right: solid 1px #000000;
	}
	.cbx{
		border-right: solid 1px #FFFFFF;
		border-left: solid 1px #FFFFFF;
	}
	.cbl{
		border-left: solid 5px var(--c-color-blue1);
	}
	.cdisplay-2{
		font-size: 4.5rem;
	}
	.cfs-2{
		font-size: 2rem;
	}
}

@media all and (max-width: 798px) {
  .contenedor h1 {
    font-size: 1.5rem;
  }
  .contenedor li {
    font-size: 1.125rem;
    padding: .75rem;
  }
  .contenedor li span {
    font-size: 3.375rem;
  }
  .cbr{
		margin-right: 0;
		border-right: none;
	}
	.cbx{
		border-top: solid 1px #FFFFFF;
		border-bottom: solid 1px #FFFFFF;
		border-right: none;
		border-left: none;
	}
	.cbl{
		border-left: none;
	}
	.cdisplay-2{
		font-size: 2rem;
	}
	.cfs-2{
		font-size: 1.25rem;
	}
}