:root{
    --lightblue: #00c1f0;
    --darkblue: #051721;
    --light-color: #f5fbf0;
}

.acess{width: 26px;max-width: 74px;display: block;left: -4%;bottom: -3%;display: inline-block;position: absolute;}

*{font:inherit; font-family: 'OpenSansHebrew', sans-serif;}
body{font-family: 'OpenSansHebrew', sans-serif;direction: rtl;text-align: right;background: black;color:var(--darkblue);padding-bottom: 0;}
.bold{font-weight: bold;}
.bolder{font-weight: bolder;}
.lighter{font-weight: lighter;}
.normal{font-weight: normal;}
.white-color{color:white;}
.black-color{color:black;}
.lightblue-color{color:var(--lightblue);}
.darkblue-color{color:var(--darkblue);}

#loader{position: fixed; right: 0; top:0; z-index: 99; width: 100%; height: 100%; background: var(--light-color); display: flex; align-items: center; justify-content: center;}
body.inited #loader{display: none;}


.main-content{position: relative;padding-bottom: 0;}
/* .main-content:after{content: '';background-image: linear-gradient(to top, black, transparent);height: 160px;width: 100%;display: block;position: absolute;right: 0;bottom: 0;z-index: 0;} */
/* .bottom-content:after{content: '';background-image: linear-gradient(to top, black, transparent);height: 160px;width: 100%;display: block;position: absolute;right: 0;bottom: 0;z-index: 0;} */
.content-col{position: absolute;top:0;left: 0;width: 25%;padding-top: 60px;display: flex;justify-content: flex-end;padding-left: 0;}
.right-content{width: 665px;max-width: 50%;}

h1.main-title{font-size: 1.43vw;margin-bottom: 0;line-height: 1.3;text-align: center;font-weight: lighter;}
h1.main-title span.large{font-size: 2.5vw;}
h1.main-title div.bold{font-size: 1.6vw;}


.bottom-content p{font-size: 21px;line-height: 1.4;}
.bottom-content .right{flex: 0 0 35%;max-width: 35%;display: flex;flex-direction: column;align-items: center;justify-content: flex-start;padding-right: 4%;padding-left: 4%;}
.bottom-content .right .logo-img{width: 180px;margin-top: auto;}
.bottom-content .center{flex: 0 0 40%;max-width: 40%;padding-bottom: 6%;}
.bottom-content .left{flex: 0 0 25%;max-width: 25%;display: flex;flex-direction: column;align-items: flex-end;justify-content: flex-end;padding-right: 15px;padding-left: 15px;padding-bottom: 0;}
.bottom-content .left .txt{align-self: flex-start;font-size: 1.2vw;}
.bottom-content .left .txt span{color:#00bff2;}
.bottom-content .left .white-dots{width: 40px;}
.logo-img{width: 250px;max-width: 60%;}

.center h2.title{font-size: 28px;}




@media(min-width:1900px){
    h1.main-title{font-size: 1.43vw;}
    h1.main-title span.large{font-size: 2.3vw;font-weight: lighter;line-height: 0.9;}
    .center h2.title{font-size: 33px;}
    .bottom-content{transform: translateY(-18%);}
}


.form-wrapper{background: white;display: flex;align-items: center;position: relative;padding: 30px;z-index: 2;width: 100%;}
.form-wrapper .form-title{font-size: 1.5vw;color: black;font-weight: bolder;margin-bottom: 15px;line-height: 1.2;text-align: center;}
.form-wrapper .fields{display: flex;flex-wrap: wrap;align-items: center;justify-content: space-between;}
.form-wrapper .field-wrapper{position: relative;padding-bottom: 15px;width: 100%;margin-bottom: 5px;}
.form-wrapper .field-wrapper.selection-elem{}
.form-wrapper .field-wrapper.selection-elem select{margin-bottom: 5px;-moz-appearance:none;-webkit-appearance:none;appearance:none;line-height: 1.4;position: relative;}
.form-wrapper .field-wrapper.checkbox-elem{width: 100%;max-width: 100%;min-width: 100%;margin-bottom: 25px;padding-bottom: 0;}
.form-wrapper .field-wrapper.phone-elem{display: flex; position: relative;}
.form-wrapper .field-wrapper.phone-elem .phone-prefix{width: 33%; margin-right: 5px;-moz-appearance:none;-webkit-appearance:none;appearance:none;}
.form-wrapper .field-wrapper.selection-elem::after{content: '';background: url('../img/select-arrow.png');width: 13px;height: 9px;position: absolute;left:15px;top: 16px;z-index: 2;display: block;pointer-events: none;}
/* .form-wrapper .field-wrapper.phone-elem::after */
.form-wrapper .field-wrapper.submit-elem{margin-bottom: 0;padding-bottom: 15px;margin-top: 0;}
.form-wrapper .field-wrapper .form-input{font-size: 20px;padding: 5px 8px;border-radius: 0;border:1px solid transparent;background: #d3d2d2;width: 100%;color: #737373;font-weight: lighter;margin-bottom: 5px;}
.form-wrapper .field-wrapper .form-input.has-error{border-color:red;}
.form-wrapper .field-wrapper .form-input.appended-select{display: none;}
.field-wrapper input::-webkit-input-placeholder{color:#737373; font-weight: lighter;}
.field-wrapper input:-ms-input-placeholder{color:#737373;font-weight: lighter;}
.field-wrapper input::placeholder{color:#737373;font-weight: lighter;}
.form-wrapper .field-wrapper .error-wrapper{position: absolute;bottom: 4px;right: 0;font-size: 12px;color:red;}
.form-wrapper .field-wrapper .submit-btn{background: #272727;border: none;height: 100%;min-width: 180px;padding: 12px;color: white;cursor: pointer;font: inherit;font-size: 2vw;font-weight: bold;display: flex;align-items: center;justify-content: center;margin: 0 auto;width: 100%;}
.form-wrapper .field-wrapper .submit-btn img{width: 15px;margin-right: 5px;margin-top: 3px;}

.form-wrapper .field-wrapper .custom-checkbox {display: block;position: relative;padding-right: 30px;cursor: pointer;font-size: 15px;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.form-wrapper .field-wrapper .custom-checkbox span.label{color:var(--darkblue);font-size: 18px;line-height: 1;}
.form-wrapper .field-wrapper .custom-checkbox input{position: absolute;opacity: 0;cursor: pointer;height: 0;width: 0;}
.form-wrapper .field-wrapper .custom-checkbox .checkmark{position: absolute;top: 0px;right: 0;height: 16px;width: 16px;background-color: transparent;border: 1px solid #051721;border-radius: 0;}
.form-wrapper .field-wrapper .custom-checkbox:hover input ~ .checkmark{background-color: white;}
.form-wrapper .field-wrapper .custom-checkbox input:checked ~ .checkmark{background-color: transparent;border: 1px solid #231f20;}
.form-wrapper .field-wrapper .custom-checkbox .checkmark:after {content: "";position: absolute;display: none;}
.form-wrapper .field-wrapper .custom-checkbox input:checked ~ .checkmark:after {display: block;}
.form-wrapper .field-wrapper .custom-checkbox .checkmark:after {left: 5px;top: 2px;width: 4px;height: 9px;border: solid #231f20;border-width: 0 2px 2px 0;-webkit-transform: rotate(45deg);-ms-transform: rotate(45deg);transform: rotate(45deg);}

.form-wrapper .inner-content{position: relative;padding-bottom: 5px;}
.form-wrapper #thanks{display: none; position: absolute; top:0; right: 0; width: 100%; height: 100%; z-index: 12;}
.form-wrapper.sent .form-title,
.form-wrapper.sent #lead_form
{visibility: hidden;}
.form-wrapper #thanks .form-title{font-size: 30px; display: block; visibility: visible;}
.form-wrapper.sent #thanks{display: flex;align-items: center;justify-content: center;padding: 20px;}



@media(max-width:1900px){
    .bottom-content{transform: translateY(-20%);}
}


@media(max-width:1800px){
    .content-col{padding-top: 15px;}
    .form-wrapper .form-title{font-size: 28px; margin-bottom: 15px;}
    .form-wrapper .field-wrapper{margin-bottom: 0;}
    .form-wrapper .field-wrapper .form-input{font-size: 18px; padding: 5px 10px;}
    .form-wrapper .field-wrapper.checkbox-elem{margin-bottom: 10px;}
    .form-wrapper .field-wrapper .custom-checkbox span.label{font-size: 15px; line-height: 1.2;}
    .form-wrapper .field-wrapper .error-wrapper{font-size: 10px;bottom: 8px; right: 0;} 

    .bottom-content p{font-size: 18px;}
    .bottom-content .right .txt{font-size: 20px;}
    .acess {width: 26px;max-width: 74px;display: block;left: -7%;bottom: -7%;display: inline-block;position: absolute;}
}


@media(max-width:1600px){
    
    h1.main-title{font-size: 1.55vw;line-height: 1.4;}
    h1.main-title span.large{font-size: 2.5vw;}
    .center h2.title{font-size: 24px;}
    .bottom-content .right{padding-right: 15px;padding-left: 15px;}
    .bottom-content .center{padding-bottom: 0;}
    .bottom-content p{font-size: 16px;}
    .bottom-content .right .txt{font-size: 16px;}

    .form-wrapper .form-title{font-size: 24px;}
    .form-wrapper .field-wrapper .form-input{font-size: 16px;}
    .form-wrapper .field-wrapper .custom-checkbox span.label{font-size: 14px;}
    .bottom-content{transform: translateY(-22%);}
}



@media(max-width:1400px){
    .content-col{padding-right: 15px;padding-top: 15px;}
    .center h2.title{font-size: 20px;}
    .bottom-content{transform: translateY(-16%);}
    .bottom-content p{font-size: 15px;}
    .bottom-content .right .logo-img{width: 120px;margin-top: 20px;}
    .form-wrapper .form-title{font-size: 16px;margin-bottom: 5px;}
    .form-wrapper .field-wrapper .form-input{font-size: 14px;padding: 2px 5px;}
    .form-wrapper .field-wrapper.selection-elem::after{top: 10px;width: 10px;background-size: contain;background-repeat: no-repeat;}
    .form-wrapper .field-wrapper .custom-checkbox span.label{font-size: 11px;}
    .form-wrapper .field-wrapper .submit-btn{font-size: 1.2vw;padding: 8px;}

}



@media(max-width:1200px){


    .main-content{position: relative;height: auto;overflow: initial;}


    .content-col{position: static;width: 100%;max-height: initial;padding: 0;display: block;border: none;padding-right: 15px;padding-left: 15px;}


    .form-wrapper{padding: 20px;background: white;width: 100%;max-width: 100%;display: block;}
    .form-wrapper .form-title{font-size: 28px;margin-bottom: 15px;text-align: center;}
    .form-wrapper .field-wrapper{margin-bottom: 7px;padding-bottom: 10px;}
    .form-wrapper .field-wrapper .form-input{font-size: 22px;}
    .form-wrapper .field-wrapper .custom-checkbox span.label{font-size: 16px;}
    /* .form-wrapper .field-wrapper.phone-elem::after{top:14px; left:10px;} */

    .bottom-content{transform: none;}
    .bottom-content .right,.bottom-content .left,.center h2.title{display: none;}
    .bottom-content .center{flex: 0 0 100%;max-width: 100%;text-align: center;padding: 25px 15px;}
    .bottom-content p{text-align:right;}

    .mobile-top .main-title{color:white;font-size: 24px;font-weight: bold;margin-bottom: 10px;}
    .mobile-top h1.main-title span.large{font-size: 30px;color: white;}
    .mobile-top .under-title{font-size: 20px;line-height: 1.5;margin-bottom: 15px;}

    .bottom-content p.bold{font-weight: normal;}

    .bottom-content p.txt {align-items: center; justify-content: center;}
    .bottom-content p.txt .bold{color:#00bff2;}
    .bottom-content p.txt .white-dots{width: 25px;}
}


@media(max-width:1200px) and (min-width: 991px){
    .form-wrapper .inner-content{width: 70%; margin-right: auto; margin-left: auto; padding-top: 25px; padding-bottom: 25px;}
    .form-wrapper .field-wrapper{margin-bottom: 15px;}
    .form-wrapper .field-wrapper .form-input{font-size: 24px; padding: 10px;}
    /* .form-wrapper .field-wrapper.phone-elem::after{top:24px;} */
    .form-wrapper .field-wrapper .error-wrapper{font-size: 14px; bottom: 0;}
}





@media(max-width:991px){
    .acess {width: 21px;max-width: 74px;display: block;left: -2%;bottom: -7%;display: inline-block;position: absolute;}
    .right-content{padding: 0;}



    .form-wrapper #lead_form{position: relative; z-index: 3;}
    .form-wrapper{padding: 20px;background: white;width: 100%;max-width: 100%;display: block;}
    .form-wrapper .form-title{font-size: 22px;margin-bottom: 15px;}
    .form-wrapper .field-wrapper{margin-bottom: 7px;padding-bottom: 10px;}
    .form-wrapper .field-wrapper .form-input{font-size: 17px;}
    .form-wrapper .field-wrapper .custom-checkbox span.label{font-size: 14px;}
    .form-wrapper .field-wrapper .error-wrapper{bottom: 0;right:0;font-size: 11px;}
    .form-wrapper .field-wrapper.submit-elem{margin-top: 0;}
    .form-wrapper .field-wrapper .submit-btn{font-size: 24px;}
    .form-wrapper #thanks .form-title{font-size: 22px;}
    .form-wrapper .field-wrapper.selection-elem::after{top: 14px;width: 10px;background-size: contain;background-repeat: no-repeat;}
    /* , .form-wrapper .field-wrapper.phone-elem::after */
}


@media(max-width:768px){
    .mobile-top .main-title{font-size: 15px;margin-bottom: 10px;}
    .mobile-top h1.main-title span.large{font-size: 25px;}
    .mobile-top .under-title{font-size: 17px;margin-bottom: 20px;}
    .bottom-content p{font-size: 15px;}
    .logo-img{width: 150px;}
    
}