/*-----------------------------------------------------------------------------
Toxic Fuels

author:    kos korolev
email:     kos[at]pixeco.com
-----------------------------------------------------------------------------*/

/* =Importing rules
-------------------------------------------------------*/

@import url(http://toxicfuels.com/themes/a/css/generic/reset.css);
@import url(http://toxicfuels.com/themes/a/css/generic/helpers.css);
@import url(header.css);
@import url(http://toxicfuels.com/themes/a/css/branding/footer.css);
@import url(http://toxicfuels.com/themes/a/css/branding/navigation.css);
@import url(http://toxicfuels.com/themes/a/css/modules/forms.css);
@import url(http://toxicfuels.com/themes/a/css/modules/sidebar.css);
@import url(home.css);

/* =Elements
-------------------------------------------------------*/
body {
	font-family:'Lucida Grande', Helvetica, Arial, sans-serif;
	color:#666;
	background:url(http://toxicfuels.com/themes/a/images/pageBgs/films.jpg) 50% 0 no-repeat;
	}
	body.home {
		min-height:1300px;
		background:url(http://toxicfuels.com/themes/a/images/pageBgs/home.jpg) 50% 0 no-repeat;
		}
	body.films {background:url(http://toxicfuels.com/themes/a/images/pageBgs/films.jpg) 50% 0 no-repeat;}
	body.learn {background:url(http://toxicfuels.com/themes/a/images/pageBgs/learn.jpg) 50% 0 no-repeat;}
	body.take-action {background:url(http://toxicfuels.com/themes/a/images/pageBgs/takeAction.jpg) 50% 0 no-repeat;}
		body.fund-the-legal-battle {background:url(http://toxicfuels.com/themes/a/images/pageBgs/beaverCree.jpg) 50% 0 no-repeat;}
	body.blog {background:url(http://toxicfuels.com/themes/a/images/pageBgs/blog.jpg) 50% 0 no-repeat;}
	a:link {
		color:#e10000;
		}
	a:visited {
		text-decoration:none;
		color:#ee5757;
		}
	a:hover {
		text-decoration:none;
		color:#4d4d4d;
		}
	a:active {
		text-decoration:none;
		outline:none;
		}
	h1, h2, h3, h4, h5, h6 {
		text-transform:uppercase;
		font-weight:bold;
		font-size:1em;
		color:#000;
		}
		.content h1 {
			width:610px;
			line-height:1;
			text-transform:none;
			font-size:2.8em;
			color:#666;
			}
	p {
		line-height:1.5;
		padding:0 0 0.8em;
		}

/* =Layout elements
-------------------------------------------------------*/
.header,
.content-wrapper,
.footer {
	clear:both;
	width:940px;
	margin:0 auto;
	}
	body.home .content-wrapper {
		min-height:720px;
		height:auto !important;
		height:720px;
		}
	.content {
		position:relative;
		z-index:1; /* to overlay header */
		float:left;
		width:700px;
		margin:-100px 0 0;
		padding:0 0 100px;
		font-size:1.2em;
		}
		body.home .content {
			overflow:hidden; /* for ie6 */
			float:right;
			width:450px;
			margin:0;
			padding:0 40px 0 0;
			}
		body.home .content h3 {
			font-size: 18px;
			}
		body.home .content h5 {
			font-size: 14px;
			}
		body.full-width .content {
			width:100%;
			}
			.content .column {
				position:relative;
				float:left;
				width:310px;
				margin:0 0 0 8px;
					padding:20px 0 35px;
				}
				body.home .content .column {
					width:220px;
					}
				body.two-cols .content .column {
					width:340px;
					}
					.content .column.first {
						margin-left:0;
						}
					.content .column.third,
					body.two-cols .content .column.second {
						float:right;
						}
	.sidebar {
		/*overflow:hidden;*/
		float:right;
		width:227px;
		padding:24px 0 60px;
		font-size:1.2em;
		}
		body.home .sidebar {
			float:left;
			}
			
		.sidebar div.promo { 
			width: 227px;
			margin: 20px 0 10px 0;
			text-indent: -999em;
			}
			.sidebar div.promo a { 
				display: block;
				width: 100%;
				height: 208px;
				background: url(http://toxicfuels.com/themes/a/images/ToxicFuels_teeshirts.jpg) no-repeat 0 0;
				}

/* =Content elements
-------------------------------------------------------*/
div.join {
	position:relative;
	left:-60px;
	display:block;
	width:230px;
	height:108px;
	background:url(http://toxicfuels.com/themes/a/images/join.png) 0 0 no-repeat;
	}
	div.join a {
		position:absolute;
		bottom:18px;
		right:0;
		overflow:hidden;
		width:150px;
		height:25px;
		text-indent:-999em;
		}

body.learn .content blockquote {
	float:left;
	width:450px;
	margin:0 0 12px;
	}
	body.learn .content blockquote p {
		font-weight:500;
		line-height:1;
		font-size:18px;
		color:#000;
		}
		body.learn .content blockquote cite {
			display:block;
			font-size:14px;
			font-style:normal;
			font-weight:normal;
			}

ul.cols {
	float:left;
	padding:0;
	list-style:none;
	margin:0 0 20px 0;
	}
	ul.cols li {
		position:relative;
		float:left;
		overflow:hidden;
		width:226px;
		height:343px;
		margin:0 0 0 11px;
		text-align:center;
		line-height:1;
		color:#fff;
		}
		ul.cols li:first-child {
			margin-left:0;
			}
		body.take-action ul.cols li {
			width:206px;
			height:438px;
			padding:0 10px;
			text-align:left;
			background:url(http://toxicfuels.com/themes/a/images/takeActionBg.jpg) 0 0 no-repeat;
			}
		body.fund-the-legal-battle ul.cols li {
			min-height:120px;
			height:auto !important;
			height:120px;
			padding-top:40px;
			background:#7f7f7f url(http://toxicfuels.com/themes/a/images/colsBg.png) 0 0 no-repeat;
			}
		body.learn ul.cols li {
			background:url(http://toxicfuels.com/themes/a/images/learnBg.jpg) 0 0 no-repeat;
			}
			ul.cols li.put-pressure,
			ul.cols li.the-beaver-lake-cree-legal-battle,
			body.fund-the-legal-battle ul.cols li.spread-the-word {
				background-position:-226px 0 !important;
				}
			ul.cols li.spread-the-word {
				background-position:-452px 0 !important;
				}
			ul.cols li.tar-sands-in-pictures {
				background-position:-452px 88px !important;
				}
			body.take-action ul.cols li.spread-the-word {
				width:176px !important;
				padding-right:30px !important;
				background-position:-452px 20px !important;
				}
				body.fund-the-legal-battle ul.cols li.spread-the-word { /* for ie6 */
					background-position:-226px 0 !important;
					}
				body.take-action ul.cols li.spread-the-word li { /* reset styles for nested list */
					float:none;
					width:auto !important;
					height:auto !important;
					margin:0 !important;
					padding:0 0 0.6em !important;
					line-height:inherit;
					background:none !important;
					}
				ul.cols li h2,
				ul.cols li h3 {
					text-transform:none;
					font-size:18px;
					font-weight:700;
					}
					ul.cols li h3 {
						font-size:26px;
						letter-spacing:-2px;
						white-space:nowrap;
						}
					body.take-action ul.cols li h2 {
						padding:120px 0 6px;
						font-size:28px;
						line-height:.8;
						}
						body.take-action ul.cols li.put-pressure h2 {
							padding-top:104px;
							}
						body.take-action ul.cols li.spread-the-word h2 {
							padding-top:104px;
							}
					body.learn ul.cols li h2 {
						position:absolute;
						top:192px;
						left:50%;
						margin:0 0 0 -89px;
						width:178px;
						}
						body.learn ul.cols li.the-beaver-lake-cree-legal-battle h2 {
							top:220px;
							}
						body.learn ul.cols li.tar-sands-in-pictures h2 {
							top:239px;
							}
					ul.cols li h2 a,
					ul.cols li h3 a {
						text-decoration:none;
						color:#fff !important;
						}
						body.learn ul.cols li a {
							display:block;
							padding:16px 0 60px;
							color:#000 !important;
							background:#fff;
							opacity:.8;
							}
							body.learn ul.cols li a:hover {
								opacity:1;
								}
					body.take-action ul.cols li p,
					body.take-action ul.cols li ul {
						font-size:13px;
						line-height:1.25;
						}
					ul.cols li.spread-the-word ul {
						padding:0;
						list-style:none;
						}
						ul.cols li.spread-the-word ul li a {
							color:#000 !important;
							}
						body.one-col ul.cols li.spread-the-word p {
							color:#000 !important;
							}

p.download {
	float:right;
	width:220px;
	margin:-10px 0 0 30px;
	padding:20px 20px 0 0;
	font-size:.8em;
	background:url(http://toxicfuels.com/themes/a/images/shadowedCorners.png) 100% 0 no-repeat;
	}
	p.download.unconventional-oil a {
		overflow:hidden;
		float:right;
		width:72px;
		height:58px;
		text-indent:-999em;
		background:url(http://toxicfuels.com/themes/a/images/unconventionalOil.jpg) 0 0 no-repeat;
		}
		p.download a:hover {
			opacity:.8;
			}

.become-member {
	float:left;
	clear:left;
	width:423px;
	height:126px;
	padding:20px 30px 0 10px;
	background:#f2f2f2;
	}
div.signup {
	float:right;
	width:215px;
	padding:10px 0 0;
	}
	.become-member h3,
	div.signup h3 {
		float:left;
		width:180px;
		line-height:.8;
		text-transform:none;
		letter-spacing:-1px;
		font-size:30px;
		font-weight:700;
		}
		div.signup h3 {
			float:none;
			width:auto;
			letter-spacing:-2px;
			}
	div.signup p,
	.become-member p {
		float:right;
		width:180px;
		line-height:1.2;
		font-size:14px;
		font-weight:500;
		}
		div.signup p {
			float:none;
			width:auto;
			}

ul.social-buttons {
	padding:0;
	list-style:none;
	}
	ul.social-buttons li {
		overflow:hidden;
		float:left;
		width:77px;
		height:38px;
		margin:0 4px 0 0;
		text-indent:-999em;
		background:url(http://toxicfuels.com/themes/a/images/socialButtons.png) 0 0 no-repeat;
		}
		ul.social-buttons li.facebook {
			background-position:-77px 0;
			}
		ul.social-buttons li.flickr {
			background-position:-154px 0;
			}
			ul.social-buttons li a {
				display:block;
				height:100%;
				}

p.img-placeholder {
	margin:0 0 9px;
	padding:0 5px 5px;
	line-height:1.3;
	font-size:10px;
	color:#000;
	background:#e4e4e4;
	}
	p.img-placeholder img {
		display:block;
		margin:0 -5px 5px;
		}

/* =Learn more page
-------------------------------------------------------*/
/*body.learn .content.three-cols .column {
	width:226px;
	margin:0;
	}
	body.learn .content.three-cols .column.second {
		padding-top:76px;
		}
	body.learn .content.three-cols .column.third {
		width:460px;
		padding-top:0;
		}*/

/* =Films page
-------------------------------------------------------*/
ul.films {
	float:left;
	list-style:none;
	padding:0;
	color:#fff;
	}
	ul.films li {
		position:relative;
		float:left;
		width:196px;
		margin:0 0 0 12px;
		padding:0 15px;
		background:url(http://toxicfuels.com/themes/a/images/filmsBg.jpg) 0 0 no-repeat;
		}
		ul.films li.dirty-oil {
			height:361px;
			margin-left:0;
			padding:200px 30px 0 237px;
			color:#000;
			}
			ul.films li.dirty-oil div.extra {
				position:absolute;
				bottom:80px;
				}
				ul.films li.dirty-oil div.extra p,
				ul.films li.dirty-oil div.extra h6 {
					padding:0;
					}
					ul.films li.dirty-oil div.extra h6 {
						padding:0 0 4px;
						text-transform:none;
						font-size:14px;
						line-height:1.2;
						}
				ul.films li.dirty-oil div.extra a {
					color:#000;
					}
		ul.films li.h2oil {
			top:90px;
			height:271px;
			padding-top:200px;
			background-position:-464px 100%;
			}
		ul.films li.petropolis {
			top:132px;
			height:271px;
			padding-top:158px;
			background-position:-690px 100%;
			}
			ul.films li h2 {
				overflow:hidden;
				position:absolute;
				top:57px;
				left:0;
				width:100%;
				height:72px;
				padding:0;
				text-indent:-999em;
				}
				ul.films li.dirty-oil h2 {
					width:154px;
					height:154px;
					top:30px;
					left:34px;
					}
				ul.films li.petropolis h2 {
					height:40px;
					}
					ul.films li h2 a {
						display:block;
						height:100%;
						}
			ul.films li a.watch {
				position:absolute;
				top:203px;
				left:50%;
				margin:0 0 0 -6em;
				width:12em;
				height:28px;
				line-height:28px;
				text-align:center;
				text-transform:uppercase;
				text-decoration:none;
				font-size:12px;
				font-weight:500;
				color:#fff;
				background:url(http://toxicfuels.com/themes/a/images/navBg.png);
				}
				ul.films li.dirty-oil a.watch {
					left:44px;
					margin:0;
					color:#000;
					background:#fbf0ba;
					}
				ul.films li.h2oil a.watch {
					top:146px;
					background:#000;
					}
				ul.films li.petropolis a.watch {
					top:104px;
					}
			ul.films li form.screenings {
				position:absolute;
				bottom:20px;
				}
				ul.films li form.screenings label {
					display:block;
					padding:0 0 6px;
					font-weight:700;
					}
					ul.films li.dirty-oil form.screenings label {
						color:#000;
						}
				ul.films li form.screenings select {
					float:left;
					width:170px;
					height:20px;
					margin:0 8px 0 0;
					}
/*#sb-wrapper,*/
#sb-content.html object { /* prevent overflowing of dirty oil inline trailer */
	overflow:hidden;
	display:block;
	}
#sb-title,
#sb-title-inner {
	height:auto !important;
	}
	#sb-title {
		overflow:visible !important;
		position:absolute !important;
		bottom:-40px;
		height:50px !important;
		margin-right:20px !important;
		}
		#sb-title-inner {
			font-size:1.2em  !important;
			line-height:1.2 !important;
			}

/* =Take action
-------------------------------------------------------*/
img.map {
	position:absolute;
	top:66px;
	left:146px;
	}
a.action-box {
	float:left;
	width:228px;
	margin:0 0 6px;
	padding:10px;
	text-decoration:none;
	color:#666;
	background:#ccc;
	}
	a.action-box:hover {
		text-decoration:underline;
		}
	a.action-box.contact-mp,
	a.action-box.signup {
		float:right;
		margin-right:-16px;
		}
	a.action-box.spread {
		clear:left;
		}
		a.action-box strong {
			display:block;
			padding:0 0 .4em;
			line-height:1;
			text-transform:none;
			font-size:28px;
			color:#fff;
			}
	a.action-box.membership {
		display:block;
		float:none;
		clear:both;
		width:352px;
		margin:0 auto;
		}
		a.action-box.membership strong {
			float:left;
			width:180px;
			}
		a.action-box.membership span {
			display:block;
			margin:0 0 0 200px;
			}

/* =Quiz
-------------------------------------------------------*/
body.quiz {
	position:relative;
	width:320px;
	height:270px;
	padding:130px 40px 0;
	font-size:13px;
	color:#000;
	background:url(http://toxicfuels.com/themes/a/images/quizBg.jpg) 0 0 no-repeat;
	}
	body.quiz strong.logo {
		position:absolute;
		top:30px;
		left:23px;
		width:217px;
		height:80px;
		text-indent:-999em;
		outline:none;
		background:url(http://toxicfuels.com/themes/a/images/quizLogo.png) 0 0 no-repeat;
		}
	body.quiz form p,
	body.quiz form legend {
		font-size:14px;
		}
		body.quiz form legend {
			padding:0 0 12px;
			line-height:1.1;
			font-weight:bold;
			color:#e41515;
			}
	body.quiz form label {
		position:relative;
		display:block;
		padding:0 0 0 20px;
		}
		body.quiz form label input {
			position:absolute;
			top:4px;
			left:0;
			}
	body.quiz form a.next,
	body.quiz form button {
		position:absolute;
		right:40px;
		bottom:20px;
		font-size:15px;
		font-weight:bold;
		border:none;
		color:#e41515;
		background:none;
		}