@charset "UTF-8";
/*
Theme Name: L7 Designs
Theme URI: http://www.l7-designs.com/
Description: Original Wordpress theme for L7 Designs website and blog.
Version: 1.0
Author: Ryan Lascano || http://www.transitdesignstudio.com
*/

/* ------------------------------------------------------------ COLOR KEY ----- */
/*

	Dark brown (site background): #351700
	Light blue (nav bg, body copy): #b5e1e0
	Green (subnav bg): #b9b309
	Brown (nav text, content bg): #572600
	Color (usage): #abcdef
	
*/
/* ------------------------------------------------------------ GLOBAL STYLES ----- */

body {
	height:100%; /* fixes alignment issues in IE6 */
	width:100%; /* fixes alignment issues in IE6 */
	padding-top:30px;
	font: 62.5% Arial, Helvetica, sans serif; /* resets the default font size in a way that allows using em sizes that relate to pixel sizes like so: 1.2em = 12px */
	background:url(images/page-bg.jpg) top center no-repeat #351700;
	}
	
.left {
	float:left;
	}
	
.right {
	float:right;
	}
	
.clear {
	clear:both;
	height:0px;
	}
	
.caps {
	text-transform:uppercase;
	}
	
#container {
	width:960px;
	margin:0px auto 0px;
	/*overflow:hidden;*/
	}
	
/* ------------------------------------------------------------ NAV STYLES ----- */

#nav {
	width:170px;
	height:510px;
	margin:50px 0px 0px;
	padding:30px 0px 0px 30px;
	background:url(images/nav-bg.gif) top left no-repeat;
	float:left;
	}
	
	#nav ul {
		padding:60px 0px 0px;
		font:24px "Century Gothic", Arial, Helvetica, sans-serif;
		text-transform:uppercase;
		text-align:right;
		}
		
		#nav ul li {
			margin:0px;
			padding:0px;
			}
		
		#nav ul li a {
			display:block;
			height:32px;
			padding-right:30px;
			text-decoration:none;
			color:#572600;
			margin:0px;
			}
			
			#nav ul li a:hover {
				background:url(images/nav-highlight-edge.gif) top right repeat-y #d3edec;
				}

/* ------------------------------------------------------------ SUBNAV STYLES ----- */

#subnav {
	width:185px;
	padding:130px 0px 0px 15px;
	background:url(images/subnav-top.gif) top left no-repeat;
	overflow:hidden;
	float:left;
	}
	
	#subnav h2 {
		margin-bottom:10px;
		font:18px "Century Gothic", Arial, Helvetica, sans-serif;
		font-weight:normal;
		text-transform:uppercase;
		color:#572600;
		}
		
	#subnav h3 {
		}
		
	#subnav p {
		font-size:11px;
		line-height:18px;
		color:#572600;
		margin-bottom:20px;
		}
		
		#subnav p a {
				color:#572600;
				font-weight:bold;
				text-decoration:underline;
				}
				
			#subnav p a:hover {
				text-decoration:none;
				}
		
	#subnav ul {
		/*padding-left:15px;*/
		margin-bottom:20px;
		font-size:12px;
		line-height:18px;
		font-weight:bold;
		color:#572600;
		text-align:left;
		}
		
		#subnav li {
			margin-bottom:7px;
			}
		
		#subnav li.list-heading {
			margin-bottom:7px;
			padding:0px 15px 0px 4px;
			font:18px "Century Gothic", Arial, Helvetica, sans-serif;
			font-weight:normal;
			text-transform:uppercase;
			}
			
			#subnav li.list-heading a {
				width:151px;
				margin-bottom:7px;
				}
			
		#subnav li a {
			display:block;
			width:155px;
			margin-bottom:7px;
			padding:0px 14px 0px 15px;
			text-indent:-10px;
			color:#572600;
			text-decoration:none;
			border-right:1px solid #d8d40e;
			}
			
			#subnav li a:hover {
				background-color:#cbc60b;
				}
				
			#subnav.portfolio li ul {
				width:171px;
				padding-left:10px;
				margin-bottom:7px;
				font-size:12px;
				font-family:Arial, Helvetica, sans-serif;
				line-height:18px;
				font-weight:bold;
				text-transform:none;
				}
				
				#subnav.portfolio li ul li a {
					padding-right:14px;
					}
			
	#subnav dl {
		font-size:11px;
		line-height:18px;
		color:#572600;
		margin-bottom:20px;
		padding-right:10px;
		}
		
		#subnav dt {
			font-size:12px;
			font-weight:bold;
			}
			
			#subnav dt a {
				color:#572600;
				text-decoration:underline;
				}
				
			#subnav dt a:hover {
				text-decoration:none;
				}
				
	#subnav a.subnav-button {
		display:block;
		width:160px;
		padding:4px;
		font:12px Arial, Helvetica, sans-serif;
		font-weight:bold;
		text-align:center;
		text-decoration:none;
		/*text-transform:uppercase;*/
		color:#572600;
		background-color:#cbc60b;
		border:1px solid #cbc60b;
		margin-bottom:12px;
		}
		
		#subnav a.subnav-button:hover {
			color:#572600;
			background-color:#b5e1e0;
			border:1px solid #daf0f0;
			}
			
	#subnav.home {
		height:510px;
		background:none;
		background:url(images/subnav-home-bg.gif) top center no-repeat;
		float:left;
		}
		
		#subnav.home h2 {
			padding-left:4px;
			}
			
		#subnav.home p {
			padding:0px 19px 0px 4px;
			font-weight:bold;
			}
		
	#subnav #contact-info {
		text-align:left;
		padding-right:15px;
		}
	
/* ------------------------------------------------------------ CONTENT AREA STYLES ----- */

#content-wrapper {
	width:760px;
	background:url(images/content-bg.gif) top center repeat-y;
	float:right;
	}
	
	#content-wrapper.home {
		background:none;
		}

ul#home-images {
	display:block;
	width:560px;
	height:540px;
	padding:0px !important;
	margin:0px !important;
	text-indent:0px !important;
	list-style:none !important;
	}
	
	#home-images li {
		margin:0px !important;
		padding:0px !important;
		}
	
	#home-images li img {
		border:none;
		}

#content {
	width:500px;
	height:455px;
	padding:80px 30px 0px;
	background:url(images/content-top.gif) top center no-repeat;
	float:right;
	}
	
	#content.home {
		width:560px;
		height:540px;
		padding:50px 0px 0px;
		background:url(images/content-home-bg.gif) 0px 50px no-repeat;
		}
	
#content-long {
	width:500px;
	min-height:455px;
	height:auto !important; /* Min-height hack for IE6 Part I*/
	height:455px; /* Min-height hack for IE6 Part II*/
	padding:80px 30px 0px;
	background:url(images/content-top.gif) top center no-repeat;
	float:right;
	}
	
	#content-long.portfolio {
		width:560px;
		padding:50px 0px 0px;
		position:relative;
		}
		
		#content-long.portfolio #portfolio-corner {
			width:30px;
			height:30px;
			position:absolute;
			top:50px;
			right:0px;
			/*background:url(images/portfolio-corner.png) top right no-repeat;*/
			z-index:6000;
			}
			
		#content-long.portfolio #portfolio-shadow {
			width:30px;
			height:420px;
			position:absolute;
			top:50px;
			left:0px;
			/*background:url(images/portfolio-shadow.png) top left repeat-y;*/
			z-index:6000;
			}
			
			#portfolio-shadow img, #portfolio-corner img {
				border:none !important;
				}
		
		#content-long.portfolio a#next {
			display:block;
			width:80px;
			height:35px;
			position:absolute;
			top:130px;
			left:520px;
			z-index:6000;
			}
			
			a#next img {
				border:none;
				}
	
	.post {
		/*width:500px;
		padding:30px 30px 0px;*/
		}
	
	#content h1, #content-long h1 {
		font:24px "Century Gothic", Arial, Helvetica, sans-serif;
		/*color:#b5e1e0; BLUE*/
		color:#b9b309;
		text-transform:uppercase;
		margin-bottom:12px;
		}
		
		#content h1 a, #content-long h1 a {
			color:#b9b309;
			text-decoration:none;
			}
			
		#content h1 a:hover, #content-long h1 a:hover {
			text-decoration:underline;
			}
		
	#content h2, #content-long h2 {
		font-size:20px;
		line-height:24px;
		font-weight:bold;
		/*color:#b5e1e0; BLUE*/
		color:#b9b309;
		margin-bottom:5px;
		}
		
		#content h2 a, #content-long h2 a {
			color:#b9b309;
			text-decoration:none;
			}
			
		#content h2 a:hover, #content-long h2 a:hover {
			text-decoration:underline;
			}
		
	#content h3, #content-long h3 {
		font-size:18px;
		line-height:24px;
		font-weight:bold;
		/*color:#b5e1e0; BLUE*/
		color:#b9b309;
		margin-bottom:2px;
		}

                #content h3 a, #content-long h3 a {
			color:#b9b309;
			text-decoration:underline;
			}
			
		#content h3 a:hover, #content-long h3 a:hover {
			text-decoration:none;
			}
		
	#content h4, #content-long h4 {
		font-size:16px;
		line-height:24px;
		font-weight:bold;
		/*color:#b5e1e0; BLUE*/
		color:#b9b309;
		}
		
	#content p, #content-long p {
		font-size:14px;
		line-height:24px;
		color:#b5e1e0;
		margin-bottom:12px;
		}
		
		#content p a, #content-long p a {
			color:#b9b309;
			text-decoration:underline;
			}
			
		#content p a:hover, #content-long p a:hover {
			text-decoration:none;
			}
			
		#content p.wp-caption-text, #content-long p.wp-caption-text {
			font-size:12px;
			font-weight:bold;
			text-align:center;
			color:#b9b309;
			}
		
	#content ul, #content-long ul {
		font-size:14px;
		line-height:24px;
		color:#b5e1e0;
		margin-bottom:12px;
		padding-left:30px;
		/*text-indent:-15px;*/
		list-style:square outside;
		}
		
	#content ol, #content-long ol {
		font-size:14px;
		line-height:24px;
		color:#b5e1e0;
		margin-bottom:12px;
		padding-left:30px;
		/*text-indent:-15px;*/
		list-style:decimal outside;
		}
		
		#content li:before, #content-long li:before, #content ol:before, #content-long ol:before {
			color:#b9b309 !important;
			font-weight:bold !important;
			}
			
		#content li, #content-long li {
			margin-bottom:5px;
			}
			
			#content li a, #content-long li a {
				color:#b9b309;
				text-decoration:underline;
				}
				
			#content li a:hover, #content-long li a:hover {
				text-decoration:none;
				}
				
			#content .post li img, #content-long .post li img {
				margin-top:12px;
				}
			
	#content blockquote, #content-long blockquote {
		/*width:460px;*/
		padding:20px 20px 8px;
		margin:12px 0px;
		/*font-weight:bold;*/
		background-color:#b9b309;
		border:1px solid #d8d40e;
		}
		
		blockquote p {
			font-size:18px !important;
			line-height:28px !important;
			color:#572600 !important;
			}
			
			blockquote p a {
				color:#351700 !important;
				text-decoration:underline;
				}
				
			blockquote p a:hover {
				text-decoration:none;
				}
			
	#content hr, #content-long hr {
		width:500px;
		height:1px;
		border:none;
		background:none;
		border-bottom:2px dotted #351700;
		padding:8px 0px 0px;
		margin:0px 0px 20px;
		}
			
	small {
		font-size:10px;
		line-height:12px;
		font-weight:bold;
		}
		
	#content-long.portfolio #main-images {
		width:560px;
		height:420px;
		overflow:hidden;
		}
		
	#content-long.portfolio #main-images img {
		border:none;
		}
		
	#content-long.portfolio #description {
		width:300px;
		padding:20px 0px 0px 30px;
		float:left;
		}
		
	#content-long.portfolio ul#thumbs {
		display:block;
		width:200px;
		padding:29px 0px 0px 30px;
		float:left;
		}
		
		#content-long.portfolio ul#thumbs li {
			display:block;
			float:left;
			width:35px;
			height:35px;
			margin:0px 10px 10px 0px;
			list-style:none;
			text-align:center !important;
			}
			
			#content-long.portfolio ul#thumbs li a {
				display:block;
				width:33px;
				height:33px;
				margin:0px;
				padding:0px;
				text-align:center;
				overflow:hidden;
				border:1px solid #b5e1e0;
				}
				
			#content-long.portfolio ul#thumbs li a.activeSlide {
				width:29px;
				height:29px;
				border:3px solid #b5e1e0;
				}
				
				#content-long.portfolio ul#thumbs li a img {
					width:50px !important;
					/*height:33px;*/
					border:none;
					margin:0px;
					text-align:center;
					}
		
				#content-long.portfolio ul#thumbs li a.activeSlide img {
					/*width:29px;
					height:29px;*/
					}
					
	#content-long #port-archive-thumb {
		width:150px; 
		height:150px; 
		margin:0px 20px 0px 0px;
		/*overflow:hidden;*/ 
		border:1px solid #b9b309;
		float:left;
		}
		
		#port-archive-thumb a, #port-archive-thumb img {
			border:none !important;
			}
				
	#post-nav {
		width:500px;
		padding:0px;
		}
		
		#post-nav a {
			color:#b9b309;
			text-decoration:underline;
			}
			
		#post-nav a:hover {
			text-decoration:none;
			}
			
	.gallery {
		padding-bottom:12px;
		}
		
	#content img, #content-long img {
		border:1px solid #b9b309;
		}
		
	#comments {
		/*width:500px;
		padding:30px 30px 0px;*/
		}
		
		#comments textarea {
			width:450px;
			}
			
		ul#comment-list {
			padding:0px;
			margin:0px;
			list-style:none;
			}
			
			#comment-list li {
				display:block;
				width:460px;
				padding:20px 20px 8px;
				margin:0px;
				text-indent:0px;
				}
				
			#comment-list li.alt {
				width:460px;
				padding:19px 19px 7px;
				background-color:#652e00;
				border:1px solid #6d3300;
				}
				
			#comment-list li.author-comment {
				width:460px;
				padding:19px 19px 7px;
				background-color:#b5e1e0;
				border:1px solid #daf0f0;
				}
				
				#comment-list li.author-comment p {
					color:#572600 !important;
					}
					
					#comment-list li.author-comment p a {
						color:#572600 !important;
						}
				
				#comment-list li img {
					margin:0px 15px 20px 0px;
					float:left;
					}
					
				#comment-list li img.wp-smiley {
					float:none;
					margin:0px;
					border:none;
					}
					
				#comment-list li .comment-entry {
					width:380px;
					float:left;
					}
					
		#comment-form #recaptcha_widget_div {
			margin-bottom:12px;
			}
		
/* ------------------------------------------------------------ FOOTER STYLES ----- */

#footer {
	width:740px;
	height:45px;
	padding:60px 20px 0px 0px;
	background:url(images/footer-bg.gif) top center no-repeat;
	float:right;
	}
	
	#footer p {
		font-size:9px;
		line-height:9px;
		font-weight:bold;
		text-align:right;
		color:#b5e1e0;
		}
		
		#footer p a {
			color:#b5e1e0;
			text-decoration:underline;
			}
			
		#footer p a:hover {
			text-decoration:none;
			}
			
#footer.home {
	width:540px;
	padding:5px 20px 0px 0px;
	background:none;
	float:right;
	}