﻿ /*_____________________VIDEO FLOWPLAYER STYLES_____________________*/

.flowplayer .fp-logo {
  /* logo always visible, even on origin domain */
  display: none!important;
  /*opacity: 1 !important;
  left: 3%!important;
  right: auto!important;  avoid logo being stuck on left side 
  width:100px;*/
}
 /* .flowplayer .fp-context-menu
{
   color: Black!important;
}*/

.flowplayer .fp-controls {
    padding-right: 2.5em!important;
}
.flowplayer .fp-embed {
      display: none!important;
   }
.flowplayer .fp-brand 
{
  display: none!important;
   }

  /*.flowplayer .fp-progress
 {
   background-color: rgba(255, 46, 46, 1)!important;
 
 }*/
 /* initially hide speed buttons while they cannot be used */
.is-splash.flowplayer .buttons, .is-loading.flowplayer .buttons {
  display: none;
}
.groupcenter {
    display: table;
  margin: 0 auto;
}
.flowplayer .fp-waiting {
    margin-top: 36% !important;
}
.format_selection{
    margin-top:1em;
}
/****Quality Styles*****/
   #formatList 
   {
         opacity: 1;
         background-color: #545454;
         color: #fff;
         font-weight: normal;
         cursor: default;
   }
   #btnTitle 
   {
         opacity: 1;
         background-color: #545454;
         color: #fff;
         font-weight: normal;
         cursor: default;
   }
   #btnQuality 
   {
      opacity:1.0;
      background-color:rgba(0,0,0,0.0);
      vertical-align: 50px;
      bottom: 50px;
      color:#ffffff;   
      width: 2.5em;
   float: right;
   margin-right: 3px;
   }
   div#btnQuality i {
         font-family: "Font Awesome 5 Pro";
         font-size: 20px;
   }
.flowplayer .buttons {
   position: absolute;
  right: 0px;
  bottom: 5px;
  z-index: 12; /* make clickable */
   display: block;
 /*opacity: 1;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);*/
}
.flowplayer .buttons div 
{
   padding: 5px;
   margin: 3px 3px 3px 0px;
   width: 5.5em;
   height: 1.8em;
   display: block;
   text-align: center;
   font-weight: bold;
   background-color: #eee;
   cursor: pointer;
   opacity: 0.6;
   color: #545454;
}
.flowplayer .fp-message{
    margin-top: 10px;
    background-color: #fff;
}
.flowplayer .buttons div.active {
  color: #00a7c8;
  background-color: #666;
  cursor: default;
}
.flowplayer .buttons div:hover {
  opacity: 1;
  cursor: pointer;
}
.flowplayer .is-fullscreen {
    z-index: 3000000000;
}
div#player.flowplayer {
  width: 100%;
  height: 100%;
  margin: auto;
  z-index:1;
	}
.is-mouseout.flowplayer.is-playing .buttons {
  opacity: 0;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
   /* same transition as other ui elements like fullscreen */
  -webkit-transition: opacity .15s .01s;
  -moz-transition: opacity .15s .01s;
  transition: opacity .15s .01s;
}
#gradesDropDown {
z-index: 25;
}
#subjectsDropDown {
z-index: 20;
}
.selectize-dropdown {
z-index:15;
}
h2#gridheader {
    margin-left: 10px;
    font-size: 32px;
}
	#playerHoverHead{
	            position: relative;
	            left: 0px;
	            top: 0px;
	            z-index: 2;
	            width: 100%;
	            height: 60px;
	            color: #ffffff;
	            background: rgba(0, 0, 0, 0.58);
	            transition: all 0.7s ease;
            }
            #playerHoverHead h2{
	            color: #ffffff !important;
	            text-align:left;
	            font-size:20px;
	            padding-left: 20px;
	            padding-top:5px;
            }
            .is-mouseout.flowplayer #playerHoverHead{ opacity: 0;
              filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
              /* same transition as other ui elements like fullscreen */
              -webkit-transition: opacity .15s .01s;
              -moz-transition: opacity .15s .01s;
              transition: opacity .15s .01s; }

	#playerHoverHead2{
	            position: relative;
	            left: 0px;
	            top: 0px;
	            z-index: 2;
	            width: 100%;
	            height: 60px;
	            color: #ffffff;
	            background: rgba(0, 0, 0, 0.58);
	            transition: all 0.7s ease;
            }
            #playerHoverHead2 h2{
	            color: #ffffff !important;
	            text-align:left;
	            font-size:20px;
	            padding-left: 20px;
	            padding-top:5px;
            }
            .is-mouseout.flowplayer #playerHoverHead2{ opacity: 0;
              filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
              /* same transition as other ui elements like fullscreen */
              -webkit-transition: opacity .15s .01s;
              -moz-transition: opacity .15s .01s;
              transition: opacity .15s .01s; }

   /* Initially hide speed buttons while they cannot be used 
   .is-splash.flowplayer .buttons, .is-loading.flowplayer .buttons {
      display: none;
   }*/
   
   /*-------------------Flowplayer default background----------------------------*/
#defaultScreen{
    width: 100%;
    height:100%;
    text-align: center;
    position:inherit;
}
#dvs-1{
    background-color: #44c8f5;
    height: 25%;
    width: 100%;
}
#dvs-2{
    background-color: #dddddd;
    text-align: center;
    height: 353px;
    width: 100%;
    position: relative;
}
#dvs-2 img {
    margin: 0px auto 10px auto;
    width: 330px;
}
#dvs-2 p{
	text-align: center;
	font-size: 18px;
}
#player.is-finished .fp-ui,
#player.is-finished .fp-engine {
/* Flash-save way to hide the engine */
}
#dvs-3{
    background-color: #66676b;
    color: #dddddd;
    height: 67px;
    width: 100%;
    padding: 5px 10px 35px 10px;
} 
#dvs-3 .center-align{ 
	margin-top: 15px;	
}
.center-align{
	position: relative;
	top: 50%;
	-ms-transform: translateY(-50%);
	-webkit-transform: translateY(-50%); 
	transform: translateY(-50%);
	margin: 0px auto;
}

@media (max-width: 1199px) {
	#dvs-2{
		height: 250px;
		padding: 0px;
	}
}

@media (max-width: 768px) {
	
		#dvs-2{
		height: 100%;
		padding: 0px;
	}


	.MainGrid li.gs-w {
	    display: block;
	    width: 100%;
	    min-height: 100px;
	    height: auto;
	    position: static;
	    margin-top: 20px;
	    padding: 20px;
	}
	
	#FeaturedVideo{
		min-height: 280px;
	}

	#FeaturedVideo2{
		min-height: 280px;
	}
	
	.gridster li.Grid:before, .stickyHead{
		display: none !important;
	}
	
	#playerHoverHead{top: 0px}
	#playerHoverHead2{top: 0px}	
	#dvs-1{
		height: 0px;
	}
	.center-align{
		top: 25%;
		position: relative;
		transform: translateY(0%);
		-ms-transform: translateY(0%);
		-webkit-transform: translateY(0%); 
	}
	#dvs-2 img {
	    margin: 20px auto 11px auto;
	    height: 50px;
	}
	#dvs-2{
		padding: 40px 0px;
	}
	#VideoLinks{
		display: none;
	}

	
	.no-volume.no-mute.flowplayer .fp-timeline{
		margin-right: 80px;
	}
}

@media(max-width: 480px){

	#dvs-1 {
	    height: 0px;
	}
	#dvs-2{
		height: 200px;
		padding: 0px;
	}
	.center-align {
		top: -6%;
	}
	#dvs-3{
		padding: 7px;
	}
	#dvs-3 .center-align{ 
		margin: 0px;
		font-size: 12px;
	}
}
/*---------------------------------------------------------*/
	.hidden 
	{
	   visibility: hidden;
	}



/*-----------------Streaming Styles--------------------*/

