/*Global*/
a { cursor:pointer; }
a img { border: 0; text-decoration:none; }
.clr { margin: 0; height: 1px; overflow: hidden; clear: both; }
.left-img { float:left; margin:0 10px 0 0;}
.right-img { float:right; margin:0 0 0 10px; }
.left { float:left; }
.right { float:right; }
.centre { position:relative; margin:0 auto; text-align:center; }
/*Structure*/

body {  position:relative; font-family: "Lucida Grande", "Lucida Sans Unicode", Helvetica, Verdana, sans-serif; font-size: 80%; margin:0; padding: 0; background: #fff;}

.container { position:relative; text-align: center; margin: 7px 0 0 0; padding: 0;}

.container .site-width { text-align: left; margin: 0 auto; width: 820px; position: relative; clear: both;}

.container .site-width .header { background: url(/distilled/images/home/top-rule.jpg) bottom right no-repeat; height: 113px; position: relative;}
.container .site-width .header .logo { position: absolute; top: 0; left : 0;}
.container .site-width .header .logo img { padding: 0 0 0 5px; background: #fff;}

.container .site-width .menu { text-align:right; margin:0 0 0 30px;  }
.container .site-width .menu ul { margin: 15px 0 40px 0; padding: 0; list-style: none;}
.container .site-width .menu ul li { display:inline; margin: 0 7px 0 0; padding:0 7px 0 0; font-size: 110%; font-weight: bold; position: relative; border-right:1px solid #4C4C4C;}
.container .site-width .menu ul li.last { border-right:0; }
.container .site-width .menu ul li a { text-decoration: none; border-bottom: 2px solid #fff; padding: 2px; color:#1A75CC; }
.container .site-width .menu ul li a:hover { border-bottom: 2px solid #999; color: #999;}
.container .site-width .menu ul li.current a { color:#5C8C19;  border-color: #5C8C19;}
body.blog .container .site-width .menu ul li.blog a { color:#5C8C19;  border-color: #5C8C19; }

.container .site-width .menu ul li.current ul { position: absolute; top:2em; right:0; padding: 0; text-align: right; font-size: 75%; width:500px;  }
.container .site-width .menu ul li.web-design ul { width:250px; } /*small hack to stop side scroll bar*/
.container .site-width .menu ul li.current ul li { text-align:right; display: inline; padding-left:5px; margin:0;}
.container .site-width .menu ul li.current ul li a { color: #999; border-bottom: 2px solid #fff; }
.container .site-width .menu ul li.current ul li a:hover { border-bottom: 2px solid #999; color:#999;}
.container .site-width .menu ul li.current ul li.current a { color: #5C8C19; border-color: #5C8C19;}

/*Submenu*/
.container .site-width #sub-menu { position:absolute; top:60px; right:0; font-weight:bold;  }
	.container .site-width #sub-menu li { display:inline; margin-right:10px; padding-right:10px; border-right:1px solid #4C4C4C;  }
	.container .site-width #sub-menu li a { color:#666; text-decoration:none; }
	.container .site-width #sub-menu li a:hover { color:#999; text-decoration:none; border-bottom: 2px solid #999; }
	.container .site-width #sub-menu li.current a { color:#5C8C19; text-decoration:none; border-bottom: 2px solid #5C8C19; }
	.container .site-width #sub-menu .last { border-right:0; }


/*Tabs*/
.container .site-width .tabs { margin-top:-5px; margin-left:5px; }
	.container .site-width .tabs li { display:block; float:left; width:auto; margin:0; margin-right:5px; padding:8px 0 5px 0; background: url(/img/central-slither.jpg) bottom left repeat-x; }
	.container .site-width .tabs li .left { float:left; display:block; height:36px; width:18px; margin:-8px 0 -5px 0; background: url(/img/tab-left-hand-side.jpg) bottom left no-repeat; }
	.container .site-width .tabs li .middle { float:left; border:none; padding:2px; }
    .container .site-width .tabs li .right { float:left; display:block; height:36px; width:18px; margin:-8px 0 -5px 0; background: url(/img/tab-right-hand-side.jpg) bottom right no-repeat; } 
	.container .site-width .tabs li a { color:#DE8CA2; text-decoration:none; }
	.container .site-width .tabs li.current a {  color: #C42142; }

.container .site-width .body { border-top: solid 1px  #e4e4e4; margin: 1px 0x 20px 0px; padding: 5px 0 15px 0; color: #4C4C4C;}

.container .site-width .content { float: left; width: 570px; margin-top:0; border-right: 1px solid #e4e4e4; }

/*Press*/
.container .site-width .press-quotes { width:499px; border:1px solid #CDCDCD; padding:2px 4px 0px 4px; }
	.container .site-width .press-quotes .quote-container { border-bottom:1px solid #CDCDCD; }
		.container .site-width .press-quotes .quote-container .img { float:left; width:133px; }
		.container .site-width .press-quotes .quote-container .quote { float:right; width:345px; font-size:0.8em; padding-left:10px; border-left:1px solid #cdcdcd; }
		.container .site-width .press-quotes .quote-container .quote h2 { margin:1em 0 0 0; font-size:1.1em; font-weight:normal; }
		 
/*Sidebar*/
.container .site-width .features { float: right; width: 225px; }
.container .site-width .features a {  }

.container .site-width .features .title { margin: 0 5px 0 0; }
.container .site-width .features .title h2 { margin: 15px 0 0 0; font-size:1.2em; }
.container .site-width .features .title p { margin: 0; padding: 0; font-size: 80%; }

.container .site-width .features .case-study { margin: 15px 0; clear: left; }
.container .site-width .features .case-study img { float: left; margin: 0 10px 15px 0; }
.container .site-width .features .case-study p { margin: 15px 0; padding: 10px 0;}

.container .site-width .features .recommended-title { clear: both; border-top: 1px solid #e4e4e4; margin: 15px 0; }

.container .site-width .features .recommended { margin: 15px 0; }

.container .site-width .features .featured { margin: 15px 0; }

.container .site-width .features .portfolio-featured { margin:15px 0; border-top: 1px solid #e4e4e4; }
.container .site-width .features .additional-services-featured { margin:15px 0; border-top: 1px solid #e4e4e4; }

.container .site-width .features .portfolio-featured h4, 
.container .site-width .features .additional-services-featured h4 { color:#000; }

.container .site-width .features .portfolio-featured ul , 
.container .site-width .features .additional-services-featured ul { margin:0.5em 0; font-size:0.8em; }

.container .site-width .features .portfolio-featured ul li, 
.container .site-width .features .additional-services-featured ul li { margin:0.2em 20px; }

.container .site-width .features .title-with-line { margin:15px 0 0 0; border-top:1px solid #e4e4e4; }
.container .site-width .features .quote-featured { }

.container .site-width .features .quote-featured blockquote { font-size: 80%; color: #4C4C4C; margin: 5px 0px 5px 0; padding: 5px 0 5px 35px; background: url(/img/quote-top-small.jpg) 5px 10px no-repeat;}
.container .site-width .features .quote-featured blockquote p { background: url(/img/quote-bottom-small.jpg) bottom right no-repeat; margin: 10px 0; padding: 0 25px 0 0; line-height: 1.5em;}

/*Blog*/

.container .site-width .features .blog-sidebar { margin: 1em 15px 15px 15px; }
.container .site-width .features .blog-sidebar h2 { background: #B6001D; color: #fff; padding: 0.3em 0.5em; font-size: 100%; text-transform: uppercase; margin: 15px 0 0 0; font-weight: normal; text-decoration: none;}
.container .site-width .features .blog-sidebar ul { margin: 0px 0 5px 0; list-style: none;}
.container .site-width .features .blog-sidebar ul li { margin: 5px 0; border-bottom: 1px solid #E9A9B5;}
.container .site-width .features .blog-sidebar ul li a { text-decoration: none; color:#303030 }
.container .site-width .features .blog-sidebar ul li.rss { background: url(/img/small-rss-icon.jpg) center left no-repeat; padding: 3px 0 3px 22px;}
.container .site-width .features .blog-sidebar ul li.rss a { color: #ee9944;}

.container .site-width .body { font-size:110%; }
.container .site-width .body .content .advert { margin-top:10px; width:98%; text-align:center; }
.container .site-width .body .content .description h2 {  font-size: 150%; color: #B6001D; margin-top: 0;}
.container .site-width .body .content .description h2 a { text-decoration: none;}

.container .site-width .body .content .post h3.storytitle { background: #555; padding: 0.3em 0.5em; font-size: 100%; font-weight: normal; margin: 0; min-height:1em; }
.container .site-width .body .content .post h3.storytitle a { color: #fff; text-decoration: none; text-transform: uppercase; min-height:1em; }

.container .site-width .body .content .post .feedback { text-align: right; margin: 15px 15px 15px 0; border: 1px dashed #e4e4e4; padding: 0.3em 0.5em;}
.container .site-width .body .content .post .meta { margin: 5px 15px 5px 0; color: #B6001D;}
.container .site-width .body .content .post .avatar { float:left; margin:0 10px 5px 0px; }

.container .site-width .body .content #commentlist .comment_avatar { float:left; width:40px; margin:5px 10px 0 0;}
.container .site-width .body .content #commentlist .comment_avatar img { width:40px; height:40px; }

.container .site-width .body .content .post code { display: block; overflow: auto;}
.container .site-width .body .content .post blockquote { font-size: 100%; margin: 15px; padding: 0; background: none;}
.container .site-width .body .content .post blockquote p { background: none;}

.container .site-width .body .content .post .sociable ul { margin : 10px 0;}
.container .site-width .body .content .post .sociable ul li { display: inline;}

.container .site-width .body .content .alignright { float:right; margin:0 10px 10px 10px; }
.container .site-width .body .content .alignleft { float:left; margin:0 10px 10px 0; }
.container .site-width .body .content .aligncenter { margin:0 auto; }
.container .site-width .body .content .wp-caption { margin-top:12px; padding:10px 0px 0 10px; border:1px solid #dddddd; background:#F3F3F3; }
.container .site-width .body .content .wp-caption p { margin:0; text-align:center; }
.container .site-width .body .content .wp-caption img { margin:0; padding:0; }

#commentform textarea { width : 545px; height: 10em;}

ul#commentlist { list-style: none;}
ul#commentlist li { margin: 15px 0; padding: 0 0.5em 0 32px; }
ul#commentlist li a { font-weight: normal; }
ul#commentlist li div.comment_cite { margin: 15px 15px 15px 0; border: 1px dashed #e4e4e4; padding: 0.3em;}
ul#commentlist li div.comment_cite p { margin: 0; padding: 0;}
ul#commentlist li div.comment_details { float: right ; }
ul#commentlist li p { margin: 0 0 10px 0; padding: 0.3em; }
ul#commentlist li.distilled { color: #5C8C19; background: url(/img/small-distilled-icon.jpg) top left no-repeat;}


/*Forms*/
form #contact-man { position:relative; right:0; margin-top:50px; }
form#contact { background-color: #F4F7E2; padding:10px; margin-right:25px;}
form ul { list-style: none; float:left;}
form ul li { margin: 10px 0;}
form ul li label { display: block; margin: 10px 15px 2px 0; font-size: 130%; font-weight: bold;}
form ul li label span.msg{ font-size: 0.6em; font-weight: normal;} 
form ul li a.msg{ font-size:0.7em;}
form ul li input,
form ul li textarea { width: 300px; }
form ul li textarea { height: 8em; }
form div.error_message { margin: 10px 0 5px 0; color: #f00; font-size: 130%;}
form ul li .submit { width:160px; margin-top:30px;}

form#beer-o-clock ul { padding-left:0; }
form#beer-o-clock ul li { margin-left:0; }
form#beer-o-clock ul li #answer_is_coming { float:left; margin-right:15px; width:20px;  }
form#beer-o-clock ul li #answer_is_not_coming { float:left; margin-right:15px; width:20px;  }
form#beer-o-clock ul li .submit { width:77px; margin-top:0; }
 
form#mc-embedded-subscribe-form ul li.seo div input {width: auto; margin-top: 2px;}
form#mc-embedded-subscribe-form ul li.seo div label {display: inline-block;}

.title form#sign-up fieldset { font-size:0.8em; width:200px; padding:0 10px; border:0; background:#F2F2F2;}
.title form#sign-up fieldset h2 { margin:0.5em 0; }
.title form#sign-up fieldset h2.sign-up-title { margin:0; font-size:1.6em; }
.title form#sign-up p { margin:0.5em 0; font-size:1.1em; line-height:1.2em;}
.title form#sign-up ul { margin:0.2em 0; }
.title form#sign-up ul li { margin:0; }
.title form#sign-up label { font-weight:normal; font-size:1.2em; line-height:1.2em; }
.title form#sign-up .sign-up-button { margin-top:1em; width:137px; }
.title form#sign-up input { width:160px;}


/*Footer*/
.container .site-width .infographics { width:820px; position:relative; margin-right: 30px; margin-bottom:-4px;}
.container .site-width .infographics .distilled { position:absolute; bottom:0; left:0;}
.container .site-width .infographics .infographic { position:absolute; bottom:1px; right:0; }

.container .footer { background: #bbb; margin:0; padding: 1px 0; }
.container .footer a { color: #666;}

.container .footer .site-width h6 { margin: 0; padding: 0; font-size: 90%; color: #666;}
.container .footer .site-width ul { margin: 5px 0; padding: 0; list-style: none; font-size: 75%; }
.container .footer .site-width ul li { float: left; margin: 5px 5px 5px 0; width: 150px; }
.container .footer .site-width ul li a { color: #666; }

.container .footer .site-width .navigation { margin: 20px 10px; padding: 0; width: 320px; border-right: 1px solid #fff; float: left;}
.container .footer .site-width .quick-links { margin: 20px 10px; padding: 0; width: 320px; border-right: 1px solid #fff; float: left;}

.container .footer .contact { clear: both; margin: 20px 10px; border-top: 1px solid #fff; padding: 10px 0;}
.container .footer .contact p { font-size: 80%; margin: 2px 0; color: #666; }
.container .footer .contact p span { font-weight: bold; color: #fff;}

.container .footer .contact p span.sitemap { float: right; font-weight: normal;}

/*Text Styling*/

.body h1 { font-size: 160%; margin-right: 15px;}
.container .site-width .features .blog-sidebar { margin: 1em 15px 15px 15px; }
.container .site-width .features .blog-sidebar h2 { background: #B6001D; color: #fff; padding: 0.3em 0.5em; font-size: 100%; text-transform: uppercase; margin: 15px 0 0 0; font-weight: normal; text-decoration: none;}
.container .site-width .features .blog-sidebar ul { margin: 0px 0 5px 0; list-style: none;}
.container .site-width .features .blog-sidebar ul li { margin: 5px 0; border-bottom: 1px solid #E9A9B5;}
.container .site-width .features .blog-sidebar ul li a { text-decoration: none; }
.container .site-width .features .blog-sidebar ul li.rss { background: url(/img/small-rss-icon.jpg) center left no-repeat; padding: 3px 0 3px 22px;}
.container .site-width .features .blog-sidebar ul li.rss a { color: #ee9944;}

.container .site-width .body .content .description h2 { font-size: 150%; color: #B6001D; margin-top: 0;}
.container .site-width .body .content .description h2 a { text-decoration: none;}

.container .site-width .body .content .post h3.storytitle { background: #555; padding: 0.3em 0.5em; font-size: 100%; font-weight: normal; margin: 15px 15px 15px 0; }
.container .site-width .body .content .post h3.storytitle a { color: #fff; text-decoration: none; text-transform: uppercase;}

.container .site-width .body .content .post .feedback { text-align: right; margin: 15px 15px 15px 0; border: 1px dashed #e4e4e4; padding: 0.3em 0.5em;}
.container .site-width .body .content .post .meta { margin: 5px 15px 5px 0; color: #B6001D;}

.container .site-width .body .content .post code { display: block; overflow: auto;}
.container .site-width .body .content .post blockquote { font-size: 100%; margin: 15px; color:#FA9B1D; padding: 0; background: none;}
.container .site-width .body .content .post blockquote p { background: none;}
.body h1 { color: #C42142; }
.body h2 { font-size: 140%; color: #303030; margin: 25px 15px 15px 0;  }
.body h3 { margin-right: 15px; }

.body p { line-height: 1.5em; margin-right: 15px; }
.body p.intro { font-size: 140%; line-height: 1.5em;}
.body p strong { font-weight: bold; color: #555;}

.body blockquote { font-size: 150%; color: #4C4C4C; margin: 5px 0px 5px 0; padding: 15px 25px 5px 55px; background: url(/img/quotemark-left.jpg) 10px 20px no-repeat;}
.body blockquote p { background: url(/img/quotemark-right.jpg) bottom right no-repeat; margin: 10px 0; padding: 0 40px 0 0; line-height: 1.5em;}
.body blockquote cite { display: block; color: #4C4C4C; font-weight: bold; font-style: normal; font-size: 80%;}
.body blockquote cite .author { color:#303030;}

.body ul { margin: 0 15px 35px 0; padding: 0; }
.body ul li { margin: 10px 0 10px 15px; padding: 1px; }

.body .highlight ul { list-style: none;}
.body .highlight ul li { margin: 10px 0;}
.body .highlight ul li a { font-size: 130%; color:#C42142; border-left: 7px solid #B30018; padding-left: 10px; }
.body .highlight ul li.light-blue a { color:#287CB8; border-color:#287CB8; }
.body .highlight ul li.green a { color:#679238; border-color:#679238; }
.body .highlight ul li.yellow a { color:#F38C30; border-color:#F38C30; }
.body .highlight ul li.red a { color:#B30018; border-color:#B30018; }


.body a { color: #1A75CC; font-weight: bold;}

img.img_right { float: right; margin: 10px 0 10px 20px;}

div.the-team a { display: block; width: 540px; height: 378px; padding: 0; background: url(/distilled/images/rolloverpic.jpg) 0 0 no-repeat; text-decoration:none; }
div.the-team a:hover { background: url(/distilled/images/rolloverpic.jpg) 0 -377px no-repeat;}

/*Table*/

table { border-collapse: collapse; }
table tr { }
table tr td { padding: 0.3em 1em 0.3em 0.3em; border: 1px solid #ccc; }

/*Sitemap*/

#sitemap p { margin: 3px 0; padding: 0.1em;}
#sitemap p.section { padding-left: 0;}
#sitemap p.subsection { padding-left: 30px;}
#sitemap p.article { padding-left: 60px;}

/*Client pages*/
.client-logo { margin:15px; }
.client-logo a { }
.client-web-page { float:left; margin:20px;}
.client-web-page .client-logo { margin:0;}
.client-web-page a p { text-decoration:underline;}


.clients-left { float:left; height:370px; width:49%; font-size:0.6em; border-bottom:1px solid #cdcdcd; }
.clients-left h2 { width:110px; float:right; }
.clients-left blockquote { font-size: 140%; color: #4C4C4C; margin: 5px 0px 5px 0; padding: 5px 0 5px 35px; background: url(/img/quote-top-small.jpg) 5px 10px no-repeat;}
.clients-left blockquote p { background: url(/img/quote-bottom-small.jpg) bottom right no-repeat; margin: 10px 0; padding: 0 25px 0 0; line-height: 1.5em;}
.clients-right { float:right; height:370px; width:49%; padding-left:1%; font-size:0.6em; border:1px solid #cdcdcd; border-width:0 0 1px 1px; }
.clients-right h2 { width:110px; float:right;  }
.clients-right blockquote { font-size: 140%; color: #4C4C4C; margin: 5px 0px 5px 0; padding: 5px 0 5px 35px; background: url(/img/quote-top-small.jpg) 5px 10px no-repeat;}
.clients-right blockquote p { background: url(/img/quote-bottom-small.jpg) bottom right no-repeat; margin: 10px 0; padding: 0 25px 0 0; line-height: 1.5em;}

#contact-us-button { float:left; margin-top:3px; margin-right:20px; margin-bottom:0; }


/*case studies*/
.case-study img { float:left; }
.case-study p.website-address {clear:left; margin-left:10px;}
.case-study .case-study-description { line-height:1.6em; float:right; width:250px; padding:0 20px;}
.case-studies-banner { padding:15px 0 0 0;font-size:0.9em; width:553px; height:127px; background:url('/distilled/images/banner.jpg') 0 0 no-repeat;}
.case-studies-banner p { position:relative; padding-left:100px; width:220px; float:left;}
.case-studies-banner .buttons { padding:0;width:200px; float:right;}
.case-studies-banner #button-one { float:left; }
.case-studies-banner #button-two { float:right; }
.case-studies-banner .buttons a {text-decoration:none;}
.case-studies-banner .buttons .link { text-decoration:underline; padding:0 10px; }
 
 /*tools*/
.featured fieldset { font-size:0.8em; width:200px; padding:10px; border:0; background:#F2F2F2;}
.featured fieldset h2 { margin:0; }
.featured .login-button { width:129px; }
.featured .sign-up-button { width:151px; }
.add-account-button { width:204px}
.featured form input { width:160px;}
.featured .question-mark { position:relative; float:left; margin-right:10px;}

.content .ppc-tool-box-banner { position:relative; width:565px; height:95px; }
	.ppc-tool-box-banner span { position:absolute; top:0; left:0; width:565px; height:95px; background:url(/img/ppc-tools-banner.jpg) no-repeat; }
.content .four-oh-banner { position:relative; width:556px; height:155px;}
	.four-oh-banner span { position:absolute; top:0; left:0; width:556px; height:155px; background:url(/img/404-checker-banner.jpg) no-repeat;}
.content .ppc-pricing-guide-banner { position:relative; width:545px; height:155px; }
	.ppc-pricing-guide-banner span { position:absolute; top:0; left:0; width:545px; height:155px; background:url(/img/ppc-pricing-guide-banner.jpg) no-repeat; }
.content .ad-strength-banner { position:relative; width:568px; height:173px;}
	.ad-strength-banner span { position:absolute; top:0; left:0; width:568px; height:173px; background:url(/img/ad-strength-banner.jpg) no-repeat;}

.grey-box { height:55px; margin-left:5px; padding:0; width:96%; background-color:#B3B3B3; }
.grey-box h1 { margin:0; padding:5px; color:#fff; font-size:1.3em; }
.grey-box .left { float:left; width:9px; height:59px; margin-top:0px; margin-left:-5px; background: url(/distilled/images/home/grey-left.jpg) no-repeat; }
.grey-box .right { float:right; width:9px; height:59px; margin-top:0px; margin-right:-20px; background: url(/distilled/images/home/grey-right.jpg) no-repeat; }
  
/*Crazy Egg*/
.crazy-egg { height:0; overflow:hidden; }

.middle { padding:0 5px; border-left:1px solid #666666; border-right:1px solid #666666;}

/*Blog Post*/
.yellow { color:#fb991c; }
.green { color:#76a12d; }
.red { color:#af141a; }
.light-blue { color:#61aadc; }
.dark-blue { color:#035b88; }
.question { display:block; background:#999999; color:#ffffff; padding:5px; }
.number { position:relative; display:block; float:left; height:1em; padding:5px; margin:0 10px 0 0; border-right:1px solid #ffffff; font-size:1.5em; color:#000000; }