/* 
CSS By: Cherie Kunkel exclusively for McGarren Flack of Flack Studio
cherie.kunkel@gmail.com
http://www.distant-ocean.net
May 12, 2010

All styles are defined in this css file, such as text fonts, colors, 
background colors, table and div sizes, etc. 

*/

body { margin-top:0px; margin-bottom:0px; margin-left:0px; margin-right:0px; background-color:#edebe9;}
	
/*------ Global formatting -------*/
	
	/*-- LINKS --*/
	a, a:visited {color:#202b37; text-decoration:none; line-height:140%; letter-spacing:0.1em;}
	a:hover {color:#6e7d7f; text-decoration:none; line-height:140%; letter-spacing:0.1em;}
	a.img {border: 0px solid #a2a6a8;}


	/*-- TABLES --*/
	td {padding-left:0px; padding-right:0px; padding-top:0px; padding-bottom:0px;}
		
	/*-- LISTS --*/
	ul {position:relative; margin-left:0px; border:0px dashed #000000; padding-left:20px; }
	li.content {font:13px georgia, times, serif, garamond; color:#484b55; text-align:justify; vertical-align:top; border:0px dashed #000000; }
		
	/*-- DIVS (classes for simple alignment)--*/	
	.right {float: right;}
	.left {float: left;}
	.center {margin-left: auto; margin-right:auto;}
		
	/*-- IMAGE CAPTION TEXT --*/
	#featured { margin-top:15px; margin-bottom:0px; margin-left:0px; margin-right:0px;}
	#featured h2 { margin-top:10px; margin-bottom:0px; margin-left:0px; margin-right:10px;}
	#featured img{ width:530px; height:auto; padding-top:5px; padding-bottom:0px; padding-left:5px; padding-right:5px; 
				margin-top:0px; margin-bottom:0px; margin-left:5px; margin-right:0px;
				border-top:1px solid #aaaaaa; border-bottom:0px dotted; border-left:1px solid #aaaaaa; border-right:1px solid #aaaaaa;
	}	
	
	p.featcaption { height:auto; margin:0px; width:525px; margin-left:0px;margin-right:auto;
		padding-top: 20px; padding-bottom: 0px; padding-left: 15px; padding-right: 0px;
		border-top:0px dotted; border-bottom:0px solid #aaaaaa; border-left:0px solid #aaaaaa; border-right:0px solid #aaaaaa;
		font:12px georgia, times, serif, garamond; color:#000000; font-variant: small-caps;
		vertical-align:top; text-align:justify; position:relative;bottom:0;}
		
	#featcaption{ width:530px; height:40px; padding-top:0px; padding-bottom:0px; padding-left:5px; padding-right:5px;
				border-top:0px solid #aaaaaa; border-bottom:1px solid #aaaaaa; border-left:1px solid #aaaaaa; border-right:1px solid #aaaaaa;
				margin-top:0px; margin-bottom:0px; margin-left:5px; margin-right:0px; position:relative; top:0;
	}	
/*	p.quote {height:100px; font-family: Georgia, serif; font-size: 14px; font-style: italic; margin-top:0px;letter-spacing:1px; vertical-align:top;width:500px;
				position:absolute;top:0;margin-left:auto;margin-right:auto; padding-left:10px;padding-right:10px;text-align:justify;padding-top:0;padding-bottom:0;}*/
				
	#news { width:250px; height:80%; margin-top:10px; margin-bottom:auto; margin-left:auto; margin-right:auto;
			padding-top:0px; padding-bottom:5px; padding-left:0px; padding-right:5px; float:right;
			border-top:0px solid #aaaaaa; border-bottom:0px; border-left:0px solid #aaaaaa; border-right:0px solid #aaaaaa;}
	#news h2 {margin-left:0px;}		
	#news p.text{font-size: 9pt; font-family: cambria, times, serif; margin-bottom:20px; margin-top:0px; border:0px solid #000000;
				text-transform: none; letter-spacing:0px; line-height: 1.1em; text-align:justify; vertical-align:top; 
				margin-left:22px; margin-right:0px; padding-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right:5px;
				position:relative; top:4px;
	}			
	#news p.news{font-size: 13px; color:#000000; font-family: times, cambria, serif; font-weight:bold;
				margin-bottom:0px; margin-top:4px; border:0px solid #000000; padding-left:10px;
				letter-spacing:0.1em; line-height: 1.1em; text-align:left; vertical-align:top; margin-left:auto; margin-right:5px;		
	}		
		
	.date {width:98%;font-size:22px;color:#aaaaaa; font-family: Georgia, serif; font-style: italic; font-weight: normal; 
			text-transform: none; letter-spacing: normal; line-height: 1.6em; margin-top:0px; margin-bottom:0px;  
			position:relative;  top: 0%; left: 0%;  float:left; padding-top: 0px; padding-bottom: 0px; padding-left: 0px;
	}

	p.large {margin-bottom:0px; border:0px solid #000000; margin-top:0px; position:relative; top:10px; left: 0px; width:300px; z-index: 10;}
		
	.profile {padding-left:15px; padding-top:3px; padding-bottom:3px;}	

	/*-- THUMBNAIL CLASS --*/
	.thumb { width:125px; height:125px; border:1px solid #aaaaaa; } 
		
	/*ALL TEXT*/
	.text { font-family: georgia, cambria, serif, times, times new roman; font-size: 10pt; color:#3d3c3b;
			font-style: normal; font-weight: normal; text-transform: none; letter-spacing:0.1em; line-height: 1.4em;
		 	text-align:justify; vertical-align:top;}
	/*PARAGRAPH TEXT*/		
	p.text {font:13px georgia, times, serif, garamond; letter-spacing:1px; line-height:150%; margin-left:20px; margin-right:15px; }/*margin-top:15px; margin-bottom:15px; }*/		
	p.level2 {font:13px georgia, times, serif, garamond; letter-spacing:0.5px; color:#242220; line-height:130%; text-align:justify; 
		vertical-align:top;margin-left:30px;margin-right:15px;
	}
	
	/*HEADER TEXT	*/	
	h1 {padding:0px; margin-top:3px; margin-left:0px; margin-right:0px; margin-bottom:15px; background-color:#dcdad9;border:1px solid #444444;
		font:20px georgia, times, cambria, garamond, serif;line-height:100%;font-weight:900; letter-spacing:0.1em;text-align:left;color:#444444;	
	}
	
	h2 {width:98%; padding:3px; margin-top:0px; margin-bottom:2px; margin-left:5px; margin-right:0px;border-bottom:1px dotted #000000;
		font:20px times, cambria, georgia, serif, garamond;font-weight:bold;color:#322315;font-variant:small-caps; line-height:80%; 
		letter-spacing:0.1em; text-align:left; padding-top:8px;
	}	
	h3 {font-size:18px;margin-left:25px;  font-weight:bold; font-variant: small-caps; letter-spacing:0.1em;}
	h4 {font-size:14px; margin-left:30px; font-weight:bold;font-variant: normal; letter-spacing:0.1em;}
	h5 {font-size:12px; margin-left:35px; font-weight:bold;font-variant: small-caps;letter-spacing:0.1em;}
	h6 {font-size:10px;font-weight:bold;font-variant: small-caps;margin-left:40px;letter-spacing:0.1em;}
		
	/*break line formatting*/
	hr { height:1px;border-top:1px dotted #000000;}
	
	/*image padding*/
	
	img.profile {padding:10px;}
		
/*------ Structure & formatting -------*/
			
	/*Outermost Table*/	
	#wrapper {width:950px;padding: 0px; margin-left: auto; margin-right: auto; margin-top: 10px; margin-bottom: 20px; 
			  border-top:0px solid #d0d0d0; border-bottom:0px solid #000000; border-left:0px solid #444444; border-right:0px solid #444444;
			  vertical-align:top; background:#FEFEFE; 
	}

		/*row (td) within wrapper containing the title header*/	
		#banner {height:82px; width:100%; background:#FFFFFF; border-bottom:2px solid #aaaaaa;}
		#banner.left {position:absolute;}
		#banner.right {position:absolute;}
		
	
		/*row (td) within wrapper containing sidebar (left) and content (right)*/		
		#page {width:970px;padding:0px;margin-top:0px;margin-left:0px;vertical-align:top;
				border-top:2px solid #dcdad9;border-left:0px solid #87837c;border-right:0px solid #87837c;}
							
			/* #content is the table within #page to the right of the link bar which will load content, such as galleries
			   and information. content must float right, otherwise it sits below the sidebar div*/
			#content {width:810px;border-top:0px solid #515557;margin-top:0px;margin-left:0px;margin-right:5px;margin-bottom:0px; 
					float:right; padding-top:0px;position:relative;right:0;vertical-align:top;}
			
				/*Table formatting for content inside of the links page holding the representation and friends' links*/
				table.representation {width:520px; padding-top:10px; padding-left:0px;				border:0px dashed #000000; }
				td.linkHead { width:200px; padding-left:10px; padding-top:1px; padding-bottom: 1px; padding-right:0px; background-color:#dedede; 		
																												border:0px dashed red;}
				td.representation {width:50%; position:relative; padding:0px;					 				border:0px dashed blue; }
				.logoContainer {position:relative; width:220px; margin-left:30px;				 				border:0px solid #000000;}
				
				ul.rep {position:relative; margin-left:10px; margin-top:10px; padding-left:20px;					border:0px dashed pink; }
				li.rep {font:13px georgia, times, serif, garamond; color:#484b55; text-align:justify;  margin-left:0px; padding-left:0px; 				 
						color:#3d3c3b; letter-spacing: normal; text-align:justify;
																												border:0px dashed green; }
				li.info {position:relative; font-family: lucida grande,sans-serif; color:#3d3c3b; margin-left:0px; padding:0px; border:0px dashed red;  
						font-size: 11px;  letter-spacing: normal; text-align:justify;}
										
			/*sidebar div within #page on left side*/	
			#sidebar {height:475px; vertical-align:top;width:150px;float:left;padding-top:10px;margin-top:0px;margin-bottom:0px;padding-bottom:100px;margin-left:0px;margin-right:0px;
				border-top:0px solid #515557;border-bottom:0px solid #515557;border-left:0px solid #000000;border-right:0px solid #949ea0;
				background:#dcdad9; position:relative; top:0px; } /*CHANGE ME TO WARMER GRAY*/
		        
				#menu.sidebar{cursor:pointer;margin-bottom:0px;padding-bottom:0px;}/*for the expanding menus*/
					
					.submenu{margin-top: 2px;margin-bottom: 2px;margin-left:20px;font-family: Helvetica, Arial, sans-serif;font-size: 11px;
						font-style: normal; font-weight: normal;text-transform: none;letter-spacing: 0.1em;line-height: 100%;}
						
				#linksSideNav {padding-top:0px;padding-bottom:100%;margin-top:0px;margin-bottom:0px;margin-left:0px;margin-right:0px;
					border-top:0px solid  #7c8486;border-bottom:0px solid  #7c8486;border-left:0px solid  #949ea0;border-right:0px solid #949ea0; 
					background:#dcdad9;vertical-align:top;float:left;} /*CHANGE ME TO WARMER GRAY*/
				
				
				.galleryLinks { margin-top: 8px; margin-bottom: 8px; margin-left: 15px;}
				
				ul.sidebar { margin-top: 0px; margin-bottom: 3px; margin-left:0px; margin-right: 0px;} 
				li.sidebar { color: #323232; } 
				li.sidebar:hover { color: #555555; } 

				a.sidebar, a.sidebar:visited {
					margin-left:0px;margin-bottom:0px;margin-top:0px;color:#323232;font:14px georgia, garamond, times, serif;
					font-weight:300;letter-spacing:0em;line-height: 100%;
				}
				
				a.sidebar:hover,  a.sidebar:active {
					margin-left:0px;margin-top:0px;margin-bottom:0px;padding-left:0px;color:#444444;font:14px georgia, garamond, times, serif;
					font-weight:300;letter-spacing:0em;
				}	
		

				a.subSidebar, a.subSidebar:visited {color:#464646;letter-spacing: 1px;	}
				
				a.subSidebar:hover,  a.subSidebar:active { color:#aaaaaa;letter-spacing: 1px;}	
		
	
				/*formatting for the title of each link group*/		
				a.linkSectionHead, p.linkSectionHead {
					margin-left:5px;margin-bottom:0px;margin-top:10px;padding-left:5px;padding-bottom:1px;color:#323232;
					font:17px georgia;font-variant:small-caps;font-weight:900;letter-spacing:1.5px;line-height:130%;
				}
					
								
		/*gallery div*/	
		#gallery {
			position:relative;width:98%	;margin-left: auto;margin-right: auto;margin-top:5px;margin-bottom: auto;
			border-top:1px solid #eeeeee;border-bottom:1px solid #eeeeee;border-left:1px solid #eeeeee;border-right:1px solid #eeeeee;
			background:#d3d3d3;
		}	
		
		#mailForm {margin-left:20px;}	
		.form {float:left;}
		.submit {float:right;}	
			
	/*footer div*/
	#footer {
		width:100%;height:30px;margin-top:0px;margin-bottom:0px;margin-left:auto;margin-right:auto;background: #aaaaaa;
		border-bottom:2px solid #cccccc;border-left:0px solid #444444;border-right:0px solid #444444;border-top:1px solid #cccccc;
	}


	.footertext {
		margin-top:0px;margin-bottom:0px;margin-left:auto;margin-right:auto;padding-left:20px;padding-top:5px;padding-bottom:0px;
		font:14px cambria, georgia, times, serif, garamond;color:#464646; /*make dark grey*/
		border-bottom:0px solid #444444;border-left:0px solid #444444;border-right:0px solid #444444;border-top:0px solid #444444;
		letter-spacing:0.5px;line-height:100%;
	}
	
		a.footer, a.footer:visited { 
			color:#464646; /*change*/
			margin-left:0px;margin-bottom:0px;margin-top:0px;font:14px cambria, georgia, times, serif, garamond;
			font-weight:300;letter-spacing:0.1em;text-decoration:underline;
		}
		
		a.footer:hover, a.footer:active {
			padding-left:0px;color:#c0c0c0;font:14px cambria, georgia, times, serif, garamond;font-weight:300;
			letter-spacing:0.1em;line-height:100%;	margin-left:0px;margin-top:0px;margin-bottom:0px;
			text-decoration:underline;	
		}	
		
		#ck {margin-right:5px;}
		
/*------ End :) -------*/
	


/*LIGHTBOX PHOTO GALLERY STYLES*/

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer #hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(file:///D|/Flackstudio%20business/Website%20PHP/flackstudio/local/images/lightbox/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(file:///D|/Flackstudio%20business/Website%20PHP/flackstudio/local/images/lightbox/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px georgia, times, serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }