*{  /* --------- خصائص عامة لكل الموقع---------*/
background-repeat: no-repeat;
margin: 0;
padding: 0;
box-sizing: border-box;
font-style: initial;
font-family: Georgia, 'Times New Roman', Times, serif;
/* position: center; */
}
body { /* ----------خصائص البودى --------------- */
width: 80%;
max-width: 575px;
min-width: 255px;
margin: auto;
text-align: center;
background-color: black;
background-image: url(../images/grains.png) ;
background-size: cover;
background-attachment: fixed;
background-position: center top;
}

.grid-top{
    grid-template-columns: repeat(6 , 1fr);
    grid-auto-rows: minmax(48px , auto);
    display: grid;
    grid-gap: 5px;
    grid-column-gap: 5px;
    grid-row-gap: 5px;
}

.grid-top > .item{

    background-color: #E6E6E6;
    color: rgb(14, 13, 13);
}


.grid-top > .item:hover{

    background-color: rgb(72, 88, 179);
    color: #E6E6E6;
}


.item0 ,.item1 , .item2 ,.item3 ,.item4 ,.item5 , .item6 , .item7 , .item8 , .item9 , .item10 , .item11 , .item12,
.item13 , .item14 ,.item15 ,.item16 ,.item17 , .item18 , .item19 , .item20 , .item21 , .item22 , .item23 ,
.item24 , .item25 , .item26{

    border-radius: 30px;
}

/* ------------------خصومات الموسم بانار الكوبون -----------------------*/

.item0{
    grid-column: 1/2;
}

.item1{
    grid-column: 2/7;
}

.item2{

    grid-column: 1/2;
}

.item3{
    grid-column: 2/7;
}

.item4{

    grid-column: 1/2;
}

.item5{
    grid-column: 2/7;

}


.item6{
    grid-column: 1/2;
}


.item7{
    grid-column: 2/7;
}


.item8{

    grid-column: 1/2;
}

.item9{
    grid-column: 2/7;
}

.item10{

    grid-column: 1/2;
}

.item11{
    grid-column: 2/7;

}

.item12{

    grid-column: 1/2;
}

.item13{
    grid-column: 2/7;
}

.item14{

    grid-column: 1/2;
}

.item15{
    grid-column: 2/7;

}


.item16{
    grid-column: 1/2;
}


.item17{
    grid-column: 2/7;
}


.item18{

    grid-column: 1/2;
}

.item19{
    grid-column: 2/7;
}

.item20{

    grid-column: 1/2;
}

.item21{
    grid-column: 2/7;

}

.item22{
    grid-column: 1/2;

}
.item23{
    grid-column: 2/7;
}

.item24{

    grid-column: 1/2;
}

.item25{

    grid-column: 2/7;
}
.item26{

    grid-column: 1/7;
}


a{
    color: rgb(72, 88, 179);
    text-decoration: none;
    font-size: 100%;
    font-style: initial;
    font-family: Georgia, 'Times New Roman', Times, serif;
    transition: all 0.5s ease-in-out;


            }

a:hover{

    color: #ff0055;
    font-size: 115%;



    }
p{
    width: 100%;
    color: rgb(14, 82, 145);
    font-style: italic;
    font-weight: bolder;
    padding: 12px;


    }


p:hover{

    color: #E6E6E6;

    }
    .top1{
        background-image: url(../images/hero2.png);
        background-size: 50%;
        background-position: center;




    }

    .top2 , .btm{

        background-color: rgb(27, 204, 130);
        color: rgb(14, 13, 13);
    
    }
    .top1.item0{

        padding: 0;

    }



    @media(max-width:575px) {

        body{
        width: 100%;
        
        }
        }