@media screen  and (max-width: 10000px){


    section{

        padding: 100px 18%;

     }





         @font-face {
  font-family: 'Al-Fatihah';
  src: url('UthmanicHafs_V22.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}


.Al-Fatihah {
  font-family: 'Al-Fatihah', sans-serif;
}
#font{

     display: flex;
    position: absolute;
  font-size: xxx-large;


}


.themenu{
    display: flex;
    position: absolute;
    width: 150px;
    height: 400px;
    top: 61px;
    left: 151px;

}

.clicc{
    display: flex;
    position: absolute;
color: #ffffff;
right: 67px;
top: -30px;
font-size: 21px;
transition: .3s all ease;
}

.clicc:hover{
   color: #d77c1b;
   font-size: x-large;
   transition: .3s all ease;
}

.material-symbols-outlined {

     display: flex;
    position: absolute;
    left: 39px;
    /* top: ; */
    width: 11px;
    height: 11px;

}


.option{
    position: absolute;
   background-color: #d77c1b;
    width: 121px;
    height: 261px;
    border-radius: 11px;
    display: none;

}



.option.open{
display: block;
}


.option li{
list-style: none;
padding: 11px 11px;

}


.option li a{
   display: flex;
    right: 67px;
    top: -30px;
    text-decoration: none;
    margin-bottom: -5px;
    color: #ffffff;
    font-size: 23px; 
    transition: .2s all ease;


}


.option li a:hover{
   display: flex;
    right: 67px;
    top: -30px;
    text-decoration: none;
    margin-bottom: -5px;
    font-size: 23px; 
    color: #333;
    transition: .2s all ease;


}


/* الصفحة الرئيسية */  
    


.pdf{
    display: flex;
    position: absolute;
    float: right;
    height: 30px;
    right: 850px;
    top: 34px;
    font-size: larger;
    color: #ffffff;
    line-height: 30px; 
     text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */

}

.pdf:hover{
    display: flex;
    display: inline-block;
    color: #d77c1b!important;   /* لون الخط */
    height: 30px;
    right: 850px;
    top: 34px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgba(215, 124, 27,);   /* هنا اطراف الزر */
    color: rgba(215, 124, 27,);   /* لون الخط */

    
}

   
p211{
    font-size: xxx-large;
    
    }
    
    .al9ba7{
        display: flex;
        position: absolute;
        min-width: 90em; /* تمديد الزر */
        height:810px;
        right: 230px;
        top: 270px;
        border-radius: 20px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
        /* text-decoration: none; يخلي الكلام بدون الخط الي تحت الكلام */ 
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    
    }
    
    .al9ba7n{
        display: flex;
        position: absolute;
        right: 611px;
        top: 411px;
    
    }
    



      
.menu1{
    display: flex;
    position: absolute;
    width: 60%;
    color: #fff;
    height: 60px;
    top: 1px;
    left: 671px;
}

.menu1 #logo11{
    float: left;
    height: 30px;
    padding: 15px 30px;
    font-size: 1.2em;
    line-height: 30px;
}

.menu1 > ul{
    margin: 0;
    padding: 0;
    float: left;
    list-style-type: none;
}

.menu1 > ul > li{
    float: left;
}

.menu1-item{
    display: inline-block;
    padding: 15px 30px;
    height: 30px;
    line-height: 30px;
    color: #fff;
    text-decoration: none;

}

.menu1-item:hover{
    height: 50px;
    background-color: #d77c1b;
    }

    .sub-contect{
    position: absolute;
    top: 70px;
    width: 206px;
    overflow: hidden;
    background-color: #d77c1b;
    color: #fff;
    max-height: 0;

    }

    .sub-contect a{
    color: #fff;
    text-decoration: none;
    padding: 30px 20px;
        }

        .sub-drop{
    padding: 0;
        }

    .sub-drop ul{
        width: 100px;
        padding: 0;
        margin: 0;
        list-style-type: none;

            }

    .sub-drop ul li a{
        display: inline-block;
        padding: 10px 20px;


        }

    .sub-drop ul li:hover{
        background-color: #d77c1b;
        }

    .menu1-item:focus{
        background-color: #d77c1b;
        }     
        
        .menu1 ul li:hover .sub-contect{
            max-height: 1000px;
            transition: max-height 0.3s ease-in;
           -webkit-transition: max-height 0.3s ease-in;
           -moz-transition: max-height 0.3s ease-in;
            }  


            .audio{
                display: flex;
                position: absolute;
                width: 500px;
                font-size: xx-large;
                height: 75px;
                color: #fff;
                right: 610px;
                top: 560px;
                border-radius: 7px;
        
                
             }
        
        
             .logooo{
                display: flex;
                position: absolute;
                width: 500px;
                font-size: xx-large;
                height: 75px;
                color: #fff;
                right: 610px;
                top: 270px;
                border-radius: 7px;
                
        
                
             }
        
             .qurann{
                display: flex;
                position: absolute;
                width: 500px;
                font-size: xx-large;
                height: 75px;
                color: #fff;
                right: 590px;
                top: 50px;
                border-radius: 7px;
             }
        
             
             .qurannn{
                display: flex;
                position: absolute;
                width: 500px;
                font-size: xx-large;
                height: 75px;
                color: #fff;
                right: 610px;
                top: 210px;
                border-radius: 7px;
             }
        
            /*تنسيق العنوان*/
            h1{
                text-align: center;
                padding: 16px;
                
            }
            
            
            h2{
                text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
                color: #ffffff !important;   /* لون الخط */
            }
            /*القائمة مغلقة*/
            .menu{
                position: relative;
                float: left;
                /**/ left: -290px;
                width: 260px;
                height: 100vh;
                background-color: rgb(199, 199, 199, 80%);
                color: white;
                z-index: 999;
                transition: all .5s;   
            }
          


.tfsyyr{
    display: flex;
    position: absolute;
    float: right;
    height: 30px;
    right: 700px;
    top: 34px;
    font-size: larger;
    color: #ffffff;
    line-height: 30px; 
     text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */

}

.tfsyyr:hover{
    display: flex;
    display: inline-block;
    color: #d77c1b!important;   /* لون الخط */
    background-color: rgba(215, 124, 27,);
    height: 30px;
    right: 700px;
    top: 34px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgba(215, 124, 27,);   /* هنا اطراف الزر */
    color: rgba(215, 124, 27,);   /* لون الخط */

    
}



.ktt{
        display: flex;
        position: absolute;
        width: 900px;
        height: 80px;
        background-color:rgba(0, 0, 0, 0.151);
        right: 500px;
        top: 8px;
        border-radius: 1px;

}
.logo1{
    display: flex;
    position: absolute;
    float: right;
    height: 30px;
    right: 210px;
    top: -10px;
    font-size: larger;
    color: #ffffff;
    line-height: 30px;
    
}

 .logo123{

    display: flex;
    position: absolute;
    height: 30px;
    right: 46px;
    top: -25px;
    font-size: larger;
    color: #ffffff;
    line-height: 30px;


} 

.text{
     display: flex;
    position: absolute;
    width: 111px;
    height: 11px;
    right: 100px;
    top: -30px;
    border-radius: 7px;

}

.button{
   display: flex;
    position: absolute;
    display: inline-block;
    padding: 15px 20px;
    height: 30px;
    width: 200px;
    top: -10px;
    right: 190px;
    font-size: small;
    line-height: 30px;
    color: #fff;
    text-decoration: none;
    
} 


.button:hover{
    display: flex;
    display: inline-block;
    color: #d77c1b!important;   /* لون الخط */
    background-color: rgba(215, 124, 27,);
    min-width: 6em; /* تمديد الزر */
    height: 30px;
    width: 200px;
    top: -10px;
    right: 200px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgba(215, 124, 27,);   /* هنا اطراف الزر */
    color: rgba(215, 124, 27,);   /* لون الخط */
    display: inline-block;
    font-weight: 100;
    line-height: -1em; /* تحريك الخط */
     
 } 


.major{
    width: 1900px;
    height: 85px;
    right: -111px;
    top: -9px;
    background-color:rgb(36, 36, 36);
    
}

.major1{
    width: 1900px;
    height: 8px;
    right: -111px;
    top: 1px;
    background-color:rgb(24, 24, 24);
    
}




.almarai-button11{
    display: flex;

}



.almarai-button1 {
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 370px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;
    /* text-decoration: none; يخلي الكلام بدون الخط الي تحت الكلام */ 
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */

}


.almarai-button1:hover{
    flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);


}



.almarai-button2{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 370px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;
    

}

.almarai-button2:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button3{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 740px;
    top: 370px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button3:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button4{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 885px;
    top: 370px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button4:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}




.almarai-button5{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1020px;
    top: 370px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button5:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button6{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 370px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button6:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button7{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1300px;
    top: 370px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button7:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button8{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 480px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button8:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button9{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 480px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button9:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button10{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 740px;
    top: 480px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button10:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button11{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 880px;
    top: 480px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button11:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button12{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1020px;
    top: 480px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button12:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button13{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 480px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button13:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button14{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1300px;
    top: 480px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button14:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button15{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 590px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button15:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button16{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 590px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button16:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button17{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 740px;
    top: 590px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button17:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button18{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 880px;
    top: 590px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button18:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button19{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1020px;
    top: 590px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button19:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}




.almarai-button20{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 590px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button20:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button21{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1300px;
    top: 590px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button21:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button22{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button22:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button23{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button23:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button24{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 740px;
    top: 700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button24:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button25{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 880px;
    top: 700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button25:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button26{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1020px;
    top: 700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button26:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button27{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button27:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button28{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1300px;
    top: 700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button28:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button29{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button29:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button30{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 613px;
    top: 800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button30:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button31{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 753px;
    top: 800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button31:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button32{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 894px;
    top: 800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button32:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button33{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1037px;
    top: 800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button33:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}




.almarai-button34{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1175px;
    top: 800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button34:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button35{
    display: flex;
    position: absolute;
    min-width: 7.6em; /* تمديد الزر */
    height: 50px;
    right: 1310px;
    top: 800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button35:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button36{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button36:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button37{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button37:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button38{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 748px;
    top: 900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button38:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button39{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 888px;
    top: 900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button39:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button40{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1030px;
    top: 900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button40:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button41{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1169px;
    top: 900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button41:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button42{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1304px;
    top: 900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button42:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button43{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 1000px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button43:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button44{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 1000px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button44:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button45{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 740px;
    top: 1000px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button45:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button46{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 880px;
    top: 1000px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button46:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button47{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1020px;
    top: 1000px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button47:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button48{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 1000px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button48:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}




.almarai-button49{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1300px;
    top: 1000px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button49:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button50{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 1100px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button50:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button51{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 1100px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button51:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button52{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 740px;
    top: 1100px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button52:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button53{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 880px;
    top: 1100px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button53:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button54{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1020px;
    top: 1100px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button54:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button55{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 1100px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button55:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button56{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1300px;
    top: 1100px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button56:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button57{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 1200px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button57:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button58{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 1200px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button58:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button59{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 745px;
    top: 1200px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button59:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button60{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 880px;
    top: 1200px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button60:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button61{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1020px;
    top: 1200px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button61:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button62{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 1200px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button62:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}




.almarai-button63{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1300px;
    top: 1200px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button63:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button64{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 1300px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button64:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button65{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 1300px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button65:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button66{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 740px;
    top: 1300px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button66:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button67{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 880px;
    top: 1300px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button67:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button68{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1020px;
    top: 1300px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button68:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button69{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 1300px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button69:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button70{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1300px;
    top: 1300px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button70:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button71{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 1400px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button71:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button72{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 1400px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button72:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button73{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 740px;
    top: 1400px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button73:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button74{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 880px;
    top: 1400px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button74:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button75{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1020px;
    top: 1400px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button75:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button76{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 1400px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button76:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button77{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1300px;
    top: 1400px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button77:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}




.almarai-button78{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 1500px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button78:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button79{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 1500px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button79:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button80{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 740px;
    top: 1500px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button80:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button81{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 880px;
    top: 1500px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button81:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button82{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1020px;
    top: 1500px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button82:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button83{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 1500px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button83:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button84{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1320px;
    top: 1500px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button84:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button85{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 1600px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button85:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button86{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 1600px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button86:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button87{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 740px;
    top: 1600px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button87:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button88{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 880px;
    top: 1600px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button88:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button89{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1020px;
    top: 1600px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button89:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button90{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 1600px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button90:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button91{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1300px;
    top: 1600px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button91:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}




.almarai-button92{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 1700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button92:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button93{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 1700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button93:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button94{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 740px;
    top: 1700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button94:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button95{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 880px;
    top: 1700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button95:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button96{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1020px;
    top: 1700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button96:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button97{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 1700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button97:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button98{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1300px;
    top: 1700px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button98:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button99{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 1800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button99:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button100{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 1800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button100:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button101{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 740px;
    top: 1800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button101:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button102{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 880px;
    top: 1800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button102:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button103{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1020px;
    top: 1800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button103:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button104{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 1800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button104:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button105{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1300px;
    top: 1800px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button105:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button106{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 460px;
    top: 1900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button106:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}




.almarai-button107{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 600px;
    top: 1900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button107:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button108{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 738px;
    top: 1900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button108:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}


.almarai-button109{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 875px;
    top: 1900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}


.almarai-button109:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button110{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right:  1020px;
    top: 1900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button110:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button111{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 1160px;
    top: 1900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button111:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button112{
    display: flex;
    position: absolute;
    min-width: 8em; /* تمديد الزر */
    height: 50px;
    right: 1300px;
    top: 1900px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button112:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button113{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 790px;
    top: 2000px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button113:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}

.almarai-button114{
    display: flex;
    position: absolute;
    min-width: 6em; /* تمديد الزر */
    height: 50px;
    right: 930px;
    top: 2000px;
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    margin-left: 10px;
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
    color: #ffffff !important;   /* لون الخط */
    display: inline-block;
    font-weight: 800;
    line-height: 3.5em; /* تحريك الخط */
    padding: .9rem;
    margin-bottom: 15px;
    text-align: center;

}

.almarai-button114:hover{
     flex: 2px;
    color: #000000 !important;   /* لون الخط */
    background-color: rgb(255, 255, 255);
}



.almarai-light,p2 {
    font-family: "Almarai", sans-serif;
    font-weight: 300;
    font-style: normal;
  }
  
  .almarai-regular,p2 {
    font-family: "Almarai", sans-serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .almarai-bold,p2 {
    font-family: "Almarai", sans-serif;
    font-weight: 700;
    font-style: normal;
  }
  
  
.quran{
    display: flex;
    position: absolute;
    width: 700px;
    font-size: xx-large;
    height: 75px;
    color: #fff;
    right: 410px;
    top: 90px;
    border-radius: 7px;

}

.quran2{
    display: flex;
    position: absolute;
    width: 1000px;
    font-size: xx-large;
    height: 75px;
    right: 300px;
    top: 130px;
    border-radius: 7px;

}




.quran22{
    display: flex;
    position: absolute;
    width: 1000px;
    font-size: xx-large;
    height: 75px;
    right: 300px;
    top: 330px;
    border-radius: 7px;

}

.quran1{
    display: flex;
    position: absolute;
    width: 500px;
    color: #fff;
    height: 75px;
    right: 580px; 
    top: 250px;
    font-size: x-large;
    border-radius: 7px;

}

.almarai-light,h1 {
    font-family: "Almarai", sans-serif;
    font-weight: 300;
    font-style: normal;
  }
  
  .almarai-regular,h1 {
    font-family: "Almarai", sans-serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .almarai-bold,h1 {
    font-family: "Almarai", sans-serif;
    font-weight: 700;
    font-style: normal;
  }
  
  .almarai-extrabold,h1 {
    font-family: "Almarai", sans-serif;
    font-weight: 800;
    font-style: normal;
  }

::selection {
    background-color: rgba(215, 124, 27);
    color: #fff;

}

/* سورة الفاتحة */



.textf{
    display: flex;
    position: absolute;
    width: 111px;
    height: 11px;
    right: 100px;
    top: -30px;
    border-radius: 7px;

}

.buttonf{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    background-color:rgba(0, 0, 0, 0.151);
    right: 500px;
    top: 8px;
    border-radius: 7px;
}


.majorf{
    display: flex;
    width: 1888px;
    height: 75px;
 /*    right: 1px;
    top: 1px; */
    background-color:rgb(31, 121, 14);
    border-radius: 9px;
    
}

.amiri-regular,qq {
    font-family: "Amiri", serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .amiri-bold,qq {
    font-family: "Amiri", serif;
    font-weight: 700;
    font-style: normal;
  }
  
  .amiri-regular-italic,qq {
    font-family: "Amiri", serif;
    font-weight: 400;
    font-style: italic;
  }
  
  .amiri-bold-italic,qq {
    font-family: "Amiri", serif;
    font-weight: 700;
    font-style: italic;
    
  }













  .ibm-plex-sans-arabic-thin,h1 {
    font-family: "IBM Plex Sans Arabic", sans-serif;
    font-weight: 100;
    font-style: normal;
  }
  
  .ibm-plex-sans-arabic-extralight,h1 {
    font-family: "IBM Plex Sans Arabic", sans-serif;
    font-weight: 200;
    font-style: normal;
  }
  
  .ibm-plex-sans-arabic-light,h1 {
    font-family: "IBM Plex Sans Arabic", sans-serif;
    font-weight: 300;
    font-style: normal;
  }
  
  .ibm-plex-sans-arabic-regular,h1 {
    font-family: "IBM Plex Sans Arabic", sans-serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .ibm-plex-sans-arabic-medium,h1 {
    font-family: "IBM Plex Sans Arabic", sans-serif;
    font-weight: 500;
    font-style: normal;
  }
  
  .ibm-plex-sans-arabic-semibold,h1 {
    font-family: "IBM Plex Sans Arabic", sans-serif;
    font-weight: 600;
    font-style: normal;
  }
  
  .ibm-plex-sans-arabic-bold,h1 {
    font-family: "IBM Plex Sans Arabic", sans-serif;
    font-weight: 700;
    font-style: normal;
  }
  
  





  .quran11{
    display: flex;
    position: absolute;
    width: 600px;
    height: 75px;
    right: 520px;
    color: #ffffffe5;
    top: 310px;
    border-radius: 7px;
     text-transform: uppercase !important;
     font-size: xx-large;
  }

.Al-Fatihah{
    display: flex;
    position: absolute;
    width: 1200px;
    height: 75px;
    color: #ffffffd8;
    right: 340px;
    top: 430px;
    font-size: xx-large;
    line-height: 99px;

}

.Al-Fatihah1{

    display: flex;
    position: absolute;
    width: 1200px;
    height: 75px;
    color: #ffffffd8;
    right: 340px;
    top: 14630px;
    font-size: xx-large;
}


/* .amiri-regular,q {
    font-family: "Amiri", serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .amiri-bold,q {
    font-family: "Amiri", serif;
    font-weight: 700;
    font-style: normal;
  }
  
  .amiri-regular-italic,q {
    font-family: "Amiri", serif;
    font-weight: 400;
    font-style: italic;
  }
  
  .amiri-bold-italic,q {
    font-family: "Amiri", serif;
    font-weight: 700;
    font-style: italic;
  } */





.menu{
    padding: 5px 10px;
    color: #333;
    transition: 0.3s;
    display: block;
    font-size: 12px;
    text-transform: none;
}
.line3{

    display: flex;
    position: absolute;
    height: 30px;
    right: 51111px;
    top: 7px;
    font-size: larger;
    color: #ffffff;
    line-height: 30px;

}




.quran134{
    display: flex;
    position: absolute;
    width: 500px;
    font-size: xx-large;
    height: 75px;
    color: #fff;
    right: 530px;
    top: 110px;
    border-radius: 7px;

}

.madyna1{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    right: 70px;
    top: 300px;
    color: #fff;
    border-radius: 7px;


}

.madyna{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    right: 600px;
    color: #fff;
    top: 600px;
    font-size: large;
}

.madyna11{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    color: #fff;
    right: 600px;
    top: 400px;
    font-size: x-large;
}

.madyna11:hover{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    color: #fff;
    right: 600px;
    top: 400px;
    font-size: x-large;
    display: flex;
    display: inline-block;
    color: #d77c1b!important;   /* لون الخط */
    background-color: rgba(215, 124, 27,);
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgba(215, 124, 27,);   /* هنا اطراف الزر */
    color: rgba(215, 124, 27,);   /* لون الخط */
}



.madyna2{
    display: flex;
    position: absolute;
    width: 500px;
    color: #fff;
    height: 75px;
    right: 30px;
    top: 900px;

}

.madyna22{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    color: #fff;
    right: 560px;
    top: 1000px;
    font-size: x-large;
}

.madyna22:hover{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    right: 560px;
    top: 1000px;
    font-size: x-large;
    display: flex;
    display: inline-block;
    color: #d77c1b!important;   /* لون الخط */
    background-color: rgba(215, 124, 27,);
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgba(215, 124, 27,);   /* هنا اطراف الزر */
    color: rgba(215, 124, 27,);   /* لون الخط */
}

.madyna21{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    color: #fff;
    right: 580px;
    top: 1200px;
    font-size: large;
}




.tgued1{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    right: 30px;
    color: #fff;
    top: 1550px;

}

.tgued11{
    display: flex;
    position: absolute;
    width: 500px;
    color: #fff;
    height: 75px;
    right: 560px;
    top: 1600px;
    font-size: x-large;
}

.tgued11:hover{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    color: #fff;
    right: 560px;
    top: 1600px;
    font-size: x-large;
    display: flex;
    display: inline-block;
    color: #d77c1b!important;   /* لون الخط */
    background-color: rgba(215, 124, 27,);
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgba(215, 124, 27,);   /* هنا اطراف الزر */
    color: rgba(215, 124, 27,);   /* لون الخط */
}

.tgued{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    color: #fff;
    right: 580px;
    top: 1800px;
    font-size: large;
}






.bacstan1{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    color: #fff;
    right: 60px;
    top: 2050px;

}

.bacstan11{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    color: #fff;
    right: 590px;
    top: 2200px;
    font-size: x-large;
}

.bacstan11:hover{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    right: 590px;
    color: #fff;
    top: 2200px;
    font-size: x-large;
    display: flex;
    display: inline-block;
    color: #d77c1b!important;   /* لون الخط */
    background-color: rgba(215, 124, 27,);
    border-radius: 10px; /* مقدار حده زوايا البورد  */
    text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    transition: .3s all ease;
    border: solid 1px rgba(215, 124, 27,);   /* هنا اطراف الزر */
    color: rgba(215, 124, 27,);   /* لون الخط */
}

.bacstan{
    display: flex;
    position: absolute;
    width: 500px;
    height: 75px;
    color: #fff;
    right: 580px;
    top: 2400px;
    font-size: large;
}


.abnkthyr{
    display: flex;
    position: absolute;
    width: 900px;
    height: 75px;
    color: #000000;
    color: #fff;
    right: 590px;
    top: 600px;
    font-size: smaller;
}




/* ------------------------------------ */
.sub1 {
    display: flex;
    position: absolute;
    top: 100px;
    background-color:rgb(36, 36, 36);
    max-height: 0;
    }

    .sub1 h3{ 
    color: #ffffff;
    text-decoration: none;

    }

    .sub {
     padding: 0;

    }



    .sub ul {
    width: 100%;
    padding: 0;
    margin: 0;
    list-style-type: none;

    }

    .sub ul li a h3 {
        display: inline-block;
        padding: 0px 30px ;

        }

        .sub ul li:hover {
            display: inline-block;
            padding: 0px 22px ;
            background-color: rgba(215, 124, 27);

          }



          .language1{
            display: flex;
           position: absolute;
           float: right;
           height: 30px;
           right: 1760px;
           top: 34px;
           font-size: larger;
           color: #ffffff;
           line-height: 30px; 
            text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
       }

    .language1:focus ~ .sub1{
        max-height: 500px;
        transition: max-height 0.4s ease-in;
        -webkit-transition: max-height 0.4s ease-in;
        -moz-transition: max-height 0.4s ease-in;
    }


    .language1:hover{
        display: flex;
        display: inline-block;
        color: #d77c1b!important;   /* / لون الخط / */
        background-color: rgba(215, 124, 27,);
        height: 30px;
        right: 1760px;
        top: 34px;
        text-decoration: none; /* / يخلي الكلام بدون الخط الي تحت الكلام  / */
        transition: .3s all ease;
        border: solid 1px rgba(215, 124, 27,);   /* / هنا اطراف الزر / */
        color: rgba(215, 124, 27,);   /* لون الخط */



    }




label{
   
    color: #24c468;

}

b {
    font-weight: 500;
    color: #ec202f;
}



       :root{

        --h1-font: 2,1rem;
    }

}

@media screen  and (max-width: 600px){

    section{
    
       padding: 100px 18%;
    
    }
        
    .quran{
        display: flex;
        position: absolute;
        width: 320px;
        font-size: x-large;
        height: 75px;
        right:  10px;
        top: 90px;
    
    }
    
    .quran1{
        display: flex;
        position: absolute;
        width: 310px;
        color: #fff;
        height: 75px;
        right: -11px; 
        top: 220px;
        font-size: x-large;
        border-radius: 7px;
    
    }
    
    .logo123{
    
        display: flex;
        position: absolute;
        height: 30px;
        right: 20px; 
        top: -30px;
        font-size: larger;
        color: #ffffff;
        line-height: 30px;
    
    
    }
    
    .text{
        display: flex;
       position: absolute;
       width: 111px;
       height: 11px;
       right: 60px;
       top: -30px;
       border-radius: 7px;
    
    }
    
    
    .line3{
    
        display: flex;
        position: absolute;
        height: 30px;
        right: 5px;
        top: 7px;
        font-size: larger;
        color: #ffffff;
        line-height: 30px;
    
    }
    
    .logo1{
        display: flex;
        position: absolute;
        float: right;
        height: 30px;
        right: 170px;
        top: -10px;
        font-size: medium;
        color: #ffffffdc;
        line-height: 30px;
    }
    
        
.menu1{
    display: flex;
    position: absolute;
    width: 60%;
    color: #fff;
    height: 60px;
    top: -511px;
    left: 171px;

}

.menu1 #logo11{
    float: left;
    height: 30px;
    padding: 15px 30px;
    font-size: 1.2em;
    line-height: 30px;
}

.menu1 > ul{
    margin: 0;
    padding: 0;
    float: left;
    list-style-type: none;
}

.menu1 > ul > li{
    float: left;
}

.menu1-item{
    display: inline-block;
    padding: 15px 30px;
    height: 30px;
    line-height: 30px;
    color: #fff;
    text-decoration: none;

}

.menu1-item:hover{
    height: 50px;
    background-color: #d77c1b;
    }

    .sub-contect{
    position: absolute;
    top: 70px;
    width: 206px;
    overflow: hidden;
    background-color: #d77c1b;
    color: #fff;
    max-height: 0;

    }

    .sub-contect a{
    color: #fff;
    text-decoration: none;
    padding: 30px 20px;
        }

        .sub-drop{
    padding: 0;
        }

    .sub-drop ul{
        width: 100px;
        padding: 0;
        margin: 0;
        list-style-type: none;

            }

    .sub-drop ul li a{
        display: inline-block;
        padding: 10px 20px;


        }

    .sub-drop ul li:hover{
        background-color: #d77c1b;
        }

    .menu1-item:focus{
        background-color: #d77c1b;
        }     
        
        .menu1 ul li:hover .sub-contect{
            max-height: 1000px;
            transition: max-height 0.3s ease-in;
           -webkit-transition: max-height 0.3s ease-in;
           -moz-transition: max-height 0.3s ease-in;
            }  

    .major{
         display: flex;
        position: absolute;
        width: 520px;
        height: 85px;
        right: -1px;
        top: -1px;
        background-color:rgb(36, 36, 36);
    
    }
    
    .major1{
        width: 100px;
        height: 8px;
        right: -111px;
        top: 1px;
        background-color:rgb(24, 24, 24);
        
    }
    
    .almarai-button1 {
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 310px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
        /* text-decoration: none; يخلي الكلام بدون الخط الي تحت الكلام */ 
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
    
    }
    
    
    .almarai-button1:hover{
        flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    
    
    }
    
    .Al-Fatihah{
        display: flex;
        position: absolute;
        width: 300px;
        height: 75px;
        color: #ffffffd8;
        right: 40px;
        top: 390px; 
        font-size: large;
        line-height: 50px;
    }
    
    
    .Al-Fatihah1{
        display: flex;
        position: absolute;
        width: 300px;
        height: 75px;
        color: #ffffffd8;
        right: 40px;
        top: 19091px; 
        font-size: large;
    }
    
    
    .almarai-button2{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 310px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
        
    
    }
    
    .almarai-button2:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button3{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 420px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button3:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button4{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 420px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button4:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    
    
    .almarai-button5{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 530px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button5:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button6{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 530px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button6:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button7{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 630px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button7:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button8{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 630px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button8:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button9{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 740px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button9:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button10{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 740px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button10:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button11{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 850px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button11:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button12{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 850px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button12:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button13{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 960px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button13:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button14{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 960px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button14:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button15{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 1070px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button15:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button16{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 1070px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button16:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button17{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 1180px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button17:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button18{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 1180px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button18:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button19{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 1290px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button19:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    
    
    .almarai-button20{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 1290px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button20:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button21{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 1410px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button21:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button22{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 1410px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button22:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button23{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 1530px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button23:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button24{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 1530px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button24:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button25{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 1640px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button25:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button26{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 1640px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button26:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button27{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 1750px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button27:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button28{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 1750px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button28:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button29{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 1860px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button29:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button30{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 1860px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button30:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button31{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 1970px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button31:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button32{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 1970px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button32:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button33{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 2080px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button33:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    
    
    .almarai-button34{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 2080px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button34:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button35{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 2190px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button35:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button36{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 2190px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button36:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button37{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 2300px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button37:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button38{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 2300px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button38:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button39{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 2410px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button39:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button40{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 2410px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button40:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button41{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 2520px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button41:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button42{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 2520px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button42:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button43{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 2630px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button43:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button44{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 2630px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button44:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button45{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 2740px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button45:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button46{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 2740px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button46:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button47{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 2850px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button47:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button48{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 2850px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button48:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    
    
    .almarai-button49{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 2960px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button49:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button50{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 2960px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button50:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button51{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 3070px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button51:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button52{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 3070px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button52:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button53{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 3180px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button53:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button54{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 3180px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button54:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button55{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 3290px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button55:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button56{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 3290px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button56:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button57{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 3410px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button57:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button58{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 3410px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button58:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button59{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 3520px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button59:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button60{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 3520px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button60:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button61{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 3630px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button61:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button62{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 3630px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button62:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    
    
    .almarai-button63{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 3740px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button63:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button64{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 3740px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button64:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button65{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 3850px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button65:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button66{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 3850px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button66:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button67{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 3960px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button67:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button68{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 3960px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button68:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button69{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 4070px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button69:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button70{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 4070px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button70:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button71{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 4180px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button71:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button72{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 4180px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button72:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button73{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 4290px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button73:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button74{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 4290px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button74:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button75{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 4410px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button75:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button76{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 4410px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button76:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button77{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 4520px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button77:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    
    
    .almarai-button78{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 4520px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button78:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button79{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 4630px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button79:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button80{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 4630px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button80:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button81{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 4740px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button81:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button82{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 4740px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button82:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button83{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 4850px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button83:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button84{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 4850px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button84:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button85{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 4960px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button85:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button86{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 4960px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button86:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button87{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 5070px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button87:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button88{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 5070px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button88:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button89{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 5180px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button89:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button90{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 5180px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button90:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button91{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 5290px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button91:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    
    
    .almarai-button92{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 5290px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button92:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button93{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 5400px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button93:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button94{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 5400px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button94:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button95{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 5510px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button95:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button96{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 5510px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button96:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button97{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 5620px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button97:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button98{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 5620px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button98:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button99{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 5730px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button99:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button100{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 5730px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button100:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button101{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 5840px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button101:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button102{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 5840px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button102:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button103{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 5950px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button103:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button104{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 5950px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button104:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button105{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 6060px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button105:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button106{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 6060px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button106:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    
    
    .almarai-button107{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 6170px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button107:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button108{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 6170px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button108:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    
    .almarai-button109{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 6280px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    
    .almarai-button109:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button110{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right:  210px;
        top: 6280px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button110:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button111{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 6390px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button111:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button112{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 6390px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button112:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button113{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 50px;
        top: 6510px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button113:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }
    
    .almarai-button114{
        display: flex;
        position: absolute;
        min-width: 6em; /* تمديد الزر */
        height: 50px;
        right: 210px;
        top: 6510px;
        border-radius: 10px; /* مقدار حده زوايا البورد  */
        margin-left: 10px;
        text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
        transition: .3s all ease;
        border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
        color: #ffffff !important;   /* لون الخط */
        display: inline-block;
        font-weight: 800;
        line-height: 3.5em; /* تحريك الخط */
        padding: .9rem;
        margin-bottom: 15px;
        text-align: center;
    
    }
    
    .almarai-button114:hover{
         flex: 2px;
        color: #000000 !important;   /* لون الخط */
        background-color: rgb(255, 255, 255);
    }

           /*تنسيق العنوان*/
           h1{
            text-align: center;
            padding: 16px;
            
        }
        
        
        h2{
            text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
            color: #ffffff !important;   /* لون الخط */
        }
        /*القائمة مغلقة*/
        .menu{
            position: relative;
            float: left;
            /**/ left: -290px;
            width: 260px;
            height: 100vh;
            background-color: rgb(199, 199, 199, 80%);
            color: white;
            top: 70px;
            z-index: 999;
            transition: all .5s;   
        }
        /*القائمة مفتوحة*/
        .menu-open{
            left: 0px;
            background-color: rgb(36, 36, 36);
            height: 1000px;
            
        }
        /*الزر مغلق*/
        .close-btn{
            display: block;
            height: 60px;
            line-height: 60px;
            font-size: 30px;
            float: right;
            padding:  0 20px;
            background-color: rgba(215, 124, 27);
            cursor: pointer;
            position: absolute;
            left: 287px;
            top: 0px;
            transition: all .5s; 
            border-radius: 30px; /* مقدار حده زوايا البورد  */
        
        
        }

        /*الزر مفتوح*/
        .open-btn{
            background-color: rgba(215, 124, 27);
        }
        /*تنسيق عناصر القئمة*/
        #father > li{
            list-style-type: none;
            text-align: center;
            line-height: 60px;
            cursor: pointer;
            border-bottom: 3px solid darkgray;
            
        }
        
        #father > li:hover{
            background-color: #333;
            color: black;
            
        }

        /* تنيسق القائمة الفرعية */
        #son{
            display: none;
            width: 76% !important;
        }

        #father > li:hover #son{
            display: block;

        }
        #son > li{
            background-color: #333;
            color: black;
        }

        #son > li:hover{
            background-color: #d77c1b;
        }


        /*محتوى الصفحة مفتوح*/
        .content{
            position: relative;
           
            height: 60px;
        }
        
        /*محتوى الصفحة المغلق*/
        .content{
            width: 100%;
            left: 0px;
        }
    
    
    .quran11{
    display: flex;
    position: absolute;
    width: 310px;
    height: 75px;
    right: 11px;
    color: #ffffffe5;
    top: 280px;
    border-radius: 7px;
     text-transform: uppercase !important;
     font-size: larger;
    }
    
    
    .button{
    display: flex;
     position: absolute;
     display: inline-block;
     padding: 15px 20px;
     height: 30px;
     width: 200px;
     top: -20px;
     right: 150px;
     font-size: small;
     line-height: 30px;
     color: #fff;
     text-decoration: none;
     
    } 
    
    
    .button:hover{
     display: flex;
     display: inline-block;
     color: #d77c1b!important;   /* لون الخط */
     background-color: rgba(215, 124, 27,);
     min-width: 6em; /* تمديد الزر */
     height: 30px;
     width: 200px;
     top: -20px;
     right: 150px;
     border-radius: 10px; /* مقدار حده زوايا البورد  */
     margin-left: 10px;
     text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
     transition: .3s all ease;
     border: solid 1px rgba(215, 124, 27,);   /* هنا اطراف الزر */
     color: rgba(215, 124, 27,);   /* لون الخط */
     display: inline-block;
     font-weight: 100;
     line-height: -1em; /* تحريك الخط */
      
    } 
    
           /*تنسيق العنوان*/
           h1{
            text-align: center;
            padding: 16px;
            
        }
        
        
        h2{
            text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
            color: #ffffff !important;   /* لون الخط */
        }
        /*القائمة مغلقة*/
        .menu{
            position: relative;
            float: left;
            /**/ left: -290px;
            width: 260px;
            height: 100vh;
            background-color: rgb(199, 199, 199, 80%);
            color: white;
            top: 70px;
            z-index: 999;
            transition: all .5s;   
        }
        /*القائمة مفتوحة*/
        .menu-open{
            left: 0px;
            background-color: rgb(36, 36, 36);
            
        }
        /*الزر مغلق*/
        .close-btn{
            display: block;
            height: 60px;
            line-height: 60px;
            font-size: 30px;
            float: right;
            padding:  0 20px;
            background-color: rgba(215, 124, 27);
            cursor: pointer;
            position: absolute;
            left: 287px;
            top: 0px;
            transition: all .5s; 
            border-radius: 30px; /* مقدار حده زوايا البورد  */
        
        
        }

        /*الزر مفتوح*/
        .open-btn{
            background-color: rgba(215, 124, 27);
        }
        /*تنسيق عناصر القئمة*/
        #father > li{
            list-style-type: none;
            text-align: center;
            line-height: 60px;
            cursor: pointer;
            border-bottom: 3px solid darkgray;
            
        }
        
        #father > li:hover{
            background-color: #333;
            color: black;
            
        }

        /* تنيسق القائمة الفرعية */
        #son{
            display: none;
            width: 76% !important;
        }

        #father > li:hover #son{
            display: block;

        }
        #son > li{
            background-color: #333;
            color: black;
        }

        #son > li:hover{
            background-color: #d77c1b;
        }


        /*محتوى الصفحة مفتوح*/
        .content{
            position: relative;
           
            height: 60px;
        }
        
        /*محتوى الصفحة المغلق*/
        .content{
            width: 100%;
            left: 0px;
        }



        .quran134{
            display: flex;
            position: absolute;
            width: 300px;
            font-size: xx-large;
            height: 75px;
            color: #fff;
            right: 40px;
            top: 120px;
            border-radius: 7px;
        
        }
        
        .madyna1{
            display: flex;
            position: absolute;
            width: 300px;
            height: 75px;
            right: 109px;
            top: 300px;
            color: #fff;
            border-radius: 7px;
        
        
        }
        
        .madyna{
            display: flex;
            position: absolute;
            width: 330px;
            height: 75px;
            right: 10px;
            color: #fff;
            top: 1100px;
            font-size: medium;
        }
        
        .madyna11{
            display: flex;
            position: absolute;
            width: 390px;
            height: 75px;
            color: #fff;
            right: -10px;
            top: 860px;
            font-size: x-large;
        }
        
        .madyna11:hover{
            display: flex;
            position: absolute;
            width: 390px;
            height: 75px;
            color: #fff;
            right: -10px;
            top: 860px;
            font-size: x-large;
            display: flex;
            display: inline-block;
            color: #d77c1b!important;   /* لون الخط */
            background-color: rgba(215, 124, 27,);
            border-radius: 10px; /* مقدار حده زوايا البورد  */
            text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
            transition: .3s all ease;
            border: solid 1px rgba(215, 124, 27,);   /* هنا اطراف الزر */
            color: rgba(215, 124, 27,);   /* لون الخط */
        }
        
        
        
        .madyna2{
            display: flex;
            position: absolute;
            width: 300px;
            color: #fff;
            height: 75px;
            right: 50px;
            top: 1300px;
        
        }
        
        .madyna22{
            display: flex;
            position: absolute;
            width: 330px;
            height: 75px;
            color: #fff;
            right: 30px;
            top: 1800px;
            font-size: x-large;
        }
        
        .madyna22:hover{
            display: flex;
            position: absolute;
            width: 330px;
            height: 75px;
            right: 30px;
            top: 1800px;
            font-size: x-large;
            display: flex;
            display: inline-block;
            color: #d77c1b!important;   /* لون الخط */
            background-color: rgba(215, 124, 27,);
            border-radius: 10px; /* مقدار حده زوايا البورد  */
            text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
            transition: .3s all ease;
            border: solid 1px rgba(215, 124, 27,);   /* هنا اطراف الزر */
            color: rgba(215, 124, 27,);   /* لون الخط */
        }
        
        .madyna21{
            display: flex;
            position: absolute;
            width: 330px;
            height: 75px;
            color: #fff;
            right: 10px;
            top: 2030px;
            font-size: large;
        }
        
        
        
        
        .tgued1{
            display: flex;
            position: absolute;
            width: 300px;
            height: 75px;
            right: 40px;
            color: #fff;
            top: 2200px;
        
        }
        
        .tgued11{
            display: flex;
            position: absolute;
            width: 300px;
            color: #fff;
            height: 75px;
            right: 40px;
            top: 2650px;
            font-size: x-large;
        }
        
        .tgued11:hover{
            display: flex;
            position: absolute;
            width: 300px;
            height: 75px;
            color: #fff;
            right: 40px;
            top: 2650px;
            font-size: x-large;
            display: flex;
            display: inline-block;
            color: #d77c1b!important;   /* لون الخط */
            background-color: rgba(215, 124, 27,);
            border-radius: 10px; /* مقدار حده زوايا البورد  */
            text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
            transition: .3s all ease;
            border: solid 1px rgba(215, 124, 27,);   /* هنا اطراف الزر */
            color: rgba(215, 124, 27,);   /* لون الخط */
        }
        
        .tgued{
            display: flex;
            position: absolute;
            width: 350px;
            height: 75px;
            color: #fff;
            right: 4px;
            top: 2900px;
            font-size: large;
        }
        
        
        
        
        
        
        .bacstan1{
            display: flex;
            position: absolute;
            width: 300px;
            height: 75px;
            color: #fff;
            right: 170px;
            top: 3050px;
        
        }
        
        .bacstan11{
            display: flex;
            position: absolute;
            width: 370px;
            height: 75px;
            color: #fff;
            right: 10px;
            top: 3740px;
            font-size: x-large;
        }
        
        .bacstan11:hover{
            display: flex;
            position: absolute;
            width: 370px;
            height: 75px;
            color: #fff;
            right: 10px;
            top: 3740px;
            font-size: x-large;
            display: flex;
            display: inline-block;
            color: #d77c1b!important;   /* لون الخط */
            background-color: rgba(215, 124, 27,);
            border-radius: 10px; /* مقدار حده زوايا البورد  */
            text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
            transition: .3s all ease;
            border: solid 1px rgba(215, 124, 27,);   /* هنا اطراف الزر */
            color: rgba(215, 124, 27,);   /* لون الخط */
        }
        
        .bacstan{
            display: flex;
            position: absolute;
            width: 370px;
            height: 75px;
            color: #fff;
            right: -4px;
            top: 3920px;
            font-size: large;
        }
        
        
        .abnkthyr{
            display: flex;
            position: absolute;
            width: 900px;
            height: 75px;
            color: #000000;
            color: #fff;
            right: 590px;
            top: 600px;
            font-size: smaller;
        }
        
        
        .audio{
            display: flex;
            position: absolute;
            width: 300px;
            font-size: xx-large;
            height: 75px;
            color: #fff;
            right: 40px;
            top: 610px;
            border-radius: 7px;
    
            
         }
    
    
         .logooo{
            display: flex;
            position: absolute;
            width: 300px;
            height: 75px;
            color: #fff;
            right: 40px;
            top: 310px;
            border-radius: 7px;
            
    
            
         }
    
         .qurann{
            display: flex;
            position: absolute;
            width: 300px;
            font-size: xx-large;
            height: 75px;
            color: #fff;
            right:  20px;
            top: 60px;
            border-radius: 7px;
         }
    
         
         .qurannn{
            display: flex;
            position: absolute;
            width: 300px;
            font-size: xx-large;
            height: 75px;
            color: #fff;
            right: 40px;
            top: 230px;
            border-radius: 7px;
         }
    


         p211{
            font-size: xxx-large;
            
            }
            
            .al9ba7{
                display: flex;
                position: absolute;
                min-width: 20em; /* تمديد الزر */
                height:810px;
                right: 20px;
                top: 270px;
                border-radius: 20px; /* مقدار حده زوايا البورد  */
                margin-left: 10px;
                transition: .3s all ease;
                border: solid 1px rgb(199, 199, 199);   /* هنا اطراف الزر */
                color: #ffffff !important;   /* لون الخط */
                display: inline-block;
                font-weight: 800;
                line-height: 3.5em; /* تحريك الخط */
                padding: .9rem;
                margin-bottom: 15px;
                text-align: center;
                 text-decoration: none; /*يخلي الكلام بدون الخط الي تحت الكلام */ 
                text-decoration: none; /* يخلي الكلام بدون الخط الي تحت الكلام  */
            
            }
            
            .al9ba7t{
                display: flex;
                position: absolute;   
                color: #fff;
                top: 460px;
                right: 40px;
                width: 300px;
                line-height: 4.5em; /* تحريك الخط */

            }



.themenu{
    display: flex;
    position: absolute;
    width: 150px;
    height: 400px;
    top: 61px;
    left: -151px;

}
         @font-face {
  font-family: 'Al-Fatihah';
  src: url('UthmanicHafs_V22.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}


.Al-Fatihah {
  font-family: 'Al-Fatihah', sans-serif;
}
#font{

     display: flex;
    position: absolute;
  font-size: xxx-large;


}
    
    :root{
    
        --h1-font: 2,1rem;
    }
    
    
    }