/* -------------------------------------------------------------- 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 {background: #bcdaff url(../images/design/background2.png) repeat-x top; font-family: Verdana, Tahoma, Arial, sans-serif; font-size: 70%; line-height: 170%; color: #333;} #backgeounddetail {position: relative;} #background {background: url(../images/design/backgroundedged.png) repeat-y center; position: relative;} a {text-decoration: none; color:#0099FF;} a:hover {text-decoration: underline; color: #CC6600;} a:visited {color: #666;} h1, h2, h3, h4, h5, h6 {margin: 0 0 5px; line-height: 130%; color: #8195a2;} h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover{text-decoration: none; } h1 {font-size: 2.0em; color: #0066cc;} h2 {font-size: 1.8em; color: #619cc3;} h3 {font-size: 1.6em; color: #889ba8} h4 {font-size: 1.4em; } h5 {font-size: 1.2em;} h6 {font-size: 1em;} p {margin-bottom: 2em;} strong, b {font-weight: bold;} em, i {font-style: italic; font-weight: inherit;} .left {float: left;} .right {float: right;} .center {margin: 0 auto; text-align: center;} form {margin: 10px 0;} label {display: block;} label em {font-weight: normal; color: #c00;} input {margin-bottom: 10px; padding: 2px; width: 250px; font-family: inherit;} select {margin-bottom: 10px; width: auto;} textarea {margin-bottom: 10px; padding: 2px; width: 400px;} input.button {width: auto; cursor: pointer;} input.radio {float: left; margin: 3px 10px 0 0; width: auto;} label.radio {float: left; margin-right: 3px; width: auto;} img {border: 0;} img.left, img[align="left"] {float: left; margin: 0 10px 10px 0;} img.right, img[align="right"] {float: right; margin: 0 0 10px 10px;} .noborder {padding: 0 !important; margin: 0 !important; border: none !important; background: none !important;} .clearborder {border: none !important;} .error {padding-left: 20px; color:#f00;} .caption {font-style: italic; font-size: 90%;} .noShow {display: none;} hr {margin: 10px auto; width: 100%; height: 0; border-bottom: 1px dashed #ccc;} hr.cleaner {visibility: hidden; clear: both; margin: -1px 0 0 0; padding: 0; height: 1px; border: none;} .clear:after {content: "."; display: block; clear:both; height: 0; visibility: hidden;} /* 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;} /* Structure and DIV specific styling -------------------------------------------------- */ #container {margin: 0 auto; width: 960px; padding: 0 10px; text-align: left; position: relative;} #header {width: 960px; height: 120px; background: #fff; color: #FFF;} #header h1, #header h2 {display: none;} #languageselect {position: absolute; right: 0; color: #333;} #logo {float: right; margin: 45px 20px 0 0;} #accessibilityLinks {display: inline; font-size: 80%;} #accessibilityLinks li {display: inline; padding: 0; margin: 0;} #accessibilityLinks li a {margin: 0 20px 0 0; padding: 0 0 0 20px; background: url(../images/design/text_link.gif) no-repeat left; color: #666;} #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);} #search {float: left; clear: both; display: inline; height: 50px; width: 210px; margin: 0; padding: 0 10px 0 0px; position: absolute; left: 0px; top: 50px;} #search form {padding: 0; margin: 9px 0 0 10px; font-size: 95%;} #search input {padding: 6px 0;} #search .searchText {width: 90px; background: #fff; border: 1px solid #ccc; margin-right: 0px; padding: 7px 10px; text-align: left; color: #666;} #search .submit {width: 60px; background: #fff; padding: 7px 10px; border: none; cursor: pointer; color: #333;} #search .submit:hover {color: #fff; background: #0066cc;} #innersearch {display: none; float: left; clear: both; /*display: inline;*/ height: 46px; width: 666px; margin: 0 0 30px 0; padding: 0 10px 0 20px; background: #F5F5F5; border: 2px solid #F5F5F5;} #innersearch:hover {border: 2px solid #FF9900;} #innersearch form {padding: 0; margin: 9px 0 0 10px; font-size: 95%;} #innersearch input {display: inline; padding: 6px 0;} #innersearch .searchText {display: inline; float: left; width: 170px; background: #fff; border: 1px solid #ccc; margin-right: 10px; padding: 7px 10px; text-align: left; color: #333;} #innersearch .submit {display: inline; width: 90px; background: #eee url(../images/design/whitearrow.png) left no-repeat; padding-left: 20px; border: none; border-left: 1px solid #ccc; cursor: pointer; color: #333;} #innersearch .submit:hover {color: #fff; background: #0066cc url(../images/design/whitearrow.png) left no-repeat;} #innersearch p {display: inline; float: left; padding: 5px 10px 0 0; margin: 0;} #innersearch select {display: inline; float: left; padding: 5px; color: #333; margin: 0; margin-right: 20px; border: 1px solid #ccc;} #innersearch option {padding: 0;} #main {width: 960px;} /* ------------------ start menu classes for standard menus ----------------- */ #menu {float: left; width: 958px; padding: 1px 0 25px 0;} #menu ul {margin: 0; padding: 0; width: 960px;} #menu li {margin: 0; padding: 0; list-style: none; display: inline; text-align: center} #menu li a {display: inline; padding: 6px 44px; margin: 0; float: left; background: #fff; border: 1px solid #eee; border-bottom: #FF9900 4px solid; border-right: none; color: #333;} #menu li.mainmenu_page_8 a {border-bottom: #666666 4px solid; border-left: none;} #menu li.mainmenu_page_9 a {border-bottom: #0099ff 4px solid;} #menu li.mainmenu_page_10 a {border-bottom: #000099 4px solid;} #menu li.mainmenu_page_11 a {border-bottom: #ffae00 4px solid;} #menu li.mainmenu_page_13 a {border-bottom: #660099 4px solid; width: 68px;} #menu li.mainmenu_page_14 a {border-bottom: #86b104 4px solid;} #menu li.mainmenu_page_74 a {border-bottom: #cc2600 4px solid; padding-left: 34px; padding-right: 34px;} #menu li.mainmenu_page_74 {display: none !important;} #menu li a:hover {border-bottom: #ccc 2px solid; border-top: #fff 1px solid; padding-bottom: 8px; color: #CC3300; text-decoration: none; background: #F4F4F4;} /* ------------------ ^^ end menu classes for standard menus ^^ ----------------- */ #contentWrapper {width: 960px; background: #fff;} .breaker {width: 100%; float: left; display: block; clear: both; height: 1px; border-bottom: 1px dotted #ccc; margin: 30px 0;} #subnavWrapper {float: left; display: inline; padding: 0; margin: 0; width: 220px;} #subnavWrapper ul {margin: 0; padding: 0;} #subnavWrapper li {display: block; margin: 0; padding: 0; list-style: none; line-height: 19px;} #subnavWrapper li span {display: block; margin: 0; padding: 0; } #subnavWrapper li a {width: 180px; display: block; color: #6699FF; padding: 5px 0 5px 7px; margin: 0 0 1px 0; border-left: 4px solid #ccc;} #subnavWrapper li a:hover {color: #666; border-left: 4px solid #33CCFF;} #subnavWrapper ul li ul {margin: 0; padding: 0;} #subnavWrapper li ul li {display: block; margin: 0; padding: 0; list-style: none;} #subnavWrapper li ul li a {width: 160px; display: block; color: #333; padding: 5px 0 5px 20px; margin: 0 0 0 20px; border-left: 4px solid #999;} #breadcrumbs {float: left; padding: 5px 10px 5px 0; margin: 0 0 10px 0; width: 950px; font-size: 85%; color: #999; display: inline; border-bottom: 1px solid #eee;} #breadcrumbs ul {margin: 0; padding: 0; list-style: none; float: left; width: 650px; display: inline;} #breadcrumbs li {display: inline; margin: 0; padding: 0;} #breadcrumbs li a {text-decoration: none; padding: 0 10px; color: #999;} #breadcrumbs li a:hover {text-decoration: underline; color: #BB0000;} #dateTime {float: right; width: 180px; text-align: right;} #content {display: inline; width: 700px; padding: 20px 20px 0 0; background: #fff; float: left;} #content img {padding: 4px; margin: 0 20px 0 0; background: #fff; border: 1px solid #ccc;} #content .e4eVideo {padding: 5px;} .icon {display: inline; position: absolute; right: 0; font-size: 120%; color: #fff;} .speach {background: url(../images/design/icon_speach.png) no-repeat #b2cf5c; width: 60px; height: 37px; padding: 5px 0 0 0; text-align: center;} .phoneicon {background: url(../images/design/icon_phone.png) right no-repeat; padding: 0px 0 10px 0;} .iconquestions {background: url(../images/design/icon_question.png) right no-repeat; padding: 20px 0 10px 0; margin-top: -20px;} .clockicon {background: url(../images/design/icon_clock.png) right no-repeat; padding: 5px 0 10px 0;} .columnfull {clear: both; width: 960px; margin: 0; padding: 0;} .columnhalf {float: left; width: 460px; margin: 0 20px 0 0; display: inline;} .columntwothird {float: left; width: 630px; margin: 0; display: inline;} .columnthird {float: left; width: 280px; padding: 0 20px 0 0; margin: 0 20px 0 0; display: inline; border-right: 1px dotted #ccc;} .columnforth {float: left; width: 220px; margin: 0 20px 0 0; display: inline;} .floatright {float: right;} #contactdetails, #contactdetails li {padding: 0; list-style-type: none; margin-bottom: 7px;} #contactdetails {float: right;} #contactdetails .active a{margin: 0 0 20px -29px;} .address {background:url(../images/design/icon_mail.png) no-repeat top left; padding: 0 0 25px 55px; margin: 5px 0 0 0; clear: both;} .phonenumber {background:url(../images/design/icon_phone.png) no-repeat top left; padding: 0 0 25px 55px; margin: 0px;} .emailaddress {background:url(../images/design/icon_email.png) no-repeat top left; padding: 0 0 25px 55px; margin: 0px;} #contactdetails h3 {margin: 0;} #contactdetails h3 a {float: left; width: 340px; border-left: 10px solid #ccc; padding: 10px; margin: 0 0 1px 0; display: block; color: #666666; outline: none;} #contactdetails h3 a:hover {border-left: 10px solid #cc2600; color: #cc2600; padding: 10px; margin: 0 0 1px 0; display: block;} .hospitalHolder {padding: 10px 0 0 30px; overflow: hidden;} #contactdetails h3 a:active {} #contactdetails h3.ui-state-active a {background: #cc2600; color: #fff; border-left: 10px solid #ccc;} #contactdetails h3.ui-state-active a:hover {color: #fff;} #faq, #faq li {margin: 0; padding: 0; list-style-type: none;} #faq li {float: left; display: inline;} #faq .question a {position: relative; display:block; width: 625px; padding: 15px 50px 25px 25px; background: #eee url(../images/design/question_bottom.png) no-repeat bottom ; margin-bottom: 10px; color: #333; outline: none;} #faq .question a:hover {background-color: #0099ff; color: #fff; text-decoration: none;} #faq .answer {padding: 0 15px; display: none; width: 670px;} #faq li .question a .showhide{position: absolute; right: 20px; top: 15px; display:inline; color:#999; font-size: 60%;} #faq li .question a:hover .showhide {color: #FFF;} #faq .questionactive a {background: #FF9900 url(../images/design/question_bottom.png) no-repeat bottom; color: #fff;} #faq li#breaker {clear: both; display: block; height: 10px; width: 700px; border-bottom: 1px solid #ccc; margin-bottom: 30px;} #services ul li {list-style-type: none; padding: 0; margin: 0;} #services .servicesGroup {float: left; display: inline;} #services #person { padding-left:10px; width: 240px;} #services #person img {margin-top: 40px;} #services #person span { width:50px; display: block; margin-left: -10px;} #services #individualSectionsLeft, #services #individualSections {width: 200px;} #services #wholeBody ul li {background:url(../images/design/servicesLine.png) 180px 10px no-repeat; text-align: right; padding: 0 20px 0 0;} #services #individualSections ul { background:url(../images/design/servicesLine.png) -190px 13px no-repeat; padding-left: 10px;} #services #individualSections ul li {border-left: 2px solid #ccc; padding-left:10px;} #services #individualSectionsLeft ul { background:url(../images/design/servicesLine.png) 179px 13px no-repeat; padding-left: 10px;} #services #individualSectionsLeft ul li {border-right: 2px solid #ccc; padding-right:10px; margin-right: 10px; text-align: right;} #services h3 {margin: 0; padding: 0 0 5px 0;} #services h4 {margin: 0; padding: 10px 0 5px 0; font-weight: bold;} #vacancies, #vacancies li {margin: 0; padding: 0; list-style-type: none;} #vacancies li {border-left: 10px solid #ccc; padding: 0 0 0 20px; margin: 0 0 30px 0;} #vacancies li:hover{border-left: 10px solid #f39a3b;} #vacancies .shortintro {border-left: 1px solid #ccc; margin-left: 10px; padding-left: 10px; color:#999; font-size: 80%;} #vacancies .applybutton a{background: #ccc url(../images/design/applyarrow.png) left no-repeat; display: block; width: 120px; height: 24px; padding: 6px 0 0 40px; margin: 0 0 0 -20px; font-size: 140%; font-weight: bold; color: #333;} #vacancies .applybutton a:hover{background: #f39a3b url(../images/design/applyarrow.png) left no-repeat;} /*contact*/ .info {visibility: hidden;} #pdh .contacttitle a .show, #pmu .contacttitle a .show, #srh .contacttitle a .show {position: absolute; right: 7px; display:inline; color:#999; font-size: 60%} #furtherreading {clear: both; float: left; display: block; border-top: 1px dotted #ccc; padding: 10px 0 0 0; margin: 20px 0 0 0; width: 960px;} #furtherreading h4 {background: #eee; padding: 10px 15px;} .links {float: left;} .links a {color: #990033;} .links a:hover {color: #CC6600;} .links li, .links ul {padding: 0; margin: 0; list-style-type: none; } #questions .links li {line-height: 19px; zoom: 1;} .links li a {display: block; width: 200px; padding: 5px 0 5px 15px; margin: 0 0 1px 0; border-left: 4px solid #ccc;} .links li a:hover {border-left: 4px solid #FF9900; color: #CC6600; background: #eee;} #questions {float: left; display: inline; position: relative; width: 480px; margin: 0;} #questions li a {width: 460px; color: #3333CC; } p#linkdisclaimer {color: #999; padding: 10px 0 0 19px; float: left;} .furtherquestions {position: absolute; right: 15px; top: 10px;} #sitelinks li {float: left;} .forcer {float: left; width: 0; height: 250px;} #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; font-size: 100%; color: #666; text-align: center; border-top: 1px solid #eee;} #footer a {color: #666;} #language {padding: 10px; border-bottom: 1px solid #eee;} #language img {margin: 0 20px;} /* Required for the editor in the backend. Make sure background images etc are removed in this attrubute... */ #editor {margin: 0; padding: 0; width: 495px; 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; width: 400px;} #mainContent.twoColumns {width: 400px;} #mainContent.even {width: 300px;} #subContent {float: right; margin: 0; width: 200px;} #subContent.even {width: 300px;} /* Required for the editor in the backend. Make sure background images etc are removed in this attrubute... */ #editor {margin: 0; padding: 0; width: 495px; min-height: 590px; background-image: none; background-color: #fff; border: 5px solid #898989; text-align: left; color: 000;} #editor #mainContent, #editor #subContent {border-right: 1px solid #cacaca; min-height: 590px; } #mainContent {float: left; margin: 0; width: 400px;} #mainContent.twoColumns {width: 400px;} #mainContent.even {width: 300px;} #subContent {float: right; margin: 0; width: 200px;} #subContent.even {width: 300px;} /* icons and styles for file attachments -------------------------------------------------- */ ul.fileAttachmentList {min-height: 40px; padding: 0 0 20px 0; margin: 0;} ul.fileAttachmentList li {list-style-type: none; height: 35px; padding-left: 40px; padding-top: 20px; margin-bottom: -10px; background-position: left; background-repeat: no-repeat; } ul.podcastList li {height: auto !important; } ul.podcastList li.attachmentDownload_mp3 {background-position: top left;} ul.fileAttachmentList li.attachmentDownload_doc {background-image: url(../images/icons/doc.gif) !important;} ul.fileAttachmentList li.attachmentDownload_mp3 {background-image: url(../images/icons/mp3.gif) !important;} ul.fileAttachmentList li.attachmentDownload_pdf {background-image: url(../images/icons/pdf.gif) !important;} ul.fileAttachmentList li.attachmentDownload_pub {background-image: url(../images/icons/pub.gif) !important;} ul.fileAttachmentList li.attachmentDownload_zip {background-image: url(../images/icons/zip.gif) !important;} ul.fileAttachmentList li.attachmentDownload_jpg {background-image: url(../images/icons/jpg.gif) !important;} ul.fileAttachmentList li.attachmentDownload_jpeg {background-image: url(../images/icons/jpeg.gif) !important;} ul.fileAttachmentList li.attachmentDownload_gif {background-image: url(../images/icons/gif.gif) !important;} ul.fileAttachmentList li.attachmentDownload_xls {background-image: url(../images/icons/xls.gif) !important;} ul.fileAttachmentList li.attachmentDownload_ppt {background-image: url(../images/icons/ppt.gif) !important;} ul.fileAttachmentList li.attachmentDownload_rar {background-image: url(../images/icons/rar.gif) !important;} ul.fileAttachmentList li.attachmentDownload_rtf {background-image: url(../images/icons/rtf.gif) !important;} ul.fileAttachmentList li.attachmentDownload_txt {background-image: url(../images/icons/txt.gif) !important;} ul.fileAttachmentList li.attachmentDownload_csv {background-image: url(../images/icons/csv.gif) !important;} ul.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;} #mainmenu li.position_5 a {padding-right: 58px;} #admin_dialogBox #admin_form_newscat li label {padding-left: 0 !important;} sup {font-size: 80%;}