body {
	margin: 0px;
	background: #dbdfe0 url(../images/bodybg.gif) repeat-y;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #FFF;
}
#container {
	width: 100%;
	height: 482px;
	position: absolute;
	top: 0;
	left: 0%;
	background-color: #7e8890
}
a {
	text-decoration: none;
	text-transform: uppercase;
	color: inherit;
}
/*===================================================== Header*/
#header {
	width: auto;
	min-width: 760px;
	height: 36px;
	position: relative;
	top: 0;
	left: 0;
	padding: 83px 0 0 46px;
	text-transform: uppercase;
	/*font-weight: bold;*/
	color: #FFF;
	background-color: #666699;
	background-image: url(../images/headerBkg.png);
	background-repeat: no-repeat;
	border-bottom: 3px solid #FFF
}
#header ul {
	width: 70%;
	float: right;
	list-style: none;
	margin: 0;
	padding: 0
}
#header li {
	display: inline;
	padding-right: 2%;
}
#header a#index {
	width: 285px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 45px
}
#header a {
	text-decoration: none;
	color: #fff;
	font-size: 9pt;
	letter-spacing: 1px;
}
#header a:hover, #header a.active{ color: #f9a552 }
#header strong{font-size: 10pt;}
/*===================================================== Content Container*/
#contentContainer {
	width: 100%;
	min-width: 850px;
	height: 360px;
	position: relative;
	top: 0;
	left: 0;
	overflow: hidden;
	z-index: 1;
}
/*===================================================== Side Navigation*/
#sideNavContainer {
	width: 200px;
	height: 100%;
	float: left;
	padding-left: 40px;
	background-color: #ff9900;
	border-right: 3px solid #FFF;
}
#sideNav {
    width: 166px; 
	height: 85%;
    position: relative;
	margin-top: 30px;
    overflow: auto;
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 1; 
	line-height: 15px
}

#sideNav *{
	font-size: 9pt;
	color: #fff;

}

#sideNav ul {
	margin: 0 0 15px 0;
	padding-left: 10px;
	list-style-type: none;
}
#sideNav li { margin: 4px 0 }

#sideNav h3 {
	margin: 0;
	text-transform: uppercase;
}
#sideNav a {
	color: #FFF;
	display: block;
	border-top: 1px solid #f90;
	border-bottom: 1px solid #f90;
	letter-spacing: 1px;
}
#sideNav div a{
	padding: 5px;
}
#sideNav a:hover, #sideNav a.active {
	background-color: #e0862e;
	border-top: 1px solid #efd9c1;
	border-bottom: 1px solid #efd9c1;
}
/*=========================== Scroll Area*/
#sideScroll, #contentScroll {
    position: absolute;
    left: 0; 
	top: 0;
    width: 100%;
    z-index: 2;
}
#sideNav div.track, #content div.track {
    width: 7px; 
	height: 100%;
    position: relative;
    float: right;
    top: 0; 
    font-size: 0;
    z-index: 3;
    background: url("../images/sideTrack.gif") 3px 0 repeat-y
}
#content div.track { background: url("../images/contentTrack.gif") 3px 0 repeat-y }
#sideNav div.drag_bar, #content div.drag_bar {
    width: 100%; 
	height: 14px;
    position: absolute;
    cursor: pointer;
    z-index: 4;
    background-color: #e0862e;
}  
#content div.drag_bar { background-color: #c2c7cb }
/*===================================================== Content*/
#content {
	width: 55%;
	min-width: 565px;
	height: 85%;
	margin: 30px 0 0 30px;
	float: left;
	position: relative;
    overflow: auto;
    z-index: 1;
    font-size: 10pt;
}
#content h1 {
	margin: 0;
	text-transform: uppercase;
	font-size: 14px
}
#content h3 {
	font-size: 13px;
	margin: 0 0 5px 0;
	padding-top: 15px
}
#content p { line-height: 15px }

/*===================================================== Footer*/
#footer{
	padding-bottom: 100px;
	position: absolute;
	top: 482px;
	bottom: 0;
	color: #666;
	width:auto;
	min-width: 760px;
}
#sideFooter, #contentFooter{
	position: absolute;
	bottom: 0;
}
/*===================================================== Footer left side*/
#sideFooter {
	width: 200px;
	padding-left: 40px;
	border-right: 3px solid #fff;
}

/*===================================================== Footer right side */
#contentFooter {
	width: 607px;
	left: 343px;
	text-align: center;
	text-transform: uppercase;
}
#contentFooter p{
	text-align: center;
}

/*=========================== Homepage*/
#home #container{background-color: #fff;}

/*=========================== Portfolio Page*/
#content a img {
	margin: 0 15px 15px 0;
	border: 2px solid #4f5963
}
#content a:hover img {
	border-color: #d5b253
}
#portfolio #content a img{
	width: 113px;
	height: 114px;
}
/*=========================== Detail Page*/
#content img.float { 
	float: left; 
	margin-right: 40px;
	height: 300px;
	border: 2px solid #979fa5
}
#content a#previous, #content a#next {
	position: absolute;
	bottom: -60px;
	left: 334px;
	padding-top: 35px;
	color: #c2c7cb;
	text-align: center;
	background: url(../images/previousBkg.gif) top center no-repeat;
}
#content a#next { 
	width: 40px;
	left: 424px; 
	background-image: url(../images/nextBkg.gif) 
}
#content a#previous:hover, #content a#next:hover { color: #FFF }
#detail #container{
	height: 522px;
}
#detail #content, #detail #contentContainer{
	height: 400px;
}
/*=========================== Contact Page*/
#contactForm { width: 345px }
#contactForm ul {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
#contactForm ul li {
	position: relative;
	left: 0;
	top: 0;
	margin: 0;
	padding: 0;
	clear: both
}
#contactForm label {
	width: 100px;
	float: left;
	display: block;
	font-weight: bold;
	text-align: right;
	text-transform: uppercase
}
#contactForm .field, #contactForm textarea {
	width: 225px;
	height: auto;
	float: right;
	margin-bottom: 8px;
	padding: 2px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #57656F;
	overflow: auto;
	background-color: #FFF;
	border: 1px solid #C2C7CB
}
#contactForm textarea { height: 150px }
.button {
	cursor: pointer;
	margin: 20px 0 0 185px;
	padding: 4px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #222;
	text-transform: uppercase;
	background-color: #C2C7CB;
	border: 1px solid #57656F
}

/*=========================== Commissions Page*/

#commissions #content a:link,
#commissions #content a:visited{
	color: #c2c7cb;
}

#commissions #content a:hover,
#commissions #content a:active{
	color: #fff;
}

/*=========================== Reviews Page*/

.byline{margin-top:0;}
#sideNav a.contact{padding-left: 0;}

/*=========================== About Page*/

#image-john{
	float: left;
	margin: 20px 20px 20px 0px;
}

