﻿
/* LAYOUT
-------------------------------------------------- */
html { background: #DDEEFF; }
body { margin: 0; }
#masterContainer { width: 960px; margin: 15px auto; }

body, input, button, select, textarea { font: 9.5pt/1.75 Arial, Helvetica, sans-serif; color: #666; }
input { line-height: 1; }
input, textarea { border: 1px solid #CCC; background: #FFF; padding: 2px 5px; }
select, button, input.button { border: 1px solid #999; background: #FFF; margin: 0; }
button, input.button { background: #DDD; }
button:hover, input.button:hover { background: #EEE; }

h2 { font-size: 167%; margin: 25px 0 10px 0; }
h3 { font-size: 100%; margin: 15px 0 5px 0; }
h4 { font-size: 100%; margin: 15px 0 5px 0; font-style: italic; }

img { border: 0; }

a:link,
a:visited { text-decoration: none; color: #13A4CE; }
a:hover { text-decoration: underline; }

h1, h2 { font-family: "Proxima Nova", "ProximaNova-Light", "Segoe UI Light", "Century Gothic", "Trebuchet MS", Arial, Helvetica, sans-serif; line-height: 1.25; font-weight: 100; }
h2, h3 { color: #333; }

.strong, strong { font-weight: bold; }
.em, em { font-style: italic; }
span.normal { font-weight: normal; font-style: normal; }


/* HEADER
-------------------------------------------------- */
#header { position: relative; background: url(../img/header/generic-bg.png); height: 240px; }

#navigation { padding: 0 15px; height: 41px; }
#navigation ul { list-style: none; margin: 0; padding: 0; }
#navigation > ul > li { float: left; }
#navigation > ul > li > a, #navigation > ul > li > span { line-height: 12px; color: #FFF; padding: 14px 10px; height: 12px; display: block; text-decoration: none; }
#navigation > ul > li.dev > span { color: #7FCFE6; }
#navigation > ul > li:hover > a,
#navigation > ul > li:hover > span { color: #13A4CE; background: #FFF url(../img/nav/hover.png); }
#navigation > ul > li:hover > span { color: #999; }

#navigation li div a:hover { text-decoration: underline; }
#navigation li div { display: none; background: #FFF; min-width: 120px; padding: 10px; position: absolute; z-index: 1; }
#navigation li:hover div { display: block; }
#navigation li:hover div a, #navigation li:hover div span { color: #333; margin: 3px 5px; }
#navigation li:hover div span { color: #777; }
#navigation li div.column { display: block; position: static; background: none; padding: 0; float: left; }
#navigation li p { margin: 3px 5px; }
#navigation li h3 { margin: 3px 5px 0 5px; }

#navigation a.main { font-weight: bold; }
#navigation .conf-spec { color: #CCEDF7; font-weight: bold; }

#searchbar { float: right; padding: 8px 1px; height: 24px; width: 260px; background: url(../img/nav/search-box.png) center no-repeat; }
#searchbar div { float: left; height: 24px; width: 199px; }
#searchbar input { padding: 1px 7px; color: #666; float: left; height: 22px; width: 185px; border: 0; background: url(../img/nav/search-gcs.png) no-repeat 9px 6px; }
#searchbar input:focus, #searchbar input.active { background: none; }
#searchbar button { float: left; color: #333; height: 24px; width: 61px; padding: 0; border: 0; background: url(../img/nav/search-button.png) no-repeat top; }
#searchbar button:hover, #searchbar button:focus { background-position: center; }
#searchbar button:active { background-position: bottom; }

#logo { position: absolute; top: 80px; left: 255px; background: url(../img/header/generic-logo.png); width: 445px; height: 117px; }
#celeb-35 { position: absolute; top: 80px; left: 838px;  background: url(../img/header/celeb-35.png); width: 102px; height: 116px; }
#logo span, #celeb-35 span { display: none; }

/* BODY
-------------------------------------------------- */
#body { background: #FFF url(../img/page/content-bg-fade.png) top no-repeat; min-height: 500px; }

#breadcrumbs { display: inline-block; width: 910px; color: #999; margin: 1em 25px 0 25px; }
#breadcrumbs > span span { font-style: italic; margin: 0 3px 0 0; }
#breadcrumbs > span a { text-decoration: none; }
#breadcrumbs > span a:link:hover, #breadcrumbs > span a:visited:hover { text-decoration: underline; }
#breadcrumbs .site { color: #666; font-weight: bold; font-style: normal; margin: 0 12px 0 0; }

p { margin: 0; }

#content { margin: 25px; display: inline-block; }
#content h1 { font-size: 233%; color: #23B2DB; margin: 0 0 10px 0; }
#content p, #content ul { margin: 0 0 10px 0; }
#content ul { padding: 0 0 0 40px; }
#content ul ul { margin-bottom: 0; }
#content .updated span { border: 1px dotted #990000; color: #990000; padding: 5px 10px; }
#content dd { margin-left: 25px; }
#content dt { font-weight: bold; margin-top: 5px; }
#content dt .toggle-button { font-weight: normal; }

#news, #sidebar { float: left; margin: 0 25px 0 0; width: 260px; color: #666; }

#news h2, #sidebar h2 { padding: 8px 0 0 0; background: url(../img/page/sidebar-gradient.png) no-repeat top left; color: #23B2DB; font-size: 150%; margin: 0 0 15px 0; }
#news h3, #sidebar h3 { font-size: 100%; color: #333; font-weight: bold; margin: 20px 0 5px 0; }
#news .info { display: block; padding: 10px; background: #23B2DB; color: #FFF; }

#sidebar ul { padding-left: 25px; }
#sidebar .tablecontents, .tablecontents ul { list-style: none; padding-left: 0; }
.tablecontents ul { margin-bottom: 0; }

#sidebar { padding: 5px 0; float: right; margin: 0 0 0 25px; }
#main { float: right; width: 625px; }

#pagination { display: inline-block; width: 100%; margin: 20px 0 0 0; border-top: 1px solid #CCC; padding: 0.5em 0; font-weight: bold; }
#pagination .prev { float: left; }
#pagination .next { float: right; }

#pageBottom { background: url(../img/page/bottom-corner.png); height: 10px; clear: both; }


/* FOOTER
-------------------------------------------------- */
#footer { clear: both; color: #666; background: url(../img/page/shadow.png) top no-repeat; height: 65px; }
#footer a, #footer span { word-spacing: 0; }
#footer a { color: #666; }

#footer .links { word-spacing: 7px; }
#footer .links, #copyright { padding: 10px 10px 25px 15px; float: left; width: 450px; }
#footer .links a.main { font-weight: bold; }
#footer .links span { color: #999; }

#copyright { text-align: right; }

