﻿html{font-family:sans-serif;line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}
a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}
abbr[title]{border-bottom:0;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}
b,strong{font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:.67em 0;line-height: 32px}h1 a{font-size:22px;color:#000000 !important;}h2 a{font-size:22px;color:#000000 !important;}

*,:before,:after{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;box-sizing:border-box;outline:0}


hr{background-color:rgba(0,0,0,.2);border:0;display:block;height:1px;margin:20px auto;width:100%}
@media (min-width:480px){hr{margin:30px auto}}
@media (min-width:960px){hr{margin:40px auto}}
hr.compact{width:50%}
a{color:#ffffff;font-weight:400;text-decoration:none}
a:hover{text-decoration:underline}

/*.video-container{padding:20px}*/
.video-layout-horizontal,.video-layout-vertical{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}
.video-layout-content .jwplayer{margin:0 auto 15px}
.video-layout-content p{font-size:20px;line-height:1.5}
.video-layout-content p+p{margin-top:10px}
@media (min-width:480px){.video-nav,.video-api-reference{padding:10px 30px}
    .video-nav{padding:10px 30px}
    /*.video-container{padding:30px}*/
    .video-layout-content .jwplayer{margin:0 auto 25px}
    .video-layout-vertical .video-layout-code{margin-top:30px}
}
@media (min-width:960px){.video-nav,.video-api-reference{padding:15px 40px}
    /*.video-container{padding:40px}*/
    .video-layout-content .jwplayer{margin:0 auto 35px}
    .video-layout-horizontal{-ms-flex-direction:row;flex-direction:row}
    .video-layout-vertical{-ms-flex-align:center;align-items:center}
    .video-layout-content{-ms-flex:2;flex:2;max-width:480px}
    .video-layout-vertical .video-layout-content{max-width:1000px;width:100%}
    .video-layout-horizontal .video-layout-code{-ms-flex:3;flex:3;margin-left:30px;margin-top:0}
    .video-layout-vertical .video-layout-code{margin-top:40px;max-width:800px;min-width:600px}
}

.overflow-wrapper {
	width: 100%;
}

.video-wrapper {
	align-items: flex-start;
	display: flex;
	flex-wrap: wrap;
	width: 100%;
}

.video-layout-content .jwplayer {
	width: 100% !important;
	margin: 0;
}







.player-demo-wrapper {
  display: none;
}

.player-demo-wrapper.demo-toggle-on {
  display: flex;
  flex-direction: column;
}

.player-demo-wrapper p {
  font-size: .8em;
}

.player #out-player-demo {
  margin: 0;
}

.playlist-wrapper {
  overflow: auto;
  background: black;
}

.playlist-wrapper > p {
  padding: 1em 0.5em 0;
  color: white;
  font-size: 1.2em;
  font-weight: 400;
  text-align: left;
}

.playlist {
  display: flex;
  width: 100%;
  list-style: none;
  min-height:210px;
}

.playlist li {
  object-fit: cover;
}

.playlist li a {
  height: 100%;
  color: white;
  padding: 1em 0.5em;
  display: block;
  cursor: pointer;
  text-align: left;
}

.playlist-thumbnail-wrapper {
  position: relative;
  color: white;
  font-weight: 400;
  text-shadow: 0 0 7px #555;
}

.playlist-duration {
  position: absolute;
  top: 5px;
  right: 5px;
}

.playlist-item-playing {
  color: transparent;
  position: absolute;
  top: 40%;
  width: 100%;
  text-align: center;
  text-transform: uppercase;
  transition: 150ms ease-in-out all;
}

a.active .playlist-item-playing {
  color: white;
  display: block;
}

.playlist-thumbnail {
  width: 100%;
}

.demo-layout-vertical .demo-layout-code {
  max-width: 1000px;
  width: 100%;
}

@media (max-width: 760px) {
  .player-demo-wrapper.demo-toggle-on, .playlist {
    display: block;
  }

  .playlist-thumbnail-wrapper {
    width: 50%;
    min-width: 12em;
    margin-right: 1em;
  }

  .playlist li a {
    display: flex;
    align-items: center;
    padding: 1em;
  }

  .playlist-thumbnail {
    width: 100%;
    height: auto;
  }
}




.jw-aspect {
  padding-top: 75% !important;
}

