@import url(reset.css);

body { font-size: 75%; font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;}

#wrap { max-width: 96em; border: 1px solid #000;} 
#wrap, #header, #main, #footer { margin: 0 auto; width: 960px; width: expression(document.body.clientWidth > 960? "960px" : "auto"); background: #fff;}
#main { padding: 0 0 .5em 0;}

#header { border-bottom: 1px solid #000;}
#hdr2 h1 { text-align: center; display: block; font-weight: bold; font-size: 2em; line-height: 3em;}
#hdr2 h2 { text-align: center; font-size: 1.5em; line-height: 2em; background-color: #ccc; border-top: 1px solid #000; border-bottom: 1px solid #000; margin-bottom: .5em;}

h3,  h4 { display: block; margin-bottom: .5em;}
h3 { font-size: 1.5em; margin-top: .5em;}
h4 { font-size: 1.25em;}

p { font-size: 1em; line-height: 2em;}
a { color: #000;}

#bottomform { width: 100%; border-bottom: 1px solid #000;}

#request { float: left; padding: 15px; width: 590px; border-right: 1px solid #000;}
#request ul li { font-size: 1em; list-style: none; text-decoration: none;}

#equip { float: right; padding: 15px; width: 300px;}
#equip ul li, #add_equip ul li, #content ul li { font-size: 1em;}
#equip ul li { margin-left: 2em; line-height: 1.5em;}

#food_request { float: left; padding: 15px; width: 300px; border-top: 1px solid #000; border-right: 1px solid #000;}

#add_equip { float: right; padding: 15px; width: 599px; border-top: 1px solid #000;}

#food_request h4, #add_equip h4 { margin: 1em 0;}
#food_request ul li, #add_equip ul li { list-style: none; font-size: 1em;}

/* horizontal navigation bar */
#navbar_h { width: 100%; float: left; line-height: 2em; background-color: #ccc; border-top: 1px solid #000;border-bottom: 1px solid #000;}
#navbar_h ul { font-size: 1em; letter-spacing: .1em;}
#navbar_h ul li { display: inline; }
#navbar_h ul li a { padding: .25em .75em; float: left; text-decoration: none; border-right: 1px solid #000; background-color: #ccc;}
#navbar_h ul li a:hover, #navbar_h ul li a:focus { color: #000; background-color: #fff;}

/* bottom navigation bar */
#navbar_b { margin-left: 1em; }
#nav_b { list-style: none; padding: .25em;}
#nav_b li { display: inline;}
#nav_b li:before { content: "| "; }
#nav_b li:first-child:before { content: ""; }

/*IE workaround*/
/*All IE browsers*/
* html #nav_b li { border-left: 1px solid black; padding: 0 .5em; margin: 0 .5em 0 -.5em;}
/*Win IE browsers - hide from Mac IE\*/
* html #nav_b { height: 1%; }
* html #nav_b li { display: block; float: left;}
/*End hide*/
/*Mac IE 5*/
* html #nav_b li:first-child { border-left: 0;}
#navbar_b ul li a:hover, #navbar_b ul li a:focus, #navbar_b li#active { color: #322559; text-decoration: underline;}
#nav_b p, #nav_b a { font-size: 1em; text-decoration: none;}

#footer { font-size: 1em; padding: .5em 0; clear: both; border-top: 1px solid #000;}

/*	FORMs	*/
form { margin-bottom: 1.5em;}
fieldset { padding: 1em 0;} 
legend { font-size: 1.25em; margin: .5em 0} 
.submit {  margin: 1em auto;}
span.req { color: #f00; font-weight: bold;}
label { display: block; text-align: left; width: 100%; font-size: 1em; margin: 5px 0 10px 0;}
.checkbox label { display: inline; padding: 0 0 0 .75em; line-height: 1.5em;}

/*	media query testing*/
@media screen and (max-width: 660px) {

#wrap, #header, #main, #footer { margin: 0 auto; width: 600px;}
#request { border-bottom: 1px solid #000; clear: both;}
#equip { float: left; border-left: 1px solid #000;}
#food_request { float: right; border-left: 1px solid #000; border-right: 0;}
#add_equip { }

/* horizontal navigation bar */
#navbar_h ul { letter-spacing: 0;}
#navbar_h ul li a { padding: .25em;}
}

/* end media query testing */