/* ---------------------------------------------------------------------------
	
	L'arche Harbor House Master Styles
	http://www.larchejacksonville.org
	
	author: Subtle Technology
	http://www.subtletech.com
	
--------------------------------------------------------------------------- */
@import url("_reset.css");
@import url("_base.css");


/* =GLOBAL
-------------------------------------------------------------- */

body {
	background-color: #fff;
	color: #000;
	/*font-family: "Helvetica Neue", Helvetica, Arial, sans;*/
	font-family: Verdana, Arial, sans;
	padding-top: 55px;
}

#container {
	margin: 0 auto;
	width: 900px;
}

#content {

}

footer {
	font-size: 9px;
	margin: 16px 0;
	text-align: center;
}
footer p { line-height: 14px; margin: 0; }

/*
	=CLEARING
--------------------------------------------------------------------------- */
#container:after,
nav ul:after,
#quicklinks:after,
#updates:after,
#content:after,
#content article:after,
.quote:after,
.partners-list:after,
form p.two-cols:after,
#content.news-events-gallery article section:after {
    content: "."; 
    display: block; 
    height: 0;
    clear: both; 
    visibility: hidden;
}

/* =Typography
--------------------------------------------------------------------------- */
#error #content ul,
#content-main ul { margin-left: 18px; }

/* =Header
-------------------------------------------------------------- */
header { }

#logo {
	background: url(../img/logo-screen.png) no-repeat 0 0;
	float: left;
	margin: 6px 0 0 20px;
	width: 99px;
	height: 106px;
}

#logo a {
	display: block;
	height: 100%;
}

#logo img {
	position: absolute;
	top: 0;
	left: -9999px;
}

/* =Navigation
--------------------------------------------------------------------------- */
nav { float: right; }

nav ul {
	list-style: none;
	margin: 0;
}

nav ul li { display: block; float: left; margin-right: 30px; }
nav ul li a {
	color: #000;
	display: block;
	font-family: "Helvetica Neue", Helvetica, Arial, sans;
	font-size: 11px;
	font-weight: bold;
	line-height: 15px;
	padding: 4px 0 4px;
	text-transform: uppercase;
}
nav ul li a:hover { color: #0068b3; }

nav .nav-children li { display: block; float: none; margin: 0; line-height: 1.0em; }
nav .nav-children li a {
	color: #666;
	font-family: Verdana, Arial, sans;
	font-weight: normal;
	line-height: 16px;
	/*margin: 0 -6px;
	padding: 1px 6px;*/
	padding: 1px 0;
	text-transform: none;
	
	/*
	border-radius: 20px;
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  */
}
nav .nav-children li a:hover,
nav .nav-children li.here a { background-color: #eee; }

#nav-home { /*width: 88px;*/ }
#nav-home a { background: url(../img/icon-home.png) no-repeat 0 0; display: block; height: 16px; padding-left: 24px; }
#nav-learn { /*width: 96px;*/ }
#nav-participate { /*width: 142px;*/ }
#nav-art-shop { /*width: 132px;*/ }
#nav-news-events { /*width: 120px;*/ }
#nav-contact { /*width: 142px;*/ margin: 0; }

/* =Quicklinks
--------------------------------------------------------------------------- */
#quicklinks {
	/*background: url(../img/quicklinks.png) no-repeat 0 0;*/
	border-top: 32px solid #fff;
	clear: both;
	height: 28px;
	list-style: none;
	margin: 0 0 10px;
}

#quicklinks li { float: left; height: 28px; margin-right: 11px; width: 172px; }
#quicklinks li.last { margin: 0 !important; }
#quicklinks li a { background-image: url(../img/quicklinks.png); display: block; height: 100%; text-indent: -9999px; }

#quick-donation a { background-position: 0 0; }
#quick-donation a:hover, #quick-donation.here a { background-position: 0 -28px; }

#quick-involved { margin-right: 10px !important; }
#quick-involved a { background-position: -183px 0; }
#quick-involved a:hover, #quick-involved.here a { background-position: -183px -28px; }

#quick-wish { margin-right: 10px !important; }
#quick-wish a { background-position: -365px 0; }
#quick-wish a:hover, #quick-wish.here a { background-position: -365px -28px; }

#quick-signup { margin-right: 10px !important; }
#quick-signup a { background-position: -547px 0; }
#quick-signup a:hover, #quick-signup.here a { background-position: -547px -28px; }

#quick-video { width: 170px !important; }
#quick-video a { background-position: -729px 0; }
#quick-video a:hover { background-position: -729px -28px; }

/* =Content
--------------------------------------------------------------------------- */

/* =Home
--------------------------------------------------------------------------- */

/* features */
#features { width: 900px;	height: 271px; margin-bottom: 10px; position: relative; }
#features p { width: 100%; height: 100%; text-indent: -9999px; top: 0; left: 0; }
#features img { width: 100%; height: 100%; top: 0; left: 0; }

#feature-transforming { background: transparent url(../img/home-feature-transforming.jpg) no-repeat 0 0; }
#feature-spirituality { background: transparent url(../img/home-feature-spirituality.jpg) no-repeat 0 0; }
#feature-commitment { background: transparent url(../img/home-feature-commitment.jpg) no-repeat 0 0; }

#feature-nav {
	/*background-color: rgba(0,0,0,0.5);*/
	background: url(../img/bg-black-50percent.png) repeat 0 0;
	color: #fff;
	font-size: 12px;
	padding: 7px 10px 0;
	line-height: 1.0em;
	list-style: none;
	margin: 0;
	text-transform: uppercase;
	width: 516px;
	height: 21px;
	
	position: absolute;
		bottom: 0;
		left: 0;
	z-index: 9999;
}

#feature-nav li { border: 1px solid #fff; float: left; margin-right: 6px; text-indent: -9999px; width: 13px; height: 13px; }
#feature-nav .activeSlide { background-color: #fff; }

#feature-nav li a { color: #fff; display: block; height: 100%; }
#feature-nav li a:hover { background-color: #fff; }

#feature-nav li.read-feature { border: none; line-height: 15px; margin-left: 12px; text-indent: 0; width: auto; }
#feature-nav li.read-feature a:hover { background-color: transparent; text-decoration: underline; /*color: #0068b3;*/ }

/* updates */
#updates { background-color: #e7e7e8; font-size: 11px; line-height: 16px; padding: 14px 20px; }

#updates h3 { color: #666; font-size: 14px; font-weight: normal; padding-bottom: 20px; text-transform: uppercase; }
#updates h3 em { font-style: normal; font-weight: bold; }
#updates h4 { color: #000; font-size: 11px; font-weight: bold; }
#updates h4,
#updates span.date { display: block; line-height: 1.0em; padding-bottom: 8px; }

#updates p { margin: 0; }
#monthly-partner p { margin-bottom: 12px; }

#upcoming-events,
#recent-news,
#monthly-partner { float: left; min-height: 110px; padding-top: 6px; padding-bottom: 6px; }

#upcoming-events { border-right: 1px solid #fff; padding-right: 10px; width: 236px; }
#recent-news { border-left: 1px solid #fff; border-right: 1px solid #fff; height: 100%; margin-left: -1px; padding-left: 28px; padding-right: 28px; width: 224px; }
#monthly-partner { border-left: 1px solid #fff; margin-left: -1px; padding-left: 28px; width: 292px; }

#recent-news .news-items,
#upcoming-events .event-items { list-style: none; }
#recent-news .news-items li,
#upcoming-events .event-items li { margin-bottom: 10px; }
#recent-news .news-items li .date,
#upcoming-events .event-items li .date { font-size: 0.8em; font-weight: bold; padding-bottom: 4px; }

/* Banners */
.banner {
  margin-bottom: 10px;
  text-indent: -9999px;
}
.banner a {
  display: block;
  height: 100%;
}

.banner.waff {
  background: url(../img/home-banner-waff.png) no-repeat 0 0;
  height: 93px;
}

/* =Secondary
--------------------------------------------------------------------------- */
#content { background: url(../img/bg-sidebar.png) repeat-y 0 0; }

#content #sidebar {
	background-color: #e7e7e8;
	float: left;
	font-size: 11px;
	line-height: 1.4em;
	padding: 22px 18px 18px;
	
	width: 136px; /* 172 wixels */
}

#content #sidebar h4 { color: #000; font-size: 16px; font-weight: 400; margin-bottom: 8px; }

#content #sidebar ul { list-style: none; }
#content #sidebar ul li { margin-bottom: 8px; }

/* article */

#content article {
	float: right;
	font-size: 13px;
	line-height: 20px;
	
	width: 728px;
}

#content article section { float: left; padding: 0 28px 0 22px; width: 325px;  }

#content article h1 {
	color: #000;
	display: block;
	font-family: "Helvetica Neue", Helvetica, Arial, sans;
	font-size: 12px;
	font-weight: bold;
	line-height: 1.0em;
	margin: 16px 0 24px;
	text-transform: uppercase;
}

#content article h2 { text-indent: -9999px; }
#content article h3 { color: #000; font-size: 14px; line-height: 18px; font-weight: bold; }

#content article ul { line-height: 1.2em; margin-left: 18px; }
#content article ul li { margin-bottom: 8px; }

/* supporting content */
#content article aside {
	float: right;
	
	width: 353px;
}

#content article aside img { margin-bottom: 12px; vertical-align: middle; }
#content article aside .quote {
	background-color: #88bbaa;
	font-family: "Helvetica Neue", Helvetica, Arial, sans;
	font-size: 18px;
	letter-spacing: 0.05em;
	line-height: 24px;
	padding: 22px;
}
#content article aside .quote em { color: #fff; font-style: normal; }

#content article aside .quote blockquote {
	color: #000;
	font-family: "Helvetica Neue", Helvetica, Arial, sans;
	font-style: normal;
	margin: 0;
	margin-left: 0.25em;
	text-indent: -0.5em;
}
#content article aside .quote blockquote .quoted_by {
	color: #fff;
	font-family: Helvetica, sans;
	font-style: normal;
	font-size: 0.6em;
	letter-spacing: 0.05em;
	margin: 0.75em 0 0;
	text-align: right;
	text-transform: uppercase;
}

/* =Pages
--------------------------------------------------------------------------- */
#content.learn-mission h2 { background: url(../img/text-living-simple-lifestyle.png) no-repeat 0 0; height: 87px; }
#content.learn-stories h2 { background: url(../img/text-relationships-that-bind.png) no-repeat 0 0; height: 88px; }
#content.learn-founder h2 { background: url(../img/text-how-it-all-began.png) no-repeat 0 0; height: 30px; }
#content.learn-faqs h2 { background: url(../img/text-faq.png) no-repeat 0 0; height: 85px; }
#content.learn-jacksonville h2 { background: url(../img/text-weather-fabulous.png) no-repeat 0 0; height: 53px; }

#content.participate-donate h2 { background: url(../img/text-easy-ways-give.png) no-repeat 0 0; height: 27px; }
#content.participate-be-an-assistant h2 { background: url(../img/text-discover-you.png) no-repeat 0 0; height: 69px; }
#content.participate-be-an-assistant-assistant-application h2 { background: url(../img/text-assistant-application.png) no-repeat 0 0; height: 75px; }
#content.participate-volunteer h2 { background: url(../img/text-get-to-know.png) no-repeat 0 0; height: 23px; }
#content.participate-wish-list h2 { background: url(../img/text-things-we-need.png) no-repeat 0 0; height: 81px; }

#content.participate-donate-general-donations h2 { background: url(../img/text-care-share-invest.png) no-repeat 0 0; height: 25px; }
#content.participate-donate-we-are-family-fund h2 { background: url(../img/text-we-are-family-fund.png) no-repeat 0 0; height: 25px; }

#content.art-shop-rainbow-workshop h2 { background: url(../img/text-works-from-heart.png) no-repeat 0 0; height: 90px; }
#content.art-shop-calendar h2 { background: url(../img/text-year-celebration.png) no-repeat 0 0; height: 92px; }
#content.art-shop-greeting-cards h2 { background: url(../img/text-great-gift.png) no-repeat 0 0; height: 69px; }

#content.news-events-news h2 { background: url(../img/text-spotlight.png) no-repeat 0 0; height: 85px; }
#content.news-events-events h2 { background: url(../img/text-whats-next.png) no-repeat 0 0; height: 39px; }
#content.news-events-gallery h2 { background: url(../img/text-look-what.png) no-repeat 0 0; height: 28px; }
#content.news-events-golf-tournament h2 { background: url(../img/text-making-the-cut.png) no-repeat 0 0; height: 31px; }

#content.contact-contact-us h2 { background: url(../img/text-hope-divided.png) no-repeat 0 0; height: 89px; }
#content.contact-mailing-list h2 { background: url(../img/text-keep-in-touch.png) no-repeat 0 0; height: 58px; }
#content.contact-leadership h2 { background: url(../img/text-who-does-what.png) no-repeat 0 0; height: 80px; }
#content.contact-board h2 { background: url(../img/text-looking-out.png) no-repeat 0 0; height: 72px; }
#content.contact-auxiliary h2 { background: url(../img/text-helping-hands.png) no-repeat 0 0; height: 26px; }
#content.contact-currents h2 { background: url(../img/text-making-waves.png) no-repeat 0 0; height: 36px; }

/* Quote/aside bg color */
body#learn #content article aside .quote { background-color: #88bbaa; }
body#participate #content article aside .quote { background-color: #ee8844; }
body#art-shop #content article aside .quote { background-color: #99bb55; }
body#news-events #content article aside .quote { background-color: #cc8877; }
body#contact #content article aside .quote { background-color: #997766; }

/* =FAQ
--------------------------------------------------------------------------- */
dl.faq { margin-bottom: 30px; }

dl.faq dd,
dl.faq dt { margin: 0; padding-left: 2.0em; }

dl.faq em { display: inline-block; font-style: normal; font-weight: bold; margin-left: -2.0em; width: 2.0em; }

/* =News
--------------------------------------------------------------------------- */
#content article section article {
	border-bottom: 1px solid #ccc;
	float: none;
	margin-bottom: 30px;
	padding: 0;
	width: auto;
}

#content.news-events-news .date { margin-bottom: 6px; }
#content.news-events-news .author { font-size: 0.9em; font-style: italic; margin-bottom: 5px; }

.news-list li,
.events-list li { margin-bottom: 12px !important; }
.news-list li .date,
.events-list li .date { font-size: 0.85em; font-weight: bold; margin: 0 !important; }

.archive-list { list-style: none; margin-left: 0 !important; }
.archive-list li { padding-left: 3.5em; position: relative; }
.archive-list .date { display: block; float: left; font-size: 0.8em; font-weight: bold; position: absolute; left: 0; top: 2px; }
.archive-list li a { display: block; }

/* =Events
--------------------------------------------------------------------------- */
.event-list-item {
	border-bottom: 1px solid #ccc;
	font-size: 0.9em;
	margin-bottom: 20px;
}

.event-list-item .date { font-size: 1.1em; margin: 0; }
.event-list-item .read-more { margin-top: -16px; }

.event-meta { list-style: none; margin-left: 0 !important; }
.event-meta li { margin-bottom: 0 !important; }
.event-meta li em { font-size: 0.8em; font-style: normal; font-weight: bold; text-transform: uppercase; }

/* =Photo gallery
--------------------------------------------------------------------------- */
#content.news-events-gallery article section { float: none; width: auto; }

.gallery-item { float: left; margin: 0 22px 30px 0; width: 200px; }
.gallery-item .thumb { margin-bottom: 10px; }
.gallery-item .date { font-size: 0.85em; margin: 0; }
.gallery-item h3 { padding: 0; }

.gallery-photos img {
	float: left;
	margin: 0 10px 10px 0;
}

#content.gallery-detail article section p { width: 580px; }

/* =Leadership
--------------------------------------------------------------------------- */
.staff { margin-bottom: 20px; }
.staff h3 { line-height: 1.0em; margin: 0; padding: 0; }
.staff .role { color: #000; font-size: 0.9em; font-style: italic; line-height: 1.0em; margin-bottom: 0.75em; }
.staff p { color: #666; ]font-size: 0.9em; line-height: 1.4em; }

/* =Restaurant Partners
--------------------------------------------------------------------------- */
.monthly-partner .partner-logo { margin-bottom: 10px; }
.monthly-partner h6 { margin-bottom: 0.5em; }
.monthly-partner .partner-location { font-size: 0.85em; margin-bottom: 16px; }
.monthly-partner .partner-location span { display: block; }
.monthly-partner .partner-location .phone { margin-top: 0.45em; }

/* =Calendar
--------------------------------------------------------------------------- */
#content.art-shop-calendar .quote h3 {
  color: #003300;
  font-size: 20px;
  font-weight: normal;
  line-height: 24px;
  padding: 0 0 20px;
  text-transform: capitalize;
}
#content.art-shop-calendar .quote h3 span { color: #fff; display: block; }

#content.art-shop-calendar #BB_BuyButtonForm { background-color: #efefef; padding: 14px; }
#content.art-shop-calendar #BB_BuyButtonForm label { font-weight: normal; }
#content.art-shop-calendar #BB_BuyButtonForm button {}
#content.art-shop-calendar #BB_BuyButtonForm .note { font-size: 10px; font-style: italic; }

.partners-list { background-color: #fff; border: 1px solid #ececec; list-style: none; margin: 0 -22px -22px !important; padding: 22px 22px 12px; }
.partners-list li { background-position: 50% 50%; background-repeat: no-repeat; float: left; margin: 0 10px 10px 0; text-indent: -9999px; width: 90px; height: 100px; }

/* =Misc
--------------------------------------------------------------------------- */
.caps { font-size: 1.0em; font-variant: normal; text-transform: none; }

.read-more,
.back-to { font-size: 0.75em; text-transform: uppercase; }

h1 .back-to { float: right; }

.last { border: none !important; }

.view-all,
.archive { font-size: 0.8em; text-transform: uppercase; }

.policy { font-size: 10px; font-style: italic; line-height: 1.2em; margin-top: 30px; }
.policy em { font-style: normal; font-weight: bold; }


/* =Forms
--------------------------------------------------------------------------- */
form { font-size: 12px; line-height: 1.4em; }

form p { margin-bottom: 12px; }

form label {
	display: block;
	font-weight: bold;
	margin-bottom: 3px;
}

form label.with-extra { font-weight: normal; }

form .confirm-field { display: none; }

form input,
form textarea {
	border: 1px solid #ccc;
	font-size: 14px;
	padding: 4px 3px;
	width: 96%;
}
form textarea { height: 10em; }

form #contact-submit,
form #mailing-submit,
form #app-submit { 
	background-color: #ccc;
	border: none;
	cursor: pointer;
	display: block;
	padding: 8px 20px;
	text-transform: uppercase;
	
	/*width: 106px;*/
	/*height: 27px;*/
	
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
}
form #contact-submit:hover,
form #mailing-submit:hover,
form #app-submit:hover { background-color: #333; color: #eee; }

form p.checkbox { padding-left: 26px; }
form p.checkbox label { display: inline; text-align: left; }
form p.checkbox input { border: none; display: inline; float: left; margin-left: -26px; margin-right: 6px; width: auto; }

/* Google forms (Donate + Calendar) */
#BB_BuyButtonForm label {}
#BB_BuyButtonForm input { color: #999; text-align: right; width: auto; vertical-align: middle; }
#BB_BuyButtonForm button { background-color: transparent; border: none; cursor: pointer; padding: 0; vertical-align: top; }

/* Mailing list form */
form p.two-cols span { display: block; }
form p.two-cols .state { float: left; width: 200px; }
form p.two-cols .state select { width: 96%; }
form p.two-cols .zip { float: right; margin-right: 9px; width: 100px; }

/* Donate button */
.donate-button {
  background-color: #e84;
  color: #fff;
  display: inline-block;
  padding: 5px 10px;
  text-transform: uppercase;
  
  border-radius: 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  
  box-shadow: 0 2px 2px rgba(0,0,0,0.4);
  -webkit-box-shadow: 0 2px 2px rgba(0,0,0,0.4);
  -moz-box-shadow: 0 2px 2px rgba(0,0,0,0.4);
}

.donate-button:hover,
.donate-button:focus,
.donate-button:active { color: #000; }

/* errors
-------------------------------------- */
.form-message {
	margin-bottom: 20px;
	padding: 7px 15px;
	color: #789700;
	border: 2px solid #dcdcdc;
	font-weight: bold;
}

.form-message.error { background-color: #f7c2c2; border-color: #f39797; }

.form-message p {
	margin-bottom: 0;
	padding-left: 18px;
}

.form-message ul { 
	margin: 0;
	margin-left: 0 !important;
	list-style: none;
}

.error { color: #333; }

.error li, label.error {
	padding: 0 0 0 18px;
	margin: 3px 0;
	font-weight: normal;
	background: url(../img/icon_error.gif) no-repeat 0 50%;
}

.error span, label span { 
	color: #c00; 
	font-weight: bold;
}

label.required { color: #961616; }
label.required span { background: url(../img/_required.png) no-repeat 50% 50%; width: 10px; display: inline-block !important; text-indent: -9999px; }