@charset "utf-8";
/* CSS Document */

/*-----
We Are Web: Screen Style Sheet 
ƒ
---------------------------------------------------------------------------------
Version: 1.0
Author: We Are Web
Email: info@weareweb.co.uk
Website: http://www.weareweb.co.uk
Last Modified: 24/08/09
-------------------------------------------------------------------------------*/


/*********************  * GLOBAL * *********************/

*{
padding: 0px;
font-family:Tahoma, Helvetica, sans-serif;
list-style:none;
}
/*********************  * GLOBAL * *********************/

/* Heading formatting */

H1 {font-size:1.25em; color: #808080; margin: 5px 10px 5px 10px; border-bottom:2px solid #E6E6E6; }
H2 {font-size:.95em; color: #808080;} 
H3 {font-size:.8em; color: #808080; margin: 5px 5px;} 
H4 {font-size:.7em; color: #808080; margin: 5px 5px;} 

/* Text formatting */

p {font-size: .8em;}

/* Form formatting */

INPUT, SELECT, TH, TD {font-size:.75em} /* - for IE browser*/

/* Table formatting */

table{}
tr{}
td{}

/* lists */

ul { }
li { font-size: .8em; }

/* images */

.thumb { float:left; margin: 5px 5px; border: 1px solid #FF9900}
img { border:none;}


/********************* * LAYOUT * *********************/

body  {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 100%; /* for IE */
	margin: 0;
	padding: 0;
	text-align: center;
}
#container { 
	width: 1024px;
	background: #FFFFFF;
	margin: 0 auto;
	text-align: left;
} 

/* Header */

#header { 
	background: #DDDDDD; 
	padding: 0 10px 0 20px;
} 

/* Sidebar */

#sidebar1 {float: left; 
	width: 140px;
	padding: 15px 0;
	font-size:.65em;}

/* Left Column */

#lhcolumn {
	float: left;
	width: 160px;
	padding: 0;
}

/* Right Column */

#rhcolumn {
	position:relative;
	float: right;
	width: 182px;
	margin: 0 10px 10px 10px;
}

.title_col {height: 20px; background: url('/images/box_tops/col-box-top.gif');}
.title_main {height: 20px; background: url('/images/box_tops/main-box-top.gif');}

.box-text {;}

#digitalgroupbox {
	height:130px;
	margin: 0 0 10px 0;
	background-color: #F7931E;
}

.tabbed-box {
	width:100%;
	margin: 10px 0 0 0;
}
.tabs{
	margin: 0px;
	padding: 0px;  
}
.tabbed-box .tabs li {
	float: left;
	width: 180px;
	display: inline;
	height: 20px;
	list-style: none;
	background-image: url("/images/box_tops/col-box-top.gif");
	text-align:center;
}
.tabbed-box .tabs li.margin { margin: 0 2px 0 2px; }

.tabbed-box .tabs li a {
	display: block;
	text-decoration: none;
	text-align: center;
	color: #808080;
	outline:none;
	padding-top:3px;
}
.tabbed-box .tabs li a:hover{
	color: #FFF; 
}
.tabbed-content {
	border-left: 1px solid #999999;
	border-bottom: 1px solid #999999;
	border-right: 1px solid #999999;
	padding: 20px 10px 10px 10px;
	display: none;
}

/* Subscribe icons */

#subscribe_icons {
	margin: 2px 0 1px 0;
  }

#subscribe_icons ul {
	list-style: none;
	margin: 0px;
	padding: 0px;  
}
#subscribe_icons li {
	float: left;
	width: 30px;
	height: 30px;
	display: inline;
	margin: 0 4px 0 0;
	text-align:center;
}
a.twitter_subscribe {
    background:url('/images/twitter_icon.gif') no-repeat top left;
    display:block;
    height:30px;
    width:30px;
	outline:none;
}
a.twitter_subscribe span, 
a.linkedin_subscribe span,
a.facebook_subscribe span,
a.rss_subscribe span,
a.email_subscribe span {display:none;}

a.linkedin_subscribe {background-image: url("/images/linkedin_icon.gif"); 
	display:block;
    height:30px;
    width:30px;
	outline:none;}
a.facebook_subscribe {background-image: url("/images/facebook_icon.gif");    
	display:block;
    height:30px;
    width:30px;
	outline:none;}
a.rss_subscribe {background-image: url("/images/rss_icon.gif");    
	display:block;
    height:30px;
    width:30px;
	outline:none;}
a.email_subscribe {background-image: url("/images/email_icon.gif");    
	display:block;
    height:30px;
    width:30px;
	outline:none;}

/* Main Content Page Body */

#mainContent {
	width:760px;
 	margin: 0 0 0 160px;
 	padding: 0;
 }
 #mainContent ul {
	
 }
 
#body {
	margin: 0 182px 0 0;
 	padding: 10px 20px 10px 10px;
}
#body_nocol {
	margin: 0;
 	padding: 10px 10px;
}

.enquiry_box
{
position:fixed;
top:30px;
right:5px;
padding: 0 10px 0 10px;
background-color:#FF9900;
}

#excerptsbox {
	margin: 10px 200px 10px 10px;
 	padding: 5px 5px;
}
.project_box
{
position:relative;
float:left;
width:200px;
height: 150px;
padding: 10px;
margin: 13px;
background-color:#CCCCCC;
}
.project_box:hover
{
background-color:#FFFFFF;
}

/* Footer */

#footernav {
	height:16px;
	margin: 50px 0 0 0;
	padding: 0;
  }
#footernav ul {
	list-style: none;/*goodbye bullets*/
	margin: 0;
	padding: 0;
} 
#footernav li {
	float:left;
	margin: 0 5px 0 0;
	padding: 0;
	display:inline;/*displays horizontal*/
} 
#footernav li a {
	margin: 0;
	padding:0;
	font-family:Tahoma, Verdana, sans-serif;
	font-size:.95em;
	letter-spacing:.6px;
	text-decoration:none;
	color:#333333;
} 
#footernav li a:hover {
	color:#000000;
} 
/* sliding doors technique used to avoid flicker as browser loads roll-over image*/

#footernav img {padding: 0 0 8px 0;}

/* Other */


/********************* * NAVIGATION * *********************/

/* Main (horizontal) Navigation */

/* Left Navigation */
.pfmain #nav{
width:140px;
padding: 10px 0 10px 0;
}
.pfmain #nav ul
{
list-style-type: none; /*turns off display of bullet*/
padding-left: 0; /*removes indent Mozilla and NN7*/
margin-left: 0; /*removes indent IE and Opera*/
}
.pfmain #nav li {
padding: 5px 0px 0px 0px; 
margin:0px;
}
.pfmain #nav a {
display: block;
padding: 0px 5px 0px 0px;
text-decoration: none;
text-color: #757575;
text-align: right;
font-size:1.4em;
background: #F9A230;
border-bottom: #707070 1px solid;
border-right: #707070 1px solid;
}
.pfmain #nav a:link, #nav a:active, #nav a:visited {
color: #757575;
}
.pfmain #nav a:hover {
background: #9C8C8C;
color: #ffffff;
}

/* Right Navigation */

/* Breadcrumb Navigation */

/********************* * FORMS * *********************/

/* Any form formatting that varies from the common formatting, if there are multiple differently formatted forms, then use sub-headings */

/********************* * TABLES * *********************/

/* Same deal as forms */

/********************* * LISTS * *********************/

/* Same deal as forms and tables */

form { border: none; padding: 2px 2px; }
input { float:left; width: 100px; }
field { float: left; width: 100px; }
legend { display: none; }
fieldset { border: none; }

/********************* * CONTENT * *********************/

/* About me styles */

.content{
float:right;
width:200px;
border-bottom:20px;
}
.button{
background-color:#F7931E;
margin: 20px 20px;
}
.buttontext{
padding: 5px;
font-size: .8em;
}
.gobutton {width:70px; padding: 5px 0 0 0;}

/* Corner styles */

.t {background: url(/images/box-components/dot.gif) 0 0 repeat-x; height: 100%; width: 100%;}
.b {background: url(/images/box-components/dot.gif) 0 100% repeat-x; height: 100%; width: 100%;}
.l {background: url(/images/box-components/dot.gif) 0 0 repeat-y; height: 100%; width: 100%;}
.r {background: url(/images/box-components/dot.gif) 100% 0 repeat-y; height: 100%; width: 100%;}
.bl {background: url(/images/box-components/bl.gif) 0 100% no-repeat; height: 100%; width: 100%;}
.br {background: url(/images/box-components/br.gif) 100% 100% no-repeat; height: 100%; width: 100%;}
.tl {background: url(/images/box-components/tl.gif) 0 0 no-repeat; height: 100%; width: 100%;}
.tr {background: url(/images/box-components/tr.gif) 100% 0 no-repeat; height: 100%; width: 100%;}

.obl {background: url(/images/box-components/obl.gif) 0 100% no-repeat; height: 100%; width: 100%;}
.obr {background: url(/images/box-components/obr.gif) 100% 100% no-repeat; height: 100%; width: 100%;}
.otl {background: url(/images/box-components/otl.gif) 0 0 no-repeat; height: 100%; width: 100%;}
.otr {background: url(/images/box-components/otr.gif) 100% 0 no-repeat; height: 100%; width: 100%;}

.gbl {background: url(/images/box-components/gbl.gif) 0 100% no-repeat; height: 100%; width: 100%;}
.gbr {background: url(/images/box-components/gbr.gif) 100% 100% no-repeat; height: 100%; width: 100%;}
.gtl {background: url(/images/box-components/gtl.gif) 0 0 no-repeat; height: 100%; width: 100%;}
.gtr {background: url(/images/box-components/gtr.gif) 100% 0 no-repeat; height: 100%; width: 100%;}

.lgbl {background: url(/images/box-components/lgbl.gif) 0 100% no-repeat; height: 100%; width: 100%;}
.lgbr {background: url(/images/box-components/lgbr.gif) 100% 100% no-repeat; height: 100%; width: 100%;}
.lgtl {background: url(/images/box-components/lgtl.gif) 0 0 no-repeat; height: 100%; width: 100%;}
.lgtr {background: url(/images/box-components/lgtr.gif) 100% 0 no-repeat; height: 100%; width: 100%;}

/* ----- headers -----*/

.header_background div {height: 20px; background-color:#FF9900;}
	
.header_leftcorner {background: url(/images/box-components/otl.gif) top left no-repeat; padding: ;}

.header_rightcorner {background: url(/images/box-components/otr.gif) top right no-repeat; padding: ;}


.header_padding div.less,
  {
	padding-left: 5px !important;
	}


/* eNewsletter signup sidebar box */

#enews{
	width:140px;
	background-color: #F7931E;
	margin-top:20px;
}

#enews_inner {
	position:relative;
	padding:5px;
}
#enews_inner img {
	padding:10px;
}

.article {height:200px; width:100%; padding:10px 10px;}

/* Twitter feed styles */

#twitter_box { }
#twitter_box a.roll1 { background:url('') no-repeat top left; display:block; height:70px; width:170px; }

#linkedin_box { }
#linkedin_box a.roll2 { background:url('') no-repeat top left; display:block; height:70px; width:170px; }

a.rollover1 span {
    display:none;
}

/* Client box styles */

.portfolio_box {float:left; width:200px; height:250px; border: #CC6600 1px solid; margin: 20px 10px 20px 10px; padding: 10px 10px;}
.portfolio_box img {margin: 0 0 0 10px; border: #CCCCCC 1px solid; }

/* News box styles */

.news_box {padding: 10px 10px;}

/* Blog styles */

#sidebar {width:130px; margin-top:20px; }
#sidebar ul li {list-style-type:none;}
.section a {font-size: 1.2em; text-decoration:none; color:#FF9900;}
.section img {border:none;}

/********************* * CSS SUPPORT * *********************/

/* This is for any special formatting that can be applied to any element on any page and have it override the regular formatting for that item. For example, this might have things like: */

.float-right { float: right; }
.float-left { float: left; }
.float-center { margin-left: auto; margin-right: auto; }
.clear { clear: both; }
.clearfloat {clear:both; height:0; font-size: 1px; line-height: 0px;}
.clear-block { display: block; }
.clearer {clear: left; line-height: 0; height: 0;}
.text-left { text-align: left; }
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-justify { text-align: justify; }
.text-small {font-size: .9em;}
.text-smaller {}
.text-smallest {}
.error {color:#FF0000;}
.bold { font-weight: bold; }
.italic { font-style: italic; }
.underline { border-bottom: 1px solid; }
.nopadding { padding: 0; }
.nobullet { margin-left:10px; list-style: none; list-style-image: none; }

.border-top {background-image:url(images/grey_border_line.gif) repeat-X 100%}
.border-right {}
.border-bottom {background-image:url(images/grey_border_line.gif) repeat-X 0%}
.border-left {}

.margin_bottom { margin-bottom:10px;}
.margin_right { margin-right:5px;}

.centre {auto-margin:0; text-align:center;}
.orange_line { border: #F9A230 1px solid; }
.nodisplay {display:none; }
.grey_box {background:#CCCCCC; }
.orange_box {background:#FF9900; }
.box_inner {padding: 5px 5px;}
.spacer {content: "."; display: block; height: 0; clear: both; visibility: hidden;}