/*--------------------------------------------------    
    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: 14px; font-weight: bold; margin-bottom: 7px; }
h6 { font-size: 13px; font-weight: bold; }
h7 { font-size: 14px; color: #f50; margin-bottom: 6px; line-height: 20px;}


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_news.gif') no-repeat 0 0; text-indent:-9999px; margin:0; position: relative; }

----

ul#menu li ul li  { display:block; float:left; }
ul#menu li ul li a { display:block; outline:none; height:25px; background:transparent url('../images/buttons_about_Flat.jpg') 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; }




/*new about button*/

ul#menu li.about a { width:54px; 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; }

/*new about button drop down*/

ul#menu li ul li { height: 25px; float: left; display:block; background-color:#fff; background-position:-50px 0; }
ul#menu li ul li a { height: 25px; width: auto; color:#fff; padding: 0px 0px;}	
ul#menu li ul li a:hover { height: 25px; color: #999; }

/*new agency button drop down*/

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

/*new team button drop down*/

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



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

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

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

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

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

ul#menu li#blog a { width:53px; background-position:-343px 0; }
ul#menu li#blog a:hover { background-position:-343px -25px; }
ul#menu li#blog a:active, ul#menu li#gallery a.on { background-position:-343px -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_160e { border: 1px solid #e0e0e0; margin-bottom:15px; margin-top:5px;  padding-top:5px; padding-bottom:5px; height: 80px; }
.p_160e img { float:right; margin-top:5px; margin-bottom: 5px; margin-left: 5px; height: 70px;}
.p_160e:hover { border: 1px solid #c0c0c0; }

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

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

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


.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; cursor: pointer; }
.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_160square_2 { border: 1px solid #e0e0e0; width: 145px; height: 120px; margin-left: 0px; margin-right: 15px; margin-bottom: 15px; background-color:#FFF;}
.p_160square_2 img { padding: 5px 17px 5px 5px; width: 110px; height: 110px; text-align: center;}
.p_160square_2:hover { border: 1px solid #c0c0c0;}

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

.p_160square_3_highlight { border: 1px solid #e0e0e0; width: 144px; height: 120px; margin-left:0px; margin-right: 0px; margin-bottom: 15px; background-color:#FFF;}
.p_160square_3_highlight img { padding: 5px 17px 5px 5px; width: 110px; height: 110px; text-align: center; }
.p_160square_3_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; }

#agency_content {margin-bottom:15px; padding-bottom:5px; width: 460px; }
#general_content {margin-bottom:15px; padding-bottom:5px; width: 460px; }


#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; }