@import url("reset.css"); 
@import url("typography.css"); 


/* */
.clearfix:after{content:"."; display:block; height:0; clear:both; visibility:hidden}
.clearfix{display:inline-block}

.clear{clear:both}

/* */
html, body{ margin:0;  padding:0;  text-align:center;  background:#EEE}

body{background:url(../images/header_bk.png) top left no-repeat}

#pagewidth{width:965px; text-align:left; margin-left:auto; margin-right:auto; background:url(../images/page_bk.png) top left repeat-y; position:relative}

#wrapper{width:100%}

#header{position:relative; height:215px; width:100%; background:url(../images/header_panel.png) top left no-repeat}

#secondaryContent{width:260px; float:left; margin:0 0 0 5px}

#mainContent{float:right; width:640px; margin:0 20px 0 0}

#footer{background:url(../images/footer_bk.png) top left repeat-x; clear:both}

#footer_frame{text-align:left; margin:0 auto; width:965px; min-height:140px; font-size: 1.2em}

#accessibility {position:absolute; top:0; left:-9999px; z-index:99999; display:block; margin: 0}
#accessibility a{display:block; padding:14px 24px; color:black; font-size:1.4em; background-color:yellow}
#accessibility a:focus{left:0}

#header #logo{margin:0; padding:0}

#header #logo a.a4a{display:block; float:left; width:505px; height:56px; text-indent:-5000px; margin:25px 0 0 0}
#header #logo a.a4a{background:url(../images/logo_a4a.png) top right no-repeat}

#header #logo a.lcd{display:block; float:right; width:80px; height:80px; text-indent:-5000px; margin:20px 0 0 0}
#header #logo a.lcd{background:url(../images/logo_lcd.png) top right no-repeat}

#header #logo a.access_link{float: right;font-size:1.4em; margin:20px 26px 0 0}

#header #surveylink{position:absolute; color:#7B0139; letter-spacing:-1px; font-weight:normal; left:285px; top:132px}

#surveylink a{color:#fff; background:#E3004A; font-size:28px; padding:4px 20px 6px}

#header #mapNav{position:absolute; color:#7B0139; font-size:2.8em; letter-spacing:-1px; font-weight:normal; top:132px; left:21px}

#header #mapNav a{color:#7B0139}

#header span.arrow{position:absolute; left:10px; bottom:-51px; width:95px; height:35px; background:url(../images/map-arrow.png) bottom left no-repeat; z-index:10}

ul#mainNav{display:block; position:absolute; top:138px; left:5px}

#mainNav li{float:left; margin:0; padding:0}

ul#mainNav li a{color:#333; font-size:24px; letter-spacing:-1px; font-weight:normal; padding:12px 24px 0; margin:0; height:62px; display:block}

ul#mainNav a:hover, ul#mainNav li.this a{background:url(../images/menu_on.png) top left no-repeat; text-decoration:none}

#header #mainNav ul#surveylink a:hover{background:#F4B0C1; text-decoration:none}
 
#mainContent h2.arrow{background:url(../images/h2_bk.png) no-repeat scroll left top transparent;display:block;height:50px;margin:5px 0 0 5px;padding:6px 0 0 10px;width:660px; color: #000}
#mainContent .strapline {display: block; margin: 5px 10px 0 10px; font-size: 1em;}

// #mainContent h3{text-transform:capitalize}

#mainContent li{list-style:circle; margin:0.5em 0 0 20px}

#mainContent #rating li{list-style:none !important}

#mainContent #googlemap{display:block; border:1px solid #DEDEDE; margin:0.75em 0 1.5em; border:5px solid #DDD}

#mainContent .infoblock{display:block; float:left; margin:0 0 10px 0}

#mainContent .newsblock{display:block; float:right; margin: 1.4em 5px 0.8em 0; width: 330px; background: url(../images/news_bk.png) top left no-repeat;}

#mainContent ul.reviews h3 {float: left}

#mainContent ul.reviews, #mainContent ul.locations, #mainContent ol.comments{display:block; width:640px; padding:0; float: left; margin: 12px 0 20px}

#mainContent ul.reviews li, #mainContent ul.locations li, #mainContent ol.comments li{float:left; display:block; border-bottom:1px solid #DEDEDE; margin:0; padding:0.75em 0; width:640px; list-style:none; font-size:1em}

#mainContent div.newsblock ul.reviews {width:330px;}

#mainContent ol.comments li.author{background-color:#E3004A; color:#FFF}

#mainContent ol.comments li.author a{color:#000}

#mainContent ul.reviews li:hover, #mainContent ul.locations li:hover{background:#F6F6F6}

img.avatar, img.location{float:left; display:block; border:1px solid #DEDEDE; padding:5px; margin:2px 0 0 2px}

div.newsblock p img.avatar {margin: 0 10px 0 0;}

ul.reviews li img.avatar {margin: 0 10px 0 0;}

#mainContent .avatar_big{display:block; width:150px; border:1px solid #eee; padding:5px; margin:10px 0 15px 0}

.surveys_thumb{display:block; float:right; margin-right:68px}

#mainContent ul.reviews li h4,
#mainContent ul.reviews li p.ratestars,
#mainContent ul.locations li p,
#mainContent ul.locations li h4 {margin: 0 0 0 130px}

#mainContent ol.comments li p, form.edit-button{margin-left:70px}

#mainContent ol.comments li h4{margin:0 0 0 70px}

#mainContent ul.reviews li h4 a, #mainContent ul.locations h4 a, #mainContent ol.comments li h4{font-weight:bold}

#mainContent ul.reviews li h4 a span {font-weight: normal; color: #333}
#mainContent ul.reviews li:hover a, #mainContent ul.locations li:hover a{color:#000; text-decoration:underline}

#mainContent .left{float:left; margin:0 10px 10px 0}
#mainContent .right{float:right; margin:0 0 10px 10px}
#mainContent .webblerimage {display: block; background: #eeeeee; padding: 5px}
#mainContent .webblerimage .imagecaption{font-size: 1.4em; padding: 5px 0}

#mainContent #listings{clear:both}
#mainContent #listings .item{padding:0.5em}
#mainContent #listings .shade{background:#FDEFF3}
#mainContent #listings .item h4, #mainContent #listings .item p {margin: 0; padding: 0}

#mainContent .login_info{color:#E3004A; font-size:1.4em; font-weight:bold}

ul#podcast_list li.mp3 a {background:url(../images/icon_mp3.png) top left no-repeat; padding:7px 0 7px 40px}
ul#podcast_list li.mp3 object {margin: 18px 0 18px 40px; display: block;}
ul#podcast_list, ul#podcast_list li {list-style-type:none; margin: 0; padding: 0;}

#secondaryContent .login h3{color:#FFF}
#secondaryContent .login h4{color:#FFF; font-weight: bold; border-top: 1px solid #fff; padding: 10px 0 0 0; float: left; width: 100%; margin: 0}

#secondaryContent .postcode{display:block; background:#F4B1C2; border:5px solid #9C0654; padding:1em; margin:0 0 10px 0; float: left; width: 230px}
#secondaryContent .postcode label{color:#000; font-size: 1.4em; font-weight: bold; float: left; padding:0 0 5px;}
#secondaryContent .postcode h3 {margin:5px 0 6px; padding: 0}

#secondaryContent .kwsearch label {color:#333333;float:left;font-size:1.4em;font-weight:normal;padding:0;text-transform:capitalize;width:100%;}
#secondaryContent .kwsearch form select {width: 200px; float: left; margin: 0 0 5px 0}
#secondaryContent .kwsearch select option {text-transform: capitalize}
#secondaryContent .kwsearch form button.kwsearchfind {background:none repeat scroll 0 0 #9C0654;border:1px solid #9C0654 !important;color:#FFFFFF !important;margin:5px 0 0;padding:0 0 2px;text-indent:0;width:50px;}


#secondaryContent .kwsearch h4 {border-top:1px solid #FFFFFF;float:left;margin:10px 0 0;padding:10px 0 6px;width:100%; font-size: 1.4em; font-weight: bold}

#secondaryContent p.small{color:#000; font-size:1em; margin:0; padding: 0.4em 0 0.9em;}

#secondaryContent form input{background:transparent url(../images/input_white.png) top left no-repeat; width:193px; height:22px; border:0; float:left; margin:0 0 3px 0}

#secondaryContent form input[type=submit]{background:none repeat scroll 0 0 #FFFFFF;border:1px solid #FFFFFF;clear:both;float:left;height:auto;margin-bottom:0.75em;padding:2px;width:auto;}

#secondaryContent form button{background:transparent url(../images/submit.png) top left no-repeat; width:22px; height:22px; border:0; float:left; text-indent:-9999px; margin:0 0 0 3px}

#secondaryContent form button:hover{background-position:bottom; cursor:pointer}

#secondaryContent .login{position:relative; display:block; background:#E3004A; border:5px solid #9C0654; padding:0 1em; color:#FFF; margin:0 0 10px 0; float:left; width:230px}

#secondaryContent .login form{clear:both}

#secondaryContent .login form label{font-size:1.2em}

#secondaryContent .login a, #secondaryContent .login a:hover{color:#FFF!important}

#secondaryContent .login img.loggedin{float:left; padding:5px; border:1px solid #9E0054; background:#eee; margin:5px 10px 10px 0}

#secondaryContent ul.loggedin{clear:both;float:left;margin:5px 0 10px 3px;}

#secondaryContent ul.loggedin li{margin:0 0 0.3em 0; width: 220px;}

.login h3{height:20px}

#mainContent .steps {display: block; background: url(../images/steps_bk.png) top left no-repeat; width: 330px; margin: 1.4em 0 0.8em 5px; float: left}
#mainContent .steps img {margin: 0 10px 0 0}
#mainContent .steps h2 {padding: 0 0 0 10px; color: #000}

#mainContent .steps ol {display: block; margin: 12px 0 0 0}
#mainContent .steps ol li {list-style: none; margin: 0; width: 315px; float: left}

#mainContent .steps ol li.step1 {background:none repeat scroll 0 0 #FCEBEF;margin:1em 0 0 0;padding:0 0 1em 15px;width:315px;}
#mainContent .steps ol li.step2 {background:none repeat scroll 0 0 #FCEBEF;margin:3px 0 0;padding:1em 10px 1em 15px;width:305px;}
#mainContent .steps ol li.step3 {background:none repeat scroll 0 0 #FCEBEF;margin:4px 0 0;padding:1em 10px 1em 15px;width:305px;}
#mainContent .steps ol li.step4 {background:none repeat scroll 0 0 #FCEBEF;margin:4px 0 0;padding:1em 10px 1em 15px;width:305px;}

#mainContent .steps ol li a {color: #333; }
#mainContent .steps ol li a:hover {color: #E3004A; text-decoration: underline}
#mainContent .steps ol li h4 {padding: 0; margin: 0; font-size: 1.2em; font-weight: bold}
#mainContent .steps ol li p {padding: 0; margin: 0; font-size: 1em;}
/* */
#secondaryContent .infoblock{position:relative; display:block; background:#fff; border:5px solid #DDD; padding:0 1em 1em; margin:0 0 10px 0; float:left; width:230px}

#secondaryContent .infoblock span.arrow{position:absolute; top:0; right:-38px; width:38px; height:65px; background:url(../images/location_arrow.png) bottom left no-repeat}

#secondaryContent .infoblock ul ul{margin:0; padding:0}
#secondaryContent .infoblock ul li.this{font-weight:bold}
#secondaryContent .infoblock ul ul li{border:0; margin:0.5em 0 0 10px; padding:0; font-size:1em}
#secondaryContent .infoblock ul li{padding:0 0 .5em 0; float:left; width:230px; font-size:1em; margin: 0.1em 0}
#secondaryContent .infoblock ul.namedmenu li, #secondaryContent .infoblock ul.leaflist li{font-size:1.4em}
#secondaryContent .infoblock ul.namedmenu2 li{font-size:1em}
#secondaryContent .infoblock abbr{float:left}
#secondaryContent .infoblock .avatar{margin:0 5px 0 0}
#secondaryContent .infoblock ul li.pdf, #secondaryContent .infoblock ul li.mp3, #secondaryContent .infoblock ul li.share{font-size:1.2em}

#secondaryContent .infoblock ul li ul .thissubitem a {font-weight: bold}

#secondaryContent .locationblock{position:relative; display:block; background:#f9d7e0; border:5px solid #fff; padding:0 1em 1em; margin:0 0 10px 0; float:left; width:230px}
#secondaryContent .locationblock span.arrow{position:absolute; top:0; right:-38px; width:38px; height:65px; background:url(../images/location_arrow.png) bottom left no-repeat}
#secondaryContent .locationblock #googlemap{border:1px solid #333;}
#secondaryContent .locationblock h4 {font-size:1.3em;margin:0 0 0.5em;padding:0;}
#secondaryContent .locationblock p {font-size: 1em}

p.geo{display:none}

#secondaryContent .infoblock a, #secondaryContent li.vcard:hover a{color:#9C0654}

#secondaryContent li.vcard:hover a{color:#000; text-decoration:underline}

#secondaryContent .infoblock ul.getsurveys {margin: 0 0 0 -3px}
#secondaryContent .infoblock ul.getsurveys li{font-size:1.4em; margin:0.3em 0 0.2em;}
#secondaryContent .infoblock ul.getsurveys li a{color:#333}
#secondaryContent .infoblock ul.getsurveys li.pdf a{background:url(../images/icon_pdf.png) top left no-repeat; padding:7px 0 7px 40px}
#secondaryContent .infoblock ul.getsurveys li.word a{background:url(../images/icon_word.png) top left no-repeat; padding:7px 0 7px 40px}
#secondaryContent .infoblock ul.getsurveys li.mp3 a{background:url(../images/icon_mp3.png) top left no-repeat; padding:7px 0 7px 40px}
#secondaryContent .infoblock ul.getsurveys li.tel{background:url(../images/icon_tel.png) top left no-repeat; padding:7px 0 7px 40px; font-weight:bold; color:#7b013c}

#secondaryContent .infoblock ul.bookmarkservices li a {float:left;font-size:1.4em;margin:5px 0;padding:0 0 0 30px;}

#secondaryContent .infoblock li a.facebook{background:url(../images/icon_facebook.png) top left no-repeat;}
#secondaryContent .infoblock li a.stumbleupon{background:url(../images/icon_stumble.png) top left no-repeat;}
#secondaryContent .infoblock li a.digg{background:url(../images/icon_digg.png) top left no-repeat; }
#secondaryContent .infoblock li a.delicious{background:url(../images/icon_delicious.png) top left no-repeat;}
#secondaryContent .infoblock li a.twitter{background:url(../images/icon_twitter.jpg) top left no-repeat;}

#secondaryContent .joinblock{position:relative; display:block; background:#fcecef; border:5px solid #bebec0; padding:0 1em 1em; margin:0 0 10px 0; float:left; width:230px}
#secondaryContent .joinblock h3 {color: #333}
.module h4{position:relative; height:1.7em; color:#fff; float:left; width:180px}

#researchdir .module h4{background-color:#9b90ad}

.module h4 a{position:absolute; top:0px; right:0; width:20px; height:20px; overflow:hidden; margin:0 0 0 0; cursor:pointer}

.module h4 a img{display:block}

.collapsed h4 a img{position:relative; top:-20px}

.collapsed .moduleContent{display:none}

.moduleContent{width:220px}

#mainContent form{float:left; margin:0.75em 0}

#mainContent form p{display:block; padding:10px; background:#eee; margin:2px 0 0 0; width:620px; float:left}

#mainContent form p.wide{background:#DDD}

#mainContent form label{font-weight:normal; width:250px; display:block; float:left}

#mainContent form label.wide{font-weight:bold; width:600px; display:block; float:left}

#mainContent form label.wide2{font-weight:normal; width:490px; display:block; float:left; margin:0 10px 0 0}

#mainContent form input.inputitem, #usercomments form input{width:240px; border:1px solid #7B003B; padding:0.1em; float:right; margin:0 115px 0 0}

#mainContent form select{width:243px; border:1px solid #7B003B; float:right; margin:0 115px 0 0}

#mainContent form textarea{width:240px; border:1px solid #7B003B; padding:0.1em; float:right; margin:0 115px 0 0; height:200px}

#mainContent form span.required{color:red; float:left}

#mainContent form span.error{color:red; font-weight:bold; font-size:1.3em}

#mainContent form span.checkboxgroup{background:#ddd; padding:2px 0px}

#mainContent form span.option{border-left:5px solid #eee; padding:5px}

#mainContent form .imageupload{display:block; background:#eee; float:left; width:620px; padding:10px; border-top:2px solid #fff}

#mainContent .existingimage img {display: block; border: 1px solid; float: right; width: 120px}

.formradio_yes{margin:0 0 0 250px}

form p.submit{background:#F4B1C2}

#mainContent form form p.submit button{background:transparent url(../images/submit.png) top right no-repeat; width:230px; height:22px; border:0 !important; float:left; margin:0 0 0 3px; float:right; color:#333; font-weight:bold}

#mainContent form p.submit button:hover{background-position:bottom right; cursor:pointer; text-decoration:underline}

#mainContent form .fadeup{display:inline; color:#f00; font-weight:bold; margin-left:5px}

#mainContent form img.loggedin{float:right; padding:5px; border:1px solid #A5ACB2; background:#fff; margin:0 10px 0 0}

#mainContent p.comment{border-bottom:1px solid #eee; padding:0 0 0.8em 0}

.formradio{clear:both; float:left; margin:0 5px 2px 0; width:347px}

.venuepostcode{margin: 0 0 0 5px}

#footer_frame a{color:#333}

#footer_frame .links, #footer_frame .links2{float:left; width:265px; margin:15px 0 0 20px}
#footer_frame .links li, #footer_frame .links2 li {margin: 0.2em 0}

#footer_frame li.accessibilityLink a {background: #112233; color: #ffcc33; padding: 1px 2px }
#footer_frame li.accessibilityLink a:hover {background: #ffcc33; color: #112233;}

#footer ul#credits{float:right; margin-top:8em}
#footer ul#credits li{float:left; margin-right:10px; color:#000; font-size:1.2em}
#footer ul#credits li a{color:#E3004A; font-weight:bold}

#footer_frame h4{color:#333; font-weight:bold}

#styleswitcher {display: block; float: right; margin:13px 0 0;width:270px;}

table.questions{float:left; width:100%; margin:0 0 1.4em 0; font-size:1.4em}

table.questions tr th{position:absolute; text-indent:-9999px}

table.questions tr td{padding:1em; background-color:#eee; border-bottom:2px solid #fff}

#mainContent .questions td.question {font-weight: bold; border: none; padding: 1em 0 1em 1em}
#mainContent .questions td.answer {padding: 1em 0 1em 1em; background: #f2f2f2}

span.no{position:relative; display:block; width:22px; height:24px; text-indent:-9999px; background:transparent url(../images/answer_cross.png) top right no-repeat}

span.yes{position:relative; display:block; width:22px; height:24px; text-indent:-9999px; background:transparent url(../images/answer_tick.png) top right no-repeat}

span.notsure{position:relative; display:block; width:22px; height:24px; text-indent:-9999px; background:transparent url(../images/answer_questionmark.png) top right no-repeat}

#form .replaced{display:none}
#form ul.selectReplacement{position:relative; left:265px; width:131px; height:23px; background:transparent url(../images/stars.png) no-repeat -136px 0; margin:0; padding:0; z-index:1}

#form ul.very-poor{ background-position:-108px 0}
#form ul.poor{ background-position:-81px 0}
#form ul.fair{ background-position:-54px 0}
#form ul.good{ background-position:-27px 0}
#form ul.excellent{ background-position:0 0}

#form ul.selectReplacement li{float:left; margin:0; padding:0; list-style:none}
#form ul.selectReplacement li a{display:block; position:absolute; top:0; width:27px; height:23px; text-indent:-9999px; overflow:hidden; z-index:9999}
#form ul.selectReplacement li.Select a{display:none}
#form ul.selectReplacement li.very-poor a{ left:0}
#form ul.selectReplacement li.poor a{ left:27px}
#form ul.selectReplacement li.fair a{ left:54px}
#form ul.selectReplacement li.good a{ left:81px}
#form ul.selectReplacement li.excellent a{ left:108px}
#form ul.selectReplacement li a:hover{background:transparent url(../images/star.png) left top repeat-x; left:0; z-index:999}
#form ul.selectReplacement li.very-poor a:hover{ width:27px}
#form ul.selectReplacement li.poor a:hover{ width:54px}
#form ul.selectReplacement li.fair a:hover{ width:81px}
#form ul.selectReplacement li.good a:hover{ width:108px}
#form ul.selectReplacement li.excellent a:hover{ width:135px}

p abbr.rating{position:relative; display:block; width:133px; height:23px; text-indent:-9999px}
p abbr.very-poor{background:transparent url(../images/stars-worst.png) left top no-repeat !important}
p abbr.poor{background:transparent url(../images/stars-bad.png) left top no-repeat}
p abbr.fair{background:transparent url(../images/stars-fair.png) left top no-repeat}
p abbr.good{background:transparent url(../images/stars-good.png) left top no-repeat}
p abbr.excellent{background:transparent url(../images/stars-best.png) left top no-repeat}

#usercomments abbr {height:23px; text-indent:-9999px; width: 140px; clear: both; display: block; margin: 5px 0 0 0}

#mainContent li:hover p abbr.rating{background-position:bottom left}

div.bubble img{display:none!important}

div.bubble p{margin:0}

.bubble{ width:300px}

.bubble .geo{ display:none}

#mainContent ul.stripes{margin:0; padding:0; display:block; float:left}

#mainContent ul.stripes li{margin:0; padding:0; list-style:none; float:left; background:#eee}

#gallery{background-color:#eee; padding:10px 10px 5px 10px; width:620px; clear:both; float: left; margin: 2px 0 20px;}
#gallery ul{list-style:none}
#gallery ul li{display:inline; margin:0}
#gallery ul img{border:5px solid #eee; border-width:5px 5px}
#gallery ul a:hover img{border:5px solid #ddd; color:#fff}
#gallery ul a:hover{color:#fff}

#home #mainContent{float:right; width:680px; margin:0; padding:0}

#home #mainContent .newsblock h3{
	font-size: 2.4em;
	line-height: 1.5em;
	margin: 10px 0 0 0;
	letter-spacing: -1px;
	color: #7B003B;
	font-weight: normal;
	padding: 0 0 0 10px;
	color: #000}

/*
#home #mainContent ul.reviews{margin:0 0 0 20px;}
*/
#home #mainContent ul.reviews li {width: 330px;}

#panelMap{float:left; display:block; background:url(../images/panel_map.png) top right no-repeat; width:330px; height:321px; margin-bottom:1.5em; clear:left}

#panelIntro{display:block; width:280px; height:301px; border:5px solid #BD7F9D; padding:5px 25px; margin-bottom:1.5em; background:#F9D7E0; float:right; clear:right}

#panelMap h2{margin-left:30px}

#panelMap p{display:block; width:180px; margin-left:30px}

#panelIntro h2{margin-top:0}

#panelMap h3{float:left; border:5px solid #BD7F9D; margin:10px 0 0 17px}

#panelMap h3 a{display:block; background:#FCEBEF; padding:0.75em; color:#7B003B}

#panelMap h3 a:hover{background-color:#E3004A; color:#FFF; text-decoration:none}

#panelIntro li{list-style-position:inside; margin:0.375em 0}

.paging p{float:left}

.webblerpaging{display:block; margin:0 0 0.5em 0; width:622px}

.webblerpaging a{float:left; margin:10px 0 0 8px; padding:2px 6px; background-color:#FCEBEF; color: #000; font-size: 1.1em}

.webblerpaging a.current{background-color:#DEBFCE}

.webblerpaging .pagingprevious, .webblerpaging .pagingnext{display:none}

.webblerpaging a:hover{color:#FFF; background-color:#333}

#sitemap {margin: 0 0 1.4em 0}
#sitemap li{list-style:none !important}

#mainContent .searchgroup{display:none}


@media print{#leftcol{display:none}

#rightcol{display:none}
#twocols, #mainContent{width:100%; float:none}
}

p.highlightbox {
background-color:#FCEBEF;
padding: 0.5em;
}
