/* CONSTANTS AND IMPORTS */
/**
 * Variables
 */
/**
 * Functions
 */
/**
 * Mixins
 */
/* GROWNUPS */
#popup-canvas {
  z-index: 110;
}
#popup-canvas #grownups-popup {
  left: 1.5%;
  width: 97%;
  top: 44px;
}
#popup-canvas #grownups-popup .title.popup {
  background-color: #5493EF;
  padding: 0;
}
#popup-canvas #grownups-popup .title.popup span {
  max-width: none;
  color: #fff;
  line-height: 35px;
}
#popup-canvas #grownups-popup .popup-close {
  top: 0;
  position: absolute;
}
#popup-canvas #grownups-popup .content {
  color: #989898;
  max-width: 100%;
}
#popup-canvas #grownups-popup .content .title {
  color: #bec1c4;
}
#popup-canvas #grownups-popup .content strong {
  color: #5493EF;
}
#popup-canvas #grownups-popup .content #grownups-show-title {
  color: #5493EF;
}
#popup-canvas #grownups-popup .content #grownups-ep-title {
  color: #176EC6;
}
#popup-canvas #grownups-popup .content .now-playing .pod-credits #credits {
  height: auto !important;
}
#popup-canvas #grownups-popup .content .now-playing .title {
  color: #5493EF;
}
#popup-canvas #grownups-popup .content .now-playing .title.nowplaying {
  color: #176EC6;
}
#popup-canvas #grownups-popup .content .now-playing #grownups-text #transcript .border {
  fill: #176EC6;
}
#popup-canvas #grownups-popup .content .now-playing #grownups-text #transcript .background {
  fill: #5493EF;
}
#podcast-player-container {
  z-index: 105;
  margin-top: 180px;
}
/* PLAYER */
.player-title {
  background-color: #5493EF;
  color: #fff;
}
/* PODCAST LIST */
#podcast-list .podcast {
  background-color: #003048;
  color: #fff;
}
#podcast-list .podcast.new::after {
  border-left-color: #6f7275;
  border-top-color: #6f7275;
}
#podcast-list .podcast.active-list {
  background-color: #82D2F9;
  color: #003048;
}
#podcast-list .podcast.active-list.new::after {
  border-left-color: #bec1c4;
  border-top-color: #bec1c4;
}
#podcast-list .podcast.active-list .podcast-info .grownups-button {
  background-image: url('../static/podcasts/Playlist_Selected.svg');
}
#podcast-list .podcast .podcast-info .grownups-button {
  width: 53px;
  background-image: url('../static/podcasts/Playlist_NonSelected.svg');
}
/* PODCAST LIST SCROLL BAR */
#podcast-list #scroll-container {
  background-color: #1DCAD3;
}
#podcast-list #scroll-container #scroll-track {
  background-color: #003048;
}
#podcast-list #scroll-container #scroll-track #scroll-bar {
  background-color: #1DCAD3;
}
/* ACTIVE PODCAST */
.podcast.active {
  color: #003048;
  background-color: #fff;
}
.podcast.active .podcast-number {
  width: auto;
  padding: 5px 0.2em;
}
.podcast.active .podcast-info {
  flex: 1 1 50%;
}
.podcast.active .podcast-info .grownups-button {
  background-image: url(../static/podcasts/NowPlaying.svg);
}
.podcast.active .podcast-info .time {
  color: #5493EF;
}
.podcast.active .podcast-audio {
  background-color: #A0EAE6;
  border-bottom: solid 10px #1DCAD3;
}
.podcast.active .podcast-audio .podcast-audio-player {
  /* PODCAST SEEK/PROGRESS BAR */
}
.podcast.active .podcast-audio .podcast-audio-player #podcast-seek {
  background: #bec1c4;
}
.podcast.active .podcast-audio .podcast-audio-player #podcast-scrubber {
  background-image: url(../static/podcasts/scrubber.svg);
}
.podcast.active .podcast-audio .podcast-controls button#play {
  display: flex;
}
.podcast.active .podcast-audio .podcast-controls button#play svg {
  padding: 0;
  margin-left: 14px;
}
.podcast.active .podcast-audio .podcast-controls button {
  background-color: #5493EF;
  border-bottom-color: #176EC6;
}
.podcast.active .podcast-audio .podcast-controls button:hover {
  border-bottom-color: #176EC6;
}
/* MORE PODCAST SEEK/PROGRESS BAR */
/* firefox */
#podcast-seek::-moz-progress-bar {
  background: #176EC6;
}
/* webkit browsers */
#podcast-seek::-webkit-progress-bar {
  background: #5493EF;
}
#podcast-seek::-webkit-progress-value {
  background: #176EC6;
}
/* IE */
#podcast-seek::-ms-fill {
  background: #176EC6;
}
@media (max-width: 980px) {
  #podcast-list {
    background-color: #B1D9E8;
  }
}
@media (min-width: 545px) and (max-width: 700px) {
  .podcast.active .podcast-audio {
    bottom: 108px;
    margin-bottom: -108px;
    position: relative;
  }
}
@media (min-width: 700px) and (max-width: 980px) {
  .podcast.active .podcast-audio {
    bottom: 125px;
    margin-bottom: -125px;
    position: relative;
  }
}
@media (max-width: 400px) {
  .podcast.active .podcast-image {
    margin: 0;
    width: 30%;
  }
  .podcast.active .podcast-number {
    font-size: 30px;
  }
  .podcast.active #active-title {
    font-size: 16px;
  }
}
@media (max-width: 1024px) {
  #popup-canvas #grownups-popup {
    top: 96px;
  }
}
@media (min-width: 980px) {
  .podcast-player-wrap {
    height: 100%;
  }
  main.podcast {
    height: auto;
  }
  .podcast.active .podcast-audio {
    bottom: 66px;
    position: relative;
  }
  .podcast .title {
    margin: 0;
  }
}
.phat-button:focus {
  margin-top: 0;
}
/* Hide podcast numbers */
.podcast-number {
  display: none !important;
}
/* need to space things out to compensate for missing podcast number */
#active-podcast .podcast-info {
  margin-left: 1em;
}
.podcast-image {
  margin-left: 6px;
}
#grownups-text .title.episode {
  display: none;
}
#grownups-text #grownups-show-ep-num {
  display: none;
}
