/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1280px) {
.video-section-inner{
	-webkit-box-flex: 0;
	-ms-flex: 0 0 25%;
	flex: 0 0 25%;
	max-width: 25%;
}
}

@media (min-width: 980px) and (max-width: 1280px){ 
.video-section-inner{
	-webkit-box-flex: 0;
	-ms-flex: 0 0 33.333333%;
	flex: 0 0 33.333333%;
	max-width: 33.333333%;
	padding: 0 10px;
}
.video-section-main {
    padding: 20px 0 0 0;
    margin-top: 300px;
}
.video-section{
	margin: 0px 0 15px 0;
}
.desktop-header,
.landaing-popup-outer{
	display: none;
}
.mobile-header{
	display: block;
  overflow: hidden;
}
.header-shrink.mobile-header{
  min-height: 200px;
  transition-property:all;
  transition-duration:0.3s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  /* Safari */
  -webkit-transition-property:all;
  -webkit-transition-duration:0.3s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
}
.mobile-header{
  float: left;
  width: 100%;  
  /*background: url(../images/sky.png) center center #85C6ED;*/
  background-color: #101126;
  background-size: cover;
  min-height: 310px;
}
.mobile-header:before{
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: url(../images/bottom_shadow.png) center center;
  background-size: cover;
  z-index: 2;
  height: 100px;
}

.desktop-header.desktop-innerpage{
  background: #191c24;
  padding: 0;
}
/*.demo{
	position: absolute;
	float: left;
	width: 100%;
	max-width: 390px;
	position: absolute;
  	right: 70px;
  	top: 80px;
}
.demo .image1{
	max-width: 100%;
}
.demo1{
	position: absolute;
	left: 70px;
	width: 100%;
	max-width: 380px;
	text-align: center;
	top: 70px;
}
.demo1-fixed .demo1{
	position: fixed;
	top: 20px;
	width: 250px;
}
.demo1 i{
	max-width: 250px;
}
.demo2{
	position: absolute;
	top: 100px;
	left: 70px;
	width: 100%;
	max-width: 380px;
	text-align: center;
}
.demo .image1, .demo2{
  z-index: 99;
  opacity: 1;
  transition-property:all;
  transition-duration:0.3s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  -webkit-transition-property:all;
  -webkit-transition-duration:0.3s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
}
.header-shrink.mobile-header .demo .image1,
.header-shrink.mobile-header .demo2{
  opacity: 0;
  transition-property:all;
  transition-duration:0.3s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  -webkit-transition-property:all;
  -webkit-transition-duration:0.3s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
}*/
/*.header-shrink.mobile-header:before{
	background: #85c6ed;
}*/

.desktop-trio{display: none;}
.responsive-trio{display: block;}
.video-section-innerpage{
    padding: 0;
    margin-top: 50px;
  }
/*  .demo1 i {
    max-width: 200px;
}*/
}

@media (min-width: 480px) and (max-width: 980px){ 
  .video-section-innerpage{
    padding: 0;
    margin-top: 50px;
  }
.video-section-inner{
	-webkit-box-flex: 0;
	-ms-flex: 0 0 50%;
	flex: 0 0 50%;
	max-width: 50%;
	padding: 0 10px;
}
.video-section-main {
    padding: 20px 0 0 0;
    margin-top: 500px;
}
.video-section{
	margin: 0px 0 15px 0;
}
.desktop-header,
.header-shrink.mobile-header .btn,
.landaing-popup-outer{
	display: none;
}
.mobile-header{
	display: block;
}
.mobile-header{
  min-height: 400px;
  transition-property:all;
  transition-duration:0.6s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  /* Safari */
  -webkit-transition-property:all;
  -webkit-transition-duration:0.6s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
  overflow: hidden;
}
.mobile-header{
  /*background: url(../images/sky.png) center center #85C6ED;*/
  background-color: #101126;
  background-size: cover;
  float: left;
  width: 100%;
    transition-property:all;
  transition-duration:0.6s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  /* Safari */
  -webkit-transition-property:all;
  -webkit-transition-duration:0.6s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;

}
.mobile-header:before{
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: url(../images/bottom_shadow.png) center center;
  background-size: cover;
  z-index: 2;
  height: 100px;

}
.header-shrink.mobile-header{
  min-height: 20vh;
  transition-property:all;
  transition-duration:0.6s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  /* Safari */
  -webkit-transition-property:all;
  -webkit-transition-duration:0.6s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
}
.header-shrink.mobile-header .col-lg-12{
	min-height: 20vh;
	transition-property:all;
  transition-duration:0.6s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  /* Safari */
  -webkit-transition-property:all;
  -webkit-transition-duration:0.6s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
}
.mobile-header .col-lg-12{
	min-height: 400px;
	transition-property:all;
  transition-duration:0.6s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  /* Safari */
  -webkit-transition-property:all;
  -webkit-transition-duration:0.6s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
  overflow: hidden;
}
/*.demo{
	position: absolute;
	float: left;
	width: 100%;
	max-width: 360px;
	position: absolute;
  	right: inherit;
  	left: 50%;
  	bottom: 15px;
  	transform: translateX(-50%);
}
.demo .image1{
	max-width: 100%;
}
.demo1{
	position: absolute;
	left: 50%;
	width: 100%;
	max-width: 380px;
	text-align: center;
	top: 80px;
	transform: translateX(-50%);
  z-index: 1;
}

.demo1-fixed .demo1{
	position: fixed;
	top: 20px;
	width: 250px;
}
.demo2{
	position: absolute;
	top: 100px;
	width: 100%;
	max-width: 100%;
	text-align: center;
}
.demo2 p{
	max-width: 380px;
	width: 100%;
	margin: 0 auto;
}
.demo .image1, .demo2{
  z-index: 99;
  opacity: 1;
  transition-property:all;
  transition-duration:0.6s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  -webkit-transition-property:all;
  -webkit-transition-duration:0.6s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
}*/
header-shrink.mobile-header .demo .image1,
.header-shrink.mobile-header .demo2{
  opacity: 0;
 /*. transition-property:all;
  transition-duration:0.6s;
  transition-timing-function:ease;
  transition-delay:0.0s;*/
  /*-webkit-transition-property:all;
  -webkit-transition-duration:0.6s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;*/
}
/*.header-shrink.mobile-header .demo{
	bottom: 0;
}*/
.desktop-trio{display: none;}
.responsive-trio{display: block;}
}

@media (min-width: 0px) and (max-width: 480px){ 
.video-section-inner{
	-webkit-box-flex: 0;
	-ms-flex: 0 0 100%;
	flex: 0 0 100%;
	max-width: 100%;
	padding: 0 5px;
}
.video-section-innerpage{
  padding-top: 400px;
}
.video-section-main {
    padding: 20px 0 0 0;
    margin-top: 400px;
}
.video-section{
	margin: 0px 0 15px 0;
}
.desktop-header.innerpage-header{
	display: block;
}
.desktop-header,
.header-shrink.mobile-header .btn,
.landaing-popup-outer{
	display: none;
}
.mobile-header{
	display: block;
}
.mobile-header{
  /*background: url(../images/sky.png) center center #85C6ED;*/
  background-color: #101126;
  background-size: cover;
  min-height: 400px;
  float: left;
  width: 100%;
}
.mobile-header:before{
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background: url(../images/bottom_shadow.png) center center;
  background-size: cover;
  z-index: 2;
  height: 100px;
}
.header-shrink.mobile-header{
  transition-property:all;
  transition-duration:0.6s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  /* Safari */
  -webkit-transition-property:all;
  -webkit-transition-duration:0.6s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
  min-height: 20vh;
}
.header-shrink.mobile-header .col-lg-12{
	transition-property:all;
  transition-duration:0.6s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  /* Safari */
  -webkit-transition-property:all;
  -webkit-transition-duration:0.6s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
  min-height: 20vh;
}
.mobile-header .col-lg-12{
	min-height: 400px;
	transition-property:all;
  transition-duration:0.6s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  /* Safari */
  -webkit-transition-property:all;
  -webkit-transition-duration:0.6s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
  overflow: hidden;
}
/*.demo{
	position: absolute;
	float: left;
	width: 100%;
	max-width: 300px;
	position: absolute;
  	right: inherit;
  	left: 50%;
  	bottom: 15px;
  	transform: translateX(-50%);
  	overflow: visible;
}
.demo .image1{
	max-width: 100%;
}
.demo1{
	position: absolute;
	left: 50%;
	width: 100%;
	max-width: 380px;
	text-align: center;
	top: 80px;
	transform: translateX(-50%);
}
.demo1-fixed .demo1{
	position: fixed;
	top: 20px;
	width: 250px;
}
.demo2{
	position: absolute;
	top: 100px;
	width: 100%;
	max-width: 100%;
	text-align: center;
	left: 0;
}
.demo2 p{
	max-width: 380px;
	width: 100%;
	margin: 0 auto;
  padding: 10px;
}
.demo .image1, .demo2{
  z-index: 99;
  opacity: 1;
  transition-property:all;
  transition-duration:0.6s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  -webkit-transition-property:all;
  -webkit-transition-duration:0.6s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
}
.header-shrink.mobile-header .demo .image1,
.header-shrink.mobile-header .demo2{
  opacity: 0;
  transition-property:all;
  transition-duration:0.6s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  -webkit-transition-property:all;
  -webkit-transition-duration:0.6s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
}
.header-shrink.mobile-header .demo{
	bottom: 0;
}*/
body{
  margin: 0;
}
}

/* ----------- iPad 1, 2, Mini and Air ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {

}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {
    /*.demo{
      max-width: 460px;
    }
    .demo1{
      top: 260px;
    }
    .demo2{
      top: 240px;
    }*/
    .vid-list-container{
      float: left;
      width: 100%;
    }
}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {
     .vid-list-container{
      float: left;
      width: 100%;
    }
  .video-last-watched h4{ color:#000 !important; }
  .superbook-template-default .mobile-header{ display: none; }
  .superbook-template-default .video-section-innerpage{ padding-top: 0px; }
  .superbook-template-default .video-main{ padding: 0 !important; }
  .superbook-template-default .vid-container #vid_title{ background: #85C6ED; padding: 15px; color: #FFFFFF !important; margin-top: 0; margin-bottom: 0;}
  .superbook-template-default .vid-container{  position: -webkit-sticky; position: sticky; top: 0; z-index: 1;}
  .superbook-template-default .vid-container #vid_title .mobile-title a:before{  
  /*font-family: "Font Awesome 5 Free";
   content: "\f104";*/
   content: "\2039";
   display: inline-block;
   padding-right: 10px;
   vertical-align: middle;
   font-weight: 900;
}
.superbook-template-default #vid_title .desktop-title{ display: none;}
.superbook-template-default #vid_title .mobile-title{ display: block;}

.demo1{
  text-align: center;
    width: 100%;
    position: absolute;
    top: 40%;
    z-index: 2;
}
  .demo1newcls{
    position: fixed !important;
    bottom: 30px;
    top: inherit !important;
  transition-property:all;
  transition-duration:0.3s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  -webkit-transition-property:all;
  -webkit-transition-duration:0.3s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
  width: 100%;
  text-align: center;
}
.demo1 img,
#bg1-1 {
    max-width: 250px;
    left: 46%!important;
  }
#parallax-bg1,
#parallax-bg2,
#parallax-bg3 {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
#bg1-1,
#bg2-1,
#bg3-1{left: 45%; width: 100%; transform: translateX(-50%); position: absolute; color:white;}

#bg1-1 {
  top: 35%;
  z-index: 2;
}
#bg2-1 {
  top: 5%;
  padding: 15px;
  text-align: center;
  z-index: 1;
  }
#bg3-1 {
  top: 40%;
  z-index: 1;
  }

}

@media (min-width: 0px) and (max-width: 767px){

  .season-selector {
    display: flex;
    align-items: center;
    color: white;
    width: fit-content;
    border: 2px solid #000;
    border-radius: 5px;
  }

  .announcement{
    color: black!important;
    padding-bottom: 10px;
  }

  .top-menu{
    flex-direction: column-reverse!important;
  }


  .vid-container{
    height: auto !important;
    padding-bottom: 5% !important;
  }
  /*.vid-list-container{
    max-height: 100% !important;
  }*/
  .vid-list-container{
    width: 100%;    
  }
  .vid-list-container .ol#vid-list{
    float: left;
  }
  .video-section-innerpage,
  .video-section-main{
    padding-top: 400px;
    margin-top: 0px;
    background: #FFFFFF !important;
  }
  .vid-container #vid_title{
    margin-top: 15px;
    font-size: 18px;
    color: #000000 !important;
  }
  .video-main h4,
  #last-played li a .desc{
    color: #000000 !important;
    margin-top: 25px;
  }
  /*.demo1{
    z-index: 1;
  transition-property:all;
  transition-duration:0.3s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  -webkit-transition-property:all;
  -webkit-transition-duration:0.3s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;}
  .demo1.fixed{
    top: 10px !important;
  }
  #parallax-bg1 img {
    max-width: 200px;
  }
  .demo1.fixed img{
    transform: none !important;
  }*/
  .mobile-header{position: fixed; z-index: 9;}
  .imgtrnone{transform: none !important;}
  
  .desktop-trio{display: none;}
  .responsive-trio{display: block;}

  .video-last-watched h4{ color:#000 !important; }
  .superbook-template-default .mobile-header{ display: none; }
  .superbook-template-default .video-section-innerpage{ padding-top: 0px; }
  .superbook-template-default .video-main{ padding: 0 !important; }
  .superbook-template-default .vid-container #vid_title{ background: #85C6ED; padding: 15px; color: #FFFFFF !important; margin-top: 0; margin-bottom: 0;}
  .superbook-template-default .vid-container{  position: -webkit-sticky; position: sticky; top: 0; z-index: 1;}
  .superbook-template-default .vid-container #vid_title .mobile-title a:before{  
  /*font-family: "Font Awesome 5 Free";
   content: "\f104";*/
   content: "\2039";
   display: inline-block;
   padding-right: 10px;
   vertical-align: middle;
   font-weight: 900;
}
.superbook-template-default #vid_title .desktop-title{ display: none;}
.superbook-template-default #vid_title .mobile-title{ display: block;}
.superbook-template-default #vid_title .mobile-title a{color: #FFFFFF; cursor: pointer;}
.desktop-list-images img{display: none;}
#landing-popup2.modal{padding:20px;}
#vid-list, ol#vid-list li a{background:#fff !important;}
#vid-list .desc, .totalduration{color:#000 !important;}
#vid-list .default-active .desc, .active .desc{color: #2196f3 !important;}
#landing-popup2 button.close{ width:25px; height:15px; margin-top:-18px;}
#landing-popup2 button i img{width:100%; }
.vid-list-container{ max-height: initial !important; overflow:visible !important; float:left !important;}
.drop-tabs .nav-tabs li.nav-item a.nav-link > img{ border: solid 1px #000; border-radius: 41px; padding: 5px; vertical-align: middle; margin-right: 5px; }
.video-last-watched{margin-top: 5px;}


.demo1{
  text-align: center;
    width: 100%;
    position: absolute;
    top: 40%;
    z-index: 2;
}
  .demo1newcls{
    position: fixed !important;
    bottom: 158px;
    top: inherit !important;
  width: 100%;
  text-align: center;
}
.demo1.demo1newcls{
  transition-property:all;
  transition-duration:0.3s;
  transition-timing-function:ease;
  transition-delay:0.0s;
  -webkit-transition-property:all;
  -webkit-transition-duration:0.3s;
  -webkit-transition-timing-function:ease;
  -webkit-transition-delay:0.0s;
}
.demo1 img,
#bg1-1 {
    max-width: 250px;
    left: 46%!important;
  }
#parallax-bg1,
#parallax-bg2,
#parallax-bg3 {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
#bg1-1,
#bg2-1{left: 50%; width: 100%!important; transform: translateX(-50%); position: absolute; color:white}

img#bg3-1{
  width: 165%;
  overflow: hidden;
  left: 50%; transform: translateX(-50%); position: absolute;
  top:43%!important;
}

#bg1-1 {
  top: 35%;
  z-index: 2;
}
#bg2-1 {
  top: 5%;
  padding: 15px;
  text-align: center;
  z-index: 1;
  }
#bg3-1 {
  top: 40%;
  z-index: 1;
  }
.season-button{
color:black;
}

.season-selector{
width: 100%!important;}

.season-button {
width:50%!important;
text-align:center!important;}

}
@media (min-width: 768px) and (max-width: 1280px){ 
  .mobile-header{ display: none !important; }
  .desktop-header, .landaing-popup-outer{display: block !important;}
  .video-section-main{margin-top: 220px !important; padding: 0 !important;}
  .video-section-innerpage{margin-top: 220px !important;}
  .vid-list-container{max-height: 200px !important;}
  .video-section-inner{max-width: 25% !important; flex: 0 0 25% !important;}
  .video-section-main strong.desktop-dark{color: #FFFFFF;}
}