/* -------------------------------------------------------------- Site Specific Stylesheet www.website.co.uk 2010-01-11 Author: Sean Johnson - www.e4education.co.uk -------------------------------------------------------------- */ @import url(reset.css); /* Global Reset */ @import url(default.css); /* Sets sensible default styles */ /* Site specific styling -------------------------------------------------- */ body {margin: 0px auto; background: #FAFAFA; font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 75%; line-height: 170%; text-align: center; color: #000;} h1, h2, h3, h4, h5, h6 {font-weight: bold; line-height: 100%; color: #004583;} h1 {margin-bottom: 20px; font-size: 200%;} h2 {margin-bottom: 20px; font-size: 160%;} h3 {margin-bottom: 5px; font-size: 130%;} h4 {margin-bottom: 5px; font-size: 120%;} h5 {margin-bottom: 5px; font-size: 110%;} h6 {margin-bottom: 5px; font-size: 100%;} p {margin-bottom: 1em;} a {font-weight: inherit; font-style: inherit; color: #004583;} a:hover {color: blue;} #container {margin: 0px auto; width: 960px; background: #FAFAFA; text-align: left;} #header {position: relative; width: 960px; height: 85px; background: #FAFAFA; border-bottom: 5px solid #004583; color: #004583;} #header h1 {display: inline; float: left; margin: 0; padding: 0; width: 160px; height: 85px;} #header h1 a {display: block; width: 160px; height: 85px; background: url(../images/design/header_bg.gif) no-repeat left top; text-indent: -999em;} #header h2 {display: none;} #accessibilityLinks {display: inline; float: right; font-size: 80%; color: #999;} #accessibilityLinks li {display: inline; margin: 0;} #accessibilityLinks li a {margin: 0px .6em; padding: 0px 0px 0px 15px; background: url(../images/design/text_link.gif) no-repeat left; color: #999;} #accessibilityLinks li a.homeLink {background-image: url(../images/design/home_link.gif);} #accessibilityLinks li a.contactLink{background-image: url(../images/design/contact_link.gif);} #accessibilityLinks li a.mapLink {background-image: url(../images/design/map_link.gif);} #menu {display: inline; float: left; position: absolute; top: 45px; left: 160px; width: 600px; height: 40px;} #menu ul {display: inline; float: left; margin: 0; padding: 0; width: 600px; height: 40px; list-style-type: none;} #menu li {display: inline; float: left; margin: 0; padding: 0; width: 150px; height: 40px; list-style: none;} #menu li a {display: block; width: 150px; height: 40px; background-repeat: no-repeat; background-position: left top; text-indent: -999em;} #menu li a:hover {background-position: left bottom;} #menu #mainmenu_page_1 {display: none;} #menu #mainmenu_page_5 {display: none;} #menu #mainmenu_page_2 a {background-image: url(../images/design/menu_1.gif);} #menu #mainmenu_page_3 a {background-image: url(../images/design/menu_2.gif);} #menu #mainmenu_page_4 a {background-image: url(../images/design/menu_3.gif);} #menu #mainmenu_page_6 a {background-image: url(../images/design/menu_4.gif);} #menu .mainMenuSelected a {background-position: left bottom; cursor: default;} #searchBox {display: inline; float: right; position: absolute; top: 45px; right: 0; width: 200px; height: 35px;} #searchBox form {margin: 0; padding: 0; width: 200px; height: 35px; background: #004583;} #searchBox #s {display: inline; float: left; margin: 5px 0 5px 5px; padding: 4px; width: 155px; height: 15px; border: 1px solid #666; font-size: 90%; font-style: italic; color: #999;} #searchBox #go {display: inline; float: left; margin: 5px 0 0 2px; padding: 0; width: 25px; height: 25px; cursor: pointer;} #breadcrumbs {clear: both; padding: 5px 0; width: 960px; font-size: 90%;} #breadcrumbs ul {margin: 0; padding: 0; list-style: none;} #breadcrumbs li {display: inline; margin: 0; padding: 0;} #breadcrumbs a {text-decoration: none; color: #004583;} #breadcrumbs a:hover {text-decoration: underline; color: blue;} #imageBar {clear: both;} #imageBar p {margin-bottom:5px; padding: 0px 5px; color: #fff;} #imageBar .first {margin-top: 100px;} #imageBar #prePrepMenu, #imageBar #juniorMenu, #imageBar #seniorMenu, #imageBar #sixthFormMenu {float: left; width: 239px; height: 300px; border-left: 1px solid #fff; background-color: #666; background-repeat: no-repeat; background-position: left top;} #imageBar #prePrepMenu .moreLink, #imageBar #juniorMenu .moreLink, #imageBar #seniorMenu .moreLink, #imageBar #sixthFormMenu .moreLink{padding: 5px;} #imageBar #prePrepMenu h2, #imageBar #juniorMenu h2, #imageBar #seniorMenu h2, #imageBar #sixthFormMenu h2 {margin: 0; padding: 5px; height: 20px; background: #004583; font-size: 110%; color: #FFF;} #imageBar #prePrepMenu a, #imageBar #juniorMenu a, #imageBar #seniorMenu a, #imageBar #sixthFormMenu a {font-weight: bold; color: #FFF;} #imageBar #prePrepMenu a:hover, #imageBar #juniorMenu a:hover, #imageBar #seniorMenu a:hover, #imageBar #sixthFormMenu a:hover {color: #CCC;} #imageBar #prePrepMenu {background-image: url(../images/design/preprep_menu.jpg);} #imageBar #juniorMenu {background-image: url(../images/design/junior_menu.jpg);} #imageBar #seniorMenu {background-image: url(../images/design/senior_menu.jpg);} #imageBar #sixthFormMenu {background-image: url(../images/design/sixth_form_menu.jpg);} #introText {clear: both; padding: 10px 0; background: url(../images/design/dotted_line_horiz.gif) repeat-x left bottom;} #introText p {display: block; margin: 0; width: 960px; height: 30px; background: url(../images/design/intro_para.gif) no-repeat; font-weight: bold; text-align: center; text-indent: -999em; color: #004583;} #main {margin: 10px 0; width: 960px; background: url(../images/design/dotted_line_vert.gif) repeat-y 240px 0;} #subnav {display: inline; float: left; padding: 10px 8px 10px 0; width: 230px; font-weight: bold; color: #004583;} #subnav h2 {margin: 0 0 10px; font-size: 130%;} #subnav ul {list-style: none; margin-left: 10px; float: left; display: inline;} #subnav li {margin: 0 0 0 10px; line-height: 190%; font-weight: bold;} #subnav li ul li {font-weight: normal;} #subnav a {text-decoration: none; color: #004583;} #subnav a:hover {text-decoration: underline; color: blue;} #subnav .virtualTours img {margin: 0 10px; padding: 4px; background: #EAEAEA; border: 1px solid #CCC;} .moreLink.sidebar {display: block; margin: 5px 0 20px; text-align: right;} #usefulLinks ul {margin: 10px auto; width: 221px;} #usefulLinks li {margin: 10px 0; wifth: 221px; height: 70px;} #usefulLinks li a {display: block; width: 221px; height: 70px; background-position: left; background-repeat: no-repeat; text-indent: -999em;} #usefulLinks li a:hover {background-position: right;} #prospectusButton a {background: url(../images/design/prospectus_button.jpg);} #visitButton a {background: url(../images/design/visit_button.jpg);} #contactButton a {background: url(../images/design/contact_button.jpg);} #appButton a {background: url(../images/design/e4eNewsApp.jpg); height: 80px!important; } #contentWrapper {display: inline; float: right; padding: 10px; width: 700px;} .forcer {float: left; width: 0px; height: 250px;} #embed {width: 700px; height: 520px;} .imageFooterMiddle {padding-bottom: 20px; /* Enough room for 4 lines of text */ padding-top: 5px; line-height: 120%; font-size: 90% !important;} .newsItem h2, .newsItemOdd h2 {background: none; font-size: 110%;} #newsFeeds {margin: 30px 10px 0px; font-size: 90%;} #newsFeeds li {list-style: none;} #newsFeeds li a {font-size: 110%;} #newsFeeds img {margin: 0px 10px 0px 0px; padding: 0;} #footer {clear: both; padding: 10px 0; width: 960px; background: url(../images/design/dotted_line_horiz.gif) repeat-x left top; font-size: 80%; color: #004583;} #footer .leftgroup {display: inline; float: left;} #footer .rightgroup {display: inline; float: right; text-align: right;} #footer p {margin: 0; line-height: 140%;} #footer a {color: #004583;} #footer a:hover {color: blue;} /* Required for the editor in the backend. Make sure background images etc are removed in this attrubute... */ #editor {margin: 0px; padding: 0px; width: 700px; min-height: 590px; background-image: none; background-color: #fff; border: 5px solid #898989; text-align: left;} #editor #mainContent, #editor #subContent {border-right: 1px solid #cacaca; min-height: 590px; } #mainContent {float: left; margin: 0; padding: 0 10px 0 0; width: 380px;} #mainContent.twoColumns {width: 380px;} #subContent {float: right; margin: 0; padding: 0 0 0 10px; width: 300px;} #editor #homeMainContent, #editor #homeSubContent {border-right: 1px solid #cacaca; min-height: 590px; } #homeMainContent {float:left; margin: 0; padding: 0 10px 0 0; width: 460px;} #homeMainContent.twoColumns {width: 460px;} #homeSubContent {float: right; margin: 0; padding: 0 0 0 10px; width: 220px;} span.label {font-weight: bold; margin-right: 5px;} /* icons and styles for file attachments -------------------------------------------------- */ ol.fileAttachmentList {min-height: 40px; padding: 0 0 20px 0; margin: 0;} ol.fileAttachmentList li {list-style-type: none; height: 35px; padding-left: 40px; padding-top: 20px; margin-bottom: -10px; background-position: left; background-repeat: no-repeat; } ol.podcastList li {height: auto !important; } ol.podcastList li.attachmentDownload_mp3 {background-position: top left;} ol.fileAttachmentList li.attachmentDownload_doc {background-image: url(../images/icons/doc.gif) !important;} ol.fileAttachmentList li.attachmentDownload_mp3 {background-image: url(../images/icons/mp3.gif) !important;} ol.fileAttachmentList li.attachmentDownload_pdf {background-image: url(../images/icons/pdf.gif) !important;} ol.fileAttachmentList li.attachmentDownload_pub {background-image: url(../images/icons/pub.gif) !important;} ol.fileAttachmentList li.attachmentDownload_zip {background-image: url(../images/icons/zip.gif) !important;} ol.fileAttachmentList li.attachmentDownload_jpg {background-image: url(../images/icons/jpg.gif) !important;} ol.fileAttachmentList li.attachmentDownload_jpeg {background-image: url(../images/icons/jpeg.gif) !important;} ol.fileAttachmentList li.attachmentDownload_gif {background-image: url(../images/icons/gif.gif) !important;} ol.fileAttachmentList li.attachmentDownload_xls {background-image: url(../images/icons/xls.gif) !important;} ol.fileAttachmentList li.attachmentDownload_ppt {background-image: url(../images/icons/ppt.gif) !important;} ol.fileAttachmentList li.attachmentDownload_rar {background-image: url(../images/icons/rar.gif) !important;} ol.fileAttachmentList li.attachmentDownload_rtf {background-image: url(../images/icons/rtf.gif) !important;} ol.fileAttachmentList li.attachmentDownload_txt {background-image: url(../images/icons/txt.gif) !important;} ol.fileAttachmentList li.attachmentDownload_csv {background-image: url(../images/icons/csv.gif) !important;} ol.fileAttachmentList li.attachmentDownload_png {background-image: url(../images/icons/png.gif) !important;} /* Pagination - change border colours if necessary -------------------------------------------------- */ div#pagination {margin-top: 3px; height: 50px;} div#pagination .count {display: inline; float: left; padding: 5px;} div#pagination .pages {display: inline; float: right; padding: 5px;} div.pagination {display: inline; float: right; margin: 3px; padding: 3px;} div.pagination a, .Rows a {margin: 2px; padding: 2px 5px 2px 5px; border: 1px solid #0c1a27; text-decoration: none;} div.pagination a:hover, div.pagination a:active, .Rows a:hover, .Rows a:active {border: 1px solid #999; color: #999;} div.pagination span.current {margin: 2px; padding: 2px 5px 2px 5px; background: #26537a; border: 1px solid #0c1a27; font-weight: bold; color: #FFF;} div.pagination span.disabled {margin: 2px; padding: 2px 5px 2px 5px; border: 1px solid #EEE; color: #DDD;} /* DEFAULT $.calendar() styles */ .cal-popout {font-size:85%; margin: 0px 0px 0px 0px; clear: both;} .cal-popout td {text-align:center;} .cal-popout td a {display:block; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; padding: 2px 3px; margin:1px; text-decoration:none; border:1px solid #B8CADC; color:#87A5C2 !important; background: #CFDBE7; font-size: 120%; text-decoration: none !important;} .cal-linkHolder {position:relative; display:block;} .cal-loading {-moz-opacity:.50; filter:alpha(opacity=50); opacity:.50;} .cal-label {display:none;} .cal-icon {display:block; cursor:pointer; text-align:center; color: #96B6DF; font-weight: bold; font-size: 200%;} .cal-monthName {text-align:center;} .cal-popout td.cal-hasevent a {font-weight:bold; background-position: bottom left !important; color: #000000 !important; border: 1px solid #A6BEDB !important; background: #2D639F !important;} .cal-popout td.cal-hasevent a span {color: #ffffff;} .cal-day-names {color:#777;} .cal-popout abbr {cursor:help;} .cal-row-even a {background:#f3f3f3;} td.cal-today a {background:#94AEC9; color:#000 !important; border:1px solid #999; font-weight: bold;} td.cal-today a span {color: #ffffff;} .cal-popoutContent {background:#fff; border:1px solid #777; border-radius:7px; -moz-border-radius:7px; -webkit-border-radius:7px; width: 340px} .cal-events {margin:0 !important; padding:10px 10px 2px; list-style:none; color: #000000 !important;} .cal-events li {margin:0 0 8px !important; padding:0; font-size: 85% !important; color: #000000 !important;} .cal-events li span {display:block; color: #000!important;} .cal-eventTitle {font-weight:normal; float:left; text-align: left; width: 220px !important; color: #000000 !important;} .cal-eventTimescale {float:left; width: 90px !important; text-align: left; color: #000000 !important;} .cal-popoutPointer-border {border-color:#777;} .cal-popoutPointer-content {border-color:#fff;} /* Fix for ie6 transparency rendering */ *html .cal-popoutPointer-border {filter: chroma(color=pink);} *html .cal-popoutPointer-content {filter: chroma(color=pink);} .cal-prevMonth a {border: 1px solid #CFDEED !important; } #homepage_calendar {float: left; margin: 0px 0px 20px 0px;}