/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Title : Author : Chris Munn / chris.munn@gforces.co.uk / G-Forces Web Management Ltd Type: Screen, Projection Description : Screen and projection stylesheet Ashford High School site - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* COMMON AND GLOBAL */ body { font:62.5%/1.6 arial, verdana, helvetica, sans-serif; margin:0; padding:0; color:#4b4b4b; text-align:center; background: #f8f6f2 url(../images/layup/bodyBg.jpg) repeat-x; } /* This font sizing is for standards based browsers (firefox, opera, mozilla) that can re-size text. Declaring the font size in pixels makes it more consistent across browsers. */ td, textarea, input, select { font:100% arial, verdana, helvetica, sans-serif; } html>body td, html>body textarea, html>body input, html>body select { font-size:11px; } /* some browsers don't inherit the font into tables or textareas! */ /* ----- IDS ----- */ #container { width:922px; margin:0 auto; text-align:left; font-size:110%; } #printHeader { display:none;} #header { position: relative; height: 147px; } #header #logo { position: absolute; top: 0px; left: 0px; } #header #headerLinks { position: absolute; top: 70px; left: 600px; } #header #welcome { position:absolute; top:3px; left:745px; color:#444444; font-weight:bold; } #header #welcome a { text-decoration:underline;color:#444444; } #homeContent { width: 922px; font-size: 12px; } #homeContent #rightCol { float: left; width: 234px; background: url(../images/layup/homeRightColBg.gif) no-repeat; } #homeContent #rightCol .padding { padding: 0px 12px 0px 9px; margin: 15px 0px 0px 0px; } #homeContent #rightCol .box { background: #e8e7e3 url(../images/layup/homeRightBoxHeader.jpg) no-repeat top; padding: 14px 10px 14px 14px; border-bottom: 1px solid #d3d2d1; } #homeContent #rightCol .box a { display: block; text-decoration: none; font-weight: normal; } #homeContent #rightCol .box a .redText { font-size: 12px !important; } #homeContent #rightCol .lastItem { background:url(../images/layup/homeRightColBottomBg.gif) no-repeat; padding-bottom: 105px; border-bottom: none; } #homeContent #rightCol #eventsBg { background: #DEDEDE; padding-bottom: 10px; border-bottom: none; } #rightCol p { padding-bottom: 10px; } #rightCol ul { padding: 0px 0px 15px 0px; margin: 0px; } #rightCol ul li { margin: 3px 0px 3px 25px; padding: 0px; } #homeContent #leftCol { float: left; width: 687px; } #homeContent #leftCol .padding { padding: 20px 20px 0px 20px; background: url(../images/layup/homeContentBg.gif) no-repeat; } #homeContent #leftCol #homeContentFootBg { background: url(../images/layup/homeContentFootBg.gif) no-repeat; height: 14px; } #homeContent #leftCol #mainImage { background: url(../images/layup/homeMainImageBg.gif) no-repeat; padding: 15px 0px 6px 12px; } #homeContent #leftCol #homeImage { float: left; } #homeContent #leftCol #homeJumps { padding: 0px 3px 10px 3px; } #homeContent #leftCol #homeJumps .box { width: 163px; height: 114px; float: left; background: url(../images/layup/homeBoxBg.jpg) no-repeat; padding: 10px 0px 0px 5px; } /*#homeContent #leftCol #homeJumps .box .padding { display: block; padding: 15px 8px 0px 12px !important; }*/ #homeContent #leftCol #homeFootBg { height: 50px; background: url(../images/layup/homeContentFootBg.gif) no-repeat; } #internalContent { background: url(../images/layup/internalBg.gif) repeat-y; width: 922px; font-size: 12px; } #internalContent #topShadow { display: block; background: url(../images/layup/internalTopShadowBg.gif) top no-repeat; height: 15px; } #internalContent #bottomShadow { display: block; background: url(../images/layup/internalBottomShadowBg.gif) bottom no-repeat; height: 25px; } #internalContent #leftCol { width: 198px; float: left; } #internalContent #leftCol .padding { padding: 0px 0px 0px 24px; } #internalContent #rightCol { width: 724px; float: left; background: url(../images/layup/1pxGif.gif) left repeat-y; } #internalContent #rightCol .padding { padding: 0px 22px 0px 24px; } #internalContent #rightCol #requiredText { width: 109px; float: left; padding: 0px 0px 0px 12px; } #internalContent #rightCol #requiredPlugins { width: 263px; padding: 20px 0px 0px 0px; } #internalContent #rightCol #requiredPlugins img { float: left; } #internalContent #rightCol #dateFilter { float: right; padding-top: 10px; width: 280px; } #internalContent #rightCol #dateFilter select, #internalContent #rightCol #dateFilter img, #internalContent #rightCol #dateFilter #filterLabel { float: left; margin-right: 10px; } #internalContent #rightCol .boxHeading { display: block; background: #b8b7b4; color: #FFF; padding: 5px 15px 5px 15px; font-weight: bold; margin-bottom: 10px; } #internalContent #rightCol .internalBox { background: #f8f6f2; padding-bottom: 10px; } #internalContent #rightCol .boxDetails { display: block; padding: 0px 10px 0px 15px; } #internalContent #rightCol #googleMap { display: block; float: right; margin: 0px 0px 0px 15px; } #internalContent #rightCol .internalBox .boxDetails .borderGrey { margin: 0px 0px 0px 0px; } #internalContent #rightCol #contactBoxes .listItem { width: 333px; height: 180px; float: left; margin-right: 10px; margin-top: 30px; } #internalContent #rightCol #contactBoxes .lastItem { margin-right: 0px; } #internalContent #rightCol #contactBoxes .readMore a, .btnRight { color: #2c4472; border-top: 1px solid #FFF; display: block; padding: 3px 10px 3px 10px; float: right; background: #f8f6f2; text-decoration: none; } #internalContent #rightCol .closeDate { display: block; padding: 5px 0px 0px 10px; } #internalContent #rightCol #vacancyList .listItem { padding-bottom: 30px; } /* ----- CLASSES ----- */ .clear { clear:both; } .hide { display:none; } .show { display:block; } .printShow { display:none; } .float_left { float:left !important; } .float_right { float:right !important; } .align_left { text-align:left !important; } .align_center { text-align:center !important; } .align_right { text-align:right !important; } .align_justify { text-align:justify !important; } .align_bottom { vertical-align:bottom !important; } .image_right { float:right; padding:0 0 15px 15px; position: relative; z-index: 0; } .image_left { float:left; padding:0 15px 15px 0; } .image_center { margin:0 auto;} .hand { cursor:pointer;} .blueBtn60 { cursor: pointer; padding: 2px 0px 2px 0px; margin: 0px 10px 0px 0px; text-align:center; width: 60px; border: 3px solid #455981; display: block; background: #19305e; color: #FFF; text-decoration: none; } .blueBtn80 { cursor: pointer; padding: 2px 0px 2px 0px; margin: 0px 10px 0px 0px; text-align:center; width: 80px; border: 3px solid #455981; display: block; background: #19305e; color: #FFF; text-decoration: none; } .blueBtn90 { cursor: pointer; padding: 2px 0px 2px 0px; margin: 0px 10px 0px 0px; text-align:center; width: 90px; border: 3px solid #455981; display: block; background: #19305e; color: #FFF; text-decoration: none; } .borderGrey { border: 5px solid #b8b7b4; margin: 13px 0px 0px 0px; } .redText { display: block; font-size: 11px; font-weight: bold; color: #bd2727; padding: 15px 0px 0px 0px; } .listImage { margin: 0px 0px 5px 0px; float: left; } /* ----- IMAGE FRAMES ----- */ #homeJumps .box .cmsImage { background: url(../images/layup/homeNoImage.jpg) no-repeat; cursor:pointer; display:block; height:86px; position:relative; width:158px; } #homeJumps .box .cmsImage .frame { display:block; left: 0px; position: absolute; top: 0px; } #internalList .listItem { display: block; width: 220px; float: left; } #internalList .listItem a { text-decoration: none; cursor: pointer; } #internalList .listItem span { display: block; clear: both; padding-bottom: 15px; padding-left: 10px; } /* ----- LISTS ----- */ #internalList .listType1 { height: 195px; } #internalList .listType1 a { text-decoration: none; font-weight: normal; cursor: pointer; } #internalList .listType1 .itemImage { float: left; width:186px; height:141px; background:url(../images/layup/noImage141x186.gif) no-repeat; } #internalList .listType1 .itemImage .borderGrey { margin: 0px; } #internalList .listType1 .itemDetails { float: left; width: 482px; height: 142px; background: #f8f6f2; } #internalList .listType1 .itemDetails .itemHeading { display: block; background: #b8b7b4; color: #FFF; padding: 8px 15px 8px 15px; font-weight: bold; } #internalList .listType1 .itemDetails .itemInfo { display: block; padding: 10px 15px 0px 15px; } #internalList .listType1 .itemReadMore { display: block; clear: both; color: #374c78; font-weight: bold; padding: 0px 10px 0px 0px; margin-top: 1px; } #internalList .listType1 .itemReadMore .padding { padding: 4px 10px 4px 10px !important; background: #f8f6f2; display: block; } #internalList .listType2 { height: 225px; } #internalList .listType2 { float: left; width: 329px; padding-right: 10px; } #internalList .listType2 a { text-decoration: none; font-weight: normal; cursor: pointer; } #internalList .listType2 .itemImage { float: left; } #internalList .listType2 .itemImage .borderGrey { margin: 0px; border-top: none; } #internalList .listType2 .itemHeading { display: block; background: #b8b7b4; color: #FFF; padding: 8px 15px 8px 15px; font-weight: bold; } #internalList .listType2 .itemDetails { float: left; width: 143px; height: 137px; background: #f8f6f2; } #internalList .listType2 .itemDetails .itemInfo { display: block; padding: 10px 15px 0px 15px; } #internalList .listType2 .itemReadMore { display: block; clear: both; color: #374c78; background: #f8f6f2; font-weight: bold; padding: 4px 10px 4px 10px; margin-top: 1px; } #internalList .listType2 .itemReadMore .padding { padding: 0px 0px 0px 0px !important; display: block; } #internalList .listType3 { float: left; width: 219px; padding-right: 5px; height: 220px; } #internalList .listType3 a { text-decoration: none; font-weight: normal; cursor: pointer; } #internalList .listType3 .itemImage { float: left; } #internalList .listType3 .itemImage .borderGrey { margin: 0px; border-top: none; } #internalList .listType3 .itemHeading { display: block; background: #b8b7b4; color: #FFF; padding: 8px 15px 8px 15px; font-weight: bold; } #internalList .listType3 .itemDetails { float: left; width: 219px; height: 105px; background: #f8f6f2; } #internalList .listType3 .itemDetails .itemInfo { display: block; padding: 10px 15px 0px 15px; } #internalList .listType3 .itemReadMore { display: block; clear: both; color: #374c78; background: #f8f6f2; font-weight: bold; padding: 4px 10px 4px 10px; margin-top: 1px; } #internalList .listType3 .itemReadMore .padding { padding: 0px 0px 0px 0px !important; display: block; } #internalList .listType4 { height: 155px; } #internalList .listType4 a { text-decoration: none; font-weight: normal; cursor: pointer; } #internalList .listType4 .itemImage { float: left; } #internalList .listType4 .itemImage .borderGrey { margin: 0px; } #internalList .listType4 .itemDetails { float: left; width: 668px; height: 102px; background: #f8f6f2; } #internalList .listType4 .itemDetails .itemHeading { display: block; background: #b8b7b4; color: #FFF; padding: 8px 15px 8px 15px; font-weight: bold; } #internalList .listType4 .itemDetails .itemInfo { display: block; padding: 10px 15px 0px 15px; } #internalList .listType4 .itemReadMore { display: block; clear: both; color: #374c78; font-weight: bold; padding: 0px 10px 0px 0px; margin-top: 1px; } #internalList .listType4 .itemReadMore .padding { padding: 4px 10px 4px 10px !important; background: #f8f6f2; display: block; } /* ----- HEADINGS & PARAGRAPHS ----- */ h1, h2, h3, h4, h5, h6 { margin:0; padding:0 0 15px 0; font-size:100%; font-weight:bold;} h1 { color: #1e3568; font-size: 23px; } /* ----- TOP NAVIGATION ----- */ #primaryNav { background: url(../images/layup/primaryNavBg.gif) no-repeat; height: 37px; position: relative; z-index: 999;} #primaryNav ul { list-style: none; margin: 0; padding: 0px 0px 0px 0px; } #primaryNav li { float: left; background: url(../images/layup/navSpacer.gif) right no-repeat; } #primaryNav li a { text-decoration: none; /*float: left;*/ padding: 9px 10px 11px 10px; display: block; color: #FFF; } #primaryNav li.firstItem { padding-left: 7px; } #primaryNav li.firstItem a { padding-left: 13px; } #primaryNav li#navDate { float: right; color: #d2d1d0; background: none; padding: 9px 16px 0px 0px; } #primaryNav li#navDate a { background: none; text-decoration: none; color: #fff; padding: 0px 30px 0px 0px; margin: 0px; } #primaryNav li a:hover, #primaryNav li a.active { background: #e6e5e5; color: #7d7d7c; } /* ----- DROPDOWN NAV ----- */ #primaryNav ul li ul { left: -999em; position: absolute; } #primaryNav ul li:hover ul, #primaryNav ul li.sfhover ul { left: auto; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; display: block; width: 200px; float: left; } #primaryNav ul li:hover ul li, #primaryNav ul li.sfhover ul li { display: block; padding: 0px 0px 0px 0px; margin: 0px; background: transparent url(../images/layup/primaryNavBg.gif) -10px 0px no-repeat; width: 200px; border-bottom: 1px solid #999999; border-left: 1px solid #999999; border-right: 1px solid #999999; } #primaryNav ul li:hover ul li a, #primaryNav ul li.sfhover ul li a { padding: 5px 5px 5px 10px; margin: 0px; color: #FFFFFF; } #primaryNav ul li:hover ul li a:hover, #primaryNav ul li.sfhover ul li a:hover { color: #052264; } /* ----- SECONDARY HOME NAVIGATION ----- */ #secondaryNav { width: 149px; padding-top: 35px; } #secondaryNav ul { list-style: none; padding: 0; margin: 0px 0px 0px 0px; } #secondaryNav li { border-bottom: 1px solid #e9e8e8; float: left; width: 149px; text-align: right; } #secondaryNav li a { text-decoration: none; color: #636261; font-weight: bold; font-size: 11px; display: block; padding: 7px 0px 7px 0px; border-top: 1px solid #FFF; } #secondaryNav li a:hover, #secondaryNav li a.active { background: url(../images/layup/secondaryNavBg.gif) repeat-x; color: #1c3568; } #secondaryNav li#navHeading { font-weight: bold; padding: 0px 0px 4px 0px; } #secondaryNav ul li ul li { border: none; } #secondaryNav ul li ul li a { font-weight: normal; border: none; padding: 3px 0px 3px 0px; } /* ----- SECONDARY HOME NAVIGATION ----- */ #secondaryHomeNav { float: right; width: 156px; padding-top: 108px; } #secondaryHomeNav ul { list-style: none; padding: 0; margin: 0px 16px 0px 0px; } #secondaryHomeNav li { border-top: 1px solid #d0cecb; float: left; width: 140px; } #secondaryHomeNav li.lastItem { border-bottom: 1px solid #d0cecb; } #secondaryHomeNav li a { text-decoration: none; color: #636261; font-weight: normal; font-size: 12px; display: block; padding: 4px 0px 3px 12px; border-top: 1px solid #f8f6f2; border-bottom: 1px solid #f8f6f2; } #secondaryHomeNav li a:hover, #secondaryHomeNav li a.active { background: #dfddd9; } /* ----- ASA ----- */ #asaForms {} #asaForms h2 { padding: 5px 14px 5px 14px; color: #fff; font-size: 0.9em; background: #1b3568; } #asaForms a { font-weight: normal; } #asaForms form { padding: 12px 0px 6px 15px; background: #f8f6f2; } #asaForms form div { margin-bottom: 15px; } #asaForms label { width: 105px;} #asaForms input { width: 165px; border: 1px solid #4b4b4b; } #asaForms textarea { width: 165px; height: 80px; border: 1px solid #4b4b4b; } #asaForms .btnLogin { width: 66px; height: 29px; float: right; } #asaForms .btnSubmit { width: 66px; height: 29px; float: right; } #asaForms .loginBox { float: left; width: 306px; } #asaForms .registerBox { float: right; width: 306px; padding-left: 23px; margin-right: 17px; border-left: 1px solid #e9e8e8; display: inline; } #asaForms .registerBox .validation-advice { width: 262px; } #asaForms .clear { margin: 0; display: block; } /* ----- DOWNLOAD NAV ----- */ #downloadList { padding: 0px; margin: 0px; list-style: none; width: 263px; } #downloadList li { padding: 0px; margin: 0px; float: left; width: 263px; } #downloadList li a { display: block; padding: 10px 0px 10px 40px; text-decoration: none; border-bottom: 1px solid #e9e8e8; color: #7a7977; } #downloadList li.iconPdf { background: url(../images/layup/iconPdf.gif) no-repeat; } #downloadList li.iconQuicktime { background: url(../images/layup/iconQuicktime.gif) no-repeat; } /* ----- SITE MAP ----- */ #sitemap { list-style:none; margin:0 0 0 5px; padding:0;} #sitemap ul { list-style:none; margin:10px 0 0px 15px; padding:0;} #sitemap li { background:url(../images/layup/bulletSitemap.gif) 0px 11px no-repeat; padding:6px 0 5px 15px;} /* ----- BREADCRUMBS/PAGINATION/PAGE TOP AND BOTTOMS ----- */ #breadcrumbs { padding: 5px 0px 25px 24px; } #breadcrumbs a { color: #1c3568; font-weight: normal; text-decoration: underline; } #breadcrumbs strong { color: #1c3568; } #pagination { float: right; } #pagination a { padding: 0px 4px 0px 4px; text-decoration: none; } #pagination a:hover { text-decoration: none; background:#000000; color:#FFFFFF; } #pagination .active { text-decoration: none; background:#000000; color:#FFFFFF; } #pagination span { display: block; float: left; padding: 0px 2px 0px 2px; } /* ----- FOOTER ----- */ #footerInternal { background: url(../images/layup/internalFooterBg.jpg) no-repeat; width: 922px; } #footerInternal .padding { padding: 20px 24px 0px 24px; } #footerInternal a { font-weight:normal; text-decoration:none; color: #4b4b4b; } #footerInternal a:hover { text-decoration:underline;} #footer { } #footer .padding { padding: 20px 24px 0px 24px; } #footer a { font-weight:normal; text-decoration:none;} #footer a:hover { text-decoration:underline;} /* ----- GLOBAL ----- */ img { display:block; border:0; } p { padding:0 0 15px 0; margin:0; } address { font-style:normal;} ul { margin: 0px 0px 25px 15px; padding: 0; } /* ----- LINKS ----- */ a { color:#204b9e; font-weight:bold; text-decoration:underline; } a:hover { text-decoration:none; } /* ----- FORMS ----- */ form { padding:0; margin:0; } fieldset { padding:0; margin:0; border:0px none; display:inline; } legend { padding:0; margin:0; display:none; } label { display:block; width:260px; float:left; } input, textarea { width:200px; font-size:11px !important;} .requiredLabel { color:#1c3568;} .checkRadio { width:20px; position:relative; left:-7px;} #frmContact { margin-bottom:15px;} #frmContact p { padding:7px 0;} #frmContact select { width:204px;} #frmContact div { margin-bottom:10px;} #btnSubmit { width:59px; height:28px; border:none;} /* ----- Prototype Validation ----- */ input.disabled { border: 1px solid #F2F2F2; background-color: #F2F2F2; } input.validation-failed, textarea.validation-failed, select.validation-failed { border: 1px solid #4544e4; color : #FF3300; } input.validation-passed, textarea.validation-passed, select.validation-passed { border: 1px solid #00CC00; color : #000; } .validation-advice { margin: 5px 0; width:452px; padding: 5px; background-color: #1c3568; color : #FFF; font-weight: bold; } /* ----- TABLES ----- */ table { border-collapse:collapse; } table p { padding:0px; }