/*
 *
 *	Michelle Rajunov
 *	portfolio css
 *	Date Created: 	Feb 28 2009
 *	Date Modified: 	March 30 2010
 *
 *	colors:
 *	#F1F4F4;	- lighter grey
 *	#D1D9DC;	- light grey
 *	#959EA1;	- grey
 *	#516064 	- dark blue grey
 *	#405156;	- darker grey
 * 	#20292B;	- darkest grey
 *	#B22F2F;	- reddish
 */

* { 	margin: 0; padding:0; outline: 0; }

body { 	font-family:"HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, arial, sans-serif; 
		    font-weight: 200; }

ul,li { 	list-style-type: none; }
a { 		text-decoration: none;  }
a:hover { 	cursor: pointer;}
img {	 	}
h1{		 	font-size: 66px; 	letter-spacing: -1px; }
h1,h2,h3,h4{font-weight: 100;}
div.clear { margin: 0 auto; 	clear: both; }

#header { 				height: 150px; 		min-width: 850px;	}
#header	{				  width: 1000px; 		max-width: 100%;  }		/* IE */
body > div#header {	width: 100%;}								/* non IE */

div.absolute{	position: absolute; top: 10px; right: 20px;}

#header .name{			float: left;	width: 350px;		margin: 10px 0px 0 50px;	padding-bottom: 35px;}
#header .name h1{		font-size: 96px;	font-weight: 200;}
#header .name h1 span{	display: block; font-size: 50px; }
#header .name h1 span{	margin: 0 0 -43px 110px; }			/* IE */
body > #header .name h1 span{	margin: 0 0 -50px 100px; }	/* non IE */
#header .name h2{		width:300px;	margin: -25px 0 0 108px;	font-weight: 200;}
#header ul.main-nav { 			float: right;	}
#header ul.main-nav li { 		float: left; 		padding: 70px 0 0;	width:150px;	display: block; }
#header ul.main-nav li a { 		font-size: 32px;	padding: 3px 0px;  	  	}
#header ul.main-nav li a.selected:hover{	border-bottom: 0;}
#header ul.main-nav li a.active {}

#header ul.nav {	padding-top: 10px;		text-align: left; 	float: left;	min-width: 200px;}
#header ul.nav li{	padding: 0 20px 20px 0;	width: auto;		float: left;	height: auto; 		}			
#header ul.nav li a{font-size:14px;			padding: 4px 7px;	-moz-border-radius: 4px; -webkit-border-radius: 4px;}
#header ul.nav li a:hover{	border-bottom: 0;}
#header ul#nav-home{width: 460px; position: relative; right: 80px;}

#main{			width: 970px;		margin:0 auto;	position:relative;	}
#content { 	width: 970px;  height: 450px; 	position: relative;	top: -20px; overflow: auto;	margin: 0 auto; clear: left; }
#content div.panel{ width: 970px;	height: 400px;	position: relative;	 float: left;		}
#content h1 { 	 		font-size: 48px; margin: 2px 0;	width: 620px; text-align: center;
	font-family:"HelveticaNeue-UltraLight", "Helvetica Neue Ultra Light", "Helvetica Neue", Helvetica, arial, sans-serif; }
.scrollContainer{ }
#content .display { 	float: left;		position: relative;		text-align: right;}
#content .sidebar { 	float: right;  	  	width: 270px; 			padding: 10px 20px;		margin: 10px 0;
						-moz-border-radius: 8px; -webkit-border-radius: 8px;}
#content .sidebar h2 { 	font-size: 28px; 	margin-bottom: 3px;  }
#content .sidebar h3{	font-size: 14px; 	font-variant: small-caps;	}
#content .sidebar p{ 	font-size: 12px; 	line-height: 20px; 	margin-bottom: 7px;}
#content .sidebar p a{	border-bottom: 1px dashed #6A797D;}
#content .sidebar p a:hover{	border-bottom: 1px dashed #B22F2F;}
#content .display img{	width: 605px;	height: 305px;	margin: 17px;}
#content .display span{	width: 620px;   height: 320px;	position:absolute;	display: block;	top: 10px; left: 10px;	
		background: transparent url(../img/round_frame2.png) 0 0 no-repeat;  }						
#content .pager{			margin: -10px 30px 10px;}	/* IE 6 */
* + html #content .pager{	padding: 10px 0px 40px;} 	/* IE 7 only */
#main > #content .pager{	margin: -17px 30px;}	   	/* Non IE */
#content .pager li{		margin: 0 3px;	display: inline; 	padding: 3px 0;	font-size: 12px;}
#content .pager li a{	padding: 3px;	}
#content .pager li:hover{ cursor:hand;}

.scrollButtons{				position: absolute;	 top: 250px;	cursor: pointer;	z-index: 50;}
.scrollButtons.left{	left: -20px;}
.scrollButtons.right{	right: -30px;}

#footer{	height: 100px;}

#contact_form{				margin: 50px 20px 0;}
#contact_form span{		z-index: -1;}
#contact_form fieldset{	border: 0;		width: 540px;}
#contact_form input, 
#contact_form textarea{	width: 400px;	padding: 3px;	margin: 5px;	
		float: left;	clear: right;	border: 2px solid #405156;	}
#contact_form input:focus, #contact_form textarea:focus{		border-color: #B22F2F;}
#contact_form label{	width: 100px;	padding: 3px;	margin: 5px; 
		float: left;	clear: left; 	text-align: right;}
#contact_form button{	float: right;	clear: both;	margin: 10px 10px 0 0; 	width: 70px;	}
#contact_success{		width: 400px;	margin: 40px 0px 0 130px;	padding: 10px;	border: 2px solid #B22F2F; text-align:center;}
		