*{
  margin: 0;
  padding: 0;
  /* box-sizing: border-box; */
} 

body {
    background-image : url("../images/Background-Image-AshrafiyahMosque-Taiz.png");
    background-size: auto;
}

nav{
overflow: center;
}

ol {
  margin: 0px;
  padding: 10px 0px;
  text-align: center;
  list-style: none;
}

   li {
     float: right;
}

   nav a {
     background-color: wheat;
     width: 10px;
     display: block;
     text-decoration: none;
     text-align: center;
     font-size: 18px;
     color: black;
     border: 2px solid white;
     padding: 10px;
     font-family: Arial, Helvetica, sans-serif;
   }

   .lang-2{
       background-color: green;
       color: white;
   }

   .ar{
       background-color: green;
       color: white;
   }

   nav ol .lang{
    background-color: white;
    width: 276px;
    display: block;
    text-decoration: none;
    text-align: center;
    font-size: 18px;
    color: black;
    border: 2px solid white;
    padding: 0px 10px 0px 10px;
    font-family: Arial, Helvetica, sans-serif;
    float: left;
   }

   nav a:hover {
     background: green;
     color: white;
   }

   .home{
       background-color: green;
     color: white;
   }

.page-image{
    text-align:center;
}

.page-image img{
       border: 5px solid wheat;
       width: 750px;
       border-radius: 5%;
   }

h1 {
  margin: 25px;
 color: green;
 text-align : center;
 font-size : 3rem;
 direction: rtl;
}

#intro {
    color : black;
    font-size: 2.2rem;
    font-family: cursive, Arial, Helvetica, sans-serif; 
    direction: rtl;
}

P {
  font-size : 2rem;
  margin: 3%;
  direction: rtl;
}

ul {
font-size : 2rem;
font-style: italic;
margin: 3%;
direction: rtl;
}

.points ul li{
  margin: 10px;
}

.Opening{
      font-size : 2rem;
      text-align: center;
      margin: 3%;
      font-family: cursive, Arial, Helvetica, sans-serif;
      /* text-decoration: underline; */
      direction: rtl;
}

.notice{
  text-indent:25px;
  color: white;
  background-color : green;
  font-size : 1.5rem;
  width: 550px;
  border: 5px;
  border-style: solid;
  border-color: wheat;
  border-radius: 10px;
  margin: 3%;
   
  padding-top: 15px;
  padding-bottom:15px;
  padding-left:20px;
  padding-right:20px;  
      
      direction: rtl;
}

/*Mobiles*/
@media screen and (max-width: 480px) {
  body{
    margin: 30px;
    font-size: 10px;
  }
}

::selection{
  color: green;
  background-color: white;
}

/*Tablets, Ipads*/
@media screen and (min-width: 480px) and (max-width: 1024px) {
  body{
    margin: 20px;
    font-size: 10px;
    padding: 10px;
  }
}

/*Laptops, Desktops*/
@media screen and (min-width: 1024px) {
  body{
    margin: 20px;
    font-size: 40px;
    padding: 12px;
  }
  
  nav ol .menu li::first-letter {
    font-size: 150%;
  }
}