@font-face {
font-family: 'AmsiPro';
src: url('../../fonts/AmsiPro-Black.woff2') format('woff2'),
url('../../fonts/AmsiPro-Black.woff') format('woff');
font-weight: 900;
font-style: normal;
font-display: swap;
}

* {
font-family: 'AmsiPro';
font-weight: 900;
font-style: normal;
}

body {
width: 100%;
height: 100%; 
margin: 0;
padding: 0;
} 

label {
color: #d0fa00;
}

input, select, textarea {
width: 90%;
margin-top: 2.5%;
border: none;
padding: 2% 0%;
padding-left: 2%;
border-radius: 15px;
outline: none;
}

input::placeholder, textarea::placeholder, legend {
color: #000;
}

button {
width: 35%;
border: none;
border-radius: 15px;
padding: 2%;
background: #d0fa00;
color: #0c2711;
outline: none;
}

.container-one {
position: absolute;
width: 100%;
height: 100vh;
display: flex;
}

.container-one .banner {
width: 50%;
background-image: url('../../images/banner.jpg');
background-repeat: no-repeat;
background-position: center top;
background-size: cover;
}

.container-one div {
width: 50%;
background-image: url('../../images/background.jpg');
background-repeat: no-repeat;
background-position: center top;
background-size: cover;
text-align: center;
}

.container-one .consent-container {
margin: auto;
margin-top: 8vh;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
}

.container-one .consent-container label {
display: flex;
align-items: center;
justify-content: center;
text-align: justify; /* Justificar texto */
font-weight: 100;
width: 80%; /* Ajustar conforme necessário */
}

.container-one .consent-container input[type="checkbox"] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 20px;
height: 20px;
border: 2px solid #d0fa00;
border-radius: 50%;
outline: none;
cursor: pointer;
padding: 2% 3%;
margin-right: 10px;
position: relative;
}

.container-one .consent-container input[type="checkbox"]:checked::before {
content: '';
position: absolute;
top: 3px;
left: 3px;
width: 10px;
height: 10px;
background-color: #d0fa00;
border-radius: 50%;
}

.container-one .start-button {
margin-top: 5vh;
}

.container-one img {
width: 25%;
margin-top: 3vh;
}

.container-one p {
width: 90%;
margin: auto;
margin-top: 3vh;
font-family: verdana;
font-size: 2vh;
font-weight: 100;
text-align: left !important;
color: #FFF;
}

@media only screen and (max-width: 440px) {

input, select, textarea {
padding: 2% 0%;
padding-left: 3%;

}

.container-one {
height: auto;
flex-direction: column;
background-image: url('../../images/background.jpg');
background-repeat: no-repeat;
background-position: center top;
background-size: cover;
}

.container-one .banner {
width: 100%;
height: 45vh;
background-size: cover;
}

.container-one div {
width: 100%;
background-image: none;
padding-bottom: 2vh;
text-align: center;
}

.container-one .consent-container {
width: 90%;
margin-top: 2vh;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
}

.container-one .consent-container label {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
font-weight: 100;
font-size: 1.9vh;
}

.container-one .consent-container input[type="checkbox"] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
width: 20px;
height: 20px;
border: 2px solid #d0fa00;
border-radius: 50%;
outline: none;
cursor: pointer;
margin-right: 1px;
position: relative;
}

.container-one .consent-container input[type="checkbox"]:checked::before {
content: '';
position: absolute;
top: 3px;
left: 3px;
width: 10px;
height: 10px;
background-color: #d0fa00;
border-radius: 50%;
}

.container-one .start-button {
margin-top: 2vh;
}

.container-one img {
width: 35%;
margin-top: 2vh;
}

.container-one p {
width: 90%;
margin: auto;
margin-top: 3vh;
font-family: verdana;
font-size: 1.8vh;
font-weight: 100;
text-align: left !important;
color: #FFF;
}

}

.container-two {
position: absolute;
width: 100%;
height: 100vh;
background: #0c2711;
display: flex;
justify-content: space-around;
align-items: center;
}

.container-two img {
width: 50%;
}

.container-two div {
width: 40%;
}

@media only screen and (max-width: 440px) {

.container-two {
width: 100%;
height: 100vh;
flex-direction: column;
justify-content: center;
align-items: center;
}

.container-two img {
width: 50%;
}

.container-two div {
width: 80%;
margin-top: 5vh;
}

}

.container-three {
position: absolute;
width: 100%;
height: 100vh;
background: #0c2711;
display: flex;
justify-content: space-around;
align-items: center;
}

.container-three img {
width: 50%;
}

.container-three div {
width: 40%;
}

@media only screen and (max-width: 440px) {

.container-three {
width: 100%;
height: 100vh;
flex-direction: column;
justify-content: center;
align-items: center;
}

.container-three img {
width: 50%;
}

.container-three div {
width: 80%;
margin-top: 5vh;
}

}
