/* 
	==============================
	
	absenter.org stylesheet 
	by nazarin hamid
	for http://www.weightshift.com
	naz@absenter.org
	
	feel free to learn from the
	code, but do not take it and
	use it as is for your own.
	re-use the code in your own
	way. use it as a starting 
	point, not as a standalone
	layout.
	
    ==============================
*/

* { margin: 0; padding: 0; }

* html body #bird { 
position: absolute; 
top: 50%; left: 50%;
width: 800px; height: 10px;
margin: 204px auto auto -400px;
}

/* standard ======================= */

body {
color: #EFEFEF;
background: #FFFFFFF;
font-family: lucida sans unicode, lucida grande, verdana, arial, trebuchet MS, sans;
font-size: 11px;
text-align: center;
margin: 0 auto 0 auto;
padding: 0;
}

img { border: 0; }

a:link { color: #FFFFFF; text-decoration: none; }
a:visited { color: #FFFFFF; text-decoration: none; }
a:hover { color: #FFFFFF; text-decoration: underline; }
a:active { color: #FFFFFF; text-decoration: none; }

#center {
position: absolute;
top: 50%;
left: 50%;
width: 800px;
height: 630px;
margin-top: -315px;
margin-left: -400px;
}

#about {
position: absolute;
top: 50%;
left: 50%;
width: 690px;
height: 630px;
margin-top: -315px;
margin-left: -345px;
}

#bird {
position: absolute;
top: 50%;
left: 50%;
width: 800px;
height: 10px;
margin-top: 207px;
margin-left: -400px;
background: url(../gfx/masthead_bird.png) no-repeat;
}

#photo {
width: 800px;
height: 531px;
margin: 0px auto 0 auto;
}

#title {
width: 273px;
height: 56px;
background: url(../gfx/masthead_title.png) no-repeat;
}

#title p {
text-align: left;
padding: 29px 15px 15px 18px;
}

#nav {
width: 257px;
height: 43px; 
}

#col-one { float: left; width: 257px; height: 99px; }
#col-two { float: left; width: 273px; height: 99px; }
#col-three { float: left; width: 260px; height: 99px; background: url(../gfx/masthead_notes.png) no-repeat; }

#col-three p {
text-align: left;
padding: 29px 15px 15px 18px;
}

#col-three a { text-transform: uppercase; font-size: 10px; }

#col-two-wide { float: left; width: 543px; height: 99px; background: url(../gfx/about_dotted.gif) no-repeat; }

#col-two-wide p { text-align: left; padding: 70px 15px 0px 18px; }

#logo a { width: 257px; height: 56px; display: block; }
#logo a:hover { width: 257px; height: 56px; background-color: #000000; display: block; }

#prev a { width: 135px; height: 43px; display: block; float: left; }
#prev a:hover { width: 135px; height: 43px; background-color: #000000; display: block; float: left; }

#next { float: left; width: 138px; height: 43px; background: url(../gfx/masthead_next_non.png) no-repeat; }
#next a { width: 138px; height: 43px; display: block; float: left; }
#next a:hover { width: 138px; height: 43px; background-color: #000000; display: block; float: left; }

#support { background: url(../gfx/support.jpg) no-repeat; width: 800px; height: 531px; }

#support p { text-align: left; padding: 40px 40px 40px 40px; }

#support p.col { float: left; width: 150px; }

/* classes ======================== */

.masthead { width: 800px; height: 99px; margin: 0 auto 20px auto; }

a.over:hover { background-color: #000000; }

#storage-masthead { background: url(../gfx/storage.jpg) #514739 no-repeat; width: 708px; margin: 0px auto 15px auto; }

.storage {
width: 712px;
text-align: left; 
margin: 0 auto 20px auto;
clear: both;
}

.storage img {
background-color: transparent;
border: 1px solid #CCC;
padding: 5px;
margin: 2px 2px 2px 2px;
}

.storage a:hover img {
background-color: #000000;
border: 1px solid #000000;
margin: 2px 2px 2px 2px;
}