﻿/*slider controls for 16:9 slideshow*/
.slide-control { position: absolute; top: 0; height: 0; padding-top: 56.25%; width: 40px; cursor: pointer; z-index: 100; display: none; }
.slide-control.right { right: 0; }
.slide-control.left { left: 0; }
.slide-control .fa { font-size: 45px; line-height: 1; margin-top: -23px; position: absolute; top: 50%; left: 0; right: 0; text-align: center; }
/*Top Rotator*/
.top-rotator {  visibility: hidden; }
.top-rotator .slideContainer { position: relative; z-index: 11; }
.top-rotator .slideContainer:after { content: ""; display: table; clear: both; }
.top-rotator a { transition: all 0.25s ease; }
.top-rotator .pagerContainer { position: absolute; bottom: 18px; right: 20px; z-index: 101; }
.top-rotator a.page { width: 20px; height: 20px; margin: 3px 0px 0px 5px; display: inline-block; text-decoration: none; text-align: center; font-size: 11px; line-height: 20px; }
.top-rotator a.page:hover {transition: all 0.35s ease;}

.top-rotator .slide { width: 100%; }
.top-rotator .top { overflow: hidden; height: 0; padding-top: 56.25%;  position: relative; }
.top-rotator a.slide-inner { display: block;  background-repeat: no-repeat; text-decoration: none; position: absolute; top: 0; right: 0; left: 0; bottom: 0; background-size: cover; background-position: 50% 50%; }
.top-rotator a.slide-inner.slide-inner-portrait { background-size: auto 100%; background-position: 50% top; }
.top-rotator .slide img { position: absolute; left: -999em; }
.top-rotator .bottom { display: block; position: relative; padding: 20px; }
.top-rotator .creator { position: absolute; left: 15px; bottom: 1px;  }
.top-rotator .slideTitle { font-size: 20px; font-weight: bold; padding: 0; margin: 0 0 10px; }
.top-rotator .slideCaption { display: block; font-size: 14px; margin-bottom: 10px; min-height: 40px; }
.top-rotator .slideLinks { font-size: 12px; max-width: 50%; min-height: 20px; }
.top-rotator .slideLinks a.link { display: inline-block; margin: 0 7px 0 0px; padding: 0 0 0 7px; line-height: 1em; font-size: 14px; }
.top-rotator .slideLinks a.link:first-child { border: none; padding: 0; }
.top-rotator-imagedistortion { width: 100%; height: 100%; top: 0px !important; left: 0px !important; }
.top-rotator .smallVideoOverlay { background: url('../images/dgovImageSprite.png') 0px -37px no-repeat no-repeat; width: 14px; height: 14px; position: absolute; left: 50%; top: 50%; margin-left: -7px; margin-top: -7px; z-index: 2; }
.top-rotator .videoOverlay { background: url('../images/dgovImageSprite.png') -44px 0px no-repeat no-repeat; width: 82px; height: 82px; position: absolute; left: 50%; top: 50%; margin-left: -41px; margin-top: -41px; z-index: 2; }
.top-rotator .YouTubeContainer, .top-rotator .DvidsVideo { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }


.top-rotator.slideshow .bottom{background:transparent;position:absolute;bottom:-4%;max-height:100%;overflow:hidden;
  left:0; right:0;
  background: -moz-linear-gradient(top,  100%);
  background: -webkit-linear-gradient(top, 100%); 
  background: linear-gradient(to bottom,  100%); 
}
.top-rotator.slideshow .slideText{max-width: 100%;margin:0 auto;}
.top-rotator.slideshow .slideTitle{font-size:30px;font-family: 'Orbitron', sans-serif;text-transform:uppercase;margin-bottom:0;}
.top-rotator.slideshow .slideTitle a, .top-rotator.slideshow .slideCaption{}

.top-rotator.slideshow .slideCaption {font-size: 18px;}
.top-rotator.slideshow a.slide-inner.slide-inner-portrait{}
.top-rotator.slideshow .DvidsVideo, .top-rotator.slideshow .YouTubeContainer{z-index:1;} /*puts the video above that caption when played and display block is applied to video container*/


@media (max-width: 767px) {
    .top-rotator div.pagerContainer { display: none; }
  .top-rotator .slide-control { display: block; }
  .top-rotator div.slideContainer div.slide div.bottom div.slideLinks { min-height: 0; }
  .top-rotator-2 .split { width: auto; float: none; }

  .top-rotator.slideshow .slideTitle{font-size:20px;}
}
@media (max-width: 600px) {
  .top-rotator.slideshow .slideCaption{display:none;}

}
