@charset "utf-8";

/* ==================== %GENERAL ==================== */

html, body {
	margin: 0;
	min-height: 100%;
	height: 100%;
	background: #ddd url(/images/page_bg.jpg) left top repeat;
}

html, body, p, td {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 15px;
	font-weight: normal;
	color: #3f3f3f;
	line-height: 20px;
}

html>body body {
	height: auto;
}

hr {
	height: 1px;
	margin-top: 1px;
	border: none;
	border-top: 1px solid #2f6db6;
}

a {outline: none;}
a img {outline: none; border:0;}

.hidden  {
	position:absolute;
	left:0px;
	top:-500px;
	width:1px;
	height:1px;
	overflow:hidden;
} 



/* ==================== %FONTS & COLORS ===================== */

h1 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.6em;
	color: #413930;
	line-height: 2.0em;
	margin: 0;
	font-weight: bold;
}
h2 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.5em;
	color: #45ada2;
	line-height: 1.6em;
	margin: 0.5em 0 0;
	font-weight: normal;
}
h3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 1.1em;
	color: #9B7856;
	line-height: 1.5em;
	margin: 0.5em 0 0;
	font-weight: normal;
}

h4, h5, h6 {font-size: 1.1em; font-weight: bold; color: #41b2bb; line-height: 1.5em;}
p, dl {margin: 0 0 1.0em 0;}
h3 {margin: 1em 0;}
h4 {margin: 1.33em 0;}
h5 {margin: 1.67em 0;}
h6 {margin: 2.33em 0;}
a:link {color: #9b7856; text-decoration: none;}
a:visited {color: #9b7856; text-decoration: none;}
a:hover {color: #9b7856; text-decoration: underline;}
a:active {color: #9b7856; text-decoration: underline;}
.right {float: right; margin: 0px 0 5px 15px;}
.left {float: left;margin: 0px 15px 5px 0;}

.large-text {font-family: Georgia, "Times New Roman", Times, serif; font-size: 14px; font-weight: bold; color: #413930; line-height: 18px;}
.indent-text {font-family: Georgia, "Times New Roman", Times, serif; font-size: 14px; color: #413930; line-height: 18px; padding: 10px; background:#ECECEC none repeat scroll 0 0; border:1px dotted #CCCCCC;}
.em-text {font-family: Georgia, "Times New Roman", Times, serif; font-size: 18px; font-style: italic; color: #413930; line-height: 22px;}

body#place div#content a, body#place div#content h2, body#place div#content a, body#place div#content h3 {color: #f0284f;}
body#people div#content a, body#people div#content h2, body#people div#content h3 {color: #a3a915;}
body#project div#content a, body#project div#content h2, body#project div#content h3 {color: #45ada2;}
body#diary div#content a, body#diary div#content h2, body#diary div#content h3 {color: #9B7856;}
body#support_give div#content a, body#support_give div#content h2, body#support_give div#content h3 {color: #9B7856;}
body#contact div#content a, body#contact div#content h2, body#contact div#content h3 {color: #9B7856;}
 

/* =================  %STRUCTURE  ================== */

#container {
	position: absolute;
	top: 0;
	left: 50%;
	z-index: 20;
	width: 970px;
	margin-left: -485px;
	min-height: 100%;
	height: 100%;
	background: url(/images/container_bg.png) top left repeat-y;
}
html>body #container {
	height: auto;
}

#main-container {
	width: 970px;
	margin-bottom: 220px;
}

#left-column{
	float: left;
	margin: 0 0 1px 5px;
	width: 233px;
	padding: 0;
	min-height: 331px;
}
html>body #left-column{
	margin: 0 0 1px 5px;
}

#content {
	margin: 0;
	float: right;
	width: 682px;
	/* must have some padding at the bottom*/
	padding: 20px;
}
html>body #content {
	margin: 0;
	width: 682px;
	padding: 15px 31px 1px 0;
}

#content ul, #content ol {
	margin: 0px 0 0px 40px;
	list-style-image: url(/images/bullet.gif);
}

#content blockquote {
	margin: 11px 0 11px 40px;
}








/* =================== %HEADER ===================== */

#header {
	height: 200px;
	width: 960px;
	margin: 0 5px;
	background: #1f1f1f url(/images/header_bg.jpg) 0 0 no-repeat;
}

#header h1 {
	visibility: hidden;
}


/* ==================== %NAV ======================= */

/* topnav */

#topnav {
	background: none;
	position:relative;
	height: 30px;
	width: 760px;
	padding: 0 0 0 237px;
	z-index: 10;
	top: 122px;
}

#topnav a.nav {
	font-weight: normal;
	color: #d7d7d7;
	outline: none;
}
#topnav a.nav:hover {
	color: #9b7856;
	text-decoration: none;
}


#topnav ul {
	list-style: none;
	margin: 0;
	padding: 0;
	float: left;
	background: none;
}

#topnav ul li {
	position: relative;
	float: left; 
	display:block;	
	font-size: 14px;
	padding:0px 30px 0px 6px;
	text-align: left;
	height: 30px;
	width:auto;
	background: none;
	margin-left: 10px;
}
#topnav ul li:hover, body#home #topnav ul li#home, body#bio #topnav ul li#bio, body#directory #topnav ul li#directory, body#social_justice #topnav ul li#social_justice, body#arts_culture #topnav ul li#arts_culture, body#social_enterprise #topnav ul li#social_enterprise, body#contact #topnav ul li#contact {
	background: #f6f4f2 url(/images/container_bg.png) top center repeat-y;
	-moz-border-radius-topleft:3px;
	-webkit-border-top-left-radius:3px;
	-moz-border-radius-topright:3px;
	-webkit-border-top-right-radius:3px;
	color: #9b7856;
	border: 1px solid #ccc;
	border-bottom: none;
	padding:0px 29px 0px 5px;
}
body#home #topnav ul li#home a.nav, body#bio #topnav ul li#bio a.nav, body#directory #topnav ul li#directory a.nav, body#social_justice #topnav ul li#social_justice a.nav, body#arts_culture #topnav ul li#arts_culture a.nav, body#social_enterprise #topnav ul li#social_enterprise a.nav, body#contact #topnav ul li#contact a.nav {color: #333333}

#topnav li a {
	outline: none;
}
#topnav li:hover a {
	color: #9b7856;
	text-decoration:none;
}
#topnav li ul li a {
	outline: none;
	color: #3f3f3f;
	text-decoration: none;
}
#topnav li ul li a:hover {
	color: #9b7856;
}
#topnav ul li ul.subnav {
	position: absolute;
	float: left; 
	top: 30px;
	left: -1px;
	white-space: nowrap;
	width: 200px;
	background: #f6f4f2 url(/images/container_bg.png) top center repeat-y;
	-moz-border-radius-bottomleft:5px;
	-webkit-border-bottom-left-radius:5px;
	-moz-border-radius-bottomright:5px;
	-webkit-border-bottom-right-radius:5px;
	-moz-border-radius-topright:5px;
	-webkit-border-top-right-radius:5px;
	border: 1px solid #ccc;
	border-top: none;
	padding: 0;
	color: #3f3f3f;
	line-height: 18px;
}

#topnav ul ul.subnav {
	position: absolute;
	z-index: 500;
}

#topnav ul ul.subnav li {
	clear: both;
}
#topnav ul ul.subnav li a {
	color: #3f3f3f;
}
#topnav ul ul.subnav li:hover {
	background: none;
	border: none;
	padding:0px 28px 0px 6px;
	color: #9b7856;
}

#topnav ul ul.subnav li:hover a {
	color: #9b7856;
}

div#topnav ul ul,
div#topnav ul li:hover ul ul,
div#topnav ul ul li:hover ul ul
{display: none;}

div#topnav ul li:hover ul,
div#topnav ul ul li:hover ul,
div#topnav ul ul ul li:hover ul
{display: block;}


/* sidenav */
#sidenav {
	background:	none;
	width: 233px;
	height: 391px;
	position: relative;
	clear: both;
	margin-bottom: 40px;
	}
#sidenav_list	{
	border: 0;
	padding: 0;
	margin: 0;
	}
#sidenav_list ul	{
	margin: 0;
	padding: 0;
	background: url(/images/sidenav.gif) top left no-repeat;
	width: 233px;
	height: 391px;
	position: relative;
	}
#sidenav_list ul li	{
	list-style: none;
	text-indent: -5000px; 
	}
#sidenav_list ul li, #sidenav_list a	{
	height: 60px;
	display: block;
	}
#sidenav_list ul li a	{
	text-indent: -5000px; 
	text-decoration: none;
	}

#sn1 {top: 1px; left: 0px;}
#sn2 {top: 61px; left: 0px;}
#sn3 {top: 121px; left: 0px;}
#sn4 {top: 211px; left: 0px; margin-top: 30px;}
#sn5 {top: 271px; left: 0px;}
#sn6 {top: 331px; left: 0px;}
body#place #sn1, #sn1 a:hover {background: transparent url(/images/sidenav.gif) -233px 0px no-repeat;}
body#people #sn2, #sn2 a:hover {background: transparent url(/images/sidenav.gif) -233px -60px no-repeat;}
body#project #sn3, #sn3 a:hover {background: transparent url(/images/sidenav.gif) -233px -120px no-repeat;}
body#diary #sn4, #sn4 a:hover {background: transparent url(/images/sidenav.gif) -233px -210px no-repeat;}
body#donate_give #sn5, #sn5 a:hover {background: transparent url(/images/sidenav.gif) -233px -270px no-repeat;}
body#contact #sn6, #sn6 a:hover {background: transparent url(/images/sidenav.gif) -233px -330px no-repeat;}


 
.notvisible {visibility: hidden;}


/* ==================== %FOOTER ======================= */
#footer {
	clear:both;
	padding: 17px 0 0 0px;
	height: 203px;
	overflow:hidden;	
	position: absolute;
	margin-left: -480px;
	left: 50%;
	bottom: 0;
	width: 960px;
	font-size: 11px;
	line-height: 19px;
	color: #FFFFFF;
	font-size: 11px;
	color: #FFFFFF;
	background: #1f1f1f url(/images/footer_bg.gif) top left repeat-y;
}
div#footer div#quote { 
	margin: 10px 20px 10px 20px;
	background: url(/images/footer_quote_open.gif) 0 0 no-repeat;
	width: 720px;
	float: left;
}
div#footer div#quote span.quote_text {
	display: block;
	color: #f8f6f5;
	font-style:italic;
	background: url(/images/footer_quote_close.gif) bottom right no-repeat;
	padding: 15px 5px 10px 15px;
}
div#footer div#quote span.quote_text.small {
	font-size: 22px;
	line-height: 26px;
}
div#footer div#quote span.quote_text.med {
	font-size: 30px;
	line-height: 33px;
}
div#footer div#quote span.quote_text.large {
	font-size: 36px;
	line-height: 39px;
}
div#footer div#quote span.quote_by {
	font-size: 20px;
	margin-top: 5px;
	color: #b59474;
	text-align: right;
	float: right;
}

div#footer div#right_col {
	float: left;
	font-size: 12px;
	width: 150px;
	margin: 10px 0 0 10px;
	color: #e9e9e9;
}
div#footer div#right_col span.grey_text {
 color: #8c8c8c
}
	
#footer-text {
	height: 35px;
	width: 400px;
	margin: -36px 0 0 300px;
	line-height: 18px;
	font-size: 11px;
	color: #fff;
}
a.footer-link:link, a.footer-link:visited, a.footer-link:active, .footer-link {color: #ffffff; font-size: 11px;}
a.footer-link:hover {text-decoration: underline;}

.promo-item {
	margin: 0 1px 0 0;
}

.footer-img {
	margin: 0 10px 0 5px;
}

a.footerlinks {color: #FFFFFF;}

a#siteby {
	display:block;
    background-image:url(/images/moogaloo.gif);
    background-position:top right;
    background-repeat:no-repeat;
    padding:13px 75px 0 0; 
    width: 62px;
    height: 33px;
	float:left;
	margin-top: 5px;
	margin-bottom:10px;
	line-height: 1.2em;
	text-decoration:none;
	text-align:right;
	color: #ddd;
	font-size: 1.0em;
}


a#siteby:hover {
    background-position:bottom right;
}


/* =================== %HOME ======================= */

#home_gfx {
	width: 658px;
	height: 250px;
	margin: 20px 0;
}
#home_gfx a#place{
	width: 219px;
	height: 250px;
	background: url(/images/home_3gfx.jpg) 0 top no-repeat;
	margin: 0;
	padding: 0;
	text-indent: -9000px;
	float: left;
}
#home_gfx a#people{
	width: 219px;
	height: 250px;
	background: url(/images/home_3gfx.jpg) -219px top no-repeat;
	margin: 0;
	padding: 0;
	text-indent: -9000px;
	float: left;
}
#home_gfx a#project{
	width: 218px;
	height: 250px;
	background: url(/images/home_3gfx.jpg) -438px top no-repeat;
	margin: 0;
	padding: 0;
	text-indent: -9000px;
	float: left;
}
#home_gfx a#place:hover {
	background-position: 0px -250px;
}
#home_gfx a#people:hover {
	background-position: -219px -250px;
}
#home_gfx a#project:hover {
	background-position: -438px -250px;
}

/* ================ %CONTENT ITEMS ================= */


#content {
	/* must have some padding at the bottom*/
	padding: 20px;
}
#content ul, #content ol {
	margin: 0px 0 0px 40px;
	list-style-image: none;
}

#content blockquote {
	margin: 11px 0 11px 40px;
}


#left-column{
	float: left;
	margin: 0 0 1px 5px;
	width: 233px;
	padding: 0;
	min-height: 331px;
}
html>body #left-column{
	margin: 0 0 1px 5px;
}

img.frame {
	background: url(/css/skins/storyboard/carousel_img_bg.gif) top left no-repeat;
	padding: 8px;
}
.credit_left {
	width: 208px;
	font-size: 10px;
	display: block;
	float: left;
	color: #666;
	text-align: left;
	padding-left: 10px;
	margin: 0 1px 1px 0;
}
.credit_right {
	width: 208px;
	font-size: 10px;
	display: block;
	float: right;
	color: #666;
	text-align: right;
	padding-right: 10px;
	margin: 0 0 1px 1px;
}
.credit_left.frame img {
	background: url(/css/skins/storyboard/carousel_img_bg.gif) top left no-repeat;
	padding: 8px;
	margin-left: -8px;
}
.credit_right.frame img {
	background: url(/css/skins/storyboard/carousel_img_bg.gif) top left no-repeat;
	padding: 8px;
	margin-right: -8px;
}


/* ================= %PPP COLLAGES ==================== */

    #box {width: 640px; height: 440px; padding: 10px; background: url(/images/collage_bg.gif) top left no-repeat; margin: 10px;}
	.draggable { width: 223px; height: 223px; z-index: 10;}
	#one {position: relative; top: 10px; left: 10px; z-index: 10;}
	#two {position: relative; top: 100px; left: 10px; z-index: 10;}
	#three {position: relative; top: 10px; left: 100px; z-index: 10;}
	#four {position: relative; top: 150px; left: 50px; z-index: 10;}
	#five {position: relative; top: 50px; left: 150px; z-index: 10;}
	div.draggable:hover, div.draggable:focus {z-index: 580;}
	div.draggable a.info {display: none; position: relative; top: -200px; left: 25px; background: url(/images/info.png) 0 0 no-repeat; width: 19px; height: 20px; padding: 0 6px; text-indent: -9000px;}
	div.draggable a.read_more {display: none; position: relative; top: -220px; left: 47px; background: url(/images/readmore.png) 0 0 no-repeat; width: 82px; height: 20px; padding: 0 6px; line-height: 15px;}
	div.draggable:hover a {display: block;}
	div.draggable:hover a:hover {text-decoration: none; background-position: 0 -20px;}
	#box .draggable img {position: relative;}
	

#tooltip {
	position: absolute;
	z-index: 3000;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-top: 1px solid #ddd;
	border-left: 1px solid #bbb;
	border-right: 1px solid #bbb;
	border-bottom: 1px solid #999;
	background-color: #fff;
	padding: 2px 5px 8px;
	opacity: 0.90;
	font-size: 15px;
	width: 150px;
}
#tooltip h3, #tooltip div { margin: 0; 	font-size: 15px; line-height: 17px; }

	
/* ================= %STORYBOARD ==================== */

.jcarousel-skin-storyboard li.jcarousel-item {
	font-size: 14px; 
}
.jcarousel-skin-storyboard li.jcarousel-item img {
	background: url(/css/skins/storyboard/carousel_img_bg.gif) top left no-repeat;
	padding: 8px;
	margin: 0 10px 0 7px;
	float: left;
}
.jcarousel-skin-storyboard li.jcarousel-item img.noframe {
	background: none;
	margin: 0 10px 0 7px;
	padding: 0;
	float: left;
}
.jcarousel-skin-storyboard li.jcarousel-item a {
	color: #45ada2;
}

/* ================ %CONTACT FORM ================== */

textarea, input[type='text'], input[type='textarea'], select { border: 1px solid #ccc; background: #fff; }
textarea:hover, input[type='text']:hover, input[type='textarea']:hover, input[type='password']:hover, select:hover { border-color: #aaa; }
textarea:focus, input[type='text']:focus, input[type='textarea']:focus, input[type='password']:focus, select:focus { border-color: #888; outline: 2px solid #82B62F; }
input, select { cursor: pointer; }
input[type='text'], input[type='textarea'] { cursor: text; }

.contact_col {
	float: left;
	width: 300px;
	height: 280px;
	display: block;
	margin: 0 20px 0 0;
}

.contact_col fieldset {
	border: none;
	padding: 0;
	margin: 0;
	font-size: 0.8em;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-style:italic;
	color: #666;
}
.contact_col fieldset input, .contact_col fieldset textarea {
	height: 18px;
	width: 298px;
	margin: 6px 3px 0px 0;
	padding: 1px 0 0 2px;
	background-color: #FFFFFF;
}
.contact_col fieldset textarea#message {
	height: 128px;
}
.contact_col fieldset input#send {
	width: 50px;
	height: 22px;
	padding: 1px;
	background-color: #9B7856;
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #eee;
	font-weight: normal;
	font-style: italic;
	border: 1px solid #AAAAAA;
	-moz-border-radius:3px; 
	-moz-border-radius:3px;
}
.contact_col fieldset input#send:hover {
	color: #1F1F1F ;
	border: 1px solid #444;
}

.preinput { color: #999; font-style:italic; font-family: Georgia, "Times New Roman", Times, serif; font-size: 0.9em;}
.postinput { color: #1F1F1F ; font-style:italic; font-family: Georgia, "Times New Roman", Times, serif; font-size: 0.9em;}

p.error {
	font-size: 0.8em;
	color:#FF0000;
	margin: 0 0 5px 0;
}



/* ================== %DONATE_GIVE ===================== */

#give_us, #give_uk {
	width: 230px;
	height: 220px;
	padding: 0 10px;
	float: left;
	margin: 0 30px 10px 20px;
	text-align: center;
}
.give_us_bg {background: url(/images/give_us_bg.gif) 0 28px no-repeat;}
.give_uk_bg {background: url(/images/give_uk_bg.gif) 0 28px no-repeat;}

#give_uk p, #give_us p {
margin-bottom: 0.5em;
}
#give_uk h4.widget, #give_us h4.widget {
	text-align: center;
	color: #FFFFFF;
	font-size: 20px;
	font-weight: normal;
	line-height: 22px;
	margin: 16px 0px 10px;
}
#give_uk p.widget, #give_us p.widget {
	text-align: center;
	color: #FFFFFF;
	font-size: 11px;
	font-weight: normal;
	line-height: 14px;
	margin: 0em;
	height: 60px;
}
#give_uk a.donate, #give_us a.donate {
	text-indent: -6000px;
	display: block;
	width: 82px;
	height: 41px;
	float: left;
	margin: 12px 20px 10px 8px;
	background: url(/images/give_donate.gif) 0 0 no-repeat;
}
#give_uk a.donate:hover, #give_us a.donate:hover {
	background: url(/images/give_donate.gif) 0 -41px no-repeat;
}

#give_us a.gz {
	text-indent: -6000px;
	display: block;
	width: 83px;
	height: 28px;
	float: left;
	margin: 20px 10px 25px 16px;
	background: url(/images/give_us_gz.gif) 0 0 no-repeat;
}
#give_us a.gz:hover {
	background: url(/images/give_us_gz.gif) 0 -28px no-repeat;
}
#give_uk a.cms {
	text-indent: -6000px;
	display: block;
	width: 57px;
	height: 48px;
	float: left;
	margin: 10px 10px 16px 50px;
	background: url(/images/give_uk_cms.gif) 0 0 no-repeat;
}
#give_uk a.cms:hover {
	background: url(/images/give_uk_cms.gif) 0 -48px no-repeat;
}
	
	

.caption {
width: 100%;
text-align: center;
padding: 0;
line-height: 0.8;
font-size: 9pt;
margin: 20px 0 0 0;
font-family:"Times New Roman", Times, serif;
clear: both;
}
.caption a {
color: #666;
text-decoration: none;
}
.caption a:hover {
text-decoration: underline;
}	

/* ================ %DIARY =================== */

div#diary {
	width: 627px;
	height: 443px;
	margin: 7px 0;
	backsground: url(/images/diary_01.jpg) top left no-repeat;
}

div#diary.w01 {background: url(/images/diary_01.jpg) top left no-repeat;}
div#diary.w02 {background: url(/images/diary_02.jpg) top left no-repeat;}
div#diary.w03 {background: url(/images/diary_03.jpg) top left no-repeat;}
div#diary.w04 {background: url(/images/diary_04.jpg) top left no-repeat;}

div#diary div.diary_col1 {
	width: 250px;
	display: block;
	margin: 0 0 0 50px;
	float: left;
}
div#diary div.diary_col2 {
	width: 275px;
	display: block;
	margin: 0 24px 0 0;
	float: right;
}
div#diary div.cell {
	display: block;
	font-size: 0.8em;
	line-height: 1.2em;
	color: #3f3f3f;
	font-style:italic;
}

div#diary div.cell#wc {
	width: 116px;
	height: 22px;
	margin: 47px 0 0 129px;
	float: left;
}
div#diary div.cell#mon {
	width: 232px;
	height: 50px;
	margin: 25px 0 0 9px;
	float: left;
}
div#diary div.cell#tues {
	width: 232px;
	height: 50px;
	margin: 22px 0 0 9px;
	float: left;
}
div#diary div.cell#wed {
	width: 232px;
	height: 60px;
	margin: 28px 0 0 9px;
	float: left;
}
div#diary div.cell#thurs {
	width: 232px;
	height: 60px;
	margin: 26px 0 0 9px;
	float: left;
}
div#diary div.cell#fri {
	width: 232px;
	height: 65px;
	margin: 80px 36px 0 0;
	float: right;
}
div#diary div.cell#sat_sun {
	width: 232px;
	height: 50px;
	margin: 36px 36px 0 0;
	float: right;
}
div#diary div.cell#notes {
	width: 232px;
	height: 114px;
	margin: 35px 34px 0 0;
	float: right;
}