/* next and previous buttons on videos */
/* PREVIOUS */
.field--name-field-previous-video a {
	display: flex;
  height: 50vh; 
  background: url('/sites/default/files/previous.png') no-repeat;
  height: 71px;
  width: 268px;
  /*margin-left:-75px;*/
  margin-top: 100%;
  text-indent: -9999px;    
  overflow: hidden;
  float:right;
}
.field--name-field-previous-video a:hover {
	font-size: .9em; 
	display: flex;
  align-items: center;
  justify-content: center; 
  height: 50vh;
	background: url('/sites/default/files/previous-chapter-blank.png') no-repeat;
  height: 71px;
  width: 268px;
  /*margin-left: -75px;*/
  margin-top: 100%;
  text-decoration: none;
  color: #fff;
  text-transform: uppercase;
  text-indent: 0px;
  z-index:1000;
  overflow: display;
  float:right;
}
/* NEXT Buttons */

.field--name-field-next-video a {	
	
  display: flex;
  height: 50vh; 
  background: url('/sites/default/files/next-no-bg.png') no-repeat;
  height: 71px;
  width: 268px;
  margin-top: 100%;
  text-indent: -9999px;    
  overflow: hidden;
}

.field--name-field-next-video a:hover {
	font-size: .9em; 
	display: flex;
  align-items: center;
  justify-content: center; 
  height: 50vh;
	background: url('/sites/default/files/next-bg.png') no-repeat;
  height: 71px;
  width: 240px;
  margin-top: 100%;
  text-decoration: none;
  color: #fff;
  text-transform: uppercase;
  text-indent: 0px;
  z-index:1000;
  overflow: display;}

.flexslider {
 background: #000;
 border: none}
 
.flex-next a {margin-left:50px; color: #fff;}
.flexslider .flex-direction-nav a, .flexslider .flex-direction-nav a {display:block;}

.flex-direction-nav a {
text-decoration: none;
display: block;
width: 40px;
height: 70px;
margin: -40px;
position: absolute;
top: 50%;
z-index: 10;
overflow: hidden;
opacity: 0;
cursor: pointer;
 color: white;
text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-ms-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
.flex-direction-nav a:before {color: #fff;}

/* ==========================================================
   Chapter slider (FlexSlider): stop the arrows bouncing on hover
   Stock flexslider.css parks the arrows 50px outside the slider and
   slides them in on .flexslider:hover. Approaching from outside, the
   arrow moves away from the cursor, hover ends, it slides back, repeat.
   Pin them inside and animate opacity only.
   ========================================================== */
.flexslider .flex-direction-nav a {
  opacity: 0.7 !important;
  transition: opacity 0.2s ease !important;
}
.flexslider .flex-direction-nav .flex-prev {
  left: 10px !important;
}
.flexslider .flex-direction-nav .flex-next {
  right: 10px !important;
}
.flexslider .flex-direction-nav a:hover,
.flexslider .flex-direction-nav a:focus {
  opacity: 1 !important;
}
/* Hide the arrow at either end of the carousel instead of showing a dead control */
.flexslider .flex-direction-nav a.flex-disabled {
  opacity: 0 !important;
  pointer-events: none;
}