/*--------------------------------------------------    
    Type and Colours CSS -- www.babersmith.co.uk
--------------------------------------------------*/



/*---- General ----*/

body { font-family: Tahoma, Geneva, sans-serif; font-size: 13px; color: #333; background: #f0f0f0 url('../images/bg.jpg') repeat-x;}

h1,h2,h3,h4,h5,h6 { font-weight: normal; color: #333; }

h1 { font-size: 35px; color: #f50; margin-bottom: 17px; }
h2 { font-size: 16px; color: #f50; margin-bottom: 9px; line-height: 18px; }
h2 a:hover { text-decoration:none; color:#333; }

h3 { font-size: 17px; margin-bottom: 9px; }
h4 { font-size: 13px; line-height: 17px; margin-bottom: 6px; }
h5 { font-size: 15px; font-weight: bold; margin-bottom: 7px; }
h6 { font-size: 13px; font-weight: bold; }

p { margin: 0 0 12px 0; line-height: 17px; }

a, a cite, a * { color: #f50; text-decoration: none; }
a:hover, a:focus, #main a:hover cite, #main a:focus cite, a:hover *, a:focus * { color: #333; text-decoration:none; }


li ul, 
li ol       { margin:0; font-weight: normal; }
ul, ol      { margin: 0; line-height: 17px; }

ul          { list-style-type: none; }
ol          { list-style-type: none; }

dl          { margin: 0 0 1.5em 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 1.5em;}

img { display: block; }
img a { border:none; }

blockquote { border-bottom: 1px solid #e0e0e0; }
blockquote p { font-size: 13px; font-weight:normal; line-height: 18px; }
blockquote p:before { padding-right: 5px; content:  url('../images/lquote.png') }
blockquote p:after { padding-left: 5px; content: url('../images/rquote.png') }

.button { color: #333; padding: 10px 0; margin-bottom: 0; }
.button:hover { text-decoration: none; color: #f50; }
.button:after { padding-left:5px; content: url('../images/arrow.png'); }
.button:hover:after { padding-left: 10px; text-decoration: none; color: #f50; }

.on { color: #333; }
.on a { color: #333; font-weight: bold; }
.on a:before { content: url('../images/arrow.png'); padding-right: 5px; }

.pull { font-weight: bold; }

.padded { padding-top: 5px; }

.hidden { display:none; }

strong { font-weight: bold; }
em,dfn      { font-style: italic; }
dfn         { font-weight: bold; }
sup, sub    { line-height: 0; }

.expandbox { height: 350px; }

.link a { color: #333; } 
.link a:hover { padding-left: 5px; text-decoration:none; color: #f50; } 
.link a:after { padding-right: 5px; content: url('../images/arrow.png'); color: #333; } 

.subnav { margin-bottom: 5px; font-weight: normal; }
.subnav li { border-bottom: 1px solid #e0e0e0; padding: 5px 0; }
.subnav ul li { border: 1px solid #fff; }
.subnav a { color: #333; }
.subnav a:hover { color: #f50; }

ul ul  { background-color: #f0f0f0; border:0; color: #333; }

ul ul a { padding-left: 20px; color: #f50; }





/*---- Top Navigation ----*/

.top_navigation { font-size: 17px; }

ul#menu li { display:block; float:left; }
ul#menu li a { display:block; outline:none;height:25px; background:transparent url('../images/buttons_blog.gif') no-repeat 0 0; text-indent:-9999px; margin:0; position: relative; }

ul#menu li a:hover { background-position:0 -25px; }
	
ul#menu li#about a { width:53px; background-position:0 0; }
ul#menu li#about a:hover { background-position:0 -25px; }
ul#menu li#about a:active, ul#menu li#about a.on { background-position:0 -50px; }

ul#menu li#news a { width:102px; background-position:-52px 0; }
ul#menu li#news a:hover {background-position:-52px -25px; }
ul#menu li#news a:active, ul#menu li#news a.on {background-position:-52px -50px; }

ul#menu li#clients a { width:53px; background-position:-154px 0; }
ul#menu li#clients a:hover { background-position:-154px -25px; }
ul#menu li#clients a:active, ul#menu li#clients a.on { background-position:-154px -50px; }

ul#menu li#work a {	width:53px; background-position:-207px 0; }
ul#menu li#work a:hover { background-position:-207px -25px; }
ul#menu li#work a:active, ul#menu li#work a.on { background-position:-207px -50px; }

ul#menu li#contact a { width:65px; background-position:-260px 0; }
ul#menu li#contact a:hover { background-position:-260px -25px; }
ul#menu li#contact a:active, ul#menu li#contact a.on { background-position:-260px -50px; }

ul#menu li#gallery a { width:65px; background-position:-325px 0; }
ul#menu li#gallery a:hover { background-position:-325px -25px; }
ul#menu li#gallery a:active, ul#menu li#gallery a.on { background-position:-325px -50px; }

ul#menu li#blog a { width:53px; background-position:-389px 0; }
ul#menu li#blog a:hover { background-position:-389px -25px; }
ul#menu li#blog a:active, ul#menu li#gallery a.on { background-position:-389px -50px; }

ul#menu li#specialise a { width:82px; background-position:-443px 0; }
ul#menu li#specialise a:hover { background-position:-443px -25px; }
ul#menu li#specialise a:active, ul#menu li#gallery a.on { background-position:-443px -50px; }

/*---- Panels/Content ----*/

#main_panel h1 { margin-top: 40px; color:#333; border-bottom: 2px solid #f50; padding-bottom: 10px; }
#main_panel h1 span { font-size: 18px; color:#f50; letter-spacing: -0.5px;  }

#main_panel h4 { font-weight: bold; border-bottom: 1px solid #e0e0e0; }

#map { border: 1px solid #e0e0e0; }
#map:hover { border: 1px solid #c0c0c0; }

#main_panel h1.home { margin-top: 70px; border:none; }

.section_name, .section_name a { font-size: 11px; margin:0; padding:0; color: #c0c0c0; }
.section_name a:hover { color: #333; }

#sub_panels h1 { font-size: 27px; color: #333; margin-left: 10px; margin-bottom: 10px; margin-top: 10px;  }
#sub_panels h1 a { color: #333; }
#sub_panels h1 a:hover { color: #f50; }

#sub_panels h2 span { font-size: 13px; color: #333; }

h2 strong { color: #333; }

.p_640 { border: 1px solid #e0e0e0; margin-bottom:0; padding-bottom:5px; }
.p_640 img { margin-top:0; margin-bottom: 5px; }

.p_320 { border: 1px solid #e0e0e0; margin-bottom:0; padding-bottom:5px; margin-bottom: 15px; }

.p_320 img { margin-top:0; margin: 0 0 5px 0; border-top: 1px solid #f0f0f0; border-bottom: 1px solid #f0f0f0; }

.p_160 { border: 1px solid #e0e0e0; margin-bottom:15px; padding-bottom:5px; height: 145px; }
.p_160 img { float:right; margin-top:0; margin-bottom: 5px; margin-left: 5px; }
.p_160:hover { border: 1px solid #c0c0c0; }

.p_160c { border: 1px solid #e0e0e0; margin-bottom:5px; padding-bottom:2px; }
.p_160c img { float:right; margin-top:0; margin-left: 5px; }
.p_160c p { margin-bottom: 0; padding-bottom:0; padding-top:0; height: 150px; }
.p_160c h2 { color: #333; }
.p_160c h2:after { content: url('../images/arrow.png'); padding-left: 5px; }

.p_160square { border: 1px solid #e0e0e0; width: 120px; height: 120px; margin-left:0px; margin-right: 15px; margin-bottom: 15px; }
.p_160square img { padding: 5px; width: 110px; height: 110px; text-align: center; }
.p_160square:hover { border: 1px solid #c0c0c0; }

.p_160square_highlight { border: 1px solid #e0e0e0; width: 120px; height: 120px; margin-left:0px; margin-right: 15px; margin-bottom: 15px; }
.p_160square_highlight img { padding: 5px; width: 110px; height: 110px; text-align: center; }
.p_160square_highlight:hover { border: 1px solid #f50; }

.p_80 { margin-bottom:0; padding-bottom:5px; }
.p_80 img { float:right; width: 40px; height: 40px; margin-top:0; margin-bottom: 5px; margin-left: 5px; }

.p_40 { border: 1px solid #e0e0e0; margin-bottom:0; padding-bottom:1px; }
.p_40 img { float:right; width: 20px; height: 20px; margin-top:0; margin-bottom: 5px; margin-left: 5px; }
.p_40:hover { border: 1px solid #c0c0c0;  }
.p_40 h2 a { color: #333; }
.p_40 h2 a:hover { color: #f50; }
.p_40 h2 a:after { content: url('../images/arrow.png'); padding-left: 5px; }
.p_40 h2 a:hover:after { content: url('../images/arrow.png'); padding-left: 10px; }


#buildingsuccess p, #speople p, #sagency p, #sclients p  { background-color: #fff; height: 150px; padding: 10px; border-left: 1px solid #e0e0e0; border-right: 1px solid #e0e0e0; border-bottom: 1px solid #e0e0e0;  }


/*---- Footer ----*/

#footer li { font-size: 11px; color: #c0c0c0; text-transform: lowercase; }
#footer h2 { margin-top: 10px; padding: 10px 0; border-top: 1px solid #e0e0e0; }
#footer p { font-size: 11px; margin: 5px 0; letter-spacing: 0; }
#footer li a { color: #c0c0c0; text-decoration: none; }
#footer li a:hover { text-decoration: none;  color: #f50; }
#footer li a:before { content: "/ " }


/*---- Forms ----*/

form { margin-top: 5px; }
form p { margin:0; margin-bottom: 5px; }

input.text, textarea { width: 275px; border: 1px solid #d0d0d0; padding: 5px; margin:0; font-size: 12px; color: #333; }
input.button { background-color: #e0e0e0; border: 1px solid #d0d0d0; padding: 3px 30px; font-size: 13px; color: #333; }
input.button:hover { background: #f0f0f0; }

/*---- Upload Form ----*/

#upload_table tbody > tr > td { vertical-align: top; line-height: 10px; }
#upload_table tbody > tr > td > input {margin: 5px 10px;}
#upload_table tbody > tr > td > label > input {margin: 5px 10px;}
#upload_table tbody > tr > td > label > textarea {margin: 5px 10px; }
#upload_table tbody > tr > td > input#image {margin: 5px 10px; }