/*****************************************
TABLE OF CONTENTS
	#001 - HTML 5 CSS Reset
	#002 - Main site structure
	#003 - Font styles
	#004 - Header layout
	#005 - Navigation layout
	#006 - Front page
	#007 - About page
	#008 - Folio page
	#009 - Photo page
	#010 - Contact page
	#011 - Footer
	
	~ last updated October 17 2010
*****************************************/
/****
#001 HTML 5 CSS Reset
html5doctor.com Reset Stylesheet
v1.4.1 
2010-03-01
Author: Richard Clark - http://richclarkdesign.com
****/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body {
    line-height:1;
}

article,aside,canvas,details,figcaption,figure,
footer,header,hgroup,menu,nav,section,summary { 
    display:block;
}

nav ul {
    list-style:none;
}

blockquote, q {
    quotes:none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}

a {
    margin:0;
    padding:0;
    border:0;
	outline:none;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
	color: #aeaeae;
	text-decoration:none;
}
a:hover { color:#fff; }
p a, h2 a, h3 a {
	color:#6de1f6;
}
p a:hover, h2 a:hover, h3 a:hover {
	color:#abe9f4;
	text-decoration:underline;
}
ins {
    background-color:#ff9;
    color:#000;
    text-decoration:none;
}

mark {
    background-color:#ff9;
    color:#000; 
    font-style:italic;
    font-weight:bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom:1px dotted #000;
    cursor:help;
}
table {
    border-collapse:collapse;
    border-spacing:0;
}
hr {
    display:block;
   	height:1px;
    border:0;   
    margin:0;
    padding:0;
}
.hr {
  background:url(../images/site/body-div.jpg) no-repeat 0 38px;
  clear:both;
  height:82px;
}
.hr hr {
  display: none;
}
input, select {
    vertical-align:middle;
}

/****
#002 Main site structure 
****/
html {
	height:100%;
	background:#0b0b0b;
}
body {
	min-height:100%; 
	background:url(../images/site/content-bg.jpg) top center repeat-y; 
	color:#e2e2e2; 
	font-family: Geneva, Helvetica, Arial, 'Lucida Sans', 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif;
}
#wrap {
	min-height:100%; 
	width:940px; 
	margin:0 auto; 
	padding:40px 10px 50px 10px;
}
p.first {
	margin-top:20px;
}
p.last {
	margin:0;
}
.clearfix:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
.floatLeft {
	float:left;
}
.floatRight {
	float:right;
}
#extra .floatLeft {
	width:460px;	
}
#extra .floatRight {
	width:460px;
}

/****
#003 Font styles
****/
h1, h2, h3, h4, h5, h6 {
	font-family:Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif;
}
p { 
	font-size:13px;
	font-style:normal;
	font-weight:normal;
	text-transform:normal;
	letter-spacing:normal;
	line-height:20px; 
	margin:0 0 20px 0;
}
h4 { 
	margin:0 0 20px 0;
}
h2 {
	font-size:30px;
	line-height:36px;
	margin:0 0 20px 0;
	text-shadow: -1px 1px 1px #111;
}
#featured h2, 
#extra h2, 
.folioItem h2 {
	line-height:20px;	
}
h3 {
	font-size:24px;
	line-height:30px;
	margin:-2px 0;
	text-shadow: -1px 1px 1px #333;
}

/****
#004 Header layout
****/
header {
	display:block;
	padding:0 0 40px 0;
}
h1 {
	font-size:18px;
}
.logo {
   height:65px; /* height of replacement image */
   width:322px; /* width of replacement image */
   padding:0;
   overflow:hidden;
   float:left;
}
.logo:before {
   content:url(../images/site/header-logo.png);
   display:inline-block;
   font-size:0;
   line-height:0;
}

/****
#005 Navigation layout
****/
.nav {
	width:436px;
	height:22px;
	background:url(../images/site/header-nav.png) no-repeat;
	position:relative;
    top:44px;
    left:507px;
}

.nav li {
	display:inline;
}

.nav li a:link, .nav li a:visited {
    position: absolute;
    top: 0;
    height: 22px;
    text-indent: -9000px;
    overflow: hidden;
	z-index:10;
}

.nav .about a:link, 
.nav .about a:visited {
	left:0px;
	width:63px;
}
.nav .about a:hover, 
.nav .about a:focus, 
.current-about .about a:link, 
.current-about .about a:visited {
	background:url(../images/site/header-nav.png) no-repeat 0px -21px;
	cursor:pointer;
}
.nav-about, 
.nav-about-click {
	position: absolute;
	top:0;
	left:0;
	width:63px;
	height:22px;
	background:url(../images/site/header-nav.png) no-repeat 0px -21px;
}
.nav .about a:active {
	background:url(../images/site/header-nav.png) no-repeat 0px -21px;
}

.nav .folio a:link, 
.nav .folio a:visited {
	left:115px;
	width:55px;
}
.nav .folio a:hover, 
.nav .folio a:focus, 
.current-folio .folio a:link, 
.current-folio .folio a:visited {
	background:url(../images/site/header-nav.png) no-repeat -115px -21px;
	cursor:pointer;
}
.nav-folio, 
.nav-folio-click {
	position: absolute;
	top:0;
	left:115px;
	width:55px;
	height:22px;
	background:url(../images/site/header-nav.png) no-repeat -115px -21px;
}
.nav .folio a:active {
	background:url(../images/site/header-nav.png) no-repeat 115px -21px;
}

.nav .photos a:link, 
.nav .photos a:visited {
	left:220px;
	width:72px;
}
.nav .photos a:hover, 
.nav .photos a:focus, 
.current-photos .photos a:link, 
.current-photos .photos a:visited {
	background:url(../images/site/header-nav.png) no-repeat -220px -21px;
	cursor:pointer;
}
.nav-photos, 
.nav-photos-click {
	position: absolute;
	top:0;
	left:220px;
	width:72px;
	height:22px;
	background:url(../images/site/header-nav.png) no-repeat -220px -21px;
}
.nav .photos a:active {
	background:url(../images/site/header-nav.png) no-repeat 0px -22px;
}

.nav .contact a:link, 
.nav .contact a:visited {
	left:350px;
	width:83px;
}
.nav .contact a:hover, 
.nav .contact a:focus, 
.current-contact .contact a:link, 
.current-contact .contact a:visited {
	background:url(../images/site/header-nav.png) no-repeat -350px -21px;
	cursor:pointer;
}
.nav-contact, 
.nav-contact-click {
	position: absolute;
	top:0;
	left:350px;
	width:83px;
	height:22px;
	background:url(../images/site/header-nav.png) no-repeat -350px -21px;
}
.nav .contact a:active {
	background:url(../images/site/header-nav.png) no-repeat 0px -22px;
}

/****
#006 Front page
****/
.shadow {
	position:relative;
	margin:0 0 40px 0;
	width:936px;
}
.imgShadow, .shadow img, .aboutImg {
	border:2px solid #ccc;
	box-shadow: rgba(0,0,0,0.50) 0 0 20px;
	-moz-box-shadow: rgba(0,0,0,0.50) 0 0 20px;
	-webkit-box-shadow: rgba(0,0,0,0.50) 0 0 20px;
	/*IE Drop shadow causes shifting - investigate further*/
	/*filter: 
        progid:DXImageTransform.Microsoft.Shadow(color=#333333,direction=0,strength=9)
        progid:DXImageTransform.Microsoft.Shadow(color=#222222,direction=90,strength=9)
        progid:DXImageTransform.Microsoft.Shadow(color=#333333,direction=180,strength=9)
        progid:DXImageTransform.Microsoft.Shadow(color=#222222,direction=270,strength=9);*/
}
.featuredBig {
	outline:none;
}
.supText {
	float:left;
	width:700px;
	margin:0;
	padding:0;
}
.supLinks {
	float:right;
	width:220px;
	list-style:none;
	margin:2px 0 10px 0;
}
.supLinks li {
	text-align:right;
	line-height:14px;
	overflow:visible;
	margin:0 0 3px 0;
}
.supLinks a {
	font-style:italic;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:12px;
}
.enlarge {
	padding:0 0 0 18px;
	background:url(../images/site/enlarge-icon.png) no-repeat 0 2px;
}
a:hover.enlarge {
	background:url(../images/site/enlarge-icon.png) no-repeat 0 -13px;
}
.folioBig {
	padding:0 0 0 18px;
	background:url(../images/site/enlarge-icon.png) no-repeat 0 2px;
}
a:hover.folioBig {
	background:url(../images/site/enlarge-icon.png) no-repeat 0 -13px;
}
a.comment {
	padding:0 0 0 18px;
	background:url(../images/site/comment-icon.png) no-repeat 0 3px;
}
a:hover.comment {
	background:url(../images/site/comment-icon.png) no-repeat 0 -13px;
}
a.view {
	padding:0 0 0 18px;
	background:url(../images/site/view-icon.png) no-repeat 0 1px;
}
a:hover.view {
	background:url(../images/site/view-icon.png) no-repeat 0 -14px;
}

/****
#007 About page 
****/
.aboutImg {
	float:right;
	margin:0 0 20px 20px;	
}

/****
#008 Folio page 
****/
.folioItem {
	margin:0;
}
.imgShadow {
	margin:0 0 40px 0;	
}
#slider1 {
	width:936px;
	overflow:hidden;
	border:2px solid #ccc;
	box-shadow: rgba(0,0,0,0.50) 0 0 20px;
	-moz-box-shadow: rgba(0,0,0,0.50) 0 0 20px;
	-webkit-box-shadow: rgba(0,0,0,0.50) 0 0 20px;
	margin:0 0 40px 0;
}
/* Easy Slider */
#slider1 ul, 
#slider1 li,
#slider2 ul, 
#slider2 li {
	margin:0;
	padding:0;
	list-style:none;
}
#slider2 {
	margin-top:1em;
}
#slider1 li, 
#slider2 li { 
	/* 
	define width and height of list item (slide)
	entire slider area will adjust according to the parameters provided here
	*/ 
	width:936px;
	height:295px;
	overflow:hidden; 
}	
/* numeric controls */	
ol#controls {
	float:right;
	list-style:none;
	margin-top:40px;
	padding:0 0 0 14px;
	background:url(../images/site/view-icon.png) no-repeat 0 3px;	
}
ol#controls li {
	float:left;
	text-align:left;
	line-height:14px;
	overflow:visible;
	margin:0 0 0 5px;
}
ol#controls li a{
	font-style:italic;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-size:14px;
}
ol#controls li.current a{
	color:#fff;
}
ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}

/****
#009 Photo page
****/
#photos {
	list-style:none;
}
#photos li {
	float:left;
	margin:0 30px 30px 0;
	padding:0;
	border:2px solid #ccc;
	box-shadow: rgba(0,0,0,0.30) 0 0 15px;
	-moz-box-shadow: rgba(0,0,0,0.30) 0 0 15px;
	-webkit-box-shadow: rgba(0,0,0,0.30) 0 0 15px;
	line-height:0;
}
.photoBig {
	outline:none;
	overflow:auto;
	padding:0;
	margin:0;
}
/*
    ColorBox Core Style
    The following rules are the styles that are consistant between themes.
    Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
#colorbox, 
#cboxOverlay, 
#cboxWrapper {
	position:absolute; 
	top:0; 
	left:0; 
	z-index:9999; 
	overflow:hidden;
}
#cboxOverlay {
	position:fixed; 
	width:100%; 
	height:100%;
}
#cboxMiddleLeft, 
#cboxBottomLeft {
	clear:left;
}
#cboxContent {
	position:relative;
}
#cboxLoadedContent {
	overflow:auto;
}
#cboxLoadedContent iframe {
	display:block; 
	width:100%; 
	height:100%; 
	border:0;
}
#cboxTitle {
	margin:0;
}
#cboxLoadingOverlay, 
#cboxLoadingGraphic {
	position:absolute; 
	top:0; 
	left:0; 
	width:100%;
}
#cboxPrevious, 
#cboxNext, 
#cboxClose, 
#cboxSlideshow {
	cursor:pointer;
}
/* 
    ColorBox example user style
    The following rules are ordered and tabbed in a way that represents the
    order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay{
	background:#111;
	cursor:none;
}
#cboxContent {
	margin-top:20px;
}
#cboxLoadedContent {
	background:#000; 
	padding:35px;
}
#cboxTitle {
	position:absolute; 
	width:93.5%; 
	bottom:11px; 
	left:35px; 
	font-family:Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif; 
	font-size:16px; 
	color:#e9e9e9;
}
.cboxTitle-right {
	float:right; 
	font-family:Georgia, "Times New Roman", Times, serif; 
	font-size:11px; 
	font-style:italic;
}
#cboxCurrent {
	display:none; /*Hide image count*/
}
#cboxSlideshow {
	position:absolute; 
	top:-20px; 
	right:90px; 
	color:#fff;
}
#cboxPrevious {
	position:absolute; 
	top:50%; 
	left:3px; 
	margin-top:-2px; 
	background:url(images/controls.png) -30px -60px no-repeat; 
	width:30px; 
	height:30px; 
	text-indent:-9999px;
}
#cboxPrevious.hover {
	background-position:0px -60px;
}
#cboxNext {
	position:absolute; 
	top:50%; 
	right:3px; 
	margin-top:-2px; 
	background:url(images/controls.png) -30px -30px no-repeat; 
	width:30px; 
	height:30px; 
	text-indent:-9999px;
}
#cboxNext.hover {
	background-position:0px -30px;
}
#cboxLoadingOverlay {
	background:#000;
}
#cboxLoadingGraphic {
	background:url(images/loading.gif) center center no-repeat;
}
#cboxClose {
	position:absolute; 
	top:6px; 
	right:6px; 
	display:block; 
	background:url(images/controls.png) -30px 0px no-repeat; 
	width:30px; 
	height:30px; 
	text-indent:-9999px;
}
#cboxClose.hover {
	background-position:0px 0px;
}

/****
#010 Contact page
****/
#form {
	color:#ccc;
	width:520px; /* customize width, this form have fluid layout */
}
fieldset {
	margin:0;
	padding:0;
	border:none;	
}		
legend {
	display:none;
}	
#form p {
	position:relative
}	
label {
	display:block;
}
input, textarea {		
	width:90%;
	border-bottom: 1px solid #444;
	border-top: 1px solid #111;
	border-left:1px solid #444;
	border-right:1px solid #111;
	background:#262626;
	padding:5px 4px;
	color:#ccc;
}		
textarea {
	width:98%;
	height:175px;
	overflow:auto;
	font-family:Arial, Helvetica, sans-serif;
	padding:7px 5px;
}
input:focus, 
textarea:focus {
	background:#2e2e2e;
	outline:none;	
}
p.submit {
	margin:0;
	padding:0;
	text-align:right;
}	
#submit {
	width:90px;
	padding:0 20px;
	height:32px;
	line-height:26px;
	border-top:1px solid #111;		
	border-right:1px solid #111;		
	border-bottom:1px solid #777;		
	border-left:1px solid #777;		
	background:url(../images/site/contact-shade.gif) repeat-x;
	color:#ccc;
	font-weight:bold;
	font-style:italic;
	cursor:pointer;		
	text-align:center;		
}
.success {
	clear:both;
	margin:20px 0 0 0;
	background:url(../images/site/tick.png) 0px 2px no-repeat;
	text-indent:20px;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
}
/* error message */
.error {
	/* supply height to ensure consistent positioning for every browser */
	height:15px;
	font-size:11px;
	color:#fff;
	margin:-23px 0 0 -420px;
	color:#C30;
}
.errorPhp {
	clear:both;
	margin:20px 0 0 0;
	background:url(../images/site/cross.png) 0px 2px no-repeat;
	text-indent:20px;
	color:#C30;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
}

/****
#011 Footer
****/
footer {
	font-size:11px;	
	color:#9e9e9e;
	font-family:Georgia, "Times New Roman", Times, serif;
	font-style:italic;
}
footer .floatLeft {
	text-align:left;
}
footer .floatRight {
	text-align:right;
}
