h1 {
text-align:center;
}


<style type="text/css"> 
html{ width:100%; height:100%; } 
body{ width:100%; height:100%;
background-color:#000000;
}


a.nav1:link,a.nav1:visited {
display:block;
font-weight:bold;
color:black;
background-color:yellow;

padding-top: 23%;
position: absolute;
top:1px;
bottom: 1px;
width:20%;
text-align:center;
text-transform:uppercase;
text-decoration:none;

}
a.nav1:hover,a.nav1:active
{
background-image:url("images/me.jpg");
background-repeat:no-repeat;
background-position:center;
text-indent:-1000px;
background-color:black;
}

a.nav2:link,a.nav2:visited {
display:block;
font-weight:bold;
color:black;
background-color:#f660ab;
padding-top: 23%;
position: absolute;
top:1px;
	bottom: 1px;
width:20%;
left:20%;
height: max-height;
text-align:center;
text-transform:uppercase;
text-decoration:none;
}
a.nav2:hover,a.nav2:active
{
background-image:url("images/ana.jpg");
background-repeat:no-repeat;
background-position:center;
text-indent:-1000px;
background-color:orange;
}


a.nav3:link,a.nav3:visited {
display:block;
font-weight:bold;
color:white;
background-color:black;
padding-top: 23%;
position: absolute;
top:1px;
bottom: 1px;
width:20%;
left:40%;
text-align:center;
text-transform:uppercase;
text-decoration:none;
}
a.nav3:hover,a.nav3:active
{
background-image:url("images/killoandails.jpg");
background-repeat:no-repeat;
background-position:center;
text-indent:-2000px;
background-color:white;
color:black;
}

 
a.nav4:link,a.nav4:visited{
display:block;
font-weight:bold;
color:black;
background-color:#f660ab;
padding-top: 23%;
position: absolute;
top:1px;
bottom: 1px;
width:20%;
left:60%;
text-align:center;
text-transform:uppercase;
text-decoration:none;
}
a.nav4:hover,a.nav4:active
{
background-image:url("images/roarandcian.jpg");
background-repeat:no-repeat;
background-position:center;
text-indent:-2000px;
background-color:orange;
}

a.nav5:link,a.nav5:visited{
display:block;
font-weight:bold;
color:black;
background-color: yellow;
padding-top: 23%;
position: absolute;
top:1px;
bottom: 1px;
width:20%;
left:80%;
text-align:center;
text-transform:uppercase;
text-decoration:none;
}
a.nav5:hover,a.nav5:active
{
background-image:url("images/ruadhai.jpg");
background-repeat:no-repeat;
background-position:center;
text-indent:-10000px;
background-color:black;

}

#container{
	position:relative;
	left:10%;
	width:80%;
	top:15%;
	
	height:100%;

}
body.body1 {
	background-color:yellow;
	color:black;
}
body.body2 {
	background-color:#f660ab;
	color:black;
}
body.body3 {
	background-color:black;
	color:white;
}