﻿html, body { height: 100%; text-align: center; margin: 0; padding: 0; }
body { background: #EEEEEE url(PageBackground.gif) center top repeat-y; }
body.withmenu { background-image: url(PageBackgroundWithMenu.gif); }

#container {
    min-height: 100%; height: auto !important; height: 100%;
	margin: 0 auto -50px auto;	width: 956px; text-align: left;
	position: relative;
}

#push { clear: both; height: 50px; }

#header { height: 108px; background: #40527C url(HeaderFade.gif) repeat-x; padding: 8px 25px 0 15px; position: relative; border-bottom: 6px solid #A8B3CC; }

#primarynav li, #secondarynav li { float: left; }

#primarynav { position: absolute; text-align: right; top: 60px; right: 25px; }
#primarynav li { margin-left: 10px; height: 25px; background: url(PrimaryBackground.gif) repeat-x 0 0; padding: 0; }
#primarynav a { display: block; padding: 5px 15px; height: 15px; font-weight: bold; font-size: 14px; text-align: center; min-width: 55px; }
#primarynav a:link, #primarynav a:visited { color: #FFFFFF; text-decoration: none; }
#primarynav a:hover, #primarynav a:active, #primarynav li.selected { background: url(PrimaryBackground.gif) 0 -30px repeat-x; }

#secondarynav { position: absolute; text-align: right; top: 20px; right: 25px; }
#secondarynav li { padding-left: 20px; background-image: none; }
#secondarynav a { font-weight: bold; font-size: 1.1em; }
#secondarynav a:link, #secondarynav a:visited { color: #FAA927; text-decoration: none; }
#secondarynav a:hover, #secondarynav a:active { color: #FAA927; text-decoration: underline;  }

#cdnav { position: absolute; top: 36px; right: 30px; }
#cdnav li { padding-left: 12px; background: url(Arrow.gif) 0 4px no-repeat; padding-bottom: 5px; }
#cdnav a { font-weight: bold; font-size: 1.1em; }
#cdnav a:link, #cdnav a:visited { color: #EEEFF3; text-decoration: none; }
#cdnav a:hover, #cdnav a:active { color: #EEEFF3; text-decoration: underline;  }

div.column-right { float: left; padding: 25px 0 30px 25px; width: 512px; min-height: 400px; }
div.column-spread { float: left; padding: 25px 0 0 25px; width: 840px; }
div.column-fullwidth { padding: 25px 25px 0 25px;  }
div.column-right-compact { float: left; padding: 25px 0 30px 25px; width: 422px; min-height: 400px; }

div.sideimage { float: right; margin: 25px 25px 0 0; width: 160px; text-align: center; }

#footer { background: #314673 url(FooterFade.gif) repeat-x; border-top: 6px solid #A8B3CC; padding: 8px 15px 0 15px; margin: 0 auto -50px auto; width: 926px; }
#footer p { color: #E8EAEF; }
#footer a { color: #E8EAEF; }


/*---- Home page ---*/

#home-mission { background: url(Mission.gif) 0 0 no-repeat; margin: 23px 0 0 25px; height: 19px; width: 905px; text-indent: -9999px; }

#home-news, #home-jobs { width: 349px; height: 266px; padding: 16px 22px 0 22px; background: url(HomePanel.jpg) 0 0 no-repeat; float: left; }
#home-news { margin-right: 40px; }
#home-news h1, #home-jobs h1 { font-size: 21px; margin-top: 0; margin-bottom: 18px; }

#home-jobs  ul li { padding-left: 12px; background: url(Bullet.gif) 0 6px no-repeat; padding-bottom: 4px; }

#home-boxes { margin: 0 -25px 10px -25px; }
#home-donate { margin: 20px 0; }
#home-donate p { text-align: center; margin: 0 -65px 5px 0; }

#social { height: 21px; padding: 10px 0; }
#social img { padding-right: 6px; display: block; float: left; }
#social span { float: left; padding-left: 35px; padding-top: 3px; height: 18px; background: url(Social/Arrow.gif) 0 0 no-repeat; font-weight: bold; color: #434E7F; }
    


/*---- Catfish ---*/

#catfish { display: none; height: 122px; background: url(Catfish/Background.gif) 0 0 repeat-x; position: fixed; bottom: 0; z-index: 200; width: 100%; left: 0; text-align: center; overflow: hidden; }
#catfish a { display: block; text-indent: -9999px; text-decoration: none; outline: none; }
#catfish-inner { width: 918px; height: 122px; text-align: left; margin: 0 auto; background: url(Catfish/Foreground.gif) 0 0 no-repeat; position: relative; }
#catfish-register { width: 166px; height: 18px; position: absolute; left: 130px; top: 59px; background: url(Catfish/Register.gif) 0 0 no-repeat; }
#catfish-hide { width: 166px; height: 18px; position: absolute; left: 130px; top: 84px; background: url(Catfish/Hide.gif) 0 0 no-repeat; }
#catfish-close { width: 20px; height: 20px; position: absolute; right: 10px; top: 46px; background: url(Catfish/Close.gif) 0 0 no-repeat; }


/*---- Guide navigator ---*/

#guidenav { display: none; position: absolute; top: 130px; left: 138px; width: 681px; padding: 34px; height: 523px; z-index: 100; background: url(Navigator/NavBackground.png) 0 0 no-repeat; }

#guidenav ul, #guidenav li { list-style-type: none; margin: 0; padding: 0; background: none; }
#guidenav li { position: absolute; }
#guidenav li a { display: block; text-decoration: none; text-indent: -9999px; width: 100%; height: 100%; }          
#guidenav a { outline: none; }

#guidenav0 { height: 132px; width: 111px; left: 271px; top: 199px; }
#guidenav6 { height: 119px; width: 119px; left: 355px; top: 49px; }
#guidenav15 { height: 119px; width: 119px; left: 443px; top: 168px; }
#guidenav28 { height: 119px; width: 119px; left: 411px; top: 303px; }
#guidenav38 { height: 119px; width: 119px; left: 280px; top: 363px; }
#guidenav46 { height: 119px; width: 119px; left: 147px; top: 303px; }
#guidenav49 { height: 119px; width: 119px; left: 116px; top: 168px; }
#guidenav54 { height: 119px; width: 119px; left: 207px; top: 49px; }

#guidenav.section6 #guidenav6 { background: url(Navigator/NavOrange6.gif) 0 0 no-repeat; }
#guidenav.section15 #guidenav15 { background: url(Navigator/NavOrange15.gif) 0 0 no-repeat; }
#guidenav.section28 #guidenav28 { background: url(Navigator/NavOrange28.gif) 0 0 no-repeat; }
#guidenav.section38 #guidenav38 { background: url(Navigator/NavOrange38.gif) 0 0 no-repeat; }
#guidenav.section46 #guidenav46 { background: url(Navigator/NavOrange46.gif) 0 0 no-repeat; }
#guidenav.section49 #guidenav49 { background: url(Navigator/NavOrange49.gif) 0 0 no-repeat; }
#guidenav.section54 #guidenav54 { background: url(Navigator/NavOrange54.gif) 0 0 no-repeat; }

#guidenavclose { position: absolute; display: block; text-decoration: none; text-indent: -9999px; height: 39px; width: 39px;  top: 23px; right: 90px;  }


/*---- Guide mini navigator ---*/

#guidemininav { display: none; float: right; margin: 15px 25px 0 0;  width: 155px; height: 130px; background: url(Navigator/MiniNav.gif) 0 0 no-repeat; cursor: pointer; position: relative; }

#guidemininav.section6  { background-position: 0 -130px; }
#guidemininav.section15 { background-position: 0 -260px; }
#guidemininav.section28 { background-position: 0 -390px; }
#guidemininav.section38 { background-position: 0 -520px; }
#guidemininav.section46 { background-position: 0 -650px; }
#guidemininav.section49 { background-position: 0 -780px; }
#guidemininav.section54 { background-position: 0 -910px; }

#guidemininavhover { display: none; width: 155px; height: 130px; background: url(Navigator/MiniNavHover.gif) 0 0 no-repeat; position: absolute; top: 0; left: 0; }


/*---- Related ---*/

#related { float: right; margin: 0 25px 25px 0; width: 155px; padding-top: 10px; }
#related h4 { margin: 10px 0 1px 0; background: #E3E3E3; }
#related h4 span { padding: 6px 20px 6px 32px; display: block; }
#related ul { margin: 0; padding: 4px 10px 6px 10px; background: #F3F3F3; width: 135px; }
#related ul li { padding-left: 0; background: none; margin-bottom: 6px; font-size: 11px; padding-bottom: 0; line-height: 1.2em; }
#related ul li a { font-weight: normal; }

#related h4.collapsed { background: #E3E3E3 url(RelatedExpand.gif) 137px center no-repeat; }
#related h4.expanded { background: #E3E3E3 url(RelatedCollapse.gif) 137px center no-repeat; }

#related h4 span.type-1 { background: url(PageTypes/1.gif) 1px center no-repeat; }
#related h4 span.type-2 { background: url(PageTypes/2.gif) 1px center no-repeat; }
#related h4 span.type-3 { background: url(PageTypes/3.gif) 1px center no-repeat; }
#related h4 span.type-6 { background: url(PageTypes/6.gif) 1px center no-repeat; }
#related h4 span.type-7 { background: url(PageTypes/7.gif) 1px center no-repeat; }
#related h4 span.type-8 { background: url(PageTypes/8.gif) 1px center no-repeat; }
#related h4 span.type-9 { background: url(PageTypes/9.gif) 1px center no-repeat; }
#related h4 span.type-10 { background: url(PageTypes/10.gif) 1px center no-repeat; }
#related h4 span.type-external { background: url(PageTypes/External.gif) 1px center no-repeat; }

#related #glossary { margin: 10px 0 1px 0; font-size: 1.1em; color: #2A3F6D; padding: 5px 20px 5px 32px; display: block; background: #E3E3E3 url(PageTypes/Glossary.gif) 1px center no-repeat; text-decoration: none; }



/*---- Left hand menu ---*/

#left { width: 204px; background: url(LeftBackground.gif) repeat-y; float: left; padding: 20px 0 25px 0; }
#left h2 { font-size: 1.5em; padding-left: 20px; margin-top: 3px; }
#left ul { margin-bottom: 15px; }
#left ul li { background-image: none; padding-left: 0; }
#left li a { display: block; padding: 5px 10px 5px 20px; font-size: 1.1em; text-decoration: none; font-weight: bold; }
#left li.selected a { background-color: #E3E3E3; border-left: 3px #A8B3CC solid; padding-left: 17px; }

#left ul ul { padding: 2px 0 6px 0; margin: 0; }
#left ul ul a, #left ul li.selected ul a { border: none; padding: 3px 10px 3px 35px; font-size: 1.1em; text-decoration: none; font-weight: normal; background-color: Transparent; }
#left ul ul li.selected a { background-color: #E3E3E3; border-left: 3px #A8B3CC solid; padding-left: 32px; }

#left ul ul ul { padding: 2px 0 6px 0; }
#left ul ul ul a, #left ul ul li.selected ul a { border: none; padding: 2px 10px 2px 45px; font-size: 1em; text-decoration: none; font-weight: normal; background-color: Transparent; font-style: italic; }
#left ul ul ul li.selected a { background-color: #E3E3E3; border-left: 3px #A8B3CC solid; padding-left: 42px; }

#left ul ul ul ul { padding: 2px 0 6px 0; }
#left ul ul ul ul a, #left ul ul ul li.selected ul a { border: none; padding: 2px 10px 2px 55px; font-size: 0.9em; text-decoration: none; font-weight: normal; background-color: Transparent; font-style: normal; }
#left ul ul ul ul li.selected a { background-color: #E3E3E3; border-left: 3px #A8B3CC solid; padding-left: 52px; }



/*---- Video ----*/

#videooverlay { z-index: 101; width: 707px; height: 465px; position: fixed; top: 100px; left: 50%; margin-left: -353px; background: url(Video/Overlay.png) 0 0 no-repeat; }
#videoclose { height: 35px; width: 35px; text-indent: -9999px; cursor: pointer; position: absolute; top: 6px; right: 6px; background: url(Video/Close.png) 0 0 no-repeat; }
#videomeat { width: 617px; height: 377px; position: absolute; left: 45px; top: 44px; }
#videomask { position: fixed; top: 0; left: 0; z-index: 100; background: url(Video/Mask.png) 0 0 repeat; }

#videomask, #videooverlay { display: none; }
