@charset "utf-8";
/* CSS Document */


/*LOADER*/
/* .content_loading{height:100vh; position:fixed; top:0; left:0; background:var(--black); transition:all 0.5s ease-in-out; z-index:9999; opacity:1;}
.content_loading.hide{opacity:0; pointer-events:none;} */

/*COLORS*/
:root{

	/*White*/
	--white-01:rgba(250,250,250,0.1);
	--white-02:rgba(250,250,250,0.2);
	--white-03:rgba(250,250,250,0.3);
	--white-04:rgba(250,250,250,0.4);
	--white-05:rgba(250,250,250,0.5);
	--white-06:rgba(250,250,250,0.6);
	--white-07:rgba(250,250,250,0.7);
	--white-08:rgba(250,250,250,0.8);
	--white-09:rgba(250,250,250,0.9);
	--white:#FFFFFF;

	/*Black*/
	--black-01:rgba(0,0,0,0.1);
	--black-02:rgba(0,0,0,0.2);
	--black-03:rgba(0,0,0,0.3);
	--black-04:rgba(0,0,0,0.4);
	--black-05:rgba(0,0,0,0.5);
	--black-06:rgba(0,0,0,0.6);
	--black-07:rgba(0,0,0,0.7);
	--black-08:rgba(0,0,0,0.8);
	--black-09:rgba(0,0,0,0.9);
	--black:#000000;

	--soft-gray:#CCCCCC;
	--gray:#999999;
	--dark-gray:#333333;

	--warning:#df0b5b;
	--warning-toast:#dd6464;
}


/*GENERICS*/

html{width:100%; height:100%}

body{width:100%; height:100%; background:var(--white); font-size:1rem; font-family:'Open Sans', Arial, Helvetica, sans-serif; font-weight:400; color:var(--black); -webkit-font-smoothing:antialiased;}

a{color:var(--black); text-decoration:none; transition: all 0.35s ease-in-out;}

header, section, article, aside, footer, nav, figure, div, a{box-sizing:border-box; position:relative;}

	/*Form*/

		/*Input*/
		input{}

		/*TextArea*/
		textarea{height:140px; resize:none; padding:20px; box-sizing:border-box;}

		/*Select*/
		.select_style{height:50px; border-bottom:var(--green) 1px solid; border-right:none; border-left:none; border-top:none;}
		.select_style::before{width:17px; height:17px; position:absolute; top:0; bottom:0; right:0; margin:auto 0; background:url(../../img/bg_arrow.svg) no-repeat; pointer-events:none; content:''}

			.select_style select{border:none; background:var(--white); height:100%; color:var(--black); box-sizing:border-box; -webkit-box-sizing:border-box;}

		/*Floating Label*/
		label.floating_label{position:absolute; top:14px; left:0;  font-family:'Muli', sans-serif; font-weight:400; color:var(--gray); pointer-events:none; z-index:10; transition:all 0.2s ease-in-out; -webkit-transition:all 0.2s ease-in-out; will-change:font-size, color, top; touch-action:manipulation;}

			input:not(:placeholder-shown) + label,
			input:focus + label {top:0px; font-size:0.750rem;}

				input:not(:placeholder-shown),
				input:focus{padding:15px 0 0 !important;}

			select:focus + label, 
			select:not([value=""]):valid + label{top:0px; font-size:0.750rem;}

				select:focus, 
				select:not([value=""]):valid{padding:15px 0 0 !important;}

			textarea:not(:placeholder-shown) + label,
			textarea:focus + label {top:0px; font-size:0.750rem;}

				textarea:not(:placeholder-shown),
				textarea:focus{padding:20px 0 0 !important;}

		/*Checkbox*/
		.label-check {width:auto; float:left; position:relative; cursor:pointer; margin:0;}
	    .label-check input[type="checkbox"] { opacity:0; position:absolute; left:0; top:0; margin:0; z-index:1; cursor:pointer; width:24px; height:24px;}
	    .label-check span.label_check { position:relative; top:-2px; background:var(--gray-02); display:inline-block; vertical-align:bottom; margin-right:5px; width:24px; height:24px; border-radius:2px; box-shadow:inset 0 2px 1px 0 rgba(0, 0, 0, 0.1);}
	    .label-check input[type="checkbox"]:checked + span:after { content:''; display:block; position:absolute; left:0; top:0; right:0; bottom:0; margin:auto; width:24px; height:24px; background-image:url(../../img/bg_check.svg); background-color:var(--green); background-repeat:no-repeat; border-radius:2px; background-position:center;}

	    /*Warning*/

			/*Input*/
			.warning input{border-bottom:var(--warning) 1px solid}

			/*Input*/
			.warning textarea{border:var(--warning) 1px solid}

			/*Select*/
			.warning .select_style{border-bottom:var(--warning) 1px solid}

			/*Label*/
			.warning label{color:var(--warning);}

			/*CheckBox*/
			.warning .label-check span.label_check{background:var(--warning);}

			/*Terms*/
			.warning .terms{color:var(--warning);}

/*LAYOUT*/
.row{width:100%; display:flex; flex-wrap:wrap;}

.center_content{width:1200px; margin:0 auto; display:flex; flex-wrap:wrap;}

/*FADE AND TRANSLATE ANIMATION*/
.fade_translate_animation{opacity: 0; transform: translateY(30px); transition: all .75s ease-in-out;}
.fade_translate_animation.active{opacity: 1; transform: translateY(0);}

/*------------------------------------------------*/
/*----------------------HOME----------------------*/
/*------------------------------------------------*/
.home{cursor: none;}

	/*Hero*/
	.home .content_hero{height: 100dvh}

		/**/
		.home .content_hero article{position: relative; justify-content: center; align-items: center; height: 100%;}

			/*Hero background image*/
			.home .content_hero .hero_background_media{position: absolute; width: 100%; height: 100dvh; overflow: hidden;}
				.home .content_hero .hero_background_media .media{width: 100%; height: 100%; object-fit: cover; transform: scale(1.02);}

			/*Hero elements*/
			.home .content_hero .hero_elements{align-content: center; height: 100%; padding: 0 40px;}

				/*Hero logo*/
				.home .content_hero .hero_elements .hero_logo{justify-content: center;}
					.home .content_hero .hero_elements .hero_logo .image_container{width: 220px; height: auto;}
						.home .content_hero .hero_elements .hero_logo .image_container img{width: 100%; height: 100%; object-fit: contain;}

				/*Hero title*/
				.home .content_hero .hero_elements .hero_title{margin-top: 30px; transition-delay: .1s;}
					.home .content_hero .hero_elements .hero_title h1{font-family: 'Outfit'; font-size: 5.125rem; font-weight: 300; line-height: 1; text-align: center; color: var(--white);}

				/*Hero logo*/
				.home .content_hero .hero_elements .hero_button_content{justify-content: center; margin-top: 55px; transition-delay: .2s;}
					.home .content_hero .hero_elements .hero_button_content .hero_button{ padding: 16px 35px; background-color: var(--black-03); border-radius: 50px; text-decoration: none; cursor: none;}
					.home .content_hero .hero_elements .hero_button_content .hero_button:hover{background-color: var(--black-05);}
						.home .content_hero .hero_elements .hero_button_content .hero_button .mask{position: relative; height: fit-content; overflow: hidden;}
							.home .content_hero .hero_elements .hero_button_content .hero_button span{position: relative; display: block; height: 100%; font-family: 'Outfit'; font-size: 1rem; font-weight: 400; letter-spacing: 0.75px; text-transform: uppercase; color: var(--white); transition: transform .35s ease-in-out;}
							.home .content_hero .hero_elements .hero_button_content .hero_button span::after{content: attr(data-label); position: absolute; top: calc(100% + 2vh); left: 0; display: flex; justify-content: center; align-items: center; text-align: center; width: 100%; height: 100%;}
							.home .content_hero .hero_elements .hero_button_content .hero_button:hover span{transform: translateY(calc(-100% - 2vh));}
				
				/*Hero powered by*/
				.home .content_hero .hero_elements .hero_powered_by{position: absolute; left: 0; bottom: 25px; justify-content: center;}
					.home .content_hero .hero_elements .hero_powered_by .overlay{width: fit-content; overflow: hidden;}
					.home .content_hero .hero_elements .hero_powered_by h2{font-family: 'Outfit'; font-size: 1rem; font-weight: 300; color: var(--white); transform: translateY(100%); opacity: 0; transition: all  1s ease-in-out;}
					.home .content_hero .hero_elements .hero_powered_by.active h2{transform: translateX(0); opacity: 1;}
						.home .content_hero .hero_elements .hero_powered_by h2 a{font-weight: 700; text-decoration: none; color: inherit; cursor: none;}
						.home .content_hero .hero_elements .hero_powered_by h2 a::after{content: ''; position: absolute; left: 0; bottom: 0; display: block; width: 100%; height: 1px; background-color: var(--white); transform: scaleX(0); transform-origin: right; transition: transform .35s ease-in-out;}
						.home .content_hero .hero_elements .hero_powered_by h2 a:hover::after{transform: scaleX(1);transform-origin: left;}
                    



/*Media Query 1700px Breakpoint*/
@media (max-width: 1700px) {

}

/*Media Query 1600px Breakpoint*/
@media (max-width: 1600px) {

}

/*Media Query 1400px Breakpoint*/
@media (max-width: 1400px) {

}

/*Media Query 1300px Breakpoint*/
@media (max-width: 1300px) {

}

/*Media Query 1200px Breakpoint Ipad Landscape*/
@media (max-width: 1200px) {

}

/*Media Query Ipad Portrait General*/
@media (max-width: 1000px) {
/*Hero title*/
	.home .content_hero .hero_elements .hero_title h1{font-size: 4.5rem;}
}

/*Media Query Mobile*/
@media (max-width: 750px) {
/*Hero logo*/
.home .content_hero .hero_elements .hero_logo .image_container{width: 145px;}

/*Hero title*/
.home .content_hero .hero_elements .hero_title h1{font-size: 2.25rem;}
}

/*Media Query Small Mobile*/
@media (max-width: 450px) {
/*Hero title*/
.home .content_hero .hero_elements .hero_title h1 br{display: none;}
}