/** 
 * SilverStripe Black Candy Theme
 * http://www.silverstripe.com
 *
 * Main Layout File
 */
 
/* Misc Styles and defaults 
-------------------------------------------- */
  
html,body {
	margin:0;
	padding:0;
	font-family:Arial, Helvetica, sans-serif;
	font-size:.85em;
	line-height:1.8em;
	color:#333;
}
body	{
	background:url(../images/BG.png);
}
img	{
	border:none;
}
a	{
	text-decoration:none;
	color:#888;
}
	a:hover	{
		color:#666;
		text-decoration:underline;
	}
h1	{
	padding-bottom:5px;
	margin:0;
	font-size:1.8em;
}
p	{
	padding:0;
	margin:0;
	overflow:hidden;
}
.clear	{
	height:0;
	width:0;
	clear:both;
}

/* CONTAINER
----------------------------------------- */
.wrapper	{
	margin-top:8px;
	padding:0;
}

.header_ads	{
	position:relative; 
	margin:0 auto;
	width:946px;
}
	.impact_banner	{
		float:left;
		width:468px;
		height:60px;
		overflow:hidden;
	}	
.container {
	position:relative; 
	margin:4px auto;
	padding:0;
	width:1054px;
}
.main	{
	width:1054px;
	overflow:hidden;
	padding:0;
	margin:0;
	background:url(../images/body_bg2.png) repeat-y;
}
	.content, .HP_content, .content_menuless {
		position:relative;
		float:left;
		min-height:460px;
		width:726px;
		padding:20px 10px 30px 20px; 
		margin:0;
		background:#eee;
	}
		.content p, .content_menuless p	{
			width:500px;
		}
	.HP_content	{
		width:496px;
		padding:0;
		margin:0;
	}
		.HP_content p	{
			padding:10px;
		}
	.content_menuless	{
		width:994px;
		margin-left:15px;
	}
		

/* HEADER
----------------------------------------- */
.header {
	height:126px;
	padding:0;
	margin:0;
	background:url(../images/head_bg.png) repeat-y;
}
	.header img	{
		margin:25px 0 0 40px;
	}

/* MAIN NAVIGATION - TABS
----------------------------------------- */
.nav	{
	background:url(../images/body_bg.png) repeat-y;
	height:35px;
	width:1054px;
}
	.inside_nav	{
		width:1024px;
		height:35px;
		margin-left:15px;
		background:url(../images/nav_bg.gif) repeat-x;
	}
	.nav ul	{
		padding:0;
		margin:0 0 0 45px;
		overflow:hidden;
	}
		.nav li	{
			padding:0;
			margin:0;
			list-style:none;
			display:inline;
		}
		.nav li a	{
			display:block;
			float:left;
			height:38px;
			padding:8px 17px 5px 17px;
			//padding: 11px 17px 2px 17px;
			margin:0;
		}
			.nav li a:hover, .nav li a.current	{
				text-decoration:none;
				background:url(../images/nav_hover_bg.gif) repeat-x;
			}
				.nav li span	{
					float: left;
					position: absolute;
					left: 15px; 
					top:184px;
					display: none; /*--Hide by default--*/
					width: 1004px;
					height:35px;
					background:url(../images/sub_nav_bg.png) repeat;
					_background:url(../images/sub_nav_bg.png) #bdb8b4 repeat;
					padding:0;
					margin:0;
				}
					.nav li:hover span { 
						display: block; 
						height:35px;
						padding-left:20px;
						margin:0;
						z-index:1;
					} /*--Show subnav on hover--*/
						.nav li span a {
							height:28px;
							padding:7px 10px 0 10px;
							color: #fff;
							display:block;
							float:left;
						} /*--Since we declared a link style on the parent list link, we will correct it back to its original state--*/
						.nav li span a:hover {
							background:#7c7067;
							overflow:hidden;
						}
						.nav li span p {
							padding-top:7px;
							float:left;
							color:#dddad6;
						}
    
/* BREADCRUMBS
-------------------------------------------- */
#Breadcrumbs { 
	position:absolute;
	top:0;
	left:0;
	width:756px;
 	color: #969692;
	text-align: left;
	font-size: 0.9em; 
	margin:0;
	padding:0;
	background:#f5f5ed;
}
	#Breadcrumbs p {
		margin: 0;
		padding:8px 20px;
		color: #969692;
	}


/* SIDEBAR
-------------------------------------- */
.sidebar_left, .sub_sidebar_left	{
	float:left;
	width:268px;
	padding:0; 
	margin-left:15px;
}
	.sub_sidebar_left	{
		background:#ddad6;
		min-height:500px;
	}
	.sub_links {
			width:226px;
			margin:0;
			padding:36px 0 0 20px;
			overflow:hidden;
		}
			.sub_links a	{
				font-family:Arial, Helvetica, sans-serif;
				font-size:1.2em;
				text-align:left;
				width:226px;
				display:block;
				border-top:1px dotted #9e9b97;
				color:#57534e;
				padding:7px 0 7px 8px;
				margin-top:1px;
				text-decoration:none;
			}
				.sub_links a.current	{
					font-weight:bold;
					text-decoration:none;
					color:#d5d2c8;
					background:#8c8075;
				}
				.sub_links a:hover	{
					text-decoration:none;
					color:#d5d2c8;
					background:#b4ada5;
				}
		.checkout_mag, .checkout_mag a, .checkout_mag img	{
			width:268px;
			height:171px;
			padding:0;
			margin:0;
			overflow:hidden;
		}
		.issue_buttons	{
			padding:0;
			margin:0;
			overflow:hidden;
			width:268px;
			height:36px;
			background:#9a8f85;
			font-family:"Century Gothic";
			border-top:1px solid #a49a91;
		}
			.issue_buttons ul	{
				padding:0;
				margin:0 0 0 12px;
				overflow:hidden;
			}
				.issue_buttons li	{
					list-style:none;
					padding:0;
					margin:0;
				}
				.issue_buttons li a	{
					display:block;
					float:left;
					width:57px;
					height:27px;
					color:#fff;
					text-transform:uppercase;
					text-align:center;
					background:url(../images/issue_bg.png) no-repeat;
					padding-top:3px;
					margin:4px 5px 0 0;
				}
					.issue_buttons li a:hover	{
						text-decoration:none;
						background:url(../images/issue_hover_bg.png) no-repeat;
					}
		.square_buttons	{
			margin:6px 0 0 6px;
		}
			.square_buttons a	{
				float:left;
				width:125px;
				height:125px;
				margin-bottom:6px;
				overflow:hidden;
			}
				
		.donate_button	{
			display:block;
			width:268px;
			height:39px;
			background:url(../images/donate_bg.gif) repeat-x;
		}
			.donate_button img	{
				margin:12px 0 0 44px;
			}
			
.sidebar_right	{
	width:260px;
	float:left;
	padding:0; 
	margin:0;
}
	.feature_thumbs	{
		margin-left:1px;
	}
		.feature_thumbs a	{
			float:left;
			width:128px;
			height:76px;
			margin-bottom:3px;
			overflow:hidden;
		}
	.display_banner	{
		display:block;
		width:260px;
		height:200px;
		overflow:hidden;
		background:#000;
	}

/* COMMENTS
---------------------------------------- */

#CommentHolder, #PageComments	{
	padding:0;
	margin:5px 0;
	overflow:hidden;
}
	#CommentHolder	{
		margin:0;
	}
	#PageComments form	{
		padding:0 0 10px 0;
		margin:0;
		overflow:hidden;
	}

#CommentHolder ul {
	list-style: none;
	margin-bottom:10px;
	padding:0;
	overflow:hidden;
}
#PageComments li {
	margin: 5px 0;
	padding:0;
	width: 91%;
	overflow:hidden;
}
	#PageComments li.odd {
		background: #fff url(../images/commentBg.png) no-repeat 1% 10%;
		padding:15px 25px 10px 40px;
		margin:0;
		border-bottom: 2px solid #dbddc5;
	}
	#PageComments li.even {
		background: #edecdf url(../images/commentBgAlt.png) no-repeat 99% 10%;
		padding:15px 25px 10px 40px;
		margin:0;
		border-bottom: 2px solid #928773;
	}

		#PageComments li p.info {
			color: #888;
			font-size:1em;
		}
		.actionLinks ul {
			padding:0;
			margin:0;
		}
			.actionLinks li {
			   display: inline;
			   border-right: 1px solid;
			   padding:0;
			   margin:0;
			   overflow:hidden;
			}
				.actionLinks li a {
					margin:0;
					padding: 5px 3px 0 0;
					font-size: .9em;
					text-decoration:underline;
				}
				.actionLinks li.last {
					border-right: none;
				}

.commentrss {
	background: transparent url(../images/feed-icon-14x14.png) no-repeat;
	padding-left: 20px;
	font-size: 1.1em;
	line-height: 1.6em;
}
#PageCommentsPagination p {
	text-align: center;
	font-size: 1.2em;
}
#PageComments p {
	font-size: 1em;
}
	#PageComments p.info {
		color: #999;
		margin: 0px;
		padding: 0;
		line-height: 1em;
		font-size: 0.9em;
	}
/* SEARCH RESULTS STYLES
------------------------------------------------ */
ul#SearchResults {
	margin: 10px 0;
}
	ul#SearchResults li {
		list-style: none;
		margin: 5px 0;
		padding:0 20px 10px 0;
		font-size: 1em;
		border-bottom:1px dotted #ccc;
	}
	ul#SearchResults li h3 {
		margin-bottom:0;
		padding-bottom:3px;
	}

/* SEARCH FORM 
-----------------------------------------------*/
html #SearchForm_SearchForm {
	width: 231px;
	height:26px;
	margin: 20px 0 0 17px;;
	padding:0;
	overflow:hidden;
}
html #SearchForm_SearchForm fieldset, html #SearchForm_SearchForm legend	{
	margin:0;
	padding:0;
	overflow:hidden;
}
html #SearchForm_SearchForm .middleColumn {
	float: left;
	width: 195px;
	height:26px;
	margin: 0;
	padding: 0;
	overflow:hidden;
}
	html #SearchForm_SearchForm .middleColumn input.text {
		font-family:Arial, Helvetica, sans-serif;
		width: 195px;
		height:20px;
		border: 1px solid #c7c1ba;
		color: #c3bdb4;
		margin:0;
		padding:4px 0 0 5px;
		vertical-align:top;
		overflow:hidden;
	}
html #SearchForm_SearchForm #SearchForm_SearchForm_action_results {
	float: left;
	width:36px;
	height:26px;
	border: 1px solid #c7c1ba;
	margin:0;
	padding:0;
	vertical-align:top;
	background:url(../images/button_search.gif) #fff top left no-repeat;
}

/* MESSAGEBOXS
--------------------------------------------- */
.message {
	margin: 15px;
	padding: 5px;
	width: 92%;
	color: #979908;
	border: 4px solid #F7F8B4;
	background: #FFFFEA;
}
span.middleColumn .message {
	margin: 4px 0 0 3px;
}
.required {
	margin: 4px 0 0 3px;
	padding: 5px;
	width: 92%;
	color: #DC1313;
	border: 4px solid #FF7373;
	background: #FED0D0;
}



p#Remember label {
	margin: -24px 0 0 20px;
	text-align: left;
}
.entry {
	border-bottom: 1px solid #eee;
}

.typography #Content p.authorDate {
	color: #444;
	margin-top: -15px;
	}
/* UNSUBSCRIBE NEWSLETTER
------------------------------------------------ */
#Unsubscribe_MailingListForm_MailingListForm{
	min-height:100px;
}

	#Unsubscribe_MailingListForm_MailingListForm p{
		margin:0 !important;
		padding:10px;
	}
		#Unsubscribe_MailingListForm_MailingListForm p label{
			display: inline;
		}
	#Unsubscribe_MailingListForm_MailingListForm label{
		margin:0;
	}


/* FOOTER
----------------------------------------------- */

.mediabar	{
	width:1054;
	height:27px;
	background:url(../images/body_bg.png) repeat-y;
}
	.inside_mediabar	{
		position:relative;
		width:1024px;
		height:27px;
		margin-left:15px;
		background:#dddec5;
	}
	.news_ticker	{
		position:relative;
		width:1024px;
		height:27px;
		z-index:1;
	}
	.tickercontainer { /* the outer div with the black border */
		float:left;
		width: 764px; 
		height: 27px; 
		margin: 0; 
		padding: 0;
		overflow: hidden; 
	}
		.tickercontainer .mask { /* that serves as a mask. so you get a sort of padding both left and right */
			position: relative;
			left: 10px;
			top: 8px;
			width: 754px;
			overflow: hidden;
		}
			ul.newsticker { /* that's your list */
				position: relative;
				font: normal 10px Verdana;
				list-style-type: none;
				margin: 0;
				padding: 0;
			}
				ul.newsticker li {
					float: left; /* important: display inline gives incorrect results when you check for elem's width */
					margin: 0;
					padding: 0;
				}
				ul.newsticker a {
					white-space: nowrap;
					padding: 0;
					color: #9c9c8c;
					margin: 0 50px 0 0;
				} 
				ul.newsticker span {
					margin: 0 10px 0 0;
					color:#888;
				} 
	
	
	
	.media_links	{
		position:absolute;
		top:0;
		right:0;
		background:url(../images/media_links_bg.gif) repeat-x;
		border-left:1px solid #d7d8c0;
		width:259px;
		height:27px;
		z-index:999;
	}
		.media_links a	{
			display:block;
			float:left;
			margin-left:10px;
		}
	
.footer {
	margin:0;
	height:26px;
	background:url(../images/foot_bg.png) repeat-y;
	font-family:"Century Gothic";
	font-size:.95em;
}
	.footer a	{
		color:#fff;
	}
	.foot_links	{
		padding:0;
		margin:5px 0 0 30px;
		float:left;
		color:#fff;
	}
	.credits	{
		padding:0;
		margin:5px 30px 0 0;
		float:right;
		color:#fff;
	}
	
/* HOMPAGE SLIDESHOW */	
div.slider {
	/* The display of slider is enabled using jQuery so that the slideshow slider won't display unless javascript is enabled. */
	display: none;
	float: left;
	width: 496px; 
	height:320px;
	vertical-align:top;
	overflow:hidden;
	padding:0;
	margin:0;
}
	div.slider a, div.navigation a {
		text-decoration: none;
		color: #777;
	}
	div.slider a:focus, div.slider a:hover, div.slider a:active {
		text-decoration: underline;
	}

div.slideshow-container {
	position: relative;
	width: 496px;
	height:320px; /* This should be set to be at least the height of the largest image in the slideshow */
	padding:0;
	margin:0;
	vertical-align:top;
	overflow:hidden;
}
	div.loader {
		position: absolute;
		top: 0;
		left: 0;
		background-image: url(../images/loader.gif) center no-repeat;
		width: 496px;
		height:320px; /* This should be set to be at least the height of the largest image in the slideshow */
		padding:0;
		margin:0;
		overflow:hidden;
	}
div.slideshow {
	line-height:0;
	text-align: left;
	overflow:hidden;
	margin:0; 
	padding:0;
	vertical-align:top;
}
	div.slideshow span.image-wrapper {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 496px;
		height:320px;
		overflow:hidden;
		line-height:0;
		padding:0;
		margin:0;
	}
		@media screen and (-webkit-min-device-pixel-ratio:0){
			div.slideshow span.image-wrapper { top: -5px; }
		}
		div.slideshow a.advance-link {
			display: block;
			width: 496px;
			height:320px; /* This should be set to be at least the height of the largest image in the slideshow */
			line-height:0;
			text-align: left;
			overflow:hidden;
			margin:0; 
			padding:0;
			vertical-align:top;
		}
			div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited {
				text-decoration: none;
				line-height:0;
			}
			div.slideshow img {
				vertical-align:top !important;
				border:none;
				overflow:hidden;
				text-align:left;
				margin:0; 
				padding:0;
				line-height:0;
			}
div.download {
	display:none;
	float: right;
}
	div.caption-container {
		position: relative;
		clear: left;
		width:496px;
		height: 204px;
	}
		span.image-caption {
			display: block;
			position: absolute;
			width: 496px;
			top: 0;
			left: 0;
		}
			div.caption {
				padding: 6px 12px;
			}
			div.caption p {
				padding:0;
				margin:0;
			}
			div.image-title {
				font-weight: bold;
				font-size: 1.4em;
				padding:5px 0;
				margin:0;
			}
			div.image-desc {
				line-height: 1.2em;
				padding:0;
			}
div.navigation {
	/* The navigation style is set using jQuery so that the javascript specific styles won't be applied unless javascript is enabled. */
}
ul.thumbs {
	clear: both;
	margin:0;
	padding: 0;
}
	ul.thumbs li {
		float: left;
		padding: 0;
		margin:0 1px;
		list-style: none;
	}
		a.thumb {
			display: block;
			padding:0;
			margin:0;
		}
		ul.thumbs li.selected a.thumb {
			background: #000;
		}
			a.thumb:focus {
				outline: none;
			}
ul.thumbs img {
	border: none;
	display: block;
}
	div.pagination, div.navigation div.top, div.navigation div.bottom {
		display:none;
		clear: both;
	}

/* PORTFOLIO STYLES */

.port_cat, .port_cat2	{
	float:left;
	width:173px;
	margin:0 8px 8px 0;
	height:125px;
}
	.port_cat2	{
		margin:0 8px 54px 0;
	}
	.port_cat_img	{
		width:173px;
	}
	.port_cat_title h2	{
		font-size:1.3em;
		text-align:center;
		padding:0;
		margin:0;
	}
	.port_cat_title h3	{
		font-size:1em;
		text-align:center;
		padding:0;
		margin:0;
	}
	
.port_pro	{
}
	.port_pro_head	{
		float:left;
		width:435px;
	}
		.port_pro_img	{
			float:left;
			width:120px; 
			height:87px; 
			border:1px solid #ccc; 
			padding:1px; 
			margin-bottom:10px;
		}
		.port_pro_intro	{
			float:left;
			width:302px;
			margin-left:8px;
		}
			.port_pro_title	{
				float:left;
				width:190px;
				height:20px;
				padding:5px 0 10px 0;
				margin:0;
				display:block;
			}
				.port_pro_title h3	{
					display:block;
					font-size:1.3em;
					padding:0;
					margin:0;
				}
			.port_pro_pdf	{
				float:left;
				width:105px;
				height:20px;
				padding-top:5px;
				font-size:.8em;
				color:#ccc;
			}
			.port_pro_blurb	{
				padding-top:5px;
				line-height:1.3em;
				font-size:1.2em;
			}
			.port_pro_content p	{
				width:435px;
			}
	.port_pro_connect	{
		float:left;
		width:280px;
		background:#e7e8d7;
		margin-left:10px;
	}
		.port_pro_con_head	{
			width:280px;
			height:40px;
			background:#c6c7b1;
		}
			.port_pro_con_head h1	{
				font-size:1.6em;
				margin:0;
				padding:10px 0 0 20px;
			}
		.port_pro_connect.even, .port_pro_connect.odd	{
			width:280px;
			height:30px;
			padding:2px 0;
		}
			.port_pro_connect .even	{
				background:#dddec5;
			}
				.port_pro_icon	{
					float:left;
					display:block;
					width:100px;
					text-align:center;
				}
				.port_pro_connect a	{
					padding-top:4px;
					display:block;
					float:left;
				}
				
				
/* NEWSLIST STYLES */

.newslist	{
	width:680px;
	padding-bottom:10px;
	margin-bottom:10px;
	border-bottom:1px dotted #ccc;
}

	.newslist a h3, .newslist h3	{
		padding:0;
		margin:0;
		overflow:hidden;
	}
	.newslist em	{
		padding:0;
		margin:0;
	}


iframe	{
	padding:1px;
	border:1px solid #ccc;
}