am/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    Author: Danny Halarewich
    Website: www.limewheel.com	
	
	FONT SIZING GUIDE
	
	This website uses EM's to specify font sizes. The base font-size is 62.5% which equals 10px.
	This even base number makes it easy to specify EM's sizes that relate to relative pixel sizes.
	i.e. 1.2em = 12px		1.8em = 18px		3.6em = 36px
	
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

/* (1) =RESET STYLES
   ----------------------------------------------------*/
   
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {  
	margin:0; 
	padding:0; 
} 
table { 
	border-collapse:collapse; 
	border-spacing:0; 
} 
fieldset,img {  
	border:0; 
} 
address,caption,cite,code,dfn,em,strong,th,var { 
	font-style:normal; 
	font-weight:normal; 
} 
ol,ul { 
	list-style:none; 
} 
caption,th { 
	text-align:left; 
} 
h1,h2,h3,h4,h5,h6 { 
	font-size:100%; 
	font-weight:normal; 
} 
q:before,q:after { 
	content:''; 
} 
abbr,acronym {
	border:0; 
}
   
/* (2) =TYPOGRAPHIC STYLES
   ----------------------------------------------------*/


h1 {
	font: normal 2.6em "myriad pro", "trebuchet ms", verdana, sans-serif;
	color: #00aea3;
	padding: 5px 0;
}

h2 {
	font: bold 1.8em "myriad pro", "trebuchet ms", verdana, sans-serif;
	color: #00aea3;
	padding: 5px 0;
}

	#sidebar h2 {
		color: #00b4eb;
	}

h3 {
	font: bold 1.4em "myriad pro", "trebuchet ms", verdana, sans-serif;
	color: #595959;
	padding: 15px 0;
}

h4 {
	font: bold 1.2em "myriad pro", "trebuchet ms", verdana, sans-serif;
	color: #595959;
	padding: 15px 0;
}

p {
	font: normal 1.4em/1.8em "myriad pro", "trebuchet ms", verdana, sans-serif;
	color: #595959;
	margin: 15px 0;
}

	p.intro {
		font-size: 1.8em;
		font-style: italic;
		margin: 0;
	}

a {
    font: normal inherit "myriad pro", "trebuchet ms", verdana, sans-serif;
    color: #ec741c;
}
	a:hover {color: #86400c;}

strong {font-weight: bold;}
em {font-style: italic;}

ul {
	list-style: inside disc;
	font-size: 1.4em;
	line-height: 1.8em;
	margin: 10px 0;
}

	#contentWrapper ul, #contentWrapper ol{
		margin: 10px 0 10px 20px;
	}

ol {
	list-style: inside decimal;
	font-size: 1.4em;
	line-height: 1.8em;
	margin: 10px 0;
}

abbr, acronym {border-bottom: 1px dotted #000;}

/* (3) =LAYOUT STYLES (header, content, footer, etc.)
   ----------------------------------------------------*/

body {
	font: normal 62.5%/1.125em "trebuchet ms", verdana, sans-serif;
	color: #595959;
	background: #fff url(../i/bg_main.jpg) 0 0 repeat;
	margin: 0;
	padding: 0;
}


#headerWrapper {
    width: 100%;
    background: transparent url(../i/bg_top.png) top center repeat-x;
}

	#header {
	    width: 100%;
		height: 394px;
	    background: transparent url(../i/bg_header.png) top center no-repeat;
	}
	
		#headerInner {
			width:  960px;
			position: relative;
			margin: 0 auto;
		}

			#header a img {
				display:  block;
				position: absolute;
				top: 8px;
				left: 0;
				width: 303px;
				height: 91px;
				margin: 0;
			}

			#header p.siteTitle {
				display:  block;
				position: absolute;
				top: 18px;
				right: 10px;
				width: 193px;
				height: 26px;
				background: transparent url(../i/site_title.png) 0 0 no-repeat;
				margin: 0;
			}


#navigation {
	position: absolute;
	left: 10px;
	top: 358px;
	width: 940px;
	height: 24px;
}
    #navigation ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
    }
        #navigation ul li {
            display: block;
            float: left;
            height: 24px;
            margin-right: 54px;
        }
            #navigation ul li a {
				display: block;
				float: left;
				height: 24px;
            }
				
			#navigation ul li.n_home a {
				background: transparent url(../i/n_home.gif) 0 0 no-repeat;
				width: 44px;
			}
			
			#navigation ul li.n_about a {
				background: transparent url(../i/n_about.gif) 0 0 no-repeat;
				width: 50px;
			}
			
			#navigation ul li.n_art a {
				background: transparent url(../i/n_art.gif) 0 0 no-repeat;
				width: 29px;
			}
			
			#navigation ul li.n_design a {
				background: transparent url(../i/n_design.gif) 0 0 no-repeat;
				width: 60px;
			}
			
			#navigation ul li.n_music a {
				background: transparent url(../i/n_music.gif) 0 0 no-repeat;
				width: 53px;
			}
			
			#navigation ul li.n_tuts a {
				background: transparent url(../i/n_tuts.gif) 0 0 no-repeat;
				width: 204px;
			}
			
			#navigation ul li.n_journal a {
				background: transparent url(../i/n_journal.gif) 0 0 no-repeat;
				width: 71px;
			}
			
			#navigation ul li.n_links a {
				background: transparent url(../i/n_links.gif) 0 0 no-repeat;
				width: 49px;
			}
			
				#navigation ul li.n_links {margin: 0;}
				
				#navigation ul li a:hover {
					background-position: left bottom;
				}

#contentWrapper {
    width: 100%;
    background: transparent url(../i/bg_swirl.jpg) 80% 100% no-repeat;
    padding: 30px 0 40px 0;
}

#content {
	width:  960px;
	margin:  0 auto;
}

#mainCol {
	width:  520px;
	float:  left;
}

#sidebar {
    width: 380px;
    float: right;
}

#footer {
    width: 960px;
	height: 50px;
	padding:  20px 10px;
	border-top:  6px solid #bbbbbb;
	margin:  0 auto;
}

#footer p.siteBy {
	width: 300px;
	float: right;
	text-align: right;
}

	#footer p.siteBy a {
		color: #89b662;
	}
		#footer p.siteBy a:hover {
			color: #ce4a57;
		}



/* =HOMEPAGE STYLES
   ----------------------------------------------------*/

.spotlightProject {
	width:  260px;
	float:  left;
	margin: 10px 0;
}

.spotlightProject a img {
	float: left;
	border: 1px solid #00aea3;
	margin-right:  10px;
}

	.spotlightProject a:hover img {
		border-color: #ec741c;
	}

.spotlightProject h3 {
	font-size: 1.4em;
	color: #595959;
	padding: 0;
}

.spotlightProject p {
	padding: 0 10px 0 0;
}



/* =SIDEBAR STYLES
   ----------------------------------------------------*/


#sidebar a img {
	border: 1px solid #00aea3;
	margin: 5px 5px 0 0;
}

	#sidebar a:hover img  {
		border-color: #ec741c;
	}



/* =INTERIOR PAGE STYLES
   ----------------------------------------------------*/
   
.interior h1 {
	margin-right: 20px;
}

div.subNav {

}
   
ul.galleryCategory {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

ul.galleryCategory li  {
	display: inline;
}

ul.galleryCategory li.current a {
	background-color: #666;
	color: #fff;
	text-decoration: none;
	padding: 0 5px;
}


ul.gallerySubNav {
	list-style-type: none;
	font-size: 1.2em;
}

	ul.gallerySubNav li {
		display: inline;
	}
	
		ul.gallerySubNav li a {
			color: #929292;
		}
		
			ul.gallerySubNav li a:hover {
				color: #000;
			}
			
			ul.gallerySubNav li.current a {
				background-color: #929292;
				color: #fff;
			}

.listColumns {
	width: 940px;
	float: left;
}
			
.listColumns ul {
	width: 280px;
	float: left;
	margin-right: 20px;
}


/* =GALLERY PAGE STYLES
   ----------------------------------------------------*/


ul.galleryGrid {
	list-style-type: none;
	width: 960px;
	float: left;
	font-size: 1em;
	margin-top:  40px;
} 
  
ul.galleryGrid li {
	display: block;
	width: 172px;
	float: left;
	margin: 10px;
}

ul.galleryGrid li h3 {
	font-weight: bold;
	padding: 5px 0;
}

ul.galleryGrid li p {
	font-size: 1.2em;
	margin:  5px 0;
}

ul.pagination {
	float: right;
	list-style-type: none;
}

ul.pagination li {
	display: inline;
}

.galleryRow {
	float: left;
}

.galleryColumn {
	float: left;
	width: 172px;
	padding: 0 10px;
}


/* =POPUP STYLES
   ----------------------------------------------------*/



#popupContent {
	padding:  0 20px;
}


/* (4) =MISC. STYLES
   ----------------------------------------------------*/

#navigation ul li a,
#header a.seeMoreArt,
#header p.siteTitle,
#header a img {      /*----Add image replaced element here----*/
    letter-spacing: -10000em;
    text-indent: -99999em;
    overflow: hidden;
}


.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */