/* ==============================================================
 * COLORES
 * ============================================================== */
	.blue1 { color: #00AFD7; }
	.blue2 { color: #009CDE; }
	.blue3 { color: #407EC9; }
	.blue4 { color: #236192; }
	.blue5 { color: #002554; }

	.bg-blue1 { background-color: #00AFD7; }
	.bg-blue2 { background-color: #009CDE; }
	.bg-blue3 { background-color: #407EC9; }
	.bg-blue4 { background-color: #236192; }
	.bg-blue5 { background-color: #002554; }
/* colores */


/* ==============================================================
* FUENTES
* ============================================================== */
	@font-face {
		font-family: rotoplas_bold;
		src: url('fonts/rotoplas_bold/rotoplas_bold_webfont.woff2') format('woff2'), url('fonts/rotoplas_bold/rotoplas_bold_webfont.woff') format('woff');
		font-display: swap;
	}
	@font-face {
		font-family: rotoplas_regular;
		src: url('fonts/rotoplas_regular/rotoplas_regular_webfont.woff2') format('woff2'), url('fonts/rotoplas_regular/rotoplas_regular_webfont.woff') format('woff');
		font-display: swap;
	}
	@font-face {
		font-family: rotoplas_light;
		src: url('fonts/rotoplas_light/rotoplas_light_webfont.woff2') format('woff2'), url('fonts/rotoplas_light/rotoplas_light_webfont.woff') format('woff');
		font-display: swap;
	}

	.bold { 
		font-family: rotoplas_bold;
	}
	.regular { 
		font-family: rotoplas_regular;
	}
	.light { 
		font-family: rotoplas_light;
	}

	body { 
		font-family: rotoplas_regular, sans-serif !important;
	}
/* fuentes */



body {
	/* padding-bottom: 3rem; */
	background: url(/images/header-fondo.jpg)#002454;
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-position: top;
}



.fs-7 {
	font-size: 0.875rem !important;
}

.w-15 {
	width: 15%;
}

.border-radius-full {
	border-radius: 50%;
}

.rtp-btn {
	border-radius: 100rem !important;
	background-color: #002554 !important;
	border: 1px solid #009CDE !important;
	color: #fff !important;
}


/* ==============================================================
* MENU
* ============================================================== */
	.navbar {
		transition: all ease .3s;
	}
	.nav-link {
		color: rgba(255,255,255,1) !important;
	}
	.nav-link:hover {
		color: #009CDE !important;
	}

	.scrolled {
		background-color: rgba(0, 37, 84, 0.96);
	}

	#rtp-logo img {
		width: 96px;
		transition: all ease .3s;
		opacity: 0;
	}

	.scrolled #rtp-logo img {
		opacity: 1;
	}
/* menu */


/* ==============================================================
* HEADER
* ============================================================== */
	header {
		padding-bottom: 3rem;
		background: url(/images/header-fondo.jpg) #003366 no-repeat;
		background-size: cover;
		background-position: bottom;
	}

	.header-logo {
		max-width: 480px;
		width: 80%;
	}
/* header */


/* ==============================================================
* QUIENES SOMOS
* ============================================================== */
	#quienes-somos {
		/* padding-top: 3rem;
		padding-bottom: 1rem; */
		background: url(/images/header-fondo-2.jpg) #002454 no-repeat;
		background-size: 100% auto;
		background-position: bottom;
	}
/* quienes somos */


/* ==============================================================
* SLIDER 1
* ============================================================== */
	#slider-1 {
		padding-top: 6rem;
		padding-bottom: 6rem;
		background-color: #f7f7f7;
	}

	#cifras-swiper {
		padding: 1rem;
	}

	#cifras-swiper .swiper-slide {
		height: auto !important;
		background-color: #fff;
		box-shadow: 0px 0px 10px 0px rgba(0,0,0,.5);
	}

	.swiper-button-next,
	.swiper-button-prev {
		width: 30px;
		height: 30px;
		
		background-color: transparent;
		background-position: 50%;
		background-repeat: no-repeat;
		background-size: 100%
	}

	.swiper-button-prev, 
	.swiper-rtl .swiper-button-next {
		left: 20px;
	}
	.swiper-button-next, 
	.swiper-rtl .swiper-button-prev {
		right: 20px;
	}

	.swiper-button-next:after, 
	.swiper-button-prev:after {
		content: "" !important;
	}

	.swiper-button-prev {
		background-image: url(/images/slider-arrow-icon.svg);
		rotate: 180deg;
	}
	.swiper-button-next {
		background-image: url(/images/slider-arrow-icon.svg);
	}
/* slider 1 */


/* ==============================================================
* NUESTRA PRESENCIA
* ============================================================== */
	#nuestra-presencia {
		padding-top: 6rem;
		padding-bottom: 6rem;
		background: url(/images/presencia-fondo.jpg) #407ec9 no-repeat;
		background-size: auto 100%;
		background-position: center;
	}
/* nuestra presencia */


/* ==============================================================
* NUESTRAS SOLUCIONES
* ============================================================== */
	#nuestras-soluciones {
		padding-top: 6rem;
		padding-bottom: 6rem;
		background: url(/images/soluciones-fondo.jpg) #003366 no-repeat;
		background-size: cover;
		background-position: center;
	}

	.soluciones-nodo {
		width: 15%;
	}
	.soluciones-nodo img {
		border: 6px solid #fff;
		box-shadow: 0px 5px 20px 0px rgba(0,0,0,1);
	}

	@media screen and (max-width: 992px) {
		.soluciones-nodo {
			width: 25%;
		}
	}
	@media screen and (max-width: 576px) {
		.soluciones-nodo {
			width: 45%;
		}
	}

	.soluciones-flip-card {
		background-color: transparent;
		/* width: 300px; */
		width: 15%;
		height: 410px;
		perspective: 1000px;
		transition: all ease .3s;
	}
	.soluciones-flip-card p {
		margin: 0;
	}

	.soluciones-flip-card-inner {
		position: relative;
		width: 100%;
		height: 100%;
		text-align: center;
		transition: transform 0.6s;
		transform-style: preserve-3d;
		/* box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); */
	}

	.soluciones-flip-card:hover .soluciones-flip-card-inner {
		transform: rotateY(180deg);
	}

	.soluciones-flip-card-front, .soluciones-flip-card-back {
		position: absolute;
		width: 100%;
		height: 100%;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
	}

	.soluciones-flip-card-front {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		/* padding: 1rem; */

		color: #fff;
	}

	.soluciones-flip-card-front img {
		border: 6px solid #fff;
		box-shadow: 0px 5px 20px 0px rgba(0,0,0,1);
	}

	.soluciones-flip-card-back {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;

		color: #fff;
		transform: rotateY(180deg);
		text-align: start;

		font-size: 14px;

		padding: 1rem;
		border: 3px solid #fff;
		border-radius: 2rem;
		background: #00255478;
		box-shadow: 0px 5px 20px 0px rgb(0, 0, 0);
	}

	/* @media screen and (max-width: 1587px) { */
	@media screen and (max-width: 1290px) {
		.soluciones-flip-card {
			width: 320px;
		}
	}

	@media screen and (max-width: 1071px) {
		.soluciones-flip-card {
			width: 250px;
			height: 330px;
		}
	}

	@media screen and (max-width: 539px) {
		.soluciones-flip-card {
			width: 45%;
			height: 380px;
		}
	}

	@media screen and (max-width: 425px) {
		.soluciones-flip-card {
			width: 70%;
			height: 320px;
		}
	}
/* nuestras soluciones */


/* ==============================================================
* SERVICIOS
* ============================================================== */
	#servicios {
		background-color: #fff;
		padding-top: 6rem;
		padding-bottom: 3rem;
	}

	.servicios-nodo {
		width: 18%;
	}

	@media screen and (max-width: 992px) {
		.servicios-nodo {
			width: 25%;
		}
	}
	@media screen and (max-width: 576px) {
		.servicios-nodo {
			width: 45%;
		}
	}
/* servicios */


/* ==============================================================
* BENEFICIOS
* ============================================================== */
	#nuestros-beneficios {
		background-color: #fff;
		padding-top: 6rem;
		padding-bottom: 6rem;
	}
/* beneficios */


/* ==============================================================
* ESQUEMAS COMERCIALES
* ============================================================== */
	#esquemas {
		padding-top: 3rem;
		padding-bottom: 6rem;
		background: url(/images/esquemas-fondo.jpg) #003366 no-repeat;
		background-size: cover;
		background-position: bottom;
	}

	.flip-card {
		background-color: transparent;
		width: 300px;
		height: 300px;
		perspective: 1000px;
		transition: all ease .3s;
	}
	.flip-card p {
		margin: 0;
	}

	.flip-card-inner {
		position: relative;
		width: 100%;
		height: 100%;
		text-align: center;
		transition: transform 0.6s;
		transform-style: preserve-3d;
		/* box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2); */
	}

	.flip-card:hover .flip-card-inner {
		transform: rotateY(180deg);
	}

	.flip-card-front, .flip-card-back {
		position: absolute;
		width: 100%;
		height: 100%;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
	}

	.flip-card-front {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 1rem;

		background-color: #002454a5;
		color: #fff;
		border: 2px solid #009cde;
		border-radius: 1rem;
		overflow: hidden;
	}

	.flip-card-back {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		padding: 1rem;

		background-color: #002454a5;
		color: #fff;
		transform: rotateY(180deg);
		text-align: start;

		border: 2px solid #009cde;
		border-radius: 1rem;
		overflow: hidden;
	}

	@media screen and (max-width: 1587px) {
		.flip-card {
			width: 250px;
			height: 330px;
		}
	}

	@media screen and (max-width: 539px) {
		.flip-card {
			width: 45%;
			height: 460px;
		}
	}

	@media screen and (max-width: 425px) {
		.flip-card {
			width: 100%;
			height: 220px;
		}
	}
/* esquemas */


/* ==============================================================
* SEGMENTOS / CERTIFICACIONES
* ============================================================== */
	#segmentos-en-los-que-operamos {
		padding-top: 6rem;
		padding-bottom: 6rem;
		background: url(/images/segmentos-certificaciones-fondo.jpg) #009cde no-repeat;
		background-size: cover;
		background-position: center;
	}

	.segmentos-nodo {
		width: 16%;
		transition: all ease .3s;
	}

	.certificaciones-nodo {
		width: 15%;
		transition: all ease .3s;
	}

	@media screen and (max-width: 992px) {
		.segmentos-nodo {
			width: 18%;
		}

		.certificaciones-nodo {
			width: 20%;
		}
	}

	@media screen and (max-width: 768px) {
		.segmentos-nodo {
			width: 30%;
		}

		.certificaciones-nodo {
			width: 22%;
		}
	}

	@media screen and (max-width: 576px) {
		.segmentos-nodo {
			width: 45%;
		}

		.certificaciones-nodo {
			width: 33%;
		}
	}
/* segmentos */


/* ==============================================================
* VIDEO
* ============================================================== */
	#video {
		padding-top: 6rem;
		padding-bottom: 6rem;
	}

	.video-responsive-wrapper {
		width: 70%;
		margin: 0 auto;
	}
	.video-responsive {
		height: 0;
		overflow: hidden;
		padding-bottom: 56.25%;
		padding-top: 30px;
		position: relative;
	}
	.video-responsive iframe, .video-responsive object, .video-responsive embed {
		height: 100%;
		left: 0;
		position: absolute;
		top: 0;
		width: 100%;
	}

	@media screen and (max-width: 992px) {
		.video-responsive-wrapper {
			width: 100%;
		}
	}
/* video */

/* ==============================================================
* CONTACTO
* ============================================================== */
	#contactanos {
		padding-top: 6rem;
		padding-bottom: 6rem;
		background: url(/images/contacto-fondo.jpg) #002554 no-repeat;
		background-size: cover;
		background-position: bottom;
	}

	#contactanos form,
	#rsaform {
		padding: 2rem;
		background-color: #ffffffd1; /*#002049c6*/
		border: 1px solid #00ffff; /**/
		border-radius: 0.375rem;
	}
	#contactanos .form-control {
		color: #fff;
		background-color: #000a25;
		border: 1px solid #00ffff;
	}
	#contactanos .form-select {
		color: #fff;
		background-color: #000a25;
		border: 1px solid #00ffff;
	}

	form .error {
		color: red;
	}

	.hs-form {
		color: #fff;
	}
	.hs-form label {
		color: #fff;
	}
	.hs-form-field label {
		color: #fff;
	}

	.hs-button {
		font-size: 100px !important;
		background-color: orange !important;
		}

	#label-firstname-d154e558-3b8a-4de8-8c07-415a676b8d53 {
		background-color: red;
	}

	label {
		color: green !important;
	}
/* contacto */


/* ==============================================================
* FOOTER
* ============================================================== */
	footer a {
		color: #fff;
		text-decoration: none;
		transition: all ease .3s;
		line-height: normal;
		display: inline-flex;
		align-items: center;
		gap: .5rem;
	}

	footer a:hover {
		color: #009CDE;
	}
/* footer */