p,button,header,span,h1,h2,h3,h4,h5,h6,a{
    font-family: 'Cairo', sans-serif!important;
}
.section1,.section3{
    direction: rtl;
}
.section1 .div-btn button{
    margin-right: 0px;
    margin-left: 100px;
}
.section1 .div-img img{
    margin-right: 100px;
    margin-left: 0px;
}
.section1 .div-txt p,.section1 .div-txt a,
.section2 .div-txt header,
.section2 .div-txt p,
.section2 .div-feature-item p,
.section3 p{
    direction: rtl;
}
.section2 .div-feature-item{
    direction: rtl;
}
.section3 .dev-footer{
    float: left!important;
}
.section3 p,.section3 header{
    text-align: right!important;
}
/* responsive */
/* responsive */
/* lg screen */
@media (max-width: 1200px) {
    
}
/* md screen */
@media (max-width: 992px) {
    .section1 .div-img img{
        margin-right:10px;
    }
    .section1 .div-btn button{
        margin-left:10px;
    }
    .section1 .div-txt p{
        width: 70%;
    }
    .section2 .div-txt header{
        margin-top: 10px;
    }
    .section2 .div-feature-item p{
        padding-right: 2px;
        font-size: 17px;
    }
    
}
/* sm screen */
@media (max-width: 768px) {
    .section1 .div-txt p{
        width: 100%;
        margin: 110px auto;
        font-size: 30px;
    }
    .section1 .div-txt a{
        width: 200px;
        height: 60px;
        padding: 12px;
        font-size: 20px;
    }
    .section3 header{
        margin-top: 50px;
    }
}
/* xs screen */
@media (max-width: 576px) {
    .section1 .div-img img{
        width: 140px;
    }
    .section1 .btn-lang{
        width: 100px;
        height: 40.3px;
    }
    .section2 .div-txt header{
        font-size: 26px;
    }
    .section2 .div-txt p{
        width: 100%;
        font-size: 20px;
    }
    .section3 p,.section3 header{
        font-size: 16px;
    }
    
}