/*-------------------------------------------------------
* Filename: styles.css
* Version: 1.0.0
* Website: http://www.themeflash.com
* Author: system32
* Description: Handles the site layout.
-----------------------------------------------------*/

/* Global Reset
------------------------------------------------------*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font,img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { 
	margin: 0; 
	padding: 0; 
	border: 0; 
	outline: 0; 
	font-weight: inherit; 
	font-style: inherit; 
	font-size: 100%; 
	font-family: inherit;  
}   

body{  
	font:normal 11px/20px  Tahoma, "Trebuchet MS", Arial, sans-serif;
	color:#b0b0b0;
	background:#18191b url(../images/bg.jpg) top center; 
}

.clear {
	clear:both; 
}

.fr	{
	float:right;
}

.fl{
	float:left;
}

.imgleft{
margin-right:20px;
margin-bottom:20px;
}

.imgright{
margin-left:20px;
margin-bottom:20px;
}
/*******************
Scroll
********************/

 #pane1  {	width:720px; height:460px;}
 #pane2  {	width:720px; height:460px;}
 #pane3  {	width:720px; height:460px;}
 #pane4  {	width:720px; height:460px;}
 #pane5  {	width:720px; height:460px;}
 #pane6  {	width:720px; height:460px;}

.left .jScrollPaneTrack 		{	left: 0;right: auto;}
	.left a.jScrollArrowUp 		{	left: 0;right: auto;}
	.left a.jScrollArrowDown 	{	left: 0;right: auto;}


/*******************
HEADINGS 
********************/
h1{
	margin:0;
	padding: 0px 0 0 0px;
	color:#18191b;
	font:normal 28px/34px "Trebuchet MS", Tahoma, Arial, sans-serif;
	letter-spacing:-1px;
}

h2{
	margin:0;
	padding:0px;
	color:#18191b;
	font:normal 25px/30px "Trebuchet MS",Tahoma, Arial, sans-serif;
	letter-spacing:-1px;
}
h3{
	padding:0px;
	color:#18191b;
	font:normal 22px/28px "Trebuchet MS",Tahoma, Arial, sans-serif;
	letter-spacing:-1px;
	
}
h4{
	margin:0;
	padding:0px;
	color:#18191b;
	font:normal 18px/22px "Trebuchet MS",Tahoma, Arial, sans-serif;
	letter-spacing:0px;
}

h5{
	margin:0;
	padding:0px;
	color:#18191b;
	font:normal bold 12px/20px "Trebuchet MS",Tahoma, Arial, sans-serif;
}
h6{
	margin:0;
	padding:0px;
	color:#18191b;
	font:normal bold 10px/16px "Trebuchet MS",Tahoma, Arial, sans-serif;
}

p{
	font:normal 11px/20px  Tahoma, "Trebuchet MS", Arial, sans-serif;
	color:#18191b;
	margin:0 0 10px 0;

}

a{
	text-decoration:none;
	color:#18191b;
}
a:hover{
	color:#515151; 
	 	text-decoration:none;
	 
}

a.readmore{
	color:#fff; 
	background:#18191b;
	border:1px solid #343539;
	font-size:9px;

	padding: 4px 10px;
	text-decoration:none;
	text-transform:uppercase;
}
a.readmore:hover{
	text-decoration:none;
	color:#fff;
	padding: 4px 10px;
	border:1px solid #343539;
	background:#9f9f9f;
}

/*************************
header
************************/
#pagewrap{
	width:800px;
	margin-right:auto;
	margin-left:auto;
}

.header{
	width:780px;
	height:150px;
	margin:7px;
	text-align:center;
	}

	.header img.logo{
	margin:10px 0;
	}

#main_background{ 
	background:	url(../images/bg2.png) 0 0 no-repeat;
	width:788px;
	position:relative;
	display:block;
	height:500px;
	margin-left:auto;
	margin-right:auto;
	}
	
.social_links{
	height:38px;	 
	margin:10px 10px 0 0;
	text-align:right;
}
/****************************
		menu
*****************************/
.home, .headshots, .reels, .resume, .about, .contact {
	background: transparent url(../images/menucontent.png) no-repeat;
	border:0px none;
	display: block;
	float: left;
	height: 27px;
}
.home {
	background-position: 0px 0px;
	width: 90px;
}

.home:hover, .home.jFlowSelected {
	background-position: 0px -27px;
		width: 90px;
}
.headshots {
	background-position: -89px 0px;
		width: 173px;
}
  .headshots:hover, .headshots.jFlowSelected {
	background-position: -89px -27px;
		width: 173px;
}
.reels {
	background-position: -262px 0px;
		width: 103px;
}
  .reels:hover, .reels.jFlowSelected {
	background-position: -262px -27px;
		width: 103px;
}
.resume {
	background-position: -365px 0px;
		width: 125px;
}
  .resume:hover, .resume.jFlowSelected{
	background-position: -365px -27px;
		width: 125px;
}

.about {
	background-position: -490px 0px;
		width: 105px;
}
  .about:hover, .about.jFlowSelected{
	background-position: -490px -27px;
		width: 105px;
}

.contact {
	background-position: -595px  0px;
		width: 125px;
}
  .contact:hover, .contact.jFlowSelected {
	background-position: -595px -27px;
		width: 125px;
}


	

/*************************
content
************************/
.content{
	padding:30px;
	}
	.content h3 {
			margin-bottom:10px; 
			color:#343434;
			}
	.content h4 {
			margin-bottom:10px; 
			color:#343434;
			}
		
/*************************
footer
************************/

.footer{
	width:537px;
	height:40px;
	padding-top:12px;
	background:url(../images/footer.png) top center;
	color:#a4a4a1;
	margin:auto;
	text-align:center; 
	}
	
/*************************
workspage
************************/

.imgborder {
	border:1px solid #424547;
	padding:3px;
}

.panel {
	clear:both;
	display:block;
	width:100%;
	overflow:hidden;
	height:100%;
	margin:10px 0;
	padding:10px 0;
	border-bottom:1px solid #424547;
}
.thumb {
	width:250px;
	float:left;
	margin:0 30px 0px 0;
}
.details {
	width:360px;
	float:center;
}

/*************************
contact page
************************/

.location {
	float:left;	
	width:45%;
}



#contactarea {
	width:340px;
	margin:0px auto;
	margin-right:10px;
	text-align:left;
	padding:5px;
	float:left;
}

.inputbox {
	border: 1px solid #424547;
	background:#fff;
	width: 270px;
	color:#18191b;
	margin:2px 0;
	padding: 4px;
}

.inputlabel {
	width:100px;
	color:#18191b;
	display:inline-block;
}

#textarea {
	border: 1px solid #424547;
	background:#fff;
	color:#18191b;
	width:270px;
	margin:2px 0;
	padding: 4px;
}

#submitbutton {
	border: 1px solid #424547;
	background:#18191b;
	margin:2px 0;
	color:#fff;
	padding: 4px;
	cursor:pointer;
}
/************************************************
                      Definition List                  
************************************************/
 dl { 
 	padding: 0;
	color:#18191b; 
	}
	dt { 
	float: left; 
	clear: left; 
	width: 70px; 
	text-align: left; 
	font-weight: bold; 
	} 
	dt:after { 
	content: " "; 
	} 
	dd:before { 
	content: " : "; 
	padding-left:0px;
	} 
	dd { 
	margin: 0 0 0 80px; 
	padding: 0 0 1px 0; 
	}


/*******************************************************
  				Error / Success / Notice	
*******************************************************/

.notes 	{background: #f0f0f0;border: 1px solid #b8b8b8;}
.success 	{background: #ccfcd1;border: 1px solid #60a400;}
.error	{background: #f9e3e3;	border: 1px solid #e79e9e;}
.notice 	{background: #fcf0cc;border: 1px solid #ecc735;}
	.notes, .notice, .success, .error 
		{font-size: 100%;color:#484848;padding:10px;width:auto;margin: 0 0 20px 0px; text-align:left}
	.notes span, .notice span, .success span, .error span 
		{font-weight: bold;font-size: 1.2em;padding: 2px 40px;}
	.notes p, .success p, .error p, .notice p 
		{margin: 0px;padding: 0px 40px;}



/* SLIMBOX */

#lbOverlay {
	position: fixed;
	z-index: 9999;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	cursor: pointer;
}

#lbCenter, #lbBottomContainer {
	position: absolute;
	z-index: 9999;
	overflow: hidden;
	background-color: #fff;
}

.lbLoading {
	background: #fff url(loading.gif) no-repeat center;
}

#lbImage {
	position: absolute;
	left: 0;
	top: 0;
	border: 10px solid #fff;
	background-repeat: no-repeat;
}

#lbPrevLink, #lbNextLink {
	display: block;
	position: absolute;
	top: 0;
	width: 50%;
	outline: none;
}

#lbPrevLink {
	left: 0;
}

#lbPrevLink:hover {
	background: transparent url(prevlabel.gif) no-repeat 0 15%;
}

#lbNextLink {
	right: 0;
}

#lbNextLink:hover {
	background: transparent url(nextlabel.gif) no-repeat 100% 15%;
}

#lbBottom {
	font-family: Verdana, Arial, Geneva, Helvetica, sans-serif;
	font-size: 10px;
	color: #666;
	line-height: 1.4em;
	text-align: left;
	border: 10px solid #fff;
	border-top-style: none;
}

#lbCloseLink {
	display: block;
	float: right;
	width: 66px;
	height: 22px;
	background: transparent url(closelabel.gif) no-repeat center;
	margin: 5px 0;
	outline: none;
}

#lbCaption, #lbNumber {
	margin-right: 71px;
}

#lbCaption {
	font-weight: bold;
}


/*Sample CSS for the demo boxes below. Refined from rssdisplaybox.css above*/

#cssdriveid{
width: 800;
padding: 10px;
border: 0px;
}

#cssdriveid .rsscontainer{ /*Style for RSS item body within #cssdriveid box*/
margin-bottom: 1em;
}

#bbcid{
width: 300px;
padding: 5px;
background-color: lightyellow;
border: 1px dashed black;
}

#bbcid-paginatediv{ /*Style for auto generated pagination DIV pertaining to #bbcid RSS box*/
width: 300px;
}

#nytimesid{
width: 250px;
height: 200px;
padding: 5px;
background-color: #EDFFD2;
border: 1px solid black;
}

#nytimesid .rsscontainer{ /*Style for RSS item body within #nytimesid box*/
margin-bottom: 10px;
}

#nytimesid .rsscontainer .rsstitle{ /*Style for RSS titles within #nytimesid box*/
font-weight: bold;
}

#nytimesid .rsscontainer .rssdate{ /*Style for RSS dates within #nytimesid box*/
color: red;
}

#cssnewsbox{ /*Style for RSS box for #cssnewsbox box (last demo)*/
width: 500px;
height: 310px;
padding: 10px;
border: 1px dashed black;
}

#cssnewsbox .rsscontainer{
margin-bottom: 1em;
}

