/* OYS - Online Youth Services
--------------------------------------- */

/* = General */
* {margin:0; padding:0;}
body {background:#fff; font:normal 62.5% Arial, Verdana, "Trebuchet MS", sans-serif; color:#333;}
.skip {display:none;}
p, label, li, input {font-size:1.1em;}

.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

/* = forms */
form fieldset {border:0;}
form legend {display:none;}
form input {font:normal 1.1em Arial, Verdana, "Trebuchet MS", sans-serif; padding:1px;}
form input:active {}


/* = links */
a:link, a:visited {color: #666; text-decoration: none;}
a:hover {color: #333;}

/* = structure */
#wrapper {width:80em; height:100%; background:#fff;}
#header {width:80em; margin:10px 0 0 0;}
#main {clear:left; width:80em; position:relative; z-index:0; background:#f2f2f2;}
#content {overflow:hidden; float:right; width:65em;}
#maincontent {float:left; width:44em; margin:0 1em 0 0.5em; padding:10px 0 0 0; line-height:1.6;}
#extras {float:right; width:18em; height:auto !important; height:500px; min-height:500px; padding:0.5em; background:#f3f3f3; }
#menu {float:left; width:14em; height:auto !important; height:500px; min-height:500px; padding:0.5em; background:#f3f3f3; }
#footer {clear:both;}

/* = header */
#header h1 {background:url(/images/oys_logo.jpg) 0 0 no-repeat; width:170px; height:45px; text-indent:-9000px; float:left; margin:5px 0;}
#header h1 a {width:170px; height:45px; display:block;}
#header form {position:absolute; top:170px; left:56em; z-index:15; width:240px; padding:15px 0; height:15px;}
#header form label {color:#23375d; text-transform:uppercase; font-size:1.2em; font-weight:bold;}

/* = header navigation */
#header ul#nav {clear:both; background:#000080 url(/images/bg_menu.gif) 0 0 repeat; margin:5px 0 0 0; list-style:none;}
#header ul#nav li {position:relative; z-index:8; float:left; width:130px; border-left:1px solid #f3f3f3;}
#header ul#nav li:first-child {border-left:0;}
#header ul#nav li a {display:block; padding:5px 5px 5px 10px; position:relative; color:#fff; font-size:1.1em; text-align:center;}
#header ul#nav li a:hover {color:#ff0; text-decoration:none;}

#header ul#nav ul {position:absolute; z-index:9; left:-999px; width:130px; min-width:130px; background:#fff;}
#header ul#nav li ul li {display:block; float:none; background:#fff; border-bottom:0; }
#header ul#nav li ul li a {display:block; font-size:0.9em; color:#000080;}
#header ul#nav li ul li a:hover {background:#369;}

#header ul#nav li:hover ul, 
#header ul#nav li.sfhover ul {left: 0;}

/* = main */
#main h1 {background-color:#f2f2f2; background-position:0 0; background-repeat: no-repeat; height:121px; text-indent:-9000px; margin:0;}

#main h1.home {background-image:url(/images/headers/header_home.jpg); height:121px; width:800px;}
#main a#home_donate {position:absolute; top:-90px; right:0; z-index:1; background:url(../img/bg_donate.gif) 0 0 no-repeat; padding:5px 0; height:16px; width:156px; text-indent:15px; font-size:1.2em; font-weight:bold; color:#fff;}

#main h1.leadership {background-image:url(/images/headers/header_leadership.gif)}
#main h1.mission {background-image:url(/images/headers/header_mission.jpg)}
#main h1.news {background-image:url(/images/headers/header_news.gif)}
#main h1.support {background-image:url(/images/headers/header_support.gif)}

#main h1.egyc {background-image:url(/images/headers/header_egyc.gif)}
#main h1.youthvote {background-image:url(/images/headers/header_youthvote.gif);}
#main h1.reallifeaids {background-image:url(/images/headers/header_reallifeaids.gif)}
#main h1.infoexchange {background-image:url(/images/headers/img/header_infoexchange.jpg)}

#main h1.publications {background-image:url(/images/headers/header_publications.gif)}

#main h1.volunteer {background-image:url(/images/headers/header_volunteer.gif)}
#main h1.donations {background-image:url(/images/headers/header_donations.gif)}

#main h1.contact {background-image:url(/images/headers/header_contact.gif)}

#main img{border-width:0px;}

#main p.summary{margin-left:25px;}

#main tr.contactline{border-bottom: 1px solid #333;}

#main .newsdate{font-size:0.8em;color:gray;}
#main .newitemtitle{font-weight:bold;margin-top:15px;}

#main .subaction {width:780px; height:26px; padding:10px 0 0 20px; position:absolute; top:80px; left:0; background:#fff; opacity:0.5; filter: alpha(opacity=50);}
#main .subaction li {list-style:none; display:inline;}
#main .subaction li a {font-size:0.8em; color:000; background:url(/images/icons/bookmark_icon.gif) 0 50% no-repeat; padding:0 0 0 21px; }
#main .subaction li.print {padding-top:5px;}
#main .subaction li.print a {background-image:url(/images/icons/print_icon.gif);}

#home_news {background:#fff; color:#000080; height:26px; padding:5px; margin-top:-36px; line-height:1; font-size:1.1em; opacity:0.5; filter: alpha(opacity=50);}
#home_news iframe {padding:5px 0 0 0;}

/* = maincontent */
#maincontent h2 {font-size:1.5em; color:#000080;}
#maincontent h3 {font-size:1.2em; color:#000080;}
#maincontent h4 {font-size:0.9em; color:#000080;}
#maincontent p {margin:10px 0; font-size:1.2em;}
#maincontent ul {padding:0 0 0 25px;}
#maincontent .vcard {font-size:1.2em; padding:5px 0; border-bottom:1px solid #ccc;}
#maincontent .vcard .url {color:#333;}

/* = extras */
#extras form {background:url(/images/sidebar/test_email.jpg) 0 0 no-repeat; padding:44px 0 10px 0; border-bottom:1px solid #333;}
#extras form label {display:block;}
#extras h3 {font-size:1.2em; color:#000; padding:10px 0; border-bottom:1px solid #333; text-indent:-9000px;}
#extras h3.docs a {background:url(/images/sidebar/RelatedDocs.jpg) 0 0 no-repeat; display:block; width:150px; height:40px;}
#extras h3.volunteer a {background:url(/images/sidebar/related_opps.jpg) 0 0 no-repeat; display:block; width:150px; height:40px;}
#extras h3.helpout a {background:url(/images/sidebar/helpout_icon.jpg) 0 0 no-repeat; display:block; width:150px; height:40px;}
#extras h3.youthfocus a {background:url(/images/sidebar/YouthFocus_icon.jpg) 0 0 no-repeat; display:block; width:150px; height:40px;}

#extras h4 {margin:10px 0; color:#000080; font-size:1.1em;}

/* = menu */
#menu ul {list-style:none; padding:10px 0;}
#menu ul li a {display:block; padding:0 0 5px 5px; width:90%;}
#menu ul li a:hover {text-decoration:underline;}
#menu ul li.selected a {font-weight:bold;}
#menu h4 {font-size:1.2em;}
#menu p {color:#008000;}
#menu ul li.spacer {height:20px;}

#menu ul.soon li {text-indent:-9000px; background-position:0 0; background-repeat:no-repeat; height:32px; width:120px;}
#menu ul.soon li.youth {background-image:url(/images/sidebar/youth.jpg);}
#menu ul.soon li.parents {background-image:url(/images/sidebar/parents.jpg);}
#menu ul.soon li.orgs {background-image:url(/images/sidebar/orgs.jpg);}