@import url('https://fonts.googleapis.com/css2?family=Almarai:wght@300;400;700;800&display=swap');
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding:0;
}

body {
    margin: 0;
    padding:0;
    font-family: 'Almarai', sans-serif;
    font-size: 17px;
    text-align:right;
    font-weight: 400;
    color: #000;
    background-color: #f9d130;
}

.header {
background:#fff;
padding:10px 0;
float:right;
width:100%;
}

footer {
background:#fff;
padding-top:10px;
margin-top:20px;
float:right;
width:100%;
}


.footer_footer {
background:#666666;
padding:20px 0;
color:#fff;
float:right;
width:100%;
}

.footer_ended {
background:#424242;
padding:20px 0;
color:#fff;
float:right;
width:100%;
font-size:15px;
text-align:center;
}

.center_body {
width:100%;
float:right;
}

.cont {
width:100%;
max-width:1200px;
margin:0 auto;
padding-left:20px;
padding-right:20px;
}

.form_group p{
font-size:20px;
font-weight: 400;
}

.shafik_form {
    color:#fff;
    width:100%;
    padding:20px 40px;
    background: rgb(255,51,0);
    background: linear-gradient(200deg, rgba(255,51,0,1) 0%, rgba(255,85,0,1) 35%, rgba(255,132,0,1) 100%);
    border-radius:20px;
}

.shafik_form input {
    border:1px solid #f9d130;
    padding:10px 20px;
    width:100%;
    font-weight: 400;
    font-size:18px;
    font-family: 'Almarai', sans-serif;
    border-radius:10px;
    outline:none;
    margin-top:10px;
}

.shafik_form input[type=submit] {
    background:#f9d130;
    width:100%;
    height:60px;
    font-weight: 700;
    font-size:20px;
    font-family: 'Almarai', sans-serif;
    border-radius:10px;
    cursor:pointer;
    outline:none;
}

.shafik_form input[type=submit]:hover {
 background:#3399FF;
}

.mb20 {
    margin-bottom:20px;
}

/*====================== Desktop ========================*/
@media(min-width: 860px){

.header_right {
    width:50%;
    float:right;
}

.header_left {
    width:50%;
    float:left;
}

.body_right {
    width:60%;
    padding-top:40px;
    float:right;
}

.body_left {
    width:40%;
    float:left;
}


.header_left span {
    float:left;
    letter-spacing: 1px;
    border-radius:20px;
     color:#fff;
     font-size:20px;
     background:#FF3300;
     padding:8px 20px;
}

.shafik_form {
    border:2px solid #666666;
}


.sec_text_desk {
 color:#2835b8;
 font-size:22px;
 margin-bottom:20px;
 text-align:center;
 font-weight: 800;

}

h1 {
    text-align:right;
    color:#fff;
    padding-top:20px;
    font-size:55px;
    font-weight: 800;
}

.main_text {
color:#000;
padding-top:40px;
line-height:27px;
font-size:25px;
font-weight: 700;
}

.main_img img {
    margin-top:30px;
}

.extra_desktop {
font-size:18px;
line-height:25px;
padding-left:50px;
padding-top:20px;
}

.footer_txt_cmp li {
    float:right;
    max-width:300px;
    list-style:none;
    width:20%;
    margin-bottom:30px;
    margin-right:40px;
}

h4 {
    font-size:25px;
    font-weight: 800;
    padding-bottom:40px;
    padding-top:30px;
    text-align:center;
}

.footer_f_right {
    float:right;
    width:50%;
}
.footer_f_left {
    float:left;
    width:50%;
}

}




/*====================== Mobile ========================*/
@media(max-width: 860px){

.header_right {
    width:40%;
    float:right;
}

.header_left {
    width:60%;
    float:left;
}

.body_right {
    width:100%;
    padding-top:10px;
    margin-bottom:20px;
    float:right;
}

.body_left {
    width:100%;
    float:right;
}

.center_body {
    margin-top:15px;
}

.header_left span {
    float:left;
    letter-spacing: 0;
    border-radius:20px;
     color:#fff;
     font-size:20px;
     background:#FF3300;
     padding:8px 15px;
}


.sec_text_desk {
 color:#2835b8;
 font-size:25px;
 padding-bottom:20px;
 line-height:40px;
 text-align:center;
 font-weight: 800;

}

h1 {
    text-align:center;
    color:#fff;
    font-size:36px;
    font-weight: 800;
}

.main_text {
color:#000;
padding-top:20px;
line-height:30px;
font-size:22px;
font-weight: 700;
}

.extra_desktop {
    display:none;
}


h4 {
    font-size:22px;
    font-weight: 800;
    padding-bottom:30px;
    padding-top:20px;
    text-align:center;
}

.footer_txt_cmp li {
    float:right;
    list-style:none;
    margin-right:6%;
    margin-bottom:20px;
    width:40%;
}



.footer_f_right {
    float:right;
    width:100%;
}
.footer_f_left {
    float:left;
    width:100%;
}

}



.header_right img {
    height:40px;
}


.main_img img {
    width:100%;
    max-width:400px;
}

.body_right ul li {
     list-style: none;
     line-height:30px;
     margin-top:12px;
     font-size:20px;
     position: relative;
     padding: 0 35px 0 0;
}

.body_right ul li::before {
      content: "\f119";
      color:#00B800;
     font-family: flaticon !important;
     position: absolute;
     right: 2px;
}

.footer_txt_cmp p{

}


.footer_txt_cmp img{
width:100%;
}

.footer_f_right p{
font-size:18px;
padding-top:5px;
padding-bottom:5px;
}


.footer_f_left li {
    list-style:none;
    font-size:18px;
padding-top:5px;
text-align:right;
padding-bottom:5px;
}


.footer_f_left i {
    float:right;
    padding-left:20px;
}

.error {
    text-align:center;
        font-weight: 800 !important;
        font-size:16px !important;
        padding-top:20px;
}

#loading {
    text-align:center;
    font-size:22px;
}
#loading i {
    font-size:30px;
}

.final_success {
    text-align:center;
}

.final_success i{
color:#38E000;
font-size:80px;
}

.final_success p{
padding-bottom:30px;
}

.success_t {
color:#38E000;
font-size:30px;
font-weight: 800;
}