* {
	margin  : 0;
	padding : 0;
}

/*---------------------------Fuentes----------------------------*/
@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Black.ttf") format("opentype");
	font-weight  : 900;
	font-display : block;
	font-style   : normal;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Black.eot#iefix") format("embedded-opentype");
	font-weight  : 900;
	font-display : block;
	font-style   : bold;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Black.woff") format("woff");
	font-weight  : 900;
	font-display : block;
	font-style   : normal;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Black.svg") format("svg");
	font-weight  : 900;
	font-display : block;
	font-style   : normal;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Black.ttf") format("opentype");
	font-weight  : 900;
	font-display : block;
	font-style   : normal;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Bold.eot#iefix") format("embedded-opentype");
	font-weight  : 700;
	font-display : block;
	font-style   : bold;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Bold.woff") format("woff");
	font-weight  : 700;
	font-display : block;
	font-style   : normal;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Bold.svg") format("svg");
	font-weight  : 700;
	font-display : block;
	font-style   : normal;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Medium.ttf") format("opentype");
	font-weight  : 500;
	font-display : block;
	font-style   : normal;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Medium.eot#iefix") format("embedded-opentype");
	font-weight  : 500;
	font-display : block;
	font-style   : bold;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Medium.woff") format("woff");
	font-weight  : 500;
	font-display : block;
	font-style   : normal;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Medium.svg") format("svg");
	font-weight  : 500;
	font-display : block;
	font-style   : normal;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Light.ttf") format("opentype");
	font-weight  : 300;
	font-display : block;
	font-style   : normal;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Light.eot#iefix") format("embedded-opentype");
	font-weight  : 300;
	font-display : block;
	font-style   : bold;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Light.woff") format("woff");
	font-weight  : 300;
	font-display : block;
	font-style   : normal;
}

@font-face {
	font-family  : "Roboto";
	src          : url("../../fonts/Roboto/Roboto-Light.svg") format("svg");
	font-display : block;
	font-weight  : 300;
	font-style   : normal;
}

/*------------------Generales------------------*/
h1,
h2,
h3,
h4,
h5,
h6,
p,
span,
a,
::placeholder,
button,
input,
label,
textarea {
	font-family : "Roboto";
}

h1,
.h1 {
	font-size     : min(max(16px, 5vw), 4vw);
	font-weight   : 500;
	margin-bottom : 20px;
}

h2 {
	font-size   : 4vw;
	line-height : 4.5vw;
	font-weight : 500;
}

h3 {
	font-size   : 30px;
	line-height : 30px;
}

h4 {
	font-size   : 24px;
	line-height : 24px;
}

h5 {
	font-size   : 21px;
	line-height : 26px;
}

p {
	font-size     : 16px;
	line-height   : 24px;
	font-weight   : 400;
	margin-bottom : 10px;
}

span,
a {
	font-size   : 17px;
	line-height : 17px;
}

.mobileElement {
	display : none !important;
}

a {
	cursor : pointer;
}

section {
	padding : 5rem 0;
}

img,
textarea {
	resize : none;
}

.white {
	color : white;
}

.blue {
	color : #133454;
}

.light-blue {
	color : #0092D9;
}

.background-blue {
	background : #133454;
}

.background-white {
	background : white;
}

.background-light-blue {
	background : #0092D9;
}

.background-light-gray {
	background : #C2D7DE;
}
.container {
	height : 100vh;
}
.square {
	max-width       : 650px;
	width           : 35%;
	padding         : 0 5%;
	height          : 100%;
	display         : flex;
	flex-direction  : column;
	justify-content : center;
}

.square-right {
	margin-left            : auto;
	border-top-left-radius : 50px;
	height                 : 100%;
	display                : flex;
	flex-direction         : column;
	align-items            : center;
	justify-content        : center;
}

.button {
	display       : flex;
	align-items   : center;
	padding       : 8px 20px;
	font-weight   : 500;
	border-radius : 50px;
	width         : fit-content;
	cursor        : pointer;
}

.button img {
	width       : 22px;
	margin-left : 10px;
}

.button-white {
	border : 1.5px solid white;
	color  : white;
}

.button-blue {
	border : 1.5px solid #133454;
	color  : #133454;
}
/* -------------Header--------------- */
header {
	position         : fixed;
	top              : -70px;
	width            : 100%;
	height           : 70px;
	z-index          : 2;
	background-color : #FFF;
	box-shadow       : 0px 4px 15px -5px rgba(0, 0, 0, 0.3);
	transition       : 0.5s all ease-in-out;
}

#languageMobile {
	width       : 100%;
	display     : flex;
	align-items : center;
	gap         : 10px;
}

.language {
	width : 60px !important;
}

.active {
	top : 0;
}

.row {
	height : 100%;
}

.desktop-menu {
	height : 100%;
}

header .container {
	height : 100%;
	width  : 90%;
	margin : auto;
}

.row > div {
	display         : flex;
	align-items     : center;
	justify-content : space-between;
}

#headerLogoLink {
	display : flex;
}

#logoHeader {
	width      : 250px;
	object-fit : contain;
}

.mainmenu {
	display  : flex;
	position : relative;
}

.mainmenu li {
	margin      : 0px 25px;
	display     : flex;
	list-style  : none;
	align-items : center;
}
.mainmenu li .selected {
	position       : relative;
	cursor         : pointer;
	transition     : 0.5s all ease-in-out;
	border-bottom  : 2px solid transparent;
	padding-bottom : 1px;

}

.mainmenu li .selected::after {
	content    : "";
	display    : block;
	width      : 0;
	height     : 2px;
	background : #133454;
	transition : width 0.3s;
}

.mainmenu li .selected:not(.language):hover::after {
	width: 100%;
}

.mainmenu select {
	font-size             : 14px !important;
	line-height           : 14px;
	background            : url("/files/iconos/arrow-changeLanguage.svg");
	background-repeat     : no-repeat;
	border                : unset;
	width                 : 55px;
	font-size             : 15px;
	background-position-x : right;
	background-position-y : 50%;
	display               : none !important;
}

.language {
	width   : 40px;
	cursor  : pointer;
	opacity : 0.2;
}
.language.selected {
	opacity : 1;
}

/* Burger Menu */
#main-container-responsive {
	display : none;
}
#container-menu-responsive nav {
	display : none;
}

/* Sub menu hover */
#mainnav ul.submenu {
	position           : absolute;
	left               : 0;
	top                : 20px !important;
	width              : fit-content;
	text-align         : left;
	background-color   : transparent;
	z-index            : 9999;
	-ms-filter         : "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter             : alpha(opacity=0);
	opacity            : 0;
	visibility         : hidden;
	-webkit-transition : all 0.3s ease-in-out;
	-moz-transition    : all 0.3s ease-in-out;
	-ms-transition     : all 0.3s ease-in-out;
	-o-transition      : all 0.3s ease-in-out;
	transition         : all 0.3s ease-in-out;
	display            : flex;
	flex-direction     : column;
	left               : 5px;
	padding            : 20px;
}
#mainnav ul.submenu li:first-child {
	border-top : none;
}
#mainnav ul li ul li {
	margin-left : 0;
}
#mainnav ul.submenu > li > a {
	text-decoration    : none;
	line-height        : 30px;
	-webkit-transition : all 0.3s ease-in-out;
	-moz-transition    : all 0.3s ease-in-out;
	-ms-transition     : all 0.3s ease-in-out;
	-o-transition      : all 0.3s ease-in-out;
	transition         : all 0.3s ease-in-out;
}
#mainnav ul li:hover > ul.submenu {
	top        : 100%;
	-ms-filter : "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter     : alpha(opacity=100);
	opacity    : 1;
	visibility : visible;
}

/*-----------------Footer-----------------*/
footer {
	display         : flex;
	padding         : 5%;
	background      : #133454;
	justify-content : space-between;
}
.section-footer h5,
.section-footer p {
	color : white !important;
}
.section-footer h5 {
	margin-bottom  : 15px;
	text-transform : uppercase;
}
.section-footer p {
	font-size   : 13px;
	line-height : 18px;
}
.section-footer:last-child div {
	display : flex;
}
.section-footer:last-child div img:first-child {
	margin-right : 10px;
}
.section-footer:last-child div img {
	width  : 30px;
	height : 30px;
	cursor : pointer;
}

/*--------------------- RESPONSIVE ----------------------*/

/* Mobile */
@media screen and (max-width : 768px) {
	/*---------------Generales---------------*/
	#videoContainer {
		height : 28vh !important;
	}

	.container {
		height : unset;
		/* padding: 70px 0; */
	}

	.desktopElement {
		display : none !important;
	}

	.mobileElement {
		display : block !important;
	}

	h1 {
		margin-bottom : 10px;
		font-size     : min(max(30px, 10vw), 7vw) !important;
		line-height   : min(max(30px, 10vw), 7vw) !important;
	}

	h2 {
		font-size   : 30px !important;
		line-height : 40px !important;
	}

	h3 {
		font-size   : 16px;
		line-height : 17px;
	}

	h4 {
		font-size   : 20px;
		line-height : 24px;
	}

	h5,
	.h5 {
		font-size   : 17px;
		line-height : 22px;
	}

	p {
		font-size   : 14px;
		line-height : 22px;
	}

	span {
		font-size   : 14px;
		line-height : 15px;
	}

	.square {
		width                      : calc(100% - 10%);
		border-bottom-right-radius : 0 !important;
		border-top-left-radius     : 0;
		padding                    : 80px 5%;
		max-width                  : unset;
	}

	.button {
		font-size : 14px;
	}

	/*---------------Header------------------*/
	header {
		box-shadow : none;
		top        : 0;
	}

	header .container {
		width  : 85%;
		height : 100% !important;
	}

	.row {
		height          : 100%;
		display         : flex;
		align-items     : center;
		width           : 100%;
		margin          : auto;
		justify-content : space-between;
	}

	#logoHeader {
		width : 150px;
	}

	.mainmenu {
		flex-direction  : column;
		justify-content : center;
		align-items     : center;
		width           : 85%;
		margin          : auto;
		align-items     : baseline;
		position        : unset;
	}

	/* Burger Menu */
	#main-container-responsive {
		display : block;
		height  : auto;
	}

	#hamburger button {
		background : none;
		border     : 0;
		cursor     : pointer;
		padding    : 0;
		width      : 35px;
		height     : 35px;
	}

	#hamburger button span {
		background-color : #133454;
		display          : block;
		height           : 2px;
		width            : 90%;
		margin           : 7px auto;
	}

	#hamburger button.open span {
		margin : 0;
	}

	#hamburger button.open span:nth-child(2),
	#hamburger button.open span:nth-child(1) {
		margin-bottom : 7px;
		margin-left   : auto;
	}

	#hamburger button.open span:nth-child(2) {
		width : 25px;
	}

	#hamburger button.open span:nth-child(3) {
		width       : 15px;
		margin-left : auto;
	}

	/* Menu */
	#container-menu-responsive.open {
		background      : #FFF;
		display         : flex !important;
		/* padding-left: 15px !important; */
		width           : 100%;
		justify-content : center;
		padding         : 2rem 0;
	}

	#container-menu-responsive {
		box-shadow         : 1px 26px 43px -30px rgb(0 0 0 / 22%);
		-webkit-box-shadow : 1px 26px 43px -30px rgb(0 0 0 / 22%);
		-moz-box-shadow    : 1px 26px 43px -30px rgb(0 0 0 / 22%);
	}

	#container-menu-responsive.open header {
		background-color : white;
	}

	.mainmenu li {
		margin : 20px 0;

	}

	#container-menu-responsive nav.open {
		animation : menu-animation 0.7s ease 0s 1 normal forwards;
		display   : block;
		padding   : 3rem 0;
	}

	/*---------------Footer------------------*/
	footer {
		flex-direction : column;
		padding        : 10% 5%;
	}

	.section-footer:not(:last-child) {
		border-bottom  : 1px solid white;
		margin-bottom  : 30px;
		padding-bottom : 20px;
	}
}