/*
Theme Name: Meloo
Theme URI: http://meloo.rascalsthemes.com
Author: Rascals Themes
Author URI: http://themeforest.net/user/rascals
Description: Continuous Music Playback HTML Template
Version: 1.2.0
*/

/*------------------------------------------------------------------

[Table of contents]

1. Reset & Clearfix
2. Basic Elements & Classes
3. Forms
4. Helper Classes
5. Typography
6. Lists
7. Header & Navigation
8. Footer
9. AJAX
10. Sections
11. Intro / Hero Section
12. Recent Releases
13. Event Countdown
14. Music Grid
15. Events
16. Biography
17. Contact
18. Newsletter
19. Single Page/Project 
20. Single Event
21. 404 Error Page
22. Audio Elements
23. Gallery/Media
24. Instagram Feed
25. Slider
26. Small Elements
27. Plugins
28. Animations
29. Transitions
30. Grid
31. Media Queries
*/


/* ==================================================
  1. Reset & Clearfix (http://meyerweb.com/eric/tools/css/reset/) 
================================================== */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,and,address,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video,input,textarea,select{background:transparent;border:0;font-size:100%;margin:0;outline:0;padding:0;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}del{text-decoration:line-through}hr{background:transparent;border:0;clear:both;color:transparent;height:1px;margin:0;padding:0}mark{background-color:#ffffb3;font-style:italic}input,select{vertical-align:middle}ins{background-color:red;color:white;text-decoration:none}ol,ul{list-style:none}table{border-collapse:collapse;border-spacing:0}


/* ==================================================
  2. Basic Elements & Classes 
================================================== */
* {
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}
body {
	overflow-x: hidden;
	color: #666;
	background: #fff;
	font-weight:300;
	font: 16px/1.6 'PT Sans', sans-serif;
}

::-moz-selection { background: #ff7700; color: #fff; text-shadow: none; }
::selection { background: #ff7700; color: #fff; text-shadow: none; }
h1, h2, h3, h4, h5, h6 {
	font-family: 'Barlow Condensed', sans-serif;
	color: #111;
	font-weight: 400;
	line-height: 1.4;
	margin-bottom: 30px;
	text-transform:uppercase;
}
.dark-bg h1, .dark-bg h2, .dark-bg h3, .dark-bg h4, .dark-bg h5, .dark-bg h6 {
	color: #fff;
}
a, a > * {
	color: #ff7700;
	text-decoration: none;
	-webkit-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
	   -moz-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
	    -ms-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
	     -o-transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
	        transition: background-color .2s ease, border .2s ease, color .2s ease, opacity .2s ease-in-out;
}
a:hover, a > *:hover { color: #fff; }
h1 { font-size: 42px; }
h2 { font-size: 34px; }
h3 { font-size: 28px; }
h4 { font-size: 24px; }
h5 { font-size: 20px; }
h6 { font-size: 18px; }
small { font-size: 12px; }
ol { list-style: decimal; }
ul { list-style: disc; }
li { margin: 4px 0 4px 30px; color: #333; }
img {max-width:100%;vertical-align:middle;}
dl,hr,ol,ul,pre,table,address,fieldset,blockquote,p,iframe {margin-bottom: 40px;}
article { margin-bottom: 30px; }
strong, b { color: #111; }

/* Blockquote */
blockquote {
	font-family: 'Barlow Condensed', sans-serif;
	position: relative;
	font-size: 26px;
	letter-spacing: .1em;
	line-height: 33px;
	text-transform: uppercase;
	display: block;
	font-weight: 300;
	width: 90%;
	margin-right: 5%;
	margin-left: 5%;
}
blockquote:after, blockquote:before {
	content: '';
    width: 19px;
    height: 19px;
    display: inline-block;
    position: relative;
}
blockquote:before {
	bottom: -1px;
    margin: 0 7px 0 0;
    background: url(../images/quote-start.svg) no-repeat;
}
blockquote:after {
	top: -2px;
    margin: 0 0 0 7px;
    background: url(../images/quote-end.svg) no-repeat;
}
small {
	font-size: 11px;
}


/* ==================================================
  3. Forms 
================================================== */
label {
	cursor: pointer;
	display: block;
	margin: 0 0 5px;
}
input, textarea, select {
	-webkit-appearance: none;
	background-color: transparent;
	border-bottom: 1px solid #ddd;
	color: #fff;
	font: 12px/1.5;
	padding: 30px 0px;
	font-family: 'PT Sans', sans-serif;
}
input, select {
	height: 30px;
}
textarea {
	padding:20px 0;
	resize: both;
	width: 100%;
}
select, option {
	cursor: pointer;
	padding: 5px 7px;
}

/* Placeholders */
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder { 
	color: #999;
	text-transform:uppercase;
	letter-spacing:0.2em;
	font-size:13px
}
input:-moz-placeholder, 
textarea:-moz-placeholder { 
	color: #999;
	text-transform:uppercase;
	letter-spacing:0.2em;
	font-size:13px
}


/* Contact Form
 -------------------------------- */
.contact-form {
	overflow:hidden;
}
.contact-form input, .contact-form textarea {
	margin-bottom:30px;
	float: left;
	transition: border-color 0.8s ease;
}
.contact-form input:focus, .contact-form textarea:focus {
	border-color:#fff;
}
.contact-form input:not(.half), .contact-form textarea:not(.half) {
	width: 100%;
}
.contact-form input[type="submit"] {
    margin: 0 0 20px;
    width: auto;
}


/* ==================================================
  4. Helper Classes 
================================================== */
.hidden { display: none; }
.disabled { cursor: auto; }
.invisible { visibility: hidden; }
.aligncenter { margin-left: auto; margin-right: auto; text-align: center; }
img.size-1-2 { width: 50%; height: 50%;}
img.size-3-4 { width: 75%; height: 75%;}
img.aligncenter { display: block; margin-bottom: 30px; }
.alignleft, .floatleft { float: left; }
img.alignleft { margin-bottom: 30px; margin-right: 20px; }
.alignright, .floatright { float: right; }
img.alignright { margin-bottom: 30px; margin-left: 20px; }
.text-right { text-align: right; }
.text-left { text-align: left; }
.text-center { text-align: center; }
.color { color: #ff7700; }
.caps { text-transform: uppercase; }
.clear { clear:both; display:block; height:1px; margin-top:-1px; overflow:hidden; visibility:hidden; width:0 }
.clearfix:after { clear:both; content:' '; display:block; font-size:0; height:0; line-height:0; visibility:hidden; width:0 }
* html .clearfix,:first-child+html .clearfix { zoom:1 }
.inlineblock { display: inline-block;}
.half {
	display: inline-block;
    float: left;
    width: 47%;
    margin-right: 6%;
}
.half.last {
	margin-right: 0;
}
.image-filter-blur {
    -webkit-filter: blur(300px);
    -moz-filter: blur(300px);
    filter: blur(300px);
}
.image-filter-grayscale {
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    filter: grayscale(100%);
}
.image-filter-mix {
    filter: blur(300px) grayscale(100%);
}
.content-iframe { width: 100%; }
.opacity-01 { opacity: 0.1 }
.opacity-02 { opacity: 0.2 }
.opacity-03 { opacity: 0.3 }
.opacity-04 { opacity: 0.4 }
.opacity-05 { opacity: 0.5 }
.opacity-06 { opacity: 0.6 }
.opacity-07 { opacity: 0.7 }
.opacity-08 { opacity: 0.8 }
.opacity-09 { opacity: 0.9 }


/* ==================================================
  5. Typography 
================================================== */

/* Extra Large heading */
.heading-xl { 
	font-size: 96px; 
	line-height: 1.4em;
	letter-spacing: -0.05em;
} 

/* Large heading */
.heading-l {
	font-size: 60px;
	line-height: 1.4em;
}

/* Medium heading */
.heading-m {
	font-size: 36px;
	line-height: 1.4em;
}

/* Small sub heading */
.sub-heading {
	display: block;
	position: relative;
	top: -30px;
	font-size: 21px;
	color: #aaa;
	text-transform: uppercase;
}

/* Content Title */
.content-title {
	font-size: 65px;
	text-transform:uppercase;
	position: relative;
	z-index: 1;
}
.content-subtitle {
	margin-top:-40px;
	margin-bottom:50px;
	opacity:0.4;
	letter-spacing:0.03em
}
.content-header .back-layer {
	position:absolute;
	top: -10px;
	left:0px;
	width:100%;
	line-height:100%;
	font-size: 100px;
	z-index: 0;
	opacity: 0.07;
	text-align:center;
	font-weight:900;
	text-transform:uppercase;
	letter-spacing:0.02em;
	color: #222;
}
.content-header.text-left .back-layer {
	text-align:left
}
.dark-bg .content-title,
.dark-bg .content-subtitle,
.dark-bg .content-header .back-layer {
	color:#fff;
}

/* Heading Styles */
.heading-1 {
	font-weight: 300;
	letter-spacing: 0.1em;
	opacity: 0.6;
}
.heading-2 {
	font-weight: 300;
	letter-spacing: 0.1em;
	opacity: 1;
}


/* Fonts 
 -------------------------------- */
.barlow {
	font-family: 'Barlow Condensed', sans-serif;
}


/* ==================================================
  6. Lists 
================================================== */
ol,ul {
    padding: 0 0 0 20px;
    margin-bottom: 30px;
}
.check-list {
	list-style: none;
	padding-left: 0;
	color:#666;
}	
	.check-list li {
		position: relative;
		padding-left: 30px;
		margin-bottom: 5px;
	}
	.check-list li:before {
		font-family: "icomoon";
		content: "\e642";
		display: inline-block;
		position: absolute;
		left: 0;
		font-size: 14px;
		color: #333;
	}
.x-list {
	list-style: none;
	padding-left: 0;
	color:#666
}	
	.x-list li {
		position: relative;
		padding-left: 30px;
		margin-bottom: 5px;
	}
	.x-list li:before {
		font-family: "icomoon";
		content: "\e641";
		display: inline-block;
		position: absolute;
		left: 0;
		font-size: 14px;
		color: #333;
	}
.clear-list {
	list-style: none;
	margin: 0;
}


/* ==================================================
   7. Header & Navigation 
================================================== */
	

/* header
 -------------------------------- */
#header {
	position: relative;
	height: 65px;
	width: 100%;
	top: 0px;
	z-index: 60;
	position:fixed;
	backface-visibility: hidden;
}
#header #main-nav {
	transition: all 490ms cubic-bezier(0.680, 0.120, 0.060, 0.835);
	background: #ffffff;
}
#header.hide-navigation #main-nav {
	background-color: transparent;
	padding: 20px 0;
}	


/* Main Navigation
 -------------------------------- */

/* Navigation container */
.nav-container {
	height: 65px;
	padding: 0 40px;
	position: relative;
	width: 100%;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */
	box-sizing: border-box;         /* Opera/IE 8+ */
}

/* Navigation list */
#nav { 
	float: right;
	z-index: 22;
	margin-top: 0px;	

}
	#nav > ul {
		margin: 25px 0 0 0;
		padding-bottom:0;
	}
	#nav li {
		list-style: none;
		float: left;
		margin: 0;
		position: relative;
		color:#222;
	}
		#nav a {
			font-size: 13px;
			display: block;
			margin-left: 20px;
			padding:0 5px;
			line-height: 12px;
			position: relative;
			text-transform: uppercase;
			letter-spacing: 0.13em;
			margin-bottom:25px;
		}
		#nav a, #nav a span {
			color: #222;
		}
		.hide-navigation #nav li,
		.hide-navigation #nav a,
		.hide-navigation #nav a span  {
			color: #fff;
		}
		#nav > ul > li > a:before {
			content: "";
			border-bottom: 10px solid #f70;
			display: block;
			width: 0;
			top: 7px;
			position: absolute;
			z-index: 0;
			left: 0px;
			transition: width 0.3s ease;
		}
		#nav > ul > li > a.active:before {
		    width: 100%;
		}

		/* Sub nav */
		#nav ul ul {
			background: #fff;
			display: none;
			left: 0;
			padding: 0;
			position: absolute;
			width: 200px;
			z-index: 23;
		}
			#nav ul ul li { float: none; }
				#nav ul ul a {
					color: #222;
					display: block;
					margin:0;
					font-size: 12px;
					letter-spacing: 0;
					padding: 12px 20px;
					text-align: left;
					line-height: normal;
				}
				#nav ul li a,
				.hide-navigation #nav ul li a {
					color:#222
				}
					#nav ul ul a:hover, #nav ul ul .hover > a, #nav ul ul .current > a, #nav ul ul .current > a:hover {
						background: #ff7700;
						border: none !important;
						color: #fff;
					}

					#nav ul ul ul {
						left:100%;
						top:0;
					}
				

/* Icon Navigation
 -------------------------------- */

/* Navigation list */
	#icon-nav {
	float: right;
	z-index: 23;
	margin-left: 10px;
	padding-left: 10px;
	margin-top: 13px;
} 
#icon-nav ul {
	margin-bottom:0;
}
	#icon-nav li {
		list-style: none;
		float: left;
		margin: 0;
		position: relative;
	}

		/* Responsive trigger wrapper */
		#icon-nav .responsive-trigger-wrap {
			display: none;
		}

		/* Nav player button */
		#icon-nav .nav-player-btn.status-playing .circle {
			stroke: #ff7700;
			opacity:1;
		}
		#icon-nav .nav-player-btn.status-paused .circle {
			opacity:0.5;
			stroke: #222222;
		}
		.hide-navigation #icon-nav .nav-player-btn.status-paused .circle {
			stroke:#ffffff;
		}
		#icon-nav .nav-player-btn .circle-bg {
			stroke:#cccccc;
		}
		.hide-navigation #icon-nav .nav-player-btn .circle-bg {
			stroke:#fff;
		}
		#icon-nav .nav-player-btn.status-playing span,
		#icon-nav .nav-player-btn.status-playing.status-show-player span {
		    opacity:1;
		}
		.hide-navigation #icon-nav .nav-player-btn.status-show-player span {
			color:#fff;
		}
		#icon-nav  .nav-player-btn.status-show-player span {
		    color:#222;
		    opacity:1;
		}
		#icon-nav .nav-player-btn.status-loading span {
		    animation: blink normal 0.5s infinite ease-in-out;
		  -webkit-animation: blink normal 0.5s infinite ease-in-out;
		}
		.hide-navigation #icon-nav .circle-btn,
		.hide-navigation #icon-nav .circle-btn span {
			color: #fff;
		}
		.hide-navigation #icon-nav .circle-btn .circle {
			stroke:#ffffff;
		}
	


/* Responsive Trigger
 -------------------------------- */
.responsive-trigger {
    display: none;
    background-color: transparent;
    z-index: 22;
    position: relative;
    margin-left: -10px;
}
.responsive-trigger .icon {
    display: inline-block;
    width: 18px;
    height: 1px;
    position: absolute;
    left: 12px;
    top: 18px;
    background: #222;
}
.responsive-trigger .icon:before, .responsive-trigger .icon:after {
    content: '';
    width: 100%;
    height: 1px;
    position: absolute;
    background-color: #222;
    left: 0;
}
.responsive-trigger .icon:before {
    top: -5px;
    width: 130%;
}
.responsive-trigger .icon:after {
    top: 5px;
    width:70%;
}
.responsive-trigger:hover span:before {
    width:100%;
}
.responsive-trigger:hover span:after {
    width:100%;
}
.responsive-trigger .icon, .responsive-trigger .icon:before, .responsive-trigger .icon:after {
    transition: all 0.3s ease;
}

.hide-navigation #icon-nav .responsive-trigger .icon:before, 
.hide-navigation #icon-nav .responsive-trigger .icon:after {
	background:#fff;
}
.hide-navigation #icon-nav .responsive-trigger .icon {
	background:#fff;
}


/* Logo
 -------------------------------- */
#logo { 
	float: left;
	margin: 20px 0 0 0;
}
	#logo img { 
		margin: 0;
	}
	.logo-light {
		display:none;
	}
	.hide-navigation .logo-dark {
		display:none;
	}
	.hide-navigation .logo-light {
		display:block
	}


/* Search
 -------------------------------- */
#search-block {
	width: 100%; 
	display: none;
}

/* Search input */
#search {
	border: 0;
	background-color: #ff7700;
	width: 100%;
	padding: 30px 30px 30px 30px;
	font-size: 24px;
	color: #fff;
	-webkit-transition: all .5s ease;
	-moz-transition: all .5s ease;
	transition: all .5s ease;
}
#search::-webkit-input-placeholder { 
	color: #fff;
	font-size:22px;
	letter-spacing:0.05em
}
#search:-moz-placeholder { 
	color: #fff;
	font-size:22px;
	letter-spacing:0.05em
}
#search:-ms-input-placeholder { 
	color: #fff;
	font-size:22px;
	letter-spacing:0.05em
}


/* Social Block
 -------------------------------- */
#social-block {
	width: 100%;
	display: none;
	background-color: #eee;
	text-align: center;
	padding: 30px 30px;
	position:relative;
	-webkit-box-shadow: inset -2px -12px 26px -19px rgba(0,0,0,1);
	-moz-box-shadow: inset -2px -12px 26px -19px rgba(0,0,0,1);
	box-shadow: inset -2px -12px 26px -19px rgba(0,0,0,1);
	overflow: hidden;
}
.social-title {
	font-size: 14px;
	color: #222;
	margin-bottom: 30px;
	text-transform:uppercase;
	font-weight:400;
	letter-spacing:0.1em
}
.social-icons .circle-btn {
	font-size:16px;
	margin:5px;
}
.social-icons .circle-btn span {
	border:2px solid #ddd;
	width:46px;
	height:46px;
	border-radius:100%;
	line-height:43px;
	left:2px;
	top:2px;
	z-index:-1
}
.social-icons .circle-btn .circle {
	z-index:2;
	position:absolute;
}

	
/* Responsive Navigation
 -------------------------------- */
#responsive-nav {
	padding-top:40%;
    margin-bottom: 30px
}
#responsive-nav ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
    font-weight: 300;
    margin-bottom:20px;
}
#responsive-nav ul li {
    width: 100%;
    padding: 0;
    margin: 0;
    position: relative;
}
#responsive-nav > ul > li {
	text-align:center
}
#responsive-nav ul li a {
    text-transform:uppercase;
    font-size: 18px;
    display: inline-block;
    padding: 8px 25px 8px 25px;
    color: #fff;
    font-weight: 300;
    opacity:1;
    letter-spacing:0.1em;
    transition: opacity 0.3s;
}
#responsive-nav ul li a,
#responsive-nav ul li a span {
	color:#fff;
}
#responsive-nav ul li a span {
	opacity:1
}
#responsive-nav ul li a:hover,
#responsive-nav ul li a:hover span {
    opacity: 1;
}
#responsive-nav ul {
}
#responsive-nav > ul > li:last-child a {
    border: none;
}
#responsive-nav ul ul {
    display: none;
}
#responsive-nav ul ul:before {
	content:"";
	display:inline-block;
	width:1px;
	height:10px;
	position:relative;
	background-color:#666
}
#responsive-nav ul li li a {
    padding-top: 6px;
    padding-bottom: 6px;
    opacity:0.7
}
#responsive-nav ul li i {
    position: relative;
    display:inline-block;
    top: 1px;
    right: 0px;
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    margin-left:-10px;
    transition: transform 0.3s ease;
    -webkit-transition: transform 0.3s ease;
}
#responsive-nav ul ul li i {
	opacity:0.7
}
#responsive-nav ul li.opened > i:first-of-type {
    transform:rotate(180deg);
}

/* Responsive Block */
.responsive-block {
    width: 400px;
    background-color: rgba(10, 10, 10, 1);
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 71;
    -webkit-transform: translateX(-400px);
    -moz-transform: translateX(-400px);
    transform: translateX(-400px);
    backface-visibility: hidden;
}

/* Anim */
.responsive-block, #scamp_player, #header, .site {
    transition-property: transform;
    -webkit-transition-property: transform;
    transition-duration: 0.6s;
    -webkit-transition-duration: 0.6s;
    transition-timing-function: cubic-bezier(.77, 0, .175, 1);
    -webkit-transition-timing-function: cubic-bezier(.77, 0, .175, 1); /* Safari and Chrome */
}
body.responsive-block-on .responsive-block {
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    transform: translateX(0px);
}

body.responsive-block-on .site, body.responsive-block-on #header, body.responsive-block-on #scamp_player {
    -webkit-transform: translateX(300px) ;
    -moz-transform: translateX(300px);
    transform: translateX(300px);
}
body.responsive-block-on .theiaStickySidebar {
}
.responsive-block .responsive-nav-image {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: 0.3;
    z-index: 0;
    background-size: cover;
}
.responsive-block-wrap {
    position: absolute;
    top: 60px;
    bottom: 60px;
    right: 30px;
    left: 30px;
}
.responsive-block-content {
    position: relative;
    max-height: 100%;
    padding: 40px 20px;
    overflow: auto;
    -ms-overflow-style: none;
    overflow: -moz-scrollbars-none;
}
.responsive-block-content::-webkit-scrollbar { 
    display: none;  
}

/* Layer */
.responsive-block-layer {
    background-color: rgba(25, 25, 25, 0.74);
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    z-index: 70;
    opacity: 0;
    visibility:hidden;
    cursor: pointer;
    transition: all 0.6s cubic-bezier(.77,0,.175,1);
}
body.responsive-block-on .responsive-block-layer {
    opacity: 1;
    visibility:visible
}

/* Social */
#responsive-social {
   text-align:center;
}
#responsive-social a {
	margin:0;
}
#responsive-social .circle-btn,
#responsive-social .circle-btn span {
	color: #fff;
}
#responsive-social .circle-btn .circle {
	stroke:#ffffff;
}
#responsive-social .circle-btn span {
    border: 2px solid #333;
}

/* Close button */
.responsive-block a.responsive-block-close {
    position: absolute;
    right: 30px;
    top: 5px;
    width:20px;
    height:20px;
    line-height:20px;
    text-align:center;
    border-radius:100%;
    transition: opacity .3s ease-in-out;
    z-index: 10;
}
.responsive-block a.responsive-block-close:after,
.responsive-block a.responsive-block-close:before {
    content:"";
    position:absolute;
    width:20px;
    height:2px;
    background-color:#fff;
    top:19px;
    left:0;
}
.responsive-block a.responsive-block-close:after {
    -moz-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
.responsive-block a.responsive-block-close:before {
    -moz-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}


/* ==================================================
  8. Footer 
================================================== */
#footer {
	padding: 120px 0;
	width: 100%;
	background-color: #ffffff;
}
	#copyrights {
		color: #999;
		text-align: center;
		font-size: 14px;
		text-transform: uppercase;
	}
		#copyrights a { color: #ccc; }
		#copyrights a:hover { color: #fff; }


/* ==================================================
  9. AJAX  
================================================== */


/* Loader
 ------------------------------ */

/* Custom loading */
#loading-layer {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    z-index: 75;
    background: #fff;
    opacity: 0;
}
#loading-layer.show-layer {
    opacity: 1;
    transition: all 0.5s cubic-bezier(0.24, 1, 0.31, 1);
}
#loading-layer.hide-layer {
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.24, 1, 0.31, 1);
}
.ajax-loader {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    left: 50%;
}

/* Image */
.loader-img {
	text-align:center;
	margin-bottom:20px;
}
	.loader-img img {
		width: 100%;
	}

/* Progress bar */
.loader-bar {
	height: 4px;
	width: 200px;
	background: #ddd;
	position: relative;
}
	.loader-bar .progress-bar {
		height: 4px;
		width: 0%;
		background: #000;
		display: block;
		transition: all 0.5s ease;
	}


/* Ajax Page Container (APC)
 ------------------------------ */
body.apc-open {
    overflow: hidden;
}
body.apc-open .apc {
    display: block
}
.apc {
	opacity: 0;
	-webkit-transition: all .5s 0s cubic-bezier(.19,1,.22,1);
	transition: all .5s 0s cubic-bezier(.19,1,.22,1);
	bottom: 0;
	left: 0;
	position: fixed;
	pointer-events: auto;
	right: 0;
	overflow-x: hidden;
	top: 0;
	z-index: 62;
	-webkit-backface-visibility: hidden;
	background: rgba(13, 13, 14, 0.91);
	display: none;
}
.apc.on {
	opacity: 1;
}
	.apc-block {
		-webkit-transition: all .5s 0s cubic-bezier(.19,1,.22,1);
		transition: all .5s 0s cubic-bezier(.19,1,.22,1);
		max-height: 100%;
		width: 100%;
		z-index: 50;
		position: fixed;
		opacity: 1;
		pointer-events: auto;
		overflow-y: scroll;
		transform:translateY(100px);
		opacity: 0;
		display: none;
	}
	.apc.on .apc-block {
		display: block;
	}
	.apc-block.on {
		transform:translateY(0);
		opacity: 1;
	}
	.apc-page:before {
		content: "";
		width: 100%;
		height: 100%;
		background: #fff;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 10;
		-webkit-transition: transform 0.8s cubic-bezier(0.180, 1.000, 0.220, 1.000);
		-moz-transition: transform 0.8s cubic-bezier(0.180, 1.000, 0.220, 1.000);
		transition: transform 0.8s cubic-bezier(0.180, 1.000, 0.220, 1.000);
		-webkit-transform: scaleX(0);
		transform: scaleX(0);
		-webkit-transform-origin: right top;
		transform-origin: right top;
	}
	 .apc-page.over:before {
		-webkit-transform: scaleX(1);
		transform: scaleX(1);
		-webkit-transform-origin: left top;
		transform-origin: left top;
	}
	.apc-page #ajax-container {
		-webkit-transform: translate3d(-30%,0,0);
		transform: translate3d(-30%,0,0);
	}
	.apc .intro-content .container {
		padding-left:40px;
		padding-right:40px;
	}

	.apc-page.move-container #ajax-container {
		-webkit-transform: translate3d( 70%,0,0);
		transform: translate3d(70%,0,0);
		opacity: 0;
	}
	.apc-page.start #ajax-container {
		opacity: 0;
	}
	.apc-page.on #ajax-container {
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
	}
	.apc-page.no-trans #ajax-container {
		-webkit-transition: none;
  		transition: none;
	}
	.apc-page #ajax-container {
		-webkit-transition: all 2490ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
  		transition: all 2490ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
	}

		.apc-close-layer {
			overflow: visible;
			pointer-events: auto;

		}
		.apc-close-layer:after {
			bottom: -1000%;
		    content: '';
		    left: 0;
		    position: fixed;
		    top: -200%;
		    width: 100%;
		    z-index: 1;
		}
		.apc-close-layer:hover {
			cursor: url(../images/icon-cursor-close.svg) 25 25, move;
		}
		.apc-container {
			padding-bottom: 100px;
		    padding-top: 7%;
		    pointer-events: auto;
		    position: relative;
		    text-align: left;
		    visibility: visible;
		    z-index: 1;
		}
			.apc-page {
			    background: #fff;
			    margin: auto;
			    min-height: 100vh;
			    position: relative;
			    z-index: 2;
			    max-width: 1435px;
			    width: 90%;
			    overflow: hidden;
			}
			.apc-nav {
				position:absolute;
				top:20px;
				left:20px;
				right:20px;
				z-index:2;
				color:#fff;
			}
				.apc-nav a {
					color:#fff;
					display:inline-block;
				}
				.apc-close {
					float:right;
					position: relative;
					width: 40px;
					height: 40px;
					text-align: center;
					vertical-align: middle;
					font-size:28px;
					z-index:2;
					border-radius:100%;
					border:1px solid #fff;
				}
					.apc-close span {
						line-height:40px;
						color:#fff;
					}

			.apc-next {
				margin-left:10px;
			}
			.apc-prev {}


.apc-nav.dark-nav .arrow-nav.right span:before,
.apc-nav.dark-nav .arrow-nav.left span:after {
	 background-color:#222;
}
.apc-nav.dark-nav .apc-close,
.apc-nav.dark-nav .arrow-nav {
	border-color:#222;
}
.apc-nav.dark-nav .apc-close span,
.apc-nav.dark-nav .arrow-nav .icon {
	color:#222
}

/* Extended block */
.apc .extended-block {
	margin-left: -40px;
	max-width: 10000px;
	width: -webkit-calc(100% + 80px);
	width: calc(100% + 80px);
	overflow: hidden;
}


/* ==================================================
  10. Sections
================================================== */
.section {
	overflow: hidden;
	width: 100%;
}
	
	/* Section content */
	.section-content {
		padding: 80px 0 120px;
		font-size: 18px;
	}

	/* Section header */
	.section-header {
		padding: 160px 0;
		width: 100%;
		position: relative;
	}
	.parallax {
		background-attachment: fixed;
		background-position: 50% 0;
		background-color: #0a0a0a;
	}


	/* Section content */

	/* Header */
	.content-header {
		text-align: center;
		margin-bottom: 40px;
		position: relative;
	}
		.content-header.floating {
			position: absolute;
			top:50%;
			left:50%;
			transform:translate(-50%, -50%);
			width: 100%;
			max-width: 600px;
			z-index: 3;
			margin-bottom: 0;
		}
		.content-header.floating .content-title,
		.content-header.floating .content-subtitle,
		.content-header.floating .back-layer {
			color:#fff;
		}
		.content-header.text-left {
			text-align:left
		}
		.content-header.floating h2 {
			margin-bottom:0;
		}
		.content-title a { color: #eee; }
		.content-title a:hover { color: #ff7700; }
		.content-line {
			width: 100%;
			height: 8px;
			background-color: #444;
		}
		


/* ==================================================
  11. Intro / Hero Section
================================================== */

 .intro {}

 	/* Intro Fullscreen
	 -------------------------------- */
	.intro.intro-fullscreen {
		width: 100%;
		height:100vh;
		background-size: cover;
		overflow: hidden;
		position: relative;
	}
	
	/* Intro empty
	 -------------------------------- */
	.intro-empty {
		min-height: 100px;
	}

	/* Intro Content
	 -------------------------------- */
	.intro-content {
		min-height: 50vh;
		overflow:hidden;
		position: relative;
		z-index: 0;
		background: #000;
	}
		.intro-content .container {
			z-index:3
		}
	

	/* Intro Image
	 -------------------------------- */
	.intro .intro-image {
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
		z-index: 2;
		background-position: center;
		background-size: cover;
	}
		.intro-image-block {
			overflow:hidden;
			position:absolute;
			left:0;
			top:0;
			right:0;
			bottom:0;
			z-index:-1;
		}

		.intro-image-block.size-cover img {
			position: absolute;
			left:-10000%;
			right: -10000%;
			top: -10000%;
			bottom: -10000%;
			margin: auto auto;
			min-width: 1000%;
			min-height: 1000%;
			width: 100%;
			-webkit-transform:scale(0.1);
			transform: scale(0.1);
			/*object-fit: cover;*/
		}


	/* Scroll to discover
	 -------------------------------- */
	.scroll-discover {
	    color: #fff;
	    position: absolute;
	    bottom: 60px;
	    line-height: normal;
	    z-index: 3;
	    font-size: 10px;
	    text-transform: uppercase;
	    transform: rotate(-90deg);
	    transform-origin: 0% 50%;
	    font-weight: 400;
	    z-index: 3;
	    left: 40px;
	}
	.scroll-discover span {
	    margin-right: 10px;
	    font-size: 22px;
	    line-height: normal;
	    position: relative;
	    top: 6px
	}

	
	/* Intro Images
	 -------------------------------- */
	.intro-01 .intro-image {
		background-image: url(../images/intro-image-01.jpg);
	}


/* ==================================================
   12. Recent Releases
================================================== */
.recent-releases {
	background: transparent url(../images/bg01.jpg) top center no-repeat;
	position: relative;
	background-size:cover;
	z-index: 1;
}


/* ==================================================
  13. Event Countdown 
================================================== */
.event-countdown {
	padding: 80px 0;
	position:relative;
	z-index:1;
	background-color: #1e1e1e;
	background-size:cover;
	background-image:url(../images/countdown-bg.jpg);
}
	.countdown {
		text-align: center;
		margin-top: 0;
		z-index:2;
		position:relative;
		overflow: hidden;
		margin-bottom: 40px;
		margin-top: -20px;
	}
	.countdown .unit-block {
		display:inline-block;
		position:relative;
		text-align:center;
	}
		.countdown .unit-block span {
			position:absolute;
			top:20px;
			left:0px;
			letter-spacing:0.1em;
			color:#fff;
			font-size:14px;
			width:100%;
			opacity:0.5
		}
			.countdown .unit {
				position: relative;
				display: inline-block;
				font-size: 205px;
				padding:0;
				height: 270px;
				margin:0 20px;
				line-height: normal;
				font-weight: bold;
				font-family: 'Barlow Condensed', sans-serif;
				vertical-align:top;
				background-size:cover;
				background-image:url(../images/countdown-unit-bg.jpg);
			}
			.countdown .unit {
				-webkit-background-clip: inherit;
				-webkit-text-fill-color: #fff;
				background-color: transparent;
				color: #fff;
				background-image: none;
				opacity: 0.6;
			}

			.countdown .days {
				background-position: 20px 20px;
			}
			.countdown .days:before {
				background-position: 30px 0px;
			}
			.countdown .hours {
				background-position: 0px 0px;
			}
			.countdown .minutes{
				background-position: right center;
			}
			.countdown .seconds {
				min-width:210px;
				background-position: 300px 10px;
			}
		h6.upcoming-event {
			font-size: 24px;
			color: #f70;
			text-transform: uppercase;
			position: relative;
			margin-bottom: 0;
			line-height: normal;
		}
		.page-container .event-countdown {
			margin-top: 0px;
			margin-bottom: 80px;
		}


/* ==================================================
  14. Music Grid
================================================== */
#music {}

	/* Header */
	.music-header {
		padding-bottom:40px;
	}

		/* Filter
	 	 --------------------------------*/
	 	.filter {
	 		margin-top: 0px;
	 		padding: 0 30px;
	 		position: relative;
	 		width: 100%;
	 	}
		 	.filter ul {
				list-style: none;
				text-align: center;
				padding-bottom: 20px;
				padding:0;
		 	}
		 		.filter ul li {
					margin: 0;
					padding: 0;
					display: inline-block;
				}
				.filter li a {
					color: #666;
					text-transform:uppercase;
					font-size: 13px;
					display: block;
					padding: 6px 14px 6px;
					position: relative;
					text-align: center;
					cursor: pointer;
					letter-spacing:0.07em;
					position:relative;
				}
				.filter li a:before {
					background-color: #222;
					z-index:-1;
				}
				.filter li a:after {
					z-index:-1;
					background-color:#222;
				}
		.filter li a.is-active {
			color: #fff;
		}

	
	/* Music Items
	 -------------------------------- */
	.items {}

		.full-width.items { 
			margin: 40px 40px 40px 0; 
		}
		.item {
			display: block;
			float: left;
			overflow: hidden;
			position: relative;
			backface-visibility: hidden;
		}	
			.item .desc-layer {
				position:absolute;
				left:10px;
				right:10px;
				bottom:10px;
			}
			.item h2 {
				color:#fff;
				font-size:24px;
				margin-top:10px;
				margin-bottom:0;
				letter-spacing:0.01em;
				margin-bottom:0;
			}
			.item h3 {
				color:#fff;
				font-size:14px;
				margin-bottom:0;
				letter-spacing:0.1em;
				margin-bottom:0;
				opacity:0.4;
				font-family:"PT Sans", sans-serif;
			}
		.full-width .item { 
			width: 20%;
		}
		.full-width .item { 
			margin: 0px -1px 0px 0px;
		}
		.container .item { 
			width: 25%; 
		}
			.full-width .item .project-thumb {
				margin: 0px 0px 40px 40px;
			}


/* ==================================================
  15. Events 
================================================== */
#events {
	background: transparent url( ../images/events-bg.jpg) center top no-repeat;
	background-size:cover;
	height:100vh;
	position:relative;
}
#events:before,
#events:after {
	content: '';
	position: absolute;
	width: 100%;
	left: 0;
	z-index: 2;
	pointer-events: none;
}
#events:before {
	top: 0;
	height: 240px;
	background: linear-gradient(to bottom, black 0%, transparent 100%); 
}
#events:after {
	bottom: 0;
	height: 170px;
	background: linear-gradient(to bottom, transparent 0%, black 100%); 
}


/* Events header
 -------------------------------- */
.events-header {
	position: absolute;
	top:60px;
	left:0;
	width: 100%;
	z-index:3
}


/* Events Scroll
 -------------------------------- */
#events-scroll {
	overflow: auto;
	height: 100vh;
}
body .scrollbar-track {
    background: rgba(63, 63, 63, 0.5);
}
body .scrollbar-thumb {
	background: rgba(255, 255, 255, 0.15);
}


/* Events list
 -------------------------------- */
.events-container {
	padding:200px 0 100px;
}
.events-list {
	padding: 0;
	margin: 0;
	list-style: none;
}
.events-list li {
	width: 100%;
	color: white;
	min-height: 80px;
	padding: 24px 33px;
	margin: 0 0 6px;
	position: relative;
	-ms-flex-pack: justify;
	justify-content: space-between;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: row;
	flex-direction: row;
	background: rgba(0, 0, 0, 0.7 );
	transition: background 0.2s cubic-bezier( 0.22, 0.63, 0.4, 1 );
}
.events-list li:hover {
	background: #f60;
}
.events-list li b,
.events-list li strong {
	font-weight: normal;
}
.left-event-block,
.right-event-block {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: row;
	flex-direction: row;
	-ms-flex-pack: justify;
	justify-content: space-between;
	align-items: center;
}
.left-event-block {
	width: 550px;
	font-family: 'Barlow Condensed', sans-serif;
}
.right-event-block {
	width: 230px;
	-ms-flex-direction: row-reverse;
	flex-direction: row-reverse;
}
.left-event-wrap p {
	width: auto;
	display: inline;
}
.date-event {
	width: auto;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: row;
	flex-direction: row;
	-ms-flex-pack: start;
	justify-content: flex-start;
	padding-right: 10px;
	min-width: 150px;
}
.day-event {
	font-size: 40px;
	line-height: 40px;
	text-transform: uppercase;
	white-space: nowrap;
	letter-spacing: .12em;
	margin-right: 7px;
}
.month-year-event {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-align: start;
	align-items: flex-start;
	padding-top: 3px;
}
.month-event {
	font-size: 17px;
	line-height: 17px;
}
.year-event {
	font-size: 15px;
	line-height: 15px;
}
.month-event,
.year-event {
	text-transform: uppercase;
	letter-spacing: 0.2em;
}
.events-list .line-link {
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: .1em;
	margin-right: -.1em;
	position: relative;
}
.location-event {
	display: -ms-flexbox;
	display: flex;
	width: 350px;
	-ms-flex-direction: column;
	flex-direction: column;
	-ms-flex-align: start;
	align-items: flex-start;
	text-transform: uppercase;
	overflow: hidden;
}
.event-name {
	width: 100%;
	white-space: inherit;
	overflow: inherit;
	margin-right: -.32em;
	letter-spacing: .1em;
	text-overflow: ellipsis;
	font-size: 22px;
	line-height: 110%;
	margin-bottom: 2px;
}
.city-name {
	width: 100%;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	font-size: 13px;
	color: rgba(255, 255, 255, 0.47);
	letter-spacing: .15em;
	margin-right: -.15em;
	transition: color 0.2s cubic-bezier(0.22, 0.61, 0.36, 1);
}


/* ==================================================
  16. Biography 
================================================== */
#bio {
	width: 100%;
	background-size:cover;
	background-image: url(../images/bg01.jpg);
}
	.bio-text-block {
		text-align:center;
		padding-bottom: 80px;
	}
	.container.full-width.stats-bg-block {
		background-size:cover;
		background-image: url(../images/bg01.jpg);
		padding-left:10%;
		padding-right: 10%;
	}
	.bio-bg-block {
		background: transparent url(../images/bio-bg.jpg) top center no-repeat;
		background-size: cover;
		text-align:center;
		padding-top:40px;
		position: relative;
	}
	.bio-bg-block .click-layer {
		position: absolute;
		left: 0;
		right:0;
		top:0;
		bottom:0;
		display:inline-block;
		text-align:center;
		z-index: 2;
	}
	.bio-bg-block img {
		margin-bottom:0;
		vertical-align:middle;
		display:inline-block;
		position:relative;
		bottom:-50px;
	}


/* ==================================================
  17. Contact 
================================================== */
#contact {}
	
	/* Google Map
	 -------------------------------- */
	#contact-map {
		background-color: #0d0d0d;
		height: 500px;
		position: relative;
		width: 100%;
	}
	#contact-map:before, #contact-map:after {
		-webkit-box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.2);
		-moz-box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.2);
		box-shadow: 0 0 5px 2px rgba(0, 0, 0, 0.2);
		content: '';
		left: 0;
		position: absolute;
		top: 0;
		width: 100%;
		z-index: 10;
	}


	/* Details
	 -------------------------------- */
	 .contact-link,
	 .contact-info {
	 	display:block;
	 }
	.contact-link {
		font-size: 38px;
		letter-spacing: 0.1em;
		font-weight: 300;
		color: #222;
		text-transform:uppercase;
		line-height:normal;
	}
	.contact-link:hover {
		color:#f70
	}
	.contact-email {
		font-size:22px;
		text-transform:none;
		color:#f70;
	}
	.contact-info {
		opacity:0.5;
		text-transform:uppercase;
		font-size:15px;
		letter-spacing:0.1em;
	}
	.col-contact-details p {
		padding: 0 20% 0;
	}
	.col-contact-details p:first-child {
		padding-top:50px;
	}


/* ==================================================
  18. Newsletter 
================================================== */
#newsletter {
	position: relative;
	overflow: hidden;
	text-align: center;
	background: transparent url(../images/newsletter-bg.jpg) center center no-repeat;
	background-size: cover;
	width: 100%;
	padding:50px 0;
}

	/* Form */
	#subscribe-form {
		overflow: hidden;
		margin-top: 0px;
	}
		#subscribe-form input {
			display: inline-block;
		}
		#subscribe-email {
			min-width: 380px;
			font-size: 24px;
			color: #222;
			background-color: #fff;
			background-color: rgb(255, 119, 0);
			border:0;
			padding-left:20px;
		}
		#subscribe-email:focus {
			background-color:#fff;
			color:#222
		}
		#subscribe-email::-webkit-input-placeholder { color: #fff; }
		#subscribe-email:-moz-placeholder { color: #fff; }
		#subscribe-email:-ms-input-placeholder { color: #fff; }
		#subscribe-submit {
			width: 60px;
			height: 60px;
			font-size: 48px;
			text-align: center;
			line-height: 60px;
			padding: 0;
			margin: 0;
			font-weight: normal;
			background-color:#fff;
			color:#333
		}
		#subscribe-submit:hover {
			background-color:#f70;
			color:#fff;
		}
			

/* ==================================================
  19. Single Page/Project 
================================================== */
.page-content {
	height: auto;
	margin-top: 0;
	overflow: initial;
	padding: 80px 40px 100px;
	position: relative;
}
.page-bg {
	width: 100%;
	background-size:cover;
	background-image: url(../images/bg01.jpg);
}

/* Cover */
.cover-holder.pull-up {
	max-width:400px;
	margin:0 auto;
	margin-top:-300px;
	margin-bottom: 40px;
}

/* Page text */
.page-text {
	font-size: 18px
}


/* ==================================================
  20. Single Event 
================================================== */

/* Event meta */
.event-meta {
	margin-bottom:40px;
}
.event-meta h3 {
	text-transform:none;
	margin-top:-40px;
	margin-bottom: 10px;
}
	.event-meta span {
		display:block;
	}
	.event-meta .event-share {
		
	}

/* Tickets Block */
.tickets-block {
	text-align:center;
	margin-top: -120px;
	padding-bottom:100px;
}
	.tickets-note {
		font-size: 15px;
		display:block;
		margin-top:10px;
		color: rgba(255, 255, 255, 0.4);
	}

/* Big event date */
.event-intro-date {
	height: 50vh;
}
.big-event-date {
	position: absolute;
	bottom: -60px;
	left: 0;
	z-index: 3;
	font-size: 300px;
	line-height:100%;
	color: #fff;
	font-weight:900;
}
.big-event-date span {
	display:inline-block;
}
.big-event-date .event-day {

}
.big-event-date .event-day:after {
	content:"/"
}


/* ==================================================
  21. 404 Error Page
================================================== */

.page-404 {
	width: 100%;
	background-size:cover;
	background-image: url(../images/404.jpg);
	min-height: 100vh;
}
.error-title {
	font-size: 420px;
	font-weight: bold;
	text-align: center;
	color: #ff7700;
	padding-bottom: 0px;
	margin-bottom: 0;
	position: relative;
	font-weight: 800;
	line-height:100%;
}
	.error-title span {
		display:inline-block
	}
	.error-subtitle {
		color:#fff;
		text-align: center;
		margin-top: -100px;
		max-width: 500px;
		margin-left: auto;
		margin-right: auto;
		margin:50px auto 100px
	}


/* ==================================================
  22. Audio Elements
================================================== */


/* Waveform
 -------------------------------- */
.track-waveform {
	width:100%;
	margin-bottom:50px;
	position:relative;
	overflow: hidden;
	min-height:10px;
}
	.track-waveform .sp-content-progress {
		display:block;
		height:auto;
		position:absolute;
		left:0;
		right:0;
		top:0;
		bottom:0;
		background-color:transparent;
		margin:0;
	}
	.track-waveform .sp-content-progress .sp-content-position {
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		z-index: 2;
		opacity: 1;
		background-color: rgba(0,0,0,0.2);
	}
	.track-waveform .sp-content-progress .sp-content-position:before {
		content:'';
		position:absolute;
		right:0;
		height:100%;
		width:1px;
		background-color:#fff;
	}
	.waveform {
		width: 100%;
    	height: 200px;
    	min-height:50px;

	}


/* Track details list 1
 -------------------------------- */
.track-details-1 {
	width: 100%;
	padding: 0;
	content: '';
	display: table;
	clear: both;
	margin: 0 0 60px 0;
	font-size: 15px;
	list-style:none;
}
	.track-details-1.pull-up {
		margin-top:-40px;
	}

	.track-details-1 li {
		width: 16.667%;
	    padding: 0 10px;
	    margin:0;
	    float:left;
	    border-left: 1px solid #ddd;
	}
	.track-details-1 li:first-child {
		border-left:0;
		padding-left:0;
	}
		.track-details-1 li .label {
			margin-right: 3px;
		    text-transform: uppercase;
		    color: #8c8c8c;
		    display:block;
		}
		.track-details-1 li .value {
			font-weight: 600;
			color: #222;
		}
		.track-details-1 li .value a {
			color:#222;
			display:inline-block;
			margin-right: 8px;
		}
		.track-details-1 li .value a:hover {
			text-decoration:underline
		}
		.track-details-1 li .value a.share-btn {
			background-color:#333;
			padding:6px;
			line-height:0;
			border-radius:4px;
			font-size:14px;
			margin-bottom: 6px;
		}
		.track-details-1 li .value a.share-btn span {
			color:#fff;
		}
		.track-details-1 li .value a.share-btn:hover {
			background-color:#f60;
			text-decoration:none
		}
		.track-details-1 li .value a.buy-btn {
			background-color:#f60;
			padding:6px;
			line-height:0;
			border-radius:4px;
			font-size:14px;
			margin-bottom: 6px;
			color:#fff;
		}
		.track-details-1 li .value a.buy-btn span {
			color:#fff;
		}
		.track-details-1 li .value a.buy-btn:hover {
			background-color:#333;
			text-decoration:none
		}
		

/* Track details list 2
 -------------------------------- */
.track-details-2 {
    list-style: none;
    margin: 0;
    padding: 0;
}
.track-details-2 li {
    margin: 0;
    margin-bottom: 12px;
    padding-bottom: 12px;
    overflow: hidden;
    position: relative;
    overflow: hidden;
    overflow: hidden;
    color: #aaa;
    line-height:130%;
    border-bottom: 1px solid #ddd;
}
.track-details-2 li, .track-details-2 li span {
    -webkit-transition: color .2s ease-out;
    -moz-transition: color .2s ease-out;
    -ms-transition: color .2s ease-out;
    -o-transition: color .2s ease-out;
    transition: color .2s ease-out;
}
.track-details-2 li:last-child {
    border-bottom: 0;
}
.track-details-2 li span {
    display: inline-block;
    margin-right: 20px;
    min-width:100px;
    color: #666;
    font-weight: 400;
    margin-bottom: 5px;
    text-transform: uppercase;
}
.track-details-2 li:hover,
.track-details-2 li:hover span {
    color:#222;
}
.track-details-2 li a {}
.track-details-2 li a:hover {}


/* Track meta data
 -------------------------------- */
.track-meta-label {
	font-size: 18px;
	color: rgba(255, 255, 255, 0.48);
	margin-bottom: 0px;
	line-height: 1.1;
}
.intro-content .track-meta-top {
	margin-top:200px;
}
.track-meta-top {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: center;
	-moz-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-direction: normal;
	-moz-box-direction: normal;
	-webkit-box-orient: horizontal;
	-moz-box-orient: horizontal;
	-webkit-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-webkit-box-flex: 1 1 400px;
	-moz-box-flex: 1 1 400px;
	-webkit-flex: 1 1 400px;
	-ms-flex: 1 1 400px;
	flex: 1 1 400px;
	margin-bottom: 20px;
}
.track-meta-type {
	-webkit-box-flex: 0 1 100%;
	-moz-box-flex: 0 1 100%;
	-webkit-flex: 0 1 100%;
	-ms-flex: 0 1 100%;
	flex: 0 1 100%
}
.track-meta-title {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}
.track-meta-title h1 {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: center;
	-moz-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	line-height: 1.1;
	margin: 5px 25px 5px 0;
	color:#fff;
}
.track-meta-title h2 {
	line-height: 1.1;
	margin: 0 25px 0 0
}
.track-meta-title .remixed {
	color: rgba(255, 255, 255, 0.55)
}
.track-meta-title .track-meta-title-sub-genre-name {
	color: #94d500;
	margin-left: 25px;
	font-size: .75em
}
.track-meta-actions {
	display: -webkit-box;
	display: -moz-box;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;
	-webkit-box-align: center;
	-moz-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap
}
.track-meta-actions .play-track {
	position: relative;
	z-index: 2;
	display: inline-block;
	content: "";
	width: 40px;
	height: 40px;
	line-height:46px;
	text-align:center;
	background-color: rgba(255, 255, 255, 0.2);
	-webkit-border-radius: 50% 50%;
	border-radius: 100%;
	vertical-align:middle;
	-webkit-transition: all 800ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
	transition: all 800ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
}
.track-meta-actions .play-track:hover {
	background-color: #f70;
}
	.track-meta-actions .play-track span {
		color: #fff;
		left:2px;
		position:relative;
		font-size:24px;
	}
	.track-meta-actions .play-track.sp-play span {
		left:0;
		top:0px;
		font-size:20px;
	}
	.track-meta-actions .play-track.sp-play span:before {
		content: "\e646";
	}
.track-meta-artists {
	width: 100%;
	margin-bottom: 30px;
}
	.track-meta-artists span,
	.track-meta-artists a {
		color:#fff;
		display:inline-block;
		margin-left:10px;
	}
.cover-holder {
	margin-bottom:30px;
}


/* Tracklist Grid .sp (scamp-player)
 -------------------------------- */
.sp-tracklist-grid {
    overflow:hidden;
    list-style: none;
    margin: 0 0 40px 0;
    padding: 0;
}	
	.sp-tracklist-grid-4 .track-col {
		width: 25%;
		margin: 0;
	}
	.sp-tracklist-grid-3 .track-col {
		width: 33.333%;
	}
	.sp-tracklist-grid-2 .track-col {
		width: 50%;
	}
	.sp-tracklist-grid .track-col,
	.sp-tracklist-grid .track-col a  {
	    float: left;
	    margin:0;
	    background:#000;
	}
	.sp-tracklist-grid.gap .track-col a {
	    margin: 2px;
	}
	.sp-tracklist-grid .track-col img {
		opacity:0.5;
	}
	.sp-tracklist-grid .track-col a:hover img {
	    opacity:1;
	}

	/* Desc layer*/
	.desc-layer {
		position: absolute;
		left: 10px;
		right:10px;
		bottom: 10px;
	}
	.desc-layer span {
		display:block;
		color:#fff;
		line-height:120%;
		text-transform:uppercase;
	}
	.desc-layer .track-title {
		font-size:20px;
		font-weight:500;
		font-family: 'Barlow Condensed', sans-serif;
	}
	.desc-layer .track-artists {
		font-size:12px;
		opacity:0.7;
		margin-left: 25px;
	}
	
	/* Status */
	.sp-tracklist-grid .status-icon {
	    font-family: 'Scamp-Player';
	    display:inline-block;
	    height: 16px;
	    margin-right:5px;
	    min-width:20px;
	    line-height: normal;
	    font-size: 18px;
	    padding-top: 0px;
	    font-style:normal;
	    text-align:left;
	    position:relative;
	}
	.sp-tracklist-grid .status-icon:before {
    	content: "\e612";
    }
    .sp-tracklist-grid a.sp-play .status-icon:before {
    	content: "\e903";
    }
    .sp-tracklist-grid a.sp-pause .status-icon:before {
    	content: "\e612";
    }
    .sp-tracklist-grid a.sp-loading .status-icon:before {
    	content: "\e620";
		position:absolute;
		-webkit-animation: track-spinner 400ms linear infinite;
		animation: track-spinner 400ms linear infinite;
    }
	

/* Tracklist .sp (scamp-player)
 -------------------------------- */
.sp-tracklist {
    list-style: none;
    padding:0;
    counter-reset: item;
    margin-bottom: 40px;
    position: relative;
    z-index: 2;
}
.sp-tracklist li {
    width: 100%;
    font-size:17px;
    text-transform:uppercase;
    padding-left:0;
    margin:0;
    margin-bottom: 0px;
    min-height: 25px;
    padding:8px;
    border-bottom:1px solid #ddd;
}
.sp-tracklist li:first-child {
	border-top: 1px solid #ddd;
}
.sp-tracklist li .track-col {
    display: table-cell;
    text-align: left;
    vertical-align:top;
    min-height:30px;   
}
.sp-tracklist li .track-row-data {
    display: table;
    width:100%;
}
.sp-tracklist li .track-col.track .track-status {
    min-width: 20px;
    margin-right: 10px;
    display: inline-block;
    color:#222;
    position: absolute;
    left: 0;
}
    .sp-tracklist li .track-col.track .track-status .status-icon {
        font-family: 'Scamp-Player';
        display:none;
        height: 16px;
        line-height: normal;
        font-size: 18px;
        padding-top: 0px;
    }
    .sp-tracklist li .track-col.track:hover .track-status .status-icon,
    .sp-tracklist li .track-col.track.sp-play .track-status .status-icon,
    .sp-tracklist li .track-col.track.sp-pause .track-status .status-icon,
    .sp-tracklist li .track-col.track.sp-loading .track-status .status-icon
     {
        display: block;
    }

    .sp-tracklist li .track-col.track:hover .track-status .nr,
    .sp-tracklist li .track-col.track.sp-play .track-status .nr,
    .sp-tracklist li .track-col.track.sp-pause .track-status .nr,
    .sp-tracklist li .track-col.track.sp-loading .track-status .nr {
        display: none;
    }
        .sp-tracklist li .track-col.track .track-status .status-icon:before {}
        .sp-tracklist li .track-col.track:hover .track-status .status-icon:before {
            content: "\e612";
        }
        .sp-tracklist li .track-col.track.sp-play .track-status .status-icon:before {
            content: "\e903";
            color:#f70;
        }
        .sp-tracklist li .track-col.track.sp-pause .track-status .status-icon:before {
            content: "\e612";
             color:#f70;
        }
        .sp-tracklist li .track-col.track.sp-loading .track-status .status-icon:before {
            content: "\e620";
            position:absolute;
            -webkit-animation: track-spinner 400ms linear infinite;
            animation: track-spinner 400ms linear infinite;
        }
    .sp-tracklist li .track-col.track .track-status .nr {
        display:block;
        width:18px;
        line-height: normal;
        counter-increment: item;
    }
    .sp-tracklist li .track-col.track .track-status .nr:before {
    	content: counter(item);
    }
    .sp-tracklist li .track-col.track:hover .track-status .nr {
        display: none;
    }
@-webkit-keyframes track-spinner {
  0%   { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(-360deg); }
}
@keyframes track-spinner {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(-360deg); }
}
.sp-tracklist li .track-col.track {
    width: 70%;
    position: relative;
    line-height: normal;
}   
    .sp-tracklist li a.track .track-title {
        color: #222;
        font-size: 17px;
        line-height: normal;
        display: inline-block;
        padding-left: 30px;
        letter-spacing:0.05em;
        font-weight: 500;
        font-family: 'Barlow Condensed', sans-serif; 
    }
    .sp-tracklist li a.track.sp-play .track-title,
    .sp-tracklist li a.track.sp-pause .track-title,
    .sp-tracklist li a.track.sp-loading .track-title {
        font-weight: 600;
        color:#f60;
    }
    .sp-tracklist li a.track .track-artists {
        color:#999;
        padding-left: 30px;
        display:block;
        font-size:13px;
        letter-spacing:0.1em;
    }
.sp-tracklist li .track-col-lyrics {
    text-align:right;
    width: 20%;
    min-height: 30px;
    line-height: normal;
    min-width: 120px;
}
    .sp-tracklist li .track-col-lyrics .track-lyrics {
        display:inline-block;
        margin-right:15px;
        cursor: pointer;
        color:#666;
    	letter-spacing:0.05em;
    	border: 1px solid #666;
    	padding:2px 4px;
    	font-size:13px;
    }
    .sp-tracklist li .track-col-lyrics .track-lyrics:hover,
    .sp-tracklist li .track-col-lyrics .track-lyrics.is-active {
    	border: 1px solid #f70;
    	color:#f70
    }
   
    .sp-tracklist li .track-col-lyrics .track-length {
    	font-size:14px;
        display:inline-block;
    }
        .sp-tracklist li .track-col-lyrics .track-length:before {
            content:"(";
        }
        .sp-tracklist li .track-col-lyrics .track-length:after {
            content:")";
        }
.sp-tracklist li .track-col-buttons {
    text-align:right;
    padding-left:10px;
    min-width: 100px;
    width: 20%;
    line-height: normal;
    min-height: 30px;
}
    .track-col-buttons .track-button {
        font-size:13px;
        color:#fff;
        background-color:#222;
        padding:3px 7px;
        line-height:normal;
        text-align:center;
        min-width:78px;
        position:relative;
        overflow:hidden;
        display:inline-block;
    }
        .track-col-buttons .track-button span {
            z-index:2;
            position:relative;
            color:#fff;
            display:inline-block;
            font-weight:500;
        }
        .track-col-buttons .track-button:hover {
            color:#fff;
             background-color:#ff7700;
        }

    /* Progress */
    .sp-tracklist li .sp-content-control {
        width:100%;
        overflow:hidden;
        max-height:0;
        transition: all 0.85s cubic-bezier(0.77, 0, 0.175, 1);
    }
    .sp-tracklist li .sp-content-control.sp-is-active {
        max-height:80px
    }
    .sp-content-progress {
        display:block;
        width: 100%;
        min-width:100%;
        margin:20px 0;
        height:10px;
        position:relative;
        cursor:e-resize;
        background-color:#ccc;
    }
    .sp-content-progress .sp-content-loading,
    .sp-content-progress .sp-content-position {
        position:absolute;
        left:0;
        right:0;
        top:0;
        bottom:0;
        z-index:1;
        opacity:0.2;
        background-size: 100% 100%; 
        background-repeat:no-repeat;
        background-position:left center;
    }
    .sp-content-progress .sp-content-position {
        opacity:1;
        width: 0%;
        overflow:hidden;
    }
    .sp-content-progress .sp-content-loading {
        opacity:0.2;
        width: 0%;
        overflow:hidden;
    }
    .sp-content-progress .sp-content-position span,
    .sp-content-progress .sp-content-loading span {
        z-index:2;
        opacity:1;
        width:0;
    }
    .sp-tracklist li .sp-content-control.sp-is-active  {
        max-height:50px
    }
    .sp-content-progress .sp-content-loading,
    .sp-content-progress .sp-content-position {
        background: #666;
    }
    .sp-content-progress .sp-content-position {
    	background-color: #f70;
    	transition: all 0.2s ease;
    }

    /* Lyrics */
    .track-row-lyrics {
        display:none;
        width:100%;
    }
    .track-row-lyrics.is-active {
        display:table;

    }
    .track-lyrics-text {
        text-transform:none;
        text-align:center;
        max-width:500px;
        margin:0 auto;
        font-size:15px;
        line-height:160%;
        padding:40px 20px;
    }
    .track-lyrics-text h5 {
		display:block;
		text-align:center;
		text-transform:uppercase;
		font-size: 28px;
	}


/* ==================================================
   23. Gallery/Media
================================================== */


/* Gallery Grid
 -------------------------------- */
.gallery-grid {}
.gallery-grid-item {
	padding: 0 10px 20px;
}


/* Gallery Mosaic
 -------------------------------- */

/* Images URL */
.gallery-mosaic .image-src-1 {
	background-image: url( ../images/gallery-mosaic-01.jpg );
}
.gallery-mosaic .image-src-2 {
	background-image: url( ../images/gallery-mosaic-02.jpg );
}
.gallery-mosaic .image-src-3 {
	background-image: url( ../images/gallery-mosaic-03.jpg );
}
.gallery-mosaic .image-src-4 {
	background-image: url( ../images/gallery-mosaic-04.jpg );
}
.gallery-mosaic .image-src-5 {
	background-image: url( ../images/gallery-mosaic-05.jpg );
}
.gallery-mosaic .image-src-6 {
	background-image: url( ../images/gallery-mosaic-06.jpg );
}
.gallery-mosaic .image-src-7 {
	background-image: url( ../images/gallery-mosaic-07.jpg );
}
.gallery-mosaic .image-src-8 {
	background-image: url( ../images/gallery-mosaic-08.jpg );
}

/* Containers */
.gallery-mosaic .gallery-row {
    overflow: hidden;
    clear: both;
    position: relative
}
.gallery-mosaic .gallery-row {
    margin-bottom: 20px;
}
.gallery-mosaic .gallery-row .gallery-item {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-color: #333;
    position: relative;
    overflow: hidden
}
.gallery-mosaic .gallery-row .gallery-item a.permalink {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: 0 0
}
.gallery-mosaic .gallery-row .gallery-item .permalink {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: 0 0;
    z-index: 2;
}
.gallery-mosaic .gallery-row .gallery-item:hover a {
	background-color:rgba(0,0,0,0.8)
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-main {
    float: left;
    clear: none;
    text-align: inherit;
    width: 59.2%;
    margin-left: 0;
    margin-right: 2%;
    height: 460px;
    position: relative;
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-main .gallery-image {
	width: 100%;
	height: 460px;
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-main::after {
    content: "";
    display: table;
    clear: both
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-main:last-child {
    margin-right: 0
}
@media (max-width:600px) {
    .gallery-mosaic .gallery-row .gallery-item.gallery-item-main {
        display: block;
        clear: both;
        float: none;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 20px
    }
    .gallery-mosaic .gallery-row .gallery-item.gallery-item-main:first-child {
        margin-left: auto
    }
    .gallery-mosaic .gallery-row .gallery-item.gallery-item-main:last-child {
        margin-right: auto
    }
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-two {
    height: 220px;
    margin-bottom: 20px
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-two:last-child {
    margin-bottom: 0
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-narrow {
    float: left;
    clear: none;
    text-align: inherit;
    width: 38.8%;
    margin-left: 0;
    margin-right: 2%;
    background-color: #aeb1b6;
    height: 460px
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-narrow::after {
    content: "";
    display: table;
    clear: both
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-narrow:nth-child(n) {
    margin-right: 2%;
    float: left;
    clear: none
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-narrow:nth-child(2n) {
    margin-right: 0;
    float: right
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-narrow:nth-child(2n+1) {
    clear: both
}
@media (max-width:600px) {
    .gallery-mosaic .gallery-row .gallery-item.gallery-item-narrow {
        display: block;
        clear: both;
        float: none;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 20px
    }
    .gallery-mosaic .gallery-row .gallery-item.gallery-item-narrow:first-child {
        margin-left: auto
    }
    .gallery-mosaic .gallery-row .gallery-item.gallery-item-narrow:last-child {
        margin-right: auto
    }
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-big {
    float: left;
    clear: none;
    text-align: inherit;
    width: 59.2%;
    margin-left: 0;
    margin-right: 2%;
    background-color: #121212;
    height: 460px;
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-big::after {
    content: "";
    display: table;
    clear: both
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-big:nth-child(n) {
    margin-right: 2%;
    float: left;
    clear: none
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-big:nth-child(2n) {
    margin-right: 0;
    float: right
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-big:nth-child(2n+1) {
    clear: both
}
@media (max-width:600px) {
    .gallery-mosaic .gallery-row .gallery-item.gallery-item-big {
        display: block;
        clear: both;
        float: none;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 20px
    }
    .gallery-mosaic .gallery-row .gallery-item.gallery-item-big:first-child {
        margin-left: auto
    }
    .gallery-mosaic .gallery-row .gallery-item.gallery-item-big:last-child {
        margin-right: auto
    }
}
/* 3 */
.gallery-mosaic .gallery-row .gallery-item.gallery-item-3 {
    float: left;
    clear: none;
    text-align: inherit;
    width: 32%;
    margin-left: 0;
    margin-right: 2%;
    background-color: #aeb1b6;
    height: 400px;
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-3::after {
    content: "";
    display: table;
    clear: both
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-3:nth-child(n) {
    margin-right: 2%;
    float: left;
    clear: none;
}
.gallery-mosaic .gallery-row .gallery-item.gallery-item-3:nth-child(3n) {
    margin-right: 0;
    float: right
}
@media (max-width:960px) {
    .gallery-mosaic .gallery-row .gallery-item.gallery-item-3 {
        height:280px
    }

}
@media (max-width:600px) {
    .gallery-mosaic .gallery-row .gallery-item.gallery-item-3 {
        display: block;
        clear: both;
        float: none;
        width: 100%;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 20px
    }
    .gallery-mosaic .gallery-row .gallery-item.gallery-item-3:first-child {
        margin-left: auto
    }
    .gallery-mosaic .gallery-row .gallery-item.gallery-item-3:last-child {
        margin-right: auto
    }
}


/* ==================================================
   24. Instagram Feed
================================================== */
.instagram {
    overflow: hidden;
    position:relative;
    min-height: 100px;
}
	.instagram .follow-overlay {
		position:absolute;
		left:0;
		top:0;
		right:0;
		bottom:0;
		background-color:rgba(0,0,0,0.7);
		width:100%;
		height:100%;
		z-index:2;
		pointer-events:none;
		transition:opacity 0.3s ease;
	}
	.instagram .follow-overlay a {
		position:absolute;
		top:50%;
		left:50%;
		transform:translate(-50%, -50%);
		font-size:24px;
		color:#fff;
		text-transform:uppercase;
		letter-spacing:0.06em
	}
	.instagram:hover .follow-overlay {
		opacity:0
	}
	.instagram-image {
	    position:relative;
	    width:20%;
	    float:left;
	}
	.instagram-image img {
		width: 100%;
	}
	    .instagram-image a {
	        display:inline-block;
	    }
	    .instagram .meta {
	        position: absolute;
	        pointer-events: none;
	        left:0;
	        right:0;
	        top:0;
	        bottom:0;
	        z-index:1;
	        background-color:rgba(0,0,0,0.6);
	        transition: all 0.5s ease;
	        -webkit-transition: all 0.5s ease;
	        opacity:0
	    }
	    .instagram-image:hover .meta {
	        opacity:1
	    }
	        .instagram .meta div {
	            text-align:center;
	            color:#fff;
	            font-size:14px;
	            font-weight:600;
	            position:absolute;
	            top:50%;
	            transform:translateY(-50%);
	            -webkit-transform:translateY(-50%);
	            width: 100%;
	        }
	            .instagram .meta span {
	                display:inline-block;
	                margin:0 5px;
	            }
	                .instagram .meta span i {
	                    margin-right:5px;
	                }

	     /* Gap */
	    .instagram-images.small-gap .instagram-image {
	        padding:1px;
	    }
	    .instagram-images.small-gap .meta {
	        margin:1px;
	    }


/* ==================================================
   25. Slider
================================================== */
.bx-wrapper {
	position: relative;
}
.bx-wrapper ul,
.bx-wrapper ul li {
	margin-left:0;
	margin-right:0;
	padding-left:0;
	padding-right:0;
}


/* Controls
 -------------------------------- */
 .bx-controls {
	width:100%;
}
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
	position: absolute;
	bottom: -20px;
	width: 100%;
}
.bx-wrapper .bx-prev {}
.bx-wrapper .bx-prev:after,
.bx-wrapper .bx-next:after {}
.bx-wrapper .bx-next {}
.bx-wrapper .bx-next:after {}
.bx-wrapper .bx-prev {}
.bx-wrapper .bx-prev:after {}
.bx-wrapper .bx-next:after {}
.bx-wrapper .bx-pager {
	width: 14.7%;
	bottom: 40px;
	height: 6px;
	line-height: 6px;
	text-align: center;
	position: absolute;
	right: 0;
	z-index: 55;
}
.bx-wrapper .bx-pager.bx-default-pager a {
	display: block;
	width: 30px;
	height: 30px;
	margin: 0 5px;
	outline: 0;
	opacity: 0.4;
	-webkit-transition: 0.3s;
	transition: 0.3s;
	text-indent:0;
	font-size:12px;
	text-align:center;
	line-height:26px;
	color:#222;
	font-weight:500;
	border-radius:100%;
	border: 2px solid rgba(000,000,000,0.3);
}
.slider-nav-simple .bx-wrapper .bx-pager.bx-default-pager a {
	width: 5px;
	height: 5px;
	text-indent: -999em;
	font-size: 0px;
	line-height: 0;
	border: 0;
	background:#222;
}
.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active,
.bx-wrapper .bx-pager.bx-default-pager a:focus {
	opacity: 1;
}
.bx-wrapper .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
	display: inline-block;
	vertical-align: bottom;
	*zoom: 1;
	*display: inline;
}
.bx-wrapper .bx-pager-item {
	font-size: 0;
	line-height: 0;
}
.bx-wrapper .bx-controls-direction {
	width: 22.5%;
	max-width: 230px;
	height: 120px;
	position: absolute;
	bottom: 0;
	left: 620px;
	z-index: 11;
}
.bx-wrapper .bx-controls-direction a {
	position: absolute;
	top: 0;
	outline: 0;
	text-indent: -9999px;
	z-index: 12;
}
.bx-wrapper .bx-controls-direction {
	display: none;
}
.bx-wrapper .bx-pager {
	right: 70px;
	bottom: 0px;
}


/* Layer Slider
 -------------------------------- */
.layers-slider li {
  opacity: 1!important;
}

.layers-slider li .back-layer:before,
.layers-slider li .front-layer:before {
	content: "";
	width: 100%;
	height: 100%;
	background: #fff;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	-webkit-transition: transform 0.8s cubic-bezier(0.180, 1.000, 0.220, 1.000);
	-moz-transition: transform 0.8s cubic-bezier(0.180, 1.000, 0.220, 1.000);
	transition: transform 0.8s cubic-bezier(0.180, 1.000, 0.220, 1.000);
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: right top;
	transform-origin: right top;
}
.layers-slider li .front-layer:before {
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
}
.layers-slider li.over .back-layer:before,
.layers-slider li.over .front-layer:before {
	-webkit-transform: scaleX(1);
	transform: scaleX(1);
	-webkit-transform-origin: left top;
	transform-origin: left top;
}
.layers-slider li img {
	width: 100%;
	height: auto;
}
.layers-slider li .back-layer img {}
.layers-slider li img {
	-webkit-transform: translate3d(30%,0,0);
	transform: translate3d(30%,0,0);
	-webkit-transition-property: transform;
	transition-property: transform;
}
.layers-slider li.over img {
	-webkit-transform: translate3d(-70%,0,0);
	transform: translate3d(-70%,0,0);
	opacity: 0;
}
.layers-slider li.start img {
	opacity: 0;
}
.layers-slider li.on img {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
.layers-slider li {
	width: 100%;
	padding-bottom: 80px;
}

.layers-slider li .back-layer {
	overflow: hidden;
	position: relative;
}
.layers-slider li .front-layer {
	width: 44.5%;
	position: absolute;
	bottom: 0px;
	left: 20px;
	overflow: hidden;
}

/* Navigation */
.layers-slider-block .bx-pager {
	right: 20px;
	width: 48%;
	bottom: 60px;
	text-align:left;
}

/* Description */
.layers-slider .desc-layer {
	position: absolute;
	z-index: 1;
	right: 20px;
	bottom: 40px;
	width: 48%;
	left:auto;
	text-transform:uppercase
}
	.layers-slider .desc-layer h3 {
		font-size:42px;
		margin-bottom:0px;
		line-height: 45px;
	}
	.layers-slider .desc-layer h6 {
		font-size:22px;
		margin-bottom:0px;
		font-weight:400;;
		color:#f70;
	}


/* Testimonials slider
 -------------------------------- */
.testi-slider-block {
	margin-bottom:40px;
}
.testi-slider li {
  opacity: 1!important;
  text-align: center;
}

.testi-slider li .back-layer:before,
.testi-slider li .front-layer:before {
	content: "";
	width: 100%;
	height: 100%;
	background: #fff;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
	-webkit-transition: transform 0.8s cubic-bezier(0.180, 1.000, 0.220, 1.000);
	-moz-transition: transform 0.8s cubic-bezier(0.180, 1.000, 0.220, 1.000);
	transition: transform 0.8s cubic-bezier(0.180, 1.000, 0.220, 1.000);
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: right top;
	transform-origin: right top;
}
.testi-slider li .front-layer:before {
	-webkit-transition-delay: 0.2s;
	transition-delay: 0.2s;
	background: #f70;
}
.testi-slider li.over .back-layer:before,
.testi-slider li.over .front-layer:before {
	-webkit-transform: scaleX(1);
	transform: scaleX(1);
	-webkit-transform-origin: left top;
	transform-origin: left top;
}
.testi-slider li img {
	height: auto;
}
.testi-slider li .front-layer .text {
	position:relative;
	background-color:rgba(0, 0, 0, 0.75);
	margin-top:-250px;
	max-width:600px;
	margin-left:auto;
	margin-right:auto;
	color: #fff;
	border-left-style: solid;
	border-left-width: 4px;
	border-left-color: #f70;
	font-size:18px;
	line-height:24px;
	font-weight:300;
	padding: 20px;
	font-family: 'Barlow Condensed', sans-serif;
    text-transform:uppercase;
    letter-spacing: .15em;
}
.testi-slider li .front-layer .text p {
	margin-bottom:0
}
.testi-slider li .front-layer .text .name {
	color:#f70;
	display:block;
	font-weight:600;
	margin-top:5px;
}
.testi-slider li img {
	-webkit-transform: translate3d(30%,0,0);
	transform: translate3d(30%,0,0);
	-webkit-transition-property: transform;
	transition-property: transform;
}
.testi-slider li.over img {
	-webkit-transform: translate3d(-70%,0,0);
	transform: translate3d(-70%,0,0);
	opacity: 0;
}
.testi-slider li .front-layer .text p {
	opacity:0;
}
.testi-slider li.start .front-layer .text p {
	opacity:0;
}
.testi-slider li.on .front-layer .text p {
	opacity:1;
}
.testi-slider li.start img {
	opacity: 0;
}
.testi-slider li.on img {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
.testi-slider li {
	width: 100%;
	padding-bottom: 60px;
}
.testi-slider li .back-layer {
	width:400px;
	margin:0 auto;
}
.testi-slider li .back-layer, 
.testi-slider li .back-layer img {
	overflow: hidden;
	position: relative;
}
.testi-slider li .front-layer {
	position: relative;
	margin:0 auto;
	max-width:600px;
}

/* Navigation */
.testi-slider-block .bx-pager {
	right: 0px;
	width: 100%;
	bottom: 0px;
	position: relative;
	text-align:center;
}


/* ==================================================
  26. Small Elements 
================================================== */


/* Youtube
 -------------------------------- */
.youtube {
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    display: inline-block;
    overflow: hidden;
    cursor: pointer;
    margin-bottom:32px;
}


/* Single Video
 -------------------------------- */
.single-video {
	background-size:cover;
	background-image: url(../images/events-bg.jpg);
}
.single-video > div {
	max-width:900px;
	margin:0 auto;
	padding-top: 20%;
	padding-bottom: 20%;
	display:block;
}


/* Google Maps
 -------------------------------- */
.gmap {
	min-height: 400px;
}


/* Text Cliper
 -------------------------------- */

/* Clip text element */
.clip-text {
    font-size: 6em;
    font-weight: bold;
    line-height: 1;
    position: relative;
    display: inline-block;
    margin: 0.1em;
    padding: .2em .2em;
    text-align: center;
    color: #fff;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}


/* Text Slider
 ------------------------------------ */
.text-slider {
	position:absolute;
	top:50%;
	transform:translate(-50%,-50%);
	left:50%;
	margin:0 auto;
	z-index:6;
	max-width:500px;
	text-align:center;
}
	.text-slide {
		display:none;
	}
	.text-slide.visible {
		display:block
	}
		.text-slide h2 {
			margin-bottom:15px;
			font-size: 68px;
			line-height: 68px;
			font-weight: 700;
			color:#fff;
		}

		.text-slide h6 {
			color:#fff;
			font-weight: 400;
			margin-bottom:0px;
			font-size:32px;
			line-height: 34px;
		}


/* Line Link
 ------------------------------------ */
.line-link {
	position: relative;
	text-decoration: none;
	color: #fff;
}
.line-link:before,
.line-link:after {
	content: '';
	position: absolute;
	height: 1px;
	background: #fff;
	bottom: -1px;
}
.line-link:before {
	right: 0;
	width: 100%;
	margin-right: .16em;
}
.line-link:after {
	left: 0;
	width: 0;
	margin-left: -.16em;
}
.line-link:hover:before,
.line-link:hover:after {
	transition: width 300ms cubic-bezier(0.4, 0, 0, 1);
}
.line-link:hover:before {
	width: 0;
}
.line-link:hover:after {
	width: 100%;
	transition-delay: 200ms;
}


/* Button
 ------------------------------------ */
input[type="submit"], button, .button  {
	background: #ff7700;
	border: none;
	display:inline-block;
	color: #fff;
	cursor: pointer;
	height: auto;
	overflow: visible;
	padding: 10px 30px;
	-webkit-transition: .4s cubic-bezier(0.28, 0.12, 0.22, 1);
	-moz-transition: .4s cubic-bezier(0.28, 0.12, 0.22, 1);
	-ms-transition: .4s cubic-bezier(0.28, 0.12, 0.22, 1);
	-o-transition: .4s cubic-bezier(0.28, 0.12, 0.22, 1);
	transition: .4s cubic-bezier(0.28, 0.12, 0.22, 1);
	width: auto;
	font-size:13px;
	text-transform:uppercase;
	letter-spacing:0.1em;
}
	input[type="submit"] span, button span, .button span {
		color:#fff;
	}
	
	input[type="submit"]:hover, button:hover, .button:hover {
		background: #222;
		color: #fff;
	}
	input[type="submit"].arrow-anim i, button.arrow-anim i, .button.arrow-anim i {
		padding-left:0px;
		color:#fff;
		font-size:17px
	}
	input[type="submit"].arrow-anim:hover i, button.arrow-anim:hover i, .button.arrow-anim:hover i {
		left:13px;
	}

	/* Small button */
	input[type="submit"].small, button.small, .button.small {
		font-size: 13px;
		padding: 10px 12px;
		line-height: 20px;
	}
		
	/* Big button */
	input[type="submit"].big, button.big, .button.big {
		font-size: 18px;
		font-weight: 600;
		letter-spacing:0.14em;
		padding: 7% 30px;
	}
	input[type="submit"].big.arrow-anim i, button.big.arrow-anim i, .button.big.arrow-anim i {
		padding-left:14px
	}
	input[type="submit"].big.arrow-anim:hover i, button.big.arrow-anim:hover i, .button.big.arrow-anim:hover i {
		left:15px;
	}
		
		input[type="submit"].big .icon, button.big .icon, .button.big .icon  {
			margin: -3px 0 0 6px;
			text-indent: -9999px;
			vertical-align: middle;
			color:#fff;
			font-size:19px;
		}

	/* Wide button */
	.button.wide {
		width: 100%;
		margin-right: 0;
	}


/* Share Button
 -------------------------------- */
.share-button {
	background-color:#333;
	padding:6px;
	line-height:0;
	border-radius:4px;
	font-size:14px;
	margin-bottom: 6px;
	margin-right: 8px;
	display:inline-block;
}
.share-button span {
	color:#fff;
}
.share-button:hover {
	background-color:#f60;
	text-decoration:none
}


/* Shop Button
 ------------------------------------ */
.shop-buttons {
	margin-top:0px;
}
.shop-btn {
	max-width: 120px;
	display: inline-block;
	margin-right: 10px;
	margin-bottom: 10px;
}
.shop-buttons .shop-btn:last-of-type {
	margin-right: 0px;
}


/* Circle Button ( with icon )
 ------------------------------------ */
.circle-btn {
	color: #222;
	font-size: 21px;
	display: inline-block;
	position: relative;
	text-align: center;
	z-index: 12;
	height: 40px;
	margin: 0 2px;
}
	
	.circle-btn .circle-svg {
		-webkit-transform: rotate(-90deg);
		transform: rotate(-90deg);
	}
		.circle-btn .circle {
			stroke-dasharray: 0 144;
			opacity: 0;
			-webkit-transition: 0.5s;
			transition: 0.5s;
			stroke-width: 2px;
			stroke:#222222;
		}
		.circle-btn .circle-bg {
			stroke-dasharray: 144 144;
			opacity: 1;
			transition: 0.5s;
			stroke-width: 2px;
			opacity:0.3
		}
	.circle-btn:hover .circle,
	.circle-btn.on .circle {
		stroke-dasharray: 144 144;
		opacity: 1;
		-webkit-transition-property: stroke-dasharray;
		transition-property: stroke-dasharray;
	}
	.circle-btn span {
		color: #222;
		position:absolute;
		left: 10px;
		top: 8px;
	}

.dark-bg .circle-btn,
.dark-bg .circle-btn span {
	color: #fff;
}
.dark-bg .circle-btn .circle {
	stroke:#ffffff;
}
		

/* Dropcaps
 ------------------------------------ */
p.description {

	font-style: italic;
}


/* Dropcaps
 ------------------------------------ */
.dropcap {
	background: #eee;
	color: #1b1c1d;
	display: inline-block;
	float: left;
	font-size: 24px;
	font-weight: 800;
	height: 36px;
	line-height: 36px;
	margin: 0 7px 0 0;
	text-align: center;
	width: 36px;
}

/* Invert */
.dropcap.invert {
	background: #1b1c1d;
	color: #eee;
}


/* Info box
 ------------------------------------ */
.info-box {
	margin: 30px 0;
	padding: 30px;
	background-color: #1d1d1e;
}
.info-box > p:last-child { margin-bottom: 0; }


/* Tweets
 ------------------------------------ */
.tweets {
	list-style: none;
	margin: 0;
}
	.tweets li {
		margin: 0 0 30px 0;
		font-size: 14px;
		color: #999;
	}
	.tweets li:before {
		content: "\2014";
		color: #666;
		padding-bottom: 5px;
		display: block;
	}
	.tweets li:first-child:before { display: none;}

		.tweets li .date a {
			display: block;
			margin-top: 12px;
			font-size: 12px;
			letter-spacing: 0.2em;
			text-transform: uppercase;
			color: #666;
			border: none;
			font-weight: normal;
			width: 100%;
		}
		.tweets li .date a:hover { color: #ff7700; }


/* Divider
 ------------------------------------ */
hr.divider {
	background-color: #ddd;
	width: 100%;
	height: 1px;
	margin: 30px 0 50px 0;
}


/* Tabs
 ------------------------------------ */
ul.tabs {
	width:auto;
	height:53px;
	border-bottom: 1px solid #d5d5d5;
	margin-bottom:30px;
	list-style-type: none;
	font-weight: bold;
}
	ul.tabs li { 
		color:#999; 
		float:left;
		margin:0;
		padding: 0;
	}
	ul.tabs li a {
		height:50px;
		line-height:50px;
		margin:2px 0 0 0;
		float:left;
		color:#999;
		padding:0 24px;
		background-color: #e9e9e9;
		border: solid 1px #d5d5d5;
		border-width: 1px 1px 0 0;
		font-family: 'Barlow Condensed', sans-serif;
		text-transform:uppercase;
		letter-spacing:0.1em;
		font-weight:500;
	}
	ul.tabs li:first-child a { border-width: 1px 1px 0 1px;}
	ul.tabs li a.on, ul.tabs li a.on:hover {
		height:51px;
		background-color: #ffffff;
		color: #222;
	}
	.tabs-wrap { 
		overflow:hidden;
		margin-bottom: 40px;
	}
	.tab-content { display:none; }
	.tab-content.on { display: block }


/* Toggle
 ------------------------------------ */
h4.toggle-title {
	margin-bottom:20px;
	cursor:pointer;
	color: #222;
	line-height: 27px;
	position: relative;
	padding-left:35px;
}
h4.toggle-title:before {
	content: "+";
	text-align: center;
	position:absolute;
	left:0;
	top:5px;
	display: inline-block;
	width: 22px;
	height: 22px;
	float: left;
	line-height:20px;
	color: #fff;
	background-color: #252627;
}
h4.active-toggle:before { 
	content: "-";
	background-color: #ff7700;
}
.toggle {
	border-bottom: 1px solid #eee;
	margin-bottom: 20px;
}
.toggle-content { display: none; }


/* Alert Boxes
 ------------------------------------ */
.error, .success, .info, .warning {
	display: block;
	font-size: 13px;
	border: 1px solid;
	padding: 14px 20px 14px 20px;
	clear: both;
}
.error {
	background-color: #fdcaca;
	color: #7f6060;
	border-color: #ffc3c3;
}
.success {
	background-color: #cafdce;
	color: #637a65;
	border-color: #9cfaa3;
}
.info {
	background-color: #dee9fe;
	color: #737b8b;
	border-color: #cddfff;
}
.warning {
	background-color: rgba(62, 62, 62, 0.5);
	color: #ffffff;
	border-color: #ff7700;
}


/* Flexible video
 ------------------------------------ */
.video-wrap {
	margin: 0 0 40px;
}


/* Overlays
 -------------------------------- */
.overlay {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}
.overlay.dots {
	background: transparent url(../images/overlay.png) left top repeat;
}
.overlay.noise {
	opacity: .06;
	background: transparent url(../images/bg_animated.gif) left top repeat;
}
.overlay.black {
	background: rgba(0,0,0,0.7);
}


/* Thumbnails
 --------------------------------*/

/* Thumb with title (releases) */
.thumb {
	display: inline-block;
	overflow: hidden;
	position: relative;
}
	.thumb img {
		max-height: 100%;
		height: auto;
		max-width: 100%;
		margin: 0;
		width: 100%;
	}


/* Thumb fade on hover
 -------------------------------- */
.thumb-fade img {
	-webkit-transition: filter .4s cubic-bezier(0.28, 0.12, 0.22, 1);
	-moz-transition: filter .4s cubic-bezier(0.28, 0.12, 0.22, 1);
	transition: filter .4s cubic-bezier(0.28, 0.12, 0.22, 1);			
}
.thumb-fade:hover img,
.thumb-fade.on img {
	-ms-filter: saturate(150%) brightness(40%); 
	-webkit-filter: saturate(150%) brightness(40%);
	filter: saturate(150%) brightness(40%);
}


/* Thumb icon effect
 -------------------------------- */
.thumb-icon {
	position: absolute;
	top: 50%;
	transform: translate(-50%,-50%);
	left: 50%;
	margin: 0 auto;
	z-index: 14;
	opacity:0;
}

.thumb-icon:hover span {
	color:#000;
}
.thumb.on .thumb-icon,
.thumb:hover .thumb-icon,
.thumb-icon.on {
	opacity:1;
}
.thumb-icon:before {
	  content: "";
	  width: 74px;
	  height: 74px;
	  background-color: #fff;
	  position: absolute;
	  top: 1px;
	  left: 1px;
	  z-index: -1;
	  border: 1px #fff solid;
	  -webkit-border-radius: 50% 50%;
	  border-radius: 100%;
	  -webkit-transform: scale(0);
	  transform: scale(0);
	  -webkit-transition: all 800ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
	  transition: all 800ms cubic-bezier(0.190, 1.000, 0.220, 1.000);
}
.thumb-icon:hover:before {
	-webkit-transform: scale(1);
	  transform: scale(1);
}
	.thumb-icon .circle-svg {
		-webkit-transform: rotate(-90deg);
		transform: rotate(-90deg);
	}
		.thumb-icon .circle {
			stroke-dasharray: 0 144;
			-webkit-transition: 0.5s;
			transition: 0.5s;
			stroke-width: 1px;
		}
	.thumb:hover .thumb-icon .circle,
	.thumb.on .thumb-icon .circle,
	.thumb-icon.on .circle {
		stroke-dasharray: 144 144;
		-webkit-transition-property: stroke-dasharray;
		transition-property: stroke-dasharray;
	}
	.thumb-icon span {
		color: #fff;
		position:absolute;
		left: 23px;
		/* 		transform: translate(-50%,-50%); */
		top: 25px;
		font-size:32px;
		z-index:2;
		line-height:normal;
	}
	

/* Badges
 -------------------------------- */
.badge {
	color: #fff;
	white-space: nowrap;
	overflow: hidden;
	position: absolute;
	text-align: center;
	padding: 4px;
	height: 26px;
	width: 120px;
	min-width: auto;
	min-height: 26px;
	right: -31px;
	top: 16px;
	left: auto;
	z-index: 1;
	text-transform: uppercase;
	font-size: 12px;
	line-height: 18px;
	letter-spacing: 2px;
	transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
}
.badge.new {background-color: #000;color: #fff;}
.badge.free { background-color: #000; }
.badge.soundcloud { background-color: #ff7700; }


/* Arrow navigation
 --------------------------------*/
 .arrow-nav {
    position: relative;
    width: 40px;
    height: 40px;
    float: left;
    cursor:pointer;
    text-align: center;
    vertical-align: middle;
    font-size:23px;
    z-index:2;
    border-radius:100%;
    border:1px solid #fff;
}
.arrow-nav span {
    line-height:40px;
}
.arrow-nav span:before,
.arrow-nav span:after  {
    transition: width .6s cubic-bezier(.165,.84,.44,1);
    transition: width .6s cubic-bezier(.165,.84,.44,1);
}
.arrow-nav.right span:before, .arrow-nav.left span:after {
    content:"";
    display:inline-block;
    width:0px;
    height:2px;
    position:relative;
    top:-8px;
    background-color:#fff;
}
.arrow-nav .icon {
    pointer-events: none;
    color:#fff;
    position:relative:
}
.arrow-nav.left span:after {
    left:-5px
}
.arrow-nav.right span:before {
    right:-5px
}
.arrow-nav.left:hover span:after,
.arrow-nav.right:hover span:before {
    width:11px;
}
.arrow-nav[href^="#"] {
    opacity:0.3;
    cursor:default;
    pointer-events: none;
}
	

/* Stats
 --------------------------------*/
ul.stats {
	list-style: none;
	overflow: hidden;
	margin-left:0;
	padding-left:0;
}
	ul.stats li {
		position: relative;
		overflow: hidden;
		padding: 0;
		text-align: center;
		padding-bottom: 20px;
		float:left;
		width: 50%;
		margin: 0;
	}
	ul.stats li .stat-value {
		font-size: 120px;
		color: #222;
		font-weight: bold;
		line-height: normal;
		font-family: 'Barlow Condensed', sans-serif;
		 text-shadow: -1px 0 14px rgba(255,255,255,0.2) ;
	}
	ul.stats li .stat-name {
		position: absolute;
		text-transform: uppercase;
		left: 0;
		bottom: 0;
		font-size: 14px;
		color: #999;
		width: 100%;
		font-weight:400;
		letter-spacing:0.1em;
		text-align: center;
	}


/* ==================================================
   27. Plugins
================================================== */


/* Isotope
 -------------------------------- */
.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}
.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}
.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}


/* Nprogress (preloader)
 -------------------------------- */
#nprogress {
	pointer-events: none;
}
#nprogress .bar {
	background: #ff7700;
	position: fixed;
	z-index: 99999;
	top: 0;
	left: 0;
	width: 100%;
	height: 2px;
}
.page-loading #nprogress .bar {
	height:4px;
}


/* ==================================================
  28. Animations 
================================================== */
.text-fx-btn.rotate-x-360 > a.on p span,
.text-fx-btn.rotate-x-360:hover > a p span {
  -webkit-transform: rotateX(360deg);
  transform: rotateX(360deg);
}
.text-fx-btn.l25:hover > a p span {
  -webkit-transform: translate3d(25px,0,0);
  transform: translate3d(25px,0,0);
}

/* Reveal */
.reveal-fx,.reveal-fx-static {
	overflow: hidden;
}
.reveal-fx:after, .reveal-fx:before, .reveal-fx-static:after, .reveal-fx-static:before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 1;
}
.reveal-fx:after, .reveal-fx:before {
    -webkit-transition: 0.45s cubic-bezier(0.76, 0, 0.174, 1), opacity 0s 500ms;
    transition: 0.45s cubic-bezier(0.76, 0, 0.174, 1), opacity 0s 500ms;
}
.reveal-fx-static:after, .reveal-fx-static:before {
    -webkit-transition: 0.85s cubic-bezier(0.76, 0, 0.174, 1), opacity 0s 900ms;
    transition: 0.85s cubic-bezier(0.76, 0, 0.174, 1), opacity 0s 900ms;
}
.reveal-fx:before, .reveal-fx-static:before {
    -webkit-transform: translateX(-102%) translateZ(0);
    transform: translateX(-102%) translateZ(0);
    opacity: 1
}
.reveal-fx:after, .reveal-fx-static:after {
    -webkit-transform: translateX(102%) translateZ(0);
    transform: translateX(102%) translateZ(0);
    opacity: 0
}
.reveal-fx:hover:before, .reveal-fx:hover:after {
    -webkit-transform: translateX(0) translateZ(0);
    transform: translateX(0) translateZ(0);
    transition: 0.45s cubic-bezier(0.77, 0, 0.175, 1), opacity 0s 500ms;
    -webkit-transition: 0.45s cubic-bezier(0.77, 0, 0.175, 1), opacity 0s 500ms;
}
.reveal-fx:hover:before {
    opacity: 0
}
.reveal-fx:hover:after {
    opacity: 1
}
.reveal-fx-static.is-active:before, .reveal-fx-static.is-active:after {
    transform: translateX(0) translateZ(0);
    -webkit-transform: translateX(0) translateZ(0);
    transition: 0.85s cubic-bezier(0.77, 0, 0.175, 1), opacity 0s 900ms;
    -webkit-transition: 0.85s cubic-bezier(0.77, 0, 0.175, 1), opacity 0s 900ms;
}
.reveal-fx-static.is-active:before {
    opacity: 0
}
.reveal-fx-static.is-active:after {
    opacity: 1
}

/* Skew FX */
.skew-fx-loop {
	animation: 2s skew infinite linear;
}
.skew-fx-2-loop {
	animation: 3s skew_o infinite linear;
}
.skew-fx.on {
	-moz-animation: skew 2s;
    -webkit-animation: skew 2s;
    animation: skew 2s;
}
@keyframes skew {
	0% {
	    transform: skew(0) scaleX(1);
	}
	9% {
	    transform: skew(0) scaleX(1);
	}
	10% {
	    transform: skew(220deg) scaleX(0.1);
	}
	11% {
	    transform: skew(0) scaleX(1);
	}
	100% {
	    transform: skew(0) scaleX(1);
	}
}
@keyframes skew_o {
	0% {
	    transform: skew(0) scaleX(1);
	    opacity:0.05;
	}
	9% {
	    transform: skew(0) scaleX(1);
	    opacity:0.06;
	}
	10% {
	    transform: skew(220deg) scaleX(0.1);
	    opacity:0.1;
	}
	11% {
	    transform: skew(0) scaleX(1);
	    opacity:0.04;
	}
	100% {
	    transform: skew(0) scaleX(1);
	    opacity:0.04;
	}
}

/* .text-fx */
.text-fx p {
	display: inline-block;
	overflow: hidden;
	margin-bottom: 0;
}
.text-fx p span {
	display: inline-block;
	-webkit-transform: translate3d(0,100%,0);
	transform: translate3d(0,100%,0);
}
a:hover .text-fx p span,
.text-fx.on p span {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
.text-fx-word p {
	display: inline-block;
	overflow: hidden;
	margin-right: 5px;
	margin-bottom:0;
}
.text-fx-word p span {
	display: inline-block;
	-webkit-transform: translate3d(0,100%,0);
	transform: translate3d(0,100%,0);
}
a:hover .text-fx-word p span,
.text-fx-word.on p span {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}
.text-fx-btn p,
.text-fx-btn p span {
	display: inline-block;
	margin-bottom: 0;
}

/* .show-fx */
.show-fx {
  -webkit-transform: translate3d(0,100px,0) scale(0.95);
  transform: translate3d(0,100px,0) scale(0.95);
  opacity: 0!important;
}
.show-fx.on {
  -webkit-transform: translate3d(0,0,0) scale(1);
  transform: translate3d(0,0,0) scale(1);
  opacity: 1!important;
}

/* .blur-fx */
.blur-fx {
  -webkit-filter: blur(30px);
  filter: blur(30px);
  opacity: 0;
}
.blur-fx.on {
  -webkit-filter: blur(0px);
  filter: blur(0px);
  opacity: 1;
}


/* ==================================================
  29. Transitions 
================================================== */
.trans-03 {
  -webkit-transition: all 320ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
  transition: all 320ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
}

.trans-05 {
  -webkit-transition: all 490ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
  transition: all 490ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
}

.trans-08 {
  -webkit-transition: all 800ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
  transition: all 800ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
}

.trans-10 {
  -webkit-transition: all 1000ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
  transition: all 1000ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
}

.trans-12 {
  -webkit-transition: all 1200ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
  transition: all 1200ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
}

.trans-15 {
  -webkit-transition: all 1490ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
  transition: all 1490ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
}

.trans-20 {
  -webkit-transition: all 2000ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
  transition: all 2000ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
}

.trans-25 {
  -webkit-transition: all 2490ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
  transition: all 2490ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
}

.trans-30 {
  -webkit-transition: all 3000ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
  transition: all 3000ms cubic-bezier(0.200, 1.000, 0.210, 1.000);
}

.delay-01 {
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
}

.delay-02 {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
}

.delay-03 {
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
}

.delay-04 {
  -webkit-transition-delay: 0.4s;
  transition-delay: 0.4s;
}

.delay-05 {
  -webkit-transition-delay: 0.5s;
  transition-delay: 0.5s;
}

.delay-06 {
  -webkit-transition-delay: 0.6s;
  transition-delay: 0.6s;
}

.delay-07 {
  -webkit-transition-delay: 0.7s;
  transition-delay: 0.7s;
}

.delay-08 {
  -webkit-transition-delay: 0.8s;
  transition-delay: 0.8s;
}

.delay-09 {
  -webkit-transition-delay: 0.9s;
  transition-delay: 0.9s;
}

.delay-10 {
  -webkit-transition-delay: 1s;
  transition-delay: 1s;
}

.delay-11 {
  -webkit-transition-delay: 1.1s;
  transition-delay: 1.1s;
}

.delay-12 {
  -webkit-transition-delay: 1.2s;
  transition-delay: 1.2s;
}

.delay-13 {
  -webkit-transition-delay: 1.3s;
  transition-delay: 1.3s;
}

.delay-14 {
  -webkit-transition-delay: 1.4s;
  transition-delay: 1.4s;
}

.delay-15 {
  -webkit-transition-delay: 1.5s;
  transition-delay: 1.5s;
}

.delay-16 {
  -webkit-transition-delay: 1.6s;
  transition-delay: 1.6s;
}

.delay-17 {
  -webkit-transition-delay: 1.7s;
  transition-delay: 1.7s;
}

.delay-18 {
  -webkit-transition-delay: 1.8s;
  transition-delay: 1.8s;
}

.delay-19 {
  -webkit-transition-delay: 1.9s;
  transition-delay: 1.9s;
}

.delay-20 {
  -webkit-transition-delay: 2s;
  transition-delay: 2s;
}


/* ==================================================
  30. Grid 
================================================== */


/* Grid and container
 ------------------------------ */
.container { width: 1200px; margin: 0 auto; position: relative; }
.container:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.container.full-width {width: 100%;padding-left: 60px;padding-right: 60px;}
.container.narrow { width: 1030px; }
.container.small { width: 700px; }
.container > article:last-child { margin-bottom: 0 }
.flex-col-1-1, .flex-col-1-2, .flex-col-1-3, .flex-col-1-4, .flex-col-1-5 { float: left; }
.flex-col-1-1 { width: 100%; }
.flex-col-1-2 { width: 50%; }
.flex-col-1-3 { width: 33.33%; }
.flex-col-1-4 { width: 25% }
.flex-col-1-5 { width: 20% }
.grid-row { margin-bottom: 30px; }
.grid-row:after { content: ''; display: block; height: 0; clear: both; }
.grid-row [class^="grid-"] { float: left; }
.grid-row-pad { margin: 0 -10px; margin-bottom:30px; }
.grid-row-pad [class^="grid-"] { padding: 0 10px 20px 10px; }
.grid-row-pad-large { margin: 0 -20px; margin-bottom:30px; }
.grid-row-pad-large [class^="grid-"] { padding: 0 20px 20px 20px; }
.grid-row-pad-xlarge { margin: 0 -40px; margin-bottom:30px;  }
.grid-row-pad-xlarge [class^="grid-"] { padding: 0 40px 20px 40px; }
.grid-row .grid-centered { clear: both; margin: 0 auto 20px auto; float: none; }
.grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6, .grid-7, .grid-8, .grid-9, .grid-10, .grid-11, .grid-12 { -webkit-box-sizing: border-box; box-sizing: border-box; }
.grid-1 { width: 8.333%; }
.grid-2 { width: 16.666%; }
.grid-3 { width: 25%; }
.grid-4 { width: 33.332%; }
.grid-5 { width: 41.665%; }
.grid-6 { width: 50%; }
.grid-7 { width: 58.334%; }
.grid-8 { width: 66.667%; }
.grid-9 { width: 75%; }
.grid-10 { width: 83.334%; }
.grid-11 { width: 91.667%; }
.grid-12 { width: 100%; }
.grid-offset-1 { margin-left: 8.333%; }
.grid-offset-2 { margin-left: 16.666%; }
.grid-offset-3 { margin-left: 25%; }
.grid-offset-4 { margin-left: 33.332%; }
.grid-offset-5 { margin-left: 41.665%; }
.grid-offset-6 { margin-left: 50%; }
.grid-offset-7 { margin-left: 58.334%; }
.grid-offset-8 { margin-left: 66.667%; }
.grid-offset-9 { margin-left: 75%; }
.grid-offset-10 { margin-left: 83.334%; }
.grid-offset-11 { margin-left: 91.667%; }

/* Large Displays */
@media only screen and (max-width:1640px) and (min-width:1150px) {
    .container { width: 1170px; }
}

/* Large Displays */
@media only screen and (max-width:1560px) and (min-width:1150px) {
    .container { width: 1150px; }
}

/* Small Desktop Devices [ 960px ] */
@media only screen and (max-width:1240px) {
    .container, .container.narrow { width: 960px; }
    .grid-desktop-clear { clear: both; }
    .grid-desktop-1 { width: 8.333%; }
    .grid-desktop-2 { width: 16.666%; }
    .grid-desktop-3 { width: 25%; }
    .grid-desktop-4 { width: 33.332%; }
    .grid-desktop-5 { width: 41.665%; }
    .grid-desktop-6 { width: 50%; }
    .grid-desktop-7 { width: 58.334%; }
    .grid-desktop-8 { width: 66.667%; }
    .grid-desktop-9 { width: 75%; }
    .grid-desktop-10 { width: 83.334%; }
    .grid-desktop-11 { width: 91.667%; }
    .grid-desktop-12 { width: 100%; }
    .grid-desktop-offset-0 { margin-left: 0; }
    .grid-desktop-offset-1 { margin-left: 8.333%; }
    .grid-desktop-offset-2 { margin-left: 16.666%; }
    .grid-desktop-offset-3 { margin-left: 25%; }
    .grid-desktop-offset-4 { margin-left: 33.332%; }
    .grid-desktop-offset-5 { margin-left: 41.665%; }
    .grid-desktop-offset-6 { margin-left: 50%; }
    .grid-desktop-offset-7 { margin-left: 58.334%; }
    .grid-desktop-offset-8 { margin-left: 66.667%; }
    .grid-desktop-offset-9 { margin-left: 75%; }
    .grid-desktop-offset-10 { margin-left: 83.334%; }
    .grid-desktop-offset-11 { margin-left: 91.667%; }
}

/* Tablets */
@media only screen and (min-width:768px) and (max-width:1020px) {
    .flex-col-1-1, .flex-col-1-2, .flex-col-1-3, .flex-col-1-4, .flex-col-1-5 { width: 50% }
    .container, .container.narrow, .container.small, .container.full-width {width: 100%;padding-left:30px; padding-right:30px;}
    .grid-tablet-clear { clear: both; }
    .grid-tablet-1 { width: 8.333%; }
    .grid-tablet-2 { width: 16.666%; }
    .grid-tablet-3 { width: 25%; }
    .grid-tablet-4 { width: 33.332%; }
    .grid-tablet-5 { width: 41.665%; }
    .grid-tablet-6 { width: 50%; }
    .grid-tablet-7 { width: 58.334%; }
    .grid-tablet-8 { width: 66.667%; }
    .grid-tablet-9 { width: 75%; }
    .grid-tablet-10 { width: 83.334%; }
    .grid-tablet-11 { width: 91.667%; }
    .grid-tablet-12 { width: 100%; }
    .grid-tablet-offset-0 { margin-left: 0; }
    .grid-tablet-offset-1 { margin-left: 8.333%; }
    .grid-tablet-offset-2 { margin-left: 16.666%; }
    .grid-tablet-offset-3 { margin-left: 25%; }
    .grid-tablet-offset-4 { margin-left: 33.332%; }
    .grid-tablet-offset-5 { margin-left: 41.665%; }
    .grid-tablet-offset-6 { margin-left: 50%; }
    .grid-tablet-offset-7 { margin-left: 58.334%; }
    .grid-tablet-offset-8 { margin-left: 66.667%; }
    .grid-tablet-offset-9 { margin-left: 75%; }
    .grid-tablet-offset-10 { margin-left: 83.334%; }
    .grid-tablet-offset-11 { margin-left: 91.667%; }
}

/* Mobile portrait and landscape modes */
@media only screen and (max-width:810px) {
    .container, .container.narrow, .container.small, .container.full-width {width: 100%;padding-left:30px; padding-right:30px;}
    .flex-col-1-1, .flex-col-1-2, .flex-col-1-3, .flex-col-1-4, .flex-col-1-5 { width: 100% }
    .grid-mobile-clear { clear: both; }
    .grid-mobile-1 { width: 8.333%; }
    .grid-mobile-2 { width: 16.666%; }
    .grid-mobile-3 { width: 25%; }
    .grid-mobile-4 { width: 33.332%; }
    .grid-mobile-5 { width: 41.665%; }
    .grid-mobile-6 { width: 50%; }
    .grid-mobile-7 { width: 58.334%; }
    .grid-mobile-8 { width: 66.667%; }
    .grid-mobile-9 { width: 75%; }
    .grid-mobile-10 { width: 83.334%; }
    .grid-mobile-11 { width: 91.667%; }
    .grid-mobile-12 { width: 100%; }
    .grid-mobile-offset-0 { margin-left: 0; }
    .grid-mobile-offset-1 { margin-left: 8.333%; }
    .grid-mobile-offset-2 { margin-left: 16.666%; }
    .grid-mobile-offset-3 { margin-left: 25%; }
    .grid-mobile-offset-4 { margin-left: 33.332%; }
    .grid-mobile-offset-5 { margin-left: 41.665%; }
    .grid-mobile-offset-6 { margin-left: 50%; }
    .grid-mobile-offset-7 { margin-left: 58.334%; }
    .grid-mobile-offset-8 { margin-left: 66.667%; }
    .grid-mobile-offset-9 { margin-left: 75%; }
    .grid-mobile-offset-10 { margin-left: 83.334%; }
    .grid-mobile-offset-11 { margin-left: 91.667%; }
}

/* Mobile portrait mode */
@media only screen and (max-width:479px) {
    .grid-row [class^="grid-"] { float: none; }
    .grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6, .grid-7, .grid-8, .grid-9, .grid-10, .grid-11, .grid-12 { width: 100%; }
}


/* Only for AJAX Page Container (APC)
 -------------------------------- */
.apc .container.narrow { width: 1030px; }
.apc .container.small { width: 700px; }

@media only screen and (max-width:1560px) and (min-width:1150px) {
    .apc .container { width: 100%; }
}

/* Small Desktop Devices [ 960px ] */
@media only screen and (max-width:1240px) {
    .apc .container, .apc .container.narrow { width: 100% }
}
@media only screen and (min-width:768px) and (max-width:1020px) {
    .apc .container, .apc .container.narrow, .apc .container.small, .apc .container.full-width {width: 100%;padding-left:0px; padding-right:0px;}
}

/* Mobile portrait and landscape modes */
@media only screen and (max-width:810px) {
    .apc .container, .apc .container.narrow, .apc .container.small, .apc .container.full-width {width: 100%;padding-left:40px; padding-right:40px;}
}


/* ==================================================
  31. Media Queries 
================================================== */


/* Large Displays
 -------------------------------- */
@media screen and (min-width: 1560px) {


	/* Ajax Page Container
 	 ------------------------------ */
    .apc .extended-block {
		margin-left: -120px;
		width: -webkit-calc(100% + 240px);
		width: calc(100% + 240px);
	}

}


/* Medium Displays 
 -------------------------------- */
@media only screen and (max-width:1560px) and (min-width:1150px) {


	/* Music
	 -------------------------------- */
	.full-width.items { margin: 40px 40px 40px 0; }
	.full-width .item { width: 25%; }
	.container .item { width: 25%; }
	.full-width .item .project-thumb { margin: 0px 0px 40px 40px; }
   
}


/* Small Desktop Devices [ 960px ] 
 -------------------------------- */
@media only screen and (max-width:1240px) {


	/* Countdown
	 -------------------------------- */
	.countdown .unit {
		font-size: 140px;
		height:200px;
		margin:0 10px;
	}
	.countdown .seconds {
		min-width: 140px;
	}


	/* Music
	 -------------------------------- */
	.full-width.items { margin: 40px 40px 40px 0; }
	.full-width .item { width: 33.3%; }
	.container .item { width: 33.3%; }
	.full-width .item .project-thumb { margin: 0px 0px 40px 40px; }


	/* Events
	 -------------------------------- */
	#events-list li { height: 200px; }
	#events-list li:hover { 
		height: 250px;
		margin-top: -30px;
	}	
		/* Date */
		#events-list .event-date {  }
		#events-list .event-date:before {  }
		
		/* Title */
		#events-list h2, #events-list h2 a { font-size: 48px; }
		#events-list .event-location { font-size: 16px; }


	/* Small Elements
	 -------------------------------- */

	/* Stats List */
 	ul.stats li .stat-value {font-size: 107px;}

}


/* Tablets
 -------------------------------- */
@media only screen and (min-width:768px) and (max-width:1020px) {


	/* Events
 	  -------------------------------- */

	/* Single event */
	.tickets-block {
		margin-top: 40px;
	}


	/* Contact
	 -------------------------------- */
	.col-contact-details p {
		text-align:center;
		padding:0;
	}
	.contact-link {
		font-size: 38px;
	}
	.contact-email {
		font-size:24px;
		text-transform:none;
		color:#f70;
	}


	/* Small Elements
	 ------------------------------------ */

	/* Stats List */
	ul.stats li {
		padding-bottom: 60px;
	}
	ul.stats li .stat-value {
		font-size: 130px
	}

}


/* Mobile portrait and landscape modes
 -------------------------------- */
@media only screen and (max-width:810px) {


	/* Typography
	 -------------------------------- */

	/* Content Title */
	.content-title {
		font-size: 50px;
		line-height:110%;
	}
	.sub-heading {
		font-size:18px;
	}
	.content-header .back-layer {
		font-size: 50px;
	}

	/* Extra Large heading */
	.heading-xl { 
		font-size: 40px; 
		line-height: 1.4em;
	} 

	/* Large heading */
	.heading-l { 
		font-size: 30px; 
		line-height: 1.4em;
	}

	/* Medium heading */
	.heading-m { 
		font-size: 24px; 
		line-height: 1.4em;
	}


	/* Header & Navigation
	 -------------------------------- */

	/* Logo	 */
	#logo {
		position:absolute;
		top:0;
		left:50%;
		transform:translateX(-50%);
	}

	/* Navigation list */
 	#nav { 
 		display: none;
 	}

 	/* Navigation container */
 	.nav-container {
 		padding: 0 30px;
 	}
	/* Icon navigation	 */
	#icon-nav {
		width:100%;
		margin-left:0;
		padding-left:0;
	}
	#icon-nav ul {
		padding:0;
	}
	#icon-nav li.search-trigger-wrap,
	#icon-nav li.social-trigger-wrap {
		display:none;
	}
	
	/* Player trigger */
	#icon-nav .player-trigger-wrap  {
		float:right;
	}

	/* Responsive Nav */
	#icon-nav .responsive-trigger-wrap {
    	display: block;
    	float:left;
	}
	

	/* Sections
	 -------------------------------- */
	
	/* Parallax */
	.parallax {
		background-size: cover;
		background-attachment: scroll;
		background-position: top center !important;
	}
	
	/* Section Content 	 */
	.section-content {
		padding-bottom: 80px;
	}
	/* Content header  */
	.content-header {
		margin-bottom: 40px;
	}


	/* Intro
	 -------------------------------- */
	.intro-content {
		min-height: 300px;
	}


	/* Countdown
	 -------------------------------- */
	.countdown .unit-block span {
    	top: -5px;
	}
	.countdown .unit {
		font-size: 72px;
		height: 100px;
		margin:0 10px;
	}
	.countdown .seconds {
		min-width: 76px;
	}


	/* Music
 	 -------------------------------- */
 	.music-header.section-content {
 	 	padding-bottom:40px;
	}
	.full-width.items {
		margin: 20px 20px 20px 0;
	}
	.full-width .item {
		width: 33.33%;
	}
	.container .item {
		width: 33.33%;
	}
	.full-width .item .project-thumb {
		margin: 0px 0px 20px 20px;
	}
	.item .thumb-icon {
		-webkit-transform: scale(0.8);
		 transform: scale(0.6) translate(-50%,-50%);
		 -webkit-transform-origin: left top;
		transform-origin: left top;
	}
	.item .desc-layer {
		display:none
	}


	/* Events
	 -------------------------------- */
	.section-content.events-header {
    	padding-bottom: 40px;
	}
	.events-list li {

	}
	.left-event-block {
		width:100%;
		flex-direction: column;
		align-items: flex-start;
	}
	.right-event-block {
		width:0px;
	}
	.location-event,
	.date-event {
		width:100%;
	}
	.events-list .line-link {
		position:absolute;
		left:0;
		right:0;
		top:0;
		bottom:0;
		text-indent:-999em;
	}
	.events-list .line-link:after,
	.events-list .line-link:before {
		display:none;
	}
	.event-name {
		font-size:15px;
	}
	
	/* Single event */
	.tickets-block {
		margin-top: 40px;
	}
	.big-event-date {
		bottom: -10px;
		font-size: 150px;
	}
	.event-intro-date {
    	height: 400px;
	}
	

	/* Contact
	 -------------------------------- */
	.col-contact-details p {
		text-align:center;
		padding:0;
	}
	.contact-link {
		font-size: 28px;
	}
	.contact-email {
		font-size:22px;
		text-transform:none;
		color:#f70;
	}


	/* Newsletter
	 -------------------------------- */
	#subscribe-email {
		min-width:200px;
	}
	

	/* Single Page/Project 
	 -------------------------------- */
	.page-content {
		padding-left:0;
		padding-right:0;
	}
	 .cover-holder.pull-up {
		max-width:400px;
		margin:0 auto;
		margin-top: -180px;
		margin-bottom: 30px;
	}


	/* 404
 	 -------------------------------- */
	.error-title {
		font-size: 250px;
	}
	.error-subtitle {
		margin-top: -100px;
		max-width: 500px;
		margin:50px auto 100px
	}


	/* Audio Elements
 	 -------------------------------- */

	/* Waveform */
	.track-waveform .waveform {
		height:100px;
	}

	/* Track meta */
	.track-meta-title h1 {
		font-size:28px;
	}

	/* Track details List */
	.track-details-1 {
		display: table;
		clear: both;
		margin: 0 0 60px 0;
		font-size: 15px;
	}
	.track-details-1 li {
		width: 33.33%;
	    padding: 10px 0px;
	    border-left:0;
	    border-top: 1px solid #222;
	}
	.intro-content .track-meta-top {
		margin-top:140px;
	}
	

	/* Slider
 	 -------------------------------- */
	.layers-slider-block .bx-pager {
		right: 0px;
		width: 100%;
		bottom: 0px;
		text-align:center;
		position:relative;
	}
	.layers-slider li .front-layer {
		width: 44.5%;
		position: absolute;
		bottom: 0px;
		left: 28%;
		transform:translateX(50%);
		overflow: hidden;
	}
	.layers-slider .thumb-icon {
		-webkit-transform: scale(0.8);
		 transform: scale(0.6) translate(-50%,-50%);
		 -webkit-transform-origin: left top;
		transform-origin: left top;
	}
	.layers-slider .desc-layer {
		right: 0px;
		left: 0px;
		bottom: auto;
		top:30px;
		width: 100%;
		text-transform:uppercase;
		text-align:center;
	}
	.layers-slider .desc-layer h3 {
		font-size:32px;
		line-height: 36px;
	}
	.layers-slider .desc-layer h6 {
		font-size:18px;
		line-height: 20px;
		color:#f70;
	}


	/* Small Elements
 	 -------------------------------- */

 	/* Text Slider */
 	.text-slider h2 {
 		font-size:40px;
 		line-height:42px;
 	}
 	.text-slider h6 {
 		font-size:22px;
 		line-height:24px;
 	}

	/* Thumb */
	.thumb  {
		margin: 0 auto;
		display:block;
	}

	/* Tabs */
	ul.tabs { 
		width:100%;
		height: auto;
		border: none;
		overflow: hidden;
	}
		ul.tabs li { 
			width: 100%;
		}
		ul.tabs li a { 
			margin: 0;
			width: 100%;
			border-width: 0px 1px 1px 1px;
		}
		ul.tabs li:first-child a { border-width: 1px 1px 1px 1px;}
	
}


/* Mobile portrait mode
 -------------------------------- */
@media only screen and (max-width:479px) {
	

	/* Header & Navigation
	 -------------------------------- */
	.responsive-block {
        width: 280px;
        -webkit-transform: translateX(-280px);
        -moz-transform: translateX(-280px);
        transform: translateX(-280px);
    }
    body.responsive-block-on .site, body.responsive-block-on #header, body.responsive-block-on #scamp_player {
        -webkit-transform: translateX(280px);
        -moz-transform: translateX(280px);
        transform: translateX(280px);
    }
	#responsive-nav ul li a {
		font-size:16px;
	}
    #responsive-nav {
	    padding-top: 30px;
	    margin-bottom: 0px;
	}
	

	/* Intro
	 -------------------------------- */
	.intro-content {
		min-height: 300px;
	}

	
	/* Countdown
	 -------------------------------- */
	.countdown .unit {
		font-size: 100px;
		height:120px;
		margin:0 10px;
	}
	.countdown .unit-block span {
		top:0px;
	}
	.countdown .seconds {
		min-width:100px;
	}


	/* Music
 	 -------------------------------- */
	.full-width.items {
		margin: 20px 20px 20px 0;
	}
	.full-width .item {
		width: 50%;
	}
	.container .item {
		width: 50%;
	}
	.full-width .item .project-thumb {
		margin: 0px 0px 20px 20px;
	}
	.item .thumb-icon {
		-webkit-transform: scale(0.8);
		 transform: scale(0.6) translate(-50%,-50%);
		 -webkit-transform-origin: left top;
		transform-origin: left top;
	}
	.item .desc-layer {
		display:none
	}


	/* Events
	 -------------------------------- */
	 .event-intro-date {
    	height: 30vh;
	}
	.big-event-date {
		bottom: -10px;
		font-size: 110px;
	}
	
	/* Single event */
	.event-intro-date {
    	height: 300px;
	}


	/* Newsletter
	 -------------------------------- */
	#subscribe-email {
		min-width:50px;
		width:100%;
	}

		#subscribe-submit {
			width: 100%;
		}
 	

	/* 404
 	 -------------------------------- */
	.error-title {
		font-size: 160px;
	}
	.error-subtitle {
		font-size:26px;
		max-width: 500px;
		margin:20px auto 50px
	}

	
	/* Audio Elements
 	 -------------------------------- */

    /*  Tracklist */
    .sp-tracklist li .track-row-data {
        display: block;
        width: 100%;
    }
    .sp-tracklist li .track-col.track {
        width:100%;
        display:table;
    }
    .sp-tracklist li .track-col-meta {
        width:100%;
        display:table;
        text-align: left;
        margin-top: 8px;
    }
    .sp-tracklist li .track-col-meta.track-col-mobile-hide {
    	display:none
    }
    .sp-tracklist li .track-col-meta .track-col-buttons {
        text-align:left;
        display:inline-block;
        padding-left: 0;
        min-width:0px;
        min-height: 0px;
        width:auto;
    }
    .sp-tracklist li .track-col-meta .track-col-lyrics {
        text-align:left;
        display:inline-block;
        padding-left:30px;
        min-width:0px;
        min-height:0px;
        width:auto;
    }
    .sp-tracklist li .track-col-lyrics .track-length {
        display:none;
    }

	/* Waveform */
	.track-waveform .waveform {
		height:70px;
	}

	/* Track meta */
	.track-meta-title h1 {
		width:100%;
		font-size:24px;
		margin-top:0;
		margin-bottom:0;
	}
	.track-meta-title .remixed {
		display:block;
		margin-bottom:10px;
	}
	.intro-content .track-meta-top {
		margin-top:100px;
	}

	/* Track details */
	.track-details-1 {	
		margin: 0 0 40px 0;
	}
	.track-details-1 li {
		width: 50%;
	}

	/* Desc layer*/
	.desc-layer .track-title,
	.desc-layer .track-artists {
		font-size:16px;
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
		font-family: 'Barlow Condensed', sans-serif;
	}
	.desc-layer .track-artists {
		font-size:12px;
	}


	/* Instagram
 	 -------------------------------- */
 	.instagram-images .instagram-image:nth-child(n+5) {
	   display:none
	}
	.instagram-image {
	    width:50%;
	}
	

	/* Slider
 	 -------------------------------- */
	.layers-slider .desc-layer h3 {
		font-size:22px;
		line-height: 26px;
	}
	.layers-slider .desc-layer h6 {
		font-size:16px;
		line-height: 18px;
		color:#f70;
	}


	/* Small Elements
 	 -------------------------------- */
	
	/* Text Slider */
 	.text-slider {
 		width: 90%;
 	}

 	/* Stats List  */
	ul.stats li {
		padding-bottom: 30px;
	}
	ul.stats li .stat-value {
		font-size: 60px
	}
	 
}