/* CSS Document */

body {
	margin: 0;
	padding: 0;
	background-color: #FFF;
	background: url(../images/hod-back.gif);
	background-repeat: repeat-x;
	behavior: url(includes/csshover.htc);
}

.content5, #content5 {
	padding: 5px;
}
.content10, #content10 {
	padding: 10px;
}
.content15, #content15 {
	padding: 15px;
}

#pagewrap {
	display: block;
	margin: 0;
	padding: 0;
	width: 888px;
}
#seven_y {
	float: left;
	width: 1px;
	height: 7px;
}
#eight_x {
	float: left;
	width: 8px;
	height: 1px;
}
#twenty_x {
	float: left;
	width: 20px;
	height: 1px;
}
#twenty_y {
	float: left;
	width: 1px;
	height: 20px;
}
#ten_x {
	float: left;
	width: 10px;
	height: 1px;
}
#fourteen_y {
	float: none;
	width: 1px;
	padding-top: 0px;
	height: 14px;
}
div#white_box {
	float: left;
	border: 1px solid #231f20;
	background: #fff;
	display: inline;
	width: 864px;
}
div#red_box {
	float: left;
	width: 846px;
	height: 6px;
	background: #a61a1e;
}
div#menu_wrapper {
	width: 846px;
	background: url(../images/menu_bg.gif);
	margin: 5px 7px 20px 7px;
}
div#column_container {
	float: left;
}
div#top_container_box {
	float: left;
	background: url(../images/top_container.gif);
	width: 245px;
}
div#mid_container {
	float: left;
	border-left: 2px solid #d1d3d4;
	border-right: 2px solid #d1d3d4;
	width: 241px;
}
div#bot_container_box {
	float: left;
	background: url(../images/bot_container.gif);
	width: 245px;
	height: 10px;
}
div#top_column_box {
	background: url(../images/top_container.gif);
	width: 220px;
}
div#mid_column_box {
	border-left: 2px solid #d1d3d4;
	border-right: 2px solid #d1d3d4;
	width: 210px;
}
div#bot_column_box {
	background: url(../images/bot_container.gif);
	width: 220px;
	height: 10px;
}
div#photo_container {
	float: left;
	margin: 8px;
	display: inline;
}
div#main_col {
	float: left;
	width: 580px;
	text-align: left;
	padding-left: 15px;
}
div#showroom_photo {
	width: 213px;
	height: 126px;
}
div#centered { 
	text-align: center;
	padding-left: 12px;
}
.left_border {
	border-left: 2px solid #999999;
}
div#bios {
	float: left;
}
div#about {
	float: left;
	width: 250px;
	padding: 15px;
}
div#about h2{
	text-transform: uppercase;
}
div#main_col #text {
	float: left;
	width: 370px;
}
div#right_col, div#left_col {
	float: left;
	text-align: left;
	padding-right: 10px;
	padding-left: 10px;
	width: 230px;
}
div#left_mini_col, div#right_mini_col {
	float: left;
	width: 271px;
	padding: 17px 0 0 15px;
}
div#right_mini_col {
	border-left: 2px solid #a9a8ad;
}
div#left_mini_col.red {	
	background-color: #bf1e2d;
	height: 33px;
}
div#right_mini_col.gray {
	background-color: #58585a;
	border-left: 2px solid #a9a8ad;
	height: 33px;
}

div#rounded_box {
	height: 51px;
}

div#thumb_container { 
	width: 168px;
	height: 130px;
	background-repeat: no-repeat;
}
div#full_container { 
	width: 578px;
	height: 247px;
	background-repeat: no-repeat;
}
div#full_photo { 
	width: 578px;
	height: 385px;
	background-repeat: no-repeat;
}
div#red-bar, div#gray-bar { 
	width: 578px;
	height: 300px;
}
div#red-bar { 
	background: #bf1e2e;
}
div#gray-bar { 
	background: #58585a;
}
div#blank-bar {
	background: #fff;
	width: 578px;
	height: 282px;
}
div#gallery-photo-mask {
	background: #fff;
	width: 578px;
	height: 385px;
}
div#address_box {
	height: 72px;
}
div#logo_wrap {
	float: left;
	width: 866px;
}
div#logo {
	float: left;
}
div#middle {
	float: left;
	width: 100px;
	height: 20px;
}
div#slogan {
	float: right;
	text-align: right;
	width: 400px;
	height: 40px;
}
div#top_buttons {
	float: right;
	width: 400px;
}
div#header_text {
	float: right;
	text-align: right;
	padding: 25px 0 0 0;
}
div#slogan div#gray_button {
	float: left;
	width: 94px;
	text-align: center;
	background: #e7e7e8;
	height: 30px;
	padding-top: 10px;
}
div#slogan div#gray_button a{
	font: 14px Arial, Helvetica, sans-serif;
	color: black;
}
div#slogan div#red_button {
	float: left;
}
div#footer {
	color: #999;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	width: 880px;
	padding: 10px 0;
}
div#footer a {
	color: #999;
	text-decoration: none;
}
div#footer a:hover {
	color: #999;
	text-decoration: underline;
}
div#copyright {
	float: left;
	width: 350px;
	text-align: left;
	margin-left: 25px;
}
div#credits {
	float: right;
	width: 350px;
	text-align: right;
	margin-right: 25px;
}
#menu {
	display: block;
}


/* ------------------------------ GALLERIES ------------------------------------------ */

div.category-border {
	margin: -247px 0 0 0;
}
div.gallery-border {
	margin: -385px 0 0 0;
}
div.thumb-border {
	margin: -112px 0 0 0;
}
div.before-border {
	margin: -135px 0 0 0;
}
div.after-border {
	margin: -242px 0 0 0;
}

div.category-border, div.gallery-border, div.thumb-border, div.before-border, div.after-border {
	position: relative;
}

div.category-photo, div.gallery-photo, div.thumb-photo, div.work-thumb-photo, div.before-photo, div.after-photo {
	position: relative;
}
div.thumb-photo {
	float: left;
	margin: 22px 0 0 22px;
}
.small-text {
	font: 11px Arial, Helvetica, sans-serif;
}

/* ------------------------------ MENUS ------------------------------------------ */
#menu {
	display: block;
}
div#sub_menu {
	float: left;
	text-align: left;
	font-size: 11px;
	line-height: 12px;
	font-weight: normal;
	text-transform: none;
	font-family: Arial, Helvetica, sans-serif;
	border: 0;
	z-index: 50;
	position: relative;
	color: #FFF;
	font-style: normal;
}
div#sub_menu ul {
	margin: 0;
	padding: 10px;
}
div#sub_menu ul a {
	font: 11px Arial, Helvetica, sans-serif;
	color: #fff;
	padding: 0 5px;
}
div#right_menu {
	float: right;
	text-align: right;
	font-size: 16px;
	line-height: 15px;
	font-weight: normal;
	text-transform: none;
	font-family: Arial, Helvetica, sans-serif;
	border: 0;
	z-index: 50;
	position: relative;
	color: #FFF;
	font-style: normal;
}
div#right_menu ul {
	margin: 0;
	padding: 10px;
}

/* ------------------------------ PROGRESS MENU BAR ------------------------------------------- */

#pb_outer {
	height: 20px;
	border: 1px solid #000;
	width: 80%;
	margin: 20px auto;
	display: none;
}
#pb_inner {
	font-weight: bold;
	color: #FFFFFF;
	background-color: #CC0000;
	height: 20px;
	width: 1px;
	text-align: center;
}

/* ------------------------------ DROPDOWN MENU ------------------------------------------ */

div#top_menu {
	float: right;
	font-size: 12px;
	line-height: 12px;
	font-weight: normal;
	font-family: Arial, Helvetica, sans-serif;
	z-index: 50;
	position: relative;
	color: #FFF;
	font-style: normal;
	text-transform: uppercase; 
}
div#top_menu ul {
	margin: 0;
	padding-top: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-left: 0;
	border-right: 1px solid #000;
}
div#top_menu ul li {
	float: left;
	list-style-type: none;
	color: #000;
	text-align: center;
}
div#top_menu ul li.text {
	height: 22px;
	color: #000;
	padding-top: 16px;
	padding-right: 10px;
}
div#top_menu ul li a.button1{
	height: 23px;
	width: 63px;
	color: #000;
	padding-top: 16px;
	padding-left: 10px;
	background-image:url(../images/button1_inactive.gif);
	background-repeat: no-repeat;
}
div#top_menu ul li a.button1:hover, div#top_menu ul li a.button1active{
	background-image:url(../images/button1.gif);
	background-repeat: no-repeat;
}
div#top_menu ul li a.button2{
	height: 23px;
	width: 90px;
	color: #000;
	padding-top: 16px;
	padding-right: 5px;
	background-image:url(../images/button2_inactive.gif);
	background-repeat: no-repeat;
}
div#top_menu ul li a.button2:hover, div#top_menu ul li a.button2active{
	background-image:url(../images/button2.gif);
	background-repeat: no-repeat;
	background-position: top;
}
div#top_menu a {
	display: block;
	text-decoration: none;
	margin-bottom: 0px;
}
div#top_menu ul li ul:hover {
	display: block;
}
div#top_menu ul li a {
	color:#fff;
	background-image: none;
	padding: 5px 0 0 0;
}
div#top_menu ul li a:hover {
	color: #fff;
	background-image: none;
}

/* THE HACK ZONE - */
* html div#top_menu ul {
	float:left; /* makes the ul wrap the li's */
	margin-left:0px; /* IE doubles the given value above - why? */
	}

/* END OF HACK ZONE */


/* ------------------------------ DROPDOWN MENU ------------------------------------------ */
body div#main_menu ul li ul, body div#main_menu ul li ul li ul {
	display: none;
	float: left;
	}
div#main_menu {
	width: 859px;	
	background-repeat: repeat-x;
	height: 47px;
	text-align: left;
	font-size: 12px;
	line-height: 12px;
	font-weight: normal;
	text-transform: capitalize;
	font-family: Arial, Helvetica, sans-serif;
	color: #FFF;
	text-transform: uppercase;
	margin: 0;
	padding: 0;
	z-index: 150;
	position: relative;
}
div#main_menu ul {
	padding: 0;
	margin: 0;	
}
div#main_menu li {
	float: left;
	width: auto;
	position: relative;
	left: 0px;
	list-style-type: none;
}
div#main_menu ul a {
	display: block;
	color: #fff;
	text-decoration: none;	
}
div#main_menu ul li a {
	padding: 18px 11px;
	color:#FFFFFF;
}
div#main_menu ul li a.button1, div#main_menu ul li a.button2, div#main_menu ul li a.button3, div#main_menu ul li a.button4, div#main_menu ul li a.button5, div#main_menu ul li a.button6, div#main_menu ul li a.button7, div#main_menu ul li a.button8  {
	height: 23px;
	margin: 10px 0 4px 0;
	text-align: center;
	padding: 10px 0 0 0;
}
div#main_menu ul li a.button1{
	width: 70px;
	margin: 10px 0 4px 4px;
}
div#main_menu ul li a.button2{
	width: 85px;
}
div#main_menu ul li a.button3{
	width: 130px;
}
div#main_menu ul li a.button4{
	width: 75px;
}
div#main_menu ul li a.button5{
	width: 100px;
}
div#main_menu ul li a.button6{
	width: 130px;
}
div#main_menu ul li a.button7{
	width: 112px;
}
div#main_menu ul li a.button8{
	width: 135px;
	margin: 10px 4px 4px 0;
}
div#main_menu ul li a:hover{
	background-image:url(../images/button1_hover.gif);
	background-color: #FFF;
	background-repeat: no-repeat;
	background-position: top center;
	color: #000;
}
div#main_menu ul li ul:hover, div#main_menu ul li:hover ul {
	display: block;
}
div#main_menu ul li ul li:hover ul {
	display: block;
	left: 120px;
}
div#main_menu ul li ul li a:hover{
	background: none;
	color: #fff;
	background-color: #a6191e;
}
div#main_menu ul li ul {
	position: absolute;
	width: 130px;
	z-index: 125;
	
	margin: 0 0 0 0;
}
div#main_menu ul li ul li {
	width: 145px;
	padding: 0px;
	color: #a6191e;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	margin: 0;
	background: none;
	}
div#main_menu ul li ul li a{
	width: 107px;
	background-color: #df3941;
	border-top: 0;
	padding: 6px 12px;
	color: #FFF;
	margin: 0px;
	}
div#main_menu ul li ul li:first-child {
	border-top: 0;
	}

div#main_menu ul li ul li:hover ul {visibility:visible;} /* same effect as display:block in this situation */

/* second level popouts start here*/
div#main_menu ul li ul li:hover ul li ul {visibility:hidden;}
div#main_menu ul li ul li ul li:hover ul {visibility:visible;} /* same effect as display:block in this situation */

/* third level popouts start here*/
div#main_menu ul li ul li ul li:hover ul li ul {visibility:hidden;}
div#main_menu ul li ul li ul li ul li:hover ul {visibility:visible;} /* same effect as display:block in this situation */
	
/* pop-out starts here */
div#main_menu ul li ul li ul  {
	visibility:hidden; /* same effect as display:none in this situation */
	top:-1px;
	left:10em;
	}
/* THE HACK ZONE - */
* html div#main_menu ul {
	float:left; /* makes the ul wrap the li's */
	margin-left:0px; /* IE doubles the given value above - why? */
	}
/* add a top line to drops and pops in IE browsers - can't read :first-child */
* html  div#main_menu ul li ul {
	margin: 0;
	border-top: 0;
	border-left: 0; /* stops the drop inheriting the ul border */
	}
/* the Tantek hack to feed IE Win 5.5-5.0 a lower value to get the pop-out to touch the drop-down */
* html  div#main_menu ul li ul li ul { 
  left:0; 
  voice-family: "\"}\""; 
  voice-family:inherit;
  left:0em;
  } 

/* Fix issue with incorrect padding rendering in IE 6 */
* div.thumb-photo {
	float: left;
	margin: 22px 0 0 18px;
}

/* Fix issue with too much padding in IE 6 */
* div.category-border {
	margin: -251px 0 0 0;
}

*html div#top_menu {
	float: right;
	font-size: 12px;
	line-height: 12px;
	font-weight: normal;
	font-family: Arial, Helvetica, sans-serif;
	z-index: 50;
	position: relative;
	color: #FFF;
	font-style: normal;
	text-transform: uppercase;
	margin-right: -9px; 
}


/* and the "be nice to Opera" rule */
html>body div#main_menu ul li ul li ul {
  left:0em;
} 




/* an Opera-only hack to fix a redraw problem by invisibly extending the ul */
	@media all and (min-width: 0px){
   body div#main_menu ul li ul {padding-bottom:100px;}
   body div#main_menu ul li ul li ul {padding-bottom:22px;}
   body div#main_menu ul li ul li ul li ul li:hover {visibility:visible;} /* same effect as display:block in this situation */
   }

/* END OF HACK ZONE */

/* FLOATERS */

.float_left, #float_left {
	float: left;
}
.float_right, #float_right {
	float: right;
}

/* CLEARFIX */

.clear, #clear {
	clear: both;
}
