body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td 
{ margin : 0; padding : 0; }

/* Normalizes font-size for headers */
h1,h2,h3,h4,h5,h6 { font-size : 100%; }

/* Removes list-style from lists */
ol,ul { list-style : none; }

/* Normalizes font-style and font-weight to normal */
address, caption, cite, code, dfn, em, strong, th, var
{ font-style : normal; font-weight : normal; }

/* Removes list-style from lists */
table { border-collapse : collapse; border-spacing : 0; }

/* Removes border from fieldset and img */
fieldset,img { border : 0; }

/* Left-aligns text in caption and th */
caption,th { text-align : left; }

/* Removes quotation marks from q */
q:before, q:after { content :''; }

html{
text-align:center;
background-color:#33CCCC;
}
body { 
position : relative; 
width :720px; 
margin:0 auto; 
text-align:left;
margin-top:70px;
}
div#container {
background-color:#c0d264;
}
h1{
position:absolute;
left:0;
top:-56px;
width:350px;
height:300px;
background:url(scoobydoo2.png) no-repeat top left;
text-indent:-9999px;
}
h2{
position: relative;
left:44%;
top:20px;
width:50%;
background:url(thebeauty.png) no-repeat;
}
h2 span{ visibility:hidden}
p{
text-align:justify
}
div#quickSummary{
position: relative;
left:44%;
top:20px;
width:44%;
padding:0 70px 120px 0;
background:url(scoobuety2.png) no-repeat bottom right;
}
div#preamble{
position:relative;
left:25%;
top:50px;
width:50%;
background:url(scoovelma2.png) no-repeat left bottom;
padding:50px 0 0 90px;
margin-left:20px;
}
/*inner container*/div#supportingText{
position: relative;
left:25%;
top:-80px;
width:72%;
margin-top:160px;
}


div#explanation {
position: relative;
top:0;
left:0;
width:46%;
padding-top:50px
}  
div#participation {
position: relative;
top:0;
left:-60px;
width:56%;
padding-top:50px;

}
div#benefits {
position: relative;
top:0;
left:0;
width:56%;
padding-top:30px;
}  
div#requirements { 
position: absolute;
top:0;
left:53%;
width:50%;
padding-bottom:230px;
background:url(scoobyteam2.png) no-repeat bottom center;
}
div#footer{
position: relative;
width:720px;
height:22px;
left:-180px;
text-align:center;
background: url(footer.png) no-repeat #59216B;/*purple*/
padding-top:5px;
top:70px
}




div#linkList{
position:absolute;
top:120px;
left:0;
width:201px;
padding-bottom:120px;
background:url(scoobaggy2.png) no-repeat bottom center;
}


/* typography.css */
body{ 
font:72%/1.5 "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, sans-serif;
color:#333;
}
/*h1,*/ h2, h3, h4, p, ul, blockquote{
margin:0 20px .75em 20px;
}
h1, h2, h3{
margin-bottom:.15em;
font:200% "Trebuchet MS", "Lucida Grande","Lucida Sans Unicode", Verdana, sans-serif; 
font-weight:bold; 
letter-spacing:-1px;
}
h2,h3{
font-size:170%
}
p{ 
font-size:100%;
}
h1, h2, h3{ 
color:#88a308;
}
a:link, a:visited{ 
text-decoration:none;
}
a:link, a:visited{ 
color:#f90;
}
div#lselect li{text-align:center;
}
div#lselect  a{
display:block;/*gets rid of the bullet points*/
outline:none;/*gets rid of the ugly dotted lines when clicked on*/
background-color: #59216B ;/*purple*/
padding:5px 0 5px 0;
background-image:url(but4.png);
}
div#linkList2  a.c{
background-color:#c0d264;
padding:0 0 2px 0;
}
div#linkList2 a.c:hover{ background-color:#c0d264;}
div#lselect a:hover{
background-color: #765AA3;/*light purple*/
}
div#lselect a:active{/*when clicked on*/
/*background-color: #4B5636;works in firefox but not in IE, but thats not a problem for look or usability*/
}
div#linkList2 #lselect li{ 
margin:0 0 5px;
/*border: solid  #CCCCCC 1px;
*/padding-top:1px
}

div#lselect li{
border-top:none;
}
#lselect h3{
margin-bottom:10px;
}
#larchives li, #lresources li{
/*border-top:solid 1px #CCCCCC;
*/padding:4px 0 4px ;
}
a{outline:none;}
#lresources ul{
/*background: url(scooby-doo.jpg) no-repeat bottom left ;
padding-bottom:120px;*/
}
h3{
text-align:left;
}
#lselect h3{ text-align:center;}
