@import url(fonts/fontawesome/css/font-awesome.min.css);
@import url(dropkick.css);


body{
	margin:0px;
	padding:0px 12px 0px 0px;
	font-size:16px;
	font-family:"nexa_boldregular", Arial, Helvetica, sans-serif;
	text-decoration:none;
	}
a{text-decoration:none;}
	
#ph-widget{
	min-width:1px;
	width:100%;
	height:auto;
	border:6px solid #acacac;
	margin:0px auto;
	padding:0px 0px 14px 0px;
	overflow:hidden;
	background-color:#e4e4e4;
	position:relative;
}

#load{display:none;	background-image:url('../assets/preloader.png'); background-repeat:no-repeat; background-position:center center; width:100%; height:auto;background-color:#000; position:absolute; z-index:999;}

#response{display:none; background-image:url('../assets/preloader.png');background-color:#333; background-repeat:no-repeat; background-position:center center;}
#new{display:none;  background-image:url('../assets/preloader.png'); background-color:#333;background-repeat:no-repeat; background-position:center center; position:relative;}
	
#cover{
	width:100%;
	height:100%;
	margin:0px;
	padding:0px;
	top:0px;
	background-color:#000000;
	left:0px;	
	z-index:-1;
	opacity:1.0;
	filter:alpha(opacity=100);
}

#cover img{
	width:100%;
	height:auto;
	opacity:1.0;
	filter:alpha(opacity=100);
}

#cover.int img{
	width:100%;
	height:auto;
	opacity:0.15;
	filter:alpha(opacity=15);
}






/* tool bar */

#tools{
	width:100%;	
	height:84px;
	position:relative;
	border-top:6px solid #acacac;
	background-color:#e4e4e4;
	text-align:center;
}

#toolstop{
	width:100%;
	height:72px;
	background:#e4e4e4;
	display:block;
	text-align:center;border-bottom: 2px solid #acacac;
	padding:0px;
}

#ctas{ margin:0px auto;
	width:98%;
	text-align:center;
	padding-top:23px;
	padding-bottom:27px;
	
}

#ctas a{
	width:auto;
	margin-right:15px;
	font-family:"Arial Black", Arial, Lato, sans-serif;
	font-weight:bold;
	color:#3a3a3a;
	font-size:16px;
	text-transform:uppercase;
	padding:3px 5px 3px 15px;
	text-decoration:none;
	}
#ctas a:hover{ color:#1a1a1a;}
#ctas a.first{padding-left:0px;}
#ctas a.last{margin-right:15px;}

	
#ctas #listen{
	width:auto;
	border-left:none;
	font-family:"Arial Black", Arial, Lato, sans-serif;
	font-weight:bold;
	text-transform:uppercase;
	}


#ctas a#watch{
	width:auto;
	border-left:1.5px solid #acacac;
	font-family:"Arial Black", Arial, Lato, sans-serif;
	font-weight:bold;
	text-transform:uppercase;
	}
	
	
#ctas a#download{
	width:auto;
	border-left:1.5px solid #acacac;
	font-family:"Arial Black", Arial, Lato, sans-serif;
	font-weight:bold;
	text-transform:uppercase;
	}


#ctas a#share{
	width:auto;
	border-left:1.5px solid #acacac;
	font-family:"Arial Black", Arial, Lato, sans-serif;
	font-weight:bold;
	text-transform:uppercase;
	}


/* bottom */

#tools{
	width:100%;
	position:relative;
	z-index:999;
}


#bottom{
	width:100%;
	text-align:center;
	background-color:#e4e4e4;
	height:19px;	
	padding-top:0px;
	z-index:999;
	position:relative;
	font-family:"nexa_boldregular", arial, helvetica, sans-serif;
}

	


#bottom a{
	width:auto;
	margin-right:5px;
	border-right:1px solid #acacac;
	padding-left:5px;
	font-family:"nexa_boldregular", arial, helvetica, sans-serif;
	font-weight:bolder;
	color:#3a3a3a;
	font-size:9.5px;
	text-transform:uppercase;
	padding:0px 5px 0px 5px;
	text-decoration:none;
	}
#bottom a:hover{
	color:#bebebe;	
}

#bottom a.last{margin-right:0px; padding-right:0px; border-right:0px;}
#bottom a.first{margin-left:0px; padding-left:0px; border-left:0px;}

#bottom a.pushhouse{
	right:0px; 
	position:absolute; 
	margin-right:0px; 
	padding-bottom:0px; 
	top:4px;color:#858484;
	font-family:"nexa_boldregular", arial, helvetica, sans-serif;
	text-transform:lowercase;
	font-size:12px;
	border-right:none;
}



/* INTERIORS */
#inside{
	width:100%;
	height:100%;
	position:absolute;
	top:0px;	
	z-index:999;
	
}

#inside h2{
	width:16px;
	font-weight:bold;
	color:#fff;width:100%;
	line-height:16px;
	margin:0px; padding:0px;
	font-family:"Arial Black", Arial, sans-serif;
}
#inside strong{
	color:#acacac;
	font-size:10px;
	margin:0px; padding:0px;
	font-family:Arial, Helvetica, sans-serif;
	}

#close{
	width:100%;
	height:32px;
	text-align:center;
	font-weight:bold;
	font-family:"Arial Black", Gadget, sans-serif;
	color:#222;
	padding:5px 0px 0px 0px;
	margin:0px 0px 0px 0px;
	text-align:center;
	letter-spacing:1px;
	position:absolute; top:0px; left:0px;
	text-transform:uppercase;
	background-color:#acacac;text-decoration:none;display:none;z-index:999;
}
a #close{font-size:16px; text-decoration:none;}

#close:hover{background-color:#c3c3c3;height:32px; text-decoration:none;}
a #close:hover {background-color:#c3c3c3;color:#000;letter-spacing:1px;width:100%;text-decoration:none;}
#close a{
	}



/* WATCH */

#inside {
	width:100%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px; color:#e4e4e4;
	font-weight:normal;	
	height:100%;
}


#inside p{
	margin:0px; padding:0px;
	font-family:Arial, Helvetica, sans-serif;
	color:#e4e4e4;
	
	}

#inside table{width:100%; color:#e4e4e4; font-size:11px; height:100%; padding-top:40px;  height:85%; text-align:center;}
#inside table td{width:100%; height:100%;}
table #item{
	width:75%;
	margin:0 auto;
	border-bottom:3px solid #666666;	
	padding:38px 10px 15px 10px;
	background-color:transparent;
}

table #item:hover{
	background-color:#000;	
	opacity:0.50;
	filter:alpha(opacity=50);
}

table #item p{
	font-size:12px;	
	color:#cccccc;
}

#inside table td #video{
	position:relative;
	width:100%;
	max-height:800px;
	height:75%!important;
	margin:20px 0px;
	background-color:#000000;
	border-top:3px solid #acacac;
	border-bottom:3px solid #acacac;
}


table a{ text-decoration:none; color:#e4e4e4;width:100%}
table a h2{ margin-top:10px; text-decoration:none; color:#ffffff; font-size:17px;width:100%;}
table a h3{ text-decoration:none; color:#e4e4e4; font-size:16px;width:100%;}
table a h3:hover{ text-decoration:none; font-size:16px;width:100%; text-decoration:none;}
h3{margin:0px;padding:0px;}


/* LISTEN */
#album{
	width:99%;
	position:relative;
	height: 420px;
	margin:20px 0px;
	background-color:#000000;
	}
#track{
	width:99%;
	position:relative;
	height: 166px;
	margin:20px 0px;
	background-color:#000000;
	}
	


#maximize h4{color:#fff; font-family:Arial, Helvetica, sans-serif; width:100%; font-size:12px; text-align:center; padding:5px 10px 5px 15px; background-color:#636363; border-radius: 4px; border:#acacac; background-image:url('../assets/up-down.png'); background-position:15px 7px; background-repeat:no-repeat; height:11px;display:none; position:absolute; top:-40px; z-index:999;}
#maximize h4 a{color:#fff; text-decoration:none;}
a #maximize h4:hover{	 background-color:#333; border-radius: 4px; border:2px #acacac;	}
	
	
	
	
h4{color:#fff; font-family:Arial, Helvetica, sans-serif; width:140px; font-size:12px; text-align:center; padding:5px 10px 5px 15px; background-color:#636363; border-radius: 4px; border:#acacac; background-image:url('../assets/up-down.png'); background-position:15px 7px; background-repeat:no-repeat; height:11px;}
h4 a{color:#fff; text-decoration:none;}
h4:hover{
	 background-color:#333; border-radius: 4px; border:2px #acacac;
	}


/* embed page */

#embed{
	width:100%;
	height:100%;
	margin:0px;
	padding:0px;
	top:0px;
	background-color:#ffffff;
	left:0px;	
	z-index:-1;
	opacity:1.0;
	filter:alpha(opacity=100);
}

#embed img{
	width:100%;
	height:auto;
	opacity:1.0;
	filter:alpha(opacity=100);
}

#embed.int img{
	width:100%;
	height:auto;
	opacity:0.08;
	filter:alpha(opacity=8);
}

table #section{
	width:50%;
	border-bottom:3px solid #797373;
	height:115px;
	margin:0 auto;
	text-align:left;
	padding:0 20%;
	margin-bottom:15px;
	position:relative;
}

table #section.ecode{height:135px}

table #section p{
	margin:0px auto;
	width:60%;
	padding:0px;
	}
table #section img{margin-right:5px;}
table #section img:hover{
	opacity:0.60;
	filter:alpha(opacity=60);}
table #section h3{
	font-size:14.5px;
	color:#3a3a3a;
	font-weight:bold;
	font-family:"Arial Black", arial, sans-serif;
	text-transform:uppercase;
	font-weight:bold;
	padding-bottom:5px;
	text-align:left;	
	}
table #section input{
	padding:7px;
	margin-top:5px;
	background-color:#fff;
	border:1px solid #acacac;
	border-radius: 2px;
 	-moz-border-radius: 2px;
 	-webkit-border-radius: 2px;
	float:left;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#333;
	width:100%;
	}
	
	
	
table #section textarea{
	padding:7px 7px 7px 7px;
	margin-top:5px;
	height:30px;
	background-color:#fff;
	border:1px solid #acacac;
	border-radius: 2px;
 	-moz-border-radius: 2px;
 	-webkit-border-radius: 2px;
	float:left;
	font-family:"Courier New", Courier, monospace;
	font-size:9.5px;
	color:#333;
	width:100%;
	text-indent:0px;
	text-align:left;
	}

table #section input#phwidth{width:25px; float:left;}
table #section input#phheight{width:25px; float:left;}

table #section #gen{
	padding:7px;
	margin-top:5px;
	margin-left:5px;
	background-color:#acacac;
	border:1px solid #acacac;
	border-radius: 5px;
 	-moz-border-radius: 5px;
 	-webkit-border-radius: 5px;
	float:left;
	font-family:"Arial Black", arial, sans-serif;
	font-size:12px;
	color:#FFF;
	text-align:center;
	width:75px;
	}
table #section #gen:hover{
	background-color:#3a3a3a;
	border:1px solid #3a3a3a;
	border-radius: 5px;
 	-moz-border-radius: 5px;
 	-webkit-border-radius: 5px;
	color:#CCCCCC;
	}

table #phouse{
	width:70%;
	border-bottom:none;
	color:#1e1b0f;
	height:20%;
	margin:0 auto;
	text-align:left;
	padding:3% 0% 0px 20%;
	position:relative;
}

table #phouse h3{
	font-size:14.5px;
	color:#3a3a3a;
	font-weight:bold;
	font-family:"Arial Black", arial, sans-serif;
	text-transform:uppercase;
	font-weight:bold;
	padding-bottom:5px;
	text-align:left;	
	}

table #phouse p{
	color:#1e1b0f;
	font-family: 'nexa_boldregular', arial, helvetica, sans-serif;
	font-size:11px;
	line-height:14px;
	margin:8px 0px 0px 0px;
	}
table #phouse p a{
	color:#117b2e;
	text-decoration:none;	
}

table #phouse p a:hover{color:#42ba63;}





/* RESPONSIVE STYLES */
@media only screen and (min-width: 500px) and (max-width: 600px) 
{	
	#ctas a{font-size:14px;	margin-right:6px;	padding-left:7px;	}
	#inside table{ }	
	table a h2{ margin-top:0px; text-decoration:none; color:#ffffff; font-size:17px;width:100%;}
	#video{  margin:5px 0px;}
	table #phouse p{display:none}
}

@media only screen and (min-width: 410px) and (max-width: 499px) 
{	
	#ctas a{font-size:11px;	margin-right:4px;	padding-left:8px; 	}	
	#video{ margin:5px 0px; }
	#inside table{ }	
	#bottom{text-align:left}
	table #phouse p{display:none}
}



@media only screen and (min-width: 200px) and (max-width:408px) 
{	#video{margin: 2px 0px; width:99%; border:none;}
		#inside table{}	
		#bottom{text-align:left}
		table #phouse p{display:none}
}


@media only screen and (min-width: 1px) and (max-width:409px) 
{	
		#ctas a{font-size:11px;	margin-right:4px;	padding-left:8px;	background-image:none; padding-right:0px; border:none;}
		#ctas a#share{font-size:11px;	margin-right:4px;	padding-left:8px;	background-image:none; padding-right:0px;border:none;}
		#ctas a#watch{font-size:11px;	margin-right:4px;	padding-left:8px;	background-image:none; padding-right:0px;border:none;}
		#ctas a#listen{font-size:11px;	margin-right:4px;	padding-left:8px;	background-image:none; padding-right:0px;border:none;}
		#ctas a#download{font-size:11px;	margin-right:4px;	padding-left:8px;	background-image:none; padding-right:0px;border:none;}	
		#bottom a.last{display:none}
		#bottom{text-align:left}
		#video{ margin: 2px 0px;}
		#inside table{}	
		table a#back h2{display:none}
		#item p{display:none;}
		#item h3{display:none}
		table #item{ border-bottom:2px solid #333333;}
		table #item:hover{ border-bottom:2px solid #333333;}
		.ecode{display:none}
		table #phouse p{display:none}
}


@font-face {
   font-family: 'nexa_boldregular';
    src: url('fonts/nexa_bold-webfont.eot');
    src: url('fonts/nexa_bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/nexa_bold-webfont.woff') format('woff'),
         url('fonts/nexa_bold-webfont.ttf') format('truetype'),
         url('fonts/nexa_bold-webfont.svg#nexa_boldregular') format('svg');
    font-weight: normal;
    font-style: normal;

}