/* 
Title: Master style sheet for TreeVaello.com v 1.0
Author: John Bossley
Updated: 01/14/2007
*/




/* ----------------------------------------------------------
Setting up main content areas
-------------------------------------------------------------*/
#logo { 
	behavior: url(iepngfix.htc)
	} 

	body {
	  font-family: Arial, Helvetica, sans-serif;
	  padding: 0;
	  margin-top: 15px;
	  margin-bottom: 15px;
	  background-image:  url("../images/bg.gif");
	  background-repeat: repeat-x repeat-y;
	  background-position: left top;
	  }

	#container {
	  width: 810px;
	  height: 100%;
	  margin-bottom: 0;
	  margin-top: 0;
	  margin-left:auto;
	  margin-right:auto;
	  background: none;
	  }


	#header {
	  width: 810px;
	  height: 80px;
	  vertical-align: top;
	  margin: 0 auto;
	  padding: 0;
	  background: url(../images/bg_top.gif) no-repeat bottom left;
	  }

	#logo {
	  width: 395px;
	  height: 65px;
	  vertical-align: top;
	  float: left;
	  padding: 0 0 0 0;
	  background: url(../images/logo.png) no-repeat;
	  }

	#content {
	  width: 810px;
	  height: 33.2em;
	  background: url(../images/bg_center.gif) repeat-y;
  	  }
	  

/* -----------------------------------------------------------------------------------------------
    NAVIGATION
--------------------------------------------------------------------------------------------------*/

#navbar {
	width: 780px;
	height: 45px;
	margin: 0 0 0 13px;
	background: url(../images/bg_nav.gif) repeat-x;
	}
	  
#navbar ul {
	height: 45px;
	margin: 0 auto;
	padding: 0;
	}
	
#navbar li {
	float: left;
	list-style: none;
	margin: 0; 
	padding: 12px 0 12px 0;
	background: url(../images/nav_divider.gif) no-repeat;
	}

#navbar li a {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #3f3f3f;
	font-size: 1.1em;
	font-weight: normal;
	text-decoration: none;
	text-transform: uppercase;
	padding: 12px 18px 12px 17px;
	}

#navbar li a:hover {
	color: #e9d5da;
	background: url(../images/nav_over_bg.gif) repeat-x;
	}

#navbar li a.active {
	color: #e9d5da;
	text-decoration: underline;
	background: url(../images/nav_over_bg.gif) repeat-x;
	}
	
.navDivider {
	margin: 0 auto;
	float: left;
	vertical-align: top;
	}
	
	
/* -----------------------------------------------------------------------------------------------
    MAIN CONTENT AREA
--------------------------------------------------------------------------------------------------*/	
	
  	#subContent {
	  width: 390px;
	  height: 30em;
	  float: left;
	  vertical-align: bottom;
	  background-color: #000;
	  margin: 0;
	  }
	  
	  #subContent ul {
	  	font-size: .75em;
	  	color: #fff;
		list-style: none;
		margin: 10px 0 10px 25px; padding: 0;
		}
		
		#subContent li {
		  margin: 2px 0 2px 0; padding: 0;
		  }
		
	  
	  
/*-------------------------------------------------------------
Home Page Setup
--------------------------------------------------------------*/

#homeSidebar {
	width: 780px;
	height: 485px;
	float: right;
	position: relative;
	top: 0px; left: -17px;
	margin: 0;
	background: url(../images/home_image.jpg) no-repeat right bottom;
	}

	  
#highlightBox {
	width: 330px;
	height: 8.4em;
	margin: 15px 0 0 25px;
	padding: 0;
	background: url(../images/hightlight_box_bg.gif) repeat-x bottom #484848;
	border-width: 4px;
	border-color: #242424;
	border-style: solid;
	}

#highlightImage {
	width: 107px;
	height: 107px;
	border-width: 3px;
	border-style: solid;
	border-color: #fff;
	margin: 8px 0 0 8px;
	float: left;
	}
	
* html #highlightImage {
	margin: 8px 0 0 4px;
	}
	
#highlightTextBox {
	width: 200px;
	height: 30px;
	margin: -24px 0 0 5px;
	float: left; 
	}
	
* html #highlightTextBox {
	margin: 4px 0 0 5px;
	}
	
.highlightText {
	font-family: Arial, Helvetica, sans-serif;
	color: #fff;
	font-size: .65em;
	font-weight: normal;
	margin: 0px 10px 0 10px;
	padding: 0;
	line-height: 1.2em;
	}


/* Bio page setup
-----------------------------------------------------------*/

#bioSidebar {
	width: 780px;
	height: 485px;
	float: right;
	position: relative;
	top: 0px; left: -17px;
	margin: 0;
	background: url(../images/bio_image.jpg) no-repeat right bottom;
	}

/* Contact page setup
-----------------------------------------------------------*/

#contactSidebar {
	width: 780px;
	height: 485px;
	float: right;
	position: relative;
	top: 0px; left: -17px;
	margin: 0;
	background: url(../images/contact_image.jpg) no-repeat right bottom;
	}
	  
label{
	float: left;
	width: 120px;
	margin: 15px 0 0 25px;
	font-weight: bold;
	}

textarea {
	width: 355px;
	height: 150px;
	color: #3f3f3f;
	margin: 0 0 10px 25px;
	}

.textAreaInput {
	background-color: #fff;
	font-family: Arial, Helvetica, sans-serif;
	size: .65em;
	}

input {
	width: 265px;
	background-color: #fff;
	margin: 0 0 10px 25px;
	padding: 1px;
	border: 1px solid #8595B2;
	}

.comments {
	width: 350px; height: 100px;
	background-color: #fff;
	margin: 0 0 10px 25px;
	padding: 1px;
	border: 1px solid #8595B2;
	}
	
.inputText {
	font-family: Arial, Helvetica, sans-serif;
	size: .65em;
	color: #3f3f3f;
	}


.submit {
	margin: 5px 10px 0 0;
	width: 77px;
	height: 25px;
	float: right;
	background: none;
	border: none;
	}

br{
	clear: left;
	}

/* Gallery page setup
-----------------------------------------------------------*/	
	
#galContainer {
	width: 780px;
	height: 485px;
	float: right;
	position: relative;
	top: 0px; left: -17px;
	margin: 0;
	}
	  
.galImageBox {
	  width: 161px;
	  height: 75px;
	  border-width: 4px; border-color: #F0E7E8; border-style: solid;
	  background-color: #F0E7E8;
	  margin: 0 auto;
	  float: left;
	  text-align: center;
	  }
	  
.galImageBoxFirst {
	  width: 161px;
	  height: 75px;
	  border-width: 4px; border-color: #F0E7E8; border-style: solid;
	  background-color: #F0E7E8;
	  float: left;
	  text-align: center;
	  margin: 0px 0 0px 20px;
	  _margin: 0 0 0 10px; /* bug - Fixes margin for IE */
	  }

	  
.galImageDivider {
	  width: 20px;
	  height: 96px;
	  border-width: 0px;
	  background-color: #000;
	  margin: 0px 0 0px 0;
	  float: left;
	  text-align: center;
	  }
	  
.clearboth {
	  clear: both;
	  }

#btnContainer {
	width: 760px;
	height: .9em; 
	margin: 5px 10px 10px 10px;
	}
	
.nextButton {
	  width: 104px;
	  height: 25px;
	  border: none;
	  float: right;
	  margin: 0 12px 0 10px;
	  }
	  
.prevButton {
	  width: 96px;
	  height: 25px;
	  border: none;
	  float: left;
	  margin: 0 0 0 10px;
	  }

a.galLink {
	font-family: Arial, Helvetica, sans-serif;
	color: #3f3f3f;
	font-size: .65em;
	font-weight: normal;
	text-decoration: none;
	text-align: center;
	}
	
a.galLink:hover {
	color: #3f3f3f;
	text-decoration: underline;
	}
	
a.next {
	font-family: Arial, Helvetica, sans-serif;
	color: #e9d5da;
	font-size: .65em;
	font-weight: normal;
	padding: 0;
	text-decoration: none;
	text-align: center;
	}
	
a.next:hover {
	color: #FFF;
	text-decoration: none;
	}

/* -----------------------------------------------------------------------------------------------
    CLIENTS
--------------------------------------------------------------------------------------------------*/
#clientWrapper {
	width: 780px;
	height: 485px;
	float: left;
	position: relative;
	top: 0px; left: -17px;
	margin: 0;
	_margin: 0 0 0 15px;
	}

#clientHeadingDiv {
	float: left;
	width:: 780px;
	height: 40px;
	padding: 0;
	}

#column, #column2, #column3, #column4 { 
	float: left;
	width: 163px;
	margin: 15px 0 10px 25px;
	_margin: 15px 0 10px 0px;
	}
		
#column ul {
  	margin: 0 0 15px 25px;
  	padding: 0;
	list-style-type: none;
	}

#column li{
	font-family: Arial, Helvetica, sans-serif;
	font-size: .7em;
	color: #fff;
	line-height: 1.2em;
	margin: 0;
	padding: 0;
	}

.divider li {
	margin: 0;
	}
.catTitle {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #E9D5DA;
	size: 1.5em;
	font-weight: bold;
	margin: 0 0 5px 25px;
	}

.catTitleTop {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #E9D5DA;
	size: 1.5em;
	font-weight: bold;
	margin: 0 0 5px 25px;
	}

/* -----------------------------------------------------------------------------------------------
    LINKS
--------------------------------------------------------------------------------------------------*/	
	
#linksSidebar {
	width: 780px;
	height: 485px;
	float: right;
	position: relative;
	top: 0px; left: -17px;
	margin: 0;
	background: url(../images/link_image.jpg) no-repeat right bottom;
	}
/* -----------------------------------------------------------------------------------------------
    FOOTER
--------------------------------------------------------------------------------------------------*/

#footer {
	width: 790px;
	height: 15px;
	float: left;
	margin: 0;
	padding: 5px 20px 0 12px;
	_padding: 15px 20px 0 12px;
	background: url(../images/bg_bottom.gif) no-repeat;
	}

*:first-child+html #footer { padding: 15px 20px 0 12px; }
	
a.myLink {
	font-family: Arial, Helvetica, sans-serif;
	color: #3f3f3f;
	text-decoration: none;
	}
	
a.myLink:hover {
	color: #3f3f3f;
	text-decoration: underline;
	}

.copyright p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #3f3f3f;
	float: left;
	padding: 0;
	}

.weblink p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #3f3f3f;
	float: right;
	padding: 0;
	}
.weblink a:link, a:active {
	color: #3f3f3f;
	text-decoration: none;
	}
	
.weblink a:hover {
	color: #3f3f3f;
	text-decoration: underline;
	}
	
.weblink img {
	vertical-align:middle;
	padding: 0 10px 0 5px;
	}

/* ----------------------------------------------------------- 
TEXT
-------------------------------------------------------------*/

h1 {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #E9D5DA;
	font-size: 1.3em;
	font-weight: normal;
	margin: 25px 0 0 25px;
	}
	
h2 {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #E9D5DA;
	font-size: 1.6em;
	font-weight: normal;
	padding: 8px 0 0 8px;
	margin: 25px 0 10px 0;
	_margin: 0 0 10px 0;
	}

h3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #E9D5DA;
	font-size: 1.85em;
	font-weight: normal;
	padding: 0;
	}
	
.genericText {
	font-family: Arial, Helvetica, sans-serif;
	color: #fff;
	font-size: .75em;
	font-weight: normal;
	margin: 0 0 0 25px;
	padding: 0;
	line-height: 1.5em;
	}
	
a.linkSmall {
	font-family: Arial, Helvetica, sans-serif;
	color: #e9d5da;
	font-size: .65em;
	font-weight: normal;
	padding: 10px 0 0 10px;
	text-decoration: none;
	}
	
a.linkSmall:hover {
	color: #FFF;
	text-decoration: underline;
	}
	
a.linkGen {
	font-family: Arial, Helvetica, sans-serif;
	color: #e9d5da;
	font-size: .75em;
	font-weight: normal;
	padding: 5px 0 0 25px;
	text-decoration: none;
	}
	
a.linkGen:hover {
	color: #FFF;
	text-decoration: underline;
	}