/*
------------------------------------------------------------------------------------------------
	GENERIC CSS - styles.css											  
------------------------------------------------------------------------------------------------
	Created: 	02-08-2008															
	Author: 	Ember Interactive (www.emberinteractive.co.uk)						
	Website: 	GB Liners													
------------------------------------------------------------------------------------------------
*/

/*
------------------------------------------------------------------------------------ HTML / BODY
															
------------------------------------------------------------------------------------------------
*/

html {min-height: 100%; height: auto; font-size: 50%;}
body {background: #ccc; font-family: Helvetica, arial, verdana, sans-serif; font-size: 100%; margin-top: 10px; padding: 0;}

/*
-------------------------------------------------------------------------------------- FRAMEWORK
															
------------------------------------------------------------------------------------------------
*/

#topstripe {margin: 0 auto; padding: 0; background: #000; height: 7px; width:988px; border-left:4px solid #fff; border-right:4px solid #fff; border-top:4px solid #fff;}
#main {margin: 0 auto; padding: 0; background: url(images/bg_main.gif) repeat-y center; width:988px; border-left:4px solid #fff; border-right:4px solid #fff;}
#contain {margin: 0 auto; padding: 0; background: url(images/bg_content.gif) repeat-y center; width: 960px;}
#navigation {margin: 0; padding: 0; width: 240px; float: left;}
#content {margin: 0; padding: 0; width: 720px; float: left;}
#footer {background: #81B0B5; margin: 0 auto; padding: 10px 0 0 0; height: 50px; width: 988px; border-left:4px solid #fff; border-right:4px solid #fff; border-bottom:4px solid #fff; border-right:4px solid #fff;}

#quote {margin: 0; padding: 0; height: 85px; text-align: right;}
#contact {margin: 0 0 30px 15px; height: 30px; padding: 0; border-top: #ccc dotted 1px; border-bottom: #ccc dotted 1px; background: #EAEAEA;}

.column_single {margin: 0; padding: 0 0 20px 15px; width: 225px; float: left;}
.column_double {margin: 0; padding: 0 0 20px 15px; width: 465px; float: left;}
.column_triple {margin: 0; padding: 0 0 20px 15px; width: 700px; float: left;}

.column_news {margin: 0; padding: 0 0 20px 15px; width: 655px; float: left;}

/*
----------------------------------------------------------------------------------- TEXT / LINKS
															
------------------------------------------------------------------------------------------------
*/

h1 {margin: 0; padding: 0 0 0 5px; color: #DC1E23; font-family: Helvetica, arial, verdana, sans-serif; font-size: 2em;}
h2 {margin: 0; padding: 20px 0 0 5px; color: #222222; font-family: Helvetica, arial, verdana, sans-serif; font-size: 1.5em;}
h3 {margin: 0; padding:  0 0 0 5px; color: #fff; font-family: Helvetica, arial, verdana, sans-serif; font-weight: bold; background: #81B0B5; display: block; font-size: 1.4em; line-height: 2em;}
h4 {margin: 0; padding: 30px 0 0 5px; color: #DC1E23; font-family: Helvetica, arial, verdana, sans-serif; font-size: 1.5em;}
h5 {margin: 0; padding: 290px 0 0 0; color: #DC1E23; font-family: Helvetica, arial, verdana, sans-serif; font-size: 0.8em;}

h2.branch {margin: 0; padding: 30px 0 0 5px; color: #DC1E23; font-family: Helvetica, arial, verdana, sans-serif; font-size: 1.5em;}

p {margin: 0; padding: 20px 40px 0 5px; color: #222; font-size: 1.4em; line-height: 1.5em;}
p.feature {margin: 0; padding: 10px 5px 5px 5px; color: #222;}

p.pleasecontact {margin: 0; padding: 20px 40px 0 5px; color: #222; font-size: 1.8em; line-height: 1.5em;}

a {text-decoration: none; font-weight: normal; color: #DC1E23;}
a:hover {text-decoration: underline;}

a.call {background: #EAEAEA url(images/bullet_arrow_grey.gif) left no-repeat; color: #333; margin: 5px 0 20px 0; padding: 1px 0 0 15px; border-top: #ccc dotted 1px; border-bottom: #ccc dotted 1px; display: block; font-weight: bold; font-size: 1.4em; line-height: 2em;}
a.call:hover {color: #DC1E23; text-decoration: none;}

a.callmain {background: #EAEAEA url(images/bullet_arrow_grey.gif) left no-repeat; color: #222; margin: 5px 0 5px 0; padding: 1px 0 0 15px; border-top: #ccc dotted 1px; border-bottom: #ccc dotted 1px; display: block; width: 350px; font-size: 1.4em; line-height: 2em;}
a.callmain:hover {color: #81B0B5; text-decoration: none;}

a.bar {text-decoration: none; font-weight: normal; outline: none; border: none; margin: 0; padding: 0; background: none !important;}
a.bar:hover {text-decoration: none; font-weight: normal; outline: none; border: none; margin: 0; padding: 0; background: none !important;}

p.headline {margin: 0px; padding-bottom: 0px; font-size: 1.65em;}
p.brief {float: left; margin: 10px 0 10px 5px; padding: 0px;}
p.article_link {margin: 10px 0 10px 5px; padding: 0;}
p.paginate {margin: 10px 0 10px 5px; padding: 0;}

p.brief img {float: left; margin: 0 20px 10px 0; padding: 5px; border: solid 1px #CCC!important;}

ul.bodylist li {font-size: 1.4em; line-height: 1.5em;}

/*
---------------------------------------------------------------------------------------- CONTENT
															
------------------------------------------------------------------------------------------------
*/

.gb_logo {margin: 10px 0 10px 60px; padding: 0;}
.bar_logo {margin: 10px 0 20px 40px; padding: 0; border: 0; outline: none;}
.bar_logo2 {margin: 15px 0 20px 35px; padding: 0; border: 0; outline: none;}

.main_pic {margin: 13px 0 0 5px; padding: 4px; border: 1px solid #aaa;}
.feature_pic {margin: 10px 0 0 0; padding: 4px; border: 1px solid #aaa;}

.location {margin: 0; padding: 0; width: 30%; display: block; float: left; border-right: #fff solid 1px;}
p.address {height: 17em;}

ul.testimonial {list-style: none; margin: 10px 0 10px 5px; padding: 0; font-family: Helvetica, arial, verdana, sans-serif; color: #222; font-size: 1.4em; line-height: 1.5em;}
ul.testimonial span {display: block; width: 9em; float: left; font-weight: bold;}

#map {margin: 16px 0 0 5px; padding: 0; width: 450px; height: 250px; border: 1px solid #aaa;}

.news_pic {margin: 0 20px 10px 0; padding: 4px; border: 1px solid #aaa; float: left;}

#testimonials_container {width:300px; height:80px; overflow:hidden; position:relative; background-color:#FFFFFF; margin-left: 420px; margin-bottom: 5px;}

.testimonials {width: 300px; height: 54px; background: url('images/quote_bubble.gif') 0 0 no-repeat; margin: 14px 0 0 0; padding: 3px;}
.testimonials p {margin: 0 3px 0 0; text-align:right; padding: 0 6px;}
.testimonials p.testimonial_quote { padding: 0 6px; text-align: right; height:40px;}
.testimonials p span {font-weight: bold; color: #81B0B5;}

#branch_details {display: block; float: left; margin: 0; padding: 0; width: 338px; height: 200px;}
#branch_details p span {display: block; margin: 0; padding: 0; width: 10em; font-weight: bold; float: left;}

.branch_photo {display: block; float: left; margin: 20px 0 0 0; padding: 5px; border: 1px solid #ccc;}
#branch_info {margin: 0; padding: 0;}

.locationlist {margin: 20px 20px 10px 0; width: 30%; display: block; float: left; border-right: #fff solid 1px;}
.locationlist label {margin: 0 0 10px 0; padding:  0 0 0 5px; color: #fff; font-family: Helvetica, arial, verdana, sans-serif; font-weight: bold; background: #81B0B5; display: block; font-size: 1.4em; line-height: 2em; width: 100%!important;}
.locationlist ul {list-style-type: none; padding: 0; margin: 0;}
.locationlist ul li {line-height: 1.5em; padding: 0; margin: 0; display: block; border-bottom: 1px #eee solid;}
.locationlist ul li a {padding: 5px; display: block; font-size: 1.3em; color: #222; background: url('images/bullet_arrow_grey.gif') right no-repeat;}
.locationlist ul li a:hover {color: #CC0000; text-decoration: none;}

/*
-------------------------------------------------------------------------------------- HOME PAGE
															
------------------------------------------------------------------------------------------------
*/

#phone_head {width:350px; float:left; margin: 0 0 0 12px;}
#phone_head p {line-height:2em; padding-top:24px;}
#phone_head p span {font-size: 2em;font-weight:bold;}

img.gb_logo_home {margin: 10px 0 314px 24px; padding: 0;}
p.home_phone {color:#fff; font-size:2.2em; text-align:center; width:215px; margin:0 0 10px 6px; padding:0;}
p.home_phone span {font-size: 10px;}
p.home_email {width:215px; margin:0; padding:0; text-align:center; margin:0 0 0 6px;}
p.home_email a {color:#fff; font-size:1.7em; width:215px; margin:0; padding:0;}

img.bar_logo_home {margin: 10px 0 0 36px; padding: 0; border: 0; outline: none;}

h1.home_header {margin:0 0 16px 18px; color:#141313; font-size:4em; padding:0; font-weight:bold; letter-spacing: -1px;}
h2.home_header {position: absolute; left: -2000px;}

#intro_box {width:700px; margin:0 0 16px 18px; background:url('images/home_intro_bg_top.jpg') 0 0 no-repeat;}
#intro_box p {padding: 14px 190px 12px 16px; margin:0; color:#FFFFFF; font-size:2.6em; line-height:1.3em; background:url('images/home_intro_bg_bot.png') 0 100% no-repeat;}

#IE6root #main #contain #content #intro_box p {background:url('images/home_intro_bg_bot.gif') 0 100% no-repeat;}

#location_box {width:461px; min-height:112px; margin: 0 17px 16px 18px; display:inline; float:left; background:url('images/home_location_bg.gif') 0 0 no-repeat;}
#location_box h2 { padding: 0 125px 0 16px; margin:14px 0 0 0; color:#141313; font-size:2em; font-weight:bold; min-height:26px;}
#location_box h2 a {color:#141313;}
#location_box h2 a:hover {text-decoration:none;}

#location_box p {padding: 0 125px 0 16px; margin:0 0 0 0; color:#fff; font-size:1.6em; background:url('images/home_location_bot.png') 0 100% no-repeat; min-height:72px;}
#IE6root #main #contain #content #location_box p {background:url('images/home_location_bot.gif') 0 100% no-repeat;}
#location_box p a {color:#FFFFFF; background: #666; padding: 0 3px; float: left; margin: 0 2px 2px 0;}
#location_box p a:hover {background:#DC1E23; text-decoration:none;}

#quote_box {width:222px; display:inline; float:left; background:#75a0a4 url('images/home_feature_head.gif') 0 0 no-repeat; margin:0 0 16px 0;}
#quote_box h2 {color:#141313; font-size:2em; margin:10px 0 0 0; padding: 0 4px 0 36px; min-height:26px;  font-weight:normal;}
#quote_box h2 a {color:#141313; font-weight:normal;}
#quote_box h2 a:hover {text-decoration:none;}

#quote_box ul {width:222px; min-height:76px; margin:0; padding:0; background:url('images/home_quote_bg.jpg') bottom left no-repeat; list-style:none;}
#quote_box ul li {width:206px; border-bottom:1px dotted #fff; margin: 0 0 0 8px; padding:0;}
#quote_box ul li.last {border-bottom:none;}
#quote_box ul li a {color:#fff; font-size:1.5em; display:block; width:190px; margin: 0 0 0 7px; line-height:25px; padding: 0 0; }

div.feature_box {width:222px; display:inline; float:left; background:#75a0a4 url('images/home_feature_head.gif') 0 0 no-repeat; margin:0 0 40px 17px;}
div.feature_box h2 {color:#141313; font-size:2em; margin:10px 0 0 0; padding: 0 4px 0 36px; min-height:26px; font-weight:normal;}
div.feature_box h2 a {color:#141313; font-weight:normal;}
div.feature_box  h2 a:hover {text-decoration:none;}

div.feature_box img {border:none;}

div.feature_first {margin:0 0 0 18px;}

div.feature_box ul {width:222px; min-height:76px; margin:0; padding:0; list-style:none; border-bottom:2px solid #fff;}
div.feature_box ul li {border-bottom:1px dotted #fff; margin: 0; padding:0;}
div.feature_box ul li.last {border-bottom:none;}
div.feature_box ul li a {color:#fff; font-size:1.5em; display:block; margin: 0; padding: 6px 15px;}
div.feature_box ul li a:hover {background: #DC1E23; text-decoration: none;}

a.quote_link {color:#fff; font-size:1.5em; margin: 0; padding: 6px 15px; display:block; width:auto; background-image:url('images/home_feature_bot.gif'); background-position:left bottom; background-repeat:no-repeat;}

a.quote_link:hover {background-image:url('images/home_feature_bot_over.gif'); text-decoration:none;}

/*
------------------------------------------------------------------------------------------- BLOG
														
------------------------------------------------------------------------------------------------
*/

div.blog_item {margin-left:5px; border-bottom: 1px dotted #ccc; margin-top:20px; padding-bottom:6px;}
div.blog_item h2 {margin: 0 0 10px 0; padding: 0; font-size: 1.65em; color:#222; font-weight:normal;}
div.blog_item h2 span {font-weight:bold;}
div.blog_item p {margin:0 0 4px 0; padding:0;}


div.blog_comment img {margin-bottom:6px;}
div.blog_comment p span {float:left;width:10em;}
div.blog_comment input.submit {width:10em; margin-left:10em;}
div.blog_comment textarea.comments {width:25em; font-size:1em;}
div.blog_comment input, div.blog_comment textarea {border:1px solid #CCCCCC;float:left;margin:0 0 0;width:25em; font-size:1em;}

/*
------------------------------------------------------------------------------------- NAVIGATION
														
------------------------------------------------------------------------------------------------
*/

#navigation ul {list-style: none; margin: 0 0 10px 0; padding: 0;}
#navigation ul li {margin: 0 20px 0 20px; padding: 0; border-bottom: #FFC8C9 dotted 1px; font-size: 1.4em; line-height: 1.5em;}
#navigation ul li a {background: url(images/bullet_arrow_white.gif) left no-repeat; color: #fff; display: block; text-decoration: none; margin: 0; padding: 6px 0 5px 20px; font-weight: bold;}
#navigation ul li a:hover {color: #fff; text-decoration: none; background: #8E1417 url(images/bullet_arrow_white.gif) left no-repeat;}
#navigation ul li a.active {color: #fff; text-decoration: none; background: #8E1417 url(images/bullet_arrow_white.gif) left no-repeat;}

/*
---------------------------------------------------------------------------------- CONTACT LINKS
														
------------------------------------------------------------------------------------------------
*/

#contact ul {list-style: none; margin: 0; padding: 0;}
#contact li {margin: 7px 10px 0 0; padding: 0; float: left;}
#contact a {background: url(images/bullet_arrow_grey.gif) left no-repeat; color: #222; display: block; text-decoration: none; margin: 0; padding: 0 0 0 15px; font-size: 1.4em; line-height: 1.5em;}
#contact a:hover {color: #81B0B5; text-decoration: none;}
#contact p {background: url(images/bullet_arrow_grey.gif) left no-repeat; color: #222; display: block; text-decoration: none; margin: 0; padding: 0 0 0 15px; line-height: 1.5em;}

/*
----------------------------------------------------------------------------------------- FOOTER
														
------------------------------------------------------------------------------------------------
*/

#footer p.copyright {margin: 10px 0 0 0; padding: 0 0 0 30px; width: 240px; float: left; display: block; color: #fff;}

#footer ul {margin: 10px 0 0 0; padding: 0 0 0 10px; list-style: none; float: right; display: block;}
#footer li {margin: 0 10px 0 10px; padding: 0 10px 0 0; float: left; border-right: 1px solid #fff; font-size: 1.4em; line-height: 1.5em;}
#footer a {text-decoration: none; color: #fff; margin: 0; padding: 0 10px 0 0;}
#footer a:hover {text-decoration: none; color: #222;}
#footer li.last {border: none;}

/*
------------------------------------------------------------------------------------------ FORMS
														
------------------------------------------------------------------------------------------------
*/

fieldset {margin: 0; padding: 0; border: 0;}
label {float: left; width: 14em; color: #222; font-weight: bold;}
input {width: 250px; border: 1px solid #ccc; color: #222; margin: 0 0 0 20px; padding: 0;}
textarea {font-family: arial, verdana, sans-serif; width: 240px; color: #222; border: 1px solid #ccc; margin: 0 0 0 20px; padding: 2px 3px; overflow: auto;}
input.submit {border: 0; margin: 0 17px 0 20px; padding: 0; width: 60px; height: 20px; font-weight: normal; font-family: arial, verdana, sans-serif; background: #DC1E23; color: #fff;}
input.calculate {border: 0; margin: 0 17px 0 20px; padding: 0; width: 120px; height: 20px; font-family: arial, verdana, sans-serif; background: #DC1E23; color: #fff;}

select {margin: 0 0 0 20px; padding: 0;}
a.more {background: url(images/btn_more.gif) no-repeat; display: block; text-indent: -2000px; 
width: 104px; height: 20px; margin: 0 0 0 175px; padding: 0;}

p.check {float: left;}
.checkbox {width: 1.5em; margin: 3px 12px 0 20px; padding: 0; border: none;}
.postcode {width: 8em;}
* html .checkbox {width: 1.5em; margin: 0 12px 0 20px; padding: 0; border: none;}

input.request {margin: 0 0 10px 20px; width: 15em; float: left;}
textarea.request {margin: 0 0 10px 20px; width: 14.5em; float: left;}

input:focus {border: 1px solid #DC1E23;}
textarea:focus {border: 1px solid #DC1E23;}

/*
----------------------------------------------------------------------------------------- ACCESS
														
------------------------------------------------------------------------------------------------
*/

a.skip {position: absolute; left: -50em; }
a.access {position: absolute; left: -50em;}

ul.accessible  {list-style: none; margin: 0 0 10px 0; padding: 0;}
ul.accessible li {margin: 10px 0 0 20px; padding: 0; font-size: 1.45em;}

/*
------------------------------------------------------------------------------------------ MISC.
														
------------------------------------------------------------------------------------------------
*/

.dotted_line {margin: 10px 0 0 0; padding: 0; border-top: 1px dotted #ccc;}

br.clear {clear: both; overflow: hidden; height: 0; line-height: 0px;}