/*

Theme Name: Blueline Architects

Description: Webdesign for Blueline Architects P.C.

Version: 1.0

Author: Eric Lundquist

Author URL: www.bluelinearchitects.com

*/


/* <!-- */
	/* General styles */
	* {
    padding: 0;
    margin: 0;
	}

	html, body {
		border: 0;						/* This removes the border around the viewport in old versions of IE */
		height: 100%; 					/* needed for container min-height */
		width: 100%;					/* Set this value to 780px for different resolution previews */
		min-width: 600px;				/* Minimum width of layout - remove line if not required */
										/* min-width property does not work in old versions of IE */
		}
	
	body {
		margin: 0;
		padding: 0;
		font-family: "segoe ui", tahoma, arial, sans-serif;
		font-size: 0.8125em;			/* 14/16=0.875em */  /* 13/16=0.8125em */  /* 12/16=0.75em */
		line-height: 1.375em;			/* 22/16=1.375em */
		color: #666;
		background-color: #FFF;
		}
		
	h1 {
		margin-bottom:0px; 
		font-weight: normal;
		}
	
	h2 {
		margin-bottom: 4px;
		font-weight: normal;
		}
		
	p {padding-top: 6px;} /* establish no padding on first occurance of <p> within a specific div */
	
	#container {
		width: 100%;
		margin: 0 auto;	/* 0 auto */		/* centers content, not in IE5 */
		position: relative; 				/* needed for proper footer positioning */
		height: auto !important; 			/* real browsers */
		height: 100%; 						/* IE6, treated as min-height */
		
		min-height: 100%;					/* real browsers */
		}
		
	* html #container {
		height: 100%;
		}
		
	#sidebar {
		float: left;
		width: 30%;
		position: absolute;
		height: 100%;
		background-image: url("http://test.bluelinearchitects.com/wp-content/themes/blueline/images/bg_1280x1024.jpg");  /* <?php bloginfo('tepmlate_url'); ?>images/bg_1280x1024.jpg" */
		background-attachment: fixed;
		background-position: 0% 50%;		/* 0% = top&left, 100% = bottom&right */
		color: #FFF;
		}
		
	div#content {
		float: right;
		height: 100%;
		position: absolute; left: 30%;
		padding-left: 2.34375%; /* 30px @ 1280x1024 */
		padding-right: 23%; /* 35% - prefered... 23% = no scroll on about page for 1024x768 users */
		}
	
	span#content {
		float: right;
		height: 100%;
		position: absolute; left: 30%;
		padding-left: 25.78125%;	/* 330px @ 1280x1024 */
		padding-right: 14%; /* 15 */
		}	
	
	.contentspacer {height: 25%;}			/* "padding-top: 200px;" effect w/o breaking 100% height */
	
	.sidebarspacer{height: 30%;}
		
	img {border: none;}						/* removes image borders throughout document */
	
	a {color: #999; text-decoration: none; }		
	
	.title {font-size: 28px; color: #666; line-height: 28px;} 
	
	.subtitle{font-size: 20px; color: #999; position: relative; }
	
	.page {margin-top: -5px;}
	
	#hiddenthumbs img {visibility: hidden;}	/* hidden thumbs while on "contact-us" page */
	
	.thumbs {display: inline; border: none; padding-top: 5px; width: 48px; height: 48px; }
	
	a img.thumbs:hover {opacity: 0.5}
			
	.resize {
		max-width: 298px; /* 300px - 2px for borders */
		width: 100%;
		}

	img.resize {max-height: 190px; overflow: hidden; margin-top: -4px; }
	
	a.png:hover {opacity: 0.5;}
	
	a.png {float:right;}
	
			
	/* Sidebar Styles */
	.logo {padding-bottom: 18px; } 			/* adjusts logo&menu spacing */
	
	.alignright {float:right; }
	
	.alignleft {float:left;}
	
	.copy {
		font-size: .8125em; 
		position: absolute;
		text-align: right;
		bottom: 0;
		width: 100%;
		color: #999;
		right: 15px;
		}	
		
	/**********************************************************************************************
	
	BELOW IS THE CODE THAT IS COPIED FROM 'IMAGE-SLIDESHOW-VERTICAL.CSS' WHICH ALLOWS FOR THE
	
	PROJECT IMAGES TO SCROLL VERTICALLY WITH TRANSPARENT GRADIENT PNG'S DISPLAYED PROPERLY IN FF
	
	**********************************************************************************************/
	
	#dhtmlgoodies_slideshow {
		margin: 0; 
		padding: 0;
		max-width: 300px;				/* Total width of slideshow */ /* 720px */
		width: 23.29125%; 			/* 298px @ 1280x1024 */
		
		height: 100%;
		}
		
	#galleryContainer {					/* Big Div surrounding up image, list of images and down image */
		position: absolute;
		
		/* CSS HACK */
		height: 100%;					/* IE 5.x - 120 px + 2 px for borders and 2px for padding*/ 	
		height/* */:/**/100%;			/* Other browsers */ 									
		height: /**/100%; 																
		height: 100%;
		
		/* CSS HACK */
		max-width: 304px;				/* IE 5.x - 120 px + 2 px for borders and 2px for padding*/   	
		max-width/* */:/**/300px;		/* Other browsers */  									
		max-width: /**/300px;		
		width: 100%;
		}

	#arrow_up, #arrow_down {
		overflow: hidden;
		position: absolute; 
		height: 90px; 					/* 145*/
		display: block;
		z-index: 1; 
		width: 100%;
		opacity: 0.6;
		filter:progid:DXImageTransform.Microsoft.Alpha(opacity=60);
		}
		
	#arrow_up {top: 0;}	
	
	#arrow_down {bottom: 0; }	
	
	#arrow_down_image, #arrow_up_image {
		display: block;
		margin-left: auto;
		margin-right: auto;
		}	
			
	#theImages {							/* DIV where the images are located */
		position:relative;
		overflow:hidden;
		height:100%;					/* Height of boxes for the images */ /* 375 */ /* 700px */
		}
		
	#theImages div {	
		position:relative;				/* Don't change this */
		height:1500px;					/* Higher than total height of thumbnails */
	}
	
	#theImages img {
		max-width: 300px;
		width: 100%;
		border: 0;
		}