
/*** GENERAL STYLES ***/

body {background: #fff url(../images/bkg.gif); text-align: center; margin: 0; padding: 0;}
body, th, td, h1, h2, h3, h4, h5, h6, select, input, textarea {font-family: verdana, arial, helvetica, sans-serif; font-size: 11px; color: #333;}
body, th, td, h1, h2, h3, h4, h5, h6 {line-height: 14px;}
form, h1, h2, h3, h4, h5, h6 {margin: 0; padding: 0;}

img, table, fieldset {border: 0;}
ul, ul li {list-style: none; margin: 0; padding: 0;}
p {margin: 0 0 1em 0;}
a {text-decoration: none;}
a:hover {text-decoration: underline;}

.hide {display: none;}
.alert {color: #c00;}
.small, .small td {font-size: 10px; line-height: 12px;}
.large {font-size: 13px; line-height: 17px;}
.nowrap {white-space: nowrap;}

.bluetext {color: #3faffb;}
.orangetext {color: #f7763e;}
.purpletext {color: #666699;}
.pinktext {color: #e44e6b;}
.greentext {color: #6cab44;}

.floatleft {float: left;}
.floatright {float: right;}
.imgleft {float: left; margin: 0 25px 15px 0;}
.imgright {float: right; margin: 0 0 15px 25px;}
.textleft {text-align: left;}
.textcenter {text-align: center;}
.textright {text-align: right;}

.spacer {float: none; clear: both; height: 1px; overflow: hidden;}
.hr {float: none; clear: both; height: 1px; overflow: hidden; background: #ccc; margin: 2em 0;}
td.hr {height: 1px; line-height: 1px; background: #ccc; border: solid #fff; border-width: 10px 0; margin: 0; padding: 0;}
.clear {float: none; clear: both;}

.half {width: 50%;}
.third {width: 33%;}
.twothird {width: 60%;}
.quarter {width: 25%;}
.threequarter {width: 70%;}

.ir {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
a .ir {cursor: pointer;}


/*** STRUCTURAL STYLES ***/

#outer {position: relative; margin: 44px auto; text-align: left; width: 959px; height: 594px; background: #fff url(../images/outer.jpg);}
body.intro #outer {width: 507px; height: 203px; padding: 320px 0 0 40px; background-image: url(../images/outer-intro.jpg);}
body.video #outer {background-image: url(../images/outer-video.jpg);}

#main {position: absolute; left: 312px; top: 56px; width: 513px; height: 343px; padding: 102px 22px 0 61px; z-index: 1;}
body.intro #main {position: static; width: 468px; height: 135px; padding: 0;}
body.video #main {top: 75px; width: 541px; height: 430px; padding: 0; background: #f0f !important;}
body.blue #main {background: url(../images/main-blue.gif);}
body.green #main {background: url(../images/main-green.gif);}
body.orange #main {background: url(../images/main-orange.gif);}
body.purple #main {background: url(../images/main-purple.gif);}
body.pink #main {background: url(../images/main-pink.gif);}

#printlogo {display: none;}

#header {position: absolute; left: 30px; top: 30px; width: 536px; height: 59px; background: center bottom no-repeat; text-align: center; font-family: arial, sans-serif; color: #999; font-size: 21px; font-weight: normal; overflow: hidden; line-height: 64px;}
body.intro #header {position: absolute; left: 0; top: 0; width: 547px; height: 142px; line-height: 142px; text-align: center; font-size: 17px; font-weight: normal;}
body.video #header {display: none;}
body.blue #header {background-image: url(../images/header-blue.gif);}
body.green #header {background-image: url(../images/header-green.gif);}
body.orange #header {background-image: url(../images/header-orange.gif);}
body.purple #header {background-image: url(../images/header-purple.gif);}
body.pink #header {background-image: url(../images/header-pink.gif);}
#header .ir {height: 50px;}
body.intro #header .ir {height: 142px; background: url(../images/outer-intro.jpg) 0 0 !important;}

#content {position: relative; height: 312px; overflow: auto; padding-right: 30px; z-index: 5;}
body.intro #content {position: static; height: auto; padding: 0; overflow: visible;}
body.video #content {height: auto; padding: 0; overflow: visible;}

body.blue #content a {color: #3faffb;}
body.orange #content a {color: #f7763e;}
body.purple #content a {color: #666699;}
body.pink #content a {color: #e44e6b;}
body.green #content a {color: #6cab44;}

#enterthesite {position: absolute; right: 33px; bottom: 36px; width: 84px; height: 24px; text-align: center; line-height: 24px;}
#enterthesite .ir {background: url(../images/outer-intro.jpg) -430px -463px;}

#footer {position: absolute; left: 0; bottom: -30px; width: 959px; text-align: center; font-size: 10px;}
body.intro #footer {display: none;}
#footer a {padding: 0 10px;}

#popprint {position: absolute; right: 80px; top: 80px; z-index: 100; padding-right: 20px; background: url(../../images/print.gif) right center no-repeat; line-height: 16px; font-size: 10px;}
#print {display: none; padding-right: 20px; background: url(../../images/print.gif) right center no-repeat; line-height: 16px; font-size: 10px;}
body.noprint #popprint {display: none;}
#watchourvideo {position: absolute; right: 95px; bottom: 72px; font-size: 10px;}

body.intro #popprint, body.intro #print, body.intro #watchourvideo, body.video #popprint, body.video #print, body.video #watchourvideo {display: none;}

#flowerbluesw, #flowerbluese, #flowerorangesw, #flowerpinksw {position: absolute; bottom: 17px; display: none; z-index: 1;}
#flowerbluesw {width: 173px; height: 147px; left: 13px; background: url(../images/flower-blue-sw.gif);}
#flowerbluese {width: 181px; height: 150px; right: 14px; background: url(../images/flower-blue-se.gif);}
#flowerorangesw {width: 177px; height: 158px; left: 13px; background: url(../images/flower-orange-sw.gif);}
#flowerpinksw {width: 177px; height: 158px; left: 13px; background: url(../images/flower-pink-sw.gif);}
body.flowerbluesw #flowerbluesw {display: block;}
body.flowerbluese #flowerbluese {display: block;}
body.flowerorangesw #flowerorangesw {display: block;}
body.flowerpinksw #flowerpinksw {display: block;}

#nav {position: absolute; left: 31px; top: 76px; width: 189px; height: 246px; padding: 90px 22px 0 23px;}
body.intro #nav {display: none;}
body.blue #nav {background: url(../images/nav-blue.jpg);}
body.green #nav {background: url(../images/nav-green.jpg);}
body.orange #nav {background: url(../images/nav-orange.jpg);}
body.purple #nav {background: url(../images/nav-purple.jpg);}
body.pink #nav {background: url(../images/nav-pink.jpg);}
#nav li {margin-bottom: 3px;}
#navhome {position: absolute; left: 23px; top: 22px;}
#navhome a {display: block; width: 189px; height: 63px; line-height: 300px; overflow: hidden;}
#navdonate {position: absolute; left: 23px; bottom: 20px; margin: 0;}
#nav a:hover {text-decoration: none;}

a.barblue, a.barorange, a.barpurple, a.barpink, a.bargreen {display: block; line-height: 17px; color: #fff !important; font-weight: bold; font-size: 10px; padding: 0 7px; background: url(../images/a-bar.png) no-repeat; width: 175px; text-decoration: none;}
a.barblue {background-color: #3faffb;}
a.barorange {background-color: #f7763e;}
a.barpurple {background-color: #666699;}
a.barpink {background-color: #e44e6b;}
a.bargreen {background-color: #6cab44;}
p a.barblue, p a.barorange, p a.barpurple, p a.barpink, p a.bargreen {float: left; margin: -5px 5px 0 0;}

#nav ul {display: none;}
#nav li.on ul {display: block; padding-top: 2px;}
#nav ul li {margin: 0; line-height: 13px;}
#nav ul a {display: block; font-size: 10px; color: #73716e; padding-left: 8px; width: 181px;}

#nav li li a {background: url(../images/arrow-gray.gif) 2px 5px no-repeat;}
#nav li.navblue li.on a {background-image: url(../images/arrow-blue.gif);}
#nav li.navorange li.on a {background-image: url(../images/arrow-orange.gif);}
#nav li.navpurple li.on a {background-image: url(../images/arrow-purple.gif);}
#nav li.navpink li.on a {background-image: url(../images/arrow-pink.gif);}
#nav li.navgreen li.on a {background-image: url(../images/arrow-green.gif);}

#nav li li a:hover {text-decoration: underline;}
#nav li.navblue li.on a, #nav li.navblue li a:hover {color: #3faffb;}
#nav li.navorange li.on a, #nav li.navorange li a:hover {color: #f7763e;}
#nav li.navpurple li.on a, #nav li.navpurple li a:hover {color: #666699;}
#nav li.navpink li.on a, #nav li.navpink li a:hover {color: #e44e6b;}
#nav li.navgreen li.on a, #nav li.navgreen li a:hover {color: #6cab44;}

#content h2 {font-size: 17px; font-family: "trebuchet ms", trebuchet, arial, sans-serif; color: #999; margin: 1.5em 0 .5em 0; font-weight: normal;}
#content ul {margin-bottom: 1em;}
#content ul li {padding-left: 10px; background: url(../images/bullet.gif) 0 5px no-repeat; zoom: 1;}

table {width: 467px; margin-bottom: 1em;}
td, th {padding: 3px 5px;}
.thead {font-weight: bold; color: #fff; border: solid #fff; border-width: 3px 0;}
.thead a {color: #fff !important; text-decoration: underline !important;}
body.blue .thead {background-color: #3faffb;}
body.orange .thead {background-color: #f7763e;}
body.purple .thead {background-color: #666699;}
body.pink .thead {background-color: #e44e6b;}
body.green .thead {background-color: #6cab44;}

form div {padding-bottom: 5px;}

.absolute {position: absolute;}