/*
Theme Name: Ashley Koontz Theme
Theme URI: http://ashleykoontz.com
Description: portfolio theme for ashleykoontz.com
Version: 1.6
Author: Ashley Koontz
Author URI: http://ashleykoontz.com/
*/

/* =0 Reset
--------------------------------------------------------------------------------------------------------------------------------------*/
@import url('lib/reset.css');
@import url('lib/typography.css');
@import url('lib/forms.css');
@import url('colorbox.css');
/* =1 Global/Main Structure
--------------------------------------------------------------------------------------------------------------------------------------*/
html {margin:0; padding:0;}

body {
	vertical-align: top;
	color: #452858;
	background: #dbb35a url('images/bg-body.jpg') no-repeat top center;
	margin:0px;
	padding:0px;
}

html, body { height: 100%; }

.hidden {display:none;}
.right {float: right;}
.left {float: left;}
.hide {display: none;}
.clear {clear: both;}
.bold {font-weight:bold;}
.italic {font-style:italic;}
.underline {border-bottom:1px solid;}
img.centered {display: block;margin-left: auto;margin-right: auto;}
img.alignleft {float:left;margin:4px 10px 4px 0;}
img.alignright {float:right;margin:4px 0 4px 10px;}

.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
.clearfix {
	display: block;
}
html[xmlns] .clearfix {
	display: block;
}
* html .clearfix {
	height: 1%;
}

#wrap{
	margin: 0 auto;
	width: 100%;
	position: relative;
}

#container{
	margin: 0 auto;
	width: 980px;
	position: relative;
	text-align:left;
}

/* =2 Links
--------------------------------------------------------------------------------------------------------------------------------------*/
a:link, a:visited{color: #452858; text-decoration:none;}
a:hover, a:active{color: #8a36a2; text-decoration:none;}



/* =3 Headings
--------------------------------------------------------------------------------------------------------------------------------------*/
p {font-family:Arial, Helvetica, sans-serif; color:#FFFFFF; font-size:10pt; line-height:1.3em;}
h1 {color: #452858;}
h2 {color: #452858;}
h3 {color: #452858; font-weight:lighter; font-size:14pt;}
h4 {color: #452858;}
h5 {color: #452858;}


/* =4 Header
--------------------------------------------------------------------------------------------------------------------------------------*/
	#header{background: transparent url('images/top-runner.png') repeat-x center top; position:relative; height:133px;margin: 0 0 15px 0;z-index: 10;}
		#header .container {margin:0 auto;padding:0 0 0;width:980px;position:relative;text-align:left;}
		#header h1{float:left;width:182px;margin:16px 0 0 0;}
		#header a.contact{position:absolute;top:0;right:0;display:block;width:123px;height:29px;background: transparent url('images/header_contact-btn.gif') no-repeat top left;text-indent:-9999px;}
	
		#logo {float:right;}

/* =5 Navigation
--------------------------------------------------------------------------------------------------------------------------------------*/

	#nav{position:relative;clear:both;height:50px;}
		#nav .wrap{margin:0 0 0 0;padding:0 8px 0 0;height:50px;}
		#nav ul{background: transparent url('images/nav_bg-runner_new.png') repeat-x top left;height:67px;margin:0;padding:0 0 0 0;list-style:none;float: left;width:980px;/* <-- 960 - margin+padding of above container */}
		#nav li{float:left;height:67px;position: relative;}
		#nav li a:link, #nav li a:visited{display:block;color:#fff;text-transform:uppercase;background: transparent url('images/sprites.png') no-repeat top left;text-indent:-9999px;width:146px; height:50px; margin-top:10px; margin-left:13px;}
		#nav li a:hover, #nav li a:active{color:#ffd400;text-decoration:none;}
				#nav li.work a:link, #nav li.work a:visited{width:160px;background-position: top left;}
				#nav li.work a:hover, #nav li.work a:active{background-position: 0px -49px;}
					
				#nav li.bio a:link, #nav li.bio a:visited{width:124px;background-position: 0px -98px;}
				#nav li.bio a:hover, #nav li.bio a:active{background-position: 0px -146px;}
					
				#nav li.contact a:link, #nav li.contact a:visited{width:108px;background-position: 0px -195px;}
				#nav li.contact a:hover, #nav li.contact a:active{background-position: 0px -244px;}
					
				#nav li.resume a:link, #nav li.resume a:visited{width:149px;background-position: 0px -293px;}
				#nav li.resume a:hover, #nav li.resume a:active{background-position: 0px -341px;}
				
		#nav li#search{clear:both;position:absolute;top:0;right:0;margin: 5px 7px 0 0;}
		#nav label{display:none;}
		
/* =6 Middle
--------------------------------------------------------------------------------------------------------------------------------------*/
	
	#content{width:100%;}
		#content .container{padding:0 0 12px 0;width:960px;}
	
	/*-- HOMEPAGE LAYOUT --------------------------------------------------------------------------*/
	.home #content, .home #content .container, .home #content .wrap{background:none;}
	.home #content .wrap{padding-top:0;}
	
	#homeContent{font-family:Georgia, "Times New Roman", Times, serif;}
		#homeContent .welcome img{padding: 40px 0 40px 230px;}
		#homeContent .welcome h3{text-align:center; color:#8a36a2; padding-top:60px;}
		#homeContent .welcome p{text-align:center; color:#8a36a2;}
			#homeContent .welcome p a:hover{color:#8a36a2;}
		#homeContent .what{width:781px; position:relative; left:90px; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#8a36a2; font-weight:bold; line-height:1.4em;}
			#homeContent .what img {}
			#homeContent .what ul{float:left; padding-right:20px;}
				#homeContent .what ul li{list-style:none;}
	/*----------------------------------------------------------------------------------------------*/

	/*-- PORTFOLIO - MAIN LAYOUT --------------------------------------------------------------------------*/
			.boxcaption a{ color:#C8DCE5; padding-left:7px;}
			.boxcaption h3{ margin: 10px 10px 0 10px; color:#FFF; font:12pt Arial, sans-serif;}
			
			.boxgrid{ 
				width: 234px; 
				height: 207px; 
				margin:15px; 
				float:left; 
				background:#161613; 
				border: solid 2px #452858; 
				overflow: hidden; 
				position: relative; 
			}
				.boxgrid img{position: absolute; top: 0; left: 0; border: 0;}
				.boxgrid p{padding: 0 10px 0 0; color:#afafaf; font-family:Arial, Helvetica, sans-serif; font-size:9pt;}
				
			.boxcaption{float: left; position: absolute; background: #452858; height: 100px; width: 100%; 
				opacity: .9; 
				/* For IE 5-7 */
				filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
				/* For IE 8 */
				-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
 			}
 				.captionfull .boxcaption {top: 110; left: 0;}
 				.caption .boxcaption {top: 165; left: 0;}
				.cover {top:165px;}
	
	#portfolioContent{font-family:Georgia, "Times New Roman", Times, serif;margin-top:60px; width:980px;}
		#portfolioContent img.portfolioHeader {margin-left:370px;}
		#portfolioContent p {color:#452858; font-size:10pt;}
			#portfolioContent p a{color:#452858; text-decoration:none;}
			#portfolioContent p a:visited {color:#452858; text-decoration:none;}
			#portfolioContent p a:hover {color:#8b0a9a; text-decoration:none;}
		#portfolioContent p.more a{color:#dbb35a;}
		#portfolioContent p.more a:visited{color:#dbb35a;}
		#portfolioContent p.more a:hover{color:#ffffff;}
				
	#portfolioContent .thumbnails {width:805px;margin-left:99px; margin-bottom:500px;}
	/*----------------------------------------------------------------------------------------------*/

	/*-- PORTFOLIO - INTERIOR LAYOUT --------------------------------------------------------------------------*/
	#portfolioInterior {width:980px; margin-top:60px;}
		.border {padding:15px 0 15px 0;}
		#portfolioInterior .back p a{float:right; position:relative; top:30px; right:0; color:#8b0a9a; font-size:9pt;}
		
		#portfolioInterior .previousNext {padding:0 0 20px 8px;}
		#portfolioInterior .previousNext p a{color:#8b0a9a; font-size:9pt;}
		
		/*** Slideshow style rules */
		#slideshow {margin:30px auto; width:675px; height:385px; position:relative; float:left;}
		#slideshow #slidesContainer {margin:0 auto; width:574px; height:385px; overflow:auto; /* allow scrollbar */ position:relative; border:3px solid #452858;}
		#slideshow #slidesContainer .slide {margin:0 auto; width:554px; /* reduce by 20 pixels of #slidesContainer to avoid horizontal scroll */ height:385px;}
		
		/*** Slideshow controls style rules */
		.control {display:block; width:39px; height:263px; text-indent:-10000px; position:absolute; cursor: pointer;}
		#leftControl {top:150px; left:0; background:transparent url('images/control_left.jpg') no-repeat 0 0;}
		#rightControl {top:150px; right:0; background:transparent url('images/control_right.jpg') no-repeat 0 0;}
		
		/*** Style rules for Demo page */
		.slide img {float:right; margin:0 0;}

		
		#portfolioInterior .clientInfoRight {float:right; width:265px; background-color:#452959; height:240px; margin:90px auto;
				opacity: .8; 
				/* For IE 5-7 */
				filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
				/* For IE 8 */
				-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
 			}
		#portfolioInterior .text {padding:20px 20px 0 20px;}
			.clientInfoRight .text p{color: #FFFFFF; font-size:10pt; line-height:1.4em; font-weight:normal; letter-spacing: 0.05em;}
			.clientInfoRight .text a:link, a:visited {color:#FFFFFF;}
			.clientInfoRight .text p a {color:#FFFFFF;}
			.clientInfoRight .text a:hover {color:#DBB35A;}
		
		#otherProjects #content {clear:both; margin-left:15px;}
			/* --- SLIDER --- */
			#img_gallery #wrapper{overflow:hidden; width: 980px; float:left; height:170px; position: relative;}
			
			#items{margin:0px 0px; padding:20px 0 0 0; list-style:none; width:50000px; position: relative;}
			#items li{float:left; list-style:none; margin-right:5px; padding:0 20px 0 20px;}
			#items .thumb{width:146px; height:126px; cursor:pointer; margin:0px; border:2px solid #775b6c;}
			
			#moveleft, #moveright{margin:0px; height:37px; color: white; width: 38px; text-indent: -2000em; text-decoration: none; z-index: 1000; display:block; cursor: pointer; float:left;}
			#moveleft{background: url('images/control_left.jpg'); height:37px; width: 38px; margin-top:55px;}
			#moveright{background: url('images/control_right.jpg'); height:37px; width: 38px; margin-top:55px;}


	/*----------------------------------------------------------------------------------------------*/

	/*-- BIO --------------------------------------------------------------------------*/
		#bio {width:960px; padding-left: 15px;}
			#bio p {font-family:Georgia, "Times New Roman", Times, serif; color:#452959; font-size:12pt; text-align:justify;}
			#bio img.amkImage {float:right; position:relative; top:0; right:0; padding-left:40px;}
			#bio p a{color:#8a36a2;}
			#bio a:link, a:visited {color:#8a36a2; font-weight:normal;}
			#bio a:hover {color:#452959; font-weight:normal;}
			#columns{width:960px; position:relative; left:90px; top:0; font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#8a36a2; font-weight:bold; line-height:1.4em;}
				#columns ul{float:left; padding:0 100px 100px 0;}
					#columns ul li{list-style:none;}
				#columns ul li a:link, a visited {color:#8a36a2; text-decoration:none;}
				#columns ul li a:hover {color:#452959; text-decoration:none;}
				
				.bioWelcome img{padding: 40px 0 40px 230px;}		
	/*----------------------------------------------------------------------------------------------*/


	/*-- CONTACT --------------------------------------------------------------------------*/
	#form {float:left; position:relative; left:40px; top:0; width:430px;}
		form.wpcf7-form p {font-family:Georgia, "Times New Roman", Times, serif; color:#452959; font-size:12pt;}
	
	#contactMessage {float: right; position:relative; top:0; right:40px; width:430px;}
		#contactMessage p{font-family:Georgia, "Times New Roman", Times, serif; color:#452959; font-size:13pt; line-height:1.3em;}
		#contactMessage p a{color:#8a36a2;}
		#contactMessage a:link, a:visited {color:#8a36a2; font-weight:normal;}
		#contactMessage a:hover {color:#452959; font-weight:normal;}
	/*----------------------------------------------------------------------------------------------*/


	/*-- RESUME --------------------------------------------------------------------------*/
	#resume {width:800px; font-family: Arial, Helvetica, sans-serif; margin-top:60px; margin-left:90px;}
		#resume p{color:#452858; padding: 3px 0 3px 17px; margin:0; font-size:11pt;}
			#resume p.objective {font-size: 11pt; text-align:justify; text-transform:uppercase; padding: 10px 17px 10px 17px;}
		#resume h3 {color:#452858; font-family:Georgia, "Times New Roman", Times, serif; padding: 16px 0 3px 0; margin: 0;}
		#resume img.border {padding: 2px 0 2px 0; width:800px;}
		#resume ul li {list-style:disc;color:#452858; padding: 3px 0 1px 17px; margin:0; font-size:11pt;}
		#resume a:link, a:visited {color:#8a36a2;}
		#resume a:hover {color:#452858;}

	/*----------------------------------------------------------------------------------------------*/


/* =9 Footer
--------------------------------------------------------------------------------------------------------------------------------------*/
#footer {background: transparent url('images/footer/footer_bg_runner.png') repeat-x center top; clear:both; margin:24px 0 0; height:124px;}
	#footer .wrapper{margin-top:100px;}
	#footer .container{margin:0 auto;padding:14px 0 0;width:980px;position:relative;text-align:left;}
		#footer .peacock img{margin:10px 0 0 10px;}
		#footer .copyright p{margin:-60px 0 0 120px; font-size:13pt;color:#452858; font-family:Arial, Helvetica, sans-serif;}
		#footer .footerNav {padding-top: 10px; margin-left:70px;}
			#footer .footerNav ul{color:#452858; list-style:none;margin:0; font-family:Arial, Helvetica, sans-serif; font-size:11pt;}
			#footer .footerNav ul li{display:inline; padding: 0 10px;}
			#footer .footerNav a:link, .footerNav a:visited{color:#8a37a3; text-decoration: none; font-weight:normal;}
			#footer .footerNav a:hover, .footerNav a:active{color:#452858; text-decoration: none; font-weight:normal;}
		#footer .followMe {float:right; margin:-40px 10px 0 120px;}

/*--------------------------------------------------------------------------------------------------------------------------------------*/

#container .projects {list-style:none; line-height:1.5em;}

