/*--------------------------------------------------------------------------------- Whitehill Pelham website Designed by Mat Johnson for DNX Marketing www.dnxmarketing.com Last updated 14-11-2008 -----------------------------------------------------------------------------------*/ /*--------------------------------------------------------------------------------- CSS reset, plus a few other tweaks -----------------------------------------------------------------------------------*/ body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0; } table { border-collapse:collapse; border-spacing:0; } fieldset,img { border:0; } .clear { clear:both; } /*--------------------------------------------------------------------------------- Layout & Basic styling of background-images etc -----------------------------------------------------------------------------------*/ body { background:#363e49 url(../images/gradient-bg.jpg) repeat-x; } #bg-container { width:960px; margin:0 auto; background:url(../images/shadow-bg.jpg) no-repeat; } #container { width:920px; margin:0 auto; background-color:#ffffff; } #nav-box { height:84px; background:#2d313b url(../images/nav-bg.gif); } #header { height:263px; } #logo { padding:17px 0 0 21px; width:191px; float:left; } #phone { float:right; padding:7px 19px 0 0; } #nav { clear:right; float:right;} #nav-admin { clear:right; float:right; width:300px;} #header-flash { height:169px; } #search-box { height:74px; padding:5px 30px 0 0; } #content { padding:27px 0 30px 0; } #main-content { width:588px; background:#ffffff url(../images/main-bg.gif) repeat-y; float:left; } #main-content-admin { width:788px; float:left; } #main-box { width:524px; background-color:#dcdddf; border:1px solid #c0c1c3; margin:30px 0 0 30px; padding:0 0 18px 0; } #left-box { float:left; width:260px; } #right-box { float:right; width:250px; padding-right:12px; } #left-box2 { float:left; width:260px; } #right-box2 { float:right; width:305px; } #side-content { width:332px; float:right; } #advert { float:right; padding:0 0 0 0; } #home #advert { float:right; padding:63px 0 0 0; } #employers #advert { float:right; padding:0px 0 0 0; } #footer { width:920px; height:56px; background-color:#363e49; border-bottom: 8px solid #ffffff; border-top: 30px solid #ffffff; } #footer-info { padding: 13px 0 0 16px; float:left; width:680px; } #rec { float:right; padding-top:3px;} /*--------------------------------------------------------------------------------- Main Navigation -----------------------------------------------------------------------------------*/ #nav, #nav-admin { border-top:1px solid #191b20; margin-top:8px; } #nav ul, #nav-admin ul { float:left; width:686px; padding:0; margin:0; list-style-type:none; } #nav a, #nav-admin a { padding-top:6px; text-align:center; float:left; width:96px; height:36px; line-height:14px; text-decoration:none; color:white; border-left:1px solid #333742; border-right:1px solid #191b20; } #nav ul li, #nav-admin ul li { padding-top:33px; } #nav li .testimonials-nav { padding-top:6px; padding-bottom:8px; } #nav a:hover, #nav-admin a:hover { background-color:#131519; } #nav li, #nav-admin li { display:inline; } #home .home-nav, #about .about-nav, #candidates .candidates-nav, #employers .employers-nav, #vacancies .vacancies-nav, #testimonials .testimonials-nav, #contact .contact-nav { background-color:#131519; } #nav .contact-nav { border-right:none; } #nav .home-nav, #nav .about-nav, #nav .candidates-nav, #nav .employers-nav, #nav .vacancies-nav, #nav .testimonials-nav, #nav .contact-nav { padding-top:14px; height:30px; } #nav-admin .home-nav, #nav-admin .about-nav, #nav-admin .candidates-nav, #nav-admin .employers-nav, #nav-admin .vacancies-nav, #nav-admin .testimonials-nav, #nav-admin .contact-nav { padding-top:14px; height:30px; } /*--------------------------------------------------------------------------------- Copy -----------------------------------------------------------------------------------*/ html, body { font: 12px Arial, Helvetica, sans-serif; } h1, h2, h3, h4, h5 { font-weight:normal; } h1 { display:none; } h2 { padding: 0 0 5px 30px; font-size: 24px; letter-spacing:0px; color: #41586d; } h3 { color:#41586d; font-size:20px; padding-top:18px; } h4 { padding: 0 25px 5px 30px; font-size: 17px; letter-spacing:0px; color: #41586d; } h5 { padding: 10px 25px 2px 30px; font-size: 17px; letter-spacing:0px; color: #41586d; } #content p { padding: 0 28px 18px 30px; font-size: 12px; line-height:20px; color: #2d313b; } #footer p { font-size: 11px; color:#ffffff; } #phone p { color:#ffffff; } #phone strong { font-weight:normal; font-size:20px; } #main-box p { padding:0 8px 0 20px; } /*--------------------------------------------------------------------------------- Links -----------------------------------------------------------------------------------*/ a { color:#565d69; } #footer a { color:#718394; } #footer a:hover { color:#ffffff; } #side-content li { list-style-type:none; } #side-content li a { text-decoration:none; display:block; margin: 0 0 0 30px; padding:4px 0 0 12px; width:290px; height:38px; border-top:1px solid #dfdfdf; line-height:16px; color:#3d3d3e; } .last-vacancy { border-top:1px solid #dfdfdf; border-bottom:1px solid #dfdfdf; } /* adds an underline to the last job vacancy rollover */ #side-content li a:hover { background-color:#dcdddf; } #main-box h3 a { text-decoration:none; color:#41586d; padding-left:42px; background:url(../images/medium-arrow.gif) 19px 2px no-repeat; } #main-box h3 a:hover { color:#23262e; } #admin h3 a { text-decoration:none; color:#41586d; padding-left:42px; background:url(../images/medium-arrow.gif) 19px 2px no-repeat; } #admin h3 a:hover { color:#23262e; } #side-content h3 { padding-top:0px; } #side-content h3 a { text-decoration:none; color:#41586d; padding-left:54px; background:url(../images/medium-arrow.gif) 29px 2px no-repeat; } #side-content h3 a:hover { color:#23262e; } #side-content .nolink { font-size:20px; text-decoration:none; color:#41586d; padding-left:54px; background:url(../images/medium-arrow.gif) 29px 2px no-repeat; } #main-content h3 { padding-top:10px; } #main-content h3 a { text-decoration:none; color:#41586d; padding-left:43px; background:url(../images/medium-arrow.gif) 19px 2px no-repeat; } #main-content h3 a:hover { color:#23262e; } #main-content-admin h3 { padding-top:10px; padding-left:10px; } #main-content-admin h3 a { text-decoration:none; color:#41586d; padding-left:43px; background:url(../images/medium-arrow.gif) 19px 2px no-repeat; } #main-content-admin h3 a:hover { color:#23262e; } #content #main-content-admin table p { padding: 0px 0px 0px 0px; font-size: 12px; line-height:20px; color: #2d313b; } #main-content li { list-style-type:none; margin-left:70px; color:#565d69; } .top { padding-left:45px; background:url(../images/up-arrow.png) 29px 0px no-repeat; } .back { padding-left:45px; background:url(../images/back-arrow.png) 29px 0px no-repeat; } #main-content tr a { text-decoration:underline; } #left-box2 li { list-style-type: square; color:#565c69; line-height:20px; font-size:13px; } #right-box2 li { list-style-type: square; color:#565c69; line-height:20px; font-size:13px;} a:link.pdf,a:visited.pdf { display:block;line-height: 18px; text-decoration:none;background:url(../images/icon-pdf.gif) no-repeat left top; padding-left:20px;} a:hover.pdf,a:active.pdf { display:block;line-height: 18px; text-decoration:underline;background:url(../images/icon-pdf.gif) no-repeat left top; padding-left:20px;} a:link.word,a:visited.word { display:block;line-height: 18px; text-decoration:none;background:url(../images/icon-word.gif) no-repeat left top; padding-left:20px;} a:hover.word,a:active.word { display:block;line-height: 18px; text-decoration:underline;background:url(../images/icon-word.gif) no-repeat left top; padding-left:20px;} /*--------------------------------------------------------------------------------- Header images -----------------------------------------------------------------------------------*/ #home #header { height:271px; background:#dcdddf url(../images/headers/header-home.jpg) no-repeat; } #about #header { height:271px; background:#dcdddf url(../images/headers/header-about.jpg) no-repeat; } #candidates #header { height:271px; background:#dcdddf url(../images/headers/header-candidates.jpg) no-repeat; } #employers #header { height:271px; background:#dcdddf url(../images/headers/header-employers.jpg) no-repeat; } #vacancies #header { height:271px; background:#dcdddf url(../images/headers/header-vacancies.jpg) no-repeat; } #testimonials #header { height:271px; background:#dcdddf url(../images/headers/header-testimonials.jpg) no-repeat; } #contact #header { height:271px; background:#dcdddf url(../images/headers/header-contact.jpg) no-repeat; } #sitemap #header { height:271px; background:#dcdddf url(../images/headers/header-sitemap.jpg) no-repeat; } #privacy #header { height:271px; background:#dcdddf url(../images/headers/header-privacy.jpg) no-repeat; } #terms #header { height:271px; background:#dcdddf url(../images/headers/header-terms.jpg) no-repeat; } #disciplines #header { height:271px; background:#dcdddf url(../images/headers/header-disciplines.jpg) no-repeat; } #training-services #header { height:271px; background:#dcdddf url(../images/headers/header-disciplines.jpg) no-repeat; } /*--------------------------------------------------------------------------------- Form -----------------------------------------------------------------------------------*/ #job-form { text-align:right; float:right; font-size:13px; color:#41586d; } select.dropdown1 { width:300px; height:20px; margin-top:8px; margin-right:34px; } select.dropdown2 { width:300px; height:20px; margin-top:8px; margin-right:34px; } select.dropdown3 { width:300px; height:20px; margin-top:8px; } #form #username, #form #company, #form #tel, #form #email, #form #comment { width:387px; margin-left:100px; } #form label { width:100px; position: absolute; padding-left:30px; } .row { padding-top:4px; } .buttons { margin:8px 0 24px 100px; } .formwFile { padding-left:100px;} label { text-align:left; font-weight:bold;} .formerror { border: 1px solid; border-color:#7cc31c; background-color : #d4f0b2; color:#000000; width: auto; padding: 5px 0; padding-left: 15px;} .errortext { padding-left: 5px; padding-top:10px; font: bold smaller sans-serif;} /*--------------------------------------------------------------------------------- Lists -----------------------------------------------------------------------------------*/ li { padding-bottom:0px; } #about li, #employers li { list-style-type: square; color:#565c69; line-height:20px; } #home #left-box li, #home #right-box li { list-style-type: square; color:#565c69; line-height:20px; } #home h4 li { list-style-type: square; color:#565c69; line-height:20px; font-size:13px; } #about #left-box { padding:0 0 18px 0px;width:220px; } #about #right-box { width:330px; } #employers #side-content li { list-style-type: square; color:#565c69; line-height:20px; } #employers #side-content ul { padding-left:44px; } #training-services #side-content li { list-style-type: square; color:#565c69; line-height:20px; } #training-services #side-content ul { padding-left:44px; } #privacy li { list-style-type:square; padding-bottom:12px; } #home #sidebox h3 a { padding:0px;margin:0px; } /*--------------------------------------------------------------------------------- Tables -----------------------------------------------------------------------------------*/ #main-content table { margin-left:30px; padding:10px; } #main-content th, td { padding: 8px 10px; } #main-content tr.highlight { background-color: #dcdddf; cursor: pointer; } #main-content-admin table { margin-left:30px; padding:10px; } #main-content-admin th, td { padding: 8px 10px; } #main-content-admin tr.highlight { background-color: #dcdddf; cursor: pointer; } #page-control { font-size:14px; font-weight:bold; float:right; padding:18px 30px 0 0; } #page-control a { color:#a7b0b9; } #page-control a:hover { color:#363e49; } /*--------------------------------------------------------------------------------- Quotes -----------------------------------------------------------------------------------*/ blockquote { padding:11px 30px 24px 70px; line-height:20px; background:url(../images/quote.gif) 30px 0px no-repeat; } blockquote strong { color:#363e49; } .map { padding:0 20px 20px 30px; } .alert { color:#ff0000; font-weight:bold;} .inactive { color:#999999; } .title { padding: 0 0 5px 0px; font-size: 24px; letter-spacing:0px; color:#000000; font-weight:bold; }