/*
Theme Name: DonateLife Midwest Website
Theme URI: http://www.life-source.org
Description: Theme for DonateLife Midwest website
Version: 1.0
Author: Adam Meyer
Author URI: http://www.thinkinterval.com
*/

/* Helpful resets ------------------------------- */
* {margin: 0; padding: 0;}


/* HTML element global styling ------------------ */
body{text-align: center; font-family: Arial, Verdana; font-size: 15px;}
p{line-height: 150%; margin-bottom:12px;}
li{line-height: 150%; margin-bottom:12px;}
h1, h2, h3, h4, h5{font-family: "Trebuchet MS", Arial, Verdana;}
h1{font-size:30px; margin-bottom:12px;}
h2{font-size:26px; margin-bottom:12px;}
h3{font-size:21px;}
h4{font-size:17px; line-height: 150%;}
img{border:none;}
ul{list-style: none;}
a{color:#9c3d11; text-decoration: none;}


/* Main page structure -------------------------- */
#main-wrapper{position:relative; width:810px; text-align: left; margin: auto; margin-bottom:30px; margin-top:10px;}

#header,
#header-sub1{position:relative; width:810px; height:369px; background-image: url(); background-repeat: no-repeat;}
#header-sub1{position:relative; background-image: url(i/header-subpage-1.jpg); height:141px;}

#logo{position:absolute; top:9px; left:27px; z-index: 2;}
#content-wrapper{position:relative; background-image: url(i/bg-content-horz.gif); background-repeat: repeat-y;}
#content, #content-home{position:relative; float:right; width:370px; padding-top:20px; display: inline; margin-right:25px;}
#sidebar, #sidebar-home{position:relative; float:left; width:370px; padding-top:20px; padding-bottom:40px; display: inline; margin-left:25px;}

#content-page{position:relative; float:right; width:580px; padding-top:20px; display: inline; margin-right:25px;}
#sidebar-page{position:relative; float:left; width:160px; padding-top:20px; display: inline; margin-left:25px;}

#footer{clear:both; height:75px; font-size:10px; background-image: url(i/bg-footer.jpg); background-repeat: no-repeat; padding:33px 0 0 225px; color:#999999;}


/* Navigation ------------------------------ */
#state-nav ul{position: absolute; width:650px; height:25px; top:20px; left:153px;}
#state-nav li{float:left; background-repeat:no-repeat; height:25px; margin-right:55px;}
#state-nav li a{display: block; width:103px; height:25px;}
#state-nav li.mn{background-image: url(i/nav-state-mn-gray.jpg);}
#state-nav li.nd, #state-nav li.nd-black{background-image: url(i/nav-state-nd-gray.jpg); width:130px;}
#state-nav li.sd, #state-nav li.sd-black{background-image: url(i/nav-state-sd-gray.jpg); width:130px;}
#state-nav li.wi{background-image: url(i/nav-state-wi-gray.jpg); margin-right:0px;}

#state-nav li.mn-black{background-image: url(i/nav-state-mn-black.jpg);}
#state-nav li.nd-black{background-image: url(i/nav-state-nd-black.jpg);}
#state-nav li.sd-black{background-image: url(i/nav-state-sd-black.jpg);}

#state-nav li.mn:hover{background-image: url(i/nav-state-mn-black.jpg);}
#state-nav li.nd:hover{background-image: url(i/nav-state-nd-black.jpg); width:130px;}
#state-nav li.sd:hover{background-image: url(i/nav-state-sd-black.jpg); width:130px;}
#state-nav li.wi:hover{background-image: url(i/nav-state-wi-black.jpg); margin-right:0px;}

#menu{position:relative; height:80px; width:800px; margin-left:5px;}
#menu li{position:absolute; top:0;}
#menu li a{display:block; width:200px; height:80px; background-repeat: no-repeat;}

#menu li.a, #menu li.a-mn, #menu li.a-sd, #menu li.a-active{
background-image: url(i/nav-main-1.gif); background-repeat: no-repeat; left:0;}

#menu li.a, #menu li.a-active{left:0;}
#menu li.b, #menu li.b-active{left:200px;}
#menu li.c, #menu li.c-active{left:400px;}
#menu li.d, #menu li.d-active{left:600px;}

#menu li.a a{background-image: url(i/nav-main-1.gif);}
#menu li.b a{background-image: url(i/nav-main-2.gif);}
#menu li.c a{background-image: url(i/nav-main-3.gif);}
#menu li.d a{background-image: url(i/nav-main-4.gif);}

#menu li.a a:hover,
#menu li.b a:hover,
#menu li.c a:hover,
#menu li.d a:hover{background-position:0px -80px;}

#menu li.a-active a{background-image: url(i/nav-main-1.gif); background-position:0px -160px;}
#menu li.b-active a{background-image: url(i/nav-main-2.gif); background-position:0px -160px;}
#menu li.c-active a{background-image: url(i/nav-main-3.gif); background-position:0px -160px;}
#menu li.d-active a{background-image: url(i/nav-main-4.gif); background-position:0px -160px;}

#menu li.a-mn,
#menu li.a-nd{background-image: url(i/nav-main-mn-1-active.gif);}
#menu li.a-sd{background-image: url(i/nav-main-sd-1-active.gif);}


/* Header elements */
#header h1 a{position:absolute; display:block; width:800px; height:315px; top:50px; left:5px; z-index: 1;}


/* Footer elements */
#footer p{font-size: 12px; line-height:160%;}


/* Sidebar elements */
#sidebar-page p, #sidebar-page li{font-size:12px}
ul.sidebar li{border-bottom:1px solid #0076a3; padding:2px 0 2px 0; margin:0;}


/* Random */
#video{width:370px; height:220px; background-color:#444444; margin-bottom:10px;}
p.caption{font-size:11px;}
p.sm-btns img.btn-facebook{margin-right:5px;}
p.top-link{background-color:#c2d7f4; padding:2px 0 2px 8px;}
ul.bullet{list-style: disc; padding-left:20px;}


/* Utilities ------------------- */
.hidden{display:none;}


/* SPECIAL --------------------- */
#campaign2010{}
#campaign2010 a{}
#header-campaign2010{position:relative; width:810px; height:544px; background-image: url(i/feature-2010-campaign-lander.jpg); background-repeat: no-repeat;}

#campaign2010 a.erickson{position: absolute; width:50px; height:85px; top:145px; left:75px; z-index: 10;}
#campaign2010 div.erickson{background-image: url(i/2010-campaign-popups/steve.gif); background-repeat: no-repeat; position: absolute; width:406px; height:198px; top:200px; left:25px;}

#campaign2010 a.halley{position: absolute; width:85px; height:70px; top:65px; left:330px; z-index: 10;}
#campaign2010 div.halley{background-image: url(i/2010-campaign-popups/halley.gif); background-repeat: no-repeat; position: absolute; width:406px; height:198px; top:130px; left:58px;}

#campaign2010 a.lajuana{position: absolute; width:50px; height:95px; top:140px; left:585px; z-index: 10;}
#campaign2010 a.lajuana2{position: absolute; width:100px; height:70px; top:165px; left:640px; z-index: 10;}
#campaign2010 div.lajuana{background-image: url(i/2010-campaign-popups/lajuana.gif); background-repeat: no-repeat; position: absolute; width:406px; height:198px; top:200px; left:300px;}

#campaign2010 a.melinda{position: absolute; width:40px; height:55px; top:70px; left:226px; z-index: 10;}
#campaign2010 div.melinda{background-image: url(i/2010-campaign-popups/melinda.gif); background-repeat: no-repeat; position: absolute; width:406px; height:198px; top:115px; left:160px;}

#campaign2010 a.kayla{position: absolute; width:80px; height:50px; top:80px; left:550px; z-index: 10;}
#campaign2010 a.kayla2{position: absolute; width:40px; height:40px; top:80px; left:675px; z-index: 10;}
#campaign2010 div.kayla{background-image: url(i/2010-campaign-popups/kayla.gif); background-repeat: no-repeat; position: absolute; width:406px; height:198px; top:130px; left:310px;}

#campaign2010 a.anna{position: absolute; width:35px; height:50px; top:110px; left:490px; z-index: 10;}
#campaign2010 a.anna2{position: absolute; width:100px; height:50px; top:110px; left:635px; z-index: 10;}
#campaign2010 a.anna3{position: absolute; width:20px; height:50px; top:135px; left:570px; z-index: 10;}
#campaign2010 div.anna{background-image: url(i/2010-campaign-popups/anna.gif); background-repeat: no-repeat; position: absolute; width:406px; height:205px; top:160px; left:270px;}