@import url(fonts.css);
@import url(grid.css);
@import url(global.css);
@import url(header.css);
.white-box{
    background: #FFFFFF;
    box-shadow: 0px 2px 90px 30px rgba(0, 0, 0, 0.05);
    border-radius: 30px;
    padding: 40px;
}
.page-title {
    color: var(--color-green-primary);
    font-weight: 600;
    position: relative;
    margin-bottom: 60px;
}

.page-title::before {
    content: " ";
    width: 300px;
    display: inline-block;
    position: absolute;
    bottom: -17px;
    height: 4px;
}
.rtl .page-title::before{
    right: 0;
    background: linear-gradient(to right, #08B30300, #08B30385, #08B303);
}
.ltr .page-title::before{
    left: 0;
    background: linear-gradient(to left, #08B30300, #08B30385, #08B303);
}

.form__container{
    background-color: var(--color-green-primary);
    padding: 20px;
    border-radius: 30px;
}
.form__lable{
    color: var(--color-green-primary);
}
.rtl .form__lable{
    margin-left: 7px;
}
.ltr .form__lable{
    margin-right: 7px;
}
.form__input{
    height: 50px;
    background-color: #F5F5F5;
    border-radius: 50px;
    border: none;
    flex-grow: 1;
    padding: 0 20px;
    display: block;
    width: 100%;
    font-size: var(--font-size-2);
}
.form__textarea{
    width: 100%;
    height: 200px;
    border-radius: 30px;
    resize: none;
    padding: 20px;
}
.form__title{
    color: var(--color-green-primary);
    color: #fff;
    font-weight: 500;
    font-size: 22px;
    margin-bottom: 20px;
}

.form__select{
    appearance: none;
    font-size: var(--font-size-2);
    color: inherit;
        background-image: url("data:image/svg+xml,%3Csvg width='10' height='7' viewBox='0 0 10 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.53033 0.96967C9.82322 1.26256 9.82322 1.73744 9.53033 2.03033L5.53033 6.03033C5.23744 6.32322 4.76256 6.32322 4.46967 6.03033L0.46967 2.03033C0.176777 1.73744 0.176777 1.26256 0.46967 0.96967C0.762563 0.676777 1.23744 0.676777 1.53033 0.96967L5 4.43934L8.46967 0.96967C8.76256 0.676777 9.23744 0.676777 9.53033 0.96967Z' fill='%2308B303'/%3E%3C/svg%3E");
       background-repeat: no-repeat;
      
        transition: all 0.3s;
}
.rtl .form__select{
    background-position: 10px center;
}
.ltr .form__select{
    background-position: 95% center;
}
.contact__section-title{
    font-size: var(--font-size-4);
    font-weight: 500;
}
.form__select:focus-visible{
   outline: 0;
}
.form__textarea{
    min-height: 180px;
    resize: none;
}

.checkbox__lable {
    font-family: var(--font-yekan-regular);
    font-size: 18px;
    color: #fff;
    position: relative;
    margin-right: 5px;
    bottom: 2px;
    display: table;
    margin: auto;
    user-select: none;
}
.checkbox__lable::before {
    content: " ";
    width: 15px;
    height: 15px;
    border-radius: 5px;
    border: 2px solid #fff;
    z-index: 3;
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px;

}
.checkbox1{
    opacity: 0;
    visibility: hidden;
}
.checkbox1:checked~ .checkbox__lable::before{
    background-color: #fff;

        background-image: url("data:image/svg+xml,%3Csvg width='19' height='19' viewBox='0 0 19 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M14.274 6.30933C14.5059 6.5412 14.5059 6.91714 14.274 7.14902L8.73236 12.6907C8.50048 12.9226 8.12454 12.9226 7.89267 12.6907L4.726 9.52402C4.49413 9.29214 4.49413 8.9162 4.726 8.68433C4.95787 8.45245 5.33381 8.45245 5.56569 8.68433L8.31251 11.4311L13.4343 6.30933C13.6662 6.07745 14.0422 6.07745 14.274 6.30933Z' fill='%23189DB4'/%3E%3C/svg%3E");
    
        background-position: center;
        background-repeat: no-repeat;
    
}
.form__btn{
    margin: auto;
    background-color: #fff;
    margin-top: 16px;
    border: none;
    color: var(--color-green-primary);
    font-size: 18px;
    font-family: var(--font-medium);
    cursor: pointer;

}
.form__input::placeholder{
    font-size: var(--font-size-2);
}

.main-btn {
    padding: 10px 20px;
    border-radius: 15px;
    border: 0;
    font-family: inherit;
    margin-left: auto;
    margin-right: auto;
    display: table;
    font-size: var(--font-size-2);
    font-weight: 300;
}
.row__content{
    font-size: var(--font-size-3);
    color: var(--color-blue-1);
}
.row__title{
    font-family: var(--font-medium);
    font-size: 18px;
}
.contact__section-row{
    align-items: flex-start;
}
.contact__section-row svg{
    flex-shrink: 0;
}

@media only screen and (max-width:768px){
    .contact__section-row{
        justify-content: center;
        text-align: center;
    }
    .contact__section-row p:first-child{
        justify-content: center;
    }
}
@media only screen and (max-width:576px){
    .contact__section-row{
        flex-direction: column;
    }
    .white-box{
        padding: 30px 10px;
    }
    .checkbox__lable{
        font-size: 16px;
    }
    .contact__section-row{
        justify-content: center;
        text-align: center;
    }
    .contact__section-row p:first-child{
        justify-content: center;
    }
    .page-title::before{
        width: 200px;
    }
    .page-title{
        font-size: var(--font-size-3);
    }
    .form__container{
        padding: 10px;
    }
}
.alert {
    font-size: 12px;
    position: relative;
    padding: .75rem 1.25rem;
    margin-bottom: 1rem;
    border: 1px solid transparent;
    border-radius: .25rem;
}

.alert-success {
    background: #28a745;
    color: white;
}

.alert-error {
    background: #ee264f;
    color: white;
}

.text-danger {
    color: red;
    /* flex-basis: 100%; */
    position: absolute;
    top: 100%;
    font-size: 11px;
    /* left: 0; */
    right: 126px;
}
