/*
CSS Style Definitions for Atherfold
developed by Stefan Isarie - Webstars ltd.
http://www.webstarsltd.com/
sales@webstarsltd.com

layout
*/
html, body{ font: 11px/16px Arial, Helvetica, 'Trebuchet MS', Trebuchet, sans-serif; color: #434142;  }
body{ width:760px; margin: 10px auto 0 auto; }
#page-container{ width:760px; float:left; }
#left-container{ width: 571px; float:left; background-color:#fff; }
#right-container{ width: 189px; float:right; height:400px; }
#header{ margin-bottom: 20px; }
#content{ width:560px; float:left; }
#left-side{ width: 200px; float:left; }
#right-side{ width: 350px; float:left; margin-left:10px; padding-top:40px; _padding-top: 42px; }

/* =gradient */
body#default #page-container{ background: url("../images/gradients/home.gif") repeat-x bottom left; }
body#business #page-container{ background: url("../images/gradients/business.gif") repeat-x bottom left; }
body#charity #page-container{ background: url("../images/gradients/charity.gif") repeat-x bottom left; }
body#commercial #page-container{ background: url("../images/gradients/commercial-property.gif") repeat-x bottom left; }
body#conveyancing #page-container{ background: url("../images/gradients/conveyancing.gif") repeat-x bottom left; }
body#litigation #page-container{ background: url("../images/gradients/litigation.gif") repeat-x bottom left; }
body#clients #page-container{ background: url("../images/gradients/wills-trusts.gif") repeat-x bottom left; }

/* =banners for right side depending on page */
body#default #right-container{ background: url("../images/banners/home.jpg") no-repeat top right; }
body#business #right-container{ background: url("../images/banners/business.jpg") no-repeat top right; }
body#charity #right-container{ background: url("../images/banners/charity.jpg") no-repeat top right; }
body#commercial #right-container{ background: url("../images/banners/commercial-property.jpg") no-repeat top right; }
body#conveyancing #right-container{ background: url("../images/banners/conveyancing.jpg") no-repeat top right; }
body#litigation #right-container{ background: url("../images/banners/litigation.jpg") no-repeat top right; }
body#clients #right-container{ background: url("../images/banners/wills-trusts.jpg") no-repeat top right; }

/* =left menus */
#navList{ margin:0; padding:0; list-style: none; }
#navList li{ margin:0; padding:0; border-bottom: 1px solid #D1D0D5; }
#navList li.first{ border-top: 1px solid #D1D0D5; }
#navList li a{ color: #353334; text-decoration:none; padding: 3px 0 3px 12px; display:block; text-transform:capitalize; }
#navList li a:hover,
#navList li a.currentPage { color: #000; background-color:#C4DDF3; }

#navList li dl{ border-top: 1px solid #fff; margin:0; padding:0; background-color:#E6E7E9; }
#navList li dd{ margin:0; padding:0; }
#navList li dd a{ display:block; padding: 2px 0 2px 22px; text-transform:capitalize; }
#navList li dd a.currentPage,
#navList li dd a:hover{ background-color: #fff; }


#navSwatches{ margin: 12px 0 0 0; padding:0; }
#navSwatches dd{ width:91px; float:left; margin:0 12px 6px 0; padding:0; _margin-right: 6px; font-size:10px; }
#navSwatches dd.middle{ margin:0 0 6px 0; }
#navSwatches dd a{ display:block; width:91px; height:38px; padding:2px 0 0 6px; color:#333; text-decoration:none; background: url("../images/arrow.gif") no-repeat 80px 4px; text-transform:capitalize; }
#navSwatches dd a.corporate{ background-color:#D7D8EA; }
#navSwatches dd a.commercial{ background-color:#DECFEA; }
#navSwatches dd a.charity{ background-color:#FFDB7C; }
#navSwatches dd a.conveyancing{ background-color:#4C5694; color:#fff; }
#navSwatches dd a.litigation{ background-color:#F5F2E9; }
#navSwatches dd a.clients{ background-color:#D7E3BD; }

/* site wide elements */
#right-side p{ margin:0 0 14px 0; }
#right-side h1{ margin:0; font: 11px Arial, serif; font-weight:700; text-transform:capitalize; }

/* GOOGLE MAP BOX */
div.GMapEZ{ width: 280px; height: 200px; }
div.noWrap{ white-space:nowrap; }

/* others */
.hide{ display: none; }
.show{ display: block; }
.show_{ display: inline; }
.underline{ text-decoration: underline; }
.i{ font-style: italic; }
.r{ text-align: right; }
.l{ text-align: left; }
.c{ text-align: center; }
.b{ font-weight: bold; }
.s{ text-decoration: line-through; }
.u{ text-decoration: underline; }
.b{ font-weight: bolder; }
.i{ font-style:italic; }
img,form{ border: 0; margin: 0; padding: 0; }
.fr{ float: right !important; }
.fl{ float: left !important; }
br.clear{ clear: both; }
hr{ width:100%; height:2px; }
td{ vertical-align:top; }
a{ outline:none; }