/* Basic stuff */

.clearfix {
	display: block;
}

.clear {
	clear: both;
}

body {
	border-style: none;
	border-color: none;
	border-width: 0px;
	margin: 0;
	padding: 0;
	outline: 0;
	vertical-align: baseline;
	font-family:"Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Verdana, sans-serif;
	line-height: 1;
	background: #002832 url('../images/bg.jpg') no-repeat left top	;
		color: #fbf6eb;
		color:white;
		font-size: 12px;
		line-height: 15px;
	}
#content {
	color:white;
}	
p {
	line-height: 20px;
	font-size: 16px;
	margin-bottom: 20px;
	margin-bottom: 15px;
	text-align: justify;
		font-family:"Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Verdana, sans-serif;
}
.right {
	text-align:right;
	padding-right:1em;
}
.right-img  {
	float:right;
	margin-left:20px;
	margin-top:5px;
	margin-bottom: 5px;
}
.left-img {
	float:left;
	margin-right:20px;
	margin-top:5px;
	margin-bottom: 5px;
}

a {
	color: white;
	font-style: inherit;
	border:0;
}

#content a {
	color:inherit;
}
#sidenav a {
	color:white;
}
a:hover {
	text-decoration: none;
}


h1 {
	font-size: 36px;
	color: #FCFFF5;
	margin-bottom: 19px;
	text-transform: uppercase;
}

h2 {
	font-size: 24px;
	margin-bottom: 12px;
}

h3 {
	 font-size: 21px;
/*	 color: #F9F9F9; */
	 margin-bottom: 10px;
     	 margin-left:20px;
	 font-weight: 100;
}

h3 a {
	text-decoration: none;
}

h4 {
	font-size: 18px;
	margin-bottom: 9px;
	font-weight: 300;
	color:white;
}

h5 {
	font-size: 16px;
	margin-bottom: 9px;
}

h6 {
	font-size: 12px;
	margin-bottom: 9px;
}

pre {
	border-left: 3px solid #3b667F;
	padding: 10px;
	background: #5492B6;
	display: block;
	max-width: 400px;
	font-style: italic;
	font-family: Georgia;
	margin-bottom: 15px;
}

blockquote {
	padding: 10px;
	padding-top: 0px;
	margin: 5px;
	margin-top: 0px;
	font-size: 19px;
	max-width: 200px;
	font-style: italic;
	font-family: Georgia;
	line-height: 29px;
	text-indent: -0.49em;
	color: white;
}

blockquote p {
	font-size: 19px;
	display: inline;
	max-width: 200px;
	font-style: italic;
	font-family: Georgia;
	line-height: 29px;
	text-indent: -0.49em;
	color: white;
}

hr {
	border-top: none;
}

ul {
	margin-bottom: 15px;
	font-size: 13px;
}

ol {
	margin-bottom: 15px;
	font-size: 13px;
}

li {
	margin-bottom: 4px;
}

#wrap { 
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto -45px;
    width: 965px;
    position: relative;
    background: url('../images/content-bg.png') no-repeat center 86px;
}

/* Navigation */

#nav {
	background: url('../images/navbg.png') no-repeat;
	height: 62px;
	width: 961px;
	margin: 55px 0 20px 1px;
	position: relative;
	display: block;
	z-index: 200;
}

#nav li {
	float: left;
	list-style: none;
	margin-top: 20px;
}

#nav li.back {
	background: url('../images/menu-item.png') no-repeat right -22px;
	width: 8px; height: 22px;
	z-index: 8;
	position: absolute;
}

#nav li.back .left {
	background: url('../images/menu-item.png') no-repeat left top;
	height: 22px;
	margin-right: 5px;
}

#nav li a {
	font-size: 11px;
	text-decoration: none;
	color: #0d4b72;
	text-align: center;
	letter-spacing: 0;
	z-index: 10;
	display: block;
	float: left;
	height: 30px;
	position: relative;
	overflow: hidden;
	margin: 3px 10px; 
	text-transform: uppercase;
}

.first {
	margin-left: 25px;
}

/* Logo styles */

.logo {
	margin-right: 0px;
	margin-top: -52px; /* 20px */
	width: auto;
	float: right;
	position: relative;
	z-index: 300;
}

/* Content */
.full-column {
	width:900px;
	padding: 12px 16px 0px 16px;
}
.column {
	width: 430px;
	padding: 12px 16px 0px 16px;
	float: left;
	text-align: justify;
	margin-top: 2px;
}

#content {
	margin-left: 20px;
	margin-top: 14px;
}

#content img {
	border: 0px white solid;
}

/* Overlays */

.portfolio-overlay {
	left: 36px;
	display: none;
	border: none;
	margin-bottom: -209px;
	z-index: 2000000000;
}

#iphone-overlay {
	position: relative;
	margin-right: -387px;
	margin-top: 127px;
}

.blog-overlay {
	left: 36px;
	display: none;
	border: none;
	margin-bottom: -207px;
	z-index: 2000000000;
}

#content img .portfolio-overlay {
	border: none;
}

.overlay {
	left: 36px;
	display: none;
	border: none;
	margin-bottom: -207px;
	z-index: 2000000000;
}

#content img .overlay {
	border: none;
}

/* Footer */

#footer {
	padding: 5px 20px 0 20px;
	width: auto;
	background: url('../images/footer-bg.png') no-repeat 1px 0px;
	position: relative;
	margin: auto;
	width: 925px;
	height: 200px;
}

#footer h3 {
	color: white;
	border-bottom: solid 1px rgb(131, 157, 167);
	line-height: 19px;
	padding: 0 0 9px 0;
}

#footer p {
	font-size: 12px;
	margin-bottom: 0px;
}

#footer p.name {
	margin-left: 15px;
}

#footer span {
	text-align: center;
}

#footer ul {
	margin-left: 0px;
	margin-bottom: 0px;
}

#footer ul ul {
	margin: 0;
	padding: 0;
}

#footer li.dropdown {
	padding-bottom: 0;
}

#footer li.dropdown ul {
	margin-top: 5px;
}

#footer li {
	list-style: none;
	font-size: 12px;
	padding: 6px 0 6px 10px;
	background: url('../images/left.png') no-repeat 2px 7px;
}

#footer li:hover {
	border-left: 0px solid rgb(131, 157, 167);
	border-right: 0px solid rgb(131, 157, 167);
	border-top: 1px solid rgb(131, 157, 167);
	border-bottom: 1px solid rgb(131, 157, 167);
	padding: 5px 0 5px 10px;
	background: rgb(89, 122, 135) url('../images/left.png') no-repeat 2px 6px;
}

#footer a {
	text-decoration: none;
	display: block;
}

#footer .box {
	width: 210px;
	position: relative;
	float: left;
	margin-right: 10px;
	margin-top: 22px;
}

#footer .last {
	width: 200px;
	padding-right: 6px;
	margin-right: 0px;
}

#footer h3 {
	font-size: 13px;
	font-weight:bold;
	text-transform: uppercase;
}

* {
    margin: 0;
}

html, body {
    height: 100%;
}

#footer, .push {
    height: 17em;
}

#footer .first {
	margin-left: 13px;
}

/*  
Sticky Footer Solution
by Steve Hatcher 
http://stever.ca
http://www.cssstickyfooter.com
*/

* {margin:0;padding:0;} 

/* must declare 0 margins on everything, also for main layout components use padding, not 
vertical margins (top and bottom) to add spacing, else those margins get added to total height 
and your footer gets pushed down a bit more, creating vertical scroll bars in the browser */

html, body, #wrap {height: 100%;}

body > #wrap {height: auto; min-height: 100%;}

#main {padding-bottom: 150px;}  /* must be same height as the footer */

#footer {
	position: relative;
	margin-top: -150px; /* negative value of footer height */
	height: 300px;
	clear: both;
	} 

/* CLEAR FIX*/
.clearfix:after {
	content: ".";
	display: block;
	height: 30px;
	clear: both;
	visibility: hidden;
	}
	
.clearfix {
	display: inline-block;
	}

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

.pp_close {
	margin-bottom: 20px;
}
#credit {
	width:130px;
	clear:both;
	margin-top:20px;
}
#credit a{
	margin:0;
	padding:0;
}
#credit a:hover {
	text-decoration:underline
}

.festival {
	background: url('../images/festival-small2.png') no-repeat left top;
}
.tree {
	background:url('../images/tree-small.png') no-repeat left top;
}
.bells {
	background:url('../images/bells-small2.png') no-repeat left top;
}
.youth {
	background:url('../images/youth-small2.png') no-repeat left top;
}
table {
	font-size:15px;
	color:#000;
	/*background-color:#333; -moz-opacity:.50; filter:alpha(opacity=50); opacity:.50; */
}
	.csv table {
	font-size:13px;
	color:#fff;
}
	.csv td {
	padding:0 14px 7px 0px;
}