/*
Theme Name:		JW Smith (Masonry) Ltd
Theme URI:		http://www.intune-media.co.uk
Description:	Wordpress Theme for JW Smith (Masonry) Ltd.
Version:		1.0
Author:			Andy Thomas (andy@intune-media.co.uk)
Author URI:		http://www.intune-media.co.uk/
*/

/** RESET **/
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
margin:0;
padding:0;
font-size:100%;
vertical-align:baseline;
border:0;
outline:0;
background:transparent;
}
	
ol,
ul{
list-style: none;
}

blockquote,
q {
quotes: none;
}

:focus {
outline: 0;
}

table {
border-collapse: collapse;
border-spacing: 0;
}

textarea {
resize:none;
}

address {
font-style:normal;
}

/** LAYOUT **/

body {
background:url(img/bg.png) 50% 0 repeat-y #d5d5d5;
color:#000;
font-size:62.5%;
font-family:arial,sans-serif;
overflow-y:scroll;
}

#jwsmith {
background-color:#fff;
width:850px;
margin:0 auto;
}

#header-img {
background:url(img/header-img-moving.jpg) 0 0 repeat-x;
display:block;
height:15.4em;
width:850px;
}

ul.nav {
background-color:#013879;
color:#fff;
height:5em;
line-height:5em;
}

ul.nav li {
display:block;
float:left;
height:100%;
width:auto;
}

ul.nav li a {
color:#fff;
display:block;
font-size:1.5em;
font-weight:700;
text-decoration:none;
}

ul.nav li.current_page_item a,
div#sub-nav ul.left li.current_page_item a {
color:#bed3dd;
}

ul#nav-top li a {
padding:0 2.4em;
}

ul#nav-btm {
padding:0 0 0 1em;
}

ul#nav-btm li a {
padding:0 1em;
}

h1 {
color:#003878;
font-size:6.5em;
font-weight:400;
margin:.3em 0;
text-align:center;
white-space:nowrap;
}

h1.long {
font-size:5.5em;
line-height:1.4em;
}

h1.longer {
font-size:4.5em;
line-height:1.8em;
}

h1 span.logo {
background:url(img/logo.png) 0 0 no-repeat;
display:inline-block;
height:85px; /*8.5em*/
text-indent:-999em;
width:347px; /*34.7em*/
}

#footer {
background:url(img/tgomc.png) 97% 50% no-repeat;
font-size:1.5em;
font-weight:700;
height:3.2em;
padding:1.2em 1.5em 1.6em;
}

.brochure-download {
margin-left:200px;
}


#footer address {
font-size:1.1em;
font-style:normal;
}

#footer p.copyright,
#footer p.credits {
font-size:.7em;
font-weight:700;
margin-top:.2em;
}

#footer p.copyright a,
#footer p.credits a {
color:#003878;
text-decoration:none;
}

#footer p.copyright a:hover,
#footer p.credits a:hover {
text-decoration:underline;
}

/** COLUMNS **/

.columns div.middle {
background-color:#fff;
float:left;
margin:1.5em 0 1.5em 1.5em;
}

.columns div.left {
float:left;
margin:1.5em 0 1.5em 2.5em;
}

.columns div.right {
float:right;
margin:1.5em 0 1.5em 1.5em;
}

.one-col div.left {
float:left;
margin:1.5em 2.5em;
}

.two-cols div.left {
width:44.4em;
}

.two-cols div.right {
width:36.6em;
}

#blog div.left {
width:52em;
}

#blog div.right {
margin:1.5em 2.5em 1.5em 1.5em;
width:25em;
}

#gallery div.left,
#image div.left {
width:80em;
}

#contact-us div.left,
#contact-us div.right {
margin:2.5em;
width:37em;
}

#installation {
margin:0 auto;
width:81.6em;
}

#installation div.left,
#installation div.middle,
#installation div.right {
background-color:#d5d5d5;
margin:1.5em 1.5em;
overflow-x:hidden;
text-align:center;
width:24.2em;
}

#installation div p {
font-size:1.4em;
font-weight:700;
line-height:1.2em;
height:3.6em;
max-height:3.6em;
margin:1.2em auto;
overflow:hidden;
width:80%;
}

#btm {
background:url(img/bg-btm.png) 0 0 no-repeat;
display:block;
height:31px;
margin:0 auto;
width:918px;
}

/** CONTENT **/
div.columns div.left h1,
div.columns div.left h2,
div.columns div.left h3,
div.columns div.left h4,
div.columns div.left h5,
div.columns div.left h6,
div.columns div.right h1,
div.columns div.right h2,
div.columns div.right h3,
div.columns div.right h4,
div.columns div.right h5,
div.columns div.right h6 {
color:#003878;
font-size:1.8em;
margin:0 0 .5em;
}

div.columns div.left p,
div.columns div.right p,
div.columns div.left address,
div.columns div.right address {
font-size:1.5em;
line-height:1.75em;
margin:0 0 .75em;
}

div.columns div.left ul,
div.columns div.right ul,
div.columns div.left ol,
div.columns div.right ol {
list-style:disc inside;
}

div.columns div.left ul li,
div.columns div.right ul li,
div.columns div.left ol li,
div.columns div.right ol li {
font-size:1.5em;
line-height:1.75em;
}

div.columns div form label {
font-size:1.5em;
}

div.columns div a {
color:#013879;
text-decoration:none;
}

div.columns div a:hover {
text-decoration:underline;
}

div#sub-nav {
margin:0 0 2em;
}

div#sub-nav ul.left {
float:left;
height:28.5em;
margin:0 0 0 2em;
width:24em;
}

div#sub-nav ul.left li {
background-color:#013879;
color:#fff;
font-size:1.8em;
font-weight:700;
height:40px;
line-height:40px;
margin:0 0 9px;
text-indent:.75em;
}

div#sub-nav ul.left li a {
color:#fff;
display:block;
position:relative;
text-decoration:none;
white-space:nowrap;
}

div#sub-nav div.right {
margin:0 2em 0 0;
position:relative;
width:56.2em;
}

/** CLASSES **/

a span.external {
background:url(img/ext-link.png) 0 0 no-repeat;
display:block;
float:right;
height:16px;
margin:-8px 8px 0 0;
position:absolute;
right:0;
text-indent:-999em;
top:50%;
width:16px;
}

input.btn,
input.form-submit {
background-color:#013879;
border:0;
border-radius:.3em;
-moz-border-radius:.3em;
-webkit-border-radius:.3em;
color:#fff;
font-size:1em;
margin:.3em 0;
padding:.5em;
text-align:center;
width:auto;
}

div.columns div p.attachment {
margin:auto;
text-align:center;
}

.group:after {
content:'.'; 
display:block; 
height:0; 
clear:both; 
visibility:hidden;
}

div.columns div .contact-number {
background:url(img/bg-contact.png) 0 0 no-repeat;
color:#fff;
font-family:"arial narrow",arial,sans-serif;
height:11.2em;
text-align:center;
width:34.1em;
}

div.columns div .contact-number h3 {
color:#fff;
font-size:2.4em;
line-height:2em;
margin:0;
}

div.columns div .contact-number p {
font-size:4.8em;
font-weight:700;
line-height:1em;
}

div.columns div .contact-number p a {
padding-bottom:.4em;
}

div.columns div .contact-number a,
div.columns div .contact-number a:hover {
color:#fff;
display:block;
text-decoration:none;
}

div.columns div .box-shadow {
background:url(img/bg-box-shadow.png) 100% 100% no-repeat;
height:30.9em;
margin:4em 0;
width:36.6em;
}

div.columns div .box-content {
border:.15em solid #013879;
border-radius:.3em;
-moz-border-radius:.3em;
-webkit-border-radius:.3em;
font-size:1.5em;
height:18.8em;
width:22.9em;
}

#banner-img-small-1,
#banner-img-small-2 {
height:138px;
left:5px;
position:absolute;
width:204px;
}

#banner-img-small-1 {
top:0px;
}

#banner-img-small-2 {
top:147px;
}

#banner-img-large {
height:285px;
position:absolute;
top:0px;
right:0px;
width:340px;
}

.banner-img-strap {
background-color:#c32126;
color:#fff;
display:block;
font-size:2em;
font-weight:700;
text-align:center;
width:320px;
padding:18px 10px;
position:absolute;
right:0;
top:0;
z-index:10;
}

.red,
div.columns div a.red {
color:#c32126;
}

div.columns div a.red:hover {
color:#c32126;
}

a.aftercare-products-form {
display:block;
font-weight:700;
margin:auto;
text-align:center;
width:70%;
}

/** AFTERCARE BOX **/
div#aftercare div .box-shadow {
margin:4em 0 2em;
}

div.columns div .aftercare-box {
position:relative;
}

div.columns div .aftercare-box h3 {
background:url(img/logo-small.png) 0 0 no-repeat;
color:#c4151c;
font-size:1em;
margin:.5em auto;
padding:4em 0 0;
text-align:right;
text-transform:uppercase;
width:90%;
}

div.columns div .aftercare-box h3 span {
visibility:hidden;
}

div.columns div .aftercare-box ul {
color:#003878;
list-style:disc inside;
width:90%;
}

div.columns div .aftercare-box ul li {
font-size:1em;
line-height:1em;
margin:1em;
}

div.columns div .aftercare-box a.offer {
background:url(img/aftercare-offer.png) 0 0 no-repeat;
bottom:1em;
display:block;
height:7.5em;
position:absolute;
right:1em;
text-indent:-999em;
width:7.5em;
}

/** AFTERCARE IMAGES **/
div#aftercare div.right img {
margin:0 auto 4em;
}

/** NEWS BOX **/
div.columns div .news-box {
height:16.8em;
overflow:hidden;
padding:1em;
width:20.9em;
}

div.columns div .news-box h3 {
color:#c32126;
font-size:1.2em;
text-align:center;
text-transform:uppercase;
}

div.columns div .news-box ul li {
font-size:1.2em;
margin:.8em 0;
overflow:hidden;
white-space:nowrap;
}

div.columns div .news-box ul li span.excerpt {
color:#003878;
font-size:.8em;
}

/** DOWNLOAD LINK **/
div.columns div a.download {
background:url(img/bg-download.png) 0 0 no-repeat;
color:#fff;
display:block;
font-size:14px;
font-weight:700;
height:32px;
line-height:16px;
margin:2em auto;
overflow:hidden;
padding:16px 0 17px 69px;
width:247px;
}

div.columns div a.download:hover {
background-position:0 -65px;
text-decoration:none;
}

/** SOCIAL MEDIA BTNS **/
#social-media {
margin:1.5em 2.5em;
}

#social-media p {
color:#003878;
font-size:1.2em;
margin:.5em 0;
}

#social-media ul li {
float:left;
height:3.2em;
}

#social-media ul li a {
display:block;
height:3.2em;
text-indent:-999em;
width:100%;
}

.sm_facebook {
background:url(img/sm_facebook.png) 50% 50% no-repeat;
width:8.6em;
}

.sm_linkedin {
background:url(img/sm_linkedin.png) 50% 50% no-repeat;
width:8.6em;
}

.sm_twitter {
background:url(img/sm_twitter.png) 50% 50% no-repeat;
width:8.6em;
}

.sm_flickr {
background:url(img/sm_flickr.png) 50% 50% no-repeat;
width:8.6em;
}

.sm_youtube {
background:url(img/sm_youtube.png) 50% 50% no-repeat;
width:8.6em;
}

.sm_stumble {
background:url(img/sm_stumbleupon.png) 50% 50% no-repeat;
width:6.45em;
}

.sm_delicious {
background:url(img/sm_delicious.png) 50% 50% no-repeat;
width:6.45em;
}

/** SITEMAP **/
#sitemap ul {
color:#003878;
list-style:disc inside;
margin:1em 1em 3em;
}

#sitemap ul li {
font-size:1.2em;
margin:0 0 0 1.2em
}

#sitemap ul li ul {
margin:0 1em;
}

#sitemap ul li ul li {
font-size:1em;
}

#sitemap ul li a {
color:#003878;
text-decoration:none;
}

#sitemap ul li a:hover {
text-decoration:underline;
}

/** BREADCRUMBS **/

div#breadcrumbs div.left {
font-size:1.4em;
margin:0 1.8em;
}

div#breadcrumbs div,
div#breadcrumbs div a {
color:#bbb;
}


/** BLOG POSTS **/

/* widgets */
#blog div.right div.widget {
background-color:#eee;
margin-bottom:2em;
padding:0 0 .5em 0;
}

#blog div.right div.widget h2 {
margin:0 0 .5em;
}

#blog div.right div.widget a {
color:#003878;
}

#blog div.right div.widget_tag_cloud a {
background-color:#ccc;
color:#000;
line-height:1.4em;
padding:0 .2em;
text-decoration:none;
}

#blog div.right div.widget_tag_cloud a:hover {
background-color:#003878;
color:#fff;
}

#blog div.right div.widget ul li {
font-size:1em;
}

/* content */

#blog .post-info {
background:#003878;
clear:both;
color:#fff;
font-size:1.2em;
padding:.3em;
position:relative
}

#blog .post-info h2,#blog .post-info h3 {
font-size:148%;
margin:0;
width:17.5em
}

#blog .post-info h2 a,#blog .post-info h3 a {
clear:both;
color:#fff;
text-decoration:none
}

#blog .post-info h2 a:hover,#blog .post-info h3 a:hover {
clear:both;
color:#ccf;
}

#blog .post-info span.post-time {
background:url(img/date.png) 0 50% no-repeat;
line-height:2em;
padding:0 0 0 20px;
position:absolute;
right:8px;
top:.3em
}

#blog .post-info span.comments {
line-height:2em;
position:absolute;
right:108px;
top:.3em;
}

#blog .post-info span.comments a {
color:#fff;
background:url(img/comment.png) 0 50% no-repeat;
padding:0 0 0 20px;
text-decoration:none;
}

#blog .post-info span.comments a:hover {
text-decoration:underline;
}

#blog .post-info span.comments a span {
display:none
}

#blog #content {
background:0
}

#blog div.post {
clear:both;
margin:0 0 2em;
padding:0 0 2em
}

/* sidebar */

#blog div.right div.widget h2 {
background:#003878;
color:#fff;
font-size:1.2em;
height:1.4em;
line-height:1.4em;
padding:.5em;
text-align:left;
}

#blog div.right div.widget p {
font-size:1.2em;
}

#blog div.right div.widget ul {
color:#003878;
list-style:disc inside;
margin:0 0 0 1em;
}

#blog div.right div.widget ul li a {
font-size:1.2em;
text-decoration:none
}

#blog div.right div.widget:last-child {
margin-bottom:1em;
}

#blog div.right div.widget ul li.recentcomments {
display:block;
font-size:1.2em;
padding:.3em;
text-decoration:none
}

#blog div.right div.widget ul li.recentcomments a {
background:none transparent;
border-bottom:0;
color:#fff;
font-size:100%;
text-decoration:none
}

/* classes */

#blog .alignleft {
margin:.5em 1em .5em 0
}

#blog .alignright {
margin:.5em 0 .5em 1em
}

#blog ul,#blog ol {
margin:1em 1.5em;
}

/* comments & forms */
form dl dt {
clear:left;
float:left;
margin:.3em 0;
width:29%
}

form dl dt.form-error {
color:#c32126;
font-size:1.2em;
width:100%;
}

form dl dd {
float:left;
margin:.3em 0;
width:69%
}

form dl label {
display:block;
padding:.2em
}

form dl input,form dl select,form dl textarea {
border:1px solid #013879;
display:block;
font-family:arial,sans-serif;
font-size:1.2em;
margin:0 0 0 auto;
padding:.2em;
width:98%
}

form dl input.btn,
form dl input.form-submit {
width:auto;
}

form p {
clear:left;
margin:.3em 0;
text-align:right;
width:98%
}

span.required {
color:red;
font-weight:700
}

ul.commentlist {
list-style:none;
margin:0;
padding:0;
}

ul.commentlist li {
background-color:#eee;
border:.1em solid #b2b2b2;
list-style-position:inside;
margin:.5em auto;
min-height:3em;
padding:1em;
position:relative;
}

ul.commentlist li.alt-blog-comment {
background-color:#e2e2e2;
}

ul.commentlist li img {
float:left;
margin:0 .5em 1em 0;
}

ul.commentlist li dl {
margin-left:52px;
}

ul.commentlist li dl dt {
color:#333;
font-size:1.2em;
line-height:1.4em;
font-weight:700;
}

ul.commentlist li dl dt a {
color:#666;
text-decoration:none;
}

ul.commentlist li dl dt a:hover {
border-bottom:1px dotted #999;
color:#999;
}

div#column-right ul li.recentcomments {
color:#fff;
background-color:#b2b2b2;
}

ul.commentlist p {
font-size:1.2em;
line-height:1.4em;
}

/** GALLERY **/

div.columns div ul.gallery {
list-style:none;
}

li.gallery-item {
float:left;
margin:19px;
text-align:center;
width:121px;
}

div.columns div li.gallery-item a {
background-color:#013879;
color:#fff;
display:block;
padding:1px;
}

div.columns div li.gallery-item a:hover {
background-color:#c32126;
text-decoration:none;
}

div.columns div li.gallery-item a span {
display:block;
font-size:1em;
overflow:hidden;
padding:4px 0;
white-space:nowrap;
}

/** LIGHTBOX **/

#jquery-overlay {
position: absolute;
top: 0;
left: 0;
z-index: 90;
width: 100%;
height: 500px;
}
#jquery-lightbox {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 100;
text-align: center;
line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
position: relative;
background-color: #fff;
width: 250px;
height: 250px;
margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
position: absolute;
top: 40%;
left: 0%;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
}

#lightbox-loading-link {
background:url(img/lightbox/lightbox-ico-loading.gif) 50% 50% no-repeat;
display:block;
position:absolute;
top:50%;
left:50%;
margin:-32px 16px 16px -16px;
height:32px;
text-indent:-999em;
width:32px;
}

#lightbox-nav {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
width: 49%;
height: 100%;
zoom: 1;
display: block;
}
#lightbox-nav-btnPrev { 
left: 0; 
float: left;
width:63px;
height:32px;
text-indent:-999em;
}
#lightbox-nav-btnNext { 
right: 0; 
float: right;
width:63px;
height:32px;
text-indent:-999em;
}

#lightbox-nav-btnPrev:hover {
background:url(img/lightbox/lightbox-btn-prev.gif) 0 0 no-repeat;
}

#lightbox-nav-btnNext:hover {
background:url(img/lightbox/lightbox-btn-next.gif) 0 0 no-repeat;
} 

#lightbox-container-image-data-box {
font: 10px Verdana, Helvetica, sans-serif;
background-color: #fff;
margin: 0 auto;
line-height: 1.4em;
overflow: auto;
width: 100%;
padding: 0 10px 0;
}
#lightbox-container-image-data {
padding: 0 10px; 
color: #666; 
}
#lightbox-container-image-data #lightbox-image-details { 
width: 70%; 
float: left; 
text-align: left; 
}	
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-description {
display: block; 
clear: left;
padding:1em 0;
}
#lightbox-image-details-currentNumber {
display: block; 
clear: left; 
padding-bottom: 1.0em;	
}			
#lightbox-secNav-btnClose {
background:url(img/lightbox/lightbox-btn-close.gif) 0 0 no-repeat;
display:block;
float: right;
padding-bottom: 0.7em;	
width: 66px; 
text-indent:-999em;
}

/** SEO Keyword Boxes **/

.seo-box {
     width:300px;
     background:#E9E9F1;
     border: 1px solid #CCCCCC;
     padding:20px;
     color:#888888;
}


/** IE FIXES **/

* html .group { /* IE6 */
height:1%;
}

*:first-child+html .group { /* IE7 */
min-height:1px;
}