.exitpopup,.form-container,.terms,.waitpopup {
    font-family:'Geologica',sans-serif!important;
    text-align:left
}
.checkbox-wrapper label,.custom-button {
    font-family:'Geologica';
    font-style:normal;
    line-height:normal
}
.exitpopup-body,.waitpopup-body {
    border-radius:20px;
    border:1px solid var(--dark-grey,#5a5a5a);
    background:rgba(0,0,0,.5);
    box-shadow:0 4px 7px 0 rgba(0,0,0,.25),0 6px 21px 0 rgba(81,80,80,.25) inset;
    backdrop-filter:blur(2.5px)
}
.country-open-more {
    background-color:#51b2dd!important;
    color:#fff!important
}
.custom-button,.custom-button:disabled:hover {
    background-color:#FFDD2D!important
}
.form-container>div+div {
    margin-top:15px!important
}
form.form-container .form_input--group {
    width:100%;
    margin:15px auto 0
}
form.form-container input {
    border-radius:4px;
    border:1px solid #D9D9D9;font-weight: 400;
    background:#fff;height: 64px;
    font-size:24px;
    padding-left:15px;text-align: center!important;
    color:#2B2B2B;
    border-radius: 8px;
}
form.form-container input::placeholder {
    color:#848484!important
}
form.form-container input.valid {
    background-color:#fff;
    border-color:#69c56c;
    color:#2B2B2B
}
form.form-container input.invalid {
    background-color:#fff;
    border-color:#ff9f98;
    color:#2B2B2B
}
form.form-container input:-webkit-autofill,form.form-container input:-webkit-autofill:focus,form.form-container input:-webkit-autofill:hover {
    -webkit-box-shadow:0 0 0 1000px rgba(0,0,0,.4) inset!important;
    box-shadow:0 0 0 1000px rgba(0,0,0,.4) inset!important;
    -webkit-text-fill-color:#fff!important;
    color:#fff!important;
    border:1px solid #5a5a5a!important;
    transition:background-color 5000s ease-in-out
}
form.form-container input.valid:-webkit-autofill,form.form-container input.valid:-webkit-autofill:focus,form.form-container input.valid:-webkit-autofill:hover {
    -webkit-box-shadow:0 0 0 1000px rgba(0,0,0,.4) inset!important;
    box-shadow:0 0 0 1000px rgba(0,0,0,.4) inset!important;
    -webkit-text-fill-color:#fff!important;
    color:#fff!important;
    border-color:#69c56c!important
}
form.form-container input.invalid:-webkit-autofill,form.form-container input.invalid:-webkit-autofill:focus,form.form-container input.invalid:-webkit-autofill:hover {
    -webkit-box-shadow:0 0 0 1000px rgba(0,0,0,.4) inset!important;
    box-shadow:0 0 0 1000px rgba(0,0,0,.4) inset!important;
    -webkit-text-fill-color:#fff!important;
    color:#fff!important;
    border-color:#ff9f98!important
}
.country-list,.form-container .error {
    box-shadow:0 4px 12px rgba(0,0,0,.3)!important
}
.custom-button {
    width:100%;
    padding:14px 20px;
    border-radius:8px;
    font-size: 24px;
    font-weight:700;
    color:#313132;
    border:none;
    transition:.2s
}
.custom-button:hover {
    transform:scale(1.03);
    opacity:.8
}
.custom-button:active {
    transform:scale(1);
    opacity:.8
}
#country-listbox {
    min-width:200px
}
.country-list {
    background:rgba(0,0,0,.95)!important;
    border:1px solid #5a5a5a!important;
    border-radius:6px!important;
    max-height:200px!important
}
@media (max-width:768px) {
    .country-list {
        max-height:calc(100vh - 40px)!important;
        top:20px!important;
        bottom:20px!important
    }
}
.country-list .country {
    color:#fff!important;
    padding:8px 10px!important;
    font-size:14px!important;
    transition:background .2s!important
}
.country-list .country:hover {
    background:rgba(0,181,226,.2)!important
}
.country-list .country.highlight {
    background:rgba(0,181,226,.3)!important
}
.country-list .country .dial-code {
    color:#ccc!important;
    font-size:13px!important
}
.country-list .country .country-name {
    color:#fff!important;
    font-size:14px!important
}
form.form-container input[type=checkbox] {
    appearance:none;
    -webkit-appearance:none;
    width:18px;
    height:18px;
    border:2px solid #5a5a5a;
    border-radius:4px;
    background-color:transparent;
    cursor:pointer;
    position:relative;
    transition:.2s;
    margin-right:8px;
    flex-shrink:0
}
form.form-container input[type=checkbox]:checked {
    background-color:#FFDD2D;
    border-color:#FFDD2D
}
form.form-container input[type=checkbox]:checked::after {
    content:'';
    position:absolute;
    left:5px;
    top:2px;
    width:5px;
    height:9px;
    border:solid #313132;
    border-width:0 2px 2px 0;
    transform:rotate(45deg)
}
.form-container .validation {
    width:17px!important;
    height:17px!important;
    right:11px!important;
    background:#dc4647!important;
    color:#111314!important
}
.form-container .validation i,.form-container .validation svg {
    position:absolute!important;
    top:50%!important;
    left:50%!important;
    transform:translate(-50%,-50%)!important
}
.checkbox-wrapper label {
    display:flex;
    align-items:flex-start;
    color:rgba(255, 255, 255, 0.8)!important;
    font-size:16px;
    font-weight:300;
    cursor:pointer;
    padding-right:29px
}
.checkbox-wrapper label a{font-weight: 300;color: rgba(255, 255, 255, 0.8);}
.checkbox-wrapper label a:hover{color:#00b5e2;opacity: 1;}
.form-container .error {
    background:rgba(0,0,0,.9)!important;
    color:#fff!important;
    border:1px solid #dc4647!important;
    border-radius:6px!important;
    padding:10px 12px!important;
    font-size:13px!important;
    line-height:1.4!important
}
.form-container .error:before {
    display:none!important
}
.checkbox-wrapper a {
    color:#00b5e2;
    text-decoration:none;
    margin-left:5px;
    transition:.2s
}
@media (max-width:420px) {
    .checkbox-wrapper a {
        margin-left:25px
    }
    .form-container .checkbox-wrapper .validation {
        top:39%
    }
}
.checkbox-wrapper a:hover {
    opacity:.8;
    text-decoration:underline
}
.terms__title {
    color:#00b5e2;
    padding-right: 27px;
}
.custompopup {
    padding:20px;
    background-color:#fff;
    border-radius:2px;
    box-shadow:0 15px 20px 0 rgba(0,0,0,.25);
    width:100%;
    height:auto;
    max-width:400px
}
.custompopup-title {
    margin:0;
    padding:0 25px;
    font-size:24px;
    text-align:center
}
.custom-desc {
    margin:10px 0;
    text-align:center
}

.exitpopup,.waitpopup{max-width: 740px;}
.exitpopup-body, .waitpopup-body{padding: 90px 50px 38px;background-color: #fff;}
.exitpopup-title,.waitpopup-title{font-size: 32px;color: #202020;line-height: 120%;font-weight: 700;text-transform: uppercase;padding:0px;}
.exitpopup-desc,.waitpopup-desc{color: #202020;font-size: 26px;line-height: 120%;font-weight: 400;}

.exitpopup-body .checkbox-wrapper label,.waitpopup-body .checkbox-wrapper label{color: #202020!important;}

.exitpopup-body .checkbox-wrapper label a,.waitpopup-body .checkbox-wrapper label a{color: #4599C3;font-weight: 500;}

.exitpopup-body form.form-container input,.waitpopup-body form.form-container input{background-color: #DEDEDE;}

.exitpopup-body .protectionInfo p,.waitpopup-body .protectionInfo p{color: #202020;}
/* .exitpopup-body .protectionInfo,.waitpopup-body .protectionInfo{background-color: rgba(0,0,0,0.19);} */

.waitpopup-body .waitpopup-close,.exitpopup-body .exitpopup-close{width: 24px;height: 24px;background-image: url('../js/FormJS/img/close.png');background-position: center;background-size: cover;    top: 44px;
    right: 40px;}
.waitpopup-close:before,.exitpopup-close:before{display: none;}

.exitpopup-overlay,.waitpopup-overlay{backdrop-filter: blur(9px);
    -webkit-backdrop-filter: blur(9px);
    background: rgba(0, 0, 0, 0.07);}



.exitpopup-desc2{color:#7B7C7C;font-size:22px;font-weight:400;line-height:120%;text-align: center;margin-top: 24px;margin-bottom: 24px;}




@media(max-width: 991px){
    .custom-button{font-size: 20px;}
    .quiz__title{font-size: 28px;}
    .quiz__title.lastTitle{font-size: 22px;}


.header.topSite .title{font-size: 30px;}
.header.topSite .title span{font-size: 22px;}
.header.topSite p{font-size: 22px;padding: 6px 0px 9px;}
.progress__text #percent{font-size: 15px;}

.exitpopup-body, .waitpopup-body{padding: 60px 30px 34px;}

.exitpopup-title, .waitpopup-title{font-size: 26px;}
.exitpopup-desc, .waitpopup-desc{font-size: 22px;}

.waitpopup-body .waitpopup-close, .exitpopup-body .exitpopup-close{width: 18px;height: 18px;top: 34px;
    right: 30px;}

.quiz__answers .label{font-size: 22px;}






}





@media(max-width: 767px){

    form.form-container input{    height: 54px;
    font-size: 16px;}
    .custom-button{font-size: 20px;padding: 17px 20px;}
    .promo-video{padding: 26px 20px 20px;}
    .quiz__title{font-size: 24px;}
    .quiz__title.lastTitle{font-size: 18px;}
    .header{padding-bottom: 24px;}
    .header.topSite .title{        font-size: 26px;
        line-height: 32px;
        margin-bottom: 7px;}
    .header.topSite .title span{font-size: 18px;display:block;margin-top:10px;}
    .header.topSite p{font-size: 16px;
        line-height: 21px;}
        
    .form-container>div+div{margin-top: 10px!important;}
.checkbox-wrapper label {
    font-size: 12px !important;
}
.main .container{margin-bottom: 60px;}

.progress__text #percent{font-size: 12px;}

.exitpopup-body, .waitpopup-body{padding: 40px 20px 34px;    max-height: 100vh;
    overflow: auto;
    height: 100%;}
.exitpopup-title, .waitpopup-title{font-size: 20px;}

.exitpopup-desc, .waitpopup-desc{font-size: 18px;}

.waitpopup-body .waitpopup-close, .exitpopup-body .exitpopup-close{width: 12px;height: 12px;    top: 24px;
    right: 20px;padding: 1px;}

.quiz__answers .label{font-size: 18px;}
.exitpopup-desc2{margin-top: 4px;margin-bottom: 20px;font-size:14px;}

}