@charset "utf-8";

div#template { width: 1100px; margin: 0 auto 0 auto }

div#menu { height: 35px; overflow: hidden; background-color: #4f8b7a }
div#menu ul { margin: 0; padding: 6 0 6 0 }
div#menu li { display: inline; padding: 6 0 6 40 }
div#menu a { font-size: 19px; font-weight: 100; color: #fff }
div#logo { float: left; width: 240px }
div#options { float: right; width: 850px; position: relative }
div#schools { position: absolute; cursor: pointer; top: 45; right: 218; width: 218px; height: 35px }
div#school-button { position: absolute; z-index: 100 }
div#school-list { position: absolute; top: 30; left: 44; width: 160px; background-color: #fff; border: solid 1px #cecece; z-index: 50 }
div#school-list iframe { position: absolute; z-index: 9999 }
div#school-list ul { margin: 0; padding: 0 }
div#school-list li { list-style: none; line-height: 0.7em; border-bottom: solid 1px #f0f0f0 }
div#school-list a { display: block; font-size: 14px; font-weight: normal; color: #a2a2a2; padding: 0.5em 1em 0.5em 1em; background-color: #fff }
div#school-list a:hover { color: #000; background-color: #e5e5e5 }
div#search { position: absolute; top: 45; right: 1; width: 218px; height: 35px }
div#searchbox { width: 218px; height: 35px; background-image:url(../images/template/search-background.png) }
div#searchbox input { color: #a2a2a2; width: 164px; height: 28px; padding: 4 2 2 2; margin: 1 0 0 48; border: none }

.stroke { background-color: #e5e5e5; border: solid 1px #cecece }

div#header { position: static; width: 1100px; overflow: hidden; z-index: -1 }

div#special-bulletin { color: #2e5e50; height: 25px; overflow: hidden; margin: 10 0 0 0 }
div#special-bulletin h6 { display: inline; margin: 1 0 0 40 }
div#special-bulletin p { display: inline; margin: 1 0 0 8 }

div#special-bulletin.l, div#special-bulletin.l1 { background-color: #e5e5e5; color: #2e5e50; border: solid 1px #cecece; height: 25px; overflow: hidden; margin: 10px 0 0 0; }
div#special-bulletin.l2 { background-color: #e0f7b3; color: #3b520e; border: solid 1px #5f7338; height: 25px; overflow: hidden; margin: 10px 0 0 0; }
div#special-bulletin.l3 { background-color: #b3dbf7; color: #073f65; border: solid 1px #36739d; height: 25px; overflow: hidden; margin: 10px 0 0 0; }
div#special-bulletin.l4 { background-color: #f7b3b3; color: #7f1212; border: solid 1px #aa4747; height: 25px; overflow: hidden; margin: 10px 0 0 0; }
.b, .lb, .l, .l1b, .l2b, .l3b, .l4b { font-weight: bold; }
.i, .li, .l, .l1i, .l2i, .l3i, .l4i { font-style: italic; }

div#roles { padding: 10 10 0 10 }
div#roles div { position: relative; float: left; width: 255; height: 220px; margin: 0 20 20 0; overflow: hidden; background-repeat: no-repeat }
div#roles img { position: absolute; left: 1; top: 30 }
div#roles ul { position: absolute; left: 30; top: 120; margin: 0; padding: 0 }
div#roles li { list-style: none; line-height: 1em; padding: 2 0 2 16; background-image:url(../images/template/li-background.png); background-position: 0 6; background-repeat: no-repeat }
div#roles a { font-weight: normal; color: #000; text-decoration: none }
div#roles a:hover { text-decoration: underline }
#r-student { background-image:url(../images/template/role-students.png) }
#r-parent { background-image:url(../images/template/role-parents.png) }
#r-staff { background-image:url(../images/template/role-staff.png) }
#r-trustee { background-image:url(../images/template/role-trustees.png) }

div.content-padding { padding: 0 10 0 10 }
div.content-padding-subpage { padding: 0 20 40 60 }

div#footer { color: #626262 }
div#footer p { margin: 0; padding: 8 0 8 0 }
div#footer a { color: #626262 }
div#footer span { margin: 0 40 0 0 }

div.col-left { float: left; width: 530px }
div.col-right { float: right; width: 530px }
div.col-sub-left { float: left; width: 255px }
div.col-sub-right { float: right; width: 255px }

div.portal { background-repeat: no-repeat }
div.portal-half { background-image:url(../images/template/portal-half-background.png) }
div.portal-quarter { background-image:url(../images/template/portal-quarter-background.png) }
div.portal-padding { padding: 15 15 30 15 }
div.portal-padding h1, h2, h3, h4, h5, h6 { margin-top: 0 }

.icon-left { margin: 0 40 20 0 }
.icon-right { margin: 0 0 20 40 }
.right { text-align: right }
.clear { clear: both }
.tail { margin: 0 !important }

/* Special Pages */
*>body .promo { height: 900px; min-height: 800px } /* IE */
.promo { color: #fff; min-height: 900px; background-repeat: no-repeat; background-position: bottom }
.promo .h-lead { color: #fff !important; margin-left: 20; }
.promo td, .promo th, .promo a, .promo h1, .promo h2, .promo h3, .promo h4, .promo h5, .promo h6 { color: #fff }
.remembrance-day { height: 1100px; background-color: #72a7e9; background-image: url(../images/template/bg-remembrance-day.jpg) }
.halloween { height: 1100px; background-color: #1c0473; background-image: url(../images/template/bg-halloween.jpg) }