@charset "utf-8";
/* CSS Document */

html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{
	border:0 none;
	font-family:inherit;
	font-size:100%;
	font-style:inherit;
	font-weight:inherit;
	margin:0;
	padding:0;
	vertical-align:baseline;
}

html, body{
	height: 100%;
}

body{
	background: transparent url(images/background.jpg) repeat scroll 0;
}

a{
	text-decoration: none;
	outline: none;
	color: #666;
}

textarea{
	resize: none;	
}

#main_container{	
	display: block;
	width: 960px;
	min-height: 100%;	
	border-left: 2px solid #ccc;
	border-right: 2px solid #ccc;
	margin: 0 auto;
	position: relative;
}

#header{
	display: block;
	width: 100%;	
	height: 100px;
	position: relative;
}

#subheader{
	display: block;
	width: 50%;
	height: 100px;
	float: right;	
}

.kravitz{
	/*color: #81c11d;	*/
	color: #084176;
}

#title{
	display: block;
	font-size: 100px;
	margin-left: 15px;
	position: absolute;
	top: -10px;
}

#topnavbar{
	display: block;
	background: transparent url("images/topnavbar.png") no-repeat scroll center;
	width: 292px;
	height: 26px;
	float: right;
	margin-right: 18px;
	position: relative;
}

#topnav-style{
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	list-style: none;
	z-index: -10;
}

#topnav-style li{
	display: block;
	float: left;
	height: 24px;
}

#topnav-style li#home-link{
	width: 59px;
}

#topnav-style li#about-link{
	width: 86px;
}

#topnav-style li#portfolio-link{
	width: 75px;
}

#topnav-style li#contact-link{
	width: 71px;
}

#skills{
	display: block;
	float: right;
	width: 100%;
}

#skills ul.kravitz{
	list-style: none;
	font-size: 23px;
	margin-left: 12px;
	position: absolute;
	bottom: 25px;
}

*+html #skills ul.kravitz{
	bottom: 16px;	
}

#skills ul li{
	display: block;
	float: left;	
	margin-right: 10px;
}

#content{
	display: block;
	width: 100%;
}

#left-col{
	display: block;
	width: 460px;
	float: left;
}

#right-col{
	display: block;
	float: left;
}

#intro{
	display: block;
	width: 420px;
	margin-top: 40px;
	padding: 20px;
}

.highlighted{
	font-size: 30px;	
	color: #686a6b;
	margin-bottom: 20px;
}

#intro_text{
	font-size: 22px;
	color: #a2a3a3;
}

#intro_text p .cufon{
	display: block;
	padding: 2px 0;
}

.emphasis{
	display: inline-block;
	font-size: 25px;
	color: #666;
}

.emphasis a:hover{
	color: #084176;
}

#designs{
	display: block;	
	margin-top: 25px;
}

#portfolio-blk{
	display: block;
	width: 450px;
	min-height: 300px;
	padding-left: 28px;
	margin: 18px 0;
	border-left: 2px solid #CCC;
}

#portfolio-content{
	display: block;
	width: 406px;
	min-height: 300px;
	background: transparent url(images/portfolio-bkg.png) repeat scroll 0;	
	margin: 0 2px;
	float: left;
}

#designbox{
	display: block;
	width: 390px;
	height: 284px;
	margin: 8px 7px;
	border: 1px solid #686A6B;
	overflow: hidden;
}

#designbox ul li{
	overflow: hidden;	
	width: 390px;
	height: 284px;
}

#designbox ul li img{
	width: 390px;
	height: 284px;		
}

.portfolio-nav a{
	display: block;
	width: 20px;
	height: 300px;
	outline: none;
}

/*#d-right .portfolio-nav a{
	background:transparent url(images/d-right.png) no-repeat scroll left;
}

#d-left .portfolio-nav a{
	background:transparent url(images/d-left.png) no-repeat scroll right;
}*/

#d-left{
	background: transparent url(images/arrowleft.png) no-repeat scroll right; 	
	float: left;
}

#d-right{
	background: transparent url(images/arrowright.png) no-repeat scroll left; 	
	float: left;
}

.heading{
	color: #686A6B;
	font-size: 20px;
}

#left-col .heading{
	padding-left: 20px;
}

#right-col .heading{
	padding-left: 50px;
}

#music{
	display: block;	
	margin-top: 40px;
}

*+html #music{
	margin-top: 42px;	
}

#music-wrapper{
	display: block;	
	margin-left: 48px;
	margin-top: 18px;
}

#photography{
	display: block;
	margin-top: 41px;
}
	
#photography-block{
	display: block;
	height: 120px;
	margin-top: 18px;
	margin-left: 28px;
}

#p-left{
	background: transparent url(images/arrowleft-sml.png) no-repeat scroll right; 	
	float: left;
}

#p-right{
	background: transparent url(images/arrowright-sml.png) no-repeat scroll left; 	
	float: left;
}

.photography-nav{
	display: block;
	width: 20px;
	height: 120px;
}

.scrollable{
	display: block;
	background: transparent url(images/portfolio-bkg.png) repeat scroll 0;
	height: 120px;
	width: 406px;
	margin: 0 2px;
	overflow: hidden;
	position: relative;
	float: left;
}

#photobar{
	display: block;	
	width: 20000em;
	clear: both;
	position: absolute;
}

#photobar a{
	float: left;
	display: block;
	overflow: hidden;
	width: 126px;
    height: 106px;
	margin: 6px 1px 6px 5px;
	border: 1px solid #686A6B;
}

#photobar img{
	width: 126px;
    height: 106px;
}

#contact{
	display: block;
	margin: 40px 0 30px 0;
}

*+html #contact{
	margin-bottom: 0px;	
}

#contactform{
	display: block;
	width: 428px;
	margin-top: 18px;
	position: relative;
}

#contactform span{
	display: block;
	background-color: #666;
	/*background: transparent url(images/portfolio-bkg.png) repeat scroll;*/
}

*+html #contactform span{
	position: relative;	
}

#contactform #name_block, #contactform #email_block{
	height: 24px;
	width: 300px;
}

#contactform #message_block{
	height: 88px;
	width: 428px;
}

#contactform label{
	display: block;
	width: 100px;	
	float: left;
	padding: 4px 10px 0 0;
	text-align: right;
	color: #CCC;
}

#contactform input{
	display: block;	
	float: left;
	height: 14px;
	border: none;
	background: transparent url(images/portfolio-bkg.png) repeat scroll;
	margin-top: 4px;
	color: #CCC;
	width: 178px;
}

*+html #contactform input{
	position: absolute;
	bottom: 4px;
	right: 10px;
}

#contactform textarea{
	overflow: hidden;
	width: 305px;
	border: none;
	margin: 4px 0 0 -5px;
	background: transparent url(images/portfolio-bkg.png) repeat scroll;
	color: #CCC;
	height: 76px;
}

#contactform input#submitbutton{
	display: block;
	width: 100px;
	height: 64px;
	background: transparent url(images/send.png) repeat scroll;
	position: absolute;
	top: 0px;
	right: 0px;
	margin: 0px;
	color: #666;
	font-size: 28px;
	font-weight: bold;
	font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
	border: 2px solid #666;
	outline: none;
}

*+html #contactform input#submitbutton{
	
}

#contactform input#submitbutton:hover{
	border: 2px solid #999;	
	cursor: pointer;
}

*+html #submitbutton{
	display: block;
	width: 100px;
}

#testimonial{
	display: block;
}

*+html #testimonial{
	margin-top: 8px;	
}

/*#testimonial-box{
	display: block;
	width: 408px;
	height: 144px;
	margin-left:20px;
	margin-top:18px;
	background: transparent url(images/testimonialbox.png) no-repeat scroll left;
}*/

#testimonial-box {
background:#666666 none repeat scroll 0 0;
display:block;
height:120px;
margin-top:18px;
width:428px;
}

#testimonial-content{
	display: block;
	padding: 8px 16px 8px 20px;
	font-size: 14px;
	width: 390px;
	height: 92px;
	color: #CCC;
}

#testimonial-content .cufon{
	padding: 2px 0;
}

#client-name{
	font-style: italic;
	font-weight: bold;
	color: #FFF;
	float: right;
	clear: both;
	margin: 5px 10px;
}

#social{
	display: block;
	margin: 50px 0 0 48px;
	width: 410px;
	height: 45px;
	background: transparent url(images/portfolio-bkg.png) repeat scroll;
	border-bottom: 1px solid #999;
}

*+html #social{
	margin-top: 56px;	
}

#social_title{
	display: block;
	font-size: 25px;
	border-right: 1px solid #999;
	float: left;
	color: #666;
	padding: 10px 20px;
}

*+html #social_title{
	font-size: 22px;	
}

#social_icons{
	padding-left: 20px;
	float: right;
}

#social_icons img{
	display: block;
	margin: 10px 20px 0 0;
	width: 24px;
	height: 24px;
	float: left;
}

#footer-front{
	height: 20px;
	background: transparent url(images/portfolio-bkg.png) repeat scroll;
}

#footer{
	width: 100%;
	height: 65px;
	position: absolute;
	bottom: 0px;
}

#footer #social{
	margin: 0 40px 0 0;	
	float: right;
	height: 44px;
}

#footer_disclaimer{
	height: 20px;
	background: transparent url(images/portfolio-bkg.png) repeat scroll;
	clear: both;
}

#footer_content{
	display: block;
	padding-top: 4px;
	float: left;
	margin-left: 20px;
	font-size: 12px;
	line-height: 12px;
	color: #333;
}

*+html #footer_content{
	padding-top: 2px;	
}

.shadow{
	-moz-box-shadow: 1px 1px 6px #999;
	-webkit-box-shadow: 1px 1px 6px #999;	
}

.portfolio_shadow{
	-moz-box-shadow: 0px 0px 8px #999;
	-webkit-box-shadow: 0px 0px 8px #999;		
}

#about_left_col{
	width: 38%;	
	min-height: 460px;
	float: left;
	margin-top: 50px;
}

#about_right_col{
	width: 60%;
	min-height: 460px;
	border-left: 2px solid #ccc; 
	float: right;
	margin: 50px 0 140px 0;
}

.contact #about_right_col{
	margin-bottom: 0px;	
}

#about_message{
	padding: 20px;	
	width: 340px;
	text-align: right;
}

#about_details{
	padding: 20px;
}

#detail_section{
	margin-bottom: 60px; 	
}

*+html #detail_section{
	margin-bottom: 30px; 	
}

.about_section{
	display: block;
	width: 100%;
	float: left;
	clear: both;
}

.detail_item{
	display: block;
	width: 100%;
	clear: both;
	font-size: 18px;
	color: #666;
	line-height: 18px;
}

.detail_item label{
	display: inline-block;
	float: left;
	width: 24%;
	padding: 10px 0;
	color: #084176;
}

.detail_item .details{
	display: inline-block;
	float: left;
	width: 70%;
	padding: 10px 0;
}

*+html .detail_item .details, *+html .detail_item label{
	padding: 0px;	
}

#about_details #detail_section .cufon{
	padding: 3px 0;	
}

#about_details #contact{
	margin: 0px;
}

.section_header{
	font-size: 30px;
	line-height: 30px;
	font-weight: bold;
	color: #666;
}

.contact_item{
	display: block;
	width: 100%;
	clear: both;
	font-size: 18px;
	color: #666;
	line-height: 18px;
}

.contact_item label{
	margin-right: 20px;
	color: #084176;
}

#about_details #contactform #message_block{
	height: 200px;
}

#about_details #contact #contactform #message_block textarea{
	height: 188px;
}

#content.portfolio{
	padding: 50px 0;
}

.portfolio-block{	
	margin-bottom: 40px;
	padding: 0 20px;
	float: left;
	clear: both;
}

.portfolio-content{	
	padding: 20px 0;
	clear: both;
}

*+html #photo-block .portfolio-content{
	width: 920px;	
}

.portfolio-column{	
	float: left;
	margin-right: 40px;
	width: 262px;
}

.portfolio-item{	
	width: 258px;
	border: 2px solid #CCC;
	background: transparent url(images/portfolio-bkg.png) repeat scroll 0 0;
	margin-bottom: 30px;
}

.portfolio-item img{	
	width: 240px;
	padding: 8px;
	border: 1px solid #BBB;
}

.item-content{	
	padding: 10px;
}

.item-content h3{	
	margin-bottom: 10px;
	font-size: 14px; 
	font-weight: bold;
	color: #084176;
}

h3 a{
	color: #084176;
}

.item-content p{	
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	padding: 5px;
	font-size: 12px; 
	background: transparent url(images/portfolio-bkg.png) repeat scroll 0 0;
}

.item-content p .cufon{
	padding: 2px 0;
}

#photo-block .portfolio-column{	
	float: left;
	margin-right: 30px;
	width: 200px;
}

#photo-block .portfolio-item{	
	width: 196px;
}

#photo-block .portfolio-item img{	
	width: 196px;
	padding: 0px;
	border: none;
}

span.portfolio-header{
	font-size: 30px;
	color: #666;
	display: block;
	border-bottom: 5px solid #CCC;
	width: 900px;
	cursor: pointer;
}

.help{
	display: block;
	float: right;	
	color: #666;
	margin-right: 40px;
	font-size: 12px;
}

#content.contact{
	padding-bottom: 100px;	
}


/*admin panel*/

#image_block{
	width: 100%;
	position: relative;
	height: 100%;
	margin: 50px 0;
}

#image_edit{
	position: absolute;
	left: 0px;
	top: 40px;
}

#preview{
	position: absolute;
	right: 0px;
	top: 40px;
}

#cropform{
	position: absolute;
	top: 0px;
	left: 20px;
}

.panel{
	margin: 40px;	
}

#cropform span{
	margin-right: 20px;	
	float: left;
}

#cropform span input{
	width: 200px;
}

#content.admin{
	position: relative;	
}

#logout{
	position: absolute;
	top: 0px;
	right: 40px;
}

#confirm_dialogue{
	margin-left: 40px;
}
