body {	
	margin:5px 0px 0px 0px;
	background-color: #FFF;
	font-family: Arial, Helvetica, sans-serif;
	font-size:small;	
	color: #666;
}
html > body {
	font-size:medium;
}
#page {	
	text-align:center;	
	margin: 0 auto;	
}
a { text-decoration:none; }

#header {	
	width:100%;
	height: 110px;
	display:inline;
}
#header img { display:inline; }
div#tag { padding-top: 40px; }

/************* Nav Box *******************/
#nav {			
	margin-top: 8px;
	color:#FFF;
	background:#666666 repeat-x url(images/nav_bkg.gif);
	height:24px;	
	text-align:center;	
}
/*** start from http://www.cssdrive.com/index.php/examples/exampleitem/css_drop_down_menu/ ***/
#cssdropdown, #cssdropdown ul {
	padding: 0;
	margin: 0;
	list-style: none;	
	vertical-align:middle;
	line-height:22px;	
}

#cssdropdown {
	margin-left: 15%;	
	text-align:left;
}

#cssdropdown li {
	float: left;
	position: relative;
}

.mainitems{
	/*float: left;
	position: relative;		*/
	/*width: 120px;	*/
	background-color: #666;	
	height: 22px;
	border-top: 1px solid #b1b1b3;	
	border-bottom: 1px solid #b1b1b3;
	vertical-align:middle;
	padding: 0 25px;
}

.portfolio_nav {  }

.mainitems a{	
	color:#FFF;
	text-transform: uppercase;		
}

.subuls{
	display: none;	
	background-color: #fff;
	/*width: 100px;*/
	width: 10em;
	border-top: 1px solid #b1b1b3;	
	position:absolute;
	top:1.4em;
	left:25px;
}

.subuls li{
	white-space:nowrap;
	width:100%;
	font-size: x-small;	
}

.subuls>li{
	font-size:small;
} 

.subuls li a{
	text-transform: lowercase;	
}

.subuls li a:link, .subuls li a:visited {	
	color:#666;
}

.mainitems a:hover, .subuls li a:hover, .toggle a:link, .toggle a:visited, #contact a:link, #contact a:visited {	
	color:#993; 
}

#cssdropdown li>ul { /* to override top and left in browsers other than IE, which will position to the top right of the containing li, rather than bottom left */
	/*top: auto;
	left: auto;*/
}

#cssdropdown li:hover ul, li.over ul { /* lists nested under hovered list items */
	display: block;
}

li.mainitems:hover a.mainlink:link, li.mainitems:hover a.mainlink:visited { /* lists nested under hovered list items */
	color:#993;
}


#main_sel a.mainlink, #sub_sel a, .toggle a:hover, #contact a:hover {
	color:#C63;
}
#main_sel ul { display:block; }
/*** end from   ***/


/************ Main Area ******************/

.main {	
	clear: left;	
	text-align:center;
	margin: 70px auto 40px auto;	
	height:330px;
	width: 730px;
	position:relative;
}

h4 {
	padding:0;
	margin:0;
	font-weight:bold;
	font-size: 100%;
}

/************** Home Page *****************/

div#home div{ 
	float:left; 
	width:205px; 
	height:330px; 
	margin:10px 15px; 
	background-color:#FFF;
	background-position:top;
	background-repeat:no-repeat;
}
#front_pic1 { background-image:url(images/front_pic1.gif); background-repeat:no-repeat; }
#front_pic2 { background-image:url(images/front_pic2.gif); background-repeat:no-repeat; }
#front_pic3 { background-image:url(images/front_pic3.gif); background-repeat:no-repeat; }

/************** Portfolio *****************/

table {
	margin-top: -20px;
	width:100%;
}

td {
	text-align:left;	
	vertical-align:top;
}

td a:link, td a:visited {
	color:#666;
} 

td a:hover {
	color:#993;
} 

td a img {
	width: 55px;
	height: 55px;
	margin: 0px 12px 12px 0px;
}

tr.bottom_row td a img {	
	margin: 0px 12px 0px 0px;
}

gallery8_left {
	padding-left: 55px;
}
gallery8_right {
	padding-right: 55px;
}

td#feature_img_td {
	padding: 0 0 0 20px;
	margin: 0;
	font-size: 80%;	
}
td#desc {
	font-size: 80%;
	padding: 0 0 10px 20px;
	vertical-align:bottom;
	height:100px;
}
td#feature_img_td img {
	/*width: 435px;*/
	height: 270px;
}

/************** About Us *****************/

#about_us, #contact { height:100%; }
div.bio {
	clear:left;
	/*height: 100px;*/
	margin:10px auto;
	padding-top:10px;
	position:relative;
	width: 100%;
	text-align:center;
}

div.bio span.artisan_pic {
	height: 100px;
	float:left;
	width: 67px;
	margin: 0 15px;
}
div.bio span.artisan_pic img {
	height: 100px;
}

.main span.bio_text {
	float:left;	
	text-align:left;	
	font-size: 80%;	
	overflow:hidden;	
	width:600px;	
	position:relative;
}

#kees_text, #sally_text, #armoshaun_text { height: 96px; }
/*
.main span.bio_text:hover  {	
	overflow:visible;
	background-color:#FFF;
	height: 200px;
	z-index:10;
	display:block;
}
*/

.toggle {	
	float:left;
	width: 700px;
	text-align:right;	
	background-color: #FFF;
	height:20px;
	color:#993; 
	font-size: 80%;	
	font-weight:bold;
}

/*
div.mission {
	clear:left;
	margin:10px auto;
	padding-top:30px;
	position:relative;
	width: 100%;
	text-align:left;
}

div.mission span.mission_pic {
	width: 350px;
	float:left;	
	margin: 0 15px;
}
div.mission span.mission_pic img {
	width: 350px;
}

.main span.mission_text {
	float:left;	
	text-align:left;	
	font-size: 80%;	
	width:350px;	
}
*/
div.split {
	clear:left;
	margin:10px auto;
	padding-top:30px;
	position:relative;
	width: 750px;
	text-align:left;
}

div.left_half_img {
	width:350px;
	float:left;	
	margin: 0 15px;
}
div.left_half_pic img {
	/*width: 350px;*/
}

div.right_half_text {
	float:left;	
	width:350px;
	text-align:left;	
	font-size: 80%;			
}


/*************** Contact *****************/

#contact {
	/*text-align:left;*/
}

#testimonial_text {
	clear:both;
	padding-top: 20px;	
	font-style:italic;
	font-size: 80%;
}

/*************** Footer ******************/
#footer {
	clear:both;	
	height:30px;
	width:100%;
	text-align:center;
	vertical-align:middle;
	color:#666;
	font-size:75%;
	text-transform:uppercase;
	position:relative;
}
#footer span {color:#C63; font-size:150%; margin:0px 7px; }

#footer a:link, #footer a:visited { color: #666; text-transform:lowercase; } 
#footer a:hover { color: #C63; }	


/*************** bugger *****************/

#bug {
	width:700px;	
	background:#FFF;	
	color: #000000;
	text-align:left;
	/*display:none;*/
}
