@font-face {
    font-family: vazir ;
    src: url(../font/11zon_Vazir.ttf) format(truetype); 
    src: url(../font/Vazir.woff) format(woff);
    
}
@font-face {
    font-family: nazanin ;
    src: url(../font/Far_Nazanin.ttf) format(truetype); 
    src: url(../font//Far_Nazanin.woff) format(woff);
}




body{
    direction: rtl;
    padding: 0;
    margin: 0;
    font-family: nazanin ;

}
header {
    text-align: center;
}
header nav ul li {
    
    list-style: none;
    display: inline-block;
    background-color: #fd8f83;
    width: 10%;
    margin: 1% 2%;
    height: 4vh;
    text-align: center;
    padding :1vh 0;
    font-size: larger;
    font-weight: bold;
    border-radius: 50% ;
    border: 3px solid black;
    

}
header nav ul li a{
    text-decoration: none;
    color: black;
    
    
}
#shop{
    /* background-color: #dbd4ff; */
    width: 90%;
    height: 200vh;
    margin: 0 5%;

}
.products{
    width: 98%;
    background-color:#1abc9c;
    margin: 1% 1%;
    height: 70vh;
    padding: 0.05% 0;
    border-radius: 20px;
}
.notice{
    background-color: #B4F8C8;
    width: 98%;
    margin: 1%;
    border-radius: 15px;
    border: 2px solid black;
    padding: 0 0.5% 0 0.5%;
    box-sizing: border-box;
    

}
.notice h2{
    display: inline-block;


}
.notice h3{
    display: inline-block;
    margin: 0 80% 0 0;

}
.mahsolat{
    width: 98%;
    margin: 0 1%;
    background-color: rgb(18, 18, 17);   
}    
.mahsolat div{
    
    width: 17%;
    height: 50vh;
    background-color: #B4F8C8;
    float: right;
    box-sizing: border-box;
    margin: 0 1.5%;
    border-radius: 12px;
    text-align: center;
    border: 2px solid black;
}
.break{
    width: 100%;
    height: 1vh;
    background-color: transparent;
    clear: both;
}


.mahsolat div img {
    width: 90%;
    height: 35vh;
    margin: 2% 0 1% 0;
    border-radius: 10px;
    
}
.mahsolat div a{
    text-decoration: none;
    color: black;
}

.products1{
    width: 98%;
    background-color:#f39c12;
    margin: 1% 1%;
    height: 70vh;
    padding: 0.05% 0;
    border-radius: 20px;
}
.notice1{
    background-color: #fbe89b;
    width: 98%;
    margin: 1%;
    border-radius: 15px;
    border: 2px solid black;
    padding: 0 0.5% 0 0.5%;
    box-sizing: border-box;
    

}
.notice1 h2{
    display: inline-block;


}
.notice1 h3{
    display: inline-block;
    margin: 0 80% 0 0;

}
.mahsolat1{
    width: 98%;
    margin: 0 1%;
    background-color: rgb(18, 18, 17);   
}    
.mahsolat1 div{
    
    width: 17%;
    height: 50vh;
    background-color: #fbe89b;
    float: right;
    box-sizing: border-box;
    margin: 0 1.5%;
    border-radius: 12px;
    text-align: center;
    border: 2px solid black;
}
.mahsolat1 div img {
    width: 90%;
    height: 35vh;
    margin: 2% 0 1% 0;
    border-radius: 10px;
    
}
.mahsolat1 div a{
    text-decoration: none;
    color: black;
}

/* البالرتاذنتذ */

.products2{
    width: 98%;
    background-color:#2980b9;
    margin: 1% 1%;
    height: 70vh;
    padding: 0.05% 0;
    border-radius: 20px;
}
.notice2{
    background-color: #9ed5fa;
    width: 98%;
    margin: 1%;
    border-radius: 15px;
    border: 2px solid black;
    padding: 0 0.5% 0 0.5%;
    box-sizing: border-box;
    

}
.notice2 h2{
    display: inline-block;


}
.notice2 h3{
    display: inline-block;
    margin: 0 80% 0 0;

}
.mahsolat2{
    width: 98%;
    margin: 0 1%;
    background-color: rgb(18, 18, 17);   
}    
.mahsolat2 div{
    
    width: 17%;
    height: 50vh;
    background-color: #9ed5fa;
    float: right;
    box-sizing: border-box;
    margin: 0 1.5%;
    border-radius: 12px;
    text-align: center;
    border: 2px solid black;
}
.mahsolat2 div img {
    width: 90%;
    height: 35vh;
    margin: 2% 0 1% 0;
    border-radius: 10px;
    
}
.mahsolat2 div a{
    text-decoration: none;
    color: black;
}


#contact {
    width: 30%;
    height: 60vh;
    float: right;
    background-color: #CCCCFF;
    padding: 2%;
    border-radius: 20px;
    border: 1px solid black;
    box-sizing: border-box;
    margin: 2% 1.6%;
}
#contact form div input{
    display: block;
    background-color: #e7e8e9;
    border: none;
    outline: none;
    border-bottom: 2px solid black;
    border-radius: 20px;
    width: 90%;
    height: 4vh;
    margin: 3%;
    box-sizing: border-box;
    direction: ltr;
   
    
}
#contact div button{
    cursor: pointer;
    width: 22%;
    height: 5vh;
    background-color: #77f255;
    text-align: center;
    font-family: vazir;
}
#calling {
    width: 30%;
    height: 60vh;
    background-color: #f8da9e;
    float: right;
    margin: 2% 1.6%;
    border-radius: 20px;
    border: 1px solid black;
    padding: 1%;
    box-sizing: border-box;
    font-size: 22px;
}

#location iframe {
    width: 30%;
    height:60vh;
    float: right;
    margin: 2% 1.6%;
    border-radius: 20px;
}
.socialmedia{
    margin: 0 3%;
}
.dore div{
    width: 50%;
    height: 30vh;
    
    background-color: #cbf6ed;
}
.dore div table tr , td{
    border: 1px solid black;
    
  
}
.dore div table{
    
    width:100%;
    height: 100%;
    text-align: center;
    box-sizing: border-box;
}
#doreha{
    padding: 0 2%;
    font-size: 21px;
}
#doreha h2{
    font-style: italic;
}
#doreha span{
    color: red;
    font-weight: bold;
}