/* Containers */
@media screen  and (orientation: landscape) and  (max-width: 820px){
body{background-color:#eeeeee;}

a,ol,ul,li,p{
margin: 0;
padding:0;
border:0;
vertical-align:baseline;
background:transparent;}

#wrapper {
	width:100%;
	max-width:100%;
	margin:0px auto;
	background-color:#ffffff;
	}
	
#top { background-color:#000000;
	   width:100%;
	   padding:20px 0;
	   overflow :hidden;
	   border-bottom:1px #eeeeee solid;
	   

}

#topR { background-color:#3009BD;
	   width:100%;
	   padding:20px 0;
	   overflow :hidden;
	   border-bottom:1px orange solid;
	   

}






#logo{clear: both; float:none! important;  margin:0px ! important; text-align: center;}

#social-media{ max-width:100%;  clear: both; float:none! important; margin:0px ! important; text-align: center; }

#social-media p , #social-media p a{
color:#ffffff; 
margin:0px !important;
font-family: "Times New Roman";
}

#social-media img{ height:24px; width:30px;}



#social-media ul li { display:inline; }


#topnav, #topnavR {background-color :#333333; clear:both;}
#topnav ul { width:100%; float:left; margin:0px; background-color :#333333;  
border-bottom:3px #cccccc solid;}
#topnavR ul{ width:100%; float:left; margin:0px; background-color :#0951BD;  
border-bottom:3px #cccccc solid;}
#topnav ul li, #topnavR ul li { display:inline; }


#topnav ul a , #topnavR ul a{ font-size:17px; float:left; padding:5px 5px; font-family: "Times New Roman";}
#topnav a:link , #topnavR a:link{ color:#ffffff; font-family: "Times New Roman";}
#topnav a:visited, #topnavR a:visited { color:#ffffff;}
#topnav a:active, #topnavR a:active { color:#ffffff;}
#topnav a:hover, #topnavR a:hover { color:#ffffff; background-color:#CC0000;}
#topnav a:focus, #topnavR a:focus { color:#ffffff;}


#banner img{  max-height:140px; max-width:100%; max-width:650px;}

#subbanner {width:100%; background-color:#555555; overflow:hidden;
border-top:1px #eeeeee solid;
border-bottom:3px #cccccc solid;

}

#subbanner h3 {color:#ffffff; font-size:16px; font-weight:bold; text-align:center; line-height:180%; font-family: "Times New Roman";
}


#subbannerR {width:100%; background-color:#0951BD; overflow:hidden;
border-top:1px #eeeeee solid;
border-bottom:3px orange solid;

}

#subbannerR h3 {color:#ffffff; font-size:16px; font-weight:bold; text-align:center; line-height:60%;
}




#content {float: none; 
        
	      width:95% !important;
	      clear: both;
max-width:94%; padding:5px; } 

#content h1{ margin:0 0 20px 0; font-size:36px; border-bottom:1px #777777 solid; padding:20px 20px;}
#content p{margin:16px 0;font-size:18px; line-height:160%; font-family: fantasy monospace;}
#content h2{ margin: 20px 0 0 0;}
#content img { padding:0px!important; border: 1px #777777 solid; margin: 0px!important;
max-height:254px; width:95%!important; max-width:800px; 
} 


#rightside { margin-left:0px !important;

      width:94% !important;   
clear: both;
max-width:95%;
 padding:5px; } 

#rightside h1{ margin:0 0 20px 0; font-size:36px; border-bottom:1px #777777 solid; padding:20px 20px;}
#rightside p{margin:16px 0;font-size:18px; line-height:160%; font-family: fantasy monospace;}
#rightside h2{ margin: 20px 0 0 0;}
#rightside img { padding:8px; margin: 8px;} 


#content2  {float: none;
        
	      width:95% !important;
	      clear: both;
max-width:94%; padding:5px; 
} 

#content2 h1{ margin:0 0 20px 0; font-size:36px; border-bottom:1px #777777 solid; padding:20px 20px;}
#content2 p{margin:16px 0;font-size:18px; line-height:160%; font-family: fantasy monospace;}
#content2 h2{  font-size:24px; border-bottom:1px #777777 solid; padding:20px 20px;}
#content2 img { padding:8px; border: 1px #777777 solid; margin: 8px;} 


#content3 {float: none; 
        
	      width:95% !important;
	      clear: both;
max-width:94%; padding:5px; } 
#content3 h1{ margin:0 0 20px 0; font-size:36px; border-bottom:1px #777777 solid; padding:20px 20px; }
#content3 p{margin:16px 0;  font-size:18px; line-height:160%; padding:5px 20px; font-family: fantasy monospace;}
#content3 h2{  font-size:24px;  padding:20px 20px;}
#content3 h3{  font-size:20px;  padding:5px 20px;}
#content3 img { padding:8px; border: 1px #777777 solid; margin: 8px;} 



#contentR { display: flex;
justify-content: center;
align-items: center;} 
#contentR label {margin:16px 0; line-height:160%;}


#indexTable { 
	width:80% !important;
	max-width:100% ;  }
	
#indexTable tr th {width:25%;}
#indexTable tr th p {   margin: 0;  padding: 0; vertical-align:top;background-color:royalblue; border:none;   text-align:center; font-weight:normal;    font-weight:normal; font-size:22px;color:white;}


#indexTable tr td p { padding: 0;  text-align:left; border-radius: 0px; font-weight:normal; font-size:22px;  }
#indexTable tr td p a {color:#0951BD; font-size:20px;}
#indexTable tr td p:hover { color:white; background-color:#CC0000;}
#indexTable tr td a:hover { color:white; background-color:#CC0000;}





    /* hide your table */
    #indexTable {
         display: none;
    }

    /* show grid */
    #mobileGrid {
        display: grid ! important;
        grid-template-columns: 1fr 1fr;
        gap: 12px;
        padding: 10px;
        width:100% !important;
	max-width:100% ; 
	justify-content: center; 
    }

    #box {
        background: #ffffff;
        border: 1px solid #ccc;
        border-radius: 10px;
        padding: 12px;
        box-shadow: 0 2px 6px rgba(0,0,0,0.1);
    }

    #box h3 {text-align:center;
        margin-bottom: 8px;
        font-size: 18px;
        color: #065F46; /* nice green */
        font-family: fantasy monospace;
    }

    #box a {
    color:#0951BD;
        display: block;
        text-decoration: none;
      
        font-size: 15px;
        margin-bottom: 5px;
        font-family: fantasy monospace;
    }

    #box a:hover {
       color: #10B981;
    }





#footer{clear:both; background-color:#000000; padding: 10px 0;
	}

#footerR{clear:both; background-color:#3009BD; padding: 10px 0;
	}


#footer p ,#footerR p {text-align:center; color:#ffffff;}

}





/* Apo edo */
#headerbannerR p{color:black; font-size:2.5rem;  padding: 0px 0px; font-weight:bold; text-align:center; line-height:100%; background-color:white;
font-family: "Playfair Display", Georgia, "Times New Roman", serif;}

#headerbannerR a{float:right; padding:0px 5px; color:#0951BD; }

#topnavRMenu {background-color :#333333; clear:both;}
#topnavRMenu ul { width:100%; float:left; margin:0px; background-color :#333333;  
border-bottom:3px #cccccc solid;}
#topnavRMenu ul{ width:100%; float:left; margin:0px;  background-color :#FFD8A8; 
border-bottom:1px #cccccc solid; border-top:1px #cccccc solid;}
#topnavRMenu ul li, #topnavR ul li { display:inline; }



#topnavRMenu ul a , #topnavRMenu ul a{float:left; padding:10px 20px;}
#topnavRMenu a:link  {font-family:SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; color:#333333;}
#topnavRMenu a:visited { color:#333333;}
#topnavRMenu a:active { color:#333333;}
#topnavRMenu a:hover { color:#ffffff; background-color:#CC0000;}
#topnavRMenu a:focus { color:#ffffff;}


#topRNew { background-color:white;
	   width:100%;
	   padding:10px 0;
	   overflow :hidden;
	   border-bottom:0px orange solid;
	   

}

#logo2{
	
	text-align: center;
}

/* Mexri edo */