@import url('variables.css');

        
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

@media (max-width:996px) {
    .container{
        padding-top: 50px;
        padding-bottom: 50px;
        height: auto !important;
    }

    .inside-container{
        height: unset !important;
        width: unset !important;
    }
}

.logo-container{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 25px;
}
.container{
display: flex;
flex-direction: column;
width: 100%;
height: 100vh;
top: -1713px;
left: -271px;
gap: 0px;
opacity: 0px;
justify-content: center;
color:var(--text-simple-color);

}
.inside-container{
display: flex;
flex-direction: column;
margin: auto;
height: 90%;
justify-content: space-between;
gap: 10px;


}
.inside-container-header{
max-width: 330px;
height: 138px;
top: 129px;
left: 554px;
gap: 0px;
opacity: 0px;
font-family: var(--fonts-simple-text);
font-size: 38px;
font-weight: 500;
line-height: 45.6px;
letter-spacing: -0.20000000298023224px;
text-align: center;

}
.inside-container-header span:first-child {
color:var(--yellow-custom);
}
.inside-container-body{
margin-top: 45px;
width: 330px;
height: 292px;
top: 305px;
left: 556px;
gap: 0px;
opacity: 0px;
font-family: var(--fonts-simple-text02);
font-size: 16px;
font-weight: 300;
line-height: 24px;
text-align: center;
}

.container-img-details {
align-items: center;
text-align: center;
justify-content: center;
margin: auto;
width: 266.36px;
height: 29.37px;
top: 549px;
padding: 0px;
gap: 0px;
opacity: 0px;
align-items: center;
justify-content: center;
}

.container-select-language{
margin: auto;
width: 310px;
top: 617px;
left: 565px;
gap: 0px;
opacity: 0px;


}



.select-language {
width: 97.29px;
height: 20px;
top: 617px;
left: 565px;
gap: 0px;
margin-bottom: 8px;
opacity: 0px;
font-family: var(--fonts-simple-text02);
font-size: 12px;
font-weight: 500;
line-height: 20px;
text-align: left;
color: var(--text-simple-color);

}

.select-language {
width: 310px;
height: 32px;
top: 639px;
left: 565px;
gap: 0px;
border: 1px 0px 0px 0px;
opacity: 0px;
background: #F4F8FA;
border: 1px solid #D1E2EA;
border-radius: 7px;

}

.container-button-start-quiz {
width: 311px;
height: 54px;
top: 682px;
left: 564px;
gap: 0px;
opacity: 0px;
background: var(--button-color);
font-family: var(--fonts-simple-text02);
font-size: 16px;
font-weight: 600;
line-height: 24px;
text-align: center;
cursor: pointer;
border: none;
transition: all 0.1s;
}


.container-button-start-quiz:hover{
    transition: all 0.1s;
    background-color: #B86C0D;
}

.text-start-quiz {
width: 112px;
height: 24px;
top: 15px;
left: 99px;
gap: 0px;
opacity: 0px;
color:var(--text-simple-color);
}

.removeBackground {
    background: url('../images/img-background.png');
    background-size: cover;
background-position: center;
    
}