﻿
/* General Settings */
.required {color:Red; padding:0 5px;}


/* Global Reset */
* {margin:0; padding:0;}
ul {margin:0; list-style: none;}
p, form {margin: 0;}


/* Main layout */
html, body {font-family:Arial, Helvetica, sans-serif; font-size:0.9em; height:100%; background:#f8f4de; color:#3c3c3c; line-height:18px;}
body {background:#f8f4de url('/images/design/background_body.gif') repeat-y center top;}
#skip {position:absolute; top:15px; left:-9999px;}
#ctl00_body {min-height:100%;}
#container {position:relative; margin:0 auto; text-align:left; min-height:100%;}
#logo {float:left; width:132px;}
#intro {width:940px; margin:0 auto;}
#content {width:910px; margin:0 auto; padding:15px; background:#fff; padding-bottom:130px;}
#main {float:left; width:565px; padding:0 25px 0 10px;}
#side {float:left; width:310px;} 


/* Header */
#header {width:100%; height:125px; background:#fff url('/images/design/background_menu.gif') repeat-x bottom;}
#headerwrapper {position:relative; width:940px; margin:0 auto;}
#strapline {float: left; width:495px; height:60px; background:#fff url('/images/design/strapline.gif') no-repeat center bottom;}


/* Search box */
#search {float:left; width:300px; height:35px; background:#e2e2e2; margin-top:20px; padding:10px 0 0 10px;}
#search input, textarea, select {border:0; font-family:Arial, Helvetica, sans-serif; font-size:10pt;}
#search input:hover, #search input:focus {background:#fff;}
#search .submit {padding-top:0;}
.searchbox {padding:3px 5px 3px 5px; border:0px #fff;}
#searchbox {float:left; padding-right:12px; }
.searchbutton {border:0px; padding:0;}


/* Homepage */
.profileimage {border-color:#cccccc; border-width:1px; border-style:solid; margin:0 15px 0 0;}
#news {background:#dfeae9; padding:10px;}
#news h2 {margin:0 0 8px 0; font:1.8em "Arial Narrow", Arial, Helvetica, sans-serif; color: #575757; font-weight: normal;}
#news .newslink {display:block; width:280px; text-align:right; padding-top:5px;}
#news .newslink a, #news #allnewslink a {color:#6195ab; text-decoration:none; border-bottom:dashed 1px #6195ab;}

#news #surreychamberslogo {margin: 30px 0 20px 0; outline:none; border:0;}
#services h2 {margin:0; padding:0;}
#services h2 a {outline:none; margin:0; padding:0 0 0 5px; font:0.7em "Arial Narrow", Arial, Helvetica, sans-serif; color: #575757; font-weight:500; text-decoration:none; border:0;}
#services .serviceintro {overflow:hidden; padding:5px 0 0 15px;}
#services .divider {height:6px; background:#fff url('/images/design/divider.gif') no-repeat center; padding:3px 0;}
#services .servicelink {display:block; width:530px; text-align:right; padding:0 0 5px 0;}
#services .servicelink, #services .servicelink a {color:#6195ab;}


/* General */
h1 {margin: 0 0 20px 0; font:2.1em "Arial Narrow", Arial, Helvetica, sans-serif; color: #6195ab; font-weight: normal; line-height:35px;}
h2 {margin: 0 0 10px 0; font:2em "Arial Narrow", Arial, Helvetica, sans-serif; color: #6195ab; font-weight: normal; line-height:35px;}
h3 {margin: 10px 0 5px 0; font:1.5em "Arial Narrow", Arial, Helvetica, sans-serif; color: #6195ab; font-weight: normal; line-height:35px;}
h4 {margin: 5px 0; font:1.5em "Arial Narrow", Arial, Helvetica, sans-serif; color: #6195ab; font-weight: normal; line-height:35px;}
.clear {clear:both;}
.smalltext {font-size:7pt;}
.divider {height:15px;}
.blueheading {display:block; margin: 0 0 10px 0; font:1.9em "Arial Narrow", Arial, Helvetica, sans-serif; color: #6195ab; font-weight: normal; line-height:35px;} 
.greyheading {display:block; margin: 0 0 10px 0; font:1.8em "Arial Narrow", Arial, Helvetica, sans-serif; color: #575757; font-weight: normal; line-height:35px;} 
#main a {color:#6195ab; text-decoration:none; border-bottom:dashed 1px #6195ab;}
#main ul {margin:0 0 20px 15px; list-style:square;}
#main p {margin-bottom: 15px;}
.noborder {text-decoration:none; border-bottom:0;}
acronym {border-bottom: 1px dashed #3c3c3c; cursor:help;}


/* Menu */
#menu {position:absolute; right:0px; top:89px; background:#6195ab;}
#menu ul {margin:0; overflow:hidden;}
#menu li {float:left; margin:0 0 0 12px; padding:0;}
#menu a {position:relative; display: block; color:#fff; height:36px; overflow:hidden; cursor:pointer;}
#menu span {position:absolute; top:0; left:0; height:100%; width:100%; background: url('/images/design/menu.gif') no-repeat 0 0;}
#menu_home a {width:50px;}
#menu_about a {width:70px;}
#menu_people a {width:83px;}
#menu_services a {width:64px;}
#menu_news a {width:107px;}
#menu_documents a {width:84px;}
#menu_vacancies a {width:77px;}
#menu_contact a {width:80px;}
#menu_ebusiness a {width:77px;}

#menu_home span {background-position:0 0;}
#menu_about span {background-position:-74px 0;}
#menu_people span {background-position:-170px 0;}
#menu_services span {background-position:-265px 0;}
#menu_news span {background-position:-339px 0;}
#menu_documents span {background-position:-460px 0;}
#menu_vacancies span {background-position:-554px 0;}
#menu_contact span {background-position:-660px 0;}
#menu_ebusiness span {background-position:-763px 0;}

#menu_home a:hover span {background-position: 0 -72px;}
#menu_about a:hover span {background-position: -74px -72px;}
#menu_people a:hover span {background-position: -170px -72px }
#menu_services a:hover span {background-position: -265px -72px }
#menu_news a:hover span {background-position: -339px -72px;}
#menu_documents a:hover span {background-position: -460px -72px; }
#menu_vacancies a:hover span {background-position: -554px -72px;}
#menu_contact a:hover span {background-position: -660px -72px;}
#menu_ebusiness a:hover span {background-position: -763px -72px;}

.home #menu_home span, .home #menu_home a:hover span {background-position: 0 -36px;}
.about #menu_about span, .about #menu_about a:hover span {background-position: -74px -36px;}
.people #menu_people span, .people #menu_people a:hover span {background-position: -170px -36px }
.services #menu_services span, .services #menu_services a:hover span {background-position: -265px -36px }
.news #menu_news span, .news #menu_news a:hover span {background-position: -339px -36px; }
.documents #menu_documents span, .documents #menu_documents a:hover span{background-position: -460px -36px; }
.vacancies #menu_vacancies span, .vacancies #menu_vacancies a:hover span {background-position: -554px -36px;}
.contact #menu_contact span, .contact #menu_contact a:hover span {background-position: -660px -36px;}
.ebusiness #menu_ebusiness span, .ebusiness #menu_ebusiness a:hover span {background-position: -763px -36px;}


/* Admin Menu */
#adminmenu {position:absolute; right:0px; top:89px; background:#6195ab;}
#adminmenu ul {margin:0; overflow:hidden;}
#adminmenu li {float:left; margin:0 0 0 20px; padding:0;}
#adminmenu a {position:relative; display: block; color:#fff; height:36px; overflow:hidden; cursor:pointer;}
#adminmenu span {position:absolute; top:0; left:0; height:100%; width:100%; background: url('/images/design/menu_admin.gif') no-repeat 0 0;}
#adminmenu_pages a {width:54px;}
#adminmenu_offices a {width:58px;}
#adminmenu_services a {width:70px;}
#adminmenu_staff a {width:44px;}
#adminmenu_newsletters a {width:90px;}
#adminmenu_documents a {width:88px;}
#adminmenu_promotions a {width:88px;}
#adminmenu_events a {width:59px;}
#adminmenu_glossary a {width:72px;}

#adminmenu_pages span {background-position:-5px 0;}
#adminmenu_offices span {background-position:-78px 0;}
#adminmenu_services span {background-position:-149px 0;}
#adminmenu_staff span {background-position:-234px 0;}
#adminmenu_newsletters span {background-position:-293px 0;}
#adminmenu_documents span {background-position:-401px 0;}
#adminmenu_promotions span {background-position:-725px 0;}
#adminmenu_events span {background-position:-833px 0;}
#adminmenu_glossary span {background-position:-915px 0;}

#adminmenu_pages a:hover span {background-position:-5px -72px;}
#adminmenu_offices a:hover span {background-position:-78px -72px;}
#adminmenu_services a:hover span {background-position:-149px -72px;}
#adminmenu_staff a:hover span {background-position:-234px -72px;}
#adminmenu_newsletters a:hover span {background-position:-293px -72px;}
#adminmenu_documents a:hover span {background-position:-401px -72px;}
#adminmenu_promotions a:hover span {background-position:-725px -72px;}
#adminmenu_events a:hover span {background-position:-833px -72px;}
#adminmenu_glossary a:hover span {background-position:-915px -72px;}

.pages #adminmenu_pages span, .pages #adminmenu_pages a:hover span {background-position:-5px -36px;}
.offices #adminmenu_offices span, .offices #adminmenu_offices a:hover span {background-position:-78px -36px;}
.services #adminmenu_services span, .services #adminmenu_services a:hover span {background-position:-149px -36px;}
.staff #adminmenu_staff span, .staff #adminmenu_staff a:hover span {background-position:-234px -36px;}
.newsletters #adminmenu_newsletters span, .newsletters #adminmenu_newsletters a:hover span {background-position:-293px -36px;}
.documents #adminmenu_documents span, .documents #adminmenu_documents a:hover span {background-position:-401px -36px;}
.promotions #adminmenu_promotions span, .promotions #adminmenu_promotions a:hover span {background-position:-725px -36px;}
.events #adminmenu_events span, .events #adminmenu_events a:hover span {background-position:-833px -36px;}
.glossary #adminmenu_glossary span, .glossary #adminmenu_glossary a:hover span {background-position:-915px -36px;}


/* Side Boxes*/
.bluebox {background: #dfeae9; padding:10px 15px; color:#3c3c3c; font:13pt "Arial Narrow", Arial, Helvetica, sans-serif; color:#575757; font-weight:normal;}
.bluebox h2 {margin:0 0 8px 0; font:1.35em "Arial Narrow", Arial, Helvetica, sans-serif; color:#575757; font-weight:normal;}
.bluebox ul {list-style-type:none;}
.bluebox li {padding: 3px 0 7px 30px; background:url('/images/design/arrow_right.gif') no-repeat top left; margin-left:5px;}
.bluebox li a {color:#3c3c3c; text-decoration:none; font:0.9em "Arial Narrow", Arial, Helvetica, sans-serif; color:#575757; font-weight:normal;}
.bluebox li a:hover {text-decoration:underline;}
.bluebox p {margin-bottom: 15px;}

.lightbluebox {background: #ebf1f1; padding:10px 15px; color:#3c3c3c;}
.lightbluebox h2 {margin:0 0 8px 0; font:1.65em "Arial Narrow", Arial, Helvetica, sans-serif; color:#575757; font-weight:normal;}
.lightbluebox input, textarea {border:solid 1px #ddd9d8; font-family:Arial, Helvetica, sans-serif; font-size:0.9em; padding:3px;}
.lightbluebox input:hover, .lightbluebox input:focus, .lightbluebox textarea:hover, .lightbluebox textarea:focus {background:#f4f4f3;}
.lightbluebox a {color:#3c3c3c; text-decoration:none;}
.lightbluebox a:hover {text-decoration:underline;}
.lightbluebox p {margin-bottom: 15px;}

.lowersidecontent {padding:10px 15px;}
.lowersidecontent a {color:#6195ab; text-decoration:none; border-bottom:dashed 1px #6195ab;}
.lowersidecontent p {margin-bottom: 15px;}


/* Footer */
#footer {position:absolute; width:100%; bottom:0; height:110px; background:#6195ab; color:#fff; padding-top:10px; line-height:24px; font-size:0.7em;}
#footer a {color:#fff; text-decoration:none;}
#footer #wrapper {position: relative; width:910px; margin:0 auto;}
#footer .left {float:left; width:600px; padding: 0 0 0 10px;}
#footer .right {float:left; width:300px;}
#footer .left ul {margin:0; float:left;}
#footer .left li {float:left; width:145px;}
#footer .left li a {position:relative; display: block; height:24px; overflow:hidden; cursor:pointer;}
#footer .spacer {padding:0 10px;}
#footer .underline {text-decoration:underline;}


/* Admin */
#admincontent {width:910px; margin:0 auto; padding:15px; background:#fff; padding-bottom:135px;}
#admincontent #main {float:left; width:565px; padding:0 25px 0 10px;}
#admincontent #side {float:left; width:300px;} 

#admincontent .formlabel {display:block; font-weight:bold; padding:15px 0 3px;}
#admincontent input, textarea {border:solid 1px #ddd9d8; font-family:Arial, Helvetica, sans-serif; font-size:10pt; padding:3px;}
#admincontent input:hover, #admincontent input:focus, #admincontent textarea:hover, #admincontent textarea:focus {background:#f4f4f3;}
#admincontent .requiredfield {color:#939291; font-size:8pt; font-weight:normal;}
#admincontent .submit {padding-top:20px;}
#admincontent .checkboxlist td {padding:2px 0;}
#admincontent .checkboxlist input {border:0;}
#admincontent .radiobuttonlist input {border:0;}

#controlbar {position:fixed; height:15px; line-height:15px; top:0; left:25px; z-index:10; color:#fff; width:130px; padding:5px; background:#6195ab;}
#controlbar a {color: #fff; text-decoration:none;}
#controlbar a:hover {text-decoration:underline;}

.datagrid td {padding:5px 10px;}
.datagrid th {padding:0 5px; background:#6195ab; height:30px; color:#fff;}
.datagrid th a {color:#fff;}
.datagrid td {border:solid 1px #F1F3F5;}
.datagrid table {border:solid 1px #F1F3F5;}
.datagrid td a {color:#6195ab; text-decoration:none; border-bottom:dashed 1px #6195ab;}
              
/* Contact form */
.formlabel {display:block; font-weight:bold; padding:15px 0 3px;}
input, textarea, select {border:solid 1px #ddd9d8; font-family:Arial, Helvetica, sans-serif; font-size:10pt; padding:3px;}
input:hover, input:focus, textarea:hover, textarea:focus {background:#f4f4f3;}
.requiredfield {color:#939291; font-size:8pt; font-weight:normal;}
.submit {padding-top:20px;}

.bluebox #offices ul {list-style-type:none;}
.bluebox #offices li {padding: 3px 0 7px 30px; background:url('/images/design/arrow_right.gif') no-repeat top left; margin-left:5px;}
.bluebox #offices li a {color:#3c3c3c; text-decoration:none; font:0.9em "Arial Narrow", Arial, Helvetica, sans-serif; color:#6195ab; text-decoration:none; border-bottom:dashed 1px #6195ab;}
#offices .name {padding-bottom:10px; display:block;}
#offices .smalltext {font-family:Arial, Helvetica, sans-serif; font-size:10pt;}
#offices .divider {height:5px;}

/* Staff Search */
.searchprofile {float:left; width:270px; margin:0 10px 10px 0; height:100px; padding-top:12px;}
.searchprofile:hover {background:#f0f1f1;}
.searchprofile .viewlink {padding-top:10px;}

/* Staff Profile */
#profilephone {float:left; width:170px;}
#profilefax {float:left; width:170px;}


/* Service Pages */
.sideprofileimage {float:left; border-color:#cccccc; border-width:1px; border-style:solid; margin:0 0 9px 0;}
.sideprofileimagemiddle {float:left; border-color:#cccccc; border-width:1px; border-style:solid; margin:0 9px;}
#serviceenquiry {float:left; padding-top:20px; width:220px;}
#servicelinks {float:left; width:345px; padding-top: 41px; color:#6195ab; text-align:right;}
#servicelinks a {color:#6195ab; text-decoration:none; border-bottom:0;}
#servicelinks a:hover {text-decoration:underline;}
.documenticon {padding-right:5px;}
.viewalllink {padding-top:10px; display:block;}


/* Document Lists */
.documentlist ul {margin-left:15px;}
.documentlist li {list-style:square; margin: 3px 3px 0;}
.documentlist .divider {height:6px; background:#fff url('/images/design/divider.gif') no-repeat center; padding:10px 0;}
.documentlist .subtitle {color: #575757; font-size:0.8em;}
.documentlist .bluetext {color: #6195ab;}
.documentlist .spacer {height:8px;}
.documentlist .noborder {text-decoration:none; border-bottom:0;}
.headingdivider {padding-left:5px; background:#f1f0f0; margin-bottom:15px;}


/* Search Results */
.searchlink {color:#6195ab; text-decoration:none; border-bottom:dashed 1px #6195ab;}


/* Quiz */
ol {padding-left:25px; border:0;}
ol input {border:0; font-family:Arial, Helvetica, sans-serif; font-size:10pt; margin-right:5px;}
ol li {margin-left:5px;}
