@charset "UTF-8";
body {
	margin: 0px;
	padding: 0px;
 	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #6f635e;
	font-size: 0.85em;
}

/*container will centre the website*/

#container { margin-left: auto;
			margin-right: auto;
			width:996px;
}


/*general styles*/

.thumbs {width:80px; 
height: 80px;
}

p { font-size:1.1em;}



.br { clear: both;
}

ul, li { margin:0px;
		padding:0px;
}

h1, h2, h3, h4, h5, h6  {
	font-family: Georgia, "Times New Roman", Times, serif;
	margin:10px 0px 4px 0px;
}

h1.large { font-size: 2.2em;
	font-weight: lighter;
}



h1 {font-size: 1.5em;
 	font-weight: bold;
}

h2 {font-size: 1.5em;
 	font-weight: bold;
}

h3, h4, h5, h6{font-size: 1.2em;
		font-weight: bold;
		margin-bottom:4px;
}

h3 + p { margin-top:0px;
}

.orange { color:#d36733;
}

a:link, a:visited {color:#d36733;
		text-decoration: underline;
}

a:hover { color:#6f635e;
}

img { border: 0; }

img.top {
	border: 0;
	vertical-align: top;
}

address {
	font-style: normal;
}

/*Thin Martian page styles*/

iframe { border: dotted;
		border-color:#897A72;
}

.illustrations { border: none;
}

.tm-left { width:200px;
			float: left;
			font-size:0.9em;
}

.tm-right {
	width:320px;
	float: right;
	color:#000000;
	text-align: right;
	font-size:0.9em;
}

.tm-right li {
	display: inline;
	list-style-type: none;
	margin-right: 6px;
	font-size:0.9em;
}

.tm-right li a { background-color: #FFFFFF;
				padding-left:0px;
				padding-right:3px;
				padding-top:5px;
				padding-bottom:5px;
				font-weight:bold;
}

.tm-right li.over a { 	color:#000000;
						font-weight: normal;
}

.tm-right li.over a:hover { color: #D36733;
						font-weight: normal;
}

/*form styles*/

fieldset {
	background-color: #f9f6f4;
	border: 1px solid #ded6d2;
	padding: 0px 10px 10px 20px;
	width: 650px
	
}

label { display:block;
}

label.tick { 
			display:inline;
}

input.tick { width: 20px;
}

input { width: 300px;
}

textarea { width:400px;
			height: 80px;
}

input.checkbox, input.radio, input.submit {
width:auto;
}

input.checkbox { float:left;
				margin-right: 1em;
}




/*top section*/
#top { width:996px;
		float:left;
			
}

/*horizontal lines - general styles for all

.brownbar, .brownbar-two, .brownbar-left  {
	background-color:#635752;
	float:left;
	margin:0px;
	padding:0px;
}


.creambar, .creambar-two { width: 277px;
			background-color:#ded6d2;
			float:right;
			margin:0px;
			padding:0px;
}*/


/*horizontal lines - home

.brownbar { height: 7px;
			width: 700px;
}


.creambar { height: 7px;
}*/

/*horizontal lines - two columns single

.brownbar-two  { height: 3px;
				width: 700px;
}


.creambar-two { height: 3px;
}

*/
/*top navigation*/

#nav {
	width: 700px;
	float:left;
	padding: 50px 0px 0px 0px;	
}

#nav ul{
margin: 0;
text-align: left; /*set value to "left", "center", or "right"*/
}


#nav li {
	list-style-type: none;
	display: inline;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.6em;
	font-weight: lighter;
	margin-right: 18px;	
}

#nav li a {
	color: #6f635e;
	border-bottom: 3px solid transparent; /*bottom border is 3px*/
	text-decoration:none;

}


#nav ul li a:hover {
border-bottom-color: #6f635e;
}

#nav ul li.active a{
border-bottom-color: #d36733;
}

/* endtop navigation*/

#logo { width: 277px;
		float:right;
		padding: 28px 0px 35px 0px;
}


/* banners*/
#banner {
	width:996px; /*for java script*/
	height:291px;
	float: left;
	overflow: hidden;
	background-color:#635752;
}

/* main*/
#main, #mainleft {
width: 680px;
	float:left;
	margin: 0px 20px 0px 0px;
}


#main a:hover, #mainleft a:hover { color:#6f635e;
			background-color:#ded6d2;
			text-decoration:none;
}

#main img.image {float: left;}

/* right col*/
#rightcol { width: 267px;
			float:right;
			margin: 0px 0px 0px 10px;
}

#rightcol li, #main li, #mainleft li {
	list-style-position: inside;
	list-style-image: url(images/icon-bullet.gif);
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.3em;
	line-height: 1.55em;

}

#rightcol li a, #main li a, #mainleft li a { text-decoration: none;
 				color:#6f635e;

}

#rightcol li a:hover, #main li a:hover, #mainleft li a:hover  {color:#d36733;}

#rightcol li.active a{
					color: #d36733;
					
}

#estimate
{
	display: block;
	width: 210px;
	height: 45px;
	background-image: url(images/button-estimate.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
}

#estimate:hover
{ 
  background-position: 0 -45px;
}

#estimate span
{
  display: none;
}

/* footer*/

#footer {
	font-size:0.9em;
	display: block;
		
}

#footer a {	text-decoration:none;
			color:#6f635e;
}

#footer a:hover {	text-decoration:none;
					color:#d36733;
}

#footer-left  {
	width:704px;
	float:left;
	background-image: url(images/footer-long-web-designer.gif);
	background-repeat: no-repeat;
	height:55px;
	text-align: center;
	padding: 10px 0px 20px 0px;	
}

#footer-right  {
	width: 280px;
	float:right;
	background-image: url(images/footer-short-web-designer.gif);
	background-repeat: no-repeat;
	height:55px;
	text-align: center;
	padding: 10px 0px 20px 0px;	
}






/* START two columns with 2nd navigation styles*/


#leftcol { width: 166px;
			float:left;
			margin: 0px 20px 0px 0px;
}

#leftcol li {
	list-style-position: inside;
	list-style-image: url(images/bullet_sm.gif);
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.2em;
	line-height: 1.45em;

}

#leftcol li a { text-decoration: none;
 				color:#6f635e;
				padding:3px;	

}

#leftcol li a:hover {color:#d36733;}

#leftcol li.active a{
	color: #fff;
	background-color: #6f635e;	
	padding:3px;				
}

/* 2 cols with left nav mainright*/
#mainright {
width: 805px;
	float:right;
	margin: 0px 0px 0px 0px;
}


#mainright a:hover { color:#6f635e;
			background-color:#ded6d2;
			text-decoration:none;
}

#mainright img.image {float: left;}


/*horizontal lines - two columns - second nav on left

.brownbar-left  { height: 3px;
				width: 171px;
}

.brownbar-right  { height: 3px;
			width: 805px;
			float: right;
			background-color:#635752;
			margin:0px;
			padding:0px;
}*/

/* END two columns with 2nd navigation styles*/

/* START three columns with 2nd navigation styles*/

#main-centre {
width: 520px;
	float:left;
	margin: -3px 0px 0px 0px;

}

#main-centre img.image {float: left;}

#main-rightcol { width: 272px;
	float:right;
	padding: 0px 0px 0px 5px;
}

/* START portfolio homepage*/
.portfolio-box {
	width:247px;
	min-height:32px;
	padding:5px;
	background-image: url(images/brown-bg.gif);
}

.portfolio-text {
	color:#fff;
	width:220px;
	min-height:24px;
	float:left;
	
}
.portfolio-text img {
	float: right;
	height: 23px;
	width: 26px;
	float:right;
	background-color:#635752;
}


#port-leftcol, #port-midcol, #port-rightcol { width: 257;
											padding:10px 15px 20px 0px;
											
}

#port-leftcol { float:left;
}

#port-midcol { float:left;
}

#port-rightcol { float:right;
					padding-right:0px;
}

.pad { padding:1px;
		margin:0px;
}

#arrow
{
	display: block;
	width: 26px;
	height: 23px;
	background-image: url(images/arrow-portfolio2.gif);
	background-repeat: no-repeat;
	background-position: 0 0;
	
	float: right;
	height: 23px;
	width: 26px;
	float:right;
	background-color:#635752;
}

#arrow:hover
{ 
  background-position: 0 -23px;
}