﻿body { font-family: Arial; font-size: 9px; line-height: 1.25em; color: #3F3F3F; background: #FFFFFF url(../images/background.gif) repeat-x 0 40px; }
body, form { position: relative; padding: 0; margin: 0; }
a { text-decoration: none; color: #993300; }
a:hover { text-decoration: underline; }

h1 { font-size: 24px; margin-bottom: 1em; }
h2 { font-size: 18px; margin-bottom: 0.5em; color: #993300; }
h3 { font-size: 11px; margin-bottom: 0.25em; }
p, h4 { font-size: 9px; margin-bottom: 1em; }
p.list { margin-bottom: 0.5em; }
/*p.info { font-size: 12px; }*/
h1, h2, h3, h4, p { margin-top: 0; line-height: 1.25em; }
img { border: none; }
ul,ol { padding: 0 0 0 30px; margin: 0 0 1em 0; }
ul.text { padding: 0; list-style: none; }
embed, object { z-index: 1098; }
.last { margin: 0 !important; }

.right, .right p { font-size: 11px; line-height: 1.25em; }

/* Clear fix styling */
.clearfix:after{
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}

/* WinIE7 only */
*:first-child+html .clearfix{
	height:1%;
}

/* WinIE6 and below */
/*¥*/
* html .clearfix{
	height:1%;
}
/**/

/* MacIE only */
/*¥*//*/
.clearfix{
	display:inline-table;
}
/**/

#page { position: relative; width: 600px; margin: auto; }

#shadow { position: relative; width: 617px; margin-bottom: -17px; }
#shadow .sc { position: relative; padding-right: 17px; background: url(../images/shadow/right.png) right repeat-y; }
#shadow .sb { position: relative; height: 17px; }
#shadow .sbl, #shadow .sbc, #shadow .sbr, #shadow .str { width: 17px; height: 17px; position: absolute; top: 0; }
#shadow .sbl { left: 3px; background: url(../images/shadow/bottom.png) top left no-repeat; }
#shadow .sbc { left: 20px; width: 580px; background: url(../images/shadow/bottom.png) bottom repeat-x; }
#shadow .sbr { right: 0; background: url(../images/shadow/bottom.png) top right no-repeat; }
#shadow .st { position: absolute; top: 0; right: 0; height: 20px; width: 17px; background: url(../images/background.gif) repeat-x; }
#shadow .str { top: 3px; right: 0; background: url(../images/shadow/right.png) no-repeat; }

#branding { position: relative; height: 120px; width: 600px; background: #E6DDCC; }
#branding .marquee { position: absolute; top: 40px; right: 40px; color: #666633; width: 322px; height: 2em; line-height: 2em; overflow: hidden; }
#branding .marquee-admin { position: absolute; top: 40px; margin-top: 3em; right: 40px; width: 322px; }
#branding .logo { position: absolute; top: 10px; left: 10px; }
#branding .slogan { position: absolute; bottom: 7px; right: 40px; }
#flaps { position: relative; height: 375px; margin-bottom: -345px; background: url(../images/page-flap-repeat.gif) repeat-x bottom; overflow: hidden; }
#flaps .center { position: absolute; width: 50%; height: 225px; left: 0; bottom: 0; }
#flaps .left, #flaps .right { position: absolute; width: 200px; height: 200px; top: 0; }
#flaps .left { right: 300px; background: url(../images/page-flap.jpg) no-repeat; }
#flaps .right { right: -500px; background: url(../images/page-flap.jpg) no-repeat -200px 0; }
#footer { position: relative; font-size: 9px; padding: 1em 25px; }

/* Banner Styling n' Images */
#banner { position: relative; font-size: 0; line-height: 0; background: #E6DDCC; }
#banner .image1 { height: 155px; background: #FFFFFF url(../images/banners/1.jpg) no-repeat; }
#banner .image2 { height: 80px; background: #FFFFFF url(../images/banners/2.jpg) no-repeat; }
#banner .image3 { height: 80px; background: #FFFFFF url(../images/banners/3.jpg) no-repeat; }
#banner .image4 { height: 80px; background: #FFFFFF url(../images/banners/4.jpg) no-repeat; }
#banner .image5 { height: 80px; background: #FFFFFF url(../images/banners/5.jpg) no-repeat; }
#banner .image6 { height: 80px; background: #FFFFFF url(../images/banners/6.jpg) no-repeat; }
#banner .image7 { height: 80px; background: #FFFFFF url(../images/banners/7.jpg) no-repeat; }
#banner .image8 { height: 80px; background: #FFFFFF url(../images/banners/8.jpg) no-repeat; }
#banner .image9 { height: 80px; background: #FFFFFF url(../images/banners/9.jpg) no-repeat; }
#banner .image10 { height: 80px; background: #FFFFFF url(../images/banners/10.jpg) no-repeat; }
#banner .image11 { height: 80px; background: #FFFFFF url(../images/banners/11.jpg) no-repeat; }
#banner .image12 { height: 80px; background: #FFFFFF url(../images/banners/12.jpg) no-repeat; }

#content { position: relative; background: #E6DDCC; }
#content .stilt { position: relative; line-height: 0; font-size: 0; width: 0; height: 200px; float: left; }
#content .right { position: relative; padding: 25px 45px 25px 20px; width: 350px; float: right; }
#content .left { position: relative; padding: 25px 20px 25px 25px; width: 140px; float: left; }
#content .last { margin-bottom: 0; }
#content .wide { position: relative; padding: 25px; }

/* Buttons n' Box Styling */
.box { position: relative; color: #666633; border: solid 1px #B3B399; padding: 10px 6px; }
.box h4 { border-bottom: solid 1px #666633; margin-bottom: 0.5em; padding-bottom: 0.5em; }
.buttonYellow, .buttonGreen, .buttonDarkGreen { position: relative; height: 3em; font-weight: bold; }
.buttonYellow .line, .buttonGreen .line { display: block; }
.buttonYellow { background: #ECCE7A; line-height: 1em; overflow: hidden; }
.buttonYellow a { color: #666633; display: block; padding: 0.5em 0.5em 0.5em 45px; }
.buttonYellow .icon { position: absolute; width: 37px; height: 40px; bottom: -2px; left: 3px; background: url(/resources/images/buttons/boy.png) no-repeat; }
.buttonGreen { background: #B0A67A; line-height: 2em; }
.buttonGreen a { color: #3F3F3F; display: block; padding: 0.5em 0.5em 0.5em 45px; }
.buttonGreen .icon { position: absolute; width: 43px; height: 30px; bottom: -5px; left: -5px; background: url(/resources/images/buttons/book.png) no-repeat; }
.buttonDarkGreen { background: #666633; line-height: 2em; }
.buttonDarkGreen a, .buttonDarkGreen .button { color: #FFFFFF; display: block; padding: 0.5em 0.5em 0.5em 45px; }
.buttonDarkGreen .icon { z-index: 1000; position: absolute; width: 26px; height: 37px; bottom: -11px; left: 5px; background: url(/resources/images/buttons/heart.gif) no-repeat; }
.buttonDarkGreen .multi-line { line-height: 1em; }

.box, .buttonYellow, .buttonGreen, .buttonDarkGreen { margin-bottom: 10px; }

/* Menu Styling */
#menu { position: relative; background: #B2A77A; z-index: 1000; }
#menu a { display: inline-block; width: 75px; line-height: 24px; color: #FFFFFF; text-align: center; padding: 0; }
#menu a:hover { text-decoration: none; }
#menu span.multi { margin-top: -6px; top: 6px; }
#menu a.multi span { display: block; line-height: 12px; position: relative; }
#menu .expand { display: none; position: absolute; left: 0; top: 30px; width: 150px; }
#menu .expand a { display: block; background: none; width: auto; text-align: left; line-height: normal; }
#menu .expand a.current { color: #FAB700; }
#menu .text { display: block; padding: 3px 0; }
#menu .expand .text { line-height: 12px; padding: 4px 6px; }
#menu span { position: relative; }
#menu span:hover .expand { display: block; }
#expandedLinks .expand { display: block; margin-bottom: 10px; }
#expandedLinks a { display: block; margin-bottom: 0.25em; }

/* Menu Coloring */
#menu span.multi { display: inline-block; }
#menu .c1 { display: inline-block; background: #666633; }
#menu .c2 { display: inline-block; background: #CC9900; }
#menu .c3 { display: inline-block; background: #993300; }
#menu .c1 a, #menu .c2 a, #menu .c3 a { background: url(../images/menu.png) no-repeat 0 0; }
#menu .c1 .expand a { background: url(../images/menu.png) repeat-x 0 -64px; }
#menu .c2 .expand a { background: url(../images/menu.png) repeat-x 0 -128px; }
#menu .c2 .expand a.current { color: #333; }
#menu .c3 .expand a { background: url(../images/menu.png) repeat-x 0 -196px; }
#menu .expand a span:hover { background: url(../images/menu.png) repeat-x 0 -256px; }

.two-columns { position: relative; }
.two-columns .column { float: left; width: 45%; margin-right: 5%; }
.two-columns .column-last { margin-right: 0; }

#map { width: 348px; height: 348px; margin-bottom: 2em; border: solid 1px #000000; }
.directions { position: relative; margin-bottom: 1em; }
.directions .address { float: left; width: 100px; margin-right: 25px; }

#programs .odd { background: #CC9900; color: #FFFFFF; }
#programs .even { background: #666633; color: #FFFFFF; }
#programs .program { position: relative; margin-bottom: 1em; }
#programs .program .body { position: relative; }
#programs .program .header *, #programs .program .body .section, #programs .program .footer { position: relative; padding: 10px; margin: 0; }
#programs .program .body .section { background: #FFFFFF; color: #000000; margin-bottom: 1px; }
#programs.ui-accordion .header { cursor: pointer; border-bottom: solid 1px #FFFFFF; }

/* Source Ordered Content */
#banner { padding-top: 150px; }
#top-content { position: absolute; top: 0; left: 0; }

.cms-region .cms-options { background: #333 url(../images/cms/background.gif) no-repeat left top; padding-left: 10px; color: #FFFFFF; font-weight: bold; margin-bottom: 1em; }
.cms-region .cms-options p { padding: 2px 10px 2px 0; background: url(../images/cms/background.gif) no-repeat right top; font-size: 11px; margin: 0; }
.cms-region .cms-options a { color: #FFFFFF; margin-right: 10px; padding: 3px 0; display: inline-block; }
.cms-region .cms-last { background-position: left bottom; }
.cms-region .cms-last p { background-position: right bottom; }
.cms-options a.cms-add, .cms-options a.cms-edit { padding-left: 16px; background: url(../images/cms/add.gif) no-repeat left center; }
.cms-options a.cms-destroy { padding-left: 16px; background: url(../images/cms/remove.gif) no-repeat left center; }
.cms-options a.cms-cancel-create, .cms-options a.cms-cancel-update { padding-left: 16px; background: url(../images/cms/cancel.gif) no-repeat left center; }
.cms-options a.cms-update, .cms-options a.cms-create { padding-left: 16px; background: url(../images/cms/yellow.gif) no-repeat left center; }
.cms-section textarea { font-family: Arial; font-size: 11px; width: 346px; height: 200px; }

/* Administrator Login Styling */
div#TB_ajaxContent { position: relative; padding: 25px; overflow: hidden; }
#loginBox { border-collapse: separate; border-spacing: 2px; margin: auto; }
#loginBox td { padding: 2px 5px; }
#loginBox h2 { margin-bottom: 6px; }
#loginBox input.textbox { font-family: Arial,Helvetica,sans-serif; padding: 2px; }
#loginBox input.button { margin-left: 4px; margin-right: 0; }
#loginBox a.button { text-decoration: none; color: #993300 !important; }
#loginBox .buttons { padding-top: 8px; }

.errorBox { background: #FFC0C0; border: solid 2px #FF4040; padding: 5px; font-weight: bold; color: #000000; margin-bottom: 10px; }
.errorBox p { margin-bottom: 0; }

/* Upload Progress Bar */
#progressContainer { padding: 20px; border: #A7B578 solid 3px; background-color: #FFFFFF; font-size: 12px; line-height: 1em; color: #333333; }
#progress { border-collapse: separate; border-spacing: 2px; }
#progress td, #progress th { text-align: left; font-weight: normal; color: #70736A; vertical-align: top; }
#progress th { white-space: nowrap; text-align: right; padding-right: 10px; }
#progress td { width: 100%; }
#progress .title { font-size: 16px; font-weight: bold; text-transform: uppercase; text-align: left; color: #000000; }
#progress .bar { padding: 10px 0; }

#calendar { border-collapse: collapse; margin-bottom: 2em; }
#calendar td { width: 75px; height: 75px; font-size: 12px; padding: 5px; text-align: left; vertical-align: top; border: solid 1px #000000; }
#calendar .header td { width: auto; font-weight: bold; color: #993300; border: none; height: auto; text-align: center; vertical-align: middle; }
#calendar .header td a { margin: 0 0.5em; }
#calendar .names td { font-size: 9px; font-weight: bold; height: auto; border: none; text-align: center; vertical-align: middle; }
#calendar .current { background: #B0A67A; }
#calendar .events { font-size: 9px; padding-top: 0.5em; }
#calendar .events .event { margin-bottom: 1em; position: relative; }
#calendar .events .event .title { font-weight: bold; }
#calendar.hover-events .events .event .title { cursor: default; }
#calendar.hover-events .events .event .description { display: none; }
#calendar.hover-events .events .hover-over .description { display: block; position: absolute; top: 10px; left: 10px; width: 200px; border: solid 1px #000000; background: #FFFFFF; padding: 10px; z-index: 1999; }

#aid-info .info { display: none; width: 300px; }
#aid-info .hover-over { display: block; position: absolute; top: 10px; left: 10px; width: 300px; border: solid 1px #000000; background: #FFFFFF; padding: 10px; z-index: 1999; }

.upcoming-events { margin-bottom: 2em; }
.upcoming-event { margin-bottom: 1em; }

/* Career Opportunities + Accordion */
#listings { margin-bottom: 1em; }
.compact .career h3 { cursor: pointer; }
.compact .career .info table { margin-bottom: 1em; }
.compact .career { margin: 0; }
.career { margin-bottom: 1em; }
.career table { border-collapse: collapse; }
.career td { padding: 0.125em 0.25em; vertical-align: top; }
.career .label { text-align: right; font-weight: bold; }

.event-scroller { position: relative; overflow: hidden; margin-bottom: 0.5em; }
.event-scroller .event-scrollie { position: absolute; overflow: hidden; }
.scrollUp, .scrollDown { margin-right: 0.25em; }

.paginator table { border-collapse: collapse; }
.paginator table td { padding: 1em 1em 0 0; }

#expandedLinks a { margin-bottom: 0.5em; }
