/* Scrollbar Style
 ############################## */
.jspTrack {
    background:#efefef;
}
.jspDrag {
    background:#9d8b8b;
}
/* End Scrollbar Style
 ############################## 
 ############################## */

body{
	background-color:#ffffff;
	-webkit-user-select: none;       
	-moz-user-select: none;
	-ms-user-select: none;
}

.ui-mobile .ui-page {
    background-color:#ffffff;
    text-shadow: 0px 0px 0px #F3F3F3;
}

.book {font-family: 'Montserrat', sans-serif; font-weight: 400;}
.bold {font-family: 'Montserrat', sans-serif; font-weight: 700;}

a:link{ color:#898b8b; text-decoration:none; }
a:visited{ color:#898b8b; text-decoration:none; }
a:hover{ color:#404444; }

.ui-link, .ui-page-theme-a a, html .ui-bar-a a, html .ui-body-a a, html body .ui-group-theme-a a {
   color: #898b8b;
}

.vertical-center {
	overflow:hidden;
    width:100%;
	min-height: 100%;  /* Fallback for browsers do NOT support vh unit */
	min-height: 100vh; /* These two lines are counted as one :-)       */
	display: -webkit-flex; /* Safari */
    -webkit-align-items: center; /* Safari 7.0+ */
    display: flex;
    align-items: center;
}


body.small #main.container {
    width:991px;
}

breaker{
	display:block;
}

#main-bg {
    background:url(../images/slide1-flow.jpg) center no-repeat; 
    background-size: 1600px 1600px;
    position:fixed;
    top:0px;
}

.container{
	padding:0px;
	overflow:hidden;
}

.box{
	left:0%;
	width:100%;
	height:30.4%;
	position:absolute;
}

.boxbottom{
	top:53.9%;
}

.boxtop{
	top:5.4%;
}

.homevideo{
	top:5.4%;
	left:0%;
	width:100%;
	height:100%;
	position:absolute;
}

#hv_close {
	position:absolute;
	left:96%;
	top:0.8%;
	cursor:pointer;
	width:3.3%;
	height:4.3%;
}

#hv_buy {
	position:absolute;
	left:42.4%;
	top:67.3%;
	cursor:pointer;
	width:15.2%;
	height:5%;
}

#hv_cta {
	position:absolute;
	left:0%;
	top:5.4%;
	width:100%;
	height:9.7%;
}

.headfont{
	color:#404444;
	text-align:center;
    font-size: 16pt;
    letter-spacing: 3px;
    text-align:center;
}

.academysub{
	color:#898b8b;
    font-size: 7pt;
    letter-spacing: 0px;
    line-height:7px;
}

.name{
    font-size: 11pt;
    letter-spacing: 1px;
}

.allnames{
	top:1%;
}


.subfont{
	color:#898b8b;
	text-align:center;
	font-size:13pt;
	letter-spacing: 2px;
    text-align:center;
}


.navfont {
	text-align:center;
	color:#898b8b;
	font-size: 20pt;
    letter-spacing: 1px;
    cursor:pointer;
    line-height:28pt;
}

.navcontainer{
	position:absolute;
	height:4.6%;
	width:100%;
	top:85.5%;
	left:8%;
}

.navbox, ticketbox{
	height:100%;
	position:relative;
	background:#f3f3f3;
	border: 1px solid #898b8b;
	float:left;
	margin-left:2%;
}

.trailerbox{
	width:10%;
}

.castbox{

	width:20%;
}

.storybox{

	width:10%;
}

.postersbox{

	width:13%;
}

.lovebox{

	width:19%;
}

.ticketsbox{
	top:-12px;
	right:-12px;
	position:absolute;
	width:125px;
	height:45px;
}

.ticketbox{
	border-radius: 12px;
	border: 1px solid #898b8b;
	background:#f3f3f3;
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
}

.ticketfont {
	text-align:left;
	padding-left:8px;
	padding-top:10px;
	color:#898b8b;
	font-size: 14pt;
    letter-spacing: 1px;
    cursor:pointer;
    line-height:28pt;
}

#fader-story{
	position:absolute;
	background:#efefef;
	left:0%;
	width:100%;
	height:7%
}

.date {
	width:80%;
	bottom:5%;
	left:10%;
	position:absolute;
	font-size: 15pt;
    letter-spacing: 0.5px;
}

.breakpoint{
	display:none;
}

.breakhide{
	display:inline;
}

.storyfont{
	color:#808080;
	text-align:center;
	font-size:13pt;
	letter-spacing: 1px;
    text-align:center;
}

#storypad{
	padding:30px 40px 10px 40px;
}

#storybg{
	padding-left:40px;
	padding-right:40px;
}

#crewpad{
	margin:0px; padding-top:55px; padding-bottom:0px; width:100%;
}

#arrow-l{
	position:absolute;
	margin-left:50%; margin-right:50%; left:-500px;
	width:40px;
	top:140px;
}

#arrow-r{
	position:absolute;
	margin-left:50%; margin-right:50%; left:460px;
	width:40px;
	top:140px;
}

#castleftarrow, #castrightarrow{
	width:100%;
	height:auto;
}

#castimgsize{
	height:250px;
	width:250px;
}

#casttxt{
	top:27px;
	margin-left:50%; margin-right:50%; left:-200px;
	padding-bottom:27px;
}


#castimg{
	position:absolute; margin-left:50%; margin-right:50%; left:-450px;
}

#casttxtblock{
    width:635px; height:220px; overflow: auto; padding-right:10px;
}

#crewtxt{
	margin-left:50%; margin-right:50%; left:-500px;
	padding-bottom:35px;
}

bold{
	font-weight: bold;
}

#crewtxtblock{
    width:1000px; height:185px;
}

#castname{
	position:absolute;
	font-size: 14pt;
	margin-left:50%; margin-right:50%; left:-185px;
	color:#000;
	width:300px;

}

.castfont, .castfonttext{
	color:#808080;
	font-size:12pt;
	letter-spacing: 1px;
    text-align:left;
}

.castfonttext{
	line-height:20px;
}

.closefont, .closefontTrailer, .closefontCast {
	text-align:center;
	color:#898b8b;
	font-size: 12pt;
    letter-spacing: 2px;
    background:#c6c6c6;
    padding:5px 5px 2px 5px;
    cursor:pointer;
    margin:0 auto;
    width:100px;
}

.closefontTrailer, {
	position:absolute;
	margin:0px;
    right:10px;
    top:-40px;
    width:100px;
}

.closefontCast {
	position:absolute;
	margin:0px;
    right:10px;
    top:-37px;
    width:100px;
}

.trailerbtn{
	left:10px;
    width:150px;
}

.musicbtn{
	left:170px;
    width:150px;
}

/*MENU ///////////*/

.crewmenu{
	left:110px;
    width:240px;
    height:20px;
}

.castmenu{
	left:10px;
    width:198px;
    height:20px;
}

.castmenunav, .crewmenunav{
	top:-11px;
	height:115px;
	position:absolute;
	background:#f3f3f3;
	border: 1px solid #898b8b;
}

.crewmenunav{
	height:345px;
}


.castmenufont {
	padding:5px 5px 2px 5px;
	text-align:left;
	color:#898b8b;
	font-size: 12pt;
    letter-spacing: 2px;
    cursor:pointer;
}

.castline{
     color: #898b8b;
     background: #898b8b; 
     width: 100%; 
     height: 1px;
}


/*MENU ///////////*/

.castbtn1{
	left:10px;
    width:90px;
}

.crewbtn1{
	left:110px;
    width:90px;
}

.videonavfont {
	padding:5px 5px 2px 5px;
	text-align:center;
	color:#898b8b;
	font-size: 12pt;
    letter-spacing: 2px;
    cursor:pointer;
}

.videonav{
	top:-40px;
	height:30px;
	position:absolute;
	background:#f3f3f3;
	border: 1px solid #898b8b;
}

.castnav{
	top:-40px;
	height:30px;
	position:absolute;
	background:#f3f3f3;
	border: 1px solid #898b8b;
}

.postersbtn {
	top:-36px;
	position:absolute;
	margin-left:50%;
	margin-right:50%;
}

.modal-content{
	background-color: #ffffff;
	box-shadow: 0px 0px 0px #000;
	border:0px;
	border-radius:0px;
}

.modal-open .modal{
	background: #ffffff;
	padding-left: 0px !important;
	padding-right: 0px !important;
}
.modal-backdrop{
	 opacity: 1 !important;
	 background-color: #ffffff;
}


.download-btn-over{
	display:block;
	opacity: 0;
}

#inspired {
	width:100%;
	top:37%;
	position:absolute;
}

#academy{
	width:100%;
	top:50.5%;
	position:absolute;
}

#legal{
	width:100%;
	height:80px;
	position:fixed;
	bottom:0px;
	overflow:hidden;
	font-size: 7pt;
	line-height: 10px;
    text-align:center;
    color:#808080;
    background:#ffffff;
	z-index:9999;
		border: 3px solid #ffffff;
}

#legal-btn{
	width:100px;
	font-size: 11pt;
	margin-top:5px;
	margin-bottom:10px;
	cursor:pointer;
	margin-left:50%;
	margin-right:50%;
	left:-50px;
	position:relative;
}

#lglogo{
	position:absolute;
	top:40px;
	left:-280px;
	margin-left:50%;
	margin-right:50%;
}

#summitlogo{
	position:absolute;
	top:25px;
	left:-220px;
	margin-left:50%;
	margin-right:50%;
}

#rating{
	position:absolute;
	top:40px;
	left:160px;
	margin-left:50%;
	margin-right:50%;
}

.social {
	position:absolute;
	margin-left:50%;
	margin-right:50%;
	width:18px;
	height:18px;
}

#fb.social{
	background-image: url("../images/facebook.png");
	left:-103px;
}

#tw.social{
	background-image: url("../images/twitter.png");
	left:-75px;
}

#ig.social{
	background-image: url("../images/instagram.png");
	left:57px;
}

#yt.social{
	background-image: url("../images/youtube.png");
	left:85px;
}


@media (min-width: 1200px) {
    #main.container {        
        width: 1200px;
    }
    
    body.small .navfont {
        font-size: 16pt;
        line-height:23pt;
    }

    body.small .headfont{
        font-size: 14pt;
    }

    body.small .subfont{
        font-size:11pt;
    }
    
}

@media (max-width : 1199px){
.navfont,
body.small .navfont {
	font-size: 16pt;
	line-height:23pt;
}

.headfont,
body.small .headfont{
    font-size: 14pt;
}

.subfont,
body.small .subfont{
	font-size:11pt;
}

.date {
	font-size: 13pt;
}

}
     

@media (max-width : 991px){

#arrow-l{
	left:-380px;
}

#arrow-r{
	left:340px;
}

#castname{
	left:-77px;
	width:200px;
}

#crewtxt{
	left:-385px;
}

#crewtxtblock{
    width:780px; height:165px;
}

.ticketsbox{
	top:-12px;
	right:-12px;
	position:absolute;
	width:125px;
	height:45px;
}

.crewmenu{
	left:100px;
    width:205px;
    height:20px;
}

.castmenu{
	left:10px;
    width:173px;
    height:20px;
}

.castmenunav, .crewmenunav{
	top:-12px;
	height:102px;
}

.crewmenunav{
	height:305px;
}


.castmenufont {
	font-size: 10pt;
}


#castimg{
	left:-330px;
}

#castimgsize{
	height:240px;
	width:240px;
}

#casttxt{
top:24px;
	left:-90px;
	padding-bottom:24px;
}

#casttxtblock{
	width:405px;
	height:220px;
}

.castfont{
	font-size:10pt;
}

.closefont, .closefontTrailer, .closefontCast {
	font-size: 9pt;
    width:77px;
    padding:5px 5px 4px 5px;
}

.trailerbtn{
	left:10px;
    width:80px;
}

.musicbtn{
	left:100px;
    width:130px;
}

.castbtn1{
	left:10px;
    width:80px;
}

.crewbtn1{
	left:100px;
    width:80px;
}

.videonavfont {
	padding:5px 5px 4px 5px;
	font-size: 9pt;
}

.videonav, .castnav{
	height:26px;
}

.castnav{
	top:-37px;
}


.postersbtn {
	top:-33px;
}

.postertxt {
	width:100px;
}


.navfont,
body.small .navfont {
	font-size: 13pt;
		line-height:17pt;
}

.headfont,
body.small .headfont{
    font-size: 11pt;
}

.subfont,
body.small .subfont{
	font-size:10pt;
}

.storyfont{
	font-size:2vw;
}

#academy{
	top:50.1%;
}

#inspired {
	top:36.2%;
}

.allnames{
	top:0.75%;
}

.date {
	font-size: 10pt;
}


}   

@media (max-width : 768px){

#arrow-l{
	top:310px;
	left:10%;
	margin:0px;
}

#arrow-r{
	top:310px;
	left:26%;
	margin:0px;
}

#castleftarrow, #castrightarrow{
	width:70%;
}

#castname{
	font-size:2.5vw;
	margin:0px;
	left:39%;
	width:64%;
}

breaker{
	display:none;
}

#crewtxt{
	width:100%;
	left:0%;
	margin:0px;
}

#crewtxtblock{
left:0%;
    width:100%;
    margin-left:0px;
    margin-right:0px;
    height:auto;
    margin-bottom:-60px;
    
}

.ticketsbox{
	top:-12px;
	right:-25px;
	position:absolute;
	width:125px;
	height:45px;
}
.ticketfont {
	padding-left:8px;
	padding-top:10px;
	font-size: 12pt;
}

#crewpad{
	padding-top:35px; padding-bottom:40px;
}

#castimgsize{
	height:100%;
	width:100%;
}

#castimg{
	margin:0px;
	left:2%;
	width:35%;
	height:auto;
}

#casttxt{
	width:64%;
	left:37%;
	margin:0px;
}

#casttxtblock{
	width:100%;
	height:240px;
}

.castfont, .castfonttext{
	font-size:2.2vw;
}

.castfonttext{
	line-height:3vw;
}

.allnames{
	top:0.5%;
}
    
.headfont,
body.small .headfont{
	font-size:2.1vw;
	letter-spacing:0.1vw;
}

.navfont,
body.small .navfont {
	font-size: 2.2vw;
	line-height:3.2vw;
}

#fader{
	bottom:8.1%;
	left:0%;
	width:100%;
	height:10%
}

.date {
	font-size:1.9vw;
	letter-spacing:0vw;
}

.subfont,
body.small .subfont{
	font-size:2vw;
	letter-spacing: 0.3vw;
}

.storyfont{
	font-size:3vw;
}

#storypad{
	padding:35px 10px 5px 10px;
}

#fader-story{
	height:5%
}

#academy{
	top:50.7%;
}

#inspired {
	top:36.5%;
}

.academysub{
    font-size: 1.2vw;
    line-height:1vw;
}

.name{
    font-size: 2vw;
    letter-spacing: 0.2vw;
}

}
     

@media (max-width: 620px) {

#arrow-l{
	top:260px;
}

#arrow-r{
	top:260px;
}


#castleftarrow, #castrightarrow{
	width:50%;
}

#castname{
	left:41%;
	font-size:3vw;
}

#castimg{
	margin:0px;
	left:3%;
	width:36%;
	height:auto;
}

#casttxt{
	width:62%;
	left:38%;
	margin:0px;
}

#casttxtblock{
	width:100%;
	height:240px;
}

#crewtxtblock{
    margin-bottom:-15px;
    
}

.ticketsbox{
	top:-18px;
	right:-38px;
	position:absolute;
	width:110px;
	height:42px;
}
.ticketfont {
	padding-left:8px;
	padding-top:10px;
	font-size: 8pt;
}


#crewpad{
	padding-top:35px; padding-bottom:0px;
	margin-bottom:0px;
}


.navfont,
body.small .navfont {
	font-size: 2.2vw;
	line-height:3vw;
}

.navcontainer {
	left:4%;
}

.trailerbox{
	width:11%;
}

.castbox{

	width:21%;
}

.storybox{

	width:11%;
}

.postersbox{

	width:15%;
}

.lovebox{

	width:22%;
}

#legal{
	height:100px;
}

#lglogo{
	top:53px;
	left:93px;
}

#summitlogo{
	top:45px;
	left:-149px;
}

#rating{
	top:77px;
	left:-72px;
}

.breakpoint{
	display:inline;
}

.breakhide{
	display:none;
}

}

@media (max-width:568px) {
	#main-bg {        
        position:absolute;
    }
}