/* general styles */
	*{
		padding: 0;
		margin: 0;
		box-sizing: border-box;
	}
	:root {
	  --lima: #cde35f; 
	  --naranja: #ca7650;
	  --verde: #1f4a4f;
	  --verdeDark: #1b3339;
	  --azul: #4646d6;
	  --gris: #dbd7d4;
	  --peach: #de7e57;
	  --gris2: #ccc8c5;
	  --grisObscuro: #333333;
	  --amarillo: #f0e221;
	  --turquesa: #4ba49b;
	  --bg-size: 70%;
	}
	body{
		position: relative;
	}
	a{
		text-decoration: none;
		color: unset;
	}
	#loader{
		width: 100%;
		height: 100%;
		position: fixed;
		top: 0;
		z-index: 2000;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: var(--verde);
		/*background-image: url('../img/fondos/verde.png');*/
		background-size: var(--bg-size);
	}
	.not_loader{
		visibility: hidden;
	}
	.gif{
		width: 60%;
		height: auto;
	}
	body.overlay-open {
            overflow: hidden;
        }
    .text_azul{
    	color: var(--azul);
    }

/* Fuentes */
	@font-face {
	  font-family: AcuminVariableBold;
	  src: url('../fonts/AcuminVariableConcept.ttf');
	}
	@font-face {
	  font-family: FilsonProBlack;
	  src: url('../fonts/FilsonProBlack.otf');
	}
	@font-face {
	  font-family: FilsonProBold;
	  src: url('../fonts/FilsonProBold.otf');
	}
	@font-face {
	  font-family: FilsonPro-Bold;
	  src: url('../fonts/FilsonProBold.otf');
	}
	@font-face {
	  font-family: FilsonProRegular;
	  src: url('../fonts/FilsonProRegular.otf');
	}
	@font-face {
	  font-family: FilsonProMedium;
	  src: url('../fonts/FilsonProMedium.otf');
	}
	@font-face {
	  font-family: FilsonProBook;
	  src: url('../fonts/FilsonProBook.otf');
	}
	@font-face {
	  font-family: FilsonProLight;
	  src: url('../fonts/FilsonProLight.otf');
	}
	@font-face {
	  font-family: FilsonProHeavy;
	  src: url('../fonts/FilsonProHeavy.otf');
	}
	html {
	  font-size: 100%;
		overflow-x: hidden;
		/*max-width: 100vw;*/
	}
	body{
	  	font-family: FilsonProRegular, sans-serif;
		scroll-behavior: smooth;
		background-color: var(--verde);
		height: 100%;
		padding-bottom: 0;
		margin-bottom: 0;
	}
	p{
		line-height: 1.4;
	}
	.desktop_content{
		display: none;
	}
	.mobile_content{
		color: var(--verde);
		text-align: center;
		padding: 5% 10%;
		background-image: url('../img/fondos/lima.png');
		background-size: var(--bg-size);
		display: flex;
		flex-direction: column;
		justify-content: space-evenly;
		align-items: center;
		margin-bottom: 0;
		min-height: 700px;
		height: 100vh;
		position: relative;
		overflow: hidden;
	}
	.mobile_flor{
		position: absolute;
		width: 30%;
		top: -6%;
		right: -6%;
		animation: float1 6s ease-in-out infinite;
	}
	.mobile_abrigo{
		position: absolute;
		width: 40%;
		bottom: -15%;
		right: -15%;
		transform: rotate(-45deg);
		animation: float3 6s ease-in-out infinite;
		display: block;
	}
	.mobile_xdata{
		filter: invert(90%);
		align-self: flex-start;
	}
	.mobile_hilando{
		width: 100%;
		display: block;
		margin: 0 auto;
		max-width: 650px;
	}
	.mobile_desktop{
		align-self: flex-start;
		width: 250px;
		text-align: left;
	}
	.mobile_desktop img{
		margin-bottom: .5rem;
		width: 50px;
	}

/* Font size */
	.fs-07T{
		font-size: .7rem;
	}
	.fs-07{
		font-size: .7rem;
	}
	.fs-08{
		font-size: .8rem;
	}
	.fs-09{
		font-size: .9rem;
	}
	.fs-09T{
		font-size: .9rem;
	}
	.fs-09TT{
		font-size: 1rem;
	}
	.fs-1-3{
		font-size: 1.2rem;
	}
	.fs-13{
		font-size: 1.3rem;
	}
	.fs-2-3{
		font-size: 2rem;
	}
	.fs-2{
		font-size: 2rem;
	}
	.fs-1-8{
		font-size: 1.8rem;
	}
	.fs-2-5{
		font-size: 3rem;
	}
	.fs-4{
		font-size: 4rem;
	}

/* Aux */
	.aux{
		position: absolute;
		width: 50px;
		height: 100px;
		background-color: violet;
		visibility: hidden;
		left: 0;
	}



/* Overlay */

	.overlay {
		/* Height & width depends on how you want to reveal the overlay (see JS below) */   
		height: 100%;
		width: 0;
		position: fixed; /* Stay in place */
		z-index: 1000; /* Sit on top */
		left: 0;
		top: 0;
		background-image: url('../img/fondos/verde.png');
		background-attachment: fixed;
		background-size: var(--bg-size);
		overflow-x: hidden; /* Disable horizontal scroll */
		transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
	}
	.overlay .closebtn {
		position: absolute;
		top: 20px;
		right: 45px;
		font-size: 40px;
		font-weight: lighter;
		z-index: 1500;
		color: #fff;
	}
	/* Position the content inside the overlay */
	.overlay-content {
		height: 100%;
		padding: 5% 10%;
		color: #fff;
	}
	.overlay_grid{
		display: grid;
		grid-template-columns: 50% 40%;
		height: 100%;
		grid-column-gap: 10%;
	}
	/* overlay 1 */
		.overlay1_logo{
			width: 150px;
		}
		.overlay1_titulo{
			color: var(--lima);
			margin: 1.8rem 0 1rem;
		}
		.overlay1_texto{
			margin-bottom: 1.5rem;
			line-height: 1.4;
		}
		.overlay1_btn{
			background-color: var(--lima);
			color: var(--verde);
			padding: 5px 10px;
			border: none;
			text-transform: uppercase;
			letter-spacing: 2px;
			font-family: 'FilsonProMedium', sans-serif;
			border-radius: 4px;
			margin-top: 1rem;
			cursor: pointer;
			position: relative;
			transition: all .4s ease;
		}
	/* overlay 2 */
		.overlay2{
			display: flex;
			flex-direction: column;
			justify-content: flex-start;
			position: relative;
		}
		.overlay2_equipo{
			text-transform: uppercase;
			font-family: 'FilsonProBold', sans-serif;
			letter-spacing: 1.5px;
		}
		.overlay2_linea{
			display: block;
			border-bottom: dashed var(--lima) 2px;
			width: 100%;
			height: 4px;
			margin: 4px 0;
		}
		.overlay2_people_div{
			padding-top: 1rem;
			height: 80%;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
		}
		
		.overlay2_people_titulo{
			font-family: 'FilsonProBook', sans-serif;
		}
		.overlay2_people_nombre{
			font-family: 'FilsonProBold', sans-serif;
			letter-spacing: .5px;
		}
		.overlay2_redes{
			position: absolute;
			bottom: 0;
			right: 0;
			display: grid;
			grid-template-columns: repeat(4, 1fr);
			grid-column-gap: .5rem;
			grid-row-gap: .5rem;
		}
		.overlay2_redes_div{
			width: 40px;
			height: 40px;
			border: solid 1px var(--lima);
			border-radius: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
		}
		.overlay2_redes_div img{
			width: 50%;
		}
	
/* Overlay Troquer */
	.overlayTroquer {
	  height: 0%;
	  width: 100%;
	  position: fixed;
	  z-index: 1000;
	  top: 0;
	  left: 0;
	  background-color: rgb(0,0,0);
	  background-color: var(--naranja);
	  overflow-x: hidden;
	  transition: 0.5s;
	}
	.typeform_form{
		width: 100%;
		display: flex;
		align-items: center;
	}
	.typeform_form div{
		height: 99vh !important;
	}
	.overlayTroquer-content {
	  position: relative;
	  width: 100%;
	  height: 100%;
	  text-align: center;
	}

	.overlayTroquer a {
	  padding: 8px;
	  text-decoration: none;
	  font-size: 36px;
	  color: #818181;
	  display: block;
	  transition: 0.3s;
	}

	.overlayTroquer a:hover, .overlayTroquer a:focus {
	  color: #f1f1f1;
	}

	.overlayTroquer .closebtnTroquer {
	  position: absolute;
	  top: 20px;
	  right: 45px;
	  font-size: 60px;
	  z-index: 1000;
	  color: #fff;
	}


/* XS */
@media screen and (max-height: 450px) {
  .overlay a {font-size: 20px}
  .overlay .closebtn {
    font-size: 40px;
    top: 15px;
    right: 35px;
  }
}

/*// Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) {
	.fs-07{
		font-size: .7rem;
	}
	.fs-08{
		font-size: .9rem;
	}
	.fs-09{
		font-size: 1.1rem;
	}
	.fs-09T{
		font-size: .9rem;
	}
	.fs-1-3{
		font-size: 1.3rem;
	}
	.fs-2-3{
		font-size: 2.2rem;
	}
	.fs-2{
		font-size: 2.2rem;
	}
	.fs-2-5{
		font-size: 3.2rem;
	}
	/* Position the content inside the overlay */
	
	
}

/*// Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {
	.fs-07{
		font-size: .7rem;
	}
	.fs-08{
		font-size: 1rem;
	}
	.fs-09T{
		font-size: 1rem;
	}
	.fs-13{
		font-size: 1.5rem;
	}
	.fs-2-3{
		font-size: 2.6rem;
	}
	.fs-2{
		font-size: 2.6rem;
	}
	.fs-2-5{
		font-size: 3.4rem;
	}
}

/*// Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
	.fs-07T{
		font-size: .7rem;
	}
	.fs-07{
		font-size: .9rem;
	}
	.fs-09TT{
		font-size: 1.1rem;
	}
	.fs-1-3{
		font-size: 1.3rem;
	}
	.fs-13{
		font-size: 1.7rem;
	}
	.fs-2-3{
		font-size: 3rem;
	}
	.fs-2{
		font-size: 3rem;
	}
	.fs-2-5{
		font-size: 3.6rem;
	}
	
	.item-creativa{
		grid-column-start: 1;
	}
	.fs-1-8{
		font-size: 2rem;
	}
	.mobile_content{
		display: none;
	}
	.desktop_content{
		display: block;
	}
}

/*// X-Large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {
	.fs-07T{
		font-size: .7rem;
	}
	.fs-07{
		font-size: .7rem;
	}
	.fs-08{
		font-size: 1rem;
	}
	.fs-09{
		font-size: 1.2rem;
	}
	.fs-13{
		font-size: 1.8rem;
	}
	.fs-09T{
		font-size: 1.1rem;
	}
	.fs-09TT{
		font-size: 1.2rem;
	}
	.fs-1-3{
		font-size: 1.4rem;
	}
	.fs-2-3{
		font-size: 3rem;
	}
	.fs-2{
		font-size: 3.6rem;
	}
	.fs-2-5{
		font-size: 3.3rem;
	}
	.fs-1-8{
		font-size: 2.3rem;
	}
	
}

/*// XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1400px) {
	.fs-07T{
		font-size: .8rem;
	}
	.fs-07{
		font-size: .8rem;
	}
	.fs-2{
		font-size: 4rem;
	}
	.fs-2-5{
		font-size: 4.2rem;
	}
	.overlay_grid{
		display: grid;
		grid-template-columns: 55% 35%;
		height: 100%;
		grid-column-gap: 10%;
	}
}

/*// XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1700px) {
	.fs-07{
		font-size: .8rem;
	}
	.fs-2{
		font-size: 4.2rem;
	}
}

/*// XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 2000px) {
	
}