@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=ADLaM+Display&family=Agdasima:wght@400;700&family=Allerta+Stencil&display=swap');
@import url('https://fonts.googleapis.com/css2?family=ADLaM+Display&family=Agdasima:wght@400;700&family=Allerta+Stencil&family=Audiowide&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Mrs+Sheppards&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Mr+Dafoe&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Righteous&display=swap');


@font-face {
	font-family: "Now";
	src: url("../fuentes/now-font-family-1737985224-0/Now-Light-BF6542f7137fce2.otf") format("opentype");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "Now-Medium";
	src: url("../fuentes/now-font-family-1737985224-0/Now-Medium-BF6542f7137648d.otf") format("opentype");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "Now-black";
	src: url("../fuentes/now-font-family-1737985224-0/Now-Black-BF6542f712baf72.otf") format("opentype");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "Now-bold";
	src: url("../fuentes/now-font-family-1737985224-0/Now-Bold-BF6542f7138a8d2.otf") format("opentype");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: "AZONIX";
	src: url("../fuentes/AZONIX.OTF") format("opentype");
	font-weight: normal;
	font-style: normal;
}

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
/*
html {
	scroll-behavior: smooth;
}
*/
.my-container {
	height: 100vh;
	overflow-y: scroll;
	/*
	scroll-snap-type: y mandatory;
	*/
	position: relative;
}

.my-container::-webkit-scrollbar {
	display: none;
}

.my-container {
	-ms-overflow-style: none;
	scrollbar-width: none;
}

.barra-superior {
	display: flex;
	height: 16.11vh;
	justify-content: space-between;
	align-items: center;
	color: white;
	padding: 2vh 5vh;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1000;
	pointer-events: none;
}

.barra-superior .barra-zone-left {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	margin: 0%;
	padding: 0%;
	pointer-events: all;
}

.barra-superior .barra-zone-right{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 25px;
	border-radius: 25px;
	padding: 5px 20px;
	position: relative;
	pointer-events: all;
}

.barra-superior .barra-zone-right.disign-one{
	background: rgba(255, 255, 255, 0.2);
	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
	border: 1px solid rgba(255, 255, 255, 0.5);
}


.barra-superior .barra-zone-right.disign-two{
	background: rgba(220, 220, 220);
	box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
}

.barra-superior a {
	text-decoration: none;
	position: relative;
	transition: all 0.4s ease;
}

.barra-superior .barra-zone-right.disign-one a,
.barra-superior .barra-zone-right.disign-one button,
.barra-superior .barra-zone-right.disign-one button svg {
	color: white;
	fill: white;
}

.barra-superior .barra-zone-right.disign-two a,
.barra-superior .barra-zone-right.disign-two button,
.barra-superior .barra-zone-right.disign-two button svg {
	color: rgb(100, 100, 100);
	fill: rgb(100, 100, 100);
}


.barra-superior .barra-zone-right > * {
	flex: 0 0 auto;
  	font-family: "Righteous";
	font-size: 2.5vh;
}

.barra-superior .barra-zone-right > a:not(:last-child):not(:nth-last-child(2)),
.barra-superior .barra-zone-right > button:not(:last-child):not(:nth-last-child(2)) {
	padding-right: 25px;
}

.barra-superior .barra-zone-right.disign-one > a:not(:last-of-type):not(:nth-last-of-type(2)),
.barra-superior .barra-zone-right.disign-one > button:not(:last-of-type):not(:nth-last-of-type(2)) {
    border-right: 2px solid rgba(255, 255, 255, 0.5);
}

.barra-superior .barra-zone-right.disign-two > a:not(:last-of-type):not(:nth-last-of-type(2)),
.barra-superior .barra-zone-right.disign-two > button:not(:last-of-type):not(:nth-last-of-type(2)) {
    border-right: 2px solid rgb(100, 100, 100);
}

/*
.barra-superior .barra-zone-right.disign-one > a:not(:last-child):not(:nth-last-child(2)),
.barra-superior .barra-zone-right.disign-one > button:not(:last-child):not(:nth-last-child(2)) {
	border-right: 2px solid rgba(255, 255, 255, 0.5);
}

.barra-superior .barra-zone-right.disign-two > a:not(:last-child):not(:nth-last-child(2)),
.barra-superior .barra-zone-right.disign-two > button:not(:last-child):not(:nth-last-child(2)) {
	border-right: 2px solid rgb(100, 100, 100);
}
*/

.barra-superior .barra-zone-right .button-login {
	background-color: rgb(194, 74, 74);
	box-shadow: inset 0px -83px 73px -28px rgba(0, 0, 0, 0.2);
	font-size: 30px;
	border-radius: 50%;
	transition: all 0.4s;
	height: 5vh;
	aspect-ratio: 1 / 1;
	padding: 1vh;
	display: flex;
	text-align: center;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.barra-superior .barra-zone-right .button-login svg{
	height: 100%;
	width: 100%;
	padding: 0%;
	margin: 0%;
}

.barra-superior .barra-zone-right .button-login:hover {
	background: linear-gradient(to right, #8D2626, rgb(26, 111, 207));
	color: white;
}

.barra-superior .barra-zone-right.disign-one a:hover,
.barra-superior .barra-zone-right.disign-one button:hover{
	text-shadow: 0 0 10px rgb(255, 255, 255);
}

.barra-superior .barra-zone-right.disign-two a:hover,
.barra-superior .barra-zone-right.disign-two button:hover,
.barra-superior .barra-zone-right.disign-two button:hover svg{
	color: rgb(0, 51, 88);
	fill: rgb(0, 51, 88);
}

.button-services-modal{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	outline: none;
	border: none;
	font-size: 1.3vw;
	background-color: transparent;
	transition: all 0.4s ease;
}

.button-services-modal .arrow{
	height: 2vh;
	transform: rotate(90deg);
	transition: all 0.4s ease;
}

.button-services-modal .arrow.rotated {
    transform: rotate(0deg);
}

/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/

.dropdown-container {
    position: absolute;
    bottom: -12vh;
    left: 50%;
    transform: translateX(0%);
    width: 92%;
    border-radius: 15px;
    padding: 1.5vh 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    opacity: 0;
    transition: all 0.4s ease;
    z-index: 999;
    pointer-events: none;
}

.barra-superior .barra-zone-right.disign-one .dropdown-container{
	background: rgb(26, 111, 207);
	/*
	border: 1px solid white;
	box-shadow: 
        0 0 3px white,
        0 0 2px white;
	*/
}

.barra-superior .barra-zone-right.disign-one .dropdown-container ul li:not(:last-child){
	border-right: 2px solid rgba(0, 0, 0, 0.25);
}

.barra-superior .barra-zone-right.disign-one .dropdown-container ul li a,
.barra-superior .barra-zone-right.disign-one .dropdown-container button{
	color: white;
	border: 2px solid rgb(26, 111, 207);
}

.barra-superior .barra-zone-right.disign-one .dropdown-container ul li a:hover{
	border: 2px solid white;
	box-shadow: 
        0 0 3px white,
        0 0 2px white,;
}

.barra-superior .barra-zone-right.disign-two .dropdown-container{
	background: rgb(35, 87, 126);
}

.barra-superior .barra-zone-right.disign-two .dropdown-container ul li:not(:last-child){
	border-right: 2px solid white;
}

.barra-superior .barra-zone-right.disign-two .dropdown-container ul li a,
.barra-superior .barra-zone-right.disign-two .dropdown-container button{
	color: white;
	border: 2px solid rgb(35, 87, 126);
}

.barra-superior .barra-zone-right.disign-two .dropdown-container svg{
	fill: white;
}

.barra-superior .barra-zone-right.disign-two .dropdown-container ul li a:hover{
	border: 2px solid white;
	box-shadow: 
        0 0 3px white,
        0 0 2px white;
		/*
        inset 0 0 3px white,
        inset 0 0 2px white;
		*/
}

.dropdown-container.active {
    opacity: 1;
    transform: translateX(-50%);
    pointer-events: auto;
}

.dropdown-container ul {
    list-style: none;
    display: flex;
    gap: 5px;
    margin: 0;
    padding: 0;
    overflow-x: auto;
    overflow-y: hidden;
    flex: 1;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.dropdown-container ul::-webkit-scrollbar {
    display: none;
}

.dropdown-container ul li {
    flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

/* Solo desactiva clicks mientras arrastro */
.dropdown-container ul.dragging li a {
    pointer-events: none;
}

.dropdown-container ul li a {
    display: inline-block;
    white-space: nowrap;
	border-radius: 10px;
    padding: 5px 5px;
    text-align: left;
	line-height: 1;
}

.dropdown-container ul li:not(:last-child) {
	padding-right: 5px;
}

/* flechas */
.scroll-btn {
    background: transparent;
    border: none;
    font-size: 4vh;
    cursor: pointer;
    padding: 0.1vh 3vh;
    user-select: none;
    transition: opacity 0.3s;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.scroll-btn:hover {
    opacity: 0.7;
}

.scroll-btn svg{
	height: 3vh;
}

.scroll-btn.left{
	transform: rotate(90deg);
}

.scroll-btn.right{
	transform: rotate(-90deg);
}

/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/
/*----------------------------------------------------------------------------------------------------*/

.button-nav-responsiv{
	display: none;
	outline: none;
	border: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background-color: transparent;
	padding: 0%;
	margin: 0;
	pointer-events: all;
}

.button-nav-responsiv img{
	height: 8vh;
}

.dropdown-menu {
    display: none;
    position: absolute;
    right: 0; /* Alinea a la derecha del botón */
    top: 100%; /* Posiciona debajo del botón */
    background-color: rgb(128, 40, 49);
	color: white;
    width: 50%;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1000;
    border-radius: 4px;
    overflow: hidden;
	margin-left: 39%;
	border-radius: 20px 0px 20px 20px;
	font-family: "Now";
	font-size: 5vw;
	pointer-events: all;
}

.dropdown-menu a {
    color: white;
    padding: 12px 16px;
	font-size: 5vw !important;
    text-decoration: none;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

/* Clase para mostrar el menú */
.show {
    display: block;
}

.logo-side-image{
	z-index: 1;
	/*
	width: 10vw;
	*/
	height: 9vh;
	
}

.country{
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	gap: 1vh;
}


.country a{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background-color: white;
	padding: 15px 10px;
	margin: 0% !important;
	border-radius: 10px;
	box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
}

.country a img{
	border-radius: 4px;
	height: 2vh;
	/*
	box-shadow: rgba(0, 0, 0, 0.09) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
	*/
}

.country div{
	height: 10vh;
	width: 1px;
	background-color: rgb(200, 200, 200);
}

.barra-superior .barra-zone-left .logo {
	background-color: white;
	border-radius: 50px;
	padding: 10px 20px;
	display: flex;
	text-align: center;
	align-items: center;
	justify-content: center;
	box-shadow:
		0px 5px 10px rgba(0, 47, 255, 0.7),
		0px -5px 10px rgba(255, 0, 0, 0.7);
	transition: all 0.2s;
	z-index: 3;
}

.barra-superior .logo svg {
	height: 5vh;
}

.cls-1 {
	fill: #d1190d;
}

.cls-1,
.cls-2 {
	stroke-width: 0px;
}

.cls-3 {
	fill: none;
	stroke: #202d89;
	stroke-miterlimit: 10;
	stroke-width: 2.01px;
}

.cls-2 {
	fill: #202d89;
}

.logo:hover {
	transform: scale(1.1);
}

.section {
	padding: 0%;
	margin: 0%;
	height: 100vh;
	scroll-snap-align: start;
	font-family: Arial, sans-serif;
	font-size: 2rem;
	color: white;
	overflow: hidden;
	position: relative;
	width: 100%;
}


#section1 {
	/*
		background-image: 

		radial-gradient(circle at 58.7% 30.5%, rgb(14, 50, 91) 0%, rgb(14, 50, 91) 2vh, transparent 2vh),
		radial-gradient(circle at 23.7% 20%, rgb(14, 50, 91) 0%, rgb(14, 50, 91) 2vh, transparent 2vh),
		radial-gradient(circle at 27.5% 90.1%, rgb(14, 50, 91) 0%, rgb(14, 50, 91) 2vh, transparent 2vh),
		radial-gradient(circle at 92.3% 31.9%, rgb(14, 50, 91) 0%, rgb(14, 50, 91) 2vh, transparent 2vh),
		radial-gradient(circle at 90.4vh 50.7vh, rgb(14, 50, 91) 0%, rgb(14, 50, 91) 2vh, transparent 2vh),

		repeating-linear-gradient(75deg, rgb(14, 50, 91) 0 2px, transparent 2px 10vh),
		repeating-linear-gradient(-15deg, rgb(14, 50, 91) 0 2px, transparent 2px 10vh);
	
	background-color: rgb(3, 38, 81);
	background-image:
		radial-gradient(circle at 45.7% 42.9%, rgb(14, 50, 91) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 53.3% 60.4%, rgb(14, 50, 91) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 43.4% 65.9%, rgb(14, 50, 91) 0 1.8vh, transparent 1.8vh),
		repeating-linear-gradient(75deg, rgb(14, 50, 91) 0 2px, transparent 2px 4.7%),
		repeating-linear-gradient(-15deg, rgb(14, 50, 91) 0 2px, transparent 2px 7%);
	background-size: 100% -100%;
	*/
	position: relative;
	display: flex;
	align-items: flex-end;
	justify-content: center;
}

.social-media-zone{
	position: absolute;
	top: 5vh;
	left: 30vw;
	z-index: 10; 
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}

.social-media-zone .social-red{
	height: 6vh;
	background-color: white;
	border-radius: 50%;
	padding: 10px;
	aspect-ratio: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.social-media-zone .social-red img{
	height: 100%;
}

.section1-content{
	height: auto;
	width: 100%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: flex-end;
}

.section1-content-one,
.section1-content-five {
    flex: 0 0 100%;
    text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}

.section1-content-one *{
	margin: 0%;
	padding: 0%;
}

.section1-content-one img{
	height: 20vh;
}

.section1-content-two,
.section1-content-three,
.section1-content-four {
	position: relative;
    flex: 0 0 auto;
	height: 45vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content:end;
	overflow: hidden;

}

.section1-content-two{
	padding: 0% 15px;
}

.section1-content-two .content-two-zone{
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	border: 2px solid white;
	border-bottom: none;
	padding: 5vh 30px;
	border-radius: 35px 35px 0px 0px;
}

.section1-content-two .content-two-zone .floating-title{
	position: absolute;
	top: 0;
	transform: translateY(-50%);
	font-family: "Now";
	font-size: 4vh;
	line-height: 1;
	padding-left: 15px;
	border: 2px solid white;
	border-radius: 50px;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	gap: 10px;
	z-index: 1;
	background: rgb(14, 50, 91);
}

.section1-content-two .content-two-zone .floating-title span{
	background-color: white;
	border-radius: 50px 0px 0px 50px;
	color: rgb(32, 97, 181);
	padding: 10px 15px;
	font-family: "Now-bold";
}

.section1-content-two .content-two-zone .content-two-zone-text-one,
.section1-content-two .content-two-zone .content-two-zone-text-two{
	font-size: 3vh;
}

.section1-content-two .content-two-zone .content-two-zone-text-one{
	font-family: "Righteous";
}

.section1-content-two .content-two-zone .content-two-zone-text-two{
	font-family: "Now";
}

.section1-content-three{
	width: 38vw;
	border-radius: 50% 50% 0% 0%;
	position: relative;
}

.section1-content-three video{
	position: absolute;
	bottom: -48vh;
	left: 50%;
	transform: translateX(-50%);
	height: 115vh;
	mix-blend-mode: screen;
	transition: all 0.4s;
}

.section1-content-four{
	gap: 20px;
	padding: 0% 15px;
	overflow: visible;
}

.section1-content-four .content-four-zone-one{
	color: white;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 40px;
}

.section1-content-four .content-four-zone-one .four-zone-one-data{
	position: relative;
	flex: 0 0 auto;
	padding-bottom: 15px;
	transition: all 0.4s ease;
}

.section1-content-four .content-four-zone-one .four-zone-one-data::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 2px;
	background: white;
	border-radius: 2px;
	pointer-events: none;
	transition: all 0.4s ease;
}

.section1-content-four .content-four-zone-one .four-zone-one-data *{
	margin: 0%;
	padding: 0%;
	text-align: left;
}

.section1-content-four .content-four-zone-one .four-zone-one-data:hover{
	padding-right: 20px;
}

.section1-content-four .content-four-zone-one .four-zone-one-data:hover::after {
	box-shadow: 0 0 7px 4px rgba(255, 255, 255, 0.7);
}


.section1-content-four .content-four-zone-one .four-zone-one-data h1{
	font-family: "Righteous";
	font-size: 6vh;
	transition: all 0.4s ease;
}

.section1-content-four .content-four-zone-one .four-zone-one-data p{
	font-family: "Now";
	line-height: 1;
	font-size: 3.5vh;
	transition: all 0.4s ease;
}

.section1-content-four .content-four-zone-one .four-zone-one-data:hover h1{
	text-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
}

.section1-content-four .content-four-zone-one .four-zone-one-data:hover p{
	text-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
}

.section1-content-four .content-four-zone-two{
	color: white;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	border: 2px solid white;
	border-bottom: none;
	border-radius: 35px 35px 0px 0px;
	padding: 15px 25px;
	text-decoration: none;
	transition: all 0.4s ease;
}

.section1-content-four .content-four-zone-two h1{
	font-family: "Now";
	text-align: center;
	font-size: 6vh;
	margin: 0%;
	padding: 0%;
	transition: all 0.4s ease;
}

.section1-content-four .content-four-zone-two h1 span{
	font-family: "Righteous";
}

.section1-content-four .content-four-zone-two svg{
	height: 5vh;
	fill: white;
	margin-top: 10px;
	transition: all 0.4s ease;
}

.section1-content-four .content-four-zone-two:hover {
  	box-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
	padding-bottom: 40px;
}

.section1-content-four .content-four-zone-two:hover h1{
	text-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
}

.section1-content-four .content-four-zone-two:hover svg {
  	filter: drop-shadow(0 0 10px rgba(255, 255, 255, 0.8));
}

.section1-content-five{
	padding: 15px;
	background-color: #23608E;
	box-shadow: inset 0px -83px 73px -28px rgba(0, 0, 0, 0.3);
	gap: 20px;
}

.section1-content-five .content-five-one-title{
	text-align: right;
	font-family: "Now";
	font-size: 5vh;
	padding: 0%;
	margin: 0%;
	line-height: 0.8;
}

.section1-content-five .content-five-one-title span{
	font-family: "Now-black";
}

.section1-content-five .content-five-one-title span:first-of-type {
	text-shadow: 0 0 10px rgba(255, 255, 255, 0.8);
}

.section1-content-five .content-five-two-title{
	margin: 0%;
	text-align: left;
	font-family: "Righteous";
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: white;
	border-radius: 50px;
	color: rgb(32, 97, 181);
	font-size: 7vh;
	padding: 0;
	gap: 20px;
	padding-left: 80px;
	cursor: pointer;
}

.section1-content-five .content-five-two-title .five-two-title-subtitle{
	font-size: 2.5vh;
	padding: 10px 70px;
	margin-left: 20px;
	color: white;
	border-radius: 50px;
	background-color: rgb(32, 97, 181);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	transition: all 0.4s ease;
}

.section1-content-five .content-five-two-title .five-two-title-subtitle:hover{
	box-shadow: rgba(32, 97, 181, 0.8) 0px 0px 20px 10px;
	margin-left: 40px;
}

.section1-content-five .content-five-two-title .five-two-title-subtitle .word-one{
	font-family: "Now";
}

.section1-content-five .content-five-two-title .five-two-title-subtitle .word-two{
	font-family: "Now";
	font-family: "Now-black";
	font-size: 3vh;
}

#section2 {
	/*
	background-color: rgb(3, 38, 81);
	background-image:
		radial-gradient(circle at 50% 50%, rgba(120, 140, 255, 0.47) 0 10vh, transparent 50vh),
		radial-gradient(circle at 45.7% 42.9%, rgb(14, 50, 91) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 53.3% 60.4%, rgb(14, 50, 91) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 43.4% 65.9%, rgb(14, 50, 91) 0 1.8vh, transparent 1.8vh),
		repeating-linear-gradient(75deg, rgb(14, 50, 91) 0 2px, transparent 2px 4.7%),
		repeating-linear-gradient(-15deg, rgb(14, 50, 91) 0 2px, transparent 2px 7%);
	background-size: 100% -100%;
	*/
	height: auto;
	/*
	background: radial-gradient(circle 50vh at 50% 50%, #1d4e84, #021b3a);
	*/
}

@keyframes scroll {
	0% {
		transform: translateX(0);
	}
	100% {
		/* Este valor debe ajustarse según el número de imágenes */
		transform: translateX(-1250px); /* 5 imágenes × 250px */
	}
}

@keyframes slide {
	from {
		transform: translateX(0);
	}

	to {
		transform: translateX(-100%);
	}
}

.rotating-image {
    position: absolute;
    bottom: -10vh;
    left: 50%;
    transform-origin: bottom center;
    transform: translateX(-50%);
    width: auto;
    height: 70vh; 
    z-index: 990;
    pointer-events: none;
	opacity: 0.5;
    animation: rotate-pendulum 5s infinite ease-in-out alternate; 
    -webkit-mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
    mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0) 100%);
	transition: all 0.3s ease;

}

@keyframes rotate-pendulum {
    0% {
        transform: translateX(-50%) rotate(-15deg); /* Rotación a la izquierda */
    }
    100% {
        transform: translateX(-50%) rotate(15deg); /* Rotación a la derecha */
    }
}

.gangway {
	width: 100%;
	position: relative;
	display: flex;
	align-items: end;
	justify-content: center;
	height: 100vh;
	-webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) 100%);
	mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 20%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 0) 100%);
	z-index: 2;
}

.gangway-context{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	position: absolute;
	top: 40%; /* antes estaba en 50% */
	left: 50%;
	transform: translate(-50%, -50%);
	color: white;
	border: 2px solid white;
	border-radius: 30px;
	width: 60%;
	padding-top: 30px;
}

.gangway-context *{
	padding: 0%;
	margin: 0%;
}

.gangway-context h1{
	font-family: "Righteous";
	font-weight: normal;
	font-size: 6vh;
	text-transform: uppercase; 
	text-shadow: 0 0 10px rgb(255, 255, 255);
}

.gangway-context p {
	position: absolute;
	top: -3vh;
	left: 50%;
	transform: translateX(-50%);
	font-family: "Now";
	font-size: 4vh;
	background-color: rgb(128, 40, 49);
	border: 1px solid white;
	padding: 0px 30px;
	border-radius: 50px;
}

.gangway-context p span{
	padding: 0%;
	margin: 0;
	font-family: "Now-bold";
}

.splide{
	width: 100%;
}

.splide__track{
	overflow: visible;
}

.splide-secondary{
	position: absolute;
	top: 17vh;
	width: 100%;
}

.splide-secondary .splide__slide{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.splide-secondary .splide__slide img{
	height: 4.5vh;       /* Todas mismas alturas */
	width: auto;       /* Escala proporcional */
	object-fit: contain;
}

.splide-secondary .splide__slide img:hover {
    filter: brightness(1.8) drop-shadow(0 0px 5px rgba(255, 255, 255, 0.7));
}

.splide-primary{
	position: relative;
}

.splide-primary .splide__slide {
    display: flex;
    justify-content: center;
    align-items: center;
	align-self: flex-end;
	border: 2px solid rgb(134, 134, 134);
	box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
	background-color: white;
    border-radius: 50px;
    height: 40vh;
	width: 30vh;
	overflow: hidden;
  	filter: brightness(0.5);
	transition: all 0.4s ease;
}

.splide-primary .splide__slide.is-active{
	height: 50vh;
	filter: brightness(1);
	z-index: 2;
}

.splide-primary .splide__slide.is-active .service-context-data video {
	height: 35vh;
}

.my-arrow {
	position: absolute;
	top: 40.6%;
	transform: translateY(-50%);
	background: none;
	border: none;
	cursor: pointer;
	z-index: 10;
}

.my-arrow svg{
	fill: white;
	filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.8));
	height: 9vh;
}

.my-prev {
	left: 25vh;
}

.my-prev svg{
	transform: rotate(90deg);
}

.my-next {
	right: 25vh;
}

.my-next svg{
	transform: rotate(-90deg);
}

.service {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	transition: all 0.5s ease;
}

.service-context-data {
	width: 100%;
	height: 100%;
	border-radius: 35px;
	display: flex;
	flex-direction: column;
	justify-content: end;
	padding-bottom: 3vh;
	align-items: center;
	position: relative;
}

.service-context-data video {
	position: absolute;
	width: 100%;
	height: 25vh;
	top: 0;
	object-fit: cover;
	transition: all 0.4s ease;
}

.service-context-data .interaction-service-zone{
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	background-color: rgb(158, 47, 47);
	width: 100%;
	font-family: "Righteous";
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 20px;
	text-align: center;
	padding: 10px 10px 20px 10px;
	border-radius: 20px 20px 0px 0px;
}

.service-context-data h3 {
	font-size: 3vh;
	margin: 0%;
	padding: 0%;
	color: white;
	width: 100%;
}

.service-context-data button {
	position: relative;
	color: white;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	text-align: left;
	font-size: 2.2vh;
	width: 82%;
	border: none;
	outline: none;
	background-color: rgb(158, 47, 47);
	border: 1px solid white;
	border-radius: 10px;
	padding: 0px;
	padding-left: 4.4vh;
	transition: all 0.4s ease;
}

.service-context-data button .design-details{
	position: absolute;
	left: 0; /* pegado a la izquierda */
	top: 50%; /* centrado verticalmente */
	transform: translate(-50%, -50%);
	border-radius: 50%;
	height: 5vh;
	aspect-ratio: 1 / 1;
	background-color: white;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	line-height: 1;

}

.service-context-data button .design-details svg{
	fill: rgb(158, 47, 47);
	height: 50%;
	transform: rotate(-90deg);
}

.service-context-data button h1{
	font-family: 'Now';
	font-size: 2vh;
	background-color: rgb(158, 47, 47);
	margin: 0%;
	margin-bottom: -5px;
	padding: 0%;
}

.service-context-data button:hover {
	filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.8));
}


.section2-details {
	position: absolute;
	bottom: 0;
	width: 100%;
	border: 1px solid red;
	z-index: 1;
}

.section2-details .col-md-3 {
	border: 1px solid blue;
	display: flex;
	align-items: center;
	justify-content: end;
}

.section2-details video {
	mix-blend-mode: screen;
	width: 100%;
}

.modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	display: none;
	justify-content: center;
	align-items: center;
	z-index: 1000;
}

/* Estilos para el contenido del modal */
.modal-content {
	background-color: rgb(7, 25, 55);
    /* rgb(43, 61, 91) */
	width: 80%;
	height: 73vh;
	border-radius: 50px;
	border: 10px solid rgb(100, 100, 100);
	padding: 20px;
	position: relative;
	transform: scale(0.1);
	opacity: 0;
	transition: transform 0.4s ease-in-out, opacity 0.3s ease;
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: center;
}

/* Clase para aplicar la animación de entrada */
.modal-content.active {
	transform: scale(1);
	opacity: 1;
}

.modal-content video{
	display: block;
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    height: 60vh;
    width: 20vw;
	object-fit: cover;
	border-radius: 50px;
	border: 10px solid rgb(100, 100, 100);
}

.modal-content .modal-content-data {
	background-color: rgb(43, 61, 91);
	height: 80%;
	width: 77%;
	border-radius: 70px;
	padding: 0% 5% 0% 5%;
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: start;
	font-family: "Now";
}

.close-modal {
	position: absolute;
	top: 10px;
	right: 20px;
	font-size: 24px;
	cursor: pointer;
	background: none;
	border: none;
}

.modal-title {
	font-family: "Now-black";
	font-size: 5vh;
	margin-top: 20px;
	text-align: center;
	letter-spacing: -2px;
	line-height: 0.9; 
}

.modal-body {
	margin: 5px 0;
	font-size: 1.2vw;
}

.modal-body::-webkit-scrollbar {
    width: 8px;
}

.modal-body::-webkit-scrollbar-thumb {
    background: rgb(150, 150, 150);
    border-radius: 4px;
}

.modal-body strong{
	background-color: rgb(158, 47, 47);
	padding: 1px 30px 1px 2px;
	color: white;
	font-family: "Now-bold";
}

.modal-body .row .col-md-12{
	padding: 0%;
}

.modal-body .row .col-md-12 .col-md-4,
.modal-body .row .col-md-12 .col-md-6 {
	margin-top: 10px;
}

.modal-body .row .col-md-12 .col-md-4 img,
.modal-body .row .col-md-12 .col-md-6 img{
	width: 100%;
}

.button-direct-footer {
	text-decoration: none;
	border-radius: 7px;
	background-color: rgb(158, 47, 47);
	border: 1px solid white;
	padding: 1px 10px;
	color: white;
    position: absolute;
    bottom: 10%;
    left: 23%;
    transform: translateX(50%);
	font-family: "Righteous";
	font-size: 1.5vw;
	transition: all 0.4s ease;

}

.button-direct-footer:hover {
	text-decoration: none;
	color: white;
	box-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}

.certification-zone{
	position: relative;
	width: 100%;
	margin-top: -15px;
	height: 14vh;
	z-index: 10;
	background-color: #23608E;
	box-shadow: inset 0px -83px 73px -28px rgba(0, 0, 0, 0.3);
	color: white;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 40px;
}

.certification-zone *{
	padding: 0%;
	margin: 0%;
}

.certification-zone .cert-zone-one{
	text-align: right;
}

.certification-zone .cert-zone-one h1{
	font-family: "Now-black";
	letter-spacing: -1px;
	font-size: 6vh;
}

.certification-zone .cert-zone-one p{
	margin-top: -10px;
	font-family: "Now-Medium";
	font-weight: normal !important;
	font-size: 3vh;
}

.certification-zone .cert-zone-two{
	text-align: left;
	height: 8vh;
}

.certification-zone .cert-zone-two img{
	height: 100%;
}

#section3 {
	/*
	background-color: rgb(3, 38, 81);
	background-image:
		radial-gradient(circle at 45.7% 42.9%, rgb(14, 50, 91) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 53.3% 60.4%, rgb(14, 50, 91) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 43.4% 65.9%, rgb(14, 50, 91) 0 1.8vh, transparent 1.8vh),
		repeating-linear-gradient(75deg, rgb(14, 50, 91) 0 2px, transparent 2px 4.7%),
		repeating-linear-gradient(-15deg, rgb(14, 50, 91) 0 2px, transparent 2px 7%);
	background-size: 100% -100%;
	
	background: radial-gradient(circle 100vh at 0% 50%, #1d4e84, #021b3a);
	*/
	position: relative;
	height: auto;
}

.section3-content {
	width: 100%;
	height: 40vh;
	display: flex;
	align-items: center;
	justify-content: center;
}

.section3-content-one {
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	padding-left: 20vh;
}

.section3-content-one *{
	padding: 0%;
	margin: 0%;
}

.section3-content-one .title-success-one {
	font-family: "Now-Medium";
	font-size: 6vh;
	margin-bottom: -4vh;
}

.section3-content-one .title-success-two{
	font-family: "Now-black";
	font-size: 12vh;
}

.section3-content-one .title-success-three{
	font-family: "Righteous";
	background-color: rgb(149, 47, 47);
	padding: 0px 120px 0px 30px;
	border-radius: 50px;
	font-size: 4vh;
}

.section3-content-two {
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items:flex-end;
	justify-content: center;
	padding-right: 20vh;
}

.section3-content-two button{
	border: none;
	outline: none;
	background-color: transparent;
	color: white;
	font-size: 5vh;
	font-family: "Now";
	border-bottom: 2px solid white;
	text-align: right;
	min-width: 40%;
	transition: all 0.4s ease;
}

.section3-content-two button.active {
	text-shadow: 0 0 10px rgb(255, 255, 255);
	font-weight: 900;
}

.section3-content-two button:hover{
	text-shadow: 0 0 10px rgb(255, 255, 255);
	font-weight: 900;
}

.info-card-success{
	padding: 0px 20vh 5vh;
	height: 60vh;
}

.card {
	position: relative;
    width: 100%;
    height: 100%;
    background-color: white;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    border-radius: 60px;
    transition: bottom 0.5s ease-in-out;
    z-index: 4;
	padding: 0%;
	margin: 0%;
}

.card .card-content {
	position: relative;
    height: 100%;
    display: flex;
    align-items: center;
	justify-content: center;
    font-family: "Now-black";
}

.info-card-row {
	padding: 0%;
	height: 100%;
	font-family: "Righteous";
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	border: 1px;
}

.info-card-row-one {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 0px 40px;
	width: 25%;
}

.title-card-zone-map {
    padding: 0px;
    margin: 0;
	color: rgb(187, 54, 54);
	font-size: 4vh;
	width: 100%;
	text-align: center;
	font-family: "Righteous";
}

.info-card-cities {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100%;
	width: 100%;
}

.info-card-cities h1 {
	border: 2px solid rgb(158, 47, 47);
	color: rgb(158, 47, 47);
	padding: 0 10px;
	margin: 20px 0px 20px 0px;
	border-radius: 15px;
}
.info-card-cities button {
	width: 100%;
	outline: none;
	border: none;
	background-color: transparent;
	color: rgb(150, 150, 150);
	border-bottom: 1px solid rgb(150, 150, 150);
	margin-bottom: 5px;
}

.info-card-cities button:hover {
	color: white;
	background-color: rgb(158, 47, 47);
	border-radius: 50px;
}

.info-card-cities button.active {
    background-color: rgb(158, 47, 47);
    color: white;
    border-color: rgb(158, 47, 47);
	border-radius: 50px;
}

.info-card-cities button:focus {
	color: white;
	background-color: rgb(158, 47, 47);
	border-radius: 50px;
}

.card .card-content .info-card-main {
	padding: 0%;
	height: 100%;
	width: 75%;
	display: flex;
}

.card .card-content .info-card-main .info-card-slider-col {
	height: 100%;
	width: 41.66%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
}

.card .card-content .info-card-main .info-card-slider-col .relojk-mask {
	height: 100%;
	z-index: 2;
}

.image-slider {
	position: relative;
    width: 100%;
    height: 100%;
	z-index: 1;
    overflow: hidden;
	background-color: rgb(158, 47, 47);
}

/* Imágenes de fondo */
.bg-img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 90%;
    border-radius: 20px;
    opacity: 0;
    transition: all 1s ease-in-out;
    box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 2px,rgba(0, 0, 0, 0.07) 0px 2px 4px,rgba(0, 0, 0, 0.07) 0px 4px 8px,rgba(0, 0, 0, 0.07) 0px 8px 16px,rgba(0, 0, 0, 0.07) 0px 16px 32px,rgba(0, 0, 0, 0.07) 0px 32px 64px;
    object-fit: contain;  
}

.bg-img.active {
    opacity: 1;
	z-index: 2;
}

.main-img {
    position: relative;
    z-index: 3;
    max-width: 100%;
    height: auto;
}

.card .card-content .info-card-main .info-card-solutions-col {
	height: 100%;
	width: 58.33%;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: start;
	padding: 0px 40px;
}

.card .card-content .info-card-main .info-card-solutions-col h1 {
	background-color: rgb(158, 47, 47);
	width: 100%;
	padding: 0 10px;
	font-size: 3vh;
	border-radius: 50px;
	padding: 4px 0px;
	color: white;
}

.card .card-content .info-card-main .info-card-solutions-col .info-card-solutions-container {
	padding: 0%; 
	padding-top: 25px;
	overflow-y: auto;
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}

.card .card-content .info-card-main .info-card-solutions-col .info-card-solutions-container::-webkit-scrollbar {
    width: 8px;
}

.card .card-content .info-card-main .info-card-solutions-col .info-card-solutions-container::-webkit-scrollbar-thumb {
    background: rgb(150, 150, 150);
    border-radius: 4px;
}

.card .card-content .info-card-main .info-card-solutions-col .col-md-4 {
	padding: 4px;
	margin-bottom: 10px;
	width: 33.33%;
}

.card .card-content .info-card-main .info-card-solutions-col .zone-solution-context {
	border-radius: 7px;
	padding: 5px;
	background-color: white;
	box-shadow: rgba(9, 30, 66, 0.25) 0px 4px 8px -2px, rgba(9, 30, 66, 0.08) 0px 0px 0px 1px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
}

.card .card-content .info-card-main .info-card-solutions-col .zone-solution-context .zone-serv-img {
	background-color: rgb(158, 47, 47);
	border-radius: 50%;
	width: 50px;
	height: 50px;
	padding: 5px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin-top: -30px;
}

.card .card-content .info-card-main .info-card-solutions-col .zone-solution-context .zone-serv-img img {
	width: 70%;
}

.card .card-content .info-card-main .info-card-solutions-col .zone-solution-context p {
	color: rgb(158, 47, 47);
	border-top: 1px solid rgb(100, 100, 100);
	font-family: "Righteous";
	font-size: 1.6vh;
	padding: 0%;
	margin: 0%;
	line-height: 1.1;
	margin-top: 5px;
	padding-top: 5px;
}

.card .card-content .info-card-main .info-card-solutions-col .zone-solution-context p span {
	color: rgb(100, 100, 100);
	font-family: "Righteous";
	padding: 0%;
	margin: 0%;
}

.card.show {
	left: 0;
}

/*
.st0 {
	fill: none;
	stroke: #F8FBF8;
	stroke-miterlimit: 10;
}

.st1 {
	fill: none;
	stroke: #F8FBF8;
	stroke-width: 3.7331;
	stroke-miterlimit: 10;
}

.st3 {
	fill: none;
	stroke: #F8FBF8;
	stroke-width: 1.8666;
	stroke-miterlimit: 10;
}

.st2,
.st4,
.st5 {
	fill: rgba(0, 0, 0, 0);
	stroke: #F8FBF8;
	stroke-width: 3.7331;
	stroke-miterlimit: 10;
	fill-opacity: 0;
	transition: all 0.4s ease-out;
	cursor: pointer;
}

.st2:hover {
	fill: url(#repu_dominicada);
	fill-opacity: 1;
}

.st4:hover {
	fill: url(#ecuador);
	fill-opacity: 1;
}

.st5:hover {
	fill: url(#colombia);
	fill-opacity: 1;
}
*/

#section4 {
	position: relative;
	background-color: white;
	background-image:
		radial-gradient(circle at 45.7% 42.9%, rgb(235, 235, 235) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 53.3% 60.4%, rgb(235, 235, 235) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 43.4% 65.9%, rgb(235, 235, 235) 0 1.8vh, transparent 1.8vh),
		repeating-linear-gradient(75deg, rgb(235, 235, 235) 0 2px, transparent 2px 4.7%),
		repeating-linear-gradient(-15deg, rgb(235, 235, 235) 0 2px, transparent 2px 7%);
	background-size: 100% -100%;
}

.background-image-section4 {
	display: none;
	position: absolute;
	opacity: 0.5;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 1;
}

#section4 .context {
	background-color: rgb(187, 54, 54);
	position: absolute;
	top: 20px;
	width: 100%;
	text-align: center;
	z-index: 2;
}

#section4 .context h1 {
	background-color: rgb(187, 54, 54);
	padding: 10px 0px;
	margin: 0%;
	width: 100%;
	font-size: 70px;
	font-family: "Righteous";
	font-weight: normal;
	text-align: center;
	z-index: 2;
}

footer {
	color: white;
	/* Color de texto */
	padding: 0;
	text-align: center;
	justify-content: center;
	width: 100%;
	position: absolute;
	bottom: 0;
	z-index: 2;
}

.zone-section-data {
	display: flex;
	height: 43vh;
	width: 100%;
	align-items: center;
	justify-content: center;
	gap: 50px;
}

.zone-section-data .zone-write-to-us {
	height: 100%;
	background-color: rgb(3, 32, 58);
	border-radius: 40px 40px 0px 0px;
	width: 39%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: start;
	font-family: "Righteous";
	font-weight: normal;
}

.zone-section-data .zone-write-to-us .zone-write-to-us-data {
	display: grid;
	grid-template-columns: 1fr 1.2fr;
	height: 100%;
	gap: 0px;
}

.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-one {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: start;
}

.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-one p {
	color: rgb(255, 255, 255);
	margin-bottom: 10px;
	font-size: 17px;
}

.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-one img {
	width: 60%;
}

.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-two {
    border-left: 2px solid rgb(100, 100, 100);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    /* Scroll cuando sea necesario */
    max-height: 32vh;
    overflow-y: auto;
    padding-right: 10px;
}

/* Estilo opcional para personalizar la barra de desplazamiento */
.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-two::-webkit-scrollbar {
    width: 8px;
}

.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-two::-webkit-scrollbar-thumb {
    background: rgb(150, 150, 150);
    border-radius: 4px;
}

.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-two p {
	font-size: 1vw;
	text-align: left;
}

.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-two .zone-data-contacts {
	margin: 5px;
	margin-left: 15px;
	display: flex;
	align-items: center;
	justify-content: left;
	height: 100%;
}

.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-two .zone-data-contacts img {
	height: 30px;
	background-color: rgb(194, 74, 74);
	border-radius: 5px;
	padding: 3px 5px;
	margin-right: 10px;
}

.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-two .zt-sub-title {
	color: rgb(255, 255, 255);
	margin: 0%;
	padding: 0%;
	font-family: "Now";
}

.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-two .zt-title {
	color: rgb(255, 255, 255);
	margin: 0%;
	padding: 0%;
}

/*-----------------------------------------------NUEVO CON PESTAÑAS--------------------------------------------*/

/* Your existing CSS */
.zone-section-data .zone-mapa {
    height: 100%;
    border: 20px solid rgb(3, 32, 58);
    background-color: rgb(3, 32, 58);
    border-bottom: none;
    border-radius: 40px 40px 0px 0px;
    /* overflow: hidden;  */
    width: 39%;
    position: relative; /* Asegura que los hijos absolutos se posicionen con respecto a este contenedor */
    transition: all 0.7s;
    z-index: 3;
/* Permite que los hijos sobresalgan */


}

.zone-section-data .zone-mapa:hover {
    box-shadow: -1px -23px 70px -15px rgba(3, 32, 58, 0.8);
}

.zone-map-direction {
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.zone-map-direction h1 {
    font-family: "Righteous";
    font-weight: normal;
    font-size: 40px;
}

.zone-map-direction h3 {
    padding: 0%;
    margin: 0%;
	font-family: "Righteous";
    font-size: 20px;
    margin-top: 12px;
}

.zone-map-direction h2 {
    font-weight: 0;
    color: rgb(150, 150, 150);
    font-family: "Now", sans-serif;
    padding: 0%;
    font-size: 20px;
    margin: 0%;
}

.zone-map-direction img {
    height: 100%;
}

.zone-map-direction-context {
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.zone-section-data .zone-mapa .map-container {
    opacity: 0;
    width: 100%;
    height: 100%;
	border-radius: 30px 30px 0px 0px;
	overflow: hidden;
}

.zone-section-data .zone-mapa .map-container iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

.zone-map-direction, .map-container {
    transition: opacity 0.5s ease-in-out;
    opacity: 1;
}

/* New CSS for tabs */
.location-tabs {
    width: 100%;
    position: absolute;
    top: -9vh; /* Ajusta la altura para que no se salga tanto */
    left: 50%; /* Centra el elemento en el padre */
    transform: translateX(-50%); /* Asegura que quede bien alineado */
    display: flex;
    justify-content: center;
    padding: 10px 0;
    background-color: transparent;
    z-index: 4;
}

.location-tabs .tab {
    padding: 8px 15px;
    margin: 0 5px;
    cursor: pointer;
    color: rgb(150, 150, 150);
    font-family: "Righteous";
    font-size: 16px;
    border-radius: 15px;
    transition: all 0.3s ease;
	background-color: rgb(3, 32, 58);
}

.location-tabs .tab:hover {
    border-top: 1px solid rgb(0, 225, 255);
}

.location-tabs .tab.active {
    color: white;
    border-top: 2px solid rgb(0, 225, 255);
}

.zone-map-content {
    height: 100%;
    width: 100%;
}

.footer-down {
	width: 100%;
	padding: 5vh 7%;
	background-color: rgb(3, 32, 58);
	/* Color de fondo */
	z-index: 9;
}

.footer-text-context {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 0px;
}

.footer-text-context .text-one-footer {
	font-size: 25px;
	color: white;
	width: 50%;
	font-family: 'Now-black';
	letter-spacing: -1px;
}

.footer-text-context .text-one-footer .outlined {
	font-size: 35px;
	color: rgb(3, 32, 58);
	-webkit-text-stroke: 1px white;
}

.footer-text-context .zone-input-email {
	background-color: white;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 3px 10px;
	width: 50%;
	border-radius: 10px 0px 0px 10px;
}

.footer-text-context .zone-input-email input {
	text-decoration: none;
	color: rgb(50, 50, 50);
	outline: none;
	border: none;
	flex: 1;
	font-family: "Now", sans-serif;
}

.footer-text-context .zone-input-email .button-send-email {
	background-color: rgb(187, 54, 54);
	font-size: 15px;
	color: white;
	outline: none;
	border: none;
	padding: 7px 10px;
	cursor: pointer;
	white-space: nowrap;
	border-radius: 5px 0px 0px 5px;
	font-weight: 700;
}

.footer-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
	gap: 1vh;
}

.footer-links {
	flex: 0 0 auto;
	height: 100%;
	font-family: "Now", sans-serif;
}

.footer-links .img-logo-footer {
    height: 10vh;
}

.footer-links .img-logo-context {
	margin-top: -5px;
	width: 40%;
}

.footer-links .derechos {
	font-size: 1.7vh;
	margin-top: 5px;
}

.footer-links ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.footer-links li {
	margin: 0;
	padding: 0%;
}

.footer-links a {
	color: white;
	text-decoration: none;
	font-size: 15px;
	margin: 0;
	padding: 0%;
}

.footer-links a,
.footer-links .zone-title {
	color: white;
	text-decoration: none;
	font-size: 15px;
}

.footer-links ul li .zone-title {
	color: rgb(135, 135, 135);
}

.footer-links.fo-two .caption-three{
	color: white;
	font-size: 2vh;
	display: flex;
	flex-direction: column;
	align-items:flex-start;
	justify-content: center;
	font-family: "Now";
	gap: 5px;
}

.footer-links.fo-two .caption-three button{
	background-color: transparent;
	border: none;
	outline: none;
	text-align: left;
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 3px;  
}

.footer-links.fo-two ul li *{
	padding: 0%;
	margin: 0%;
}

.footer-links.fo-two ul li{
	text-align: left;
}

.footer-links.fo-two .caption-two{
	color: white;
	font-family: "Righteous";
	font-size: 4vh;
}

.footer-links.fo-three {
	padding-left: 30px;
    border-left: 2px solid white;
    position: relative;
}

.footer-links.fo-three::before,
.footer-links.fo-three::after {
    content: "";
    position: absolute;
    left: -7px;
    width: 12px;
    height: 12px;
    background: rgb(3, 32, 58);
	border: 2px solid white;
    border-radius: 50%;
}

.footer-links.fo-three::before {
    top: 0;
    transform: translateY(-50%);
}

.footer-links.fo-three::after {
    bottom: 0;
    transform: translateY(50%);
}

.footer-links.fo-three .caption-one{
	padding: 0%;
	margin: 0%;
	font-family: "Righteous";
	font-size: 4vh;
	width: white;
}

.footer-links.fo-three ul li{
	display: flex;
	align-items: center;
	justify-content: center;
}

.footer-links.fo-three ul .list-fo-three-one{
	gap: 10px;
}

.footer-links.fo-three ul .list-fo-three-one img{
	height: 4vh;
}

.footer-links.fo-three ul .list-fo-three-two{
	margin-top: 10px;
	gap: 10px;
}

.footer-links.fo-three ul .list-fo-three-two a{
	display: flex;
	align-items: center;
	justify-content: center;
	height: 5vh;
	width: 5vh;
	padding: 1.1vh;
	border: 2px solid white;
	border-radius: 50%;
	transition: all 0.4s ease;
}

.footer-links.fo-three ul .list-fo-three-two img{
	height: 100%;
	transition: all 0.4s ease;
}

.footer-links.fo-three ul .list-fo-three-two a:hover {
	box-shadow: 0 0 5px 2px rgba(255, 255, 255, 0.8);
}

.footer-links.fo-three ul .list-fo-three-two a:hover img {
	filter: drop-shadow(0 0 1px white);
}

.footer-links.fo-four{
	padding-left: 30px;
    border-left: 2px solid white;
    position: relative;
}

.footer-links.fo-four::before,
.footer-links.fo-four::after {
    content: "";
    position: absolute;
    left: -7px;
    width: 12px;
    height: 12px;
    background: rgb(3, 32, 58);
	border: 2px solid white;
    border-radius: 50%;
}

.footer-links.fo-four::before {
    top: 0;
    transform: translateY(-50%);
}

.footer-links.fo-four::after {
    bottom: 0;
    transform: translateY(50%);
}

.footer-links.fo-four .caption-one{
	padding: 0%;
	margin: 0%;
	font-family: "Righteous";
	font-size: 4vh;
	width: white;
}

.footer-links.fo-four ul li *{
	padding: 0%;
	margin: 0%;
}

.footer-links.fo-four ul li{
	text-align: left;
}

.footer-links.fo-four .caption-two{
	font-family: "Now", sans-serif;
	font-size: 2vh;
}

.footer-links.fo-four .caption-three{
	font-family: "Now", sans-serif;
	font-size: 2.2vh;
}

.footer-links.fo-four .caption-two{
	margin-top: 5px;
	margin-bottom: -5px;
}

.footer-links.fo-five ul li{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 15px;
}

.footer-links.fo-five ul li img{
	height: 11vh;
}

.footer-links.fo-five .caption-one{
	padding: 0%;
	margin: 0%;
	font-family: "Righteous";
	font-size: 7vh;
	width: white;
}

#section5 {
	background: white;
}

.video-mask {
	position: absolute;
	width: 100%;
	height: 85%;
	top: 0;
	left: 0;
	overflow: hidden;
	border-radius: 0 0 300px 300px;
	z-index: 2;
	transition: all 0.4s ease-out;
}

.video-mask::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
	z-index: 2;
	transition: all 0.4s ease-out;
}

.video-mask video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 1;
}

.section5-context {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100vh;
	z-index: 3;
}

.section5-context.supe {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: end;
	position: fixed;
	height: 100%;
	width: 100%;
	z-index: 9999;
	padding: 10px;
}

.section5-context.supe .zone-video-options .button-option-video button{
	background-color: rgba(50, 50, 50, 0.5);
	backdrop-filter: blur(5px);
	padding: 10px;
	border-radius: 50%;
	/*
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	*/
}


.section5-context-data {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	opacity: 1;
	transition: all 0.5s ease;
}

.section5-context-data h2 {
	margin: 0%;
	padding: 0%;
	font-size: 40px;
	letter-spacing: 10px;
	color: white;
	font-family: "Now", sans-serif;
}

.section5-context-data h1 {
	margin: 0%;
	padding: 0%;
	margin-top: -12px;
	font-size: 100px;
	color: white;
	font-family: "Righteous";
	transition: all 0.4s ease-out;
}

.section5-context-data h1:hover {
	text-shadow: 0 0 5px white, 0 0 10px white;
}

.section5-context-data p {
	color: white;
	background-color: rgba(80, 80, 80, 0.3);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	padding: 5px 100px;
	border-radius: 20px;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	letter-spacing: 2px;
	font-weight: normal;
	font-family: "Righteous";
}

.section5-context-data p span {
	color: rgb(43, 209, 216);
}

.video-mask.expanded {
	position: fixed;
	width: 100vw;
	height: 100vh;
	border-radius: 0;
	z-index: 9998;
}

.button-option-video button {
	border: none;
	outline: none;
	background-color: transparent;
}

.button-option-video button img {
	height: 100%;
	transition: all 0.4s ease;
}

.button-option-video button:hover img {
	filter: drop-shadow(-10px 0px 24px rgb(255, 255, 255));
}

.video-mask.expanded::after {
	background-color: rgba(0, 0, 0, 0);
}

.section5-context-data.hidden {
	opacity: 0;
}

.section5-context-data.removed {
	display: none;
}

#section6 {
	background-color: white;
}

.section6-context {
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: end;
	overflow-x: scroll;
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.section6-context .zone-history{
	height: 100%;
	width: 100%;
	padding: 10px 0px;
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.zone-history .zone-history-zone-buttons{
	width: 100%;
	height: 10vh;
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	gap: 1vw;
	padding: 0 30px;
	margin-bottom: 20px;
	z-index: 1;
}

.zone-history-zone-buttons button{
	outline: none;
	border: none;
	background-color: transparent;
	color: rgb(158, 158, 158);
	border-radius: 20px;
	padding: 10px 20px;
	display: flex;
	gap: 10px;
	align-items: center;
	justify-content: center;
	font-family: "Righteous";
	font-size: 2.7vh;
	box-shadow: 0px -3px 20px -11px rgba(0,0,0,0.75);
	transition: all 0.4s ease;
}

.zone-history-zone-buttons button svg{
	height: 5vh;
	transition: all 0.4s ease;
	fill: rgb(158, 158, 158);
}

.zone-history-zone-buttons button.color-one:hover{
	background-color: rgb(3, 32, 58);
	color: white;
}

.zone-history-zone-buttons button.color-one.active,
.zone-history-zone-buttons button.color-one:focus {
    background-color: rgb(3, 32, 58);
    color: white;
}

.zone-history-zone-buttons button.color-two:hover{
	background-color: rgb(158, 47, 47);
	color: white;
}

.zone-history-zone-buttons button.color-two.active,
.zone-history-zone-buttons button.color-two:focus {
    background-color: rgb(158, 47, 47);
    color: white;
}

.zone-history-zone-buttons button.active svg,
.zone-history-zone-buttons button:focus svg{
	fill: white;
}

.zone-history-zone-buttons button:hover svg{
	fill: white;
}


.zone-history .zone-history-selected{
	width: 80%;
	height: 60vh;
	border-radius: 30px;
	box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
	z-index: 2;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.zone-history .zone-history-selected .history-tab-zone-one{
	width: 55%;
	height: 100%;
	padding: 60px;
	display: flex;
	flex-direction: column;
	align-items: start;
	justify-content: center;
}

.zone-history .zone-history-selected .history-tab-zone-one h1{
	font-size: 8vh;
	font-family: "Righteous";
}

.zone-history .zone-history-selected .history-tab-zone-one.color-one h1{
	color: rgb(3, 32, 58);
}

.zone-history .zone-history-selected .history-tab-zone-one.color-two h1{
	color: rgb(158, 47, 47);
}


.zone-history .zone-history-selected .history-tab-zone-one p{
	font-size: 3vh;
	font-family: "Now";
	color: rgb(100, 100, 100)
}

.zone-history .zone-history-selected .history-tab-zone-one.color-one p span{
	color: rgb(3, 32, 58);
	font-weight: 900;
}


.zone-history .zone-history-selected .history-tab-zone-one.color-two p span{
	color: rgb(158, 47, 47);
	font-weight: 900;
}


.zone-history .zone-history-selected .history-tab-zone-two{
	width: 45%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.zone-history .zone-history-selected .history-tab-zone-two img{
	height: 100%;
	object-fit: cover;
	pointer-events: none;
	display: block;
}


/*

.section6-context .title-section {
	position: absolute;
	text-align: center;
	top: 15vh;
	left: 0;
	padding: 0%;
	width: 100%;
	overflow: hidden;
	white-space: nowrap;
	font-size: 70px;
	font-family: "Righteous";
	color: rgb(3, 32, 58);
}

.section6-context .zone-timeline{
	width: 100vw;
	display: flex;
	gap: 50px;
}

.card-timeline-data{
	position: relative;
}

.card-timeline-data .img-timeline-context{
	position: absolute;
	top: 40%;
	right: -8vw;
	transform: translateY(-50%) rotate(22deg);
	height: 50vh;
	z-index: 1;
}

.card-timeline-data .timeline-data-contex{
	position: relative;
	height: 50vh;
	background-color: rgb(0, 51, 88);
	border-radius: 0px 40px 40px 0px;
	color: white;
	display: flex;
	flex-direction: column;
	align-items:start;
	justify-content: center;
	text-align: left;
	width: 45vw;
	padding: 10px 50px;
	overflow: hidden;
	z-index: 2;
}

.card-timeline-data .timeline-data-contex .title-timeline{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

.card-timeline-data .timeline-data-contex .title-timeline img{
	height: 10vh;
}

.card-timeline-data .timeline-data-contex h1{
	font-family: "Righteous";
	font-size: 3.5vw;
	line-height: 0.6;
}

.card-timeline-data .timeline-data-contex h1 span{
	font-size: 2vw;
}

.card-timeline-data .timeline-data-contex p{
	font-family: "Now";
	color: white;
	font-size: 1.2vw;
	margin-top: 20px;
}

.carousel-timelien {
	position: relative;
	display: flex;
	width: 100%;
	height: 60vh;
	padding-bottom: 20vh;
}

.carousel-item {
	flex: 1;
	width: 100vw;
	position: relative;
	border-left: 1px solid rgb(100, 100, 100);
	background-color: #fff;
	transition: all 0.3s ease;
}

.carousel-item:nth-child(1),
.carousel-item:nth-child(3),
.carousel-item:nth-child(5) {
	padding-top: 50px;
	border-top: 1px solid rgb(100, 100, 100);
}

.carousel-item:nth-child(3)::before,
.carousel-item:nth-child(1)::after,
.carousel-item:nth-child(1)::before,
.carousel-item:nth-child(3)::after,
.carousel-item:nth-child(5)::before {
	content: "";
	position: absolute;
	width: 20px;
	height: 20px;
	background: rgb(100, 100, 100);
	border-radius: 50%;
	z-index: 2;
}

.carousel-item:nth-child(3)::before,
.carousel-item:nth-child(5)::before,
.carousel-item:nth-child(1)::before {
	top: -10px;
	left: -10px;
}

.carousel-item:nth-child(1)::after,
.carousel-item:nth-child(3)::after {
	top: -10px;
	right: -10px;
}

.carousel-item:nth-child(2),
.carousel-item:nth-child(4) {
	padding-bottom: 50px;
	border-bottom: 1px solid rgb(100, 100, 100);

}

.carousel-item:nth-child(2)::before,
.carousel-item:nth-child(4)::before,
.carousel-item:nth-child(2)::after,
.carousel-item:nth-child(4)::after {
	content: "";
	position: absolute;
	width: 20px;
	height: 20px;
	background: rgb(100, 100, 100);
	border-radius: 50%;
	z-index: 2;
}

.carousel-item:nth-child(2)::before,
.carousel-item:nth-child(4)::before {
	bottom: -10px;
	left: -10px;
}

.carousel-item:nth-child(2)::after,
.carousel-item:nth-child(4)::after {
	bottom: -10px;
	right: -10px;
}

.button-container-top {
	position: absolute;
	top: -25px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 2;
}

.button-container-bottom {
	position: absolute;
	bottom: -25px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 2;
}

.toggle-button {
	width: 150px;
	height: 55px;
	color: white;
	border: none;
	border-radius: 50px;
	cursor: pointer;
	transition: background-color 0.3s;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: end;
	position: relative;
}

.toggle-button img {
	height: 120px;
	object-fit: cover;
	position: absolute;
	top: -55px;
	left: 50%;
	transform: translateX(-50%);
	transition: all 0.4s ease;
}


.buttom-timeline-contex {
	width: 200px;
	position: absolute;
	color: black;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	margin-top: 10px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-content: center;
	justify-content: center;
	font-family: "Now";
}

.time-context-top {
	bottom: 150%;
	left: 50%;
	transform: translateX(-50%);
	margin-top: 10px;
}

.time-context-bottom {
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	margin-top: 10px;
}

.buttom-timeline-contex p {
	margin: 0%;
}

.buttom-timeline-contex p:nth-child(1) {
	font-family: "Righteous";
	color: rgb(70, 70, 70);
	font-size: 4vh;
}

.buttom-timeline-contex p:nth-child(2) {
	color: rgb(100, 100, 100);
	font-size: 14px;
}

.toggle-button:hover img {
	filter: drop-shadow(0px 0px 24px rgba(2, 210, 241, 1));
}

*/








#section7 {
	background-color: white;
	height: 100vh;
	overflow: visible;
}

.section7-context {
	/*
	padding-right: 10%;
	*/
	width: 100%;
	height: 100%;
	position: relative;
	overflow: visible;
}

.section7-context .col-md-6 {
	height: 100vh;
}

.se7-zone-one {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 0px 9vw;
	padding-top: 10vh;
	transition: all 0.6s ease;
	font-family: "Now";
}

.se7-zone-one h1 {
	padding: 0%;
	margin: 0%;
	font-size: 6vw;
	font-family: "Righteous";
}

.se7-zone-one h1:nth-child(1) {
	color: rgb(111, 170, 172);
}

.se7-zone-one h1:nth-child(2) {
	color: rgb(3, 32, 58);
}

.se7-zone-one .s7zo-context {
	text-align: justify;
	font-size: 1.3vw;
	margin-top: 10px;
	color: rgb(100, 100, 100);
}

.se7-zone-one .s7zo-context-two {
	text-align: justify;
	font-size: 1.3vw;
	margin-top: 10px;
	color: white;
	padding: 2px 15px;
	border-radius: 50px;
	background-color: rgb(128, 40, 49);
	text-align: left;
}

.se7-zone-one ul{
	margin-top: 2vh;
}

.se7-zone-one ul li{
	color: rgb(100, 100, 100);
	font-size: 1.3vw;
	display: flex;
	align-items: center;
	justify-content: left;
	gap: 10px;
}

.se7-zone-one ul li b{
	color: rgb(49, 49, 49);
}

.se7-zone-one ul li span svg{
	width: 2.5vw;
	fill: rgb(128, 40, 49);
}

.card-mision-vision {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: end;
	padding: 20px;
	transition: all 0.6s ease;
}

.zone-data-m-s {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 83%;
	width: 100%;
	border: 1px solid rgb(100, 100, 100);
	background-color: white;
	border-radius: 70px;
	box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
	color: rgb(100, 100, 100);
	padding: 20px;
	transition: all 0.4s ease;
	font-family: "Now";
	cursor: pointer;
	position: relative;
}

.zone-data-m-s svg {
	width: 100%;
}

.zone-data-m-s .arrow {
	width: 30%;
	margin-top: 2vh;
	fill: rgb(3, 32, 58);
	transition: all 0.4s ease;
}

.zone-data-m-s svg .stv0 {
	fill: none;
}

.zone-data-m-s svg .stv1 {
	fill: none;
	stroke: #194261;
	stroke-width: 9.8846;
	stroke-miterlimit: 4.0006;
	stroke-dasharray: 24.7114;
	transition: all 0.4s ease;
}

.zone-data-m-s svg .stv2 {
	fill: #194261;
	transition: all 0.4s ease;
}

.zone-data-m-s svg .stv3 {
	fill: none;
	stroke: #194261;
	stroke-width: 7.4124;
	stroke-miterlimit: 10;
	transition: all 0.4s ease;
}

.zone-data-m-s svg .stv4 {
	enable-background: new;
}


.zone-data-m-s svg .stm0 {
	enable-background: new;
}

.zone-data-m-s svg .stm1 {
	fill: #194261;
	stroke: #194261;
	transition: all 0.4s ease;
}

.zone-data-m-s svg .stm2 {
	fill: none;
}

.zone-data-m-s svg .stm3 {
	fill: none;
	stroke: #194261;
	stroke-width: 9.8711;
	stroke-miterlimit: 4.0006;
	stroke-dasharray: 24.6776;
	transition: all 0.4s ease;
}

.more-info-button {
	background-color: rgb(3, 32, 58);
	font-family: "Now-Medium";
	outline: none;
	border: none;
	font-size: 1.7vw;
	color: white;
	padding: 5px 10px;
	border-radius: 50px;
	transition: all 0.4s ease;
	cursor: pointer;
}

.zone-data-m-s p {
	font-size: 13px;
}

.zone-all-data-context {
	display: none;
	padding: 0%;
}

.zone-all-data-context.appears {
	display: block;
}

.zone-all-data-context .col-md-12 {
	height: 100%;
	display: none;
	flex-direction: column;
	align-items: start;
	justify-content: center;
	color: black;
	padding-right: 15%;
	padding-top: 10vh;
}

.zone-all-data-context .col-md-12 .title-mv-data{
	padding: 0%;
	margin: 0%;
	font-size: 6vw;
	font-family: "Righteous";
}

.zone-all-data-context .vision-data .title-mv-data{
	color: rgb(3, 32, 58);
}

.zone-all-data-context .mision-data .title-mv-data{
	color: rgb(128, 40, 49);
}

.zone-all-data-context .col-md-12 p {
	font-family: "Now";
	margin-top: 2vh;
	font-size: 1.4vw;
	color: rgb(100, 100, 100)
}

.mision-data.appears {
	display: flex;
}

.mision-data h3{
	font-family: "Now-bold";
	color: rgb(128, 40, 49);
	border: 3px solid rgb(128, 40, 49);
	font-size: 2.5vw;
	border-radius: 10px;
	padding: 2px 30px 2px 10px;
}

.mision-data ul{
	margin-top: 2vh;
	text-decoration: none;
}

.mision-data ul li{
	font-family: "Now";
	font-size: 1.5vw;
	font-weight: 800;
	display: flex;
	align-items: center;
	justify-content: left;
	gap: 10px;
	color: rgb(100, 100, 100)
}

.mision-data ul li span svg{
	font-family: "Now";
	width: 3vw;
	fill: rgb(128, 40, 49);
}

.vision-data.appears {
	display: flex;
}

.vision-data .subtitle-vision{
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Now-bold";
	background-color: rgb(0, 51, 88);
	color: white;
	border-radius: 10px;
	padding: 5px 50px 5px 75px;
	font-size: 4vw;
	position: relative;
}

.vision-data .subtitle-vision span{
	color: white;
	position: absolute;
	left: 40px;
	top: 60%;
	transform: translateY(-50%) scale(2) rotate(-50deg);
}

.vision-data h3{
	text-align: center;
	font-family: "Now-bold";
	color: rgb(0, 51, 88);
	font-size: 2.2vw;
	position: relative;
}

.vision-data h3 span{
	color: rgb(0, 51, 88);
	position: absolute;
	right: -15px;
	top: 85%;
	transform: translateY(-50%) scale(3) rotate(20deg);
}

.vision:hover {
	background-color: rgb(3, 32, 58);
	color: white;
	border: 1px solid rgb(3, 32, 58);
}

.mision:hover {
	background-color: rgb(128, 40, 49);
	color: white;
	border: 1px solid rgb(128, 40, 49);
}

.vision:hover .more-info-button {
	background-color: white;
	color: rgb(3, 32, 58);
}

.mision:hover .more-info-button{
	background-color: white;
	color: rgb(128, 40, 49);
}

.zone-data-m-s:hover .arrow {
	fill: white
}

.zone-data-m-s:hover svg .stv1,
.zone-data-m-s:hover svg .stv3,
.zone-data-m-s:hover svg .stm3 {
	stroke: white;
}

.zone-data-m-s:hover svg .stv2,
.zone-data-m-s:hover svg .stm1 {
	fill: white;
	stroke: white;
}


.se7-zone-one.faded {
	opacity: 0;
	display: none;
}

.card-active {
	position: absolute;
	left: -5%;
	top: 56%;
	transform: translateY(-50%) rotate(5deg);
	z-index: 10;
}

.card-inactive {
	position: absolute;
	left: 30%;
	top: 75%;
	transform: translateY(-50%) rotate(31deg);
	;
	z-index: 5;
}

#section8 {
	background: linear-gradient(to bottom,
			white 0%,
			white 50%,
			rgb(25, 66, 97) 50%,
			rgb(25, 66, 97) 75%,
			rgb(128, 40, 49) 75%,
			rgb(128, 40, 49) 87%,
			white 87%,
			white 100%);
}

.section8-context {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: end;
	position: relative;
	padding: 7vh 0;
}

.img1-form-send {
	position: absolute;
	left: 43%;
	top: 25%;
	transform: translateX(-50%);
	width: 15%;
	height: auto;
	padding: 10px 60px;
	border: 4px solid rgb(0, 0, 0);
	transform: rotate(-7deg);
	z-index: 1;
	pointer-events: none;
}

.writeToUs-zone {
	padding: 30px;
	width: 65%;
	/*
	height: 60%;
	*/
	border-radius: 50px;
	background-color: white;
	box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-family: "Righteous";
	color: rgb(50, 50, 50);
	z-index: 2;
	position: relative;
}

.writeToUs-zone-context{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

.writeToUs-zone-context p{
	margin: 0%;
	font-family: "Now-Medium";
	color: rgb(128, 40, 49);
	padding: 0px 5px;
	border-radius: 7px;
	border: 2px solid rgb(128, 40, 49);

}

.writeToUs-zone h2,
.writeToUs-zone h1 {
	margin: 0%;
	padding: 0%;
}

.writeToUs-zone h2 {
	font-family: "Now";
}

.img2-form-send {
	position: absolute;
	top: 9vh; /* separación desde arriba */
	right: 15vw; /* separación desde la derecha */
	width: 8%;
	height: auto;
	object-fit: cover;
	z-index: 1;
	pointer-events: none;
}

.writeToUs-zone h1 {
	color: rgb(128, 40, 49);
	font-size: 6vh;
}

.writeToUs-zone-form input,
.writeToUs-zone-form textarea {
	border: none;
	outline: none;
	border: 2px solid rgb(200, 200, 200);
	font-size: 3vh;
	padding: 5px;
	border-radius: 7px;
	margin: 5px 0px;
	width: 100%;
	height: 100%;
}

.zone-captcha{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
}

.zone-captcha img{
	border: 1px solid rgb(100, 100, 100);
}


.button-refresh{
	text-decoration: none;
	display: flex;
	align-items: center;
	justify-content: center;
	outline: none;
	border: none;
	transform: scale(1.7);
	color: rgb(50, 50, 50);
	background-color: transparent;

}

.button-send {
	outline: none;
	border: none;
	background-color: rgb(128, 40, 49);
	color: white;
	padding: 5px 40px;
	border-radius: 50px;
	margin-top: 20px;
	transition: all 0.4s ease;
}

.button-send:hover {
	transform: scale(1.1);
	box-shadow: 0px 0px 25px 0px rgba(128, 40, 49, 0.75);
}

#section9 {
	background-color: rgb(255, 255, 255);
	height: calc(100vh + 25vh);
}

.section9-context {
	height: calc(100% - 25vh);
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
}

.section9-context .contact-us-title {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
}

.img1-contact-us {
	position: absolute;
	top: 40%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 65%;
	object-fit: cover;
	opacity: 0.045;
	z-index: -1;
	pointer-events: none;
}

.section9-context .contact-us-title h1 {
	font-family: "Righteous";
	color: black;
	font-size: 4vw;
	text-align: center;
	width: 100%;
}

.section9-context .contact-us-title h1 span {
	color: rgb(158, 47, 47);
	font-size: 4vw;
}

.section9-context .contact-us-title .contact-us-intro {
	color: rgb(0, 0, 0);
	font-weight: 900;
	font-size: 4vh;
	font-family: "Now";
	padding: 0 20%;
	line-height: 1;
	text-align: center;
}

.section9-context .contact-us-title .contact-us-intro::after {
	content: '';
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translateX(-50%);
	width: 40%;
	height: 3px;
	background-color: rgb(135, 135, 135);
}

.zone-for-contacting-us {
	padding: 60px 20% 0px 20%;
	color: black;
}

.zone-for-contacting-us .col-md-3 {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: start;
	height: 100%;
}

.zone-for-contacting-us .col-md-3 svg {
	height: 10vh;
	transition: all 0.4s ease;
}

.spe1 {
	fill: #515151;
	transition: all 0.4s ease;
}

.zone-for-contacting-us .col-md-3 svg:hover .spe1 {
	fill: url(#soporteEspecializado);
}

.gp1 {
	fill: #515151;
	transition: all 0.4s ease;
}

.zone-for-contacting-us .col-md-3 svg:hover .gp1 {
	fill: url(#gestionProyectos);
}

.pd1 {
	fill: #515151;
}

.zone-for-contacting-us .col-md-3 svg:hover .pd1 {
	fill: url(#partnertsDirectos);
}

.cr1 {
	fill: #515151;
}

.zone-for-contacting-us .col-md-3 svg:hover .cr1 {
	fill: url(#certificaciones);
}

.zone-for-contacting-us .col-md-3 p {
	color: rgb(80, 80, 80);
	font-family: "now";
	text-align: center;
	font-size: 1.2vw;
	line-height: 1;
}

.zone-for-contacting-us .col-md-3 p::after {
	content: '';
	position: absolute;
	bottom: -10px;
	left: 50%;
	transform: translateX(-50%);
	width: 70%;
	height: 3px;
	background-color: rgb(135, 135, 135);
}

.zone-for-contacting-us .col-md-3 h2 {
	text-align: center;
	font-size: 1.5vw;
	font-weight: 800;
	color: rgb(50, 50, 50);
	font-family: "Now-black";
}

.zone-data-added{
	display: flex;
	align-items: center;
	justify-content: center;
	color: rgb(158, 47, 47);
	font-family: "Righteous";
	gap: 20px;
	padding: 50px 10px 10px 10px;
}

.zone-data-added .added-title{
	color: rgb(158, 47, 47);
	font-size: 5.5vh;
	margin: 0%;
	padding: 0%;
}

.zone-data-added .added-disign{
	border: 2px solid rgb(158, 47, 47);
	color: rgb(158, 47, 47);
	border-radius: 50px 0px 0px 50px;
	padding-right: 20px;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 30px;
}

.zone-data-added .added-disign *{
	margin: 0%;
	padding: 0%;
}

.zone-data-added .added-disign .added-title-two{
	color: white;
	background-color: rgb(158, 47, 47);
	border-radius: 0px 50px 50px 0px;
	padding: 0px 6vh;
	font-size: 5.5vh;
}

.added-title-three{
	font-size: 5.5vh;
}

.arrow-added{
	height: 3.5vh;
	fill: rgb(158, 47, 47);
}

#section10 {
	/*	
		background: linear-gradient(to right, rgb(3, 49, 131), rgb(0, 8 , 77));
	*/
	height: 100vh;
	/*
	background-color: white;
	background-image:
		radial-gradient(circle at 45.7% 42.9%, rgb(235, 235, 235) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 53.3% 60.4%, rgb(235, 235, 235) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 43.4% 65.9%, rgb(235, 235, 235) 0 1.8vh, transparent 1.8vh),
		repeating-linear-gradient(75deg, rgb(235, 235, 235) 0 2px, transparent 2px 4.7%),
		repeating-linear-gradient(-15deg, rgb(235, 235, 235) 0 2px, transparent 2px 7%);
	background-size: 100% -100%;
	*/
}

#section10::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 3vh;
	background-color: rgb(12, 41, 59);
	z-index: 6;
}

.section10-context{
	position: relative;
	height: 100%;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.section10-context .box {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.section10-context .left,
.section10-context .right {
	flex: 1;
	position: relative;
	z-index: 1;
}

.section10-context .center {
	flex: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	line-height: 1;
	z-index: 2;
}

.section10-context .center *{
	margin: 0%;
	padding: 0%;
}

.section10-context .center .box-center-one-title{
	font-family: "Righteous";
	color: rgb(175, 50, 57);
	font-size: 10vh;
}

.section10-context .center .box-center-one-subtitle{
	font-family: "Now-bold";
	color: rgb(50, 50, 50);
	font-size: 4.5vh;
}

.section10-context .center .box-center-context{
	position: relative;
	background-color: white;
	padding: 25px 10px 7vh;
	width: 100%;
	border-radius: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
  	box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
	margin-top: 3vh;
}

.section10-context .center .box-center-context img{
	height: 25vh;
}

.box-center-context-one-img {
	position: absolute;
	bottom: -2.2vh;
	left: 40px;
}

.box-center-context-two-img {
	position: absolute;
	bottom: 0;
	right: 40px;
}

.box-center-context .box-center-context-data-one{
	font-family: "Now";
	font-size: 3vh;
	color: rgb(117, 116, 114);
}

.box-center-context .box-center-context-data-one span{
	color: rgb(21, 55, 85);
	font-weight: 900;
}

.box-center-context .box-center-context-data-two{
	position: absolute;
	bottom: 0;
	transform: translateY(50%);
	background-color: rgb(21, 55, 85);
	border-radius: 50px;
	color: white;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 50px;
	padding: 10px 40px;
	text-decoration: none;
}


.box-center-context .box-center-context-data-two .internal-data-box h2{
	font-family: "Righteous";
	font-size: 3vh;
}

.box-center-context .box-center-context-data-two .internal-data-box p{
	font-family: "Now";
	font-size: 2vh;
}

.box-center-context .box-center-context-data-two svg{
	fill: white;
	height: 3vh;
}

.section10-context .center .box-center-context-sub{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.section10-context .center .box-center-two-title{
	font-family: "Righteous";
	margin-top: 6vh;
	color: rgb(70, 70, 70);
	font-size: 7vh;
	transition: all 0.4s ease;
}

.section10-context .center .box-center-two-subtitle{
	font-family: "Now-Medium";
	letter-spacing: 2px;
	color: rgb(70, 70, 70);
	font-size: 4vh;
	transition: all 0.4s ease;
}

.section10-context .center .box-center-context-sub:hover .box-center-two-title,
.section10-context .center .box-center-context-sub:hover .box-center-two-subtitle{
	color: rgb(175, 50, 57);

}

.section10-context .center .box-center-icons-zone{
	display: flex;
	align-items: center;
	justify-content: center;
	padding-top: 1vh;
}

.section10-context .center .box-center-icons-zone svg{
	height: 8vh;
}

.section10-context .left .box-left-content,
.section10-context .right .box-right-content {
	padding: 0;
	aspect-ratio: 1 / 1;
	background-color: transparent;
	border-radius: 50%;
	width: 28vw;
	padding: 0%;
	overflow: hidden;
}

.section10-context .left .box-left-content img,
.section10-context .right .box-right-content img {
	width: 100%;
}

.section10-context .left .box-left-content {
	margin-left: -7vw;
}

.section10-context .right .box-right-content {
	margin-right: -7vw;
}

.section10-context .left .box-left-absolute,
.section10-context .right .box-right-absolute {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 37vw;
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	background-color: transparent;
	border: 2px dashed rgb(100, 100, 100);
	z-index: 1;
	display: flex;
	justify-content: center;
	align-items: center;
	animation-duration: 80s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

.section10-context .left .box-left-absolute {
	left: -9.9vw;
	animation-name: rotate-clockwise;
}

.section10-context .left .box-left-absolute .node {
	position: absolute;
	top: 50%;
	left: 50%;
	transform-origin: center center;
	width: 5vw;
	height: 5vw;
	padding: 5px;
	aspect-ratio: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	/*
	transform: translate(-50%, -50%);
	transform: translateY(50vh);
	*/
}

.section10-context .left .box-left-absolute .node img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.section10-context .left .box-left-absolute .node:nth-child(1) {
	transform: rotate(0deg) translateX(15.8vw) rotate(0deg) scaleX(-1);
	background-color: rgb(202, 94, 94);
}
.section10-context .left .box-left-absolute .node:nth-child(2) {
	transform: rotate(72deg) translateX(15vw) rotate(0deg) scaleY(-1);
	background-color: rgb(94, 114, 202)
}
.section10-context .left .box-left-absolute .node:nth-child(3) {
	transform: rotate(144deg) translateX(18.3vw) rotate(0deg);
	background-color: rgb(94, 202, 126)
}
.section10-context .left .box-left-absolute .node:nth-child(4) {
	transform: rotate(216deg) translateX(22.3vw) rotate(0deg);
	background-color: rgb(202, 191, 94)
}
.section10-context .left .box-left-absolute .node:nth-child(5) {
	transform: rotate(288deg) translateX(19.5vw) rotate(0deg);
	background-color: rgb(189, 94, 202)
}

.section10-context .right .box-right-absolute {
	right: -9.9vw;
	animation-name: rotate-clockwise;
}


.section10-context .right .box-right-absolute .node {
	position: absolute;
	top: 50%;
	left: 50%;
	transform-origin: center center;
	width: 5vw;
	height: 5vw;
	padding: 5px;
	aspect-ratio: 1 / 1;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
}

.section10-context .right .box-right-absolute .node img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.section10-context .right .box-right-absolute .node:nth-child(1) {
	transform: rotate(0deg) translateX(15.8vw) rotate(0deg);
	background-color: rgb(202, 94, 94);
}
.section10-context .right .box-right-absolute .node:nth-child(2) {
	transform: rotate(72deg) translateX(15vw) rotate(0deg) scaleY(-1) scaleX(-1);
	background-color: rgb(94, 114, 202)
}
.section10-context .right .box-right-absolute .node:nth-child(3) {
	transform: rotate(144deg) translateX(18.3vw) rotate(0deg) scaleY(-1);
	background-color: rgb(94, 202, 126)
}
.section10-context .right .box-right-absolute .node:nth-child(4) {
	transform: rotate(216deg) translateX(22.3vw) rotate(0deg) scaleY(-1);
	background-color: rgb(202, 191, 94)
}
.section10-context .right .box-right-absolute .node:nth-child(5) {
	transform: rotate(288deg) translateX(19.5vw) rotate(0deg) scaleY(-1);
	background-color: rgb(189, 94, 202)
}

@keyframes rotate-clockwise {
	from {
		transform: translateY(-50%) rotate(0deg);
	}
	to {
		transform: translateY(-50%) rotate(360deg);
	}
}

/*
@keyframes rotate-counterclockwise {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(-360deg);
	}
}
*/

#section11 {
	/*
	background: linear-gradient(to bottom left,
			#000000 30%,
			rgb(3, 32, 58) 50%,
			#000000 70%);
	
	background-color: white;
	background-image:
		radial-gradient(circle at 45.7% 42.9%, rgb(235, 235, 235) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 53.3% 60.4%, rgb(235, 235, 235) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 43.4% 65.9%, rgb(235, 235, 235) 0 1.8vh, transparent 1.8vh),
		repeating-linear-gradient(75deg, rgb(235, 235, 235) 0 2px, transparent 2px 4.7%),
		repeating-linear-gradient(-15deg, rgb(235, 235, 235) 0 2px, transparent 2px 7%);
	background-size: 100% -100%;
	*/
	padding: 20vh 15vh 5vh 15vh;
}

#section11::before {
	content: "";
	position: absolute;
	top: 63%;
	left: 0;
	width: 100%;
	height: 25vh;
	background: rgb(70, 70, 70);
	transform: translateY(-50%);
	z-index: 0;
}

.section11-context {
	height: 100%;
	width: 100%;
	background-color: rgb(3, 49, 131);
		background-image:
		radial-gradient(circle at 45.7% 42.9%, rgba(235, 235, 235, 0.05) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 53.3% 60.4%, rgba(235, 235, 235, 0.05) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 43.4% 65.9%, rgba(235, 235, 235, 0.05) 0 1.8vh, transparent 1.8vh),
		repeating-linear-gradient(75deg, rgba(235, 235, 235, 0.05) 0 2px, transparent 2px 4.7%),
		repeating-linear-gradient(-15deg, rgba(235, 235, 235, 0.05) 0 2px, transparent 2px 7%);
	background-size: 100% -100%;
	border: 12px solid rgb(40, 40, 40);
	border-radius: 30px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content:flex-start;
	font-family: "Righteous";
	position: relative;
}

.section11-context h1 {
	font-size: 6vh;
	font-family: "Now-bold";
	box-shadow: inset 0px 0px 160px 53px rgba(3, 131, 186, 0.15);
	border: 1px solid rgb(3, 132, 186);
	padding: 5px 20px;
}

.zone-charges {
	padding-top: 15px;
	display: flex;
	align-items: center;
	position: relative;
}

.zone-charges-left {
	justify-content: right;
}

.zone-charges-right {
	justify-content: left;
}

.zone-charges button {
	display: flex;
	align-items: center;
	gap: 20px;
	background-color: transparent;
	width: 45vh;
	padding: 0%;
	border: none;
	outline: none;
	transition: all 0.4s ease;
}

.zone-charges button:hover {
	transform: scale(1.1);
}

.zone-charges button .zc-img{
	height: 10vh;
	aspect-ratio: 1 / 1;
	padding: 1.5vh;
	border-radius: 50%;
	border: 1px solid white;
}

.zone-charges button img {
	height: 100%;
	width: 100%;
	pointer-events: none;
}

.zone-charges button p {
	font-size: 2vh;
	text-align: left;
	margin: 0%;
	padding: 0%;
}

.card-left, .card-right {
	position: absolute;
	top: 75%;
	width: 100%;
	height: 10vh;
	background-color: rgb(149, 47, 47);
	box-shadow: rgba(0, 0, 0, 0.4) 0px 2px 4px, rgba(0, 0, 0, 0.3) 0px 7px 13px -3px, rgba(0, 0, 0, 0.2) 0px -3px 0px inset;
	transition: all 0.5s ease;
	z-index: 999;
}

.close-btn{
	display: none;
	position: absolute;
	top: 1rem;
	right: 1.5rem;
	font-size: 4vh;
	font-family: "Righteous";
	padding: 0px;
	margin: 0%;
	color: white;
	background-color: transparent;
	border: none;
	cursor: pointer;
	background-color: white;
	color: rgb(149, 47, 47);
	border-radius: 50%;
	height: 5vh;
	aspect-ratio: 1 / 1;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
}

.card-left ul, .card-right ul{
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	gap: 10px;
	width: 100%;
	height: 100%;
	list-style: none;
}

.card-left ul li, .card-right ul li{
	background-color: rgb(153, 61, 61);
	border-radius: 10px;
	padding: 5px 10px;
	font-family: "Righteous";
	text-align: center;
	font-size: 2.5vh;
	text-transform: uppercase;
	box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
}

.card-right {
	right: -100%;
}

.card-left {
	left: -100%;
}

.card-right.active{
	opacity: 1;
	right: 0;
}

.card-left.active{
	opacity: 1;
	left: 0;
}

.title-footer-section11 {
    position: absolute;
    left: 50%;
    bottom: -5vh;
    transform: translateX(-50%);
    padding: 0px 40px;
    border-radius: 50px;
    background-color: rgb(158, 47, 47);
    color: white;
    font-size: 4vh;
}

#section12 {
	height: calc(100vh + 25vh);
	/*
	background-color: white;
	background-image:
		radial-gradient(circle at 47% 44%, rgb(235, 235, 235) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 54.5% 56.5%, rgb(235, 235, 235) 0 1.8vh, transparent 1.8vh),
		radial-gradient(circle at 40% 62%, rgb(235, 235, 235) 0 1.8vh, transparent 1.8vh),
		repeating-linear-gradient(75deg, rgb(235, 235, 235) 0 2px, transparent 2px 4.4%),
		repeating-linear-gradient(-15deg, rgb(235, 235, 235) 0 2px, transparent 2px 5.5%);
	background-size: 100% -100%;
	*/
}

.section12-context {
	width: 100%;
	height: 100%;
	padding: 0%;
}

.section12-context .zone-one-section12,
.section12-context .zone-two-section12 {
	height: 100vh;
	display: flex;
	flex-direction: column;
	position: relative;
}

.custom-select-container{
	margin-top: 10px;
}

.zone-one-section12 {
	align-items: center;
	justify-content: center;
	font-family: "now";
	padding: 0 7%;
	padding-top: 15vh;
}

.zone-one-section12 h1:nth-child(1) {
	font-size: 3vw;
	margin: 0%;
	padding: 0%;
	color: rgb(100, 100, 100);
}

.zone-one-section12 h1:nth-child(2) {
	font-size: 3vw;
	margin: 0%;
	padding: 0%;
	font-family: "Righteous";
	color: rgb(128, 40, 49)
}

.zone-one-section12 .col-md-12 {
	padding: 10px 0px;
}

.zone-one-section12 .col-md-12 input {
	color: rgb(50, 50, 50);
	width: 100%;
	border: none;
	outline: none;
	padding: 5px 15px;
	border: 1px solid rgb(150, 150, 150);
	background-color: rgba(255, 255, 255, 0);
	border-radius: 10px;
	transition: all 0.4s ease;
	font-family: "now";
}

.zone-one-section12 .col-md-12 input:hover {
	box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
}

.custom-select-input {
	width: 100%;
	padding: 10px 30px 10px 12px;
	border: 1px solid #ccc;
	border-radius: 4px;
	background-color: white;
	cursor: pointer;
}

.custom-select-input:focus {
	outline: none;
	border-color: #4a90e2;
	box-shadow: 0 0 5px rgba(74, 144, 226, 0.5);
}

.custom-select-arrow {
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	width: 0;
	height: 0;
	border-left: 6px solid transparent;
	border-right: 6px solid transparent;
	border-top: 8px solid #555;
	pointer-events: none;
}

.custom-select-options {
	margin-top: -10px;
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	max-height: 200px;
	overflow-y: auto;
	background-color: rgb(128, 40, 49);
	border: 1px solid #ccc;
	border-top: none;
	border-radius: 20px;
	z-index: 1000;
	display: none;
	padding: 0 100px;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
	-ms-overflow-style: none;
	scrollbar-width: none; 
}


/*------------------------------------------------------------*/

.custom-file-container {
	position: relative;
  }
  
  .custom-file-input {
	width: 100%;
	border: 1px solid #ccc;
	border-radius: 4px;
	cursor: pointer;
  }
  
  .custom-file-input:focus {
	outline: none;
	border-color: #4a90e2;
	box-shadow: 0 0 5px rgba(74, 144, 226, 0.5);
  }
  
  .real-file-input {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	cursor: pointer;
	z-index: 10;
  }
  
 
  .file-icon {
	height: 50%;
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: none;
	opacity: 0.7;
  }

/*------------------------------------------------------------*/

.custom-select-options::-webkit-scrollbar {
	display: none;
  }

.custom-select-option {
	padding: 10px 12px;
	margin: 10px 0px;
	border: 1px solid white;
	cursor: pointer;
	border-radius: 14px;
	transition: background-color 0.2s;
}

.custom-select-option:hover {
	background-color: white;
	color: rgb(65, 21, 25);
}

.custom-select-option.selected {
	background-color: white;
	color: rgb(65, 21, 25);
	font-weight: bold;
}

.show-options {
	display: block;
}

.button-job-send {
	margin-top: 20px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.button-job-send button {
	width: 60%;
	border: none;
	outline: none;
	background-color: #8D2626;
	color: white;
	padding: 10px;
	border-radius: 10px;
	transition: all 0.4s ease;
}

.button-job-send button:hover {
	background-color: #8D2626;
	transform: scale(1.1);
}

.zone-two-section12{
	align-items: center;
	justify-content: center;
	font-family: "now";
	color: rgb(100, 100, 100);
}

.zone-two-section12::after {
    content: "";
    position: absolute;
    left: 0;
    top: 20%;
    bottom: 10%;
    width: 2px;
    background-color: rgb(180, 180, 180);
}

.zone-two-section12 svg{
	width: 60%;
}

.stzts0{
	fill: rgb(100, 100, 100);
	transition: all 0.4s ease;
}
.stzts1{
	fill: rgb(100, 100, 100);
	transition: all 0.4s ease;
}

.stzts2{
	fill:none;
	stroke: rgb(100, 100, 100);
	stroke-width: 7.4993;
	stroke-miterlimit: 10;
	transition: all 0.4s ease;
}

.zone-two-section12 svg:hover .stzts0{
	fill:#202D89;
}

.zone-two-section12 svg:hover .stzts1{
	fill:#D1190D;
}

.zone-two-section12 svg:hover .stzts2{
	stroke:#202D89;
}


.zone-two-section12 .col-md-12{
	padding: 0 15%;
	display: flex;
	align-items: center;
	justify-content:left;
}

.zone-two-section12 .col-md-12 svg{
	width: 15%;
}


.zone-two-section12 .col-md-12 p{
	text-align: left;
	font-size: 5vh;
}

#section13{
	background-color: rgb(3, 38, 81);
	background-image:
		repeating-linear-gradient(75deg, rgb(14, 50, 91) 0 2px, transparent 2px 4.7%),
		repeating-linear-gradient(-15deg, rgb(14, 50, 91) 0 2px, transparent 2px 7%);
	background-size: 100% -100%;
}

.zone-product{
	height: 100%;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.zone-product .zone-product-one{
	height: 100%;
	width: 30%;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.zone-product .zone-product-one img{
	height: 100%;
	margin-bottom: -40vh;
	transform: scaleX(-1);
}

.zone-product .zone-product-two{
	height: 100%;
	width: 55%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: end;
	gap: 10vh;
}

.zone-product-two .zpt-content-one{
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.zone-product-two .zpt-content-one *{
	margin: 0%;
	padding: 0%;
}

.zone-product-two .zpt-content-one h1{
	font-family: "Now-bold";
	font-size: 14vh;
	text-shadow: 0 0 10px rgb(255, 255, 255);
	letter-spacing: 1.5vh;
}

.zone-product-two .zpt-content-one p{
	font-family: "Righteous";
	font-size: 5.3vh;
	letter-spacing: 1vh;
	border-top: 2px solid white;
}

.zone-product-two .zpt-content-two{
	width: 90%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background-color: white;
	padding: 50px;
	border-radius: 50px 50px 0px 0px;
}

.zone-product-two .zpt-content-two *{
	margin: 0%;
	padding: 0%;
}

.zone-product-two .zpt-content-two .zct-title-one{
	color: rgb(100, 100, 100);
	font-weight: 500;
	font-family: "Now";
	line-height: 1;
	font-size: 3.7vh;
}

.zone-product-two .zpt-content-two .zct-title-one span{
	color: rgb(0, 51, 88);
	font-family: "Now-bold";
}

.zone-product-two .zpt-content-two h2{
	color: rgb(100, 100, 100);
	font-family: "Now";
	font-weight: 900;
	font-size: 4vh;
	margin: 15px 0px 2px;
}

.zone-product-two .zpt-content-two h1{
	background-color: rgb(0, 51, 88);
	color: white;
	font-family: "Now-black";
	padding: 0px 20px;
	border-radius: 50px;
	font-size: 6vh;
}


@media (min-width: 1440px) {

	.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-two .zone-data-contacts img {
		height: 40px;
		background-color: rgb(194, 74, 74);
		border-radius: 5px;
		padding: 3px 5px;
		margin-right: 10px;
	}

	.zone-map-direction h1 {
		font-size: 60px;
	}

	.zone-map-direction h3 {
		font-size: 30px;
	}

	.zone-map-direction h2 {
		font-size: 25px;
	}

	.section3-content-one h1 {
		font-size: 48px
	}

	.section3-content-one .section3-content-one-context {
		font-size: 27px;
	}

	.section3-content-one .success-count p {
		font-size: 30px;
	}

	.section3-content-one .success-count h2 {
		font-size: 30px;
	}

	.section3-content-one .success-count h2 span {
		font-weight: normal;
		color: rgb(80, 80, 80);
	}
	/*
	.service {
		width: 10vw;
		height: 35vh;
	}
	*/
	.writeToUs-zone-form textarea {
		height: 180px;
	}
	/*
	.section9-context {
		height: 113.5vh;
	}
	
	.section12-context .zone-one-section12,
	.section12-context .zone-two-section12 {
		height: initial !important;
	}
	*/
	
	/* Botón izquierdo */
	.button-over-service-left {
		left: 23vw;
	}

	.button-over-service-right {
		right: 22.4vw;
	}

}

@media (min-width: 1025px) and (max-width: 1440px) {

	/*
	.barra-superior {
		height: 100px;
		padding: 5px 200px 5px 500px;
	}
	
	.barra-superior .logo svg {
		height: 45px;
	}
	*/

	.barra-superior .button-login {
		font-size: 20px;
	}

	#section4 .context {
		padding: 0px 0px;
		margin: 0%;
		z-index: 2;
	}

	#section4 .context h1 {
		margin: 0%;
		padding: 10px 0px;
		font-size: 30px;
	}

	.zone-section-data .zone-mapa iframe {
		width: 600px;
		height: 340px;
		border: 0;
	}


}

/* Celulares (577px) */
@media (max-width: 1025px) /*(max-width: 576px)*/ {

	footer {
		position: relative;
	}

	/*----------------------INDEX------------------------*/
	
	.barra-superior {
		padding: 0 2vh;
	}

	.barra-superior .barra-zone-right{
		display: none;
	}

	.country{
		display: none;
	}

	.button-nav-responsiv{
		display: flex;
	}
	/*
	.barra-superior .barra-zone-left {
		gap: 0px;
	}

	.barra-superior .button-login{
		display: none;
	}

	.button-nav-responsiv{
		display: flex;
	}

	.button-nav-responsiv img{
		height: 6vh;
	}

	.logo-side-image{
		height: 6vh;
	}

	.barra-superior .barra-zone-left .logo {
		padding: 5px 10px;
	}

	.barra-superior .logo svg {
		height: 5vh;
	}
	*/

	.services {
		cursor: pointer;
		position: fixed;
		right: auto; 
		top: auto;
		bottom: -12vh; 
		left: 50%; 
		transform: translateX(-50%); 
		color: white;
		z-index: 999;
		display: flex;
		transition: all 0.4s ease-out;
	}

	.button-services-modal{
		width: 100%;
		font-size: 5vw !important;
	}

	.text-curve {
		display: none;
	}
	
	.services img {
		height: 20vh;
		object-fit: cover;
		transition: all 0.4s ease-out;
		filter: drop-shadow(-10px 0px 24px rgba(2, 210, 241, 1));
		animation: rotar 20s linear infinite;
	}

	.services:hover {
		bottom: -9vh;
		right: auto;
	}
	
	.gangway {
		-webkit-mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 10%, rgba(0, 0, 0, 1) 90%, rgba(0, 0, 0, 0) 100%);
		mask-image: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 10%, rgba(0, 0, 0, 1) 90%, rgba(0, 0, 0, 0) 100%);
		height: 95vh;
	}

	.gangway-context{
		width: 100%;
		border-radius: 0px;
	}

	.gangway-context *{
		padding: 0%;
		margin: 0%;
	}

	.gangway-context h1{
		font-size: 3vh;
	}

	.gangway-context p {
		font-size: 3vh;
		border-radius: 0px;
		width: 100%;
	}

	.my-arrow {
		top: 54%;
	}

	.my-arrow svg{
		height: 5vh;
	}

	.my-prev {
		left: 2vh;
	}

	.my-next {
		right: 2vh;
	}

	/*  
	.services-container {
		height: 100vh;
		padding: 5% 0px;
		overflow-x: hidden;
		padding-bottom: 100px;
	}
	
	.service {
		width: 60vw;
		height: 48vh;
		border-radius: 60px;
	}
	*/
	.service.active {
		transform: scale(1.2) !important;
	}

	.service-context-data {
		border-radius: 55px;
	}

	.button-over-service-left, 
	.button-over-service-right {
		top: initial;
		bottom: 1vh;
		display: none;
	}

	.button-over-service-left img, 
	.button-over-service-right img {
		height: 8vh;
	}

	/* Botón izquierdo */
	.button-over-service-left {
		left: 30vw;
	}

	/* Botón derecho (corrección en la transformación) */
	.button-over-service-right {
		right: 30vw;
		transform: translateY(-50%) scaleX(-1); /* Ahora combina ambas transformaciones */
	}

	.modal-overlay {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 0, 0, 0.7);
		display: none;
		justify-content: center;
		align-items: center;
		z-index: 1000;
	}
	
	/* Estilos para el contenido del modal */
	.modal-content {
		background-color: rgb(7, 25, 55);
		/* rgb(43, 61, 91) */
		width: 80%;
		height: 73vh;
		border-radius: 50px;
		border: 10px solid rgb(100, 100, 100);
		padding: 20px;
		position: relative;
		transform: scale(0.1);
		opacity: 0;
		transition: transform 0.4s ease-in-out, opacity 0.3s ease;
		display: flex;
		flex-direction: column;
		align-items: start;
		justify-content: center;
	}
	
	.modal-content video{
		display: none;
	}
	
	.modal-content .modal-content-data {
		height: 100%;
		width: 100%;
		border-radius: 30px 70px 30px 30px;
		align-items: center;
		justify-content: center;
	}
	
	.close-modal {
		top: -5px;
		right: 15px;
		font-size: 44px;
	}
	
	/* Contenido del modal */
	.modal-body {
		margin: 1px 0;
		font-size: 3.5vw;
	}
	
	.modal-body strong{
		background-color: rgb(158, 47, 47);
		padding: 1px 30px 1px 2px;
		color: white;
	}
	
	.modal-body ul{
		padding-top: 0px;
	}
	
	.button-direct-footer {
		text-decoration: none;
		border-radius: 7px;
		background-color: rgb(158, 47, 47);
		border: 1px solid white;
		padding: 1px 10px;
		color: white;
		position: absolute;
		bottom: 2%;
		left: 9%;
		transform: translateX(50%);
		font-family: "Righteous";
		font-size: 3.5vw;
	
	}

	.certification-zone{
		height: auto;
		flex-direction: column;
		padding: 10px 0px;
		gap: 10px;
	}

	.certification-zone .cert-zone-one{
		text-align: center;
	}

	.certification-zone .cert-zone-one h1{
		font-size: 3vh;
	}

	.certification-zone .cert-zone-one p{
		border-top: 1px solid white;
		margin-top: 5px;
		font-size: 2.5vh;
	}

	.certification-zone .cert-zone-two{
		height: 6vh;
	}

	#section1 {
		flex-direction: column;
		height: auto;
	}

	.social-media-zone{
		position: relative;
		top: initial;
		left: initial;
		width: 100%;
		margin-top: 15vh;
	}

	.social-media-zone .social-red{
		height: 8vh;
	}

	.section1-content-one img{
		height: auto;
		width: 100%;
		margin-top: 5vh;
	}

	.section1-content-two,
	.section1-content-three,
	.section1-content-four {
		width: 100%;
		height: auto;
		padding: 5vh 10px;
	}

	.section1-content-two .content-two-zone{
		border: 2px solid white;
		border-radius: 35px;
	}

	.section1-content-three{
		height: 80vh;
		border-radius: 0%;
		display: none;
	}

	.section1-content-three video{
		position: absolute;
		bottom: -17vh;
		left: 50%;
		transform: translateX(-50%);
		height: 115vh;
		mix-blend-mode: screen;
		transition: all 0.4s;
	}

	.section1-content-four{
		padding-top: 0%;
	}

	.section1-content-four .content-four-zone-two{
		width: 100%;
		border: 2px solid white;
		border-radius: 35px;
	}

	.section1-content-five {
		flex-direction: column;
	}

	.section1-content-five .content-five-one-title{
		text-align: center;
		font-size: 3vh;
	}

	.section1-content-five .content-five-two-title{
		font-size: 4vh;
		gap: 10px;
		padding-left: 10px;
	}

	.section1-content-five .content-five-two-title .five-two-title-subtitle{
		margin: 0px;
		padding: 10px 25px;
	}

	#section3 {
		height: auto;
	}

	.section3-content {
		height: auto;
		flex-direction: column;
	}

	.section3-content-one {
		align-items: center;
		padding: 5vh 0px 0px 0px;
	}

	.section3-content-one .title-success-one {
		font-size: 5vh;
		margin-bottom: -3vh;
	}

	.section3-content-one .title-success-two{
		font-size: 8vh;
	}

	.section3-content-one .title-success-three{
		padding: 0px 40px;
	}

	.section3-content-two {
		align-items:center;
		flex-direction: column;
		padding: 5vh 0px;
	}

	.section3-content-two button{
		text-align: center;
		font-size: 4vh;
		min-width: 60%;
	}

	.info-card-success{
		padding: 0px 2vh 5vh;
		height: auto;
	}

	.info-card-row {
		flex-direction: column;
	}

	.info-card-row-one {
		width: 100%;
	}

	.title-card-zone-map {
		padding-top: 20px;
		color: rgb(187, 54, 54);
	}

	.card .card-content .info-card-main {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.card .card-content .info-card-main .info-card-solutions-col {
		width: 100%;
	}

	.card .card-content .info-card-main .info-card-slider-col {
		width: 100%;
	}

	.image-slider {
		height: 50vh;
		margin-top: 20px;
		border-radius: 20px 20px 0px 0px;
	}

	#section4 {
		display: flex;
		background-color: white;
		flex-direction: column;
		height: initial !important;
		padding-top: 15vh;
	}
	
	#section4 .context h1 {
		font-size: 7vw;
	}

	.location-tabs {
		width: 100%;
		position: absolute;
		top: 0vh; /* Ajusta la altura para que no se salga tanto */
		left: 50%; /* Centra el elemento en el padre */
		transform: translateX(-50%); /* Asegura que quede bien alineado */
		display: flex;
		flex-direction: column;
		align-items: end;
		justify-content: left;
		gap: 10px;
	}
	
	.location-tabs .tab:hover {
		border: 1px solid rgb(0, 225, 255);
	}
	
	.location-tabs .tab.active {
		color: white;
		border: 2px solid rgb(0, 225, 255);
	}

	.zone-section-data {
		flex-direction: column;
		height: 170vh;
		gap: 20px;
	}
	
	.zone-section-data .zone-write-to-us {
		border-radius: 40px 40px 40px 40px;
		width: 90%;
	}
	
	.zone-section-data .zone-write-to-us .zone-write-to-us-data {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 10px;
	}
	
	.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-one img {
		width: 70%;
	}
	
	.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-two {
		border: none;
		padding-bottom: 20px;
	}
	
	.zone-section-data .zone-write-to-us .zone-write-to-us-data .zone-two p {
		font-size: 17px;
	}
	
	.zone-section-data .zone-mapa {
		width: 90%;
		border-bottom: 5px dashed rgb(200, 200, 200);
		overflow: hidden;
	}
	
	.zone-section-data .zone-mapa:hover {
		box-shadow: none;
	}

	.zone-map-direction {
		flex-direction: column;
	}

	.zone-map-direction img {
		height: 20%;
	}
	
	.zone-map-direction h1 {
		font-size: 60px;
	}
	
	.footer-text-context {
		flex-direction: column;
		justify-content: center;
	}
	
	.footer-text-context .text-one-footer {
		width: 100%;
	}
	
	.footer-text-context .zone-input-email {
		width: 100%;
		margin-bottom: 5%;
	}
	
	.footer-container {
		flex-direction: column;
		gap: 15px;
	}
	
	.footer-links .derechos {
		margin-top: 10px;
	}

	.footer-links.fo-two ul li{
		text-align: center;
	}

	.footer-links.fo-three {
		padding: 0px;
		padding-top: 10px;
		border: none;
		border-top: 2px solid white;
	}

	.footer-links.fo-three::before,
	.footer-links.fo-three::after {
		left: initial;
	}

	.footer-links.fo-three::before {
		left: -7px;
		top: 0;
		transform: translateY(-50%);
	}

	.footer-links.fo-three::after {
		right: -7px;
		top: 0;
		transform: translateY(-50%);
	}

	.footer-links.fo-four ul li{
		text-align: center;
	}

	.footer-links.fo-four{
		padding: 0px;
		padding-top: 10px;
		border: none;
		border-top: 2px solid white;
	}

	.footer-links.fo-four::before,
	.footer-links.fo-four::after {
		left: initial;
	}

	.footer-links.fo-four::before {
		left: -7px;
		top: 0;
		transform: translateY(-50%);
	}

	.footer-links.fo-four::after {
		right: -7px;
		top: 0;
		transform: translateY(-50%);
	}

	.footer-links.fo-five ul li{
		flex-direction: column;
	}

	/*------------------------NOSOTROS------------------------*/

	.zone-video-options{
		display: flex;
	}

	.video-mask {
		position: absolute;
		width: 100%;
		height: 78%;
		top: 0;
		left: 0;
		overflow: hidden;
		border-radius: 0 0 300px 300px;
		z-index: 2;
		transition: all 0.4s ease-out;
		background-color: rgb(50, 50, 50);
	}

	.video-mask.expanded video {
		width: 100%;
		height: auto;
		display: block;
		box-shadow: 0px 45px 67px 4px rgba(0,0,0,0.75);
	}

	#section5 {
		background: white;
	}

	.section5-context {
		padding-top: 30%;
		justify-content: start;
		height: 100%;
		z-index: 3;
	}
	
	.section5-context-data p {
		text-align: center;
		padding: 5px 10px;
	}

	.zone-history .zone-history-zone-buttons{
		width: 100%;
		height: auto; /* O ajusta si necesitas altura fija */
		display: flex;
		flex-wrap: wrap; /* Permite que los hijos pasen a la siguiente línea */
		gap: 3px; /* Opcional: espacio entre los elementos */
		align-items: flex-end;
		text-align: center;
		padding: 0 30px;
		justify-content: center;
		margin-bottom: 10px;
	}

	.zone-history-zone-buttons button{
		border-radius: 20px;
		padding: 10px 10px;
		gap: 10px;
		font-size: 1.5vh;
	}

	.zone-history-zone-buttons button svg{
		height: 3vh;
		transition: all 0.4s ease;
		fill: rgb(158, 158, 158);
	}
	
	.zone-history .zone-history-selected{
		width: 90%;
		height: auto;
		border-radius: 30px;
		box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
		z-index: 2;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;

	}

	.zone-history .zone-history-selected .history-tab-zone-two{
		display: none;
	}

	.zone-history .zone-history-selected .history-tab-zone-one h1{
		font-size: 4vh;
		font-family: "Righteous";
	}

	.zone-history .zone-history-selected .history-tab-zone-one p{
		font-size: 2.5vh;
	}

	.zone-history .zone-history-selected .history-tab-zone-one{
		width: 100%;
		height: auto;
		padding: 10px;
		display: flex;
		text-align: center;
		flex-direction: column;
		align-items: center;
	}

	#section6 {
		height: auto;
	}

	#section7 {
		background-color: white;
		height: 300vh;
	}
	
	.section7-context {
		padding: 0%;
		width: 100%;
		height: 100%;
		position: relative;
		overflow: hidden;
	}
	
	.section7-context .col-md-6 {
		height: 100vh;
	}

	.se7-zone-one h1 {
		font-size: 14vw;
	}

	.se7-zone-one .s7zo-context {
		font-size: 5vw;
	}

	.se7-zone-one .s7zo-context-two {
		font-size: 6vw;
	}

	.se7-zone-one ul li{
		font-size: 4.5vw;
	}

	.se7-zone-one ul li span svg{
		width: 9vw;
	}

	.zone-data-m-s {
		height: 100%;
	}

	.card-active {
		position: absolute;
		left: -50%;
		top: 56%;
		transform: translateY(-50%) rotate(45deg);
		z-index: 10;
	}

	.more-info-button {
		font-size: 5vw;
	}

	.card-active ~ #section7,
    #section7:has(.card-active) {
        height: 190vh;
    }
	
	.card-inactive {
		position: absolute;
		right: 0%;
		top: 85%;
		transform: translateY(-50%) rotate(-46deg);
		z-index: 5;
	}

	.zone-all-data-context .col-md-12 {
		padding: 10%;
		text-align: justify;
	}

	/*
	.zone-all-data-context .col-md-12 {
		height: 100%;
		display: none;
		flex-direction: column;
		align-items: start;
		justify-content: center;
		color: black;
		padding-right: 15%;
		padding-top: 10vh;
	}
	*/

	.zone-all-data-context .col-md-12 .title-mv-data{
		font-size: 15vw;
	}

	.zone-all-data-context .col-md-12 p {
		font-size: 5vw;
	}
	
	.mision-data h3{
		font-size: 6vw;
	}
	
	.mision-data ul{
		margin-top: 2vh;
	}

	.mision-data ul li{
		text-align: left;
		font-size: 4.4vw;
		margin-bottom: 2vh;
	}

	.mision-data ul li span svg{
		width: 10vw;
	}

	.vision-data .subtitle-vision{
		font-size: 9vw;
	}
	
	.vision-data h3{
		margin: 0%;
		padding: 0%;
		font-size: 6vw;
	}
	
	#section8 {
		background: linear-gradient(to bottom,
				white 0%,
				white 40%,
				rgb(25, 66, 97) 40%,
				rgb(25, 66, 97) 65%,
				rgb(128, 40, 49) 65%,
				rgb(128, 40, 49) 77%,
				white 77%,
				white 100%);

		height: auto;
	}

	.section8-context {
		justify-content: center;
		padding: 10px 0px;
	}

	.section8-context .img1-form-send,
	.section8-context .img2-form-send{
		display: none;
	}
	
	.writeToUs-zone {
		width: 90%;
	}

	.writeToUs-zone-context{
		flex-direction: column;
		text-align: center;
		gap: 10px;
		padding: 10px 0px;
	}

	#section9 {
		height: initial !important;
	}
	
	.section9-context {
		height: 100%;
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: start;
		position: relative;
	}
	
	.img1-contact-us {
		top: 30%;
		width: 100%;
		display: none;
	}
	
	.section9-context .contact-us-title h1 {
		font-size: 7vw;
	}
	
	.section9-context .contact-us-title h1 span {
		font-size: 7vw;
	}
	
	.section9-context .contact-us-title .contact-us-intro {
		/*
		font-size: 3.5vw;
		*/
		padding: 0 2%;
	}
	
	.zone-for-contacting-us {
		padding: 0 0%;
	}
	
	.zone-for-contacting-us .col-md-3 {
		height: auto;
		padding-top: 20px;
	}
	
	.zone-for-contacting-us .col-md-3 p {
		font-size: 5.2vw;
	}
	
	.zone-for-contacting-us .col-md-3 p::after {
		content: '';
		position: absolute;
		bottom: -10px;
		left: 50%;
		transform: translateX(-50%);
		width: 70%;
		height: 3px;
		background-color: rgb(135, 135, 135);
	}
	
	.zone-for-contacting-us .col-md-3 h2 {
		font-size: 5.5vw;
	}

	.zone-data-added{
		flex-direction: column;
	}

	.zone-data-added .added-disign{
		border-radius: 0px 0px 20px 20px;
		padding: 0px 0px 10px 0px;
		flex-direction: column;
		gap: 10px;
	}

	.zone-data-added .added-disign .added-title-two{
		border-radius: 0px;
		text-align: center;
		padding: 0px;
		font-size: 5.5vh;
		width: 100%;
	}

	.added-title-three{
		padding: 0px 20px !important;
	}	

	/*------------------------TRABAJO-------------------------*/

	.section10-context .left,
	.section10-context .right {
		display: none;
	}

	.section10-context .center {
		width: 100%;
	}

	.section10-context .center .box-center-context img{
		display: none;
	}

	#section11 {
		padding: 15vh 1vh 2vh 1vh;
	}

	.zone-charges button {
		width: 100%;
	}

	.zone-charges button .zc-img{
		height: 7vh;
		padding: 1vh;
	}

	.zone-charges button p {
		font-size: 1.5vh;
	}

	.title-footer-section11 {
		top: -1.6vh;
		bottom: initial;
		padding: 0px;
		border-radius: 100px 100px 0px 0px;
		text-align: center;
		width: 100%;
		font-size: 2vh;
	}

	#section12 {
		height: initial !important;
		padding-top: 15vh;
	}
	
	.section12-context .zone-one-section12,
	.section12-context .zone-two-section12 {
		height: initial !important;
	}
	
	.zone-one-section12 {
		align-items: center;
		justify-content: end;
		font-family: "now";
		padding: 0;
	}
	
	.zone-one-section12 h1:nth-child(1) {
		font-size: 8vw;
	}
	
	.zone-one-section12 h1:nth-child(2) {
		font-size: 8vw;
	}

	.custom-select-container{
		margin-top: 10px;
	}
	
	.zone-one-section12 .col-md-12 {
		padding: 10px 0px;
	}

	.zone-one-section12 .col-md-12 .col-md-6{
		padding: 0px !important;
	}

	.zone-one-section12 .col-md-12 .col-md-6:nth-child(1){
		padding-bottom: 20px !important;
	}
	
	.custom-select-options {
		z-index: 10;
		padding: 0 10px;
	}

	.zone-captcha{
		margin-top: 20px;
	}

	.button-job-send{
		padding: 0%;
		margin-top: 0px;
	}

	.zone-two-section12{
		align-items: center;
		justify-content: center;
		font-family: "now";
		color: rgb(100, 100, 100);
	}
	
	.zone-two-section12::after {
		display: none;
	}
	
	.zone-two-section12 .col-md-12{
		padding: 0;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content:center;
		text-align: center;
	}

	.zone-two-section12 svg{
		width: 100%;
	}
	
	.zone-two-section12 .col-md-12 svg{
		width: 25%;
	}
	
	.zone-two-section12 .col-md-12 p{
		white-space: pre-line;
		text-align: center;
		font-size: 25px;
	}

	.zone-two-section12 .col-md-12 p span:nth-child(1){
		margin: 0;
	}

	#section13{
		min-height: 100vh;
		max-height: auto;
	}

	.zone-product .zone-product-one{
		display: none;
	}

	.zone-product .zone-product-two{
		width: 100%;
		gap: 5vh;
		justify-content: center;
	}

	.zone-product-two .zpt-content-one h1{
		font-size: 7vh;
		letter-spacing: initial;
	}

	.zone-product-two .zpt-content-one p{
		font-size: 3vh;
		letter-spacing: initial;
	}

	.zone-product-two .zpt-content-two{
		padding: 30px;
		border-radius: 20px;
	}

	.zone-product-two .zpt-content-two .zct-title-one{
		line-height: 1;
		font-size: 3vh;
	}

	.zone-product-two .zpt-content-two h2{
		font-size: 3vh;
	}

	.zone-product-two .zpt-content-two h1{
		padding: 0px 15px;
		font-size: 3vh;
		text-align: center;
	}
	/*	
	.country{
		display: none;
	}
	*/
}

/* Tabletas (577px a 768px) */
@media (min-width: 577px) and (max-width: 768px) {
  
}

/* Laptops (769px a 1024px) */
@media (min-width: 769px) and (max-width: 1024px) {
  
}

/* Pantallas grandes y desktops (1025px en adelante) */
@media (min-width: 1025px) {
  
}

.policies{
	position: fixed;
    bottom: 10px;
    left: 10px;
    height: 10vh;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1002;
	transition: all 0.4s ease;
}

.policies img{
	height: 100%;
}

.policies:hover {
    filter: drop-shadow(0 0 15px white);
}

.policies::after {
    content: "Políticas";
    position: absolute;
    left: 100%; /* Lo coloca a la derecha */
    margin-left: 10px; /* Separación del icono */
    background-color: rgb(158, 47, 47);
    color: white;
    padding: 5px 10px;
    border-radius: 20px;
    font-size: 14px;
    white-space: nowrap;
    opacity: 0;
    transform: translateX(10px);
    transition: opacity 0.3s ease, transform 0.3s ease;
    pointer-events: none;
	font-family: "Righteous";
}

.policies:hover::after {
    opacity: 1;
    transform: translateX(0);
}

@media (max-width: 480px) {
    .policies {
        width: 50px;
        height: 50px;
    }
}

.policies-menu {
    position: fixed;
    bottom: 120px;
    left: 20px;
    display: none; /* Ocultos por defecto */
    flex-direction: column;
    gap: 10px;
	z-index: 1002;
}

.policies-menu button {
    background-color: rgb(158, 47, 47);
    border: none;
    color: white;
    padding: 10px 15px;
    border-radius: 0px 50px 50px 0px;
    cursor: pointer;
    white-space: normal;
    word-wrap: break-word;
    text-align: left;
    transition: all 0.3s ease;
    font-size: 16px;
}

@media (max-width: 480px) {
    .policies-menu {
        bottom: 100px; 
        left: 10px;
        gap: 5px;
    }

    .policies-menu button {
        font-size: 14px;
        padding: 8px 12px;
        border-radius: 0px 30px 30px 0px;
        width: 90%;
        max-width: 250px;
        text-align: center; 
		width: 300px; 
		max-width: 100%; 
    }
}

.policies-menu button:hover {
    background-color: #555;
}


.modal-policies {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    justify-content: center;
    align-items: center;
    z-index: 1003;
}

.modal-container-policies {
    background-color: white;
    width: 80%;
    max-width: 800px;
    max-height: 90vh;
    overflow-y: auto;
    border-radius: 5px;
	position: relative;
}

.close-button-modal-policies {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 30px;
    font-weight: bold;
    cursor: pointer;
    color: white;
}

.close-button-modal-policies:hover {
    color: #000;
}

.modal-container-policies .modal-content-data {
    padding: 50px;
}

@media (max-width: 480px) {
	.modal-container-policies .modal-content-data {
		padding: 30px;
	}
}

.close-button {
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
}

.modal-body {
    max-height: 70vh;
    overflow-y: auto;
}

.chat-container {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 350px;
    height: 500px;
    background: white;
    border-radius: 15px;
    box-shadow: 0 0 20px rgba(0,0,0,0.2);
    display: none;
    flex-direction: column;
    z-index: 9999;
	transform-origin: bottom right;
    transition: all 0.3s ease;
    opacity: 0;
    transform: scale(0.1) translateX(100px); 
}

.chat-container.visible {
    display: flex;
    opacity: 1;
    transform: scale(1) translateX(0);
}
 
@media (max-width: 768px) {
    .chat-container {
        width: 90%;
        height: 60vh;
        right: 5%;
        bottom: 10px;
    }
}
 
@media (max-width: 480px) {
    .chat-container {
        width: 95%;
        height: 70vh;
        right: 2.5%;
    }
}
 
.chat-button {
    position: fixed;
    bottom: 0px;
    right: 0px;
    height: 10vh;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1002;
	transition: all 0.4s ease;
}

.chat-button img{
	height: 100%;
}

.chat-button:hover {
    transform: rotate(-10deg);
    filter: drop-shadow(0 0 15px white);
}
 
@media (max-width: 480px) {
    .chat-button {
        width: 50px;
        height: 50px;
    }
}
 
.chat-header {
    background: rgb(37, 182, 61);
    color: white;
    padding: 15px;
    border-radius: 15px 15px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
	z-index: 2;
}

.chat-header img{
	width: 250px;
	pointer-events: none;
}
 
.chat-messages {
    flex: 1;
    padding: 15px;
    overflow-y: auto;
    background: #f8f9fa;
}
 
.chat-input-container {
    padding: 10px;
    border-top: 1px solid #ddd;
    background: white;
    display: flex;
    gap: 10px;
	border-radius: 0 0 50% 50%;
	z-index: 2;
}
 
.message {
    margin: 10px 0;
    padding: 10px;
    border-radius: 10px;
    max-width: 95%;
    word-wrap: break-word;
}
 
.user-message {
    background: rgb(37, 182, 61);
    color: white;
    margin-left: auto;
}
 
.bot-message {
    background: #e9ecef;
    color: black;
}
 
.bot-message ul,
.bot-message ol {
    margin: 10px 0;
    padding-left: 10px;
}
 
.bot-message li {
    margin: 5px 0;
}
 
.chat-input {
    flex: 1;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
    outline: none;
}
 
.send-button {
    padding: 10px 15px;
	background: rgb(37, 182, 61);
    color: white;
    border: none;
    border-radius: 5px;
    cursor: pointer;
}
 
.close-button {
    cursor: pointer;
    padding: 5px;
}
 
.scroll-indicator {
  position: absolute;
  bottom: 20px;
  width: 100%;
  display: flex;
  justify-content: center;
  z-index: 2;
}
 
.arrow-down {
  position: absolute;
  width: 30px;
  height: 30px;
  left: 30px;
  border-right: 10px solid #333;
  border-bottom: 10px solid #333;
  transform: rotate(45deg);
  animation: bounce 1.5s infinite ease-in-out;
  margin-top: -30px;
}
 
@keyframes bounce {
  0%, 20%, 50%, 80%, 100% {
    transform: translateY(0) rotate(45deg);
  }
  40% {
    transform: translateY(10px) rotate(45deg);
  }
  60% {
    transform: translateY(5px) rotate(45deg);
  }
}
 
@media (max-width: 575.98px) {
  .arrow-down {
    width: 20px;
    height: 20px;
    border-right: 3px solid #fff;
    border-bottom: 3px solid #fff;
  }
}
 
.typing-indicator {
    display: none; /* Oculto por defecto */
    justify-content: center;
    gap: 5px;
    padding: 10px;
    background: #f8f9fa; /* Fondo para que combine con el chat */
}
 
.typing-indicator span {
    width: 8px;
    height: 8px;
    background: rgb(37, 182, 61);
    border-radius: 50%;
    animation: typing 1s infinite ease-in-out;
}
 
.typing-indicator span:nth-child(2) {
    animation-delay: 0.2s;
}
 
.typing-indicator span:nth-child(3) {
    animation-delay: 0.4s;
}
 
@keyframes typing {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-5px);
    }
}
