@charset "utf-8";

#container {
	width: 890px;
	margin: 0 auto;
	text-align: left; /* this overrides the text-align: center on the body element. */
	padding:0;
} 
#twbhome #header {
	width: 886px;
	height: 405px;
	padding-top: 0;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 20px;
	margin: 0 auto;
	text-align: left;
} 

#twbabout #header, #twbservices #header, #twbportfolio #header, #twbcontact #header {
	width: 886px;
	height: 134px;
	padding-top: 0;
	padding-right: 10px;
	padding-bottom: 0;
	padding-left: 20px;
	margin: 0 auto;
	text-align: left;
}

#header h1 {
	margin: 0; /* zeroing the margin of the last element in the #header div will avoid margin collapse - an unexplainable space between divs. If the div has a border around it, this is not necessary as that also avoids the margin collapse */
	padding: 10px 0; /* using padding instead of margin will allow you to keep the element away from the edges of the div */
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
.twbLogo {
	float: left;
	margin-top: 32px;
}
.feature {
	clear: both;
	color: #FFFFFF;
	width: 858px;
	margin: 38px 0 0 0;
	padding: 0 0 0 31px;
	height: 274px;
	float:left;
	position:relative;
}

.feature p {}


#sidebar1 {
	float: left; 
	width: 420px; 
	padding: 28px 0 0 0;
	text-align: left;
	vertical-align: top;
	margin:0 0 10px 0;
}
#sidebar2 {
	float: right;
	width: 170px;
	padding: 28px 10px 0px 10px;
	text-align: left;
	vertical-align: top;
}

#sidebar2services {
	float: right;
	width: 300px;
	padding: 28px 10px 0px 10px;
	text-align: left;
	vertical-align: top;
}

#mainContent { 
	margin: 0 200px 0 460px;
	padding: 28px 10px 0 10px;
} 

#sidebar2.portfolioright {width:430px;  padding-top:48px; margin-bottom:40px;}
#sidebar1.portfolioleft {width:430px; margin-bottom:40px;}

#sidebar2.servicesright {width:300px;}
#sidebar1.servicesleft {width:490px;}

#footer {
	background-color: #f5fceb;
	height: 145px;
	width: 875px;
	padding: 10px;
	border: 1px dotted #333333;
	font-size: 80%;
	color: #62655e;
	margin: 0 auto 20px auto;
} 
#footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}

.footerC {
	width:170px;
	float:left;
	margin:0 25px 0 0;
	text-align: left;
}
.copyright {
	width:250px;
	float:left;
	margin-top: 25px;
	text-align: right;
	font-size: 90%;
}
.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}


/* Home styles */

#sidebar1Home {
	float: left; 
	width: 239px; 
	padding: 15px 0 0 0;
	text-align: left;
	vertical-align: top;
	margin:0;
}
#sidebar2Home {
	float: right;
	width: 359px;
	padding: 28px 10px 0px 10px;
	text-align: left;
	vertical-align: top;
}

#mainContentHome { 
	margin: 0 390px 0 253px;
	padding: 28px 10px 0 10px;
} 

.f-left 	{ float:left; width:350px;}

.f-right 	{ float:right; width:400px; margin:5px 1px 0 0;}

.jsclass body .randomcontent{ /*Do NOT remove! CSS to hide random contents in JS enabled browsers*/
display: none;
}


.f-caption {clear:both; display:block; margin:20px 0 0 0;}

.f-text {
	float:left;
	width:280px;
	font-size: 80%;
	font-weight: bold;
}

img.splat {
	position: absolute;
	top: -59px;
	right: -18px;
}

.Hservices {

	background-image: url(../images/services-bk.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	height: 207px;
	width: 219px;
	padding:13px 10px 10px 10px;
	margin:0;
}

.Hnews {
	width: 217px;
	padding:0px;
	margin:0;
}

.Hnews p{
	font-size: 75%;
}

.Hquote {
	background-image: url(../images/h-bubble.gif);
	background-repeat: no-repeat;
	background-position: left top;
	height: 125px;
	width: 202px;
	padding: 15px 15px 20px 15px;
	margin: 15px 0 0 0;
	float:left;
}

.Hquote p{
	padding: 0;
	margin: 0;
	font-size: 75%;
	line-height:150%;
}

.HquoteSub {
	background-image: url(../images/h-bubble-sub.gif);
	background-repeat: no-repeat;
	background-position: left top;
	height: 113px;
	width: 176px;
	padding: 22px 5px 25px 10px;
	margin: 15px 0 0 0;
	float:left;
}

.HquoteSub p{
	padding: 0;
	margin: 0;
	font-size: 75%;
	line-height:140%;
}

.Hpic {
	float:right;
	height: 98px;
	width: 120px;
	margin:140px 5px 0 0;
}

p.indent{	text-indent: 26px;}

p.customername {display:block; margin: 40px 0 0 0; padding:0;}

p.customername img{margin: 0 0 0 4px;}

p.customernameSub {display:block; margin: 35px 0 0 38px; padding:0;}

p.customernameSub img{margin: 0 0 0 5px;}

/* list items */

ul.services { margin-top:12px; }

ul.services li {
	list-style-image: url(../images/tick.gif);
	list-style-type: none;
	margin:0 0 5px -20px;
	padding:2px 0 2px 0;
	font-size: 75%;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #999999;
}

ul.footerlist li {
	list-style-image: none;
	list-style-type: none;
	margin:0 0 2px -38px;
	padding:0;
	font-size: 90%;
}

h2.serHome {
	padding:1px 0 1px 0;
	margin:0;
	font-weight: normal;
}

h2.intro {
	font-size: 90%;
	line-height: 140%;
	font-weight: normal;
	margin-bottom:18px;
}

#sidebar1 a.norm, #sidebar1Home a.norm {
	color: #181818;
	text-decoration:none;
}

#sidebar2 ul {}
#sidebar2 li {
	list-style-image: none;
	list-style-type: none;
	margin:0 0 8px -38px;
	font-size: 85%;
}
#sidebar2 li a, a:link, #sidebar2 li a:visited {
	color: #666666;
	text-decoration: none;
}

#sidebar2 li a:hover, #sidebar2 li a:active {
	color: #333333;
	text-decoration: none;
}
/* image links */

a.quote, a:link.quote, a:active.quote, a:visited.quote {
	width:140px;
	height:44px;
	background-image: url(../images/getintouch.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
}

a:hover.quote {
	background-image: url(../images/getintouch.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}

a.portfolio, a:link.portfolio, a:active.portfolio, a:visited.portfolio {
	width:94px;
	height:35px;
	background-image: url(../images/portfolio.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
	float:right;
}

a:hover.portfolio {
	background-image: url(../images/portfolio.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}

a.signup, a:link.signup, a:active.signup, a:visited.signup {
	width:52px;
	height:22px;
	background-image: url(../images/signup.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 5px 0 0 0;
	padding: 0px;
	float:left;
}

a:hover.signup {
	background-image: url(../images/signup.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}

a.send, a:link.send, a:active.send, a:visited.send {
	width:52px;
	height:22px;
	background-image: url(../images/send.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 5px 0 0 0;
	padding: 0px;
	float:left;
}

a:hover.send {
	background-image: url(../images/send.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}

a.how-it-works, a:link.how-it-works, a:active.how-it-works, a:visited.how-it-works {
	width:200px;
	height:14px;
	background-image: url(../images/headings/how-it-works2.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	padding: 0px;
	float:left;
	margin: 0;
}

a:hover.how-it-works {
	background-image: url(../images/headings/how-it-works2.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
}

/* Headers */

h1.we-design {
	background-image: url(../images/headings/we-design.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	height: 27px;
	width: 270px;
	margin:0;
	padding:0;
}

h3.twb {
	width:165px;
	height:25px;
	background-image: url(../images/headings/twb.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	display: block;
	margin: 0px;
	padding: 0px;
}
h3.newsletter {
	width:165px;
	height:25px;
	background-image: url(../images/headings/newsletter.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	display: block;
	margin: 0px;
	padding: 0px;
}
h3.contact {
	width:165px;
	height:25px;
	background-image: url(../images/headings/contact.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	display: block;
	margin: 0px;
	padding: 0px;
}

h3.HCservices {
	width:200px;
	height:20px;
	background-image: url(../images/headings/hservices.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
}

h3.HCnews {
	width:200px;
	height:20px;
	background-image: url(../images/headings/hnews.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
}

h3.HCtest {
	width:200px;
	height:20px;
	background-image: url(../images/headings/testimonials.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
}

h3.HCport {
	width:160px;
	height:20px;
	background-image: url(../images/headings/portfolio-s.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
}

h3.HCrecently {
	width:280px;
	height:20px;
	background-image: url(../images/headings/recently.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
}

h3.HCnotforget {
	width:280px;
	height:20px;
	background-image: url(../images/headings/notforgetting.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 30px 0 0 0px;
	padding: 0px;
}

h3.HCprod {
	width:160px;
	height:20px;
	background-image: url(../images/headings/projects.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
}

h1.HCabout-s {
	width:200px;
	height:20px;
	background-image: url(../images/headings/about-us-s.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
}

h1.HCservices-s {
	width:200px;
	height:20px;
	background-image: url(../images/headings/services-s.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
}

h1.HCprint-s {
	width:200px;
	height:20px;
	background-image: url(../images/headings/print-design.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
}

h1.HCportfolio-s {
	width:200px;
	height:20px;
	background-image: url(../images/headings/portfolio-s.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
}

h1.HCcontact-s {
	width:200px;
	height:20px;
	background-image: url(../images/headings/contact-s.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
}


h3.HCwhatour {
	width:300px;
	height:20px;
	background-image: url(../images/headings/hwhatour.gif);
	background-repeat: no-repeat;
	background-position: left top;
	display: block;
	margin: 0px;
	padding: 0px;
}


/* Contact Form */

.contactform {
	padding:10px 10px 10px 0;
	font-size: 90%;
}
.contactform td{
	padding:3px 0px 3px 0;
	text-align: left;
	vertical-align: top;
}
.textbox {
	border: 1px dotted #333333;
	background-color: #f5fceb;
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	color: #666666;
	width: 250px;
}

.formStyle {margin:0;}
/* Portfolio column */

ul.portCol {
	margin-left:0;
	margin-right:0px;
	margin-top:13px;
	padding:0;
	list-style-type: none;
}

ul.portCol li {
	padding:0 0 0 40px;
	margin:0;
	list-style-type: none;
}

.portCol img {
	padding:5px;
	border: 1px solid #CCCCCC;
}


.recently {
	float: left;
	height: 34px;
	width: 178px;
	background-repeat: no-repeat;
	background-position: left top;
	text-align: left;
	vertical-align: top;
	font-size: 70%;
	font-weight: bold;
	margin:0;
	padding-top: 54px;
	padding-right: 10px;
	padding-bottom: 7px;
	padding-left: 92px;
	color: #656565;
}

/* Services */
#Re-com-serv {background-image: url(../images/services/e-commerce.jpg);margin-top:8px;}
#Re-com {background-image: url(../images/services/e-commerce.jpg);margin-top:15px;}
#Rprint-serv {background-image: url(../images/services/print.gif);margin-top:15px;}
#Rprop {background-image: url(../images/services/property.jpg);margin-top:8px;}
#Rsports {background-image: url(../images/services/sports.jpg);margin-top:8px;}
#Rfinance {background-image: url(../images/services/finance.jpg);margin-top:8px;}



.hov {display:inline; text-decoration:none;}

.hov table {position:absolute; border:0; border-collapse:collapse; left:0;}
.hov a {color:#000;text-decoration:none;font-size: 75%; margin:0 2px; padding:0; display:inline;}
.hov b {display:none; text-decoration:none; font-weight:normal;font-size: 12px;}
.hov:hover {position:relative; z-index:100;}
.hov a:hover,
.hov:hover a
{border:0; text-decoration:none; position:relative;font-size: 75%;}
.hov:hover b, 
.hov a:hover b
{display:block; visibility:visible; text-decoration:none; position:absolute; left:40px; top:1em; background:#f5fceb; cursor:pointer; border: 1px dotted #333333; padding:8px 14px;}
.hov b a {white-space:nowrap; color:#000; text-decoration:none; background:transparent; display:inline;}
.hov b a:hover {text-decoration:none;}

.clear {clear:both;}



.newsitem {	
	margin:20px 0;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #666666;}
	
p.date {
	margin:0;
	padding:0;
	font-style: italic;
	color: #666666;
	font-size: 80%;
}

/* tag cloud */

#sidebar2services ol.tags-cloud {width:300px;	float: right;
	margin: 20px 0 40px 0;
	padding:0;}

#sidebar2services ol.tags-cloud  {
	 margin: 0.5em;
}

#sidebar2services ol.tags-cloud li  {
	margin:0;
	padding: 0 3px;
	display: inline;
}

#sidebar2services ol.tags-cloud span  {
	width: 300px;
}

#sidebar2services ol.tags-cloud  {
	text-align:center;
	font-size: 0.75em;
	font-size: 1.1em;
}

#sidebar2services ol.tags-cloud .weight_10 {
	font-size:200% !important;
}

#sidebar2services ol.tags-cloud .weight_9 {
	font-size:186%;
}

#sidebar2services ol.tags-cloud .weight_8 {
	font-size:172%;
}

#sidebar2services ol.tags-cloud .weight_7 {
	font-size:158%;
}

#sidebar2services ol.tags-cloud .weight_6 {
	font-size:144%;
}

#sidebar2services ol.tags-cloud .weight_5 {
	font-size:130%;
}

#sidebar2services ol.tags-cloud .weight_4 {
	font-size:116%;
}

#sidebar2services ol.tags-cloud .weight_3 {
	font-size:102%;
}

#sidebar2services ol.tags-cloud .weight_2 {
	font-size: 90%;
}

#sidebar2services ol.tags-cloud .weight_1 {
	font-size: 83.5%;
}

#sidebar2services ol.tags-cloud a,  ol.tags-cloud a:visited,  oltags-cloud a:active  {
	color: #83a425;
	text-decoration: none;
}

#sidebar2services ol.tags-cloud a:hover  {
	text-decoration:none;
	color: #000;
}


/* plain list tags */



#sidebar2services ol.tags-plain  {
	 margin: 1em;
}

#sidebar2services ol.tags-plain li {
	margin-bottom: 0.3em;
	list-style: disc;
}

#sidebar2services ol.tags-plain li a {
	color: #83a425;
	text-decoration: none;

}

#sidebar2services ol.tags-plain li a:hover {
	color: #000;
	text-decoration: underline;
}


/* tag controls */

#tag-controls {
	margin: 16px 14px 0 0;
	position: absolute;
	right: 0;
	top: 0;
}	

#tag-controls li {
	padding: 3px;
	float: left;
}


#tag-controls li a {
	text-decoration: underline;
}

#tag-controls li a:hover {
	text-decoration: none;
	color: #000;
}

#tag-controls li.active a {
	font-weight: bold;
}

.formbox {width: 170px; margin:0; padding:0;}

.archive { font-size:80%;}

.archive td {
	text-align: left;
	vertical-align: bottom;
}
