/*
	Copyright 2007 Global Volunteer Network. All rights reserved.
	Design by susannah at susannah dot com dot au
	CSS by me at richardsime dot com
	*/
/*****************************
	CONTENTS
	1.	Global Styles
		- Reset
		- Layout
		- Typography
	2.	Quick Links Box
	3.	Top Menu Bar
	4.	Promo Bar
	5.	Footer
	6.	Temporary Inner-page Overrides
	7.	Legacy Styles
	*****************************/
/*****************************
	1. Global Styles
*****************************/
/***************** Reset ****************/
html, body, div, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, fieldset, input {
    margin: 0;
    padding: 0
    }
h1, h2, h3, h4, h5, h6, pre, code, address, caption, cite, code, strong, th {
    font-size: 1em;
    font-weight: normal;
    font-style: normal
    }
em {
    font-style: italic;
    font-size: 1em;
    font-weight: normal
    }
ul, ol {
    list-style: none
    }
fieldset, img {
    border: none;
    outline: 0
    }
caption, th {
    text-align: left
    }
table {
    border-collapse: collapse;
    border-spacing: 0
    }
.clearer {
    clear: both
    }
/***************** Layout ****************/
html {
    height: 100%
    }
body {
    height: 100%;
    background: url(/image/bg_gradient.gif) top left repeat-x #ccc;
    font-family: verdana, arial, helvetica, sans-serif;
    font-size: 11px
    }
#pageBackground {
    position: relative;
    min-height: 100%;
    background: url(/image/bg_squiggle.png) top left repeat transparent
    }
/* IE6 star HTML hack to ensure 100% height means exactly that */
* html #pageBackground {
    height: 100%
    }
#wrapper {
    width: 778px;
    margin: 0 auto;
    padding: 14px 0
    }
div#overDiv {
    position: absolute;
    visibility: hidden;
    z-index: 1000
    }
div#banner {
    width: 778px;
    height: 97px;
    background: url(/image/banner.gif) top left no-repeat transparent
    }
div#headerShadow {
    width: 16px;
    height: 97px;
    background: url(/image/shadow_header.png) 0 0 no-repeat transparent;
    position: relative;
    left: 762px
    }
div#pageContent {
    background: url(/image/shadow_pageContent.png) top repeat-y transparent
    }
div#containWideTables {
    width: 770px;
    overflow: hidden
    }
img.rightpicture {
    float: right;
    border: 1px solid Black
    }
img.rightpic {
    float: right
    }
img.leftpicture {
    float: left;
    border: 1px solid Black
    }
/***************** Typography ****************/
th, h1, h2, h3, h4, h5, h6 {
    font-family: georgia, times, serif;
    font-weight: 900
    }
h1 {
    font-size: 16px;
    text-transform: uppercase;
    color: #F76A19;
    margin: 1em 0 0 0
    }
h2 {
    font-size: 12px;
    text-transform: uppercase;
    color: #039;
    margin: 2em 0 0 0
    }
h3 {
    font-size: 11px;
    color: #06c;
    margin: 1em 0 -0.5em 0
    }
/* h4 is the same as h2, but without top margin */
h4 {
    font-size: 12px;
    text-transform: uppercase;
    color: #039;
    margin: 0 0 0 0
    }
/* h5 is the same as h3, but without top margin */
h5 {
    font-size: 11px;
    color: #06c;
    margin: 0 0 -0.5em 0
    }
strong {
    font-weight: 900
    }
em {
    font-style: italic
    }
p {
    color: #333
    }
p.introBlurb {
    color: #039
    }
p.appblurb {
    color: #000;
    border: 1px #000;
    padding: 6px 6px 6px 6px;
    background-color: #3897FE
    }
span.asterisk {
    color: Red;
    font-size: 25 px
    }
a {
    color: #1975D1
    }
a:hover {
    color: #039;
    text-decoration: underline
    }
td {
    vertical-align: top
    }
td.content ul {
    padding-left: 13px;
    list-style: url(/image/bullet.gif);
    margin: 8px 0
    }
td.content ul li {
    margin: 4px 0
    }
/*****************************
	2. Quick Links Box
*****************************/
div#quickLinks {
    z-index: 2;
    width: 175px;
    float: right;
    position: relative;
    top: 26px;
    right: 20px
    }
div#quickLinks select {
    border: 1px solid #fff
    }
/* Quicklinks Form */
div#quickLinks form {
    line-height: 0
    }
#selectProgram select {
    border: 0 dotted red !important;
    width: 170px;
    font-size: 11px;
    color: #777;
    margin: 3px 0;
    border: solid 0 #fff;
    padding: 1px
    }
#searchBox input.textfield {
    border: 0 dotted red !important;
    width: 170px;
    font-size: 12px;
    color: #777;
    margin-top: 3px;
    border: solid 0 #fff;
    padding: 5px 0 0 4px;
    height: 26px;
    background: transparent url(/image/bg_input_search.png) no-repeat
    }
#searchBox > input.textfield {
    /* http://www.picment.com/articles/css/funwithforms/ */
    background: transparent url(/image/bg_input_search.png) no-repeat
    }
#searchBox input.submit {
    border: solid 0 #0f0;
    background-color: transparent;
    width: 26px;
    height: 25px;
    position: absolute;
    bottom: 5px;
    right: 3px
    }
#searchBox input.submit:hover {
    cursor: pointer
    }
/*****************************
	3. Top Menu Bar
*****************************/
div#mainMenu {
    width: 748px;
    height: 23px;
    overflow: hidden;
    background: url(/image/shadow_mainMenu.png) top repeat-y transparent;
    padding: 0 15px
    }
div#mainMenu div {
    position: relative;
    /* this is only necessary to fix a bug in IE: http://www.hrunting.org/csstests/iealpha.html */
    float: left;
    font-family: georgia, times, serif;
    text-align: center;
    line-height: 22px
    }
div#mainMenu div a {
    display: block;
    padding-top: 1px
    }
div.topmenu, div.topmenuactive {
    color: #fff;
    font-size: 13px;
    border-left: 1px solid #152c45;
    border-right: 1px solid #005EC4
    }
div.topmenuactive {
    background-color: #D4E8FF;
    color: #014691;
    padding-top: 1px
    }
a.menu {
    color: #fff;
    text-decoration: none
    }
a.menu:hover {
    color: #014691;
    text-decoration: none;
    background-color: #D4E8FF
    }
div#Home {
    width: 72px
    }
div#About {
    width: 71px
    }
div#Programs {
    width: 93px
    }
div#Media {
    width: 72px
    }
div#Newsletter {
    width: 98px
    }
div#News {
    width: 68px
    }
div#Foundation {
    width: 104px
    }
div#FAQ {
    width: 63px
    }
div#Contact {
    width: 81px
    }
/*****************************
	4. Promo Bar
*****************************/
#promo {
    background-color: #D4E9FF;
    border-top: 1px solid white;
    border-bottom: 1px solid white
    }
#promo img {
    float: left;
    margin-right: 10px
    }
/*****************************
	5. Footer
*****************************/
div#footer {
    background: url(/image/shadow_footer.png) top repeat-y transparent;
    text-align: center;
    line-height: 1.8em;
    font-size: 9px;
    padding-top: 8px
    }
div#footer ul li {
    border-left: 1px solid #4074AD;
    display: inline;
    padding: 0 6px
    }
div#footer ul li.first {
    border-left: none
    }
div#footer ul li a {
    color: #fff
    }
div#footer ul li a:hover {
    color: #BFD1E3
    }
div#footer p {
    margin-top: 0;
    color: #4074AD;
    margin-bottom: 0
    }
div#footerShadow {
    height: 16px;
    background: url(/image/shadow_footerBottom.png) bottom left no-repeat transparent
    }
/*****************************
	6. Temporary Inner-page Overrides
*****************************/
table.vertpanel td {
    /* turn off in-line style borders */
    border: 0 solid red !important
    }
td.vertmenu h1 {
    font-size: 11px;
    font-family: Verdana, serif;
    line-height: 1em;
    color: #039;
    font-weight: 700;
    margin-bottom: 6px;
    text-transform: none
    }
td.vertmenu {
    background-color: #FFE2A7;
    border-bottom: 2px solid #CB8133 !important;
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 8px;
    padding-bottom: 4px
    }
td.vertmenu div {
    font-weight: 300;
    color: #000
    }
td.vertmenu div a {
    text-decoration: underline;
    font-weight: 300
    }
a.social {
    text-decoration: none;
    font-weight: 300
    }
.newsletter {
    font-size: 10px;
    font-family: Verdana, serif;
    line-height: 10em;
    color: #000;
    font-weight: 300;
    width: 130px
    }
/*****************************
	7. Legacy Styles
*****************************/
a.continentmenu {
    color: #1975D1;
    text-decoration: none;
    font-family: Verdana;
    font-size: 9px;
    text-transform: capitalize
    }
a.continentmenu:hover {
    color: #1975D1;
    text-decoration: none;
    font-family: Verdana;
    font-size: 9px;
    text-transform: capitalize
    }
a.progmenu {
    color: #1975D1;
    text-decoration: none;
    font-family: Verdana;
    font-size: 9px;
    text-transform: capitalize
    }
a.progmenu:hover {
    color: #1975D1;
    text-decoration: none;
    font-family: Verdana;
    font-size: 9px;
    text-transform: capitalize
    }
a.navmenu {
    color: #4C4C4C;
    text-decoration: none;
    font-family: Verdana;
    text-transform: capitalize
    }
td {
    color: #4C4C4C
    }
p {
    margin: 10px 0
    }
/* Charisse Page Caption - Temp */
hc {
    color: #2C2C2C;
    font-weight: normal;
    font-family: Verdana, Arial, Helvetica, san-serif;
    font-size: 9px
    }
.nav {
    border-right: 2px solid #d7d7d7;
    border-bottom: 2px solid #d7d7d7;
    text-align: left !important;
    width: 300px;
    text-align: left;
    padding: 2px 2px 2px 2px
    }
.formsmall {
    color: #2C2C2C;
    font-family: Verdana, Arial, Helvetica, san-serif;
    font-size: 9px;
    background-color: #f3f8fd;
    border: 1px solid #2C2C2C
    }
.program {
    background-color: #DDEAF8;
    text-align: center;
    padding: 0 5px 0 5px;
    font-size: 10px;
    color: #1975D1
    }
.programactive {
    background-color: #fff;
    text-align: center;
    padding: 0 5px 0 5px;
    color: #1975D1;
    font-size: 9px
    }
.rightpad {
    padding: 4px 4px 4px 4px;
    background-color: #fff
    }
.content {
    border-left: 1px solid #b7b7b7;
    padding: 12px 12px 12px 12px;
    background: #fff;
    text-align: left
    }
.blue {
    background-color: #f3f8fd;
    color: #1975D1
    }
hr {
    color: #1975D1;
    height: 1px;
    width: 200px
    }
.footer {
    background-color: #fff;
    padding: 6px 6px 6px 6px
    }
.leftmain {
    width: 221px;
    background-color: #C8D7E7
    }
.rightmain {
    width: 110px;
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    background-color: #C8D7E7
    }
.contentfront {
    padding: 12px 12px 12px 12px;
    background-color: #C8D7E7
    }
.contentwhite {
    padding: 12px 12px 12px 12px;
    background-color: #FFF
    }
.news_bak {
    background: url(/image/newsletter.gif) no-repeat 30px -50px;
    padding: 10px 0
    }
.gift_bak {
    padding: 12px
    }
.aff_box {
    border: 1px solid #888;
    padding: 5px;
    text-align: center;
    vertical-align: top
    }
td #news {
    padding: 12px 12px 2px 12px;
    line-height: 12px;
    background: #E7EEF6
    }
td #arc {
    padding: 0
    }
td #arc a {
    color: #4C4C4C;
    text-decoration: none
    }
td #arc a:hover {
    color: #4C4C4C;
    text-decoration: none
    }
td #arc2 {
    line-height: 24px;
    border-top: 1px solid white;
    font-size: 11px;
    font-weight: bold;
    list-style: none;
    padding: 0 0 0 12px
    }
td #arc2 a {
    color: #4C4C4C;
    text-decoration: none
    }
td #arc2 a:hover {
    color: #4C4C4C;
    text-decoration: none
    }
.news_sub {
    font-size: 10px;
    margin-bottom: 10px
    }
#sidebar {
    width: 200px;
    padding: 0;
    margin: 0;
    text-align: left;
    background: white;
    float: left
    }
#sidebar ul li {
    list-style: none;
    line-height: 14px;
    border-bottom: 1px solid #e7eef6;
    padding: 10px 3px
    }
#content {
    width: 300px;
    padding: 0;
    margin: 0;
    text-align: left;
    background: white;
    float: left
    }
#folders {
    width: 760px
    }
.fees {
    background-color: #E6F3F6;
    width: 95%
    }
.feestd {
    border: 2px solid #fff;
    padding: 2px 2px 2px 2px
    }
.feestdc {
    border: 2px solid #fff;
    padding: 2px 2px 2px 2px;
    text-align: center
    }
.feespricec {
    border: 2px solid #fff;
    padding: 2px 2px 2px 2px;
    text-align: center;
    color: #1975D1
    }
.feespopup {
    background-color: #E6F3F6;
    width: 100%
    }
.feespopupbottom {
    background-color: #E6F3F6;
    width: 100%
    }
.feespopup tr, .fees tr {
    border: 1px solid #fff
    }
.aboutBlurb {
    float: right;
    width: 230px;
    border: 1px solid #004691;
    background-color: #E7EEF6;
    margin-left: 10px;
    font-size: 9px;
    padding-left: 10px;
    padding-right: 10px
    }
div.blogPost {
    vertical-align: top
    }
div.popup {
    font-size: 0.6em
    }
.tabStyle {
    height: 27px
    }
.tabStyle a {
    float: left;
    border: #36C solid 1px;
    border-bottom: none;
    padding: 7px;
    display: block;
    text-decoration: none;
    background-color: #CCDFFD;
    margin-right: 5px
    }