/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

@font-face {
	font-family:"Belgrad";
	src: url("./fonts/belgrad.eot") format("eot"), url("./fonts/belgrad.woff") format("woff"), url("./fonts/belgrad.ttf") format("truetype");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family:"Avenir New Condenced";
	src: url("./fonts/avenir-next-condensed.ttc") format("ttc");
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family:"Calibre";
	src: url("./fonts/CalibreRegular.otf") format("opentype");
	font-weight: normal;
	font-style: normal;
}


body{
    font-family: 'Montserrat', sans-serif;
	font-size: 0.8rem;
	color: #002c4d;
}

footer .nav-item{
	padding: 0;
}

footer .dropdown > a{
	font-size: 0.9rem;
}

footer p{
	font-size: 0.8rem;
}

footer .header{
	font-size: 0.9rem;
	font-weight: 600;
	line-height: 1.5;
	padding: 0 !important;
	margin-bottom: 0.8rem;
}

footer .legal{
	font-size: 0.7rem;
}

footer .legal a{
	font-size: 0.7rem;
}

footer .nav-link{
	font-size: 0.8rem;
}

footer .btn-email{
	font-size: 0.8rem;
}

h1{
	font-size: 3.4rem;
	font-weight: 800;
	margin-bottom: 1rem;
}

h2{
	font-size: 2.8rem;
	line-height: 1.1;
	font-weight: 800;
	margin-bottom: 1rem;
}

h3{
	font-size: 1.7rem;
	font-weight: 500;
	line-height: 2.2rem;
	letter-spacing: 0.12rem;
	margin-bottom: 1rem;
}

h4{
	font-size: 1.5rem;
	font-weight: 500;
	margin-bottom: 1rem;
}

h5{
	font-size: 1.1rem;
	font-weight: 500;
	margin-bottom: 1.5rem;
}

h6{
	font-size: 1.2rem;
	font-weight: 600;
	line-height: 1.5;
	margin-bottom: 1rem;
}

p{
	color: #002C4D;
	font-size: 1.2rem;
	margin: 0;
}

p > span{
	font-size: 1rem;
}

a{
	color: #002c4d;
	font-size: 0.8rem;
	text-decoration: none;
}

a:hover {
	color: #cebf89 !important;
}

li {
	font-size: 1rem;
}

hr{
	margin: 0;
}

video::-webkit-media-controls {
    display: none;
}

i.fa-s-gold {
	display: inline-block;
	border: solid 0.1em #CEBF89;
	border-radius: 60px;
	padding: 0.3em 0.4em;
	transition: 0.2s ease-in;
}

i.fa-s-gold:hover {
	background-color: #CEBF89;
	border: solid 0.1em #002C4D;
	color: #002C4D;
}

i.fa-r-gold {
	display: inline-block;
	border: solid 0.1em #CEBF89;
	border-radius: 60px;
	padding: 0.3em 0.5em;
	transition: 0.2s ease-in;
}

i.fa-r-gold:hover {
	background-color: #CEBF89;
	border: solid 0.1em #002C4D;
	color: #002C4D;
}

i.fa-s-blue {
	background-color: transparent;
	display: inline-block;
	border: solid 0.1em #002C4D;
	border-radius: 60px;
	padding: 0.9em 0.5em;
	transition: 0.2s ease-in;
}

i.fa-s-blue:hover {
	border: solid 0.1em #CEBF89;
	color: #CEBF89;
}

i.fa-r-blue {
	background-color: transparent;
	display: inline-block;
	border: solid 0.1em #002C4D;
	border-radius: 60px;
	padding: 0.9em 0.6em;
	transition: 0.2s ease-in;
}

i.fa-r-blue:hover {
	border: solid 0.1em #CEBF89;
	color: #CEBF89;
}

.bg-primary{
    background-color: #FFF !important;
}

.bg-secundary{
	background-color: #002C4D !important;
}

.bg-blue{
	background-color: #002C4D;
}

.bg-gold{
	background: #CEBF89;
	transition: 0.5s ease-in;
	/*background-image: url("../img/gold_background.svg");
	background-size: cover;*/
}

.bg-white{
	background-color: white;
	transition: 0.5s ease-in;
}

.bg-hero {
    min-width: 100%;
    max-width: 100%;
    object-fit: cover;
    z-index: -1;
}

.bg-hero::-webkit-media-controls {
    display: none !important;
}

.bg-footer{
	min-width: 100%;
	min-height: 50vh;
    max-width: 100%;
	max-height: 50vh;
    object-fit: cover;
    z-index: -1;
}

.bg-footer::-webkit-media-controls {
    display: none !important;
}

.bg-video{
	min-width: 100%;
	min-height: 100vh;
	max-width: 100%;
	max-height: 100vh;
	object-fit: cover;
	z-index: -1;
}

.bg-video::-webkit-media-controls {
    display: none !important;
}

.bg-login{
    background: url("../img/login-background.jpg");
	background-size: cover;
	background-position: center;
}

.bg-usa{
	background-image: url("../img/usa-background.jpg");
	background-size: cover;
	background-position: center;
}

.bg-mexico{
	background-image: url("../img/mexico-background.jpg");
	background-size: cover;
	background-position: center;
}

.bg-madrid{
	background-image: url("../img/espana-background.jpg");
	background-size: cover;
	background-position: center;
}

.bg-revenue{
	background-image: url("../img/revenue-background.png");
	background-size: cover;
	background-position: center;
}

.bg-platform{
	background-image: url("../img/ambigu-platform-background.png");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

.r-border-box{
	border: 0.8rem solid white;
}

.l-border-box{
	border: 0.8rem solid white;
	border-right: none;
}

.btn-primary{
	background-color: transparent;
	border: solid white 2px;
	border-radius: 0px;
	font-weight: 600;
	color: white;
	transition: 0.2s ease-in;
}

.btn-primary:hover{
    background-color: #CEBF89;
	border: solid #CEBF89 2px;
	font-weight: 800;
	color: #002C4D !important;
}

.btn-secundary{
	background-color: transparent;
	border: solid #002C4D 2px;
	border-radius: 0px;
	font-weight: 600;
	min-width: 180px;
	transition: 0.2s ease-in;
}

.btn-secundary:hover{
	background-color: transparent;
	font-weight: 800;
	border: solid #CEBF89 2px;
	color: #CEBF89;
}

.btn-tertiary{
	background-color: #002C4D;
	border: solid white 2px;
	border-radius: 0px;
	font-weight: 600;
	color: white;
	transition: 0.2s ease-in;
}

.btn-tertiary:hover{
    background-color: #CEBF89;
	border: solid #CEBF89 2px;
	font-weight: 800;
	color: #002C4D !important;
}

.btn-social{
	color: #002C4D !important;
}

.btn-social:hover{
	color: #CEBF89 !important;
}

.btn-outline{
	background-color: #CEBF89;
	border: solid #CEBF89 3px;
	border-radius: 0px;
	font-weight: 500;
	min-width: 180px;
	color: #002C4D;
	transition: 0.2s ease-in;
}

.btn-outline:hover{
	background-color: #CEBF89;
	border: solid #002C4D 3px;
	font-weight: 700;
	color: #002C4D !important;
}

.btn-email{
	font-size: 0.9rem;
	font-weight: 500;
	text-decoration: none;
}

.btn-email > .icon{
	display: none;
	animation: fade-in 0.5s;
}

.btn-email:hover > .icon{
	display: inline;
}

.btn-text{
	font-size: 1.1rem;
	font-weight: 700;
}

.btn-more{
	font-size: 1.1rem;
	font-weight: 700;
}

.btn-back{
	left: 100%;
  	position: relative;
}

.btn-sm{
	font-size: 1rem;
	min-width: 6rem;
	padding: 0.25rem;
}

.btn-md{
	font-size: 0.8rem;
	min-width: 10.5rem;
	padding: 0.8rem;
}

.btn-lg{
	font-size: 0.8rem;
	min-width: 16rem;
	padding: 0.8rem;
}

.btn-xl{
	font-size: 0.8rem;
	width: 100%;
	padding: 0.8rem;
}

.btn-collapse{
	font-size: 1rem;
	font-weight: 600;
	color: #cebf89;
	text-decoration: none;
}

.btn-collapse > .icon{
	display: none;
	animation: fade-in 0.5s;
}

.btn-collapse:hover > .icon{
	display: inline;
}

.btn-collapse.collapsed{
	color: #002c4d !important;
}

.btn-collapse.collapsed:hover{
	color: #cebf89 !important;
}

.btn-toogle[aria-expanded=false] .icon-expanded {
  display: none;
}

.btn-toogle[aria-expanded=true] .icon-collapsed {
  display: none;
}

.btn-dropdown{
	background-color: transparent;
	border: solid #002C4D 2px;
	border-right: none;
	border-radius: 0px;
	font-weight: 500;
}

.btn-dropdown:hover{
	background-color: transparent;
	border: solid #002C4D 2px;
	border-right: none;
	border-radius: 0px;
	font-weight: 500;
}

.display{
	font-size: 1.7rem;
	font-weight: 500;
	line-height: 2.2rem;
	letter-spacing: 0.10rem;
	margin-bottom: 1rem;
}

.icon-platform {
	width: 2.1rem;
	height: auto;
}

.flag {
    width: 1.8rem;
  	height: auto;
  	margin-bottom: 0;
}

.dropdown-menu{
	border-radius: 0;
}

.text-justify{
	text-align:justify !important;
}

.video-home{
	position: relative;
	width: 100%;
	z-index: -1;
}

.video-hero{
	position: absolute;
	min-width: 100%;
	min-height: 100%;
	bottom: 0;
	right: 0;
	z-index: -1;
}

.video-integration{
	position: absolute;
	min-width: 100%;
	min-height: 100%;
	top: 200vh;
	right: 0;
	z-index: -2;
}

.video-revenue{
	position: absolute;
	min-width: 100%;
	min-height: 100%;
	top: 300vh;
	right: 0;
	z-index: -2;
}

.video-footer{
	position: relative;
	width: 100%;
	z-index: -1;
}

.small-wrapper{
	min-height: 40vh;
}

.half-wrapper{
	min-height: 50vh;
}

.large-wrapper{
	min-height: 60vh;
}

.extralarge-wrapper{
	min-height: 70vh;
}

.full-wrapper{
	min-height: 100%;
}

.video-wrapper {
	position: relative;
}

.main-wrapper{
	min-height: 100vh;
}

.overlay-wrapper{
	transform: translate(0,-50vh);
	position: absolute;
	width: 100%;
}

.about-wrapper{
	min-height: 32vh;
}

.how-wrapper{
	min-height: 32vh;
}

.sustainable-wrapper{
	min-height: 32vh;
}

.revenue-wrapper{
	min-height: 100vh;
}

.footer-wrapper{
	min-height: 50vh;
}

.footer-overlay-wrapper{
	transform: translate(0,-25vh);
	position: absolute;
	width: 100%;
}

.footer-box{
	width: 50%;
}

.contact-wrapper{
	min-height: 85vh;
	padding-top: 6rem;
	padding-bottom: 2rem;
}

.platform-wrapper{
	min-height: 70vh;
}

.map-wrapper{
	min-height: 50vh;
}

.overlay-container{
	transform: translate(0,-50%);
	text-align: center !important;
}

.footer-container{
	display: flex;
}

.navbar{
	background-color: rgba(255, 255, 255, 0);
	border-bottom: solid #cebf89 1px;
	transition: 1s ease-in;
	--bs-navbar-padding-y: 0.4rem;
}

.navbar.scrolled{
	background-color: rgba(255, 255, 255, 1);
	--bs-navbar-padding-y: 0.4rem;
}

.navbar-nav .nav-link, .navbar-nav .nav-link {
	color: #cebf89;
	transition: 0.2s ease-in;
}

.navbar-nav .nav-link:hover, .navbar-nav .nav-link:hover {
	color: #cebf89;
	text-decoration: underline;
	text-decoration-thickness: 0.3rem;
	text-underline-offset: 1.1rem;
	transition: 0.2s ease-in;
}

.navbar-nav.scrolled .nav-link, .navbar-nav.scrolled .nav-link {
	color: #002c4d;
	text-underline-offset: 1.1rem;
}

.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
	color: #cebf89;
	text-decoration: underline;
	text-decoration-thickness: 0.3rem;
	text-underline-offset: 1.1rem;
	transition: 0.2s ease-in;
}

.navbar-nav.scrolled .nav-link.active, .navbar-nav .nav-link.show {
	text-decoration-thickness: 0.3rem;
	text-underline-offset: 1.1rem;
}

.navbar-toggler{
	border-color: #002C4D;
}

.navbar-toggler-icon{
	
	color: #002C4D;
}

.navbar-toggler{
	--bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 44, 77, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M12 12.707l6.846 6.846.708-.707L12.707 12l6.847-6.846-.707-.708L12 11.293 5.154 4.446l-.707.708L11.293 12l-6.846 6.846.707.707L12 12.707z'/%3e%3c/svg%3e");
	border-color: #002c4d;
	border: none;
}

.navbar-toggler:focus{
	box-shadow: none;
	border: none;
}

.navbar-toggler.collapsed .navbar-toggler-icon{
	--bs-navbar-toggler-icon-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 44, 77, 0.75%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
	color: #cebf89;
	border: none;
}

.nav-item{
	padding: 0 0.5rem;
}

.nav-link{
	font-size: 0.8rem;
	color: #002c4d;
}

.menu-logo{
	content: url("../img/gold_menu_logo.png");
	width: auto;
	height: 26px;
}

.menu-logo.scrolled{
	content: url("../img/blue_menu_logo.png");
	width: auto;
	height: 26px;
}

.prices-bar{
	height: 0;
	left: 0;
  	opacity: 0;
  	transition: all .8s ease;
  	top: 2.6rem;
	z-index: -2;
}

.prices-bar.scrolled{
	height: auto;
  	opacity: 1;
  	transform: translateY(0);
	z-index: 1;
}

.features .dropdown-menu{
	width: 640px;
}

.features .dropdown-menu li{
	display: block;
    float: left;
	width: 50%;
}

.card {
	/*min-height: 710px;*/
	min-height: 100%;
	box-shadow: none;
	border-radius: 0;
	margin: 0.75rem 0;
}

.card.card-gold{
	border-right: solid #cebf89 0.5rem;
}
    
.card:hover .card-body > .list-group{
	display: block;
	animation: fade-in 0.5s;
}

.card-sm {
	min-height: 100px;
}

.text-white h5{
	color: white !important;
}

.card-header{
	background-color: transparent;
	border-bottom: none;
}

.card-header-gold {
	background-color: #cebf89;
}

.card-header h5{
	margin:  0;
	color: #002C4D;
}

.card-header:first-child {
  border-radius: 0;
}

.card-body ul li{
	color: #002C4D;
	font-size: 1rem;
}

.card-body ul li:before {
	content: '✓';
	padding-right: 0.5rem;
}

.card-text{
	color: #002C4D;
	margin-bottom: 0.25rem;
	height: 85px;
}

.card-price{
	color: #002C4D;
	font-size: 1.2rem;
}

.card-price > span{
	font-size: 2.0rem;
}

.card-price-xl{
	color: #002C4D;
	font-size: 1.8rem;
}

.card-price-xl > span{
	font-size: 2.5rem;
}


.card-price sup{
	color: #002C4D;
	font-size: 1.4rem;
}

.card-price sub{
	color: #002C4D;
	font-size: 1.4rem;
}

.faqs a{
	font-size: 1.2rem;
}

.climate a{
	font-family: proxima-nova;
	font-weight: 900;
	font-size: 1.4rem;
}

.client-logo{
	max-width: 8rem;
	height: auto;
	opacity: 0.3;
}

.form-label{
	background-color: transparent;
	font-size: 0.9rem;
	border-width: revert;
	border: #002C4D solid 2px;
	border-left: none;
	border-radius: 0px;
	color: #002C4D;
	padding: 0.6rem 0.6rem 0.6rem 0;
	margin: 0
}

.form-control{
	font-size: 0.9rem;
	border-width: revert;
	background-color: transparent;
	border: #002C4D solid 2px;
	border-radius: 0px;
	color: #002C4D;
	padding: 0.6rem;
}

.form-control:focus{
	border: none;
	border-bottom: #cebf89 solid 2px;
}

.form-control::placeholder{
	color: gray;
}

.form-select{
	font-size: 0.9rem;
	border-width: revert;
	background-color: transparent;
	border: #002C4D solid 2px;
	border-radius: 0px;
	color: #002C4D;
	padding: 0.6rem;
}

.simulator-container{
	border: 0;
}

.simulator{
	background-color: transparent;
	bottom: 45px;
	position: relative;
}

.simulator .display{
	font-size: 1.5rem;
	font-weight: 500;
	margin-bottom: 1rem;
}

.simulator .slider-header p{
	font-size: 0.8rem;
	color: #002C4D;
}

.simulator .slider-header p span{
	color: red;
}

.simulator .slider-label p{
	font-size: 0.8rem;
	color: #002C4D;
}

.simulator .summary-container {
	border: white solid 2px;
}

.simulator .summary p{
	font-size: 0.9rem;
}

.simulator .summary p > span{
	font-size: 1rem;
}

.simulator hr{
	margin: 1rem 0;
}

.simulator .form-range::-moz-range-thumb{
    width: 1.6rem;
    height: 1.6rem;
    background: #002C4D;
    cursor: pointer;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 50%;
}

.simulator .form-range::-ms-thumb{
    width: 1.6rem;
    height: 1.6rem;
    background: #002C4D;
    cursor: pointer;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 50%;
}

.simulator .form-range::-webkit-slider-thumb{
    width: 1.6rem;
    height: 1.6rem;
    background: #002C4D;
    cursor: pointer;
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 50%;
}

.contact .form-label{
	background-color: transparent;
	font-size: 0.9rem;
	border-bottom: white solid 2px;
	border-left: none;
	border-right: none;
	border-radius: 0px;
	color: white;
	padding: 0.6rem 0.6rem 0.6rem 0;
	margin: 0
}

.contact .form-control{
	font-size: 0.9rem;
	background-color: transparent;
	border-bottom: white solid 2px;
	border-left: none;
	border-right: none;
	border-radius: 0px;
	color: white;
	padding: 0.6rem;
}

.contact .form-control:focus{
	border: none;
	border-bottom: #cebf89 solid 2px;
}

.contact .form-control::placeholder{
	color: lightgray;
}


.contact .btn-dropdown{
	background-color: transparent;
	border-top: solid #002c4d 2px;
	border-bottom: solid white 2px;
	border-right: none;
	border-left: none;
	border-radius: 0px;
	font-weight: 500;
	color: white;
}

.contact .btn-dropdown:hover{
	background-color: transparent;
	border: solid white 2px;
	border-right: none;
	border-left: none;
	border-top: solid rgba(0,0,0,0) 2px;
	border-radius: 0px;
	font-weight: 500;
}

.contact-address p{
	font-size: 0.9rem;
}

.contact-header{
	font-size: 0.9rem;
	font-weight: 700;
	line-height: 1.5;
	margin-bottom: 1rem;
}

.contact-text{
	font-size: 1rem;
	font-weight: 400;
	line-height: 1;
}


.contact-email{
	font-size: 0.8rem;
	font-weight: 500;
	text-decoration: none;
}

.contact-code{
	height: 16rem;
	overflow-y: scroll;
}

.contact-code.show{
	background-color: white;
	animation: ease-in 0.5s;
}

.container-map{
	position: absolute;
	top: 0px;
}

.frame-map{
	width: 100%;
	height: 29.5rem;
	border: 0;
}

.close-map{
	display: block;
	float: right;
	top: -29rem;
	position: relative;
	left: -1rem;
	color: black;
	border: black 1px solid;
  	border-radius: 10rem;
  	padding: 4px 6px;
}

.close-map:hover{
	border: black 1px solid;
}

.about-head{
	font-size: 1.5rem;
	letter-spacing: 0.09rem;
	line-height: 2.2rem;
	font-style: italic;
	font-weight: 600;
}

.about-partner{
	font-size: 2.0rem;
	font-family: proxima-nova;
	font-weight:900
}

.about-collapse{
	text-decoration: none;
}

.about-collapse > .icon{
	display: none;
	animation: fade-in 0.5s;
}

.about-collapse:hover > .icon{
	display: inline;
}

.how-container{
	margin-top: -1rem;
}

.how{
	position: relative;
	bottom: 1.3rem;
}

.how h6{
	font-size: 1.5rem;
	font-weight: 700;
}

.how-feature{
	background-color: white;
}

.platform h3{
	font-size: 1.9rem;
	line-height: 1.1;
	font-weight: 900;
	margin-bottom: 1rem;
}

.platform a{
	font-size: 1rem;
}

.platform img{
	width: 100%
}

.platform .feature{
	font-size: 1.1rem;
	font-weight: 500;
	margin-bottom: 1.5rem;
}

.marketing h3{
	font-size: 1.9rem;
	line-height: 1;
	font-weight: 800;
	letter-spacing: 0;
	margin-bottom: 1rem;
}

.marketing h4{
	font-size: 1.5rem;
	font-weight: 700;
	margin-bottom: 1rem;
}

.marketing .iam-container{
	border: #002C4D solid 2px;
}

.marketing .iam-head{
	position: relative;
	bottom: -2rem;
}

.marketing .iam-content{
	position: relative;
	bottom: 6.8rem;
}

.marketing img{
	width: 100%
}


.marketing .icon-platform {
	width: 2.1rem;
	height: auto;
}

.prices h3{
	font-size: 1.9rem;
	line-height: 1;
	font-weight: 800;
	letter-spacing: 0;
	margin-bottom: 1rem;
}

.prices .text-header{
	font-size: 1.2rem;
}

.cookies a{
	font-size: 1rem;
	margin: 0;
}

.cookies h3{
	font-size: 1.9rem;
	line-height: 1.1;
	font-weight: 900;
	margin-bottom: 1rem;
}

.cookies p{
	text-align:justify !important;
}

.privacy h3{
	font-size: 1.9rem;
	line-height: 1.1;
	font-weight: 900;
	margin-bottom: 1rem;
}

.privacy p{
	text-align:justify !important;
}

.pre-footer a{
	font-size: 0.9rem;
}

.legal li{
	font-size: 1rem;
}

.login p{
	font-size: 0.7rem;
}

.login form a{
	font-size: 0.8rem;
	text-decoration: none;
}

.login a{
	font-size: 0.7rem;
	text-decoration: underline;
}

.footer-logo{
	width: 100%;
	height: auto;
}

.white-line {
	border: solid 1px white;
	opacity: 1;
}

.gold-line {
	border: solid 1px #CEBF89;
	opacity: 1;
}

.blue-line {
	border: solid 1px #002C4D;
	opacity: 1;
}

.blue-b-line {
	border-bottom: solid 3px #002C4D;
	opacity: 1;
}

.blue-r-line {
	border-right: solid 2px #002C4D;
	opacity: 1;
}

.gray-l-line{
	border-left: solid lightgray 1px;	
}

.gray-r-line{
	border-right: solid lightgray 1px;	
}

.hide {
  display: none;
}

.show {
	display: block;
	animation: fade-in 0.5s;
}

.blue{
	color: #002C4D;
}

.gold{
	color: #cebf89 !important;
}

.white{
	color: #fff;
}

.white-50 {
	background-color: rgba(255, 255, 255, 0.80);
}

.green{
	color: #198754;
}

.black{
	color: #000000;
}

.text-blue{
	color: #002C4D;
}

.text-shadow-black{
	text-shadow: 1px 1px 2px black;
}

.text-shadow-white{
	text-shadow: 1px 1px 2px white;
}

.draw {
	overflow: hidden;
	position: relative;
}

.draw::before {
	content: '';
	box-sizing: border-box;
	position: absolute;
	border: 2px solid transparent;
	width: 100%;
	height: 100%;
}

.draw::after {
	content: '';
	box-sizing: border-box;
	position: absolute;
	border: 2px solid transparent;
	width: 100%;
	height: 100%;
}

.draw::before {
	top: 0;
	left: 0;
	border-top-color: white;
	border-right-color: white;
	animation: borderTop 2s;
}

.draw::after {
	bottom: 0;
	right: 0;
	border-bottom-color: white;
	border-left-color: white;
	animation: borderBottom 2s, borderColor 2s;
}

.draw-line {
	height:0px;
	width:1px;
	border-bottom: solid 3px #002C4D;
	-webkit-animation: increase 3s;
	-moz-animation:    increase 3s; 
	-o-animation:      increase 3s; 
	animation:         increase 3s; 
  	animation-fill-mode: forwards;
}

@media (max-width: 1600px){
	.half-wrapper {
		min-height: 50vh;
	}

	.video-integration{
		top: 175vh;
	}
	
	.video-revenue{
		top: 275vh;
	}
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 2)
{
	.btn-platform {
		right: 10rem !important;
	}

	.btn-platform.show{
		right: 26rem !important;
	}

	.btn-marketing{
		right: 11rem !important;
	}
}

@media (max-width: 767.98px){
	h1{
		font-size: 2.2rem;
		margin-bottom: 1rem;
	}

	h2{
		font-size: 1.5rem;
		margin-bottom: 1rem;
	}

	h3{
		font-size: 1.6rem;
		margin-bottom: 1rem;
	}
	
	h4{
		font-size: 1.2rem;
	}
	
	h5{
		font-size: 1.2rem;
	}
	
	footer .nav-item{
		padding: 0;
	}

	footer .dropdown > a{
		font-size: 1.2rem;
	}

	footer p{
		font-size: 1rem;
	}
	
	footer .legal{
		font-size: 0.85rem;
	}
	
	footer .legal a{
	font-size: 0.85rem;
	}

	footer .header{
		font-size: 1.2rem;
		font-weight: 600;
		line-height: 1.5;
		padding: 0 !important;
		margin-bottom: 0rem;
	}

	footer .nav-link{
		font-size: 1rem;
	}

	footer .btn-email{
		font-size: 1rem;
	}
	
	.navbar{
		background-color: white;
		color: #002C4D;
	}

	.navbar.scrolled{
		background-color: white;
		--bs-navbar-padding-y: 0.4rem;
	}
	
	.navbar-nav {
		height: 100dvh;
	}
	
	.navbar-nav .nav-link, .navbar-nav .nav-link {
		color: #002C4D;
		font-size: 1.4rem;
		font-weight: 600;
		padding: 0 0.1rem;
	}

	.navbar-nav .nav-link:hover, .navbar-nav .nav-link:hover {
		font-size: 1.4rem;
		font-weight: 600;
	}

	.navbar-nav.scrolled .nav-link, .navbar-nav.scrolled .nav-link {
		font-size: 1.4rem;
		font-weight: 600;
	}

	.navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
		font-size: 1.4rem;
		font-weight: 600;
	}

	.navbar-nav.scrolled .nav-link.active, .navbar-nav .nav-link.show {
		font-size: 1.4rem;
		font-weight: 600;
		text-decoration: none;
	}
	
	.navbar-brand {
		text-align: center;
		width: 60%;
		left: 20%;
		display: block;
		position: relative;
	}
	
	.navbar-nav .item {
		opacity: 0;
		transform: translateY(20rem);
		will-change: opacity transform;
		animation: full-fade-in 1.5s cubic-bezier(.14,.18,.16,1.02) forwards;
	}

	.navbar-nav .item:nth-of-type(2) {
		transform: translateY(21rem);
		animation-delay: 0.10s;
	}

	.navbar-nav .item:nth-of-type(3) {
		transform: translateY(22rem);
		animation-delay: 0.20s;
	}

	.navbar-nav .item:nth-of-type(4) {
		transform: translateY(23rem);
		animation-delay: 0.30s;
	}

	.navbar-nav .item:nth-of-type(5) {
		transform: translateY(30rem) !important;
		animation-delay: 0.50s;
	}
	
	.dropdown-item {
		color: #002C4D;
		font-size: 1.2rem;
		white-space: pre-wrap;
		padding: 0;
		font-weight: 800;
	}
	
	.dropdown-item:hover {
		font-size: 1.3rem;
		color: #cebf89;
		padding: 0;
	}
	
	.bg-login{
		background: white;
	}
	
	.bg-platform{
		background-image: url("../img/ambigu-platform-background.png");
		background-size: contain;
		background-position: center;
		background-repeat: no-repeat;
	}
	
	.btn-language{
		font-size: 1.4rem !important;
		text-align: center;
	}
	
	.btn-sales{
		background-color: #002C4D;
		border: solid white 2px;
		border-radius: 0px;
		font-weight: 500 !important;
		font-size: 1.4rem !important;
		color: white !important;
		transition: 0.2s ease-in;
		padding: .4rem 0;
		text-align: center;
		bottom: 8.8rem;
		position: absolute;
		width: 90%
	}
	
	.btn-platform{
		font-weight: 500 !important;
		font-size: 1.4rem !important;
		color: #002C4D !important;
		transition: 0.2s ease-in;
		padding: .4rem 0;
		text-align: center;
		width: 4rem;
		float: right;
		position: absolute;
		right: 9rem;
		top: 0rem;
	}

	.btn-platform.show{
		right: 25rem;
	}

	.btn-marketing{
		font-weight: 500 !important;
		font-size: 1.4rem !important;
		color: #002C4D !important;
		transition: 0.2s ease-in;
		padding: .4rem 0;
		text-align: center;
		width: 4rem;
		float: right;
		position: absolute;
		right: 11rem;
		top: 0rem;
	}
	
	.btn-back{
		left: 0%;
		position: relative;
	}
	
	.close-map {
		top: -20rem;
	}
	
	.display{
		font-size: 1.2rem;
		font-weight: 500;
		line-height: 2rem;
		letter-spacing: 0.03rem;
		margin-bottom: 1rem;
	}

	.menu-language{
		position: relative !important;
	}
	
	.menu-logo{
		content: url("../img/blue_menu_logo.png");
		width: auto;
		height: 32px;
	}
	
	.menu-logo.scrolled{
		content: url("../img/blue_menu_logo.png");
		width: auto;
		height: 32px;
	}

	.video-home {
		top: 55px;
	}

	.video-integration {
		top: 120vh;
	}

	.video-revenue {
		top: 220vh;
	}
	
	.features .dropdown-menu li{
		display: inline-block;
		float: none;
		width: 50%;
	}
	
	.l-border-box{
		border: 0.8rem solid white;
	}
	
	.blue-r-line {
		border-right: none;
	}

	.language{
		background-color: white;
		position: absolute;
		width: 100%;
		bottom: 4.3rem;
	}
	
	.simulator{
		bottom: 75px;
	}
	
	.revenue-wrapper {
		height: 90vh;
	}
	
	.half-wrapper {
		min-height: 32vh;
	}
	
	.map-wrapper{
		min-height: 35vh;
	}
	
	.about-wrapper{
		min-height: 26vh;
	}
	
	.how-wrapper{
		min-height: 30vh;
	}
	
	.sustainable-wrapper{
		min-height: 42vh;
	}
	
	.how-container {
  		margin-top: 0rem;
	}
	
	.contact-wrapper{
		min-height: 100vh;
		padding-top: 6rem;
	}
	
	.platform-wrapper{
		min-height: 20vh;
	}
	
	.contact .form-control{
		padding: 0.8rem;
	}
	
	.contact .btn-dropdown{
		padding-top: 0.8rem;
	}
	
	.contact .btn-lg{
		width: 100%;
		font-size: 1rem;
	}
	
	.frame-map{
		width: 100%;
		height: 20.2rem;
		border: 0;
	}
	
	.dropdown-menu{
		background: white;
		border: none;
	}
	
	.about-head{
		font-size: 1.1rem;
    	letter-spacing: 0.1rem;
    	line-height: 1.5rem;
	}
	
	.about-partner{
		font-size: 1.7rem;
		font-family: proxima-nova;
		font-weight: 900;
	}
	
	.platform .feature{
		font-size: 1rem;
		font-weight: 500;
	}
	
	.prices .icon-platform {
		width: 5rem;
		height: auto;
	}
	
	.marketing h4 {
	  font-size: 1.2rem;
	  font-weight: 600;
	  margin-bottom: 1rem;
	}
	
	.marketing .icon-platform {
		width: 1.7rem !important;
		height: auto;
	}
	
	.icon-platform {
		width: 1.7rem;
		height: auto;
	}
	
	.card {
		min-height: 100px;
		box-shadow: none;
		margin: 0.75rem 0;
	}
	
	.card.selected {
		border: solid #002C4D 3px;
		min-height: 60px;
		box-shadow: none;
		margin: 0.75rem 0;
	}
	
	.card.card-gold{
		border-right: solid lightgray 1px;
	}
	
	.card.card-gold.selected{
		border-right: solid #002C4D 2px;
	}
	
	.card-header{
		background-color: transparent;
		border-bottom: none;
	}
	
	.card-header h5{
		font-size: 1rem;
	}
	
	.card-header-gold {
		background-color: transparent;
	}
	
	.card-header-gold h5{
		color: #cebf89;
	}
	
	.card-price{
		color: #002C4D;
		font-size: 0.9rem;
	}

	.card-price > span{
		font-size: 1.1rem;
	}
	
	.card-price sub {
		color: #002C4D;
		font-size: 1.2rem;
	}
	
	.card-price-xl{
		color: #002C4D;
		font-size: 1.6rem;
	}

	.card-price-xl > span{
		font-size: 2.0rem;
	}
	
	.client-logo{
		max-width: 7rem;
		height: auto;
		opacity: 0.5;
	}
}

@media (max-width: 767.98px) and (orientation: portrait){
	.video-integration {
		top: 130vh;
	}

	.svideo-revenue {
		top: 220vh;
	}
}

@keyframes borderTop {
	0% {
		width: 0;
		height: 0;
	}
	
	25% {
		width: 100%;
		height: 0;
	}
	
	50% {
		width: 100%;
		height: 100%;
	}
	
	100% {
		width: 100%;
		height: 100%;
	}
}

@keyframes borderBottom {
	0% {
		width: 0;
		height: 0;
	}
	
	25% {
		width: 0;
		height: 0;
	}
	
	50% {
		width: 100%;
		height: 0;
	}
	
	100% {
		width: 100%;
		height: 100%;
	}
}

@keyframes borderColor {
	0% {
		border-bottom-color: transparent;
		border-left-color: transparent;
	}
	50% {
		border-bottom-color: transparent;
		border-left-color: transparent;
	}
	51% {
		border-bottom-color: white;
		border-left-color: white;
	}
	100% {
		border-bottom-color: white;
		border-left-color: white;
	}
}

@keyframes increase {
    100% {
        width: 100%;
    }
}

@keyframes full-fade-in {
	from {
		opacity: 0;
		transform: translateY(24rem);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes fade-in {
     0% {
          opacity: 0;
          height: auto;
     }

     100% {
          opacity: 1;
          height: auto;
     }
}