/*
	Theme Name: Heave Media
	Theme URI: http://collectivecolony.com
	Description: Heave Media Theme
	Author: Collective Colony
	Version: 1.0
	Tags: dark, black, white, colored, two-column, fluid-layout, custom-header
*/

/*		Main
***************************************************************/
html { background: #f5f5f5; }
body { color: #231F20; cursor: default; font: normal 100%/1.5 Helvetica, Arial, sans-serif; /*padding-left: 100px;*/ position: relative; }

/* Defaults */
h1 { color: #231F20; font: normal 32px/1.2 Georgia, "Times New Roman", serif; }
h2 { color: #231F20; font: normal 24px/1.5 Helvetica, Arial, sans-serif; }
h3 { color: #231F20; font: normal 32px/1.2 Georgia, "Times New Roman", serif; }
h4 { color: #999; font-size: 12px; font-weight: normal; text-transform: uppercase; }

a { color: #999999; text-decoration: none; 
	transition: all .2s ease-in-out; 
	-moz-transition: all .2s ease-in-out; 
	-webkit-transition: all .2s ease-in-out; 
}
a:hover { background-color: #FDFCBF; }

/* Colors */
.sky-blue { color: #5ccbf0; }
.orange { color: #e7612c; }
.green { color: #237f41; }
.light-green { color: #d0df5a; }
.purple { color: #c76aad; }
.black { color: #231F20; }
.grey { color: #999; }
.light-grey { color: #e8e8e8; }

/* find */
.blue { color: #008dae; }
.red { color: #ec1c24; }
.brown { color: #6C5635; }

/* not use? */
.turquoise { color: #5CCB90; }

/* Main Section */
div.main { position: relative; z-index: 1; }

/* Section Headings */
h4.category { position: absolute; text-align: right; top: 1px; left: -10px; width: 100%; }
h4.category span { background: transparent; border-color: #999 transparent transparent #999; border-style: solid; border-width: 8px; display: block; float: left; position: absolute; top: 0; left: 11px; height: 1px; width: 0; }
h4.category.featured span { border-color: #231f20 transparent transparent #231f20; }
h4.category.music span { border-color: #c76aad transparent transparent #c76aad; }
h4.category.culture span { border-color: #5ccbf0 transparent transparent #5ccbf0; }
h4.category.reviews span { border-color: #ec1c24 transparent transparent #ec1c24; }
h4.category.interviews span { border-color: #e7612c transparent transparent #e7612c; }
h4.category.news span { border-color: #999 transparent transparent #999; }


/* Header */
div.main > header { height: 85px; position: relative; }
div.main > header h1 { position: absolute; top: 10px; }
div.main > header h1 a { background: transparent url('../images/sprites.png') no-repeat -10px -10px; display: block; height: 50px; text-indent: -9999px; width: 460px; }

/* Header > Right */
header div.right { position: absolute; right: 0; top: 10px; }
header div.right ul.social { float: right; }
header div.right ul.social li { display: block; float: left; margin-left: 10px; }
header div.right ul.social li a { background: transparent url('../images/sprites.png') no-repeat -10px -10px; display: block; height: 25px; width: 25px; text-indent: -99999px; 
	transition: none;
	-moz-transition: none;
	-webkit-transition: none;
}
header div.right ul.social li a[title~="Twitter"] { background-position: -5px -108px; }
header div.right ul.social li a[title~="Twitter"]:hover { background-position: -5px -138px; }
header div.right ul.social li a[title~="Facebook"] { background-position: -39px -108px; }
header div.right ul.social li a[title~="Facebook"]:hover { background-position: -39px -138px; }
header div.right ul.social li a[title~="Vimeo"] { background-position: -73px -108px; }
header div.right ul.social li a[title~="Vimeo"]:hover { background-position: -73px -138px; }
header div.right ul.social li a[title~="Rss"] { background-position: -108px -108px; }
header div.right ul.social li a[title~="Rss"]:hover { background-position: -108px -138px; }
/* Header > Search */
header form[role="search"] { height: 25px; margin-bottom: 10px; }
header form[role="search"] p { text-align: right; position: relative; }
header form[role="search"] p label { background: transparent url('../images/sprites.png') no-repeat -8px -77px; display: block; position: absolute; right: 0; height: 20px; width: 20px; z-index: 10; }
header form[role="search"] p input { background: transparent; border: 0 solid #dcdcdc; padding: 3px 20px 3px 5px; position: absolute; right: 0; width: 0; z-index: 9;
	transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-webkit-transition: all .3s ease-in-out;
}
header form[role="search"] p input.open,
header form[role="search"] p input:focus { border: 1px solid #dcdcdc; width: 200px; }

/* Navigation */
nav { border-top: 1px dashed #E8E8E8; border-bottom: 1px dashed #E8E8E8; margin-bottom: 20px; }
nav ul { margin: 5px 0; }
nav ul li { display: inline-block; margin-right: 20px; text-align: center; position: relative; }
nav ul li:last-child { margin-right: 0; }
nav ul li a { background: src('../images/sprites.png') no-repeat; color: #999; display: block; font-size: 13px; text-transform: uppercase; padding-right: 40px; 
	transition: color .3s ease-in-out;
	-moz-transition: color .3s ease-in-out;
	-webkit-transition: color .3s ease-in-out;
}
nav ul li a:hover { color: #231F20; background-color: transparent; background-position: 0 0; }
nav ul li a span { opacity: 0; position: absolute; top: 0; right: 0; height: 28px; width: 28px; 
	transition: opacity .3s ease-in-out;
	-moz-transition: opacity .3s ease-in-out;
	-webkit-transition: opacity .3s ease-in-out;
}
nav ul li a[title="Music"] span { background: url('../images/sprites.png') -47px -170px; }
nav ul li a[title="Culture"] span { background: url('../images/sprites.png') -88px -170px; }
nav ul li a[title="Interviews"] span { background: url('../images/sprites.png') -206px -170px; }
nav ul li a[title="Reviews"] span { background: url('../images/sprites.png') -126px -170px; }
nav ul li a[title="Heave.tv"] span { background: url('../images/sprites.png') -11px -170px; }
nav ul li a[title="News"] span { background: url('../images/sprites.png') -166px -170px; }
nav ul li a:hover span { opacity: 1; }


/* Featured Section */
section#featured { background: #eee; border: 1px solid #d8d8d8; margin-bottom: 20px; padding: 20px 0 15px; position: relative; }
section#featured ul li { border-right: 1px solid #ddd; border-left: 1px solid #fff; float: left; height: 220px; padding: 0 20px 0; position: relative; width: 275px; }
section#featured ul li:first-child { border-left: 0; padding-left: 15px; }
section#featured ul li:last-child { border-right: 0; padding-right: 15px; }
section#featured ul li article > a { border: 3px solid #fff; display: block; height: 125px; position: relative; margin-bottom: 5px; }
section#featured ul li article > a:hover { background: none; border-color: #e8e8e8; }
section#featured ul li article > a img { clip: rect(0px, 270px, 125px, 0px); position: absolute; width: 100%; }
section#featured ul li article h3 { font-size: 16px; line-height: 1.2; margin-bottom: 20px; }
section#featured ul li article h3 a { color: #999; }
section#featured ul li article h3 a:hover { background: transparent; color: #454243; }

/* Main Section */
section[role="main"] { }

/* 404 and Mis messages */
section[role="main"] div.message { background: #fff; margin-bottom: 25px; padding: 20px 10px; position: relative; 
	box-shadow: 1px 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 1px 1px 2px rgba(0,0,0,.2);
	-o-box-shadow: 1px 1px 2px rgba(0,0,0,.2);
	-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.2);
}
section[role="main"] div.message h3 { font-size: 24px; }
section[role="main"] div.message p { color: #999; font: normal 13px/1.2 Georgia, "Times New Roman", serif; margin-top: 15px; }

/* Articles - Globals */
article p.byline { color: #999; font-size: 11px; }
article p.byline a { color: #999; text-transform: uppercase; }
article p.byline a:hover { background-color: #fdfcbf; }

/* Articles Brief */
section[role="main"] article { background: #fff; margin-bottom: 25px; padding: 20px 10px 10px; position: relative; 
	box-shadow: 1px 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 1px 1px 2px rgba(0,0,0,.2);
	-o-box-shadow: 1px 1px 2px rgba(0,0,0,.2);
	-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.2);
}
section[role="main"] article header > a { display: block; height: 325px; margin-bottom: 5px; position: relative; }
section[role="main"] article header > a img { clip: rect(0px, 520px, 320px, 0px); position: absolute; max-height: 320px; height: auto; width: 520px; }
section[role="main"] article header a:hover { background: transparent; }
section[role="main"] article header h1 { margin-bottom: 30px; }
section[role="main"] article header h1 a { background: none; color: #231F20; text-indent: 0; }
section[role="main"] article header h1 a:hover { color: #666; }
section[role="main"] article footer { bottom: 10px; width: 600px; }

/* Main Layout - Single */
section[role="main"] article.single section { float: right; }
section[role="main"] article.single figure { margin: 0 0 15px; }
section[role="main"] article.single figure img { height: auto; width: 455px; }
section[role="main"] article.single section.review-details { float: left; margin-bottom: 25px; }
section[role="main"] article.single section.review-details h2, 
section[role="main"] article.single section.review-details h3 { font-size: 20px; }
section[role="main"] article.single section.review-details h2 { color: #999 }
section[role="main"] article.single section.review-details p.release { font-size: 12px; color: #999; margin-top: 5px; }
section[role="main"] article.single section.content { font: 13px/1.5 Georgia, serif; }
section[role="main"] article.single section.content img { max-width: 460px; height: auto; }
section[role="main"] article.single section.content p { margin-bottom: 20px; }
section[role="main"] article.single section.content p i,
section[role="main"] article.single section.content p em { color: #999; }
section[role="main"] article.single footer { float: left; }
section[role="main"] article.single #disqus_thread { clear: both; float: left; margin-top: 25px; width: 100%; }

/* Interview tweaks */
section[role="main"] article.single section.interviews section.content p strong { background: #fdfcbf; }

/* Gutter Styles */
section[role="main"] article.single footer { color: #999; font-size: 12px; position: relative; }
section[role="main"] article.single footer h5 { 
	color: #231F20; 
	border-bottom: 1px dashed #E8E8E8; 
	font-size: 18px; 
	display: block; 
	font: 12px/1 "Book Antique", Georgia, serif; 
	font-style: italic; 
	margin-bottom: 6px;
	padding: 0 0 5px; 
	width: 125px; 
}
section[role="main"] article.single footer p,
section[role="main"] article.single footer ul { margin-bottom: 20px; }
section[role="main"] article.single footer ul li { display: block; text-transform: capitalize; }
section[role="main"] article.single footer ul.social li { display: inline-block; vertical-align: top; }
section[role="main"] article.single footer ul.social li a:hover { background: transparent; }
section[role="main"] article.single footer ul.social li a iframe { min-height: 86px }

/* Next / Previous links */
section[role="main"] div[role="navigation"] { margin-top: 10px; }
section[role="main"] div[role="navigation"] a { font-size: 14px; text-transform: uppercase; }

/* Footer By Line */
section footer,
article footer { position: absolute; bottom: 0; }
article footer p.byline { float: left; }

/* Comments box */
article footer div.commentbox { font-size: 11px; float: right; }

/* Gutter */
aside > section { background: #fff; margin-bottom: 25px; padding: 20px 10px 10px; position: relative;
	box-shadow: 1px 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 1px 1px 2px rgba(0,0,0,.2);
	-o-box-shadow: 1px 1px 2px rgba(0,0,0,.2);
	-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.2);
}

/*		Reviews		*/
aside > section.reviews #revCurrent { float: left; width: 270px; }
aside > section.reviews #revCurrent a { display: block; }
aside > section.reviews #revCurrent a:hover { background: transparent; }
aside > section.reviews #revCurrent a img { height: auto; width: 100%; }
aside > section.reviews #revCurrent a h3 { margin-top: 5px; }
aside > section.reviews #revCurrent a:hover h3 { color: #666; }
aside > section.reviews #revCurrent a h4 { margin-top: 10px; }
aside > section.reviews ol { float: right; width: 80px; }
aside > section.reviews ol li { margin-bottom: 5px; padding: 1px; }
aside > section.reviews ol li a { display: block; line-height: 0; }
aside > section.reviews ol li a > img { border: 2px solid #dcdcdc; height: auto; width: 75px; 	
	transition: border-color 0.2s ease-in;
	-moz-transition: border-color 0.2s ease-in;
	-o-transition: border-color 0.2s ease-in;
	-webkit-transition: border-color 0.2s ease-in;
}
aside > section.reviews ol li a:hover > img,
aside > section.reviews ol li.active a > img { border-color: #999; }
aside > section.reviews ol li a:hover { background: transparent; }
aside > section.reviews ol li a span.hidden { display: none; }

/* Ratings */ 
ol#ratings { display: block; float: left; margin-top: 10px; width: 100%; }
ol#ratings li { background: #e9e9e9; color: #fff; display: block; font-size: 12px; float: left; line-height: 18px; margin-right: 1px; padding-top: 2px; text-align: center; text-indent: -99999px; width: 20px; }
ol#ratings li.current { text-indent: 0; }
ol#ratings li.r1.current { background: #ec1c24; }
ol#ratings li.r2.current { background: #008dae; }
ol#ratings li.r3.current { background: #f16422; }
ol#ratings li.r4.current { background: #1e803f; }
ol#ratings li.r5.current { background: #bd60a5; }
ol#ratings li.r6.current { background: #5CCB90; }
ol#ratings li.r7.current { background: #e74b32; }
ol#ratings li.r8.current { background: #6C5635; }
ol#ratings li.r9.current { background: #CFDE5A; }
ol#ratings li.r10.current { background: #67c8d8; }

/* Related */
aside > section.related { padding-left: 0; padding-right: 0; }
aside > section.related ul.related_post li { margin-bottom: 10px; padding: 4px 10px; 
	transition: background .3s ease-in;
	-moz-transition: background .3s ease-in;
	-o-transition: background .3s ease-in;
	-webkit-transition: background .3s ease-in;
}
aside > section.related ul.related_post li:hover { background: #f9f9f9; }
aside > section.related ul.related_post li h3 { font-size: 20px; line-height: 1.3; margin-bottom: 5px; }
aside > section.related ul.related_post li h3 a { background: transparent; color: #231F20; }
aside > section.related ul.related_post li h3 a:hover { color: #666; }
aside > section.related ul.related_post li p { font-size: 12px; color: #999; }
aside > section.related ul.related_post li p span a { text-transform: uppercase; }

/* Calendar */
aside > section.widget_calendar h3 { font-size: 22px; }
#wp-calendar {	width: 100%; }
#wp-calendar th { text-align: center; }
#wp-calendar td { background: #e8e8e8; color: #ccc; border: 1px solid #fff; line-height: 2.5; text-align: center; }
#wp-calendar td#today { background: #ccc; color: #fff; }
/*#wp-calendar tfoot { display: none; }*/
#wp-calendar td a { color: #231F20; display: block; text-decoration: none; }
#wp-calendar td a:hover { background: #5ccbf0; color: #fff; }


/* Footer */
div.main > footer { color: #999; font-size: 12px; margin-top: 50px; text-transform: uppercase; }
div.main > footer a { color: #999; }
div.main > footer a:hover { background-color: transparent; color: #231F20; }
div.main > footer div.search { background: #fff; height: 100%; padding: 5px 10px; position: absolute; left: 0; bottom: 0; top: 0; 
	box-shadow: 1px 1px 2px rgba(0,0,0,.2);
	-moz-box-shadow: 1px 1px 2px rgba(0,0,0,.2);
	-o-box-shadow: 1px 1px 2px rgba(0,0,0,.2);
	-webkit-box-shadow: 1px 1px 2px rgba(0,0,0,.2);
}
div.main > footer p.copyright { clear: both; font-size: 10px; margin-top: 45px; text-align: center; }
div.main > footer p.copyright span { margin: 0 10px; }

#wpstats { display: none; }

@media screen and (-webkit-min-device-pixel-ratio:0) {
	nav ul li a span { top: -3px; }
}