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

html, body  {
	padding: 0px;
	margin: 0px;
	background: #395b1e url(images/bg.gif) center top repeat-x;
	color: 262626;
	text-align: center top;
}

#main, #servicemain, #contactmain, #portfoliomain {
	margin:0 auto;
	width: 970px;
	position:relative;
	visibility:visible;	
}

#main { height: 890px;}
#servicemain { height: 1380px;}
#contactmain { height: 630px;}
#portfoliomain { height: 1150px;}

#logo {
	background: url(images/logo.gif) no-repeat;
	width: 980px;
	height: 118px;
	left: 0px;
	top: 0px;
}

a img {border: none; vertical-align: middle }

/*********** OPACITY *************************/
.toggleopacity img{
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
	filter:alpha(opacity=50); /* IE6 */
	-moz-opacity:0.5; /* FF2, FF3 */
	-khtml-opacity: 0.5; /* Safari */
	opacity: 0.5; /* FF2, FF3, Safari */
	border: none;
	float: left;
}

.toggleopacity:hover img{
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
	filter:alpha(opacity=100); /* IE6 */
	-moz-opacity:1; /* FF2, FF3 */
	-khtml-opacity: 1; /* Safari */
	opacity: 1; /* FF2, FF3, Safari */
	border: none;
	float: left;
}

.toggleopacity img{
	border: 1px solid #ccc;
	border: none;
	float: left;
}
/*********************************************/


#home a:hover, #about a:hover, #services a:hover, #contact a:hover {
	color: #fff;
}

#home a, #about a, #services a, #contact a {
	display: block;
	text-decoration: none;
	color: #262626;
	font-weight: bold;
}

#home, #about, #services, #contact {
	font: 15px/17px Georgia;
	text-align: left;
	visibility: visible;
	position: absolute;
	top: 40px;
	z-index: 1;
	height: 11px;
	font-weight: bold;
}

#home  { left: 125px;}
#about  { left: 230px;}
#services  { left: 665px;}
#contact  {	left: 786px;}

#topbox {
	background: url(images/topbox.gif);
	width: 876px;
	height: 315px;
	left: 43px;
	top: 129px;
	position: absolute;
	z-index: 1;
}

#headerpicture {
	background: url(images/headerpicture.jpg) no-repeat;
	width: 535px;
	height: 278px;
	left: 69px;
	top: 147px;
	position: absolute;
	z-index: 2;
}

h1 {
	color: #FFFFFF;
	width: 500px;
	height: 29px;
	left: 88px;
	top: 388px;
	position: absolute;
	margin: 0px;
	padding: 0px;
	font: 14px/1.1em tahoma,verdana,sans-serif;
	z-index: 3;
}

h2 {
	color: #000;
	font: 13px/1em arial,verdana,sans-serif;
	margin: 0px;
	padding: 5px 0 0 0;
	line-height: 0px;
}

p {
	margin: 0px 0px 5px 0px;
}

/************* top right content ******************/

#content1, #content2, #content3 {
	color: #262626;
	width: 172px;
	height: 57px;
	left: 724px;
	position: absolute;
	z-index: 5;
	font: 13px/1em arial,verdana,sans-serif;
	padding: 0px;
	margin: 0px;
}

#content1 {top: 161px }
#content2 {top: 256px }
#content3 {top: 352px }

#imgcontent1, #imgcontent2, #imgcontent3 {
	width: 80px;
	height: 68px;
	left: 629px;
	position: absolute;
	z-index: 6;
}

#imgcontent1 { background: url(images/ecommerce.gif) no-repeat; top: 157px;}
#imgcontent2 { background: url(images/wordpress.gif) no-repeat; top: 250px;}
#imgcontent3 { background: url(images/web_design.gif) no-repeat; top: 350px;}

.readmore a {
	color: #262626;
	width: 75px;
	height: 13px;
	left: 97px;
	position: absolute;
	font: 11px/1em arial,verdana,sans-serif;
	z-index: 7;
	padding: 3px 0 0 0;
}

#footertext a, a {	color: #262626; font: 14px/1em arial,verdana,sans-serif;}

.readmore a:hover, #footertext a:hover { color: #fff; }

a:hover {color: #395b1e }

/************* main content ******************/

#maincontentbox {
	background: url(images/maincontentbox.gif) no-repeat;
	color: #fff;
	width: 869px;
	height: 310px;
	left: 46px;
	position: absolute;
	top: 451px;
}

#maintext1, #maintext2 {
	color: #262626;
	height: 235px;
	top: 503px;
	position: absolute;
	font: 14px/1.3em arial,verdana,sans-serif;
	border-top: dashed thin; 
	border-bottom: dashed thin; 
	border-left: dashed thin; 
	border-right: dashed thin; 	
	padding: 7px;
	z-index: 1;
}

#maintext1 { left: 65px; width: 234px; text-align: left; }
#maintext2 { left: 333px; width: 205px}

ul {
	list-style-image:url(images/tick.gif); 
	margin: 0px 0 0 26px;
	padding: 0px;
	line-height: 1.2em; 
}

li {margin: 0px;
	padding: 0px;
	line-height: 1.2em; 
	}

/***********************************************/

#servicesbg, #contactbg, #portfoliobg {
	width: 869px;
	margin: 30px 0px 0px 46px;
}

#servicesbg { background: url(images/servicesbg.gif) no-repeat center; 	height: 1100px; }
#contactbg { background: url(images/contactbg.gif) no-repeat center; height: 350px; }
#portfoliobg { background: url(images/portfoliobg.jpg) no-repeat center; height: 1235px; }

#subcontent {
	font: 14px/1.3em arial,verdana,sans-serif;
	margin: 20px 0px 0px 50px;
	width: 740px;
	padding: 5px 0px 0px 0px;
}

#servicestitle, #portfoliotitle, #contacttitle {
	width: 181px;
	margin: 10px 0px 0px 0px;
	padding: 0;
}

#servicestitle {background: url(images/services.gif) no-repeat; height: 19px;}
#portfoliotitle { background: url(images/portfoliotitle.gif) no-repeat; height: 19px; }
#contacttitle { background: url(images/enquiriestitle.gif) no-repeat; height: 24px; }

.servicebox {
	background: url(images/servicebox.png) no-repeat;
	width: 325px;
	height: 225px;
	margin: 0px;
	padding: 10px 0 0 0;
	float: left;
}

.serviceboxtext {
	padding: 20px;
	margin: 0px;
}

#subbottomtext {
	padding: 0 0 0 200px;
	margin: 0px;
}

#subbottomtext2 { text-align: center; }

.portfoliobox{
	color: #262626;
	border-top: dashed thin; 
	border-bottom: dashed thin; 
	border-left: dashed thin; 
	border-right: dashed thin; 
	margin: 20px 0 0 0;
	padding: 20px;
	width: 740px;
}

.portfoliotext {
	margin: 10px 0 0 310px;
	padding: 0 0 0 10px;
}

/**********************************************************/

#title2 {
	background: url(images/whoweare.gif) no-repeat;
	width: 138px;
	height: 19px;
	left: 65px;
	top: 471px;
	position: absolute;
}

#mainleft {
	width: 225px;
	height: 241px;
	left: 83px;
	top: 508px;
	position: absolute;
}

#title3 {
	background: url(images/whatwedo.gif) no-repeat;
	width: 181px;
	height: 19px;
	left: 333px;
	top: 473px;
	position: absolute;
}

#mainmiddle {
	width: 228px;
	height: 241px;
	left: 335px;
	top: 508px;
	position: absolute;
}

#title4 {
	background: url(images/portfolio.gif) no-repeat;
	width: 86px;
	height: 41px;
	left: 690px;
	top: 490px;
	position: absolute;
	z-index: auto;
}

#mainright {
	background: url(images/mainrightbackround.gif);
	width: 380px;
	height: 389px;
	left: 545px;
	top: 460px;
	position: absolute;
}

#portfolioimg1 {
	left: 577px;
	top: 520px;
	position: absolute;
	border: hidden;
	z-index:1;
	border: none;
}


#portfolioimg2 {
	left: 577px;
	top: 620px;
	position: absolute;
	border: hidden;
	z-index:1;
	border: none;
}

#portfolioimg3 {
	left: 577px;
	top: 720px;
	position: absolute;
	border: hidden;
	z-index:1;
	border: none;
}

#footerbox {
	background: url(images/footerbox.gif) no-repeat;
	width: 868px;
	height: 111px;
	left: 46px;
	position: absolute;
	top: 770px;
}

#subfooterbox {
	background: url(images/footerbox.gif) no-repeat center;
	width: 868px;
	height: 111px;
	margin: 15px 0 0 46px;
	padding: 0;
	text-align:center;
}

#footertexthome {
	padding: 10px 0 0 75px;
	font: 14px/1em arial,verdana,sans-serif; color: 262626;
}

#footertext {
	padding: 10px 0 0 0px;
	font: 14px/1em arial,verdana,sans-serif; color: 262626;
}

#footertags {
	text-align: center;
	padding: 10px 0 0 0;
	font: 14px/1em arial,verdana,sans-serif; color: 262626;
}