@import url(reset.css);

body {
background: #999 url(../images/locker_bg.gif) repeat-x;
font-family: Verdana, Helvetica,Arial, sans-serif; 
color: #245624;
font-size: 1em;}

img, #container, #masthead, #branding, #nav_main, h1, #sidebarg, h2, #sidebarw, #sidebarm, #sample, #copy { behavior: url(http://www.describe.org/projects/describe/styles/iepngfix.htc); }

#container {
width: 994px;
height: 676px;
background: #999 url(../images/locker_container_bg.gif) repeat-y;
}

/*'margin: 0 auto' is necessary so the layout stays centered on screen when browser width is more than 1200px */
#container,#site_info {
	margin: 0 auto; 
	/*min-width: 800px;
	max-width: 75em;  1200px/16=75*/
}

#masthead, #nav_main, #branding {
margin:0;
}


a:link, a:active, a:visited {
color: #245624;
}


/*************************Branding********************/
/*#branding, #nav_main, #site_info, #content {
width:100%;
}*/

#masthead {
position: relative;
background: #ccc url(../images/locker_top.gif) no-repeat;
width: 994px;
height: 92px;
}


#branding {
height: 63px;
position: relative;
top: 23%;
left: 25%;
z-index: 10;
background: url(../images/faceplate_500.png) no-repeat 0 center;}

#branding p {
position: absolute;
top: -9999px;
}

#nav_main, #site_info {
margin: 0;
}

h1 a {
display: block;
height: 55px;
background: url(../images/branding_crop.png) no-repeat center;
}

h1 {
position: absolute;
top: 8%;
left: 15%;
width: 214px;
background: url(../images/branding_crop.png) no-repeat center;
text-indent: -9999px;
}


/*************************Navigation********************/

#nav_main {
position: relative;
height: 50px;
background: url(../images/masking_tape.png) no-repeat top center;
width:880px;
margin:auto;}

#nav_main h2 {
position: absolute;
text-indent:-9999px;
z-index: 6;
height: 63px;
}

ul#nav_features {
position: absolute;
top: 17px;
left: 15%;
width: 80%;
height: 50px;
}

/* html ul#nav_features {margin-top:-60px;} */

#nav_features li {
display: inline;
}

ul#nav_features li a {
margin-right: 10px;
padding-right: 10px;
text-decoration: none;
font-weight:bold;}

ul#nav_features li a:hover {
	color: #990000; 
}
li#nav_motion a, li#nav_contact a {
margin-right: 0;
padding-right: 0;
}

li#nav_about a {
position: absolute;
right: 165px;
}

li#nav_contact a {
position: absolute;
right: 70px;
}

/*************************Content********************/


#content {
position: relative;
float: left;
display: inline;
z-index: 12;
/*height: 200px;*/
/*margin: 0 5px 0 5px;*/
height: 471px;
width: 453px;
background: url(../images/postcard.png) no-repeat;
margin: -1em 10px 0 63px;
}

#content p {
position: absolute;
margin: 0;
top: 40px;
left: 7px;
width: 225px;
}

#secondary_content {
float: left;
width: 467px;
display: inline;}

#secondary_content h2 {
position: absolute;
text-indent: -9999px;
}

#content_items {
position: relative;
}

li#content_words h3 {
position: absolute;
top: 1.75em;
left: -10px;
width: 118px;
height: 116px;
text-indent: -9999px;
z-index: 18;
}

li#content_words h3 a {
display: block;
height: 116px;
background: url(../images/content_words.png) no-repeat;
}

#card {
position: absolute;
top: -.5em;
left: 14px;
width: 355px;
height: 205px;
z-index: 16;
background: url(../images/werdz_card.png) no-repeat;
}

#card p {
position: relative;
top: 23%;
left: 23%;
margin: 1%;
width: 275px;}

li#content_graphics h3 {
position: absolute;
top: 3.5em;
left: -225px;
width: 120px;
height: 118px;
text-indent: -9999px;
z-index: 18;
}

li#content_graphics h3 a {
display: block;
height: 118px;
background: url(../images/content_graphics.png) no-repeat;
}

#ad {
position: absolute;
top: 5.5em;
left: -225px;
width: 205px;
height: 405px;
z-index: 16;
background: url(../images/newspaper_ad.png) no-repeat;
}

#ad p, hr {
position: relative;
top: 15%;
padding-left: 1em;
padding-right: 1em;}

#ad hr {
color: #245624;
width: 75%;
}

#ad img {
position: relative;
top: 15%;
padding: 0;}

li#content_motion h3 {
position: absolute;
top: 180px;
right: 50px;
width: 118px;
height: 116px;
text-indent: -9999px;
z-index: 18;}

li#content_motion h3 a {
display: block;
height: 116px;
background: url(../images/content_motion.png) no-repeat;
}

#scrap {
background: url(../images/note_paper.png) no-repeat;
width: 300px;
height: 154px;
z-index: 15;
position: absolute;
top: 280px;
right: 105px;


#scrap p {
position: absolute;
top: 23%;
left: 23%;
padding-top: 1em;
width: 290px;}

/*************************Site Info********************/

#site_info {
clear: both;
width: 994px;
height: 32px;
z-index: 31;
font-size: .8em;
background: url(../images/locker_bottom.gif) no-repeat;
margin: 0 auto;}

#site_info h4 {
margin: 0 628px 0 60px;
display: inline;}

#site_info p {
display: inline;
}

#site_info a {
text-decoration: none;}

#site_info a:hover {
color: #990000;}