/* dont show changing pics  */
#pic {display:none}
  
.body {	padding-left:0; clear:left}

/* this makes a space for the menu*/
#toplogo{ display:none}
/* Dont set width of menu and it firs its content  position:relative; top:1px; z-index:100;  */
.menu {  position:relative; top:1px; z-index:100; font-family:"Comic Sans MS", cursive; background-color:#006633; float:left;border-radius: 25px; margin-right:10px} /* the menu box */
/*  */
.munchkin{ color:white; text-decoration:none; position:relative; top:-10px;  }

.menu li a { display: block; padding: 0 10px; color: #fff; text-decoration: none; }
 
 /* make the second level visible when hover on first level list OR link */
.menu ul li:focus ul, .menu ul a:focus ul, .menu ul li:hover ul, .menu ul a:hover ul{ display:block; }

.menu li a { border-bottom: none; color:white;}
 
.menu li a:hover, .menu li a:focus { color: #1c1c1c; background:#33FF66; border-radius: 25px; }   
/* inset the 2nd level lists  */
.menu ul ul { display:none; padding-left:20px;	}
#header {  display:none }


#nav:not( :target ) > a:first-of-type, #nav:target > a:last-of-type  { display: block; }
 
    /* first level */

#nav > ul { display: none;  }
#nav:target > ul { display: block; }

/* remove all the bullets, borders and padding from the default list styling */

.menu ul {padding:0;margin:0;list-style-type:none;}

#nav > a { display: none;	}	 /* all nav execpt berger normally hidden */

  
#nav a { font-size:large; padding: 5px 5px; text-decoration:none;}


/* from my small screen */

#content > div:first-of-type img:first-of-type { max-width:125px;}

#square{display:none}

.right{margin:1px; border-radius: 5%; float:right; max-width:50%   }
.left{margin:1px; border-radius: 5%; float:left; max-width:50%   }