@media screen and (max-width: 600px) {
body
{width:100%;
background:url(a.JPG);
overflow-x:hidden;
overflow-y:scroll;
}
#header {background-image: url('smallerhead.jpg');
position:absolute;
z-index:-2;
top:0px;
right:0px;	
height:100%;
width:100%;
background-size:100% 90%;}

.menu {position:fixed;
top:0px;
left: 0px;
width:100%;
height:50px;
background-image: url('smallerhead.jpg');
z-index:1;
}
	.nav {
		position: relative;
		min-height: 40px;
		text-align:center;
	}	
	.nav ul {
		width: 180px;
		padding: 5px 0;
		position: absolute;
		top:10%;
		left: 0;
		border: solid 1px #aaa;
		background: #fff url(images/icon-menu.png) no-repeat 10px 11px;
		border-radius: 5px;
		box-shadow: 0 1px 2px rgba(0,0,0,.3);
		font-weight:normal;
	}
	.nav li {
		display: none; 
		margin: 0;
	}
	.nav .current {
		display: block;
		font-weight:bold; 
	}
	.nav a {
		display: block;
		padding: 5px 5px 5px 5px;
		text-align: center;
	}
	.nav .current a {
		background: none;
		color: #FFFF00;
	}
	.nav ul:hover {
		background-image: none;
	}
	.nav ul:hover li {
		display: block;
		margin: 0 0 5px;
	}
	.nav ul:hover .current {
		background: url(images/icon-check.png) no-repeat 10px 7px;
	}
	.nav.center ul {
		left: 50%;
		margin-left: -90px;
	}
.nav a:link, .nav a:visited, .nav a:active {color:#000}
.nav a:hover {color:#fff}

#about {background:#009900;
width: 100%; height: 220px;
color:#FFFFFF;
font-family: Arial, Serif;
text-align:center;
font-size:20px;
top:410px;
position:absolute;
left:0px;
}

h1.about {padding:0px;
font-family:Candice;
font-size: 50px;
color:#FFFFFF;}

.lion
{
background-color:#00CC00; 
width:40%; 
height:45%;
position:absolute;
top:160%;
left:5%;
padding:5px;
}
.tiger
{
background-color: #00CC00; 
width:40%; 
height:45%;
position:absolute;
top:160%;
left:53%;
padding:5px;
}
.monkey
{
background-color: #00CC00; 
width:40%; 
height:45%;
position:absolute;
top:220%;
left:5%;
padding:5px;
}
.cheetah
{
background-color:#00CC00; 
width:40%; 
height:45%;
position:absolute;
top: 220%;
left:53%;
padding:5px;
}
.hippo
{
background-color: #00CC00; 
width:40%; 
height:45%;
position:absolute;
top: 280%;
left:5%;
padding:5px;
}
.owl
{
background-color: #00CC00; 
width:40%; 
height:45%;
position:absolute;
top:280%;
left:53%;
padding:5px;
}
.lion, .tiger, .monkey, .cheetah, .hippo, .owl
{
border-radius: 15px;
border-top-left-radius:15px;
border-bottom-left-radius:15px;
border-top-right-radius:15px;
border-bottom-right-radius:15px;
-moz-border-radius: 15px;
}
.image
{
border-radius: 50px/50px;;
border:2px solid white; 
width:100px;
height:100px;
margin-top:10px;
}
.content
{ 
font-family:"Arial";
font-size: 16px;
color:#FFFFFF;
}
.footer 
{
background:#03406A;
width: 100%; height: 10px;
padding:24px;
text-align: center;
color:white;
font-size:12px;
position:absolute;
top: 300%;}

.meet {top:590px;
width:100%;
font-family:'century gothic';
font-size:30px;
color:#FFF;
position:absolute;
}
.content2{
background-attachment:scroll;
background-color:#000000;}

.nav2 {
width:100%;
height:10%;
padding-top: 2%;
background:#cc9900;
text-align:center;
}
.nav2 ul {
	margin: 0;
	padding: 0;
}
.nav2 li {
	margin: 0 5px 10px 0;
	padding: 0;
	list-style: none;
	display: inline-block;
}
.nav2 a {
	padding: 3px 12px;
	text-decoration: none;
	line-height: 100%;
}
.nav2 a:hover {
	color: #000;
}


.nav.left ul {
text-align:center;
}
}
