/* CSS Document */

html, body {
	text-align: left;
	vertical-align: top;
	margin: 0px;
	padding: 0px;
	min-height: 100% !important;
	height: 100% !important;
	width: 100%;
	border: 0px solid #00FF00;
	}
	
body {
	background: #000 url("/images/bkg_body.png") center 0 no-repeat;
	font: normal 12px Verdana, Arial, Helvetica, sans-serif;
	}

.offscreen { position: absolute; top: -500px; }

#masthead, #content, #footer { width: 948px; }

/* 

COLORS
======
Warm Gray	#8a7a67
Red			#c14228
Orange		#f8981c
Yellow		#ffc423
Green		#8cc63f
Light Green	#d6df3d

*/

h1 { font-size: 24px; font-weight: bold; margin: 0px; padding: 10px 12px 0px 12px; color: #FFF; }
h2 { font-size: 18px; font-weight: bold; margin: 0px; padding: 0px 12px; color: #FF0000; }
h3 { font-size: 14px; font-weight: bold; margin: 0px; padding: 0px 12px; color: #fe6dba; }
h4 { font-size: 12px; font-weight: bold; margin: 0px; padding: 0px 12px; color: #FFF; }

.overview { padding: 0px 12px; color: #FFF; font-size: 14px; }
.overview h1, .overview h2, .overview h3, .overview h4 { padding-left: 0px; padding-right: 0px; }



/**** MASTHEAD ****/

#masthead {
	clear: both;
	margin: 0 auto;
	
	position: relative;
	height: 106px;
	border: solid 0px #CC0000;
	}

.masthead_logo {
	position: absolute;
	top: 8px;
	left: 0px;
	z-index: 999;
	border: solid 0px #00FF00;
	display: block;
	}

.masthead_logotype {
	position: absolute;
	top: 36px;
	left: 172px;
	z-index: 1000;
	border: solid 0px #00FF00;
	display: block;
	}

.masthead_text {
	background-color: transparent;
	position: absolute;
	bottom: 20px;
	left: 425px;
	vertical-align: bottom;
	font-size: 11px;
	color: #FFF;
	}

.masthead_menu {
	position: absolute;
	top: 70px;
	right: 12px;
	width: 398px;
	height: 19px;
	display: block;
	}
	
#menu_portfolio, #menu_services, #menu_aboutus, #menu_contact, #menu_consultation {
	display: block;
	height: 19px;
	background-image: url("/images/menu.png");
	background-repeat: no-repeat;
	float: left;
	}

	#menu_portfolio { width: 68px; background-position: 0 0; }
	#menu_portfolio:hover, #page_portfolio #menu_portfolio { background-position: 0 -19px; }
	#menu_portfolio span { display: none; }
	
	#menu_services { width: 76px; background-position: -68px 0; }
	#menu_services:hover, #page_services #menu_services { background-position: -68px -19px; }
	#menu_services span { display: none; }
		
	#menu_aboutus { width: 64px; background-position: -144px 0; }
	#menu_aboutus:hover, #page_aboutus #menu_aboutus { background-position: -144px -19px; }
	#menu_aboutus span { display: none; }
	
	#menu_contact { width: 73px; background-position: -208px 0; }
	#menu_contact:hover, #page_contact #menu_contact { background-position: -208px -19px; }
	#menu_contact span { display: none; }
	
	#menu_consultation { width: 117px; background-position: -281px -38px; }
	#menu_consultation:hover, #page_consultation #menu_consultation { background-position: -281px -38px; }
	#menu_consultation span { display: none; }
	
	
	
/**** CONTENT ****/

#content {
	clear: both;
	background: url() 0 0 repeat-y;
	margin: 0 auto;
	padding: 0px 16px 0px 16px;
	position: relative;
	height: auto;
	min-height: 50px;
	border: solid 0px #CC0000;
	overflow: auto;
	}
	#content a:link { color: #ffc726; text-decoration: underline; }
	#content a:visited { color: #FFF; text-decoration: underline; }
	#content a:hover { color: #FF0000; text-decoration: underline; }
	#content a:active { color: #FFF; text-decoration: underline; }


#copyright { font-weight: normal; font-size: 10px; color: #999; padding: 12px 12px 0px 12px; }
#legal { font-size: 11px; color: #999; padding: 4px 12px 2px 12px; }

.overview_picbox { float: right; clear: both; margin: 6px 12px 12px 18px; width: 352px; text-align: center; }
.overview_pic { display: block; max-width: 350px; border: solid 0px #00FF00; }
.overview_picbox .border { border: solid 1px #999; }
.overview_caption { padding: 12px 12px 0px 12px; font-size: 12px; color: #999; text-align: center; vertical-align: top; }

.banner { display: block; width: 948px; border-bottom: 2px solid #FF0000; }

.thumb_box {
	float: left;
	width: 146px;
	max-height: 146px;
	margin: 0px 0px 10px 10px;
	}
.thumb_box .img_box { text-align: center; vertical-align: middle; }
.thumb_box .img_box img { border: 1px solid #666; }
.thumb_box .img_box img:hover {
	border-color: #FF0000;
	}

/**** PORTFOLIO ****/

/* Categories Menu */
#categories_menu { margin: 12px 0px 0px 0px; padding: 0px 12px 12px 12px; color: #FFF; }
	#categories_menu a:link { color: #FFF; text-decoration: none; }
	#categories_menu a:visited { color: #FFF; text-decoration: none; }
	#categories_menu a:hover { color: #FF0000; text-decoration: none; }
	#categories_menu a:active { color: #FFF; text-decoration: none; cursor: }

/* Categories Menu "Jump To" Text Label */
#categories_menu .jump_to { margin-right: 6px; font-weight: bold; color: #FFF; }




/**** SIDEBAR ****/

#sidebar {
	width: 300px; 
	height: 100%; 
	background-color: #e1e1e1;
	/*
	position: absolute; 
	top: 0px; 
	left: 16px;
	left: 0px;
	*/
	float: left;
	border-style: solid;
	border-color: #c7c7c7;
	border-width: 1px 1px 1px 0px;
	margin: 0px 12px 0px -16px;
	padding: 12px 12px 12px 16px;
	}



/**** FOOTER ****/

#footer {
	clear: both;
	background: url() 0 bottom no-repeat;
	margin: 0 auto;
	padding: 12px 16px 75px 16px;
	position: relative;
	height: auto;
	min-height: 12px;
	border: solid 0px #00FF00;
	}
	#footer a:link { color: #FFF; text-decoration: underline; }
	#footer a:visited { color: #FFF; text-decoration: underline; }
	#footer a:hover { color: #FF0000; text-decoration: underline; }
	#footer a:active { color: #FFF; text-decoration: underline; }