/*
Theme Name: slf 
Theme URI: http://somervillelocalfirst.org/
Description: Custom WordPress theme for Somerville Local First.
Version: 1.0
Author: Andy Pyman
Tags: custom, fixed width, two columns
*/

html, body {height:100%;background:		url(images/bg3.png)}

body {
	font-size:		100%;
}



#wrap {
	width:			1023px;
	padding-top:	0px;
	height:			auto;
	font-family:	Arial, Helvetica, sans-serif;
	margin:			0 auto;
	font-size:		100%;
}


		

/*	common elements		*/
#content h1 {
	text-transform:	uppercase;
	color:			#51772c;
	font-size:		24px;	
	margin-bottom:	10px;
}

#content h2 a,
#content h2 {
	text-transform:	uppercase;
	font-size:		18px;
	color:			#51772c;	
	margin-bottom:	10px;
}

#content h3 a,
#content h3 {
	font-size:		14px;
	color:			#BBDD86;	
	margin-bottom:	10px;
}


#content ol,
#content ul,
#content p {
	color:			#333;
	font-size:		13px;
	line-height:	18px;
	margin:			0 0 14px 0;
}

#content p a,
#content li a {
	color:			#395022;
	border-bottom:	1px dotted #395022;
	font-weight:	bold;
}


#content .post p a:hover,
#content .post li a:hover {
	color:			#fff;
	border-bottom:	1px solid #395022;
	background:		#395022;
}

#content li {
	list-style-type:square;
	list-style-position:outside;
	margin:			0 0 10px 14px;
}

sup,
sub {
	height: 0;
	line-height: 1;
	vertical-align: baseline;
	_vertical-align: bottom;
	position: relative;
	
}

sup {
	bottom: 1ex;
}

sub {
	top: .5ex;
}

hr {
	display:		block;
	margin:			40px auto;
	width:			80%;
}


/*	header	*/


	#supplemental {
		margin:			10px 0 6px 0;
	}
	
		#quicklinks {
			float:			left;
			width:			150px;
			margin-top:		14px;
		}
		
			#quicklinks select,
			select.goog-te-combo {
				background:		#e9fbc1;
				padding:		2px;
				border:			none;
				font-size:		12px;
				color:			#51772c;
				margin-top:		0;
			}
			
		span#home-icon {
			float:		left;
			display:	block;
			width:		16px;
			padding-top:16px;
			margin-right:10px;
		}

		ul#action {
			float:			right;
			width:			730px;
		}
		
			ul#action li {
				float:			left;
				width:			180px;
			}
			
				ul#action p {
					font-size:		12px;
					margin:			0;
					color:			#51772c;
					text-transform:	lowercase;
					padding-left:	2px;
				}
				
				ul#action input {
					background:		#e9fbc1;
					padding:		2px;
					border:			none;
					font-size:		12px;
				}
				
				ul#action button.go {
					text-indent:	-9999px;
					background:		url(images/assets/go.png) no-repeat;
					width:			16px;
					height:			15px;
					border:			none;
					overflow:		hidden;
				}
				
				ul#action button.go:hover {
					cursor:			pointer;
				}
				
					ul#action li.social-media {
						/*	for 4 icons 
						width:			120px;
						*/
						
						/*	for 2 icons	*/
						width:			120px;
					}
					
					
					ul#action li.social-media ul {
						float:			right;
						width:			102px;
					}
					
					ul#action li.social-media ul li {
						float:			left;
						width:			30px;
						margin-top:		12px;
						line-height:	0;
						
						/* for 2 icons */
						margin-right:	2px;
						padding-left:	2px;
					}
					
					li.flickr, li.vimeo {
						display:		none;
					}
					
						ul#action li.social-media ul li img {
							filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
							-moz-opacity: 0.5;
							opacity: 0.5;
						}

						ul#action li.social-media ul li:hover img{
							filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);
							-moz-opacity: 1;
							opacity: 1;
						}
						
						
/*	main navigation	*/
#main-nav {
	height:			43px;
}

#main-nav li {
	display:		inline;
	float: 			left;
	width:			111px;
	height:			43px;
	background-color:#bbdd86;
	text-align:		center;
	text-transform:	uppercase;
	font-size:		13px;
}

#main-nav li.spacer-first {
	width:			51px;
	height:			43px;
	background:		url(images/assets/nav-spacer-first.png);
}


#main-nav li.spacer {
	width:			51px;
	height:			43px;
	background:		url(images/assets/nav-spacer.png);
}

#main-nav li.spacer-last {
	width:			51px;
	height:			43px;
	background:		url(images/assets/nav-spacer-last.png);
}

#main-nav li a {
	color:			#51772c;
	display:		block;
	padding:		16px 0 12px 0;
}

#main-nav li a:hover,
.page-id-4 #campaign-nav a,
.page-id-16 #the-movement-nav a,
.page-id-28 #our-members-nav a,
.page-id-45 #local-first-events-nav a,
.blog #local-first-blog-nav a,
.page-id-60 #connect-nav a {
	color:			#333;
	font-weight:	bold;
}

#main-nav li ul {
	border:			1px solid #fff;
	width:			158px;
	background:		#BBDD86;
}
#main-nav li li {
	text-align:		left;
	font-size:		90%;
	margin:			0;
	height:			auto;
}

#main-nav li li a {
	padding:		20px 10px;
	border-bottom:	1px solid #fff;
	}


/*	 content		*/
#content-wrap {
	width:			970px;
	border-left:	51px solid #51772c;
	border-right:	1px dashed #BBDD86;
}

	#content {
		padding:		25px 50px;
		background:		#fff;
	
	}


/*	logo & what's happening	*/
h1#logo {
	width:		399px;
	height:		175px;
	float:		left;
}

div#now {
	border-bottom:	6px dashed #d5e8d6;
	width:		390px;
	float:		right;
	padding:	0 0 10px 0;
	margin:		0 0 0 0;
}

div#now img {margin-left:10px;}

div#now form {width:230px;float:left;}

div#now p {float:right;width:140px;display:inline;margin:0;}

div#now p a:hover {border-bottom:1px solid #006633}


	div.date {
		float:			left;
		width:			46px;
		text-align:		center;
		margin-right:	18px;
		padding-right:	4px;
		padding-bottom:	6px;
		border-right:	2px dashed #d5e8d6;
	}
	
		#now div.date {
			padding-bottom:	70px;
			border-right:	4px dashed #d5e8d6;
		}
	
	 span.month {
		font-size:		12px;
		text-transform:	uppercase;
		display:		block;
		margin:			0;
		line-height:	14px;
	}
			
		#now span.month {
			font-size:		16px;
			line-height:	24px;
		}

	span.day {
		font-size:		16px;
		display:		block;
		margin:			0;
		line-height:	12px;
	}
		
		#now span.day {
			font-size:		27px;
			line-height:	18px;
		}
		
		span.time {
			font-size:		10px;
			display:		block;
			margin:			0;
		}
		
		
/*	home	*/
				
.home div.left {
	float:		left;
	width:		430px;
	}
		
		/* carousel code in carousel.css 	*/
		
		
		div#sponsor {
			width:			100%;
			border-top:		7px dashed #cce3ce;
			position:		relative;
			margin:			0 0 30px 0;
		}
		
			#sponsor h2 {
				background:		#fff;
				margin-top:		-12px;
				width:			200px;
			}
			
			#sponsor img {
				float:			left;
				margin-right:	20px;
				width:			150px;
				height:			auto;
			}
			
			#content #sponsor p {
				font-size:		12px;
				line-height:	14px;
				margin-bottom:	4px;
			}
			
			#sponsor p a {
				float:			right;
			}
			
			#sponsor .socialwrap {
				display:			none;
			}
			
		.mini-left {
			float:		left;
			width:		215px;
		}
		
			#facebook {
				margin-bottom:	10px;
			}
			
			
				#facebook h2 {
					padding-left:	26px;
					background:		url(images/icons/facebook2.png) left top no-repeat;
					margin-bottom:	4px;
				}
				
		
			#tweets h2 {
				padding-left:	26px;
				background:		url(images/icons/twitter-bird.png) left top no-repeat;
			}
		
		.mini-right {
			float:			right;
			width:			182px;
			border-left:	2px dashed #cce3ce;
			padding-left:	16px;
			height:			400px;
		}	
		
			#shift-and-save h2 {
				padding-left:	20px;
				background:		url(images/icons/shift.png) left no-repeat;
			}	
		
		
	.home div.right {
		float:		right;
		width:		440px;
	}
	
		#engage {
			min-height:		72px;
			margin-bottom:	30px;
		}
	
		#engage li {
			height:			100%;
			margin-bottom:	20px;
			list-style-type:none;
			margin-left:	0;
			list-style-position:inside;
		}		
	
		#engage span.h2 {
			text-align:		center;
			font-size:		35px;
			color:			#678a45;
			text-indent:	-9999px;
			width:			247px;
			height:			72px;
			float:			left;
		}
		
		#engage span.h2 a {
			width:			247px;
			height:			72px;
		}
		
			#join span.h2 {
				background:		url(images/buttons/join.png) center no-repeat;
			}
			
			#find span.h2 {
				background:		url(images/buttons/find.png) center no-repeat;
			}
			
			#learn span.h2 {
				background:		url(images/buttons/learn.png) center no-repeat;
			}
			
		#engage span.p {
			border:			1px solid #BBDD86;
			border-left:	none;
			margin-left:	247px;
			display:		block;
			min-height:		70px;
			background:		#51772c;
		}
			
		#engage span.p a {
			display:		block;
			color:			#fff;
			padding:		8px 10px;
			font-size:		90%;
			border-bottom:	none;
		}
		
			#engage span.p a:hover {
				display:		block;
				color:			#E9FBC1;
				padding:		8px 10px;
				font-size:		90%;
			}
		
		#from-the-blog {
			border-top:		7px dashed #cce3ce;
			margin-left:	50px;
			padding-top:	10px;
			margin-bottom:	20px;
		}
			
			#from-the-blog .entry p {
				margin:			0 0 10px;
			}
			
			#from-the-blog h2 a {
				color:			#51772C;
			}
			
		#hylo {
			border-top:		7px dashed #cce3ce;
			margin-left:	50px;
			padding-top:	20px;
		}

/* breadcrumbs */
#breadcrumbs {
	clear:		both;
	width:		100%;
	height:		10px;
	background:	url(images/assets/breadcrumbs-bg.png) center left no-repeat;
	margin:		10px 0 16px 0;
	font-size:	11px;
}		

#breadcrumbs a {
	color:		#999999;
}

#breadcrumbs a:hover {
	color:		#000;
}

.breadcrumb {
	background: #fff;
	display:	inline;
	padding-right: 6px;
}

/* inner pages */


.inner div.left {
	float:		left;
	width:		525px;
}

.blog div.left {
	float:		left;
	width:		575px;
}

.bios div.left {
	float:		left;
	width:		800px;
	border-right:	1px dotted pink;
}

	.intro-box {
		padding:		20px;
		background:		#F6FEE8;
		border:			1px dotted #cce3ce;
	}
	
	#content .intro-box h1 {
		margin-bottom:	4px;
	}

	
	#content .intro-box h1#email-icon {
		padding-left:	42px;
		background:url(images/icons/email2.png) left no-repeat;
	}
	
	#content ul#emails {
		margin-bottom:	20px;
	}
	
	.blog .left .entry,
	.inner .left .entry {
		padding:		20px;
		margin:			10px 0;
		border-bottom:	4px dashed #cce3ce;
	}

	.our-bloggers {
		padding:		20px;
		background:		#F6FEE8;
		border:			1px dotted #cce3ce;
		margin:			0 0 20px 0;
		
	}
		.our-bloggers img {
			height:			auto;
			width:			auto;
			max-width:		150px;
		}

	
		.our-bloggers .wp-caption {
			height:			auto;
			width:			auto;
			max-width:		156px;
			float:			left;
			margin:			0 10px 10px 0;
		}

.inner div.right {
	float:		right;
	width:		300px;
}



.blog div.right {
	float:		right;
	width:		250px;
}


#sidebar {
	background:		#DDFDAD;
}

#sidebar-content {
	padding:		20px;
}


/*	blog	*/

.meta {
	clear:			both;
	font-size:		11px;	
	margin-bottom:	12px;
}

.meta a {
border-bottom:1px dotted #395022;
color:#395022;
font-weight:normal;
}

.blog hr {
	clear:	both;
	width:	50%;
	margin: 0 auto;
	border:none;
}	


h2#comments {
	margin-top:	20px;
	padding-top:	20px;
	border-top:		1px dotted #51772C;
}

#content #commentlist a {
background:none repeat scroll 0 0 #BBDD86;
border:1px dashed #FFFFFF;
color:#51772C;
font-weight:bold;
padding:4px 6px;
}

#content #commentlist a:hover {
background:none repeat scroll 0 0 #fff;
border:1px solid #BBDD86;
}


#commentlist cite {
background:none repeat scroll 0 0 #FFFFFF;
color:#51772C;
font-style:normal;
font-weight:normal;
padding:2px 4px;
margin-top:40px;
display:block;
font-size:13px;
}

span.huge-right,span.huge-left {font-size:60px;}
span.huge-right {float:right;}
span.huge-left {float:left;}

#content #commentlist p {
color:#FFFFFF;
font-size:14px;
line-height:21px;
margin:0 0 14px;
}
#content #commentlist  li {
	background:none repeat scroll 0 0 #51772C;
border:3px solid #BBDD86;
color:#FFFFFF;
list-style:none outside none;
margin-left:0;
margin-bottom:30px;
padding:20px 11px 0 11px;
/*font-family:'RabioheadRegular',"Times New Roman", Times, serif*/
}

#content #commentlist  li.odd {
	background:none repeat scroll 0 0 #629035;
}


img.avatar {
	float:			left;
	margin:			0 10px 10px 0;
	padding:		8px;
	background:		#fff;
	border:			4px solid #BBDD86;
}

/*	footer	*/


	
	
#footer-bg {
	background:			url(images/assets/footer-bg.png) bottom left no-repeat;
	font-size:			11px;
	width:				1022px;
}


#footer-content {
		padding:		20px 50px 10px 50px;
		margin-left:	51px;
		background:		#bbdd86;
	}

	#footer-content ul#foot-nav {
		float:			left;
	}
	
	#footer-content ul#foot-nav li  {
		float:			left;
		width:			140px;
		font-size:		13px;
		margin-right:	4px;
	}
	
	#footer-content ul#foot-nav li a {
		color:			#51772c;
	}
	
	#footer-content ul#foot-nav li a:hover,
	#footer-content ul#foot-nav li li a:hover {
		font-weight:	bold;
	}
	
	#footer-content ul#foot-nav li li  {
		float:			none;
		width:			auto;
		font-size:		11px;
	}
	
	
	#footer-content ul#foot-nav li li a {
		color:			#82ac59;
	}


/* images */
p img {
	padding: 		0;
	max-width: 		100%;
}

img.centered {
	display: 		block;
	margin-left: 	auto;
	margin-right: 	auto;
}

img.alignright {
	padding: 		4px;
	margin: 		0 0 2px 12px;
	display: 		inline;
}

img.alignleft {
	padding: 		4px;
	margin: 		0 12px 2px 0;
	display: 		inline;
}

.alignright {
	float: 			right;
}

.alignleft {
	float: 			left;
}



/*	captions		*/
.aligncenter,
div.aligncenter {
	display: 		block;
	margin-left: 	auto;
	margin-right: 	auto;
}

.wp-caption {
	border: 		1px solid #ddd;
	text-align: 	center;
	background-color: #f3f3f3;
	padding-top: 	4px;
	margin: 		10px 10px 14px 0;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 	3px;
}

.wp-caption img {
	margin: 		0;
	padding: 		0;
	border: 		0 none;
}

#content .wp-caption p.wp-caption-text {
	font-size: 		11px;
	line-height: 	13px;
	padding: 		4px 4px 5px;
	margin: 		0;
}
/* End captions */


/* form(s)	*/
#main_body form li #li_4 #li_4_div_2,
#main_body form li #li_4 #li_4_div_3{
	margin-bottom:	10px;
}


/* directory */
/*	`nav	*/
#nav,
#content .nav2 {
	float:			left;
	font-weight:	500;
	text-transform:	uppercase;
	text-align:		center;
}

#nav li,
#content .nav2 li {
	float:	 		left;
	margin:			0 20px 10px 0;
	text-align:		center;
	list-style-type:none;
}

#nav li a,
#content .nav2 li a {
	display:		block;
	background:		#DDFDAD;
	padding:		4px 12px;
	color:			#51772C;
}


#nav li a:hover,
#content .nav2 li a:hover {
	background:		#51772C;
	color:			#fff;
}


#nav li.ui-state-active a,
#content .nav2 li.ui-state-active a {
	background:		#51772C;
	color:			#fff;
}

#nav li.hide,
#content .nav2 li.hide {
	display:		none;
}

/*	`body	*/
#tabs {
	width:			100%;
	margin-bottom:	15px;
}


.ui-tabs .ui-tabs-hide { display: none !important; }


.category-header {	
	clear:			both;
	text-align:		right;
	width:			100%;
	background:		#51772C;
}

#content .category-header h1,
#content .category-header h2 {	
	margin-right:	16px;
	padding:		6px 0 2px 0;
	color:			#fff;
}

.container {
	float:			right;
	width:			368px;
}



.business-entry {
	padding:		20px 0;
	margin-bottom:	4px;
	height:			auto;
	min-height:		120px;
	border-bottom:	3px dashed #cce3ce;
}

.welcome {
	padding:		20px 0;
}


.directory .welcome h2,
.directory .welcome p,
.directory .entry h2,
.directory .entry p {
	padding:		0 0 0 16px;
}

.welcome a,
.entry a {
	color:			#ff4a45;
}

.directory .welcome p,
.directory .entry p {
	color:			#75666a;
	margin-bottom:	10px;
}
p.featured {
	font-size:		110%;
	font-weight:	bold;
	color:			#504648;
}


p.website,
span.map {
	font-family:	Arial, Helvetica, sans-serif;
	font-size:		80%;
	text-transform:	uppercase;
	font-weight:	700;
}

p.address {
	color:			#292728;
	text-transform: capitalize;
}

p.address span.state {text-transform:uppercase;}
/*
.odd {
	background:		#eae8e8;
}

.even + .odd {clear:left;}

.even {
	background:		#fff;
}

*/
		
		
/*	simple classes	*/
.clear {
	clear:			both;
}

p.right {
	text-align:		right;
}



p.center {
	text-align:		center;
}

.strong {
	font-weight:	bold;
}

.top {
	font-size:		10px;
}

.top a {
	color:			#ddfdad;
}


/*	twitter box	*/

#content .twtr-tweet-text p {
    font size: 		11px;
	line-height:	14px;
}

#content .twtr-tweet-text p a {
    border-bottom: 	1px dotted #E8FAC1;
}




@font-face {
	font-family: 'RabioheadRegular';
	src: url('/fonts/rabiohead.eot');
	src: local('Rabiohead'), local('Rabiohead'), url('/fonts/rabiohead.woff') format('woff'), url('/fonts/rabiohead.ttf') format('truetype'), url('/fonts/rabiohead.svg#Rabiohead') format('svg');
}





p.trulygood {
	text-align:			right;
	font-size:			11px;
	color:				#bbdd86;
	margin:				11px;
}

p.trulygood a {
	color:				#51772c;
	border-bottom:		1px dotted #51772c;
}
