/*
Theme Name: Experimentalist
Theme URI: http://www.departmentthree.com
Description: Video and discussion centric.
Version: 1.0
Author: Department 3
Author URI: http://www.departmentthree.com
Tags: vimeo, video, AJAX, dark, film, music
*/

@import "style/css/reset.css";

/* -- UTILITY -- */

.floatLeft {
	float: left;
}

.floatRight {
	float: right;
}

/* -- TYPOGRAPHY -- */

body {
	background: #000;
	color: #fff;
	font-family: 'Arial Narrow', Arial, Verdana, sans-serif;
}

a, a:visited {
	color: #cb0000;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

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

h1, h2, h3, h4 {
	color: #cb0000;
}

h1 {
	font-size: 21px;
}

h2 {
	font-size: 18px;
}
	h2.time {
		color: #fff;
		margin-bottom: 15px;
	}
h3 {
	font-size: 16px;
	font-weight: normal;
	text-transform: uppercase;
}

p {
	line-height: 1.3em;
	margin-bottom: 1.5em;
}

blockquote {
	color: #555;
	margin-left: 35px;
	font-style: italic;
}

h2.catBanner {
	background: url(./img/banner.jpg) no-repeat;
	display: block;
	width: 195px;
	height: 195px;
	margin-top: 15px;
	margin-left: 21px;
}

h2.catNavTitle {
	background: url(./img/viewby.png) no-repeat;
	display: block;
	width: 69px;
	height: 17px;
}
	h2.catNavTitle span {
		display: none;
	}
.catNavTitle {
	color: #fff;
	margin-top: 15px;
	margin-left: 21px;
}
	ul.catNav {
		margin-left: 23px;
	}
	.catNav a {
		color: #cb0000;
	}
	
	h2.linNavTitle {
	background: url(./img/links.png) no-repeat;
	display: block;
	width: 80px;
	height: 17px;
}
	h2.linNavTitle span {
		display: none;
	}
.linNavTitle {
	color: #fff;
	margin-top: 15px;
	margin-left: 21px;
}
	ul.linNav {
		margin-left: 23px;
	}
	.linNav a {
		color: #cb0000;
	}
	
	.nav {
	display: inline-block;
	width: 100%;
	height: auto;
	text-transform: uppercase;
}
.next-posts {
	float: left;
}
.prev-posts {
	float: right;
}

/* WP-Paginate */
.navPages {
	width: auto;
	margin: 0 auto;
}
ol.wp-paginate {
	text-align: center;
	width: auto;
}
ol.wp-paginate li{
	display: inline;
	padding: 4px;
}

/* -- LAYOUT -- */

.wrapper {
	width: 940px;
	margin: 0px auto;
}

.header {
	width: 820px;
	height: 128px;
	margin: 0 auto 35px;
	padding-top: 60px;
	position: relative;
}
h1.brand {
	display: block;
	background: url(./img/brand.gif) no-repeat top center;
	width: 820px;
	height: 128px;
}
h1.brand a {
	display: block;
	height: 128px;
	width: 820px;
}
h1.brand a span {
	display: none;
}

ul.socialNav {
	display: inline-block;
	position: absolute;
	top: 183px;
	left: 141px;
	height: 25px;
	z-index: 3;
}

.socialNav li {
	float: left;
}

.socialNav li a span {
	display: none;
}

.socialNav li a {
	display: block;
	background-image: url(./img/social.gif);
	background-repeat: no-repeat;
}

.socialNav li.fb a{
	background-position: 0 0;
	width: 90px;
	height: 25px;
}
.socialNav li.fb a:hover{
	background-position: 0 -27px;
}

.socialNav li.ms a{
	background-position: -90px 0;
	width: 81px;
	height: 25px;
}
.socialNav li.ms a:hover{
	background-position: -90px -27px;
}

.socialNav li.tw a{
	background-position: -170px 0;
	width: 77px;
	height: 25px;
}

.socialNav li.tw a:hover{
	background-position: -170px -27px;
}

.socialNav li.ga a{
	background-position: -249px 0;
	width: 77px;
	height: 25px;
}

.socialNav li.ga a:hover{
	background-position: -249px -27px;
}

.socialNav li.em a{
	background-position: -332px 0;
	width: 93px;
	height: 25px;
}
.socialNav li.em a:hover{
	background-position: -332px -27px;
}

.socialNav li.us a {
	background-position: -430px 0;
	width: 77px;
	height: 25px;
}

.socialNav li.us a:hover {
	background-position: -430px -27px;
}

.socialNav li.yt a {
	background-position: -505px 0;
	width: 77px;
	height: 25px;
}

.socialNav li.yt a:hover {
	background-position: -505px -27px;
}

form#siteLogin p {
}
.login {
	position: absolute;
	right: 0;
	top: 5px;
	width: 205px;
	display: inline-block;
	z-index: 10;
}

.login form {
	text-align: right;
}

.login form input {
	font-size: 9px;
}

p.recovery {
	margin-top: -2px;
}

input.subButton {
	background: none;
	width: 0px;
	height: 0px;
	border: none;
	padding: 0px;
	margin: 0px;
}

label.user {
	background-image: url(./img/resources.gif);
	background-repeat: no-repeat;
	background-position: -99px -49px;
	display: inline-block;
	height: 20px;
	margin-right: 5px;
	width: 47px;
	vertical-align: middle;
}

label.pwd {
	background-image: url(./img/resources.gif);
	background-repeat: no-repeat;
	background-position: -150px -49px;
	display: inline-block;
	height: 20px;
	margin-right: 5px;
	width: 45px;
	vertical-align: middle;
}

label span {
	display: none;
}

.login p {
	font-size: 10px;
	text-align: right;
	margin-bottom: 0;
	line-height: 1em;
}

/* -- AJAXed AREA -- */
#mainContent {
	width: 720px;
	float: left;
	position: relative;
	padding-bottom: 60px;
}

.postMeta h2 {
	font-size: 17px;
}
.postMeta .postTitle {
	float: left;
	font-weight: 300;
	text-transform: uppercase;
	padding-left: 5px;
}

.postMeta .discussLink a{
	float: left;
	font-weight: 300;
	font-size: 13px;
	padding-left: 0px;
	text-transform: uppercase;
} 

.vidNavTitle {
	width: 220px;
	height: auto;
	position: relative;
	overflow: hidden;
}
.vidNavWrapper {
	width: 220px;
	height: 465px;
	position: relative;
	overflow: auto;
}
.vidNav {
	width: 200px;
	float: right;
	margin-left: 10px;
	margin-top: 19px;
}

.vidNavTitle h1 span {
	display: none;
}

.vidNavTitle h1 {
	display: block;
	background-image: url(./img/resources.gif);
	background-repeat: no-repeat;
	background-position: 0 -30px;
	height: 18px;
	width: 80px;
	margin-bottom: 5px;
	margin-left: 17px;
	background-color: #000;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 3;
}

.vidNav .Video {
	margin-bottom: 5px;
}

/* -- AJAXed VIDEO MENU -- */

.vidNavWrapper .loading {
	position: absolute;
	top: 23px;
	left: 18px;
	color: #009ecb;
}

/* -- BOTTOM AREA -- */
h2.theLatest span {
	display: none;
}

h2.theLatest span.readAll {
	display: block;
	margin-left: 85px;
	font-size: 13px;
	text-transform: uppercase;
	padding-top: 5px;
}

h2.theLatest {
	display: block;
	background-image: url(./img/resources.gif);
	background-repeat: no-repeat;
	background-position: -84px -29px;
	height: 18px;
	width: 200px;
}
h2.theLatest a {
	display: block;
	height: 18px;
	width: 200px;
}	

#mainContent .newsHeadline {
	width: 720px;
	position: relative;
	background: #000;
	margin-bottom: 15px;
}

#mainContent .inside{
	margin-top: 7px;
	width: 700px;
	padding: 15px 15px 0px;
	color: #fff;
}
.newsHeadline h3 {
	font-size: 19px;
}

.newsHeadline h3 span, .blog h2 span {
	color: #fff;
}

.newsHeadline p.moreLink {
	background: #fff;
	display: block;
	text-align:right;
}

.footer {
	height: 24px;
	width: 910px;
	padding-top: 20px;
	margin: 15px auto 0;
	background: #000;
	position: fixed;
	bottom: 0;
}

.footer p.legal {
	font-size: 12px;
	font-family: Arial, Verdana, sans-serif;
	float: left;
	margin-top: 4px;
}
.footer p.affiliates {
	float: right;
	
}
.footer p.affiliates a {
	background-image: url(./img/resources.gif);
	background-repeat: no-repeat;
	height: 24px;
	display: block;
}

.footer a span {
	display: none;
}

.footer a#sjs {
	background-position: -184px 0;
	width: 35px;
	margin-right: 15px;
	float: left;
}

.footer a#suretone {
	background-position: 0 0;
	width: 120px;
	margin-right: 15px;
	float: left;
}
.footer a#dept3 {
	background-position: -121px 0;
	width: 61px;
	float: right;
}

.footer a#myn {
	background-image: url(./img/mynority-logo.gif);
	background-repeat: no-repeat;
	height: 24px;
	display: block;
	width: 65px;
	float: left;
	margin-right: 15px;
}

.footer a#fgm {
background-image: url(./img/fgm-logo.gif);
background-repeat: no-repeat;
height: 24px;
display: block;
width: 88px;
float: left;
margin-right: 15px;
}


/* -- SINGLE POST PAGE -- */
.single-post .post, .page .post {
	background: #000;
	padding: 15px;
}
.single-post .post h2, .discussion h2 {
	font-size: 25px;
	text-transform: uppercase;
	margin-bottom: 5px;
}
.single-post .post h2 span {
	color: #fff;
}
.single-post .post p {
	color: #fff;
	margin-bottom: 15px;
	line-height: 1.2em;
}

/* -- SINGLE VIDEO PAGE -- */
.single-Video .contentWrap, .single-post .contentWrap{
	width: 720px;
	margin: 0 auto;
}

.contentWrap #topFeature {
	width: 720px;
	max-height: 90px;
	margin-bottom: 20px;
}

.single-Video #content p {
	margin-bottom: 0px;
}

.blog .post, .page-template-contact-php #content, .single-post #content {
	padding: 15px;
	background: #000;
	color: #fff;
}

.blog .post {
	margin-bottom: 15px;
}

.post ul, .post ul li {
	list-style: outside disc;
	margin-left: 35px;
}

.post ol, .post ol li{
	list-style: outside decimal;
	margin-left: 35px;
}

.post ul, .post ol {
	margin-bottom: 1.3em;
}

.blog h2 {
	font-size: 20px;
	margin-bottom: 5px;
	text-transform: uppercase;
}
.postMeta {
	display: inline-block;
	width: 100%;
}

/* -- DISCUSSION -- */

.discussion {
	margin-top: 15px;
}

li.comment {
	background: #fff;
	color: #000;
	padding: 15px;
}

.comment .avatar {
	float: left;
	margin: 5px 8px 5px 0;
}

.comment p {
	margin-left: 70px;
	line-height: 1.3em;
	margin-bottom: 1.4em;
}

.commentsNav {
	display: inline-block;
}

.commentsNav li {
	text-transform: uppercase;
}

#respond {
	margin-top: 15px;
}

#respond h2 {
	font-size: 22px;
	color: #009ecb;
	text-transform: uppercase;
}

form#commentform {
	width: 100%;
	position: relative;
}
form#commentform input[type="text"] {
	border: none;
	padding: 3px;
	margin: 5px;
}
form#commentform p {
	margin-bottom: 10px;
}

input#submit {
	background: transparent url(./img/submit.gif) no-repeat;
	height: 23px;
	width: 69px;
	border: none;
	cursor: pointer;
	position: absolute;
	bottom: 0;
	right: 0;
}

input:hover#submit {
	background-position: 0 -24px;
}

form#commentform textarea {
	margin-bottom: 30px;
	width: 100%;
}

form#constant-contact-signup input[type="text"] {
	margin-bottom: 12px;
}

/* -- MODAL DIALOGUE -- */
#simplemodal-overlay {
	background: #000;
}

a.modalClose {
	color: #fff;
	text-transform: uppercase;
	position: absolute;
	right: 5px;
	top: -20px;
}