
* {
	margin: 0;
	padding: 0;
	font-family: 'proxima-nova', sans-serif;
	box-sizing: border-box;
}

body {
	color: #062D4D;
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	margin: 0;
	overflow-x: hidden;
	font-family: var(--headingFontFamily);
	--headingFontFamily: 'proxima-nova', sans-serif;
	--bodyFontFamily: 'proxima-nova', sans-serif;
}

body{
	--colorWhite: #ffffff;
	--colorDarkBlue: #062D4D;
	--colorYellowSun: #FFAD1D;
	--colorLightBlue: #35B7F4;
	--colorGreen: #B9FF1D;
	
	--light: 100;
	--regular: 300;
	--bold: 600;
	--extrabold: 900;
	
	--containerSizeReport: 1450px;
}
h1, h2, h3, h4, h5, h6, span,p{
	color: var(--colorDefaultHeading, #2B2B2B);
	 
}
.main_color{
	--colorDefaultHeading: #2B2B2B;
}
.alternate_color{
	--colorDefaultHeading: #ffffff;
}



/* base and helper classes */

.an-section-zero {
	position: relative;
	.an-container{
		overflow: hidden;
	}
	.observer-section{
		height: 100vh;
		position: relative;
		.slide{
			position: absolute;
			overflow: hidden;
			height: 100vh;
			top: 0;
			will-change: transform;
			width: 100%;
			background-color: var(--colorDarkBlue);
		}
		
	}
	.key-tag{
		width: fit-content;
		background: var(--colorLightBlue);
		color: var(--colorWhite);
		padding: 8px 10.5px;
		display: block;
		margin: auto;
		animation: wiggle-animation 2s ease-in-out infinite;
		
		span{
			font-size: 20px;
			line-height: 22px;
			text-align: center;
			font-weight: 700;
			display: block;
			color: inherit;
		}
	}
	.section-70-title{
		 
		text-align: center;
		font-size: var(--sunTitle, 70px);
		@media only screen and (min-width: 990px) and (max-width: 1310px){
			--sunTitle: 3.89vw;
		}
		@media only screen and (max-width: 989px){
			--sunTitle: 2.9vw;
		}
		@media only screen and (max-width: 767px){
			--sunTitle: 25px;
		}
	}
	.div-text-title{
		font-size: var(--WhiteSectionTitle, 45px);
		line-height: 1.2;
		font-weight: var(--extrabold);
		@media only screen and (min-width: 990px) and (max-width: 1310px){
			--WhiteSectionTitle: 3.4vw;
		}
		@media only screen and (max-width: 989px){
			--WhiteSectionTitle: 2.9vw;
		}
		@media only screen and (max-width: 767px){
			--WhiteSectionTitle: 22px;
		}
	}
	.background-svg-position{
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translateX(-50%) translateY(-50%);
		pointer-events: none;
	}
	.content_front{
		z-index: 1;
		position: relative;
	}
	.highlight-intext{
		background-color: var(--colorGreen);
		color: var(--colorDarkBlue);
		display: inline-block;
		padding: 12px 20px 8px;
		margin: 0;
		font-weight: bolder;
		transform: rotate(-4deg);
		animation: wiggle-animation 4s ease-in-out infinite;
		font-size: 0.6em;
		line-height: 1;
	}
	
	.an-sixteen-content{
		background-color: var(--colorWhite);
	}
	.an-sixteen-content-inner{
		position: relative;
		overflow: hidden;
		min-height: 100vh;
	}
	
	.an-four-content,.an-five-content{
		min-height: 100vh;
	}
	.hero-type-text{
		font-size: var(--h1FontSize, 109px) !important;
		line-height: 1.11;
		font-weight: var(--extrabold);
		@media only screen and (min-width: 990px) and (max-width: 1310px){
			--h1FontSize: 8vw;
		}
		@media only screen and (max-width: 989px){
			--h1FontSize: 7vw;
		}
		@media only screen and (max-width: 480px){
			--h1FontSize: 40px;
		}
	}
}
.an-first-content{
	margin: auto;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	gap: 7vh;
	text-align: center;
	height: 100vh;
	.an-first-content-inner{
		position: relative;
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		
		h1 {
			max-width: 1000px;
			padding: 0px 15px;
			margin-bottom: var(--separationTitle, 60px);
			@media only screen and (min-width: 990px) and (max-width: 1310px){
				--separationTitle: 4.5vw;
			}
			@media only screen and (max-width: 989px){
				--separationTitle: 3vw;
			}
			@media only screen and (max-width: 480px){
				--separationTitle: 25px;
			}
		}
		.description {
			max-width: 708px;
			color: var(--colorWhite);
			font-size: 20px;
			padding: 0px 15px;
			line-height: 30px;
			font-weight: var(--regular);
		}
	}
	.background-svg-position#blue-circles-bg{
		width: 1980px;
	}
}
/* Second Page (Map) */
.an-second-content[style *= 'transform: translate(0px, 0px);']{
	--mapOpacity: 1;
}
.an-second-content {
	.an-second-content-inner{
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		height: 100%;
		.map-svg {
			position: absolute;
			transform: translate(7px, 10px);
			width: 100%;
			height: auto;
			max-width: 1134.9px;
			margin: 0 auto;
			opacity: var(--mapOpacity, 0);
			transition: opacity ease-in-out 1.5s;
		}
		.map-content-child {
			display: flex;
			flex-direction: column;
			justify-content: center;
			max-width: 910px;
			align-items: center;
			text-align: center;
			padding: 5%;
			background-color: var(--colorLightBlue);
			border-radius: 0.65vw;
			margin: auto;
			p{
				color: var(--colorDarkBlue);
				line-height: 1.6;
				font-weight: var(--bold);
				font-size: var(--fontSizeMapDescription, 25px);
				margin-bottom: 6%;
			}
			.map-pretitle {
				color: var(--colorWhite);
				font-weight: var(--extrabold);
				font-size: var(--mapPretitle, 51px);
				@media only screen and (min-width: 990px) and (max-width: 1310px){
					--mapPretitle: 3.89vw;
				}
				@media only screen and (max-width: 989px){
					--mapPretitle: 2.9vw;
				}
				@media only screen and (max-width: 480px){
					--mapPretitle: 25px;
				}
			}
		}
	}
	
}

/* tercera pagina */
.an-three-content{
	.an-section-three{
		background-color:  var(--backgroundColorSunSection, var(--colorYellowSun));
		position: relative;
		padding: 180px 0px;
		&  div{
			position: relative;
		}
	}
	.first-yellow{
		display: flex;
		flex-direction: column;
		justify-content: space-between;
		padding: 0px 30px !important;
		.sun-heading-container {
			max-width: 1310px;
			margin: 0px auto;
			position: relative;
			z-index: 2;
			.sun-title {
				max-width: 1080px;
				margin: 35px 0px 0px;
				line-height: 1.2;
				font-weight: var(--extrabold);
				
			}
		}
	}
	.second-yellow{
		--maxwidthSun: 1450px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding: 0px 25px 80px !important;
		position: relative;
		width: 100%;
		max-width: var(--maxwidthSun);
		margin-top: 60px;
		margin-left: auto;
		margin-right: auto;
		aspect-ratio: 1/1;
		.sun, 
		.layer-middle,
		.layer-inner {
			height: auto;
			aspect-ratio: 1/1;
			border-radius: 50%;
			height: auto;
			display: flex;
			justify-content: center;
			align-items: center;
		}
		.sun {
			width: var(--sunWidth, 0%); 
			position: absolute;
			border-radius: 50%;
			background-color: #febf10; 
			max-width: var(--maxwidthSun);
			@media only screen and (max-width: 989px){
				width:  900px; 
			}
			.layer-middle {
				width: var(--sunWidthInner, 0%); 
				background-color: #ffd008; 
			}
			.layer-inner {
				width: var(--sunWidthInnerDeep, 0%); 
				background-color: #feda00;
			}
		}
		.sun-content-inner{
			z-index: 1;
			position: relative;
			padding: 10%;
			@media only screen and (max-width: 989px){
				padding: 120px 5%;
			}
			.sun-heading-container {
				max-width: 1310px;
				position: relative;
				h2 {
					margin: 0px auto 35px;
					font-size: 51px;
					line-height: 1.1;
					font-weight: var(--extrabold);
					text-align: center;
					opacity: 1;
					font-size: var(--sunTitleInner, 51px);
					@media only screen and (min-width: 990px) and (max-width: 1310px){
						--sunTitleInner: 3.9vw;
					}
					@media only screen and (max-width: 989px){
						--sunTitleInner: 3.2vw;
					}
					@media only screen and (max-width: 767px){
						--sunTitleInner: 25px;
					}
					@media only screen and (max-width: 480px){
						margin: 0px auto 10px;
					}
				}
				p {
					max-width: 1100px;
					margin: 0px auto;
					font-size: 22px;
					line-height: 1.7;
					font-weight: bold;
					 
					text-align: center;
					color: #30292a;
					@media only screen and  (max-width: 1310px){
						font-size: 18px;
					}
					@media only screen and  (max-width: 767px){
						font-size: 16px;
					}
					@media only screen and  (max-width: 320px){
						font-size: 12px;
					}
				}
			}
			.estadistics-container {
				display: flex;
				flex-direction: column;
				margin: 50px auto 0px;
				max-width: 1100px;
			}
			.graphic-bar-container {
				display: grid;
				grid-auto-flow: column;
				grid-template-columns: 50% 50%;
				.graphic-rectangles {
					border-left: 1px solid #062D4D;
					height: fit-content;
					opacity: 1;
					width: 50%;
					.bar {
						min-height: 22px;
						min-width: fit-content;
						width: var(--barWidth, 0px);
						display: flex;
						align-items: center;
						justify-content: end;
						padding: 0px 6px 0px 6px;
						span {
							display: block;
							 
							font-weight: bold;
							font-size: 14px;
							line-height: 16px;
							text-align: right;
							color: #fff;
						}
						p{
							color: white;
							opacity: 1 !important;
						}   
					}
					.bar:nth-child(odd) {
						background-color: #35B7F4;
					}
					.bar:nth-child(even) {
						background-color: #062D4D;
						margin-top: 3px;
					}
				}
				.graphic-text {
					padding-right: 2.60vw;
					p {
						 
						font-weight: 700;
						font-size: 14px;
						line-height: 25px;
						text-align: right;
						color: #2B2B2B;
					}
				}
			}
			
			.graphic-bar-container:not(:last-child) .graphic-rectangles {
				padding-bottom: 1.95vw;
			}
			.estadistics-box {
				max-width: 357px;
				height: fit-content;
				display: flex;
				justify-content: center;
				column-gap: 48px;
				position: relative;
				padding: 15px 35px;
				border-radius: 1.95vw;
				background: rgba(255, 255, 255, 0.3);
				opacity: 1;
				margin: 50px auto 0px;
				.box-backup {
					color: #2B2B2B;
					display: flex;
					align-items: center;
					font-size: 14px;
				}
				.box-backup:nth-child(1)::before {
					content:"";
					min-width: 17px;
					height: 17px;
					background-color: #35B7F4;
					margin-right: 1.30vw;
				}
				.box-backup:nth-child(2)::before {
					content:"";
					min-width: 17px;
					height: 17px;
					background-color: #062D4D;
					margin-right: 1.30vw;
				}
			}
		}
		
	}
	.first-white{
		margin-top: 80px;
		.content-anm{
			margin: 0 auto;
			height: 100%;
			display: flex;
			align-items: end;
			justify-content: end;
			padding: 0px 25px;
			max-width: var(--containerSizeReport);
			.content-primary-anm{
				width: 100%;
				margin-bottom: 80px;
				.title-anm{
					padding: 40px 0px 50px;
					opacity: 1;
					
				}
				.group-persons-anm{
					position: relative;
					justify-content: center;
					display: flex; 
					.item-person:not(:hover){
						.group-person-inner{
							rect, path, line{
								fill: var(--fill-transition, #062d4e);
							}
						}
						
					}
					.item-person{
						z-index: 1;
						svg{
							overflow: visible;
						}
						.group-person-inner{
							cursor: pointer;
							rect, path, line{
								stroke: #062d4e;
								transition: fill 0.25s ease-in-out, stroke 0s ease-out;
							}
							ellipse{
								stroke: #062d4e;
								transition: stroke 0s ease-out;
							}
							&.active{
								rect, path, line{
									fill: revert-layer;
									stroke: revert-layer;
								}
								ellipse{
									stroke: revert-layer;
								}
							}
						}
					}
					&::before{
						content: "";
						background: #D2D6D8;
						position: absolute;
						bottom: -0.33vw;
						width: 100%;
						height: 1.63vw;
						min-height: 15px;
						border-radius: 50%;
						z-index: 0;
					}
				}
				
				.item-person:nth-child(1) svg {
					transform: translateY(1.14vw);
					margin-right: 0.61vw;
					margin-left: 1.5vw;
					width: 6.84vw;
					height: 11.47vw;
				}
				.item-person:nth-child(2) svg {
					transform: translateY(2.15vw);
					margin-right: 0.92vw;
					width: 8.56vw;
					height: 10.43vw;
				}
				.item-person:nth-child(3) svg {
					transform: translateY(2.15vw);
					margin-right: 1.30vw;
					width: 6.51vw;
					height: 10.43vw;
				}
				.item-person:nth-child(4) svg {
					transform: translateY(1.20vw);
					margin-right: 0.89vw;
					width: 6.70vw;
					height: 11.47vw;
				}
				.item-person:nth-child(5) svg {
					transform: translateY(1.47vw);
					margin-right: -2.75vw;
					width: 10.25vw;
					height: 11.17vw;
				}
				.item-person:nth-child(6) svg {
					margin-right: 1.44vw;
					width: 6.29vw;
					height: 12.64vw;
				}
				.item-person:nth-child(7) svg {
					transform: translateY(1.47vw);
					margin-right: 1.44vw;
					width: 6.55vw;
					height: 11.13vw;
				}
				.item-person:nth-child(8) svg {
					transform: translateY(1.47vw);
					margin-right: 1.44vw;
					width: 8.04vw;
					height: 11.12vw;
				}
				.item-person:nth-child(9) svg {
					transform: translateY(1.14vw);
					margin-right: 1.44vw;
					width: 6.68vw;
					height: 11.73vw;
				}
				.item-person:nth-child(10) svg {
					transform: translateY(0.81vw);
					width: 9.20vw;
					height: 11.73vw;
				}
			}
		}
	}
}
.idea-section{
	position: relative;
	height: 400vh;
	background-color: var(--colorDarkBlue);
	#blue-circles-bg{
		width: 1980px;
	}
	.idea{
		overflow: hidden;   
		top: 0;
		will-change: transform;
		width: 100%;
		background-color: var(--colorDarkBlue);
	}
	.an-seven-content {
		display: flex;
		justify-content: center;
		flex-direction: column;
		width: 100%;
		height: 100vh;
		background-color: #062D4D;
		color: var(--colorWhite);
		font-weight: bold;
		overflow: hidden;
		.idea-content{
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			position: relative;
			width: 100%;
			max-width:  1400px;
			margin-left: auto;
			margin-right: auto;
			.idea-content-description {
				max-width: 650px;
				text-align: center;
				font-size: 20px;
				font-weight: var(--regular);
				line-height: 1.5;
				margin: 40px auto 0 auto;
				
			}
		}
		.idea-section-inner{
			width: 100%;
			height: 100%;
			min-height: 100vh;
			padding: 10%;
			display: flex;
		}
		.idea-title{
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			font-size: 109px;
			line-height: 0.9;
			text-align: center;
		}
		.seven-section-bottom{
			display: flex;
			flex-direction: row;
			width: 100%;
			margin-top: 3%;
			@media only screen and (min-width: 990px){
				align-items: center;
				justify-content: center;
				gap: 5%;
				
			}
			@media only screen and (max-width: 989px){
				margin-top: 5%;
			}
			@media only screen and (max-width: 480px){
				flex-direction: column;
			}
			.content-box:first-child{
				@media only screen and (max-width: 480px){
					margin-bottom: 5%;
				}
			}
			.content-box {
				display: flex;
				flex-direction: column;
				align-items: center;
				background-color: #35B7F4;
				border-radius: 6px;
				border: 8px solid white;
				width: 100%;
				max-width: 290px;
				padding: 2.5%;
				@media only screen and (min-width: 768px){
					min-height: 281px;
				}
				
				.percentage{
					font-size: clamp(40px, 4.56vw, 70px);
					font-weight: bold;
					color: white;
					margin-top: clamp(10px, 1.5vw, 23.04px);
				}
				
				.description{
					text-align: center;
					font-size: 14px;
					font-weight: bold;
					color: var(--colorDarkBlue);
					p{
						color: inherit;
					}
				}
				.stat{
					font-size: 14px;
					font-style: italic;
					font-weight: var(--light);
					color: var(--colorDarkBlue);
					margin-top: auto;
					p{
						color: inherit;
						
					}
				}
				
			}
			.image {
				display: flex;
				flex-direction: column;
				align-items: center;
				@media only screen and (max-width: 767px){
					display: none;
				}
				.light-image {
					display: flex;
					margin-bottom: 22px;
					position: relative;
				}
				.light-image::after {
					content: '';
					position: absolute;
					bottom: 25px;
					left: -6px;
					width: 63px;
					height: 70px;
					background: #ffff0099;
					border-radius: 50%;
					box-shadow: 0 0 15px rgba(255, 255, 0, 0.8), 0 0 30px rgba(255, 255, 0, 0.5);
					opacity: 0;
					animation: glow 1.5s ease-in-out infinite alternate;
					z-index: 1;
				}
				.person-image {
					position: relative;
					display: inline-block;
					img {
						width: 207px;
						height: 225px;
						position: relative;
						z-index: 2;
						transform: translateX(20px);
					}
				}
				.person-image::after {
					content: '';
					position: absolute;
					top: 91.5%;
					left: 50%;
					transform: translateX(-50%);
					width: 174px;
					height: 20px;
					border-radius: 50%;
					background: rgba(0,0,0,0.3);
					z-index: 1;
				}
			}
		}
		
	}
}
.an-four-content{
	opacity: 1;
	background-color: var(--colorWhite);
	.content-anm{
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		overflow: hidden;
		padding-top: 60px;
		height: 100vh;
	}
	.text-container-field{
		width: 100%;
		max-width: 1160px;
		color: var(--colorDarkBlue);
		margin-bottom: 60px;
		padding: 0 50px;
		@media only screen and (max-width: 989px){
			padding: 0 7.5vw;
		}
		div{
			
			padding-bottom: 40px;
			max-width: 1300px;
			
		}
		p {
			font-size: 20px;
			line-height: 1.5; 
			max-width: 680px;
			@media only screen and (max-width: 767px){
				font-size: 16px;
			}
		}
	}
	
	
	.image-container-field {
		width: 100%; 
		height: 100%; 
		position: relative;
		img{
			width: 100%;
			object-fit: cover;
			object-position: top;
			position: absolute;
			bottom: 0;
			max-height:  var(--maxHeightHills, 300px);
			height: 100%;
			transition: max-height cubic-bezier(0, 0, 0.82, 0.14) 0.5s;
			aspect-ratio: 1601/488;
		}
	}
}

.an-five-content{
	opacity: 1;
	display: flex;
	flex-direction: column;
	width: 100%;
	min-height: 100vh;
	background-color: #F2F9FC;
	z-index: 0;
	.matrix{
		height: 100% !important;
	}
	.five-content-main {
		margin-left: auto;
		margin-right: auto;
		max-width: 1250px;
		padding: 0 50px; 
		@media only screen and (max-width:989px){
			padding: 0 7.94vw;
		}
	}
	.bottom-images{
		display: flex;
		align-items: center;
		justify-content: center;
		column-gap: 3.45vw;
		margin-top: 3.58vw;
		margin-left: auto;
		margin-right: auto;
		max-width: 1250px;
		padding: 0 50px; 
		@media only screen and (max-width:989px){
			padding: 0 7.94vw;
		}
		.user-images{
			width: 10%;
			img {
				width: 100%;
				aspect-ratio: 1/1;
				height: auto;
				border-radius: clamp(0.5px ,0.52vw, 8px);
				padding: 0.98vw 0.65vw;
			}
		}
	}
}

.an-five-content .bottom-images .user-icon img {
	background-color: #35B7F4;
}

.an-five-content .bottom-images .robot-icon img {
	background-color: #FF941F;
	animation: jump-shaking 1.83s infinite;
}



/*Pagina 6*/
.an-six-content {
	width: 100%;
	min-height: calc(100vh - 140px);
	background-color: #F2F9FC;
	overflow: hidden;
	.an-six-content-inner{
		padding: 70px 50px; 
		justify-content: center;
		display: flex;
		flex-direction: column;
		width: 100%;
		max-width: 1250px;
		margin: 0 auto;
		@media only screen and (max-width:989px){
			padding: 70px 7.94vw;
		}    
	}
	.top-content{
		.title {
			margin: 0 auto;
			margin-top: 75px;
		}
		.subtitle{
			display: flex;
			font-size: 22px;
			line-height: 25px;
			font-weight: bold;
			margin-top: 35px;
			p{
				background-color: #B9FF1D;
				padding: 10px 14px;
			}
		}
	}
	.visual-content{
		display: flex;
		flex-direction: row;
		column-gap: 18px;
		margin-bottom: 30px;
		margin-top: 27px;
		justify-content: space-between;
		.create, .invent, .ideate{
			display: flex;
			flex-direction: column;
			border-radius: 10px;
			align-items: center;
			justify-content: center;
			width: 30%;
			height: auto;
			padding: 2%;
			.visual-content-text{
				margin-top: auto;
			}
		}
		.create{
			background-color: #3EC999;
			.create-image{
				img{
					animation: jump-shaking 1.83s infinite;
					width: clamp(60px, 9.18vw, 120px);
					
				}
			} 
			.create-text  {
				img{
					width: clamp(70px, 12.23vw, 187.81px);
					margin-top: 10px;
				}
			}
		}
		.invent{
			background-color: #FF941F;
			.invent-image {
				position: relative;
				z-index: 0;
				img{
					width: clamp(50px, 9.14vw, 100px);
				}
			}
			.invent-image::after {
				content: '';
				position: absolute;
				bottom: clamp(35.79px, 3.89vw, 59.75px);
				width: clamp(54.51px, 7.20vw, 110.59px);
				height: clamp(60px, 8.5vw, 130.56px);
				left: 50%;
				top: 30%;
				transform: translateX(-50%) translateY(-50%);
				background: rgba(255, 255, 0, 0.6);
				border-radius: 50%;
				box-shadow: 0 0 15px rgba(255, 255, 0, 0.8), 0 0 30px rgba(255, 255, 0, 0.5);
				opacity: 0;
				animation: glow 1.5s ease-in-out infinite alternate;
				z-index: 1;
			}
			.invent-text{
				img {
					width: clamp(63px, 11.78vw, 180.9px);
					margin-top: 18px;
				}
			} 
		}
		.ideate {
			background-color: #35B7F4;
			.ideate-text {
				img {
					width: clamp(54px, 11.18vw, 171.68px);
					margin-top: 20px;
				}
			}
			.ideate-image {
				svg {
					display: block;
					height: 10.08vw;
					min-height: 75px;
					margin-top: 20px;
				}
			} 
		}
	}
	.bottom-content {
		display: flex;
		font-size: 20px;
		line-height: 30px;
		flex-direction: column;
		line-height: 1.5;
	}
}


/*Pagina 9*/
/*Pagina 7*/
.an-nine-content {
	display: flex;
	flex-direction: row;
	background-color: transparent;
	height: 100vh;
	overflow: hidden;
	position: absolute;
	z-index: 1;
	width: 100%;
	img {
		width: 80%;
		height: 80%;
	}
	
	.section-titles-nine{
		font-size: var(--sectionNineTitle, 51px);
		font-weight: var(--extrabold);
		line-height: 1.19;
		@media only screen and (min-width: 990px) and (max-width: 1310px){
			--sectionNineTitle: 3.8vw;
		}
		@media only screen and (max-width: 990px){
			--sectionNineTitle: 3.7vw;
		}
		@media only screen and (max-width: 767px){
			--sectionNineTitle: 30px;
		}
		
	}
	.first-half {
		display: flex;
		flex-direction: column;
		width: 50%;
		p{
			padding: 0px 20px;
		}
		.image-container-nine{
			flex: 1;
		}
		.section-one {
			display: flex;
			justify-content: center;
			align-items: center;
			text-align: center;
			background-color: #062D4D;
			color: white;
			width: 100%;
			height: 33.33vh;
			font-weight: bold;
		}
		.section-two {
			display: flex;
			width: 100%;
			height: 33.33vh;
			.image-one {
				background-color: #FF941F;
			}
			.image-two {
				background-color: #35B7F4;
			}
		} 
		.section-three {
			display: flex;
			height: 33.33vh;
			.image-one {
				background-color: #3EC999;
			}
			.image-two {
				background-color: #35B7F4;
				@media only screen and (max-width: 767px){
					display: none;
				}
			}
			.image-three {
				background-color: #062D4D;
				@media only screen and (max-width: 989px){
					display: none;
				}
			}
			.image-four {
				background-color: #FF941F;
			}
		}
		.image-one, .image-two, .image-three, .image-four{
			display: flex;
			justify-content: center;
			align-items: center;
		}
	}
	.second-half {
		display: flex;
		flex-direction: column;
		width: 50vw;
		max-width: 50%;
		.image-one, .image-two, .image-three, .image-four {
			display: flex;
			justify-content: center;
			align-items: center;
		}
		.image-two{
			background-color: #35B7F4;
		}
		.image-container-nine{
			flex: 1;
		}
		.section-one {
			display: flex;
			flex-direction: row;
			height: 33.33vh;
			
			.image-one {
				background-color: #FF941F;
			}
			.image-three {
				background-color: #3EC999;
				@media only screen and (max-width: 767px){
					display: none;
				}
			}
			.image-four {
				background-color: #062D4D;
				@media only screen and (max-width: 989px){
					display: none;
				}
			}
		}
		.section-two {
			display: flex;
			height: 33.33vh;
			.image-one {
				background-color: #3EC999;
			}
			.image-two {
				background-color: #35B7F4;
			}
			
		}
		.section-three {
			display: flex;
			justify-content: center;
			align-items: center;
			text-align: center;
			background-color: #062D4D;
			color: white;
			width: 50vw;
			height: 33.33vh;
			font-weight: bold;
		}
		
	}
}

/* Seccion 10, 11 y 12 */
.double-section{
	height: 100vh;
	flex-direction: row;
	width: 100%;
	overflow: hidden;
	display: flex;

	.double-left-column{
		width: var(--columnDoubleWidthLeft, 50%);
		@media only screen and (max-width: 989px){
			--columnDoubleWidthLeft: 30%;
		}
	}
	.double-right-column{
		width: var(--columnDoubleWidthRight, 50%);
		@media only screen and (max-width: 989px){
			--columnDoubleWidthRight: 70%;
		}
	}
	.double-column{
		position: relative;
		height: 100%;
		.column--animated{
			width: 100%;
			height: 100vh;
			display: flex;
			justify-content: center;
			align-items: center;
			position: absolute;
		}
	}
	.an-ten-content{
		--columnMainColor: #35B7F4;	
	}
	.an-eleven-content{
		--columnMainColor: #FF941F;	
	}
	.an-twelve-content{
		--columnMainColor: #3EC999;	
	}
	.animated-half{
		background-color: var(--columnMainColor);
		flex-direction: column;
	}
	.description-half {
		display: flex;
		flex-direction: column;
		background-color: #062D4D;
		color: white;
		width: 50vw;
		transition: width 0.3s ease;
		min-height: calc(100vh - 80px);
		padding: 40px 0px 40px 0px;
		
		.description-content {
			display: flex;
			flex-direction: column;
			margin-left: 8.01vw;
			
			.top-content {
				display: flex;
				flex-direction: column;
				margin-top: clamp(50px, 5.86vw, 90px);
				
				.title {
					font-size: clamp(25px, 2.93vw, 45px);
					font-weight: bold;
					padding-right: 10px;
				}
				
				.subtitle {
					display: flex;
					font-size: clamp(10px, 1.04vw, 16px);
					font-weight: bold;
					p {
						display: inline;
						background-color: #B9FF1D;
						padding-inline-start: 4.1px;
						padding-inline-end: 4.9px;
						padding-top: 1px;
						padding-bottom: 2px;
						color: #062D4D;
					}
				}
				
				.description {
					display: flex;
					flex-direction: column;
					font-size: clamp(10px, 1.04vw, 16px);
					margin-top: clamp(13px, 1.43vw, 22px);
					margin-right: 15px;
				}
			}
			
			.visual {
				display: flex;
				flex-direction: row;
				align-items: center;
				background-color: white;
				width: clamp(200px, 33.40vw, 513px);
				height: clamp(40px, 5.73vw, 88px);
				border-radius: 7px;
				margin-top: clamp(20px, 3.13vw, 48px);
				
				.image {
					display: flex;
					align-items: center;
					justify-content: center;
					background-color: var(--columnMainColor);
					height: clamp(30px, 4.36vw, 67px);
					width: clamp(30px, 4.36vw, 67px);
					border-radius: 0.39vw;
					margin-left: clamp(6px, 0.81vw, 12.5px);
				}
				
				.visual-text {
					display: flex;
					flex-direction: column;
					color: #062D4D;
					margin-left: 1.27vw;
					
					.title,
					.subtitle {
						font-weight: bold;
					}
					
					.title {
						color: #2B2B2B;
						font-size: clamp(7px, 1vw, 16px);
						p{
							color: inherit;
						}
					}
					
					.subtitle {
						font-size: clamp(10px, 1.69vw, 26px);
						margin-top: 0.26vw;
						color: var(--colorDarkBlue);
						p{
							color: inherit;
						}
					}
				}
			}
			
			.bottom-content {
				display: flex;
				flex-direction: row;
				margin-top: 3.19vw;
				column-gap: 2.19vw;
				margin-right: 15px;
				
				.rating {
					display: flex;
					flex-direction: column;
					align-items: flex-end;
					row-gap: clamp(7px, 1.20vw, 15px);
					min-width: 80px;
					div[class *= 'rat-skill']{
						height: 20px;
					}
				}
				
				.skill {
					display: flex;
					flex-direction: column;
					font-size: clamp(12.5px, 1.43vw, 20px);
					font-weight: var(--semibold, 500);
					row-gap: clamp(7px, 1.20vw, 15px);
					width: 100%;
					div[class *= 'skill-']{
						height: 20px;
					}
				}
			}
		}
	}
}

.rating {
	display: flex;
	flex-direction: column;
	row-gap: 20px;
}

/*Sección 13*/
.an-thirteen-content {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	color: white;
	overflow: hidden;
	position: relative;
	background-color: var(--colorDarkBlue);
	.an-thirteen-background-wave{
		svg{
			position: absolute;
			left: 50%;
			top: 0;
			transform: translateX(-50%);
			pointer-events: none;
			width: 100%;
		}
	}
	.upper-half {
		display: flex;
		margin: auto;
		min-height: 25vw;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		font-weight: bold;
		max-width: 1150px;
		text-align: center;
		padding: 5% 25px 150px;
		z-index: 2;
	}
}
.an-thirteen-content .content .wiggle {
	background-color: #B9FF1D;
	color: #062D4D;
	transform: rotate(355deg);
	animation: wiggle-animation 5s ease-in-out infinite;
	font-size: 45px;
	line-height: 53px;
	display: inline-block;
	padding: 5px 13px 0px;
}
.an-thirteen-content .feature-image{
	position: relative;
}
.an-thirteen-content .ft-img-main {
	z-index: 2;
}
.an-thirteen-content .ft-img-sec{
	position: absolute;
	bottom: -8px;
	left: 1px;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(5px);
}
.an-thirteen-content h1{
	font-size: 45px;
	line-height: 54px;
	text-align: center;
	max-width: 1300px;
	padding: 0px 25px;
}

.an-thirteen-content .lower-half {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	font-weight: bold;
	bottom: 0;
	width: 100%;
	position: relative;
	padding-top: 250px;
	padding-bottom: 150px;
	margin-top: -50px;
}
.an-thirteen-content .content {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	background-color: #062D4D;;
	width: 100%;
	margin-top: -1px;
	column-gap: 10px;
	z-index: 1;
}

.an-thirteen-content .sign {
	background-color: #B9FF1D;
	color: #062D4D;
	font-size: 45px;
	padding-inline-start: 7.5px;
	padding-inline-end: 7.5px;
	rotate: 358deg;
}

/*Seccion 14*/
.an-fourteen-content{
	.an-fourteen-content-inner{
		position: relative;
		.an-fourteen-content-overlay{
			position: absolute;
			width: 100%;
			height: 100%;
			pointer-events: none;
			z-index: 2;
			.an-fourteen-content-overlay-inner{
				position: relative;
				width: 100%;
				height: 100%;
				pointer-events: none;
				
			}
			.an-fourteen-content-overlay-right{
				right: 0;
				clip-path: polygon(15% 1%, 100% 0, 100% 100%, 6% 100%, 0 75%, 4% 50%, 5% 31%);
				
			}
			.an-fourteen-content-overlay-left{
				left: 0;
				clip-path: polygon(100% 0, 95% 28%, 99% 54%, 96% 79%, 100% 100%, 0 100%, 0 0);
				
			}
			.an-fourteen-content-overlay-wing{
				position: absolute;
				top: 0;
				width: 50%;
				height: 100%;
				background-color: #35B7F4;
				pointer-events: none;
			}
		}
	}
}



.an-fourteen-content .content-3-1{
	background-color: #062D4D;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
}
.an-fourteen-content .title h1{
	font-size: 70px;
	line-height: 85px;
	font-weight: 900;
}
.an-fourteen-content .title .wiggle{
	background-color: #B9FF1D;
	color: #062D4D;
	transform: rotate(355deg);
	animation: wiggle-animation 5s ease-in-out infinite;
	line-height: 83px;
	display: inline-block;
	padding: 5px 13px 0px;
}

.an-fourteen-content .text-container{
	justify-content: center;
	align-items: center;
	flex-direction: column;
	color: #fff;
	text-align: center;
}

.an-fourteen-content .text-content-1{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 2rem;
	padding-bottom: 70px;
}


.an-fourteen-content .text-key{
	background-color: #FF941F;
	min-width: 140px;
	padding: 0.2rem 0.5rem;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 1.2rem;
}


.an-fourteen-content .text-introductory {
	max-width: 55%;
	font-size: clamp(1rem, 1.5vw, 1.6rem); 
}

.an-fourteen-content .text-content-2{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

.an-fourteen-content .text-widening {
	font-size: clamp(1.4rem, 2.5vw, 2.6rem); 
}

.an-fourteen-content .text-backup {
	background-color: #B9FF1D;
	padding: 0rem 0.5rem;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: clamp(1.2rem, 2vw, 2.6rem); 
	color: #062D4D;
	font-weight: bolder;
	transform: rotate(-4deg);
}

/*Content 3-2*/

.an-fourteen-content .content-3-2{
	background-color: #062D4D;
	height: 100vh;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	.statistics-container{
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		color: #fff;
		text-align: center;
		padding: 0 5%;
		max-width: 1300px;
		margin: 0 auto;
		@media only screen and (min-width: 1220px) and (max-width: 1450px){
			max-width: 1200px;
			padding: 0 8%;
		}
		@media only screen and (min-width: 989px) and (max-width: 1220px){
			max-width: 1100px;
			padding: 0 12%;
		}
		.statistics-legend{
			background-color: #1f425f;
			padding: 0.8rem 40px;
			border-radius: 20px;
			max-width: 380px;
			margin: auto;
			display: flex;
			justify-content: center;
			margin-bottom: 90px;
			gap: 2rem;
			.legend-content{
				display: flex;
				align-items: center;
				justify-content: center;
				gap: 0.5rem;
				p{
					font-size: 14px;
					font-weight: var(--regular);
					line-height: 14px;
					margin-top: 4px;
				}
			}
			.legend-color-green{
				background-color: #B9FF1D;
				width: 18px;
				height: 18px;
			}
			.legend-color-gray{
				background-color: #d2d6d8;
				width: 18px;
				height: 18px;
			}
			.legend-text{
				font-size: 1rem;
			}
			
			
		}
		.statistics-tables{
			display: flex;
			gap: 3rem;
			flex-direction: row;
			@media only screen and (min-width: 990px) and (max-width: 1310px){
				gap: 1rem;
			}
			@media only screen and (max-width: 989px){
				flex-direction: column;
				gap: 0rem;
			}
			.table-content:nth-child(2){
				border-right: 2px dotted var(--colorWhite);
				border-left: 2px dotted var(--colorWhite);
				padding-left: 3.5%;
				padding-right: 3.5%;
			}
			.table-content{
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;
				@media only screen and (max-width: 989px){
					flex-direction: row-reverse;
					border-right: none !important;
					border-left: none !important;
					padding-left: 0px !important;
					padding-right: 0px !important;
					z-index: 1;
					gap: 20px;
				}
				.table-description{
					font-size: 20px;
					font-weight: var(--regular);
					@media only screen and (max-width: 1310px){
						font-size: 16px;
					}
					@media only screen and (max-width: 989px){
						max-width: 200px;
					}
					@media only screen and (max-width: 767px){
						max-width: 115px;
					}
					@media only screen and (max-width: 480px){
						font-size: 14px;
					}
				}
				.table-title{
					h3{
						font-size: 20px;
						font-weight: var(--regular);
						@media only screen and (max-width: 1310px){
							font-size: 16px;
						}
					}
					@media only screen and (max-width: 989px){
						display: none;
					}
				}
				.table-percentage{
					color: #35B7F4;
					font-size: var(--h1FontSize, 109px);
					font-weight: 800;
					display: flex;
					min-width: 100px;
					p{
						color: #35B7F4;
					}
					@media only screen and (min-width: 990px) and (max-width: 1450px){
						--h1FontSize: 8vw;
					}
					@media only screen and (max-width: 989px){
						--h1FontSize: 5vw;
					}
					@media only screen and (max-width: 480px){
						--h1FontSize: 28px;
						min-width: auto;
					}
				}
				.tables-with-data{
					display: flex;
					align-items: center;
					flex-direction: column;
					justify-content: flex-end;
					@media only screen and (max-width: 989px){
						width: calc(100% - 200px);
						flex-direction: row-reverse;
						gap: 25px;
					}
					@media only screen and (max-width: 767px){
						width: calc(100% - 115px);
						flex-direction: row-reverse;
						gap: 10px;
					}
					.tables{
						display: flex;
						flex-direction: row;
						gap: 1rem;
						align-items: flex-end;
						min-height: 280px;
						@media only screen and (max-width: 989px){
							width: 70%;
							flex-direction: column;
							justify-content: center;
							align-items: start;
							min-height: 135px;
							gap: 6px;
						}
						p{
							font-size: 14px;
							line-height: 26px;
							font-weight: var(--regular);
							color: #272727;
							@media only screen and (max-width: 989px){
								line-height: 16px;
                                display: block;
								margin-top: 2px;
							}
						}
						.table-individual{
							color: #000;
                            border-radius: 5px 5px 0px 0px;
                            display: flex;
                            justify-content: end;
                            width: 100%;
                            padding: 0px 6px;
							@media only screen and (max-width: 989px){
								border-radius: 0px 0px 0px 0px;							
								padding: 5px 4px;
								height: fit-content;
							}
							@media only screen and (max-width: 767px){
								min-width: fit-content;							
							}
						}
						.table-gray{
							background-color: #d2d6d8;
						}
						.table-idea{
							display: flex;
							flex-direction: column-reverse;
							gap: 0.7rem;
							@media only screen and (max-width: 989px){
								flex-direction: row;
								align-items: center;
							}
							img{
								max-width: 20px;
								margin: 0 auto;
								@media only screen and (max-width: 989px){
									max-width: 17px;
								}
							}							
							.table-green{
								background-color: #B9FF1D;
								
							}
						}
					}
					
				}
				
			}
		}
	}
}
/*
.an-fourteen-content .thirty-1{
width: 40%;
}

.an-fourteen-content .thirty-2{
width: 35%;
}

.an-fourteen-content .seventy-1{
width: 60%;
}

.an-fourteen-content .seventy-2{
width: 50%;
}

.an-fourteen-content .twenty-1{
width: 70%;
}

.an-fourteen-content .twenty-2{
width: 75%;
}
*/
@keyframes circle-animation-1{
	0% {
		opacity: 0;
		rx: 1.5em;
		ry: 1.5em;
	}
	50% {
		opacity: 1;
		rx: 2.5em;
		ry: 2.5em;
	}
	100% {
		opacity: 1;
		rx: 2em;
		ry: 2em;
	}
}
@keyframes circle-animation-2{
	0% {
		opacity: 0;
		rx: 1.5em;
		ry: 1.5em;
	}
	50% {
		opacity: 1;
		rx: 1.9em;
		ry: 1.9em;
	}
	100% {
		opacity: 1;
		rx: 1.7em;
		ry: 1.7em;
	}
}
/*Seccion 15*/
.an-fifteen-content {
	background-color: #062d4e;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	align-items: center;
	position: relative;
	#circle-one ellipse{
		animation: circle-animation-1 1.5s ease-in-out forwards infinite;
		animation-delay: 2s; 
	}
	/* Animation for circle two */
	#circle-two ellipse{
		animation: circle-animation-2 1.5s ease-in-out forwards infinite;
	}
	.person-container{
		scale: 3;
		@media only screen and (max-width: 1310px){
			scale: 2;
		}
		@media only screen and (max-width: 567px){
			scale: 1;
			dotlottie-player{
				width: 170px !important;
			}
		}
	}
	.section-cloud {
		background-color: #062d4e;
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		padding-top: 61px;
		height: 100vh;
		padding-bottom: 1rem;
		@media only screen and (max-width: 767px){
			padding: 0px;
			height: auto;
		}
	}
	.cloud-father-content {
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		svg{
			@media only screen and (max-width: 767px){
				width: 420px;
			}
		}
	}
	
}

.an-fifteen-content .cloud-content {
	position: absolute; 
	top: 50%; 
	left: 50%;
	transform: translate(-50%, -65%); 
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	max-width: 90%;
	max-height: 90%;
}


.an-fifteen-content h1 {
	max-width: 618px;
	font-weight: bolder;
	color: #062d4e;
	font-size: clamp(20px, 5vw, 55px); /* Mínimo 30px, ideal 5vw, máximo 55px */
	line-height: clamp(30px, 6vw, 70px); /* Mínimo 45px, ideal 6vw, máximo 70px */
	@media only screen and (max-width: 767px){
		font-size: 20px;
	}
}

.an-fifteen-content p {
	max-width: 430px;
	color: #062d4e;
	font-size: clamp(16px, 3vw, 20px); /* Mínimo 16px, ideal 3vw, máximo 20px */
	line-height: clamp(25px, 4vw, 35px); /* Mínimo 25px, ideal 4vw, máximo 35px */
	font-weight: 400;
}

.an-fifteen-content .piecharts-section {
	min-height: calc(100vh - 60px);
	padding-bottom: 60px;
	display: flex;
	flex-direction: row;
	align-items: center;
	text-align: center;
	width: 90%;
	padding-left: 145px;
	padding-right: 122px;
	gap: 71px;
	@media only screen and (min-width: 1310px) and (max-width: 1600px){
		width: 95%;
		padding-right: 50px;
	}
	@media only screen and (min-width: 990px) and (max-width: 1310px){
		width: 100%;
		padding-right: 50px;
		padding-left: 50px;
		gap: 0px;
	}
	@media only screen and (max-width: 989px){
		width: 100%;
		padding-right: 50px;
		padding-left: 100px;
		gap: 70px;
	}
	@media only screen and (max-width: 767px){
		padding-right: 30px;
		padding-left: 30px;
		gap: 0px;
	}
	@media only screen and (max-width: 567px){
		padding-left: 0px;
	}
}

.an-fifteen-content .piecharts-container {
	display: flex;
	flex-direction: row;
	align-items: start;
	width:100%;
	justify-content: space-between;
	gap: 0px;
	/* background-color: #062d40;    */
	@media only screen and (max-width: 989px){
		flex-direction: column;
		align-items: center;
	}
}   

.an-fifteen-content .person-container{
	z-index: 2;
	height: 100%;
}

.an-fifteen-content .piechart-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 0px 30px;
	gap: 13px;
	@media only screen and (max-width: 989px){
		padding: 20px 0px;
		gap: 0px;
	}
}

.an-fifteen-content .pie-content {
	width: 120px;
	height: 120px;
	border-radius: 50%;
	background-color: #204464;
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	margin-bottom: 17px;
	@media only screen and (max-width: 989px){
		width: 80px;
		height: 80px;
		margin-bottom: 15px;
	}
}
.an-fifteen-content .pie-general{
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: conic-gradient(#c0fc1c 0% 0%, transparent 0% 100%);
}
/*
.an-fifteen-content .pie-filled-1 {
	background: conic-gradient(#c0fc1c 0% 70%, transparent 70% 100%);
}
.an-fifteen-content .pie-filled-2 {
	background: conic-gradient(#c0fc1c 0% 59%, transparent 59% 100%);
}
.an-fifteen-content .pie-filled-3 {
	background: conic-gradient(#c0fc1c 0% 55%, transparent 55% 100%);
}
*/
.an-fifteen-content .piechart-item h1 {
	color: #35B7F4;
	margin: 0;
}

.an-fifteen-content .piechart-item p {
	margin: 0;
	color: white;
	max-width: 200px;
	font-size: 16px;
	line-height: 25px;
	font-weight: 100;
	@media only screen and (max-width: 989px){
		max-width: 245px;
		font-size: 14px;
	}
}

.an-fifteen-content .green-floor-svg {
	position: absolute;
	z-index: 1;
	height: 100px;
	bottom: 0;
	width: 100%;
	left: 0;
	right: 0;
	object-fit: cover;
}

.an-fifteen-content .table-percentage{
	color: #35B7F4;
	font-size: 70px;
	line-height: 79px;
	font-weight: 800;
	display: flex;
	min-width: 50px;
	@media only screen and (max-width: 989px){
		font-size: 45px;
		line-height: 50px;
	}
	p{
		color: inherit;
	}
}

.an-sixteen-content {
	#white-circles-bg{
		width: 100vw;
		max-width: 1500px;
		margin: 0 auto;
	}
	.content-5-1{
		display: flex;
		justify-content: center;
		align-items: center;
		flex-direction: column;
		z-index: 1;
		width: 100%;
		height: 100%;
		position: relative;
	}
	.trial-text-container {
		text-align: center;
		padding: 20px;
		h1 {
			font-size: 70px;
			line-height: 85px;
			padding-bottom: 60px;
			font-weight: 900;
		}
		
		.green-rotation {
			display: inline-block;
			background-color: #B9FF1D;
			padding: 0.0rem 0.3rem;
			transform: rotate(-4deg);
			text-align: center;
			font-weight: bold;
			color: #062D4D;
			margin-right: 0.5rem;
			font-weight: 800;
		}
		
		.mid-trial-text {
			padding-bottom: 60px;
			
			h2 {
				font-size: 45px;
				line-height: 52px;
			}
			
			.wiggle {
				background-color: #B9FF1D;
				color: #062D4D;
				transform: rotate(355deg);
				animation: wiggle-animation 5s ease-in-out infinite;
				display: inline-block;
				padding: 7px 7px 3px;
				line-height: 39px;
				font-size: 42px;
			}
		}
		
		.button-trial-content {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
			
			img {
				max-width: 80px;
			}
			
			.button-container {
				text-decoration: none;
			}
			
			.button-yellow {
				display: flex;
				
				.button-light-yellow {
					background-color: #FFAD1D;
					padding: 0.4rem 1.1rem;
					border-radius: 5px 0px 0px 5px;
					color: #062D4D;
					font-weight: 600;
				}
				
				.button-strong-yellow {
					background-color: #FF941F;
					padding: 0.4rem 0.7rem;
					border-radius: 0px 5px 5px 0px;
					display: flex;
					align-items: center;
					justify-content: center;
					
					img {
						width: 15px;
						height: 15px;
					}
				}
			}
		}
		
		.text-trial-content {
			p {
				font-style: italic;
				font-size: 20px;
				line-height: 30px;
				margin-top: 50px;
			}
		}
	}
}
/*================================================================================================================*/


/* Animaciones KeyFrames */
@keyframes keyWiggleAnimation{
	0% {transform: rotate(0deg) scale(1);}
	33% {transform: rotate(2deg) scale(1.07);}
	66% {transform: rotate(-2deg) scale(1.07);}
	100% {transform: rotate(0deg) scale(1);}
}

@keyframes jump-shaking {
	0% { transform: translateX(0) rotate(0)}
	35% { transform: translateY(0) rotate(0)}
	85% { transform: translateY(0) rotate(0) }
	89% { transform: translateY(-2px) rotate(-17deg) }
	93% { transform: translateY(-3px) rotate(17deg) }
	98% { transform: translateY(-4px) rotate(-17deg) }
	100% { transform: translateY(0) rotate(0) }
}

@keyframes glow {
	0% {
		opacity: 0.5;
		box-shadow: 0 0 15px rgba(255, 255, 0, 0.8), 0 0 30px rgba(255, 255, 0, 0.5);
	}
	50% {
		opacity: 1;
		box-shadow: 0 0 45px rgba(255, 255, 0, 0.8), 0 0 40px rgba(255, 255, 0, 0.5);
		
	}
	100% {
		opacity: 0.5;
		box-shadow: 0 0 15px rgba(255, 255, 0, 0.8), 0 0 30px rgba(255, 255, 0, 0.5);
		
	}
}

@keyframes wiggle-animation {
	0% {
		transform: rotate(-5deg);
	}
	50% {
		transform: rotate(5deg);
	}
	100% {
		transform: rotate(-5deg);
	}
}

@keyframes slideDown {
	from {
		transform: translate3d(0, -30%, 0);
	}
	to {
		transform: translate3d(0, 0, 0);
	}
}

