/*body{
    direction: rtl;
    margin: 0;
    padding: 0;
    font-family: 'Cairo', sans-serif;
    font-size: 16px;
     background: linear-gradient(to top, rgba(255,0,0,0),  #e6f2ff);
     background-repeat: no-repeat;
}*/

#ContentBox {
    padding-top: 40px;
     width: 100%;
     font-size: 14px;
     max-width: 600px;
     margin: auto auto auto auto;
        /*border: 1px solid black;*/
    }
    #ContentBox table:first-child {
     width: 100%;
     border: #cccccc 1px solid ;
     margin-bottom: 5px;
     background-color: #cccccc;
     padding: 0;
     border-collapse: separate;
        
    }
    #ContentBox table:first-child tr td:first-child{
     width: 80%;
     border-left: none;
     background-color: #cccccc;    
       
    } 
    #ContentBox table:first-child tr td{
      border-bottom: none;
    }
    #ContentBox table tr td{   
     padding: 3px;
     border-bottom: 1px dotted black;
    }
    #ContentBox table tr td:first-child{
     width: 120px;
     background-color: wheat;  
     font-weight: bold;
     border-left: 1px solid black;
    }   
    #ContentBox table {
     width: 100%;
     border: 1px solid black;
     border-collapse: collapse;
    }
    #ContentBox [type=text]{
     display: block; 
     font-size: 16px;
     font-family: 'Cairo', sans-serif;
     text-align: center;
     outline: none;
     font-weight: bold;
     border:1px solid silver;
     margin: 5px 0 5px 0;
     width: 100%;
        
    }
    
    #ContentBox a {
        
        display: block;
        width: 100px;
        text-align: center;
        margin:  auto auto auto auto;
        text-decoration: none;
        margin-top: 5px;
        color: white;
        font-weight: bold;
        background-color: red;
       
        
        
    }
    #ContentBox h1 {
        
        padding: 0;
        display: block;
        width: 100%;
        text-align: center;
        margin:  auto auto auto auto;
        margin-top: 5px;
        /*color: white;*/
        font-weight: bold;
        font-size: 20px;
        background-color: #cccccc;
       
        
        
    }
    .clear{
        display: block;
        padding: 0;
        margin: 0;
        width: 100%;
    }
    #phone{
        font-family: inherit;
        font-size: 16px;
        text-align: center;
        font-weight: bold;
        background-color: antiquewhite;
    }
    #search_adid{
        font-family: inherit;
        font-size: 16px;
        text-align: center;
        font-weight: bold;
        background-color: lightgrey;
    }
    #state {
       
        font-size: 16px;
        text-align: center;
        font-weight: bold;   
        background-color: silver;

        
    }
    
/* For mobile */
@media only screen and (max-width: 600px) {
    body {
            padding: 5px;
            font-family: 'Cairo', sans-serif;
            font-size: 16px;
            /*background-color: darkgrey;*/
    }
    
    #ContentBox {
       padding-top: 0;
    }
/*
    #ContentBox table:first-child {
        width: 100%;
        border: #cccccc 1px solid ;
        margin-bottom: 5px;
        background-color: whitesmoke;
        padding: 0;
        border-collapse: separate;
        
    }
    #ContentBox table:first-child tr td:first-child{
        width: 80%;
        border-left: none;
        background-color: white;    
       
    } 
    #ContentBox table:first-child tr td{
         border-bottom: none;
    }
    #ContentBox table tr td{   
        padding: 3px;
        border-bottom: 1px dotted black;
    }
    #ContentBox table tr td:first-child{
     width: 100px;
     background-color: wheat;  
     font-weight: bold;
     border-left: 1px solid black;
    }   
    #ContentBox table {
        width: 100%;
        border: 1px solid black;
        border-collapse: collapse;
    }
    #ContentBox [type=text]{
     display: block;
      
     font-size: 16px;
     font-family: 'Cairo', sans-serif;
     text-align: center;
     outline: none;
     font-weight: bold;
     border:1px solid silver;
     
     margin: 5px 0 5px 0;
     width: 100%;
        
    }*/
  
    .Btn{
    outline: none;
    margin: 0;
    font-family: 'Cairo', sans-serif;
    font-size: 14px;
    font-weight: bold;
    border: 1px solid   #009900;
    background-color: #36BF2D;
    color: white;
    /*border-bottom: 2px solid   #009900 ;*/
    /*border-radius: 3px;*/
    cursor: pointer;
    width: 120px;
    height: 35px;
   
    
   }
    .Btn:hover{
     background-color:  #00cc00;
    }

     .Btn:active{
     border-bottom: 1px solid   #009900 ;
    }
    
   
    
}


/* For desktop */
@media only screen and (min-width: 601px) {
 body{
    direction: rtl;
    margin: 0;
    padding: 0;
    font-family: 'Cairo', sans-serif;
    font-size: 16px;
/*    background: linear-gradient(to top, rgba(255,0,0,0),  #e6f2ff);*/
    background-repeat: no-repeat;
}
   
  
   
   
   
   .Btn{
    outline: none;
    margin: 0;
    font-family: 'Cairo', sans-serif;
    font-size: 14px;
    font-weight: bold;
    border: 1px solid   #009900;
    background-color: #36BF2D;
    color: white;
    border-bottom: 2px solid   #009900 ;
    border-radius: 3px;
    cursor: pointer;
    width: 120px;
    height: 35px;
   
    
   }
    .Btn:hover{
     background-color:  #00cc00;
    }

     .Btn:active{
     border-bottom: 1px solid   #009900 ;
    }
   
    /*** end of  login page design  ***/
      
  
    
    
}








  /*** start of  member page design  ***/
    #MainContainer {
        width: 800px;
        display: block;
        margin: auto auto auto auto;
        margin-top: 50px;
        border: 1px solid #bfbfbf;

        background-color: white;
    }
    
    
    
    #MainMenu{
        width: 100%;
        height: 40px;
        margin: 0;
        padding: 0;
        list-style: none;
/*        border-top-right-radius: 5px;
        border-top-left-radius: 5px;*/
        background: linear-gradient(to top,  #f2f2f2,   #cccccc);
        border-bottom: 1px solid #cccccc;
        margin-bottom: 10px;
    }
    #MainMenu li{
        float:right;

        font-size: 14px;
        font-weight: bold;
        border-left: 1px solid #bfbfbf;
        height: 40px;
        width: 100px;
        text-align: center;
        /*background-color: yellow;*/
    }
    
    #MainMenu li a{
        float:right;
        padding: 5px 15px 5px 15px;
        text-decoration: none;
        height: 30px;
        color: #333333;
       text-align: center;

        /*background-color: orange;*/
    }
    
    #MainMenu li a:hover{
        color: royalblue;
    }
    
    
    #footer{
        
        background-color: #e6e6e6;
        text-align: center;
        font-weight: bold;
        margin-top: 10px;
        height: 30px;
        border-top: 1px solid #bfbfbf;
        font-size: 14px;
    }
    
    #profile{
        width: 400px;
        padding: 10px;
        margin:  auto auto auto auto;
        border: 1px solid #cccccc;
    }
    #profile table{
        border: 1px solid #cccccc;
        width: 100%;
        font-size: 12px ;
        font-weight: bold;
        padding: 15px 0 15px 0;
    }
    #profile h4{
        padding: 0;
        margin: 0;
        background: linear-gradient(to left, #e6e6e6 , white);
        padding-right: 5px;
        font-size: 14px;
    }
    
    
    #users{
        width: 700px;
        padding: 10px;
        margin:  auto auto auto auto;
        border: 1px solid #cccccc;
        background-color: #f2f2f2;
    }
      #users table{
        border: 1px solid #cccccc;
        width: 100%;
        font-size: 12px ;
        font-weight: bold;
        padding: 15px 0 15px 0;
        background-color: white;
       
    }
    
    
    #users table tr td{
        
         text-align: center;
        
    }
    
    #users h4{
        padding: 0;
        margin: 0;
        background: linear-gradient(to left, #e6e6e6 , white);
        padding-right: 5px;
        font-size: 14px;
    }
    
    #search 
    {
        width: 700px;
        padding: 10px;
        margin:  auto auto auto auto;
        border: 1px solid #cccccc;
        background-color: #f2f2f2;
        min-height: 200px;
        
    }
    
 
    
    #ads {
    
        width: 700px;
        padding: 10px;
        margin:  auto auto auto auto;
        border: 1px solid #cccccc;
        background-color: #f2f2f2;
        min-height: 200px;
    
    }
    
    #ads h4 {
        
         padding: 0;
        margin: 0;
        background: linear-gradient(to left, #e6e6e6 , white);
        padding-right: 5px;
        font-size: 14px;
    }
    
    
    #ads table {
        width: 100%;
        /*background-color: red;*/
    }
       
      #ads table tr td:first-child{
        width:150px;
        
        /*background-color: red;*/
    }
    #ads [type=text]{
      
      font-size: 16px;
      font-family: 'Cairo', sans-serif;
      text-align: center;
      outline: none;
      /*font-weight: bold;*/
      border:1px solid silver;
      border-radius: 3px;
      margin: 5px 0 5px 0;
      width: 500px;
    }
    
    #ads textarea {
        outline: none;
        max-width: 500px;
        min-width: 500px;
        min-height: 100px;
        
    }
 #ads select {
        outline: none;
        font-size: 14px;
        font-family: 'Cairo', sans-serif;
        width: 200px;
        
    }
    #ads_adid{
        text-align: center;
        font-weight: bold;
        font-size: 20px;
        background-color: green;
        color: white;
    }
    









.Btn2{
    outline: none;
    margin: 0;
    font-family: 'Cairo', sans-serif;
    font-size: 11px;
    font-weight: bold;
    border: 1px solid   #009900;
    background-color: #36BF2D;
    color: white;
    border-bottom: 2px solid   #009900 ;
    border-radius: 3px;
    cursor: pointer;
    width: 90px;
    height: 25px;
   
    
   }
    .Btn2:hover{
     background-color:  #00cc00;
    }

     .Btn2:active{
     border-bottom: 1px solid   #009900 ;
    }
    
     .Btn3{
    outline: none;
    margin: 0;
    font-family: 'Cairo', sans-serif;
    font-size: 14px;
    font-weight: bold;
    border:  royalblue 1px solid ;
    background-color: dodgerblue;
    color: white;
    border-bottom: 2px solid  royalblue ;
    border-radius: 3px;
    cursor: pointer;
    width: 120px;
    height: 35px;
   
    
   }
    .Btn3:hover{
     background-color: dodgerblue;
    }

     .Btn3:active{
     border-bottom: 1px solid   royalblue ;
    }
    
    #done{
        margin: 0;
        margin-top: 10px;
        color: white;
        background-color: green;
        text-align: center;
    }
    #not{
        margin: 0;
        margin-top: 10px;
        color: white;
        background-color: red;
        text-align: center;
    }
    
    
     
   /*** start of  login page design  ***/
   
   #loginBox{
       width: 400px;
       border: 1px solid #bfbfbf;    
       display: block;
       margin:  auto auto auto auto;
       margin-top: 150px;
       border-radius: 5px;
       padding-bottom: 10px;
       background-color: #F0F0F0;
       
   }
   
   #loginBox  h2{
        
       font-size: 16px;
       text-align: center;
       margin: 0;
       border-top-right-radius: 5px;
       border-top-left-radius: 5px;
       padding: 10px 0 10px 0;
       /*border-bottom: 1px dotted #1B6EF2;*/
       color: white;
       margin-bottom: 10px;
   }
   

   #loginBox table{
       width: 100%;
       /*border-collapse: collapse;*/
       padding: 5px 15px 5px 15px;
       /*background-color: red;*/
   }
   
   #loginBox table tr{
       text-align: center;
       font-weight: bold;
       
       /*background-color: yellow;*/
   }
   #loginBox table tr td span{
       text-align: right;
       font-weight: bold;
       display: block;
       width: 120px;
       /*padding-right: 20px;*/
       /*background-color: orange;*/

   }
    #loginBox table tr td input[type=text] , [type=password] {
      width: 100%;
      font-family: 'Cairo', sans-serif;
      text-align: center;
      outline: none;
      font-weight: bold;
      border:1px solid silver;
      border-radius: 3px;
       margin: 5px 0 5px 0;
       width: 240px;
   }
   #loginBtn{
       background-color: mediumseagreen;
       cursor: pointer;
       border-color: forestgreen;
       margin: 5px 0 5px 0;
       border-radius:0px;
       height: 40px;
   }