/*
Plugin: jQuery Parallax
Version 1.1.3
Author: Ian Lunn
Twitter: @IanLunn
Author URL: http://www.ianlunn.co.uk/
Plugin URL: http://www.ianlunn.co.uk/plugins/jquery-parallax/

License: http://creativecommons.org/licenses/by-sa/3.0/ (Attribution Share Alike). Please attribute work to Ian Lunn simply by leaving these comments in the source code or if you'd prefer, place a link on your website to http://www.ianlunn.co.uk/.
*/

#gallery .gallery-box ul li:after, #gallery .gallery-box ul li:hover:after,
#gallery .gallery-box ul li a, #gallery .gallery-box ul li:hover a,
#gallery .gallery-box ul li a:after, #gallery .gallery-box ul li:hover a:after,
.red-bttn,
.social-media a,
#menu ul li, #menu ul li a,
.accordion-box ul li a{
	-webkit-transition: all 0.5s ease;	-moz-transition: all 0.5s ease;	-ms-transition: all 0.5s ease;	-o-transition: all 0.5s ease;	transition: all 0.5s ease;}


@font-face {
	font-family:"Code-Light";
	src:url("fonts/CODE_Light.eot?") format("eot"),
		url("fonts/CODE_Light.woff") format("woff"),
		url("fonts/CODE_Light.ttf") format("truetype"),
		url("fonts/CODE_Light.svg#Code-Light") format("svg");
	font-weight:normal;
	font-style:normal;
}
@font-face {
    font-family: 'ralewaylight';
    src: url('fonts/raleway-light-webfont.eot');
    src: url('fonts/raleway-light-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/raleway-light-webfont.woff') format('woff'),
         url('fonts/raleway-light-webfont.ttf') format('truetype'),
         url('fonts/raleway-light-webfont.svg#ralewaylight') format('svg');
    font-weight: normal;
    font-style: normal;

}


body{
	margin: 0;
	padding: 0;
}
*{ margin:0; padding:0;}
p{
	margin: 0 0 20px 0;	
	font:normal 16px/24px 'ralewaylight', Arial, Helvetica, sans-serif; color:#a7a7a7;
}

p, ul{
	font-weight:200;
	font-style:normal;
	list-style:none;
}

img{
	border: 0;
}

h1, #pixels{
	font-weight:700;
	font-style:normal;
}

h2{
	/*font-family:"Beau Sans Pro Book", Verdana, sans-serif;*/
	font-size-adjust:0.531;
	font-weight:500;
	font-style:normal;
}
input[type="text"]{padding:11px 0; height:25px; border:solid 1px #1e2122; background:url(images/input-icon.png) no-repeat 3px 9px rgba(5,5,5,.8); color:#56595a; font:normal 15px/21px 'ralewaylight', Arial, Helvetica, sans-serif; margin-top:10px; text-indent:30px;}
input[type="text"] placeholder{color:#56595a;}
textarea{padding:11px 0px; height:130px; border:solid 1px #1e2122; background:url(images/input-icon.png) no-repeat 3px -566px rgba(0,0,0,.8); color:#56595a; font:normal 15px/21px 'ralewaylight', Arial, Helvetica, sans-serif; margin-top:10px; resize:none; text-indent:30px;}

input[type="text"]:focus, textarea:focus{border:solid 1px rgba(81,12,15,1); background-color:rgba(0,0,0,1);
-webkit-box-shadow: 0 0 8px -1px rgba(81,12,15,1);
box-shadow: 0 0 8px -1px rgba(81,12,15,1);}
input[type="text"]:focus{}


input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {color:#929596;}/* WebKit browsers */
input:-moz-placeholder, textarea:-moz-placeholder {color:#929596;}/* Mozilla Firefox 4 to 18 */
input::-moz-placeholder, textarea::-moz-placeholder {color:#929596;}/* Mozilla Firefox 19+ */
input:-ms-input-placeholder, textarea:-ms-input-placeholder {color:#929596;} /* Internet Explorer 10+ */

input[type="button"].red-bttn{width:auto; min-width:90px; border:0; outline:0; padding:10px 25px; background:rgba(204,32,39,1.0); color:#fff; font:normal 16px/16px 'ralewaylight', Arial, Helvetica, sans-serif; float:left; margin-top:20px; text-decoration:none; text-align:center; cursor:pointer;}
input[type="button"].red-bttn:hover{background:/*rgba(34,36,36,1.0)*/#fff; /*color:#cc2027;*/ color:#000;}


#header h1, #pixels{
	color: #48941A;
}

.float-left{
	float: left;	
	margin: 0 0 0 20px;
}

.float-right{
	float: right;
	margin: 0 20px 0 0;
}

.center{
	font-size: 2.5em;
	padding: 80px 0 0 0;
	text-align: center;
}

.logo{ width:143px; height:39px; float:left; margin-top:80px;}


#intro, #about, #gallery, #concerts, #contact{
	width: 100%; overflow:hidden;
}

#intro{
	background:url(images/firstBG.jpg) 50% 0 no-repeat fixed #000000;
	color: white;
	min-height: 800px;
	margin: 0 auto;
	padding: 0;
	background-size:cover;
}

#intro .bg1{
	background: url(images/banner-1.png) 50% 60px no-repeat fixed;
	min-height: 1300px;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	width:100%;
	z-index:95;
	left:0;
	
}
#intro .bg2{
	background: url(images/light-metter.png) 50% 60px no-repeat fixed;
	min-height: 2000px;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	max-width:1100px;
	z-index:97;
	width:100%;
}
#intro .logo{
	height: 223px;
	margin-left:-230px;
	padding: 0;
	position:relative;
	max-width:460px;
	z-index:115;
	left:50%;
	width:100%;
}

#about{
	background: url(images/secondBG.jpg) 50% 0 no-repeat fixed #101313;
	color: white;
	min-height: 780px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
	position:relative;
	z-index:999;
	background-size:cover;
}

#about:after{ content:""; width:100%; position:absolute; top:0; left:0; z-index:9999999; height:60px;
-webkit-box-shadow:inset 0 30px 30px 0 rgba(0,0,0,.9);
box-shadow:inset 0 30px 30px 0 rgba(0,0,0,.9);
}
#about:before{ content:""; width:100%; position:absolute; bottom:0; left:0; z-index:9999999; height:60px;
-webkit-box-shadow:inset 0 -30px 30px 0 rgba(0,0,0,.9);
box-shadow:inset 0 -30px 30px 0 rgba(0,0,0,.9);
}
#about .bg{
	background: url(images/trainers.png) 50% 40% no-repeat fixed;
	min-height: 2000px;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	/*max-width:1100px;*/
	width:100%;
	z-index: 200;
}

#about .bg-shadow{
	background: url(images/shadow.png) 50% 0 no-repeat fixed;
	min-height:2000px;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	width:100%;
	/*max-width:1100px;*/
	z-index: 200;
}

.about-us-image{width:auto; height:auto; float:right; position:relative; z-index:215; top:230px; right:40px; display:none;}

#gallery{
	background: url(images/thirdBG.jpg) 50% -100px no-repeat fixed #000 !important;
	color: white;
	min-height: 800px;
	padding:0 0 0 0;
	position:relative;
	background-size:cover;
	z-index:999;
}

#gallery .content{width:100%; text-align:center; padding-top:70px; position:relative; z-index:203;}
#gallery .content h2{width:65%; margin:0 auto; float:none; font:normal 60px/60px 'ralewaylight', Arial, Helvetica, sans-serif; color:#fff; text-align:center;}
#gallery .content h2 span.red{color:#cc2027;}
#gallery .content p{width:65%; margin:10px auto 0 auto; float:none; color:#fff; text-align:center;}

#gallery .gallery-bg{
	background: url(images/gallery-back-frame.png) 50% 0 no-repeat fixed;
	min-height:2000px;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	width:100%;
	max-width:1100px;
	z-index: 200;
}

#gallery .gallery-front-right{
	background: url(images/gallery-front-frame-rght.png) right 0 no-repeat fixed;
	min-height:2000px;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	width:230px;
	z-index: 210;
	right:0;
}
#gallery .gallery-front-left{
	background: url(images/gallery-front-frame-left.png) center 0 no-repeat fixed;
	min-height:2000px;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	width:244px;
	z-index: 210;
	left:0;
}

#gallery .gallery-box{width:100%; float:left; position:relative; z-index:205;}
#gallery .gallery-box ul{ width:100%; float:left; text-align:center; display:flex;}
#gallery .gallery-box ul li{width:23.64%; min-width:265px; margin:20px 14px 20px 0; float:left; display:block; vertical-align:top; position:relative;
-webkit-transition: all 1s ease;	-moz-transition: all 1s ease;	-ms-transition: all 1s ease;	-o-transition: all 1s ease;	transition: all 1s ease;
}

#gallery .gallery-box ul li:after{content:""; width:80%; height:1px; position:absolute; background:rgba(0,0,0,0.6); bottom:15px; left:50%; margin-left:-40%; z-index:199; opacity:0;

-webkit-box-shadow:0 0px 10px 10px 0 rgba(0,0,0,.6);
box-shadow:0 0px 10px 10px rgba(0,0,0,.6);

-webkit-border-radius: 50%;
border-radius: 50%;
-webkit-transition: all 1s ease;	-moz-transition: all 1s ease;	-ms-transition: all 1s ease;	-o-transition: all 1s ease;	transition: all 1s ease;
}

#gallery .gallery-box ul li:hover:after{ bottom:-15px; left:50%; margin-left:-40%; opacity:1;
-webkit-transition: all 0.5s ease;	-moz-transition: all 0.5s ease;	-ms-transition: all 0.5s ease;	-o-transition: all 0.5s ease;	transition: all 0.5s ease;}

#gallery .gallery-box ul li a{border:solid 10px #fff; float:left; margin:0; padding:0; position:relative; z-index:205; overflow:hidden;
-webkit-transition: all 1s ease;	-moz-transition: all 1s ease;	-ms-transition: all 1s ease;	-o-transition: all 1s ease;	transition: all 1s ease;
}
#gallery .gallery-box ul li a:after{content:""; width:100%; height:100%;  background:none no-repeat center 50% rgba(0,0,0,0); display:block; position:absolute; top:0; left:0; opacity:0;
-webkit-transition: all 1s ease;	-moz-transition: all 1s ease;	-ms-transition: all 1s ease;	-o-transition: all 1s ease;	transition: all 1s ease;}
#gallery .gallery-box ul li:hover a:after{background:url(images/zoom.png) no-repeat center 45%; opacity:1;
-webkit-transition: all 0.5s ease;	-moz-transition: all 0.5s ease;	-ms-transition: all 0.5s ease;	-o-transition: all 0.5s ease;	transition: all 0.5s ease;
}

#gallery .gallery-box ul li a span{ width:100%; height:40px; position:absolute; bottom:-36px; left:0; opacity:0; text-align:center; z-index:250;
-webkit-transition: all 0.5s ease;	-moz-transition: all 0.5s ease;	-ms-transition: all 0.5s ease;	-o-transition: all 0.5s ease;	transition: all 0.5s ease;
font:600 13px/17px Arial, Helvetica, sans-serif; color:#bf3826;}

#gallery .gallery-box ul li:hover a span{bottom:5px; left:0; opacity:1;}

#gallery .gallery-box ul li a span span{ width:100%; float:left; position:inherit; left:inherit; height:auto;
font:normal 13px/17px Arial, Helvetica, sans-serif; color:#7a7d7f;}

#gallery .gallery-box ul li a img{display:list-item; width:100%; height:auto;}
#gallery .gallery-box ul li:hover a img{
}
#gallery .gallery-box ul li:hover a{border:solid 10px #000;
-webkit-transition: all 0.5s ease;	-moz-transition: all 0.5s ease;	-ms-transition: all 0.5s ease;	-o-transition: all 0.5s ease;	transition: all 0.5s ease;}


#gallery .gallery-box ul li a img { -webkit-transform: scale(1.0); -moz-transform: scale(1.0); -ms-transform: scale(1.0); transform: scale(1.0);
-webkit-transition: all .6s ease-in-out; -moz-transition: all .6s ease-in-out; -ms-transition: all .6s ease-in-out; transition: all .6s ease-in-out; }

#gallery .gallery-box ul li:hover a img { -webkit-transform: scale(2.0); -moz-transform: scale(2.0); -o-transform: scale(2.0); -ms-transform: scale(2.0); transform: scale(2.0); }


#fifth{
	background: #ccc;
	height: 400px;
	margin: 0 auto;
	padding: 40px 0 0 0;
}

.story{
	margin: 0 auto;
	max-width: 1100px;
	width: 100%;
	
}

#concerts{
	background: url(images/concert-bg.jpg) 50% 0 repeat-y fixed #000;
	color: white;
	min-height: 800px;
	padding:0 0 0 0;
	position:relative;	
	background-size:cover;
}
#concerts:after{ content:""; width:100%; position:absolute; top:0; left:0; z-index:9999999; height:60px;
-webkit-box-shadow:inset 0 30px 30px 0 rgba(0,0,0,.9);
box-shadow:inset 0 30px 30px 0 rgba(0,0,0,.9);
}
#concerts:before{ content:""; width:100%; position:absolute; bottom:0; left:0; z-index:9999999; height:100px;
-webkit-box-shadow:inset 0 -40px 50px 0 rgba(255, 255, 255, 0.08);
box-shadow:inset 0 -40px 50px 0 rgba(255, 255, 255, 0.08);
}

#concerts .conterts-bg{
	background: url(images/concert-bg.png) 50% 0 no-repeat fixed;
	min-height: 2000px;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	width:100%;
	max-width:1100px;
	z-index: 200;
}

#concerts .content{
	padding:0;
	position: relative;
	width:65%;
	text-align:left;
	margin:100px 0 0 0;
	top:0;
	 z-index:220;
}
#concerts .content h2{width:100%; float:right; text-align:right; font:normal 60px/60px 'ralewaylight', Arial, Helvetica, sans-serif; color:#fff; margin-bottom:20px;}
#concerts .content h2 span{color:#cc2027;}
#concerts .content p{text-align:right; color:#fff;}

#concerts .concert-time{ width:50%; position:relative; z-index:300; float:right; clear:right; margin-top:30px;}

  
.pttrn{width:100%; height:100%; float:left; position:absolute; background: url(images/pttrn.png) 0 0 repeat fixed;}

#menu-icon a.menu-bttn{width:45px; height:30px; position:absolute; right:20px; top:20px; display:block; text-indent:-999px; overflow:hidden; background:url(images/menu-icon.png) no-repeat 0 0; z-index:9999999;}

#menu{width:120px; height:auto; position:fixed; right:20px; top:20px; z-index:99; display:none;}
#menu ul{width:120px; float:left;}
#menu ul li{width:100%; float:left; margin-top:10px; border-right:solid 1px #7d1419;}

#menu ul li a{width:auto; display:inline-block; background:#000; text-transform:uppercase; color:#a3a3a3; float:right;  padding:7px 10px 5px 10px; text-align:right; font:normal 16px/16px 'ralewaylight', Arial, Helvetica, sans-serif; text-decoration:none;}
#menu ul li:hover a, #menu ul li.active a{color:#fff; background:none repeat scroll 0 0 #B0161C;}

#intro .banner-text{
	padding:0;
	position: relative;
	width:100%;
	float:left;
	text-align:center;
	margin:0;
	top:0;
	z-index:117;
}
	
#intro .banner-text h2{width:75%; margin:30px auto 0 auto; float:none; font:normal 80px/80px 'Code-Light', Arial, Helvetica, sans-serif; color:#fff;}
#intro .banner-text p{width:75%; margin:10px auto 0 auto; float:none; font:normal 40px/40px 'Code-Light', Arial, Helvetica, sans-serif; color:#fff;}

.about-us{
	padding:0;
	position: relative;
	width:55%;
	text-align:left;
	margin:0;
	top:100px;
	 z-index:220;
}
.about-us h2{width:100%; float:left; font:normal 60px/60px 'ralewaylight', Arial, Helvetica, sans-serif; color:#fff; margin-bottom:20px;}
.about-us h2 span{color:#cc2027; width:100%; display:table;}
.about-us h2 span.small{color:#cc2027; width:100%; display:table; font-size:30px; line-height:40px;}

.scroll{ width:124px; height:124px; display:block; text-indent:-999px; overflow:hidden; background:url(images/scroll.png) no-repeat -3px -3px; margin:80px auto;
-webkit-border-radius: 50%;
	border-radius: 50%;}
.scroll:hover{ background:url(images/scroll.gif) no-repeat -3px -3px;}

.social-media{width:100%; height:40px; position:fixed; bottom:0; left:0; background:rgba(0,0,0,0.3); z-index:9999999;}
.social-media:hover{background:rgba(0,0,0,0.5);}
.social-media a{width:18px; height:18px; display:block; padding:3px; float:left; margin-right:10px; margin-top:10px; text-indent:-99px; overflow:hidden;
	-webkit-border-radius: 50%;
	border-radius: 50%;
}
.social-media a:first-child{margin-left:20px;}
.social-media a.twitter{background:url(images/social.png) no-repeat 3px 3px rgba(255,255,255,0.0);}
.social-media a.vimeo{background:url(images/social.png) no-repeat -33px 3px rgba(255,255,255,0.0);}
.social-media a.facebook{background:url(images/social.png) no-repeat -69px 3px rgba(255,255,255,0.0);}

.social-media a.twitter:hover{background:url(images/social.png) no-repeat 3px 3px rgba(255,255,255,1.0);}
.social-media a.vimeo:hover{background:url(images/social.png) no-repeat -33px 3px rgba(255,255,255,1.0);}
.social-media a.facebook:hover{background:url(images/social.png) no-repeat -69px 3px rgba(255,255,255,1.0);}

.red-bttn{width:auto; min-width:90px; padding:15px 25px; background:rgba(204,32,39,1.0); color:#fff; font:normal 16px/16px 'ralewaylight', Arial, Helvetica, sans-serif; float:left; margin-top:20px; text-decoration:none; text-align:center;}
.red-bttn:hover{background:/*rgba(34,36,36,1.0)*/#fff; /*color:#cc2027;*/ color:#000;}

#gallery .red-bttn{ float:none; display:inline-block;}



#contact{
	background: url(images/contact-bg.jpg) 50% 0 no-repeat fixed #000000;
	color: white;
	min-height: 785px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0;
	position:relative;
	z-index:999;
	background-size:cover;
	width:100%;
}

#contact .contact-bg{
	background: url(images/contct-bg-02.png) 50% 40% no-repeat fixed;
	min-height: 2000px;
	margin: 0 auto;
	padding: 0;
	position: absolute;
	width:100%;
	z-index: 200;
	background-size:cover;
}

.contact{
	padding:0;
	position: relative;
	width:40.91%;
	text-align:left;
	margin:0;
	top:100px;
	 z-index:220;
}
.contact h2{width:100%; float:left; font:normal 60px/60px 'ralewaylight', Arial, Helvetica, sans-serif; color:#fff; margin-bottom:20px;}
.contact h2 span{color:#cc2027;}
.contact p{color:#6A7071;}

.contact-form{width:100%; float:left;}
.contact-form form{ width:100%; float:left;}
.contact-form form input[type="text"], .contact-form form textarea{width:100%; float:left; position:relative;}

.contact-form form input[type="text"].name{}
.contact-form form input[type="text"].email{ background-position:3px -90px;}
.contact-form form input[type="text"].phone{ background-position:3px -189px;}

.contact-form .red-bttn{margin-top:10px;}
.contact-image{width:42.73%; float:right; background:#fff; position: relative; z-index:225; top:258px;}
.contact-image img{ margin:10px; width:auto;}


.copy-right{width:100%; max-width:350px; float:left; padding:5px; background-color:#dff1f7; clear:left; margin-top:120px; position:relative; z-index:275;}
.copy-right p{ display:table; clear:left; font:normal 14px/16px 'ralewaylight', Arial, Helvetica, sans-serif; color:#2a2d2f; margin:5px 0;}
.copy-right p a{color:#cc2027; text-decoration:none;}
.copy-right p a:hover{color:#2a2d2f; text-decoration:underline;}




/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------ */
/*Vertical scrollbar - set width and height of a div you want to add a scrollbar to*/
        #vertical-scrollbar-demo {
            height: 100px;
            width: 400px;
        }

            /*Horizontal scrollbar - set width and height of a div you want to add a scrollbar to*/
        #horizontal-scrollbar-demo {
            width: 400px;
            height: 380px;
        }

            /*Horizontal scrollbar - set width of overview or make it expand horizontal like below*/
        #horizontal-scrollbar-demo .overview {
            /*width: 1836px;*/
            /* or */
            white-space: nowrap;
        }

        #horizontal-scrollbar-demo img {
            height: 180px;
            width: 180px;
        }

            /*Vertical and horizontal scrollbar - set width and height of a div you want to add a scrollbar to*/
        #vertical-horizontal-scrollbar-demo {
            width: 400px;
            height: 380px;
        }

        #vertical-horizontal-scrollbar-demo .overview {
            width: 600px;
        }

            /* Vertical and horizontal scrollbar - one extra step required - add width of overview - overall width of scrolled content*/
        #min-thumb-size-demo .overview {
            width: 600px;
        }

            /*Vertical and horizontal scrollbar - set width and height of a div you want to add a scrollbar to*/
        #min-thumb-size-demo {
            width: 400px;
            height: 380px;
        }

            /* Vertical and horizontal scrollbar - one extra step required - add width of overview - overall width of scrolled content*/
        #min-thumb-size-demo .overview {
            width: 600px;
        }

        #min-thumb-size-demo .vertical .thumb {
            min-height: 150px;
        }

        #min-thumb-size-demo .horizontal .thumb {
            min-width: 300px;
        }

        #fixed-thumb-size-demo {
            width: 400px;
            height: 380px;
        }

            /* Vertical and horizontal scrollbar - one extra step required - add width of overview - overall width of scrolled content*/
        #fixed-thumb-size-demo .overview {
            width: 600px;
        }
		
.overlay_content{position:absolute !important; width:100% !important; left:0 !important; top:0 !important; height:100% !important; background-color:rgba(0,0,0,0.8)!important; display:none; border:0 !important; z-index:99999999999999 !important}

.overlay_content_inner{width:80%; max-width:600px;  padding:20px; margin:15% auto; background-color:#000; position:relative; z-index:9999999999999; border:solid 1px rgba(204,32,39,0.3);-webkit-box-shadow: 0 0 15px -1px rgba(81,12,15,1);
box-shadow: 0 0 15px -1px rgba(81,12,15,1);}

.overlay_content_inner #contentpop{ height:250px; overflow-y:auto; margin-bottom:0; }
.overlay_content_inner #contentpop span{height:20px; display: block;}
#close{ position:absolute; right:-15px; top:-15px; width:28px; height:30px; display:block; text-indent:-999px; overflow:hidden; background: url(images/close.png) 0 0 no-repeat;}

.field_box{position:relative; float:left; width:100%;}
.field_box span{ position:absolute; top:20px; left:30px; color:#CC2027; background-color:#000; padding:5px; font:15px/21px 'ralewaylight',Arial,Helvetica,sans-serif; display:none}
.mCSB_scrollTools{}


#gallery .gallery-box ul.photo-gallery
{
	display:block !important;
}
#gallery .gallery-box ul.photo-gallery li
{
	min-width:260px !important;
}