@import "reset.css";
@charset "utf-8";
/* CSS for Alexander Dahlberg's Portfolio 
	Author: Alexander Dahlberg

	Colors Used:

	White			#fff
	Dark Turquoise	#4B8181		top section bg
	Light Turquoise	#79C7C5		menu items bg
	Light Wine Red	#78373F		h4 tag
	

*/


/*
*	Tags
*
************************************/

body {
	font-family: Georgia,"Times New Roman",Times,serif;
	font-size: 62.5%;
	line-height: 1.6em;
	color:#fafafa;
	background-color:#385A61;
}

p {
	line-height: 18px;
	font-size:12px;
	margin-bottom: 18px;
	font-family: Georgia,"Times New Roman",Times,serif;
	color:#fafafa;
}

h2, h3, h4 {
	font-family: "Lucida Grande",Lucida,Verdana,sans-serif;
}

h2 {
	font-size: 18px;
	line-height: 36px;
	margin: 0 0 18px 0px;
	color:#fff;
}

h3 {
	font-size:16px;
	line-height:36px;
	font-weight:bold;
	color: #fafafa; /*#b2e3e1;*/
	margin-bottom:18px;
	letter-spacing: 1.5px;
}

h4 {
	font-size:12px;
	line-height:18px;
	color:#ffdd9b;
	letter-spacing: 2px;
	margin-bottom:18px;
}

/*	Forms 
*****************************************/
input { 
	margin:0 0 18px 0; 
	padding:0px; 
	width:100%; 
	border:1px solid #699594;
}

textarea { 
	margin:0 0 18px 0; 
	padding:0px; 
	width:100%; 
	height: 100px;
	border:1px solid #699594;
}

input#send{ 
	width:108px;
	height:25px;
	/*background:transparent url(../images/buttons.png) no-repeat 0px -148px;*/
	background:#385A61;
	text-align:center;
	margin:0 0 18px 0; 
	padding:0px;
	border:0;
	float:right;
	color:#fff;
	/*border:1px solid #eee;*/
}

input#send:hover{ 
	background:#fff;
	border:1px solid #699594;
	color:#385A61;
}

/* Links
*/
#contentSection a, #contentSection a:link {
	font-family: "Lucida Grande",Lucida,Verdana,sans-serif;
	color: #b2e3e1;
	text-decoration:none;
}
#contentSection a:hover {
	background-color:#78373f;
	padding:2px 0 2px 0;
}
#contentSection a:visited {
	color: #b2e3e1;
}

/*
*	Wrappers / Skeleton
*
************************************/

#wrapper {
	font-size:1.2em;
	width:100%;
}

#topSection {
	background:#4B8181 url(../images/top_bg.jpg) repeat-x 0 0;
	height:53px;
}

#contentSection {
	position:relative;
	background:#385b61 url(../images/content_bg.jpg) repeat-x 0 0;
	padding: 54px 0 0 0;
	/*height:100%;*/
	/*width:100%;*/		/* clear floats hack */
	/*overflow:hidden;*/ /* clear floats hack */
	/*height:607px;*/
}

#scrollWrapper { margin-left:54px; height:500px }


/*
*	Header
*
************************************/

#topSection h1 {
	float:left;
	width:230px;
	height:53px;
	background:url(../images/logo.jpg) no-repeat 0 0;
    text-indent:-10000px;
	position:absolute;
	top:0px;
	left:38px;
}

#topSection h1 a {
	display:block;
	width:230px;
	height:53px;
}

/* Navbar 
*/

#navbar {
	position:absolute;
	left:359px;
	top:23px;
	z-index:1;
}

#navbar ul li { 
	display:block;
	float:left;
	text-align:center;
	position:relative;
}
#navbar ul li a { 
	display:block;
	line-height: 26px;
	margin-right: 20px;
	width: 140px;
	height:30px;
}
#navbar a {
	color: #fff /*#ffdd9b*/;
	text-decoration:none;
	font-size:12px;
}
#navbar a:visited {color:#fff}

#navbar img { 
	vertical-align:middle; 
	margin-right:15px;
	margin-top:-2px;
}

/* Menu Item BG Pane */
#navbar div {
	position:absolute; 
	bottom:0px;
	left:0px;
	background-color: #79C7C5;
	height:5px;
	width:138px;
	border: #fff solid 1px;
	border-bottom:none;
	line-height:0;
	z-index: -1;
}
#navbar div p{ line-height:0; } /* fix min height bug in IE */
#navbar div.active {
	height:30px;
	width:115px;
}


/*
*	Footer
*
************************************/

#footerHills {
	height:64px;
	width:100%;
	background:url(../images/footer_hills.png) repeat-x 0 0 transparent;
	/*background-color:#3C6167;*/
}

#footer {
	font-family: Georgia,"Times New Roman",Times,serif;
	background-color:#79C7C5;
	padding:54px 0 0 40px;
}

/*
#footer {
	background:#385A61;
	text-align:center;
	font-family: "Lucida Grande",Lucida,Verdana,sans-serif;
}*/


#footer p {
/*	padding-top:54px;*/
	line-height:18px;
/*	padding:0;*/
	color:#385A61;
	font-size:12px;
}

#footer a:link, a:visited {
	/*color: #A53235;*/
	color:#fff;
	font-size:12px;
	text-decoration:none;
}

#footer label {
	line-height:18px;
	color:#385A61;
	font-size:12px;
	margin:0;
	padding:0;
}

.footerSection {
	width: 300px;
	float:left;
	padding-right:20px;
}

#footer .about{	background:url(../images/person-icon.png) transparent no-repeat 20px 7px; }
#footer .contact { background:url(../images/email_icon_60.png) transparent no-repeat 0px 10px; }
#footer .twitter { background:url(../images/twitter-icon.png) transparent no-repeat 0px 10px; }

#footer form {
	padding-left:80px;
}

#footer input { 
	margin:0 0 18px 0; 
	padding:0px; 
	width:100%; 
	border:1px solid #699594;
}

#footer textarea { 
	margin:0 0 18px 0; 
	padding:0px; 
	width:100%; 
	height: 100px;
	border:1px solid #699594;
}

#footer input.submit{ 
	width:108px;
	height:25px;
	/*background:transparent url(../images/buttons.png) no-repeat 0px -148px;*/
	background:#385A61;
	text-align:center;
	margin:0 0 18px 0; 
	padding:0px;
	border:0;
	float:right;
	color:#fff;
	/*border:1px solid #eee;*/
}

#footer input.submit:hover{ 
	background:#fff;
	border:1px solid #699594;
	color:#385A61;
}
.footerSection:first-child {
	padding-left:20px;
}

.footerSection h3 {
	padding-left:80px;
}

.footerSection p {
	padding-left:80px;
}

#copyright {
	font-size: 10px;
	color:#385A61;
	margin:0;
	clear:both;
	text-align:center;
}


/*
*	Common Content
*
************************************/

.pageButton {
	width:110px;
	height:27px;
	background:transparent url(../images/buttons.png) no-repeat 0px -148px;
	text-align:center;
	margin-top:4px;
	margin-left:20px;
}

.pageButton a, .pageButton a:link, .pageButton a:visited {
	width:110px;
	height:27px;
	display:block;
	line-height:27px;
	color:#fff !important;
	border-color:#fff !important;
	text-decoration:none;
	font-size:12px;
	font-weight:bold;
	padding:0;
}
.pageButton a:hover { background-color:transparent !important; padding:0 !important; }

/*
*	Page: Selected Work
*
************************************/

#shout { margin: 0 0 50px 120px; background:#385b61; padding: 10px; width: 760px; height: 117px }
#shout img { float:left; padding-right: 10px }
#shout p { margin: 0 }
#heightfixer { height: 1200px }

/*  scrollable  */

div#scrollable {
	margin:0 34px;
	width: 780px;
	height: 482px;
	overflow:hidden;
	position:relative;
	float:left;
}

div#scrollable div#work-items {
	position:absolute;
	width: 20000em;
}

div#scrollable div#work-items div.item {
	float:left;
	width:780px;
}

div#scrollable div#work-items img {
	border:#c1c1c1 1px solid;
}

div#scrollable div#work-items div div.itemInfo{
	width:298px !important;
	float: left;
}

div#scrollable div#work-items div p{
	padding-left:20px;
}

.slideController {
width:32px;
height:36px;
display:block;
margin:154px 0px 0px 0px;
padding:0px;
float:left;
}
.slideController a{
height: 36px;
width: 32px;
display: block;
border: 0;
text-indent: -9999px;
background-image:url(../images/buttons.png);
background-repeat:no-repeat;
padding:0;
}
.slideController a:hover{ background-color:transparent !important; padding:0 !important;} /* remove background color */

.prevItem a {background-position:0px 0px;}
.nextItem a {background-position:0px -74px;}
.prevItemHover a{ background-position: 0px -37px; }
.nextItemHover a{ background-position: 0px -111px; }

/*div#scrollable div#work-items .viewSite {
	width:110px;
	height:27px;
	background:transparent url(../images/buttons.png) no-repeat 0px -148px;
	text-align:center;
	margin-top:4px;
	margin-left:20px;
}

div#scrollable div#work-items .viewSite a {
	width:110px;
	height:27px;
	display:block;
	line-height:27px;
	color:#fff;
	text-decoration:none;
	font-size:12px;
	font-weight:bold;
	padding:0;
}
div#scrollable div#work-items .viewSite a:hover { background-color:transparent !important; padding:0 !important; } *//* remove background color */


/*div#scrollable div#work-items*/ .viewSiteHover { background-position:0px -176px }


/*
*	Page: Contact
*
************************************/

.contactForm {
	width: 350px;
}

.contactForm label {
	color: #fff;
}

.loading {
	width:16px;
	height:11px;
	background-image:url(../images/ajax-loader.gif) transparent no-repeat top left;
}

form div.success {
	text-align:right;
	/*background:#ffdd9b;*/
	padding:5px;
	display:none;
	/*color:#385A61;*/
	font-size:12px;
}

form div.error {
	padding: 5px;
	background:#A53235;
	color:#fff;
	margin-bottom: 5px;
	display:none;
	font-size:12px;
}

/* general stuff */
/***************/
.mB0 { margin-bottom: 0 }
.sizeMe { font-size: 12px; color:#FFFFFF }

/* build stuff */
/***************/

#message {width:950px; height:517px; margin-top: 60px; padding-left: 120px; font-size: 14px; line-height: 18px; }
#message div {
	text-align:left;
	font-family:Verdana, Arial, Helvetica, sans-serif;
}
#message h2 {
	font-size:21px;
	line-height: 36px;
}
#message p {
	font-size:14px;
	line-height: 18px;
}

.fakeImage { width: 460px; height: 300px;  background:#999;}
.floatLeft {float:left}
.floatRight {float:right}
.clear {clear:both}
.marginRight{margin-right:20px;}

#screenWidth{width:1024px; height:5px; background-color:#993333;}