ul{ font-size: 10px;}
li{ display: inline-block;width: 140px;height: 40px;background-color: rgb(235, 235, 190);margin: 8px;font-size: 15px;text-align: center;line-height: 30px;}
a  {text-decoration: none; color:darkblue}
iframe { width : 1000px; height: 500px ; }

.sidenav {  height: 100% ;  width: 160px;  position: fixed;  z-index: 1;top: 0;  left: 0;  background-color: rgb(235, 235, 190);  overflow-x: hidden; padding-top: 20px;text-align:center;}
.sidenav a {padding: 6px 8px 6px 16px;text-decoration: none;font-size: 20px;  color: darkblue; display: block;    }
.sidenav a:hover {color: darkorchid; }
.sidenav p1 {color: rgb(73, 9, 223);
             font-size: 2em;        
      padding-top: 0px;}
.main {margin-left: 160px;font-size: 28px; padding: 0px 10px; }
.main p1 {color: rgb(170, 211, 187);background-color:rgb(202, 138, 207);
        font-size: 25px; 
        display: inline-block;padding: 6px 8px 6px 16px;}
.main h1{ font-size: 40px; 
        color: blue;padding: 6px 8px 6px 16px;}
    h2{ font-size: 30 px;
        color: blue;display: inline-block;padding: 6px 8px 6px 16px;}
	h3{ font-size: 20 px;
        color: blue;display: inline-block;padding: 6px 8px 6px 10px;}
@media screen and (max-height: 750px) 
  { 
    
    .sidenav {padding-top: 15px;} 
    .sidenav a {font-size: 18px;} 
    
    h1{ font-size: 40px; text-align: center;
        color: blue;}
    h2{ font-size: 30 px;
        color: rgb(119, 224, 48);}
	
    }  
 
@media screen and (max-width: 700px) {


    .sidenav {
        display: none;
    }
    .main {
        margin-left: 10px;
    }
}