/*!
Theme Name: Epix Press Site
Theme URI: http://underscores.me/
Author: Tim Beckett
Author URI: http://tim-beckett.com
Description: Custom theme for Epix Press Site
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: epix_press
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Epix Press Site is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
# Infinite scroll
# Media
	## Captions
	## Galleries
--------------------------------------------------------------*/
/**/
h1 {
  font-family: ClanOT-Book, 'Helvetica Neue', sans-serif;
  font-size: 36px;
  color: #ebebeb;
}

h3 {
  text-align: center;
  font-family: Clan-OT-Book, "Helvetica Neue", sans-serif;
  font-size: 36px;
  color: #ebebeb;
}

.line {
  text-align: center;
  margin: 0 auto;
}

/*
* Useful: http://engageinteractive.co.uk/blog/top-10-scss-mixins
* http://zerosixthree.se/8-sass-mixins-you-must-have-in-your-toolbox/
*/
/* Fool-proof @font-face */
/* Based on http://coding.smashingmagazine.com/2013/02/14/setting-weights-and-styles-at-font-face-declaration/ */
@font-face {
  font-family: ClanOT-Book;
  src: url("../fonts/Clan/ClanOT-Book.otf");
}
@font-face {
  font-family: ClanOT-Medium;
  src: url("../fonts/Clan/ClanOT-Medium.otf");
}
@font-face {
  font-family: ClanOT-MediumItalic;
  src: url("../fonts/Clan/ClanOT-MediumItalic.otf");
}
@font-face {
  font-family: ClanOT-CondThin;
  src: url("../fonts/Clan/ClanOT-CondThin.otf");
}
/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
html {
  font-family: sans-serif;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}

body {
  margin: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
main,
menu,
nav,
section,
summary {
  display: block;
}

audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

[hidden],
template {
  display: none;
}

a {
  background-color: transparent;
}

a:active,
a:hover {
  outline: 0;
}

abbr[title] {
  border-bottom: 1px dotted;
}

b,
strong {
  font-weight: bold;
}

dfn {
  font-style: italic;
}

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

mark {
  background: #ff0;
  color: #000;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

img {
  border: 0;
}

svg:not(:root) {
  overflow: hidden;
}

figure {
  margin: 1em 40px;
}

hr {
  box-sizing: content-box;
  height: 0;
}

pre {
  overflow: auto;
}

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0;
}

button {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer;
}

button[disabled],
html input[disabled] {
  cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

input {
  line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

legend {
  border: 0;
  padding: 0;
}

textarea {
  overflow: auto;
}

optgroup {
  font-weight: bold;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

td,
th {
  padding: 0;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
textarea {
  color: #404040;
  font-family: sans-serif;
  font-size: 16px;
  font-size: 1rem;
  line-height: 1.5;
}

h1, h2, h3, h4, h5, h6 {
  clear: both;
  font-family: 'ClanOT-Book', arial, sans-serif;
}

h1#page-title {
  text-align: center;
  font-weight: 100;
  font-size: 36px;
  margin-bottom: 10px;
}

p {
  color: #ebebeb;
  font-family: 'ClanOT-Book', arial, sans-serif;
  font-size: 14px;
  line-height: 18px;
  font-weight: 100;
  margin-bottom: 1.5em;
}

dfn, cite, em, i {
  font-style: italic;
}

blockquote {
  margin: 0 1.5em;
}

address {
  margin: 0 0 1.5em;
}

pre {
  background: #eee;
  font-family: "Courier 10 Pitch", Courier, monospace;
  font-size: 15px;
  font-size: 0.9375rem;
  line-height: 1.6;
  margin-bottom: 1.6em;
  max-width: 100%;
  overflow: auto;
  padding: 1.6em;
}

code, kbd, tt, var {
  font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
  font-size: 15px;
  font-size: 0.9375rem;
}

abbr, acronym {
  border-bottom: 1px dotted #666;
  cursor: help;
}

mark, ins {
  background: #fff9c0;
  text-decoration: none;
}

big {
  font-size: 125%;
}

a {
  color: #ebebeb;
  font-family: 'ClanOT-Book', arial, sans-serif;
}
a:visited {
  color: #ebebeb;
}

figcaption a {
  display: none;
  font-family: 'ClanOT-Book', arial, sans-serif;
}

time {
  font-family: 'ClanOT-Book', arial, sans-serif;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
html {
  box-sizing: border-box;
}

*,
*:before,
*:after {
  /* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
  box-sizing: inherit;
}

body {
  background: #fff;
  /* Fallback for when there is no custom background color defined. */
}

blockquote, q {
  quotes: "" "";
}
blockquote:before, blockquote:after, q:before, q:after {
  content: "";
}

hr {
  background-color: #ccc;
  border: 0;
  height: 1px;
  margin-bottom: 1.5em;
}

ul, ol {
  padding: 0;
  margin: 0;
}

ul {
  list-style: none;
}

ol {
  list-style: none;
}

li {
  font-family: 'ClanOT-Book', arial, sans-serif;
}

li > ul,
li > ol {
  margin-bottom: 0;
  margin-left: 1.5em;
}

dt {
  font-weight: bold;
}

dd {
  margin: 0 1.5em 1.5em;
}

img {
  height: auto;
  /* Make sure images are scaled correctly. */
  max-width: 100%;
  /* Adhere to container width. */
}

/*Chevrons from FontAwesome*/
.fa {
  color: #C7A338;
  font-size: 16px;
  line-height: 1;
}

table {
  margin: 0 0 1.5em;
  width: 100%;
}

/*--------------------------------------------------------------
# Forms
--------------------------------------------------------------*/
section.button-container {
  display: flex;
  align-items: center;
  justify-content: center;
  border-top: none;
}

button, .button {
  width: 290px;
  height: 60px;
  color: #ebebeb;
  font-family: 'ClanOT-Medium', arial, sans-serif;
  text-decoration: none;
  font-size: 1rem;
  line-height: 1.5;
  cursor: pointer;
  text-align: center;
  padding: 16px;
  margin: 56px auto;
  border: 1px solid #C7A338;
  transition: all .3s;
}
button:hover, .button:hover {
  color: #000;
  background-color: #C7A338;
  transform: translateY(-2px);
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea {
  color: #666;
  border: 1px solid #ccc;
  border-radius: 3px;
  padding: 3px;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus {
  color: #111;
}

select {
  border: 1px solid #ccc;
}

textarea {
  width: 100%;
}

/*--------------------------------------------------------------
# Layouts
--------------------------------------------------------------*/
/*Basic Layouts and temporary styles for prototyping*/
/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
a {
  color: #ebebeb;
  transition: all .3s;
}
a:visited {
  color: #ebebeb;
}
a:hover, a:focus, a:active {
  color: #ebebeb;
}
a:focus {
  outline: none;
}
a:hover, a:active {
  outline: 0;
}

/*--------------------------------------------------------------
## Mobile Menu
--------------------------------------------------------------*/
/*
   * Vortex
   */
.hamburger {
  cursor: pointer;
  transition-property: opacity, filter;
  transition-duration: 0.15s;
  transition-timing-function: linear;
  font: inherit;
  color: inherit;
  text-transform: none;
  background-color: transparent;
  border: 0;
  margin: 0;
  overflow: visible;
}

.hamburger:hover {
  opacity: 0.7;
}

.hamburger-box {
  width: 25px;
  height: 12.5px;
  position: relative;
}

.hamburger-inner {
  display: block;
  top: 50%;
  margin-top: -2px;
}

.hamburger-inner,
.hamburger-inner::before,
.hamburger-inner::after {
  width: 25px;
  height: 2px;
  background-color: white;
  border-radius: 4px;
  position: absolute;
  transition-property: transform;
  transition-duration: 0.15s;
  transition-timing-function: ease;
}

.hamburger-inner::before,
.hamburger-inner::after {
  content: "";
  display: block;
}

.hamburger-inner::before {
  top: -10px;
}

.hamburger-inner::after {
  bottom: -10px;
}

/*
          * Vortex
          */
.hamburger--vortex .hamburger-inner {
  transition-duration: 0.2s;
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

.hamburger--vortex .hamburger-inner::before,
.hamburger--vortex .hamburger-inner::after {
  transition-duration: 0s;
  transition-delay: 0.1s;
  transition-timing-function: linear;
}

.hamburger--vortex .hamburger-inner::before {
  transition-property: top, opacity;
}

.hamburger--vortex .hamburger-inner::after {
  transition-property: bottom, transform;
}

.hamburger--vortex.is-active .hamburger-inner {
  transform: rotate(765deg);
  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
}

.hamburger--vortex.is-active .hamburger-inner::before,
.hamburger--vortex.is-active .hamburger-inner::after {
  transition-delay: 0s;
}

.hamburger--vortex.is-active .hamburger-inner::before {
  top: 0;
  opacity: 0;
}

.hamburger--vortex.is-active .hamburger-inner::after {
  bottom: 0;
  transform: rotate(90deg);
}

/**Styles for Mobile Menu**/
header#masthead {
  display: block;
  justify-content: flex-start;
  align-items: center;
}

#open-mobile {
  color: #ebebeb;
  cursor: pointer;
  height: 100%;
  margin-top: 15px;
  margin-right: 15px;
  font-size: 32px;
  left: 10px;
  cursor: pointer;
  z-index: 10000;
  width: 50px;
}
#open-mobile button:hover {
  background-color: transparent !important;
}
#open-mobile button.hamburger {
  color: white;
  z-index: 100;
  transition: all 1s;
  outline: none;
  width: 50px;
}
#open-mobile button.hamburger .hamburger-box {
  opacity: 1;
  transform: scale(1);
  transition: all 1s;
}
#open-mobile button.hamburger hamburger-box:hover {
  opacity: .7;
  transform: scale(1.2);
  transition: all 1s;
}
#open-mobile .hamburger.is-active .hamburger-box {
  color: white;
}

.display-mobile {
  z-index: 10000;
}

#epixMobileMenu {
  display: block;
}

#site-navigation {
  display: none;
}

.menu-container {
  color: white;
  cursor: pointer;
  width: 0;
  height: auto;
}

.menu-container.full-menu {
  padding: 0 !important;
  position: aboslute;
  width: 100%;
  height: 100%;
  left: 0;
  top: -120px;
}

.full-menu .hamburger {
  top: 160px;
  left: 40px;
}

.sidenav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 0%;
  opacity: 0;
  visibility: hidden;
  overflow: hidden;
  background-color: #000;
  overflow-x: hidden;
  z-index: 1000;
}
.sidenav .site-title.mobile-title {
  margin-left: 100px;
}
.sidenav .mobile-menu-container {
  margin-top: 100px;
  background: #151515;
  height: 100%;
}
.sidenav .mobile-menu-container .menu-primary-container {
  padding-top: 50px;
}
.sidenav .mobile-menu-container .menu-primary-container ul#primary-menu li {
  margin-bottom: 50px;
  margin-left: 40px;
}
.sidenav .mobile-menu-container .menu-primary-container ul#primary-menu li a {
  text-align: left;
  text-transform: uppercase;
}
.sidenav .mobile-menu-container .social-media.mobile {
  top: 37rem !important;
  right: auto;
  left: -40px;
}

.sidenav.open {
  opacity: 1;
  visibility: visible;
  height: 100%;
}

.sidenav.open li {
  animation: fadeInLeft .5s ease forwards;
  animation-delay: .35s;
}

.sidenav.open li:nth-of-type(2) {
  animation-delay: .4s;
}

.sidenav.open li:nth-of-type(3) {
  animation-delay: .45s;
}

.sidenav.open li:nth-of-type(4) {
  animation-delay: .50s;
}

.sidenav .menu-mobile-container {
  height: 50%;
  top: 0%;
  margin-top: 40px;
  transform: translateY(36%);
  display: flex;
  justify-content: center;
}
.sidenav .menu-mobile-container ul {
  list-style: none;
  padding: 0;
  display: inline-block;
  position: relative;
  height: 100%;
}
.sidenav .menu-mobile-container ul li {
  margin-bottom: 32px;
}
.sidenav .menu-mobile-container ul li a {
  text-decoration: none;
  text-transform: uppercase;
  display: block;
  transition: 1s;
  font-family: 'ClanOT-Book', arial, sans-serif;
  font-size: 32px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: 0px;
  text-align: center;
  color: #fefefe;
}
.sidenav .menu-mobile-container ul li a:active,
.sidenav .menu-mobile-container ul li a:focus,
.sidenav .menu-mobile-container ul li a:hover {
  color: orange;
}
.sidenav .menu-mobile-container ul li.current-menu-item > a {
  color: orange;
}
.sidenav .menu-mobile-container ul li.external-link {
  position: relative;
}
.sidenav .menu-mobile-container ul li.external-link a {
  padding: 0 35px;
}
.sidenav .menu-mobile-container ul li.external-link a:hover:after {
  content: url(../img/icon_external-link-lg.png);
  position: absolute;
  right: 0px;
  top: -4px;
}
.sidenav .menu-mobile-container ul li.external-link.short a:after {
  right: 40px;
}
.sidenav .menu-mobile-container ul li.current_page_item.menu-item-home a {
  color: white;
}
.sidenav .menu-mobile-container ul li.sub-menu-item a {
  color: white;
}
.sidenav .menu-mobile-container ul li.sub-menu-item a:hover {
  color: orange;
}
.sidenav .menu-mobile-container ul li.sub-menu-item a:focus {
  color: orange;
}
.sidenav .menu-mobile-container ul li.sub-menu-item a:active {
  color: orange;
}

.sidenav div.sub-menu {
  width: 100%;
  margin-top: 24px;
}
.sidenav div.sub-menu li {
  text-align: left;
}
.sidenav div.sub-menu li a {
  font-size: 20px;
  letter-spacing: 0;
  cursor: pointer;
  text-transform: none;
  color: white;
}

.sidenav ul li {
  display: block;
  position: relative;
  opacity: 0;
}

.sidenav ul li a {
  display: block;
  position: relative;
  color: #fff;
  text-decoration: none;
  overflow: hidden;
  opacity: 1;
}

.overlay ul li a:hover,
.overlay ul li a:focus,
.overlay ul li a:active {
  opacity: 1;
  transform: scale(1.2);
  transition: all 1s;
}

.sidenav a:hover,
.offcanvas a:focus {
  color: white;
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    right: 50%;
  }
  100% {
    opacity: 1;
    right: 0;
  }
}
/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
.main-navigation {
  display: block;
  float: left;
  width: auto;
  margin-top: 2.1rem;
}
.main-navigation ul {
  list-style: none;
  margin: 0;
  padding-left: 0;
}
.main-navigation ul ul {
  float: left;
  position: absolute;
  top: 1.5em;
  left: -999em;
  z-index: 99999;
}
.main-navigation ul ul ul {
  left: -999em;
  top: 0;
}
.main-navigation ul ul li:hover > ul, .main-navigation ul ul li.focus > ul {
  left: 100%;
}
.main-navigation ul ul a {
  width: 200px;
  transition: all .3s;
}
.main-navigation ul li:hover > ul,
.main-navigation ul li.focus > ul {
  left: auto;
}
.main-navigation li {
  float: left;
  position: relative;
}
.main-navigation a {
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 1rem;
  font-weight: 400;
  letter-spacing: 1.8px;
  color: #fff;
  font-family: 'ClanOT-Book', arial, sans-serif;
  transition: all .2s;
}
.main-navigation a:hover, .main-navigation a:focus {
  color: #C7A338;
  padding-bottom: 10px;
  border-bottom: 4px solid #C7A338;
}

/*Highlight Active Menu Items*/
.current_page_item a {
  color: #C7A338;
}

ul#primary-menu {
  font-size: 1.5em;
  font-weight: bold;
}
ul#primary-menu li {
  margin-left: 30px;
}

/*--------------------------------------------------------------
## Tabs
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Accessibility
--------------------------------------------------------------*/
/* Text meant only for screen readers. */
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
}
.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  color: #21759b;
  display: block;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: bold;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
  /* Above WP toolbar. */
}

/* Do not show the outline on the skip link target. */
#content[tabindex="-1"]:focus {
  outline: 0;
}

/*--------------------------------------------------------------
# Alignments
--------------------------------------------------------------*/
.alignleft {
  display: inline;
  float: left;
  margin-right: 1.5em;
}

.alignright {
  display: inline;
  float: right;
  margin-left: 1.5em;
}

.aligncenter {
  clear: both;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/*--------------------------------------------------------------
# Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after,
.entry-content:before,
.entry-content:after,
.comment-content:before,
.comment-content:after,
.site-header:before,
.site-header:after,
.site-content:before,
.site-content:after,
.site-footer:before,
.site-footer:after {
  content: "";
  display: table;
  table-layout: fixed;
}

.clear:after,
.entry-content:after,
.comment-content:after,
.site-header:after,
.site-content:after,
.site-footer:after {
  clear: both;
}

/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## General
--------------------------------------------------------------*/
/*General Styles Found On All Pages*/
body {
  background: #151515;
}

/*Centers content in the middle of the page where colors have to stretch to edge of browser in desktop*/
.main-container {
  max-width: 1280px;
  margin: 0 auto;
  position: relative;
}

#page {
  width: 100%;
  margin: 0 auto;
  margin-top: 92px;
}

body.home #page {
  margin-top: 92px;
}

section {
  width: 100%;
  overflow: hidden;
  border-top: 1px solid #C7A338;
}

.line {
  width: 49.5px;
  height: 2px;
  display: block;
  background: #C7A338;
  text-align: center;
}

/*--------------------------------------------------------------
## Header
--------------------------------------------------------------*/
/*Header Styles*/
header#masthead {
  width: 100%;
  background: #000;
  padding: 0 25px;
  top: 0;
  position: fixed;
  left: 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 0 25px;
  z-index: 500000;
}
header#masthead .main-container {
  display: flex;
  justify-content: flex-start;
  align-items: normal;
}
header#masthead .site-branding {
  margin-left: 15px;
  width: 18rem;
  text-align: center;
}
header#masthead .site-branding img {
  width: 100%;
  height: auto;
}
header#masthead ul.social-media {
  width: 150px;
  position: absolute;
  right: 0;
  top: 38px;
}
header#masthead ul.social-media li {
  float: right;
  margin-left: 30px;
}
header#masthead ul.social-media li.twitter {
  margin-top: 4px;
}
header#masthead ul.social-media.header {
  display: none;
}

header.character-meta {
  margin-top: 150px;
}

/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
#latest-originals {
  background: #151515;
  padding: 25px;
}
#latest-originals li {
  width: 48%;
  padding: 0;
}
#latest-originals li:nth-child(even) {
  margin-left: 2%;
  margin-right: 0;
}
#latest-originals li:nth-child(odd) {
  margin-right: 2%;
  margin-left: 0;
}

#latest-press-releases {
  background: #232323;
  padding: 25px;
}
#latest-press-releases h3 {
  font-family: 'ClanOT-Book', arial, sans-serif;
  font-size: 32px;
  line-height: 33px;
  color: #ebebeb;
  text-align: left;
  letter-spacing: -0.2px;
}
#latest-press-releases ul {
  padding: 0;
  margin: 0;
}
#latest-press-releases li {
  padding-bottom: 70px;
  border-bottom: 1px solid #ebebeb;
  margin: 0px 0 30px 0;
}
#latest-press-releases li time {
  width: 100%;
  float: left;
  font-family: 'ClanOT-Book', arial, sans-serif;
  font-size: 14px;
  font-weight: 100;
  color: #b2b2b2;
  margin-bottom: 8px;
}
#latest-press-releases li a {
  text-decoration: none;
  text-align: left;
  height: 89px;
  font-family: 'ClanOT-Book', arial, sans-serif;
  font-size: 24px;
  line-height: 31px;
  color: #ffffff;
}
#latest-press-releases li h3.press-release-title {
  margin-bottom: 16px;
}
#latest-press-releases li ul.term-list {
  margin-top: 20px;
}
#latest-press-releases li ul.term-list a {
  color: #C7A338;
  font-size: 14px;
  font-weight: 100;
  text-align: left;
}
#latest-press-releases h4.desktop-press-releases {
  display: none;
}
#latest-press-releases h4.desktop-press-releases .fa.fa-chevron-right {
  font-size: 16px;
  color: #C7A338;
  margin-left: 14px;
  font-weight: 100;
  line-height: 1;
}

/*Mobile*/
.button-container.all-press-releases {
  background: #232323;
}

#about-epix {
  background: url("../images/about/bg1-about-homepage.svg") top left no-repeat;
  background-size: cover;
  padding: 25px;
}
#about-epix h3 {
  font-size: 36px;
  margin-bottom: 10px;
}
#about-epix .line {
  margin-bottom: 26px;
}
#about-epix p {
  font-size: 16px;
  line-height: 31px;
  text-align: left;
}

/*Covers all Images, both on front page and originals*/
#originals {
  max-width: 1280px;
}
#originals a {
  text-decoration: none;
}

li figure {
  position: relative;
  width: 100%;
  height: 100%;
}
li figure figcaption {
  background: #424242;
  color: #ebebeb;
  width: 100%;
  height: 70px;
  font-size: 14px;
  font-family: 'ClanOT-Medium', arial, sans-serif;
  line-height: 1;
  padding: 15px 10px 10px 10px;
  margin-top: -10px;
}
li figure figcaption.transparent {
  opacity: 0;
}

/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
.sticky {
  display: block;
}

.hentry {
  margin: 0 0 1.5em;
}

.byline,
.updated:not(.published) {
  display: none;
}

.single .byline,
.group-blog .byline {
  display: inline;
}

.page-content,
.entry-content,
.entry-summary {
  margin: 1.5em 0 0;
}

.page-links {
  clear: both;
  margin: 0 0 1.5em;
}

.nav-header {
  max-width: 1280px;
  width: 96%;
  height: auto;
  margin: 0 auto;
  overflow: visible;
}
.nav-header header#nav-header {
  float: right;
}

#originals {
  z-index: 1;
  margin: 0 auto;
  margin-bottom: 80px;
}

#main-content {
  max-width: 100%;
  margin: 0 auto;
}

/* --- filter dropdown --- */
nav#filter {
  text-align: center;
  width: 100%;
  margin: 0 auto;
  margin-top: 40px;
  /*This is ipad and above*/
  /* Hover state */
  /* Active state */
  /*Search*/
}
nav#filter .wrapper-dropdown {
  /* Size and position */
  position: relative;
  /* Enable absolute positioning for children and pseudo elements */
  width: 96%;
  height: 50px;
  display: inline-block;
  text-align: left;
  padding: 10px;
  margin: 20px 2%;
  /* Styles */
  background: #3a3a3a;
  color: #ebebeb;
  outline: none;
  cursor: pointer;
  list-style: none;
  /* Font settings */
  font-weight: 500;
  font-size: 18px;
  font-family: 'ClanOT-Book', arial, sans-serif;
  /*make sure it's over images*/
  z-index: 1000;
}
nav#filter .wrapper-dropdown span {
  font-family: 'ClanOT-Medium', arial, sans-serif;
}
nav#filter .wrapper-dropdown:after {
  content: "\f078";
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  text-decoration: inherit;
  /*--adjust as necessary--*/
  color: #C7A338;
  font-size: 18px;
  position: absolute;
  right: 16px;
  top: 50%;
  margin-top: -12px;
}
nav#filter .wrapper-dropdown .dropdown {
  /* Size & position */
  position: absolute;
  top: 100%;
  left: 0;
  /* Size */
  right: 0;
  /* Size */
  /* Styles */
  background: #3a3a3a;
  font-weight: normal;
  /* Overwrites previous font-weight: bold; */
  /* Hiding */
  opacity: 0;
  pointer-events: none;
}
nav#filter .wrapper-dropdown.active > .dropdown {
  position: relative;
  top: 14px;
  left: -10px;
  right: 0px;
  width: 105%;
}
nav#filter #dd.wrapper-dropdown.active + #ascend-descend {
  margin-top: 50px;
}
nav#filter .wrapper-dropdown .dropdown li a {
  display: block;
  text-decoration: none;
  color: #ebebeb;
  padding: 10px 20px;
}
nav#filter .wrapper-dropdown .dropdown li:hover a {
  background: #3a3a3a;
}
nav#filter .wrapper-dropdown.active .dropdown {
  opacity: 1;
  pointer-events: auto;
}
nav#filter .wrapper-dropdown.active:after {
  content: "\f054";
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  text-decoration: inherit;
  /*--adjust as necessary--*/
  color: #C7A338;
  font-size: 18px;
  position: absolute;
  right: 16px;
  top: 50%;
  margin-top: -12px;
}
nav#filter .wrapper-dropdown.active {
  background: #3a3a3a;
}
nav#filter #search {
  width: 96%;
  height: 50px;
  position: relative;
  margin: 20px 2%;
}
nav#filter #search input {
  width: 100%;
  height: 100%;
  background: #3a3a3a;
  color: #fff;
  font-size: 18px;
  text-align: left;
  font-family: 'ClanOT-Book', arial, sans-serif;
  padding: 10px;
  padding-left: 18px;
  border: none;
}
nav#filter #search span.magnifying-glass {
  position: absolute;
  right: 10px;
  top: 15px;
}

/*style correctives*/
ul.dropdown {
  list-style: none;
  padding: 0;
}

.nav-header {
  content: "";
  display: table;
  table-layout: fixed;
}

#originals {
  padding: 0;
}
#originals h2, #originals time.hidden {
  display: none;
}

li.program-cover, li.element-item {
  width: 48%;
  height: 360px;
  list-style: none;
  padding: 1% 2%;
  float: left;
  /* From: https://stackoverflow.com/questions/23819729/large-isotope-gallery-is-very-slow */
  transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
}
li.program-cover figure, li.element-item figure {
  margin: 0;
}
li.program-cover figure img, li.element-item figure img {
  width: 100%;
  max-width: 100%;
  height: auto;
}
li.program-cover img, li.element-item img {
  width: 100%;
}

li.program-cover {
  height: 400px;
}
li.program-cover img {
  height: auto;
}

/*Single Programming page (probably needs its own page)*/
section.tabcontent li {
  width: 100%;
}

/*Press Release Pages (might need its own page as well)*/
.press-releases li.element-item {
  width: 95%;
  height: auto;
  padding-top: 53px;
  padding-bottom: 50px;
  margin: 0 2.5% 67px 2.5%;
}
.press-releases li.element-item h1.entry-title a {
  text-decoration: none;
  font-size: 30px;
  line-height: 33px;
}
.press-releases li.element-item time {
  color: #b2b2b2;
  font-size: 14px;
  text-align: left;
  font-family: 'ClanOT-Medium', arial, sans-serif;
}
.press-releases li.element-item .entry-header time.press-releases {
  display: block;
}
.press-releases li.element-item .entry-meta time.press-releases {
  display: none;
}
.press-releases li.element-item .entry-meta ul {
  margin: 0;
  padding: 0;
}
.press-releases li.element-item .entry-meta ul .press-release-tax {
  float: left;
  text-decoration: none;
}
.press-releases li.element-item .entry-meta ul .press-release-tax a {
  font-size: 14px;
  color: #C7A338;
}

#press-release ul {
  padding: 0;
  margin: 0;
}

#press-release h3 a, .press-release-title a {
  text-transform: capitalize;
}

li > ul {
  padding: 0;
  margin: 0;
}
li > ul .press-release-tax {
  list-style: none;
  float: left;
}
li > ul .press-release-tax a {
  color: #C7A338;
  font-size: 14px;
  text-decoration: none;
  text-align: left;
}

/*Fix: for some reason press-releases box floats up as window shrinks. */
#originals.press-releases {
  margin-top: 50px;
}

/*Press Release Single Page*/
.single-content {
  max-width: 1425px;
  margin: 0 auto;
}
.single-content h1 {
  max-width: 991px;
  margin: 0 auto;
}
.single-content .entry-content {
  max-width: 991px;
  margin: 0 auto;
}

.single-content.press-release-content {
  margin-top: 100px;
}
.single-content.press-release-content h1 {
  text-align: left;
  font-size: 36px;
  color: #ebebeb;
}
.single-content.press-release-content p strong {
  font-size: 16px;
  text-align: left;
  font-family: 'ClanOT-Medium', arial, sans-serif;
}
.single-content.press-release-content p em {
  font-family: 'ClanOT-MediumItalic', arial, sans-serif;
}

/*Some pecularities with social buttons here*/
#download-material ul.social-media.program li {
  margin-top: 0;
}

/*About Page*/
.single-content.about-page {
  max-width: 800px;
  padding: 0 25px;
  margin: 0 auto;
}
.single-content.about-page h4 {
  color: #ebebeb;
  text-transform: uppercase;
}
.single-content.about-page .line {
  margin-bottom: 48px;
}

#logo-download {
  content: "";
  display: table;
  table-layout: fixed;
}
#logo-download h4 {
  font-weight: bold;
  font-size: 14px;
  line-height: 31px;
}
#logo-download ul {
  width: 100%;
  content: "";
  display: table;
  table-layout: fixed;
}
#logo-download ul li.logo {
  width: auto;
  float: left;
  margin: 0 2em;
}
#logo-download ul li.logo:first-child {
  margin-left: 0;
}
#logo-download ul li.logo:last-child {
  margin-right: 0;
}

#download-material {
  width: 100%;
  margin: 0 auto;
  content: "";
  display: table;
  table-layout: fixed;
  border-top: 1px solid #424242;
}
#download-material .download-links {
  padding: 0 25px;
}
#download-material .download-links li {
  float: left;
  overflow: hidden;
  width: 100%;
  margin-bottom: 32px;
}
#download-material .download-links li a {
  font-size: 16px;
  font-family: 'ClanOT-Book', arial, sans-serif;
}
#download-material ul.social-media {
  width: 100%;
  margin-top: 50px;
  padding-left: 25px;
  margin-bottom: 32px;
}
#download-material ul.social-media h4 {
  margin: 4px 0 0 0;
}
#download-material ul.social-media li {
  width: auto;
  margin-left: 45px;
}
#download-material ul.social-media li.twitter {
  margin-top: .25em;
}
#download-material a.download-pdf {
  display: block;
  float: none;
  padding-left: 30px;
  margin: 0 auto;
}

/*background SVG*/
body.page-about-epix #content {
  background: url("../images/about/bg_about-02.svg") top left no-repeat;
  background-size: cover;
  padding-top: 54px;
  margin-top: 0;
}

#about-page .line {
  margin-bottom: 48px;
}

.press-releases li.element-item:nth-child(even) {
  background-color: #2a2a2a;
}

/*******General**********/
.show-mobile {
  display: block;
}

.show-desktop {
  display: none;
}

/*--------------------------------------------------------------
## Single Programming Page
--------------------------------------------------------------*/
/*Single Program Pages*/
.mobile {
  display: block;
}

.program-header figure#banner-image.mobile-banner-image {
  display: block;
  margin-top: 50px;
}

.laptop {
  display: none;
}

/*Style fix for banner image*/
body.single #page {
  margin-top: 38px;
}

section {
  border-top: none;
}

.program-header {
  position: relative;
}
.program-header header.program-page {
  padding: 25px 57px 25px 25px;
}
.program-header header.program-page h1 {
  font-size: 36px;
  text-align: left;
  font-family: 'ClanOT-Book', arial, sans-serif;
  font-weight: 100;
}
.program-header header.program-page p {
  font-size: 18px;
  line-height: 31px;
  text-align: left;
  letter-spacing: 0.1px;
}
.program-header figure#banner-image {
  margin: 0;
}

/*Hide element for mobile*/
span.display-tab {
  display: none;
}

#tab-section {
  max-width: 1425px;
  margin: 0 auto;
}

/* Style the tab */
div.tab {
  overflow: hidden;
  background-color: #000;
}

/* Style the buttons inside the tab */
div.tab .tablinks {
  background-color: #232323;
  font-family: ClanOT-Medium, Arial, sans-serif;
  float: left;
  width: 100%;
  height: 70px;
  text-align: center;
  border: none;
  outline: none;
  cursor: pointer;
  color: #ebebeb;
  padding: 23px 16px;
  transition: 0.3s;
  border-right: 1px solid #000;
}
div.tab .tablinks:last-child {
  border-right: none;
}

/* Change background color of .tablinkss on hover */
div.tab .tablinks:hover {
  background-color: #232323;
}

/* Create an active/current tablink class */
div.tab .tablinks.active {
  background-color: #333;
  border-right: none;
}

/* Style the tab content */
.tabcontent {
  display: none;
  background: #333;
  overflow: hidden;
  padding: 25px;
  border-top: none;
}
.tabcontent p {
  font-size: 14px;
  line-height: 31px;
  text-align: left;
}

.tabcontent {
  animation: fadeEffect 1s;
  /* Fading effect takes 1 second */
}

#Overview {
  display: block;
}
@keyframes fadeEffect {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
a.download-pdf {
  color: #fff;
  font-size: 18px;
  line-height: 0.78;
  text-decoration: none;
  letter-spacing: -0.1px;
  background: #333;
  float: right;
  padding: 22px 37px 20px 67px;
  margin: 25px 46px 25.9px 0;
}
a.download-pdf .download-icon {
  padding-top: 5px;
  margin-right: 7px;
}

/*Overview*/
.overview {
  padding: 0;
}
.overview figure {
  margin: 0;
}
.overview img {
  width: 100%;
}
.overview p {
  margin: 26px;
}
.overview p.hideMobile {
  margin: 0;
}

/*Where Multiple Seasons*/
.seasonscontent .overview {
  padding: 0;
}
.seasonscontent .overview figure {
  padding: 0;
  margin: 0;
}
.seasonscontent .overview .highlight-info {
  padding: 0 25px;
}

/*Episode Section*/
#Episodes ul, .episodes ul {
  margin: 0;
}
#Episodes ul li, .episodes ul li {
  float: left;
  padding-bottom: 80px;
  border-bottom: 2px solid #424242;
}

.episode-video {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  max-width: 100%;
  height: auto;
}

.episode-video iframe,
.episode-video object,
.episode-video embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*I'm repeating this in case something goes wrong on video page*/
.iframe-wrapper {
  position: relative;
  overflow: hidden;
  padding-top: 56.25%;
}
.iframe-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.screen-link.button-container {
  width: 100%;
  float: left;
  margin-top: 10px;
}

.episode-description {
  width: 100%;
  float: left;
}
.episode-description ul {
  padding: 0;
}
.episode-description h3 {
  font-size: 36px;
  text-align: left;
}
.episode-description p {
  font-size: 14px;
  line-height: 31px;
}

/*Cast Bio Section*/
#Bios, .bios {
  padding: 10px 25px;
}
#Bios ul, .bios ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}
#Bios ul li, .bios ul li {
  width: 100%;
  padding: 0 2%;
}
#Bios ul li figure, .bios ul li figure {
  margin: 0;
}
#Bios ul li figure img, .bios ul li figure img {
  width: 100%;
}
#Bios ul li h3,
#Bios ul li h4, .bios ul li h3,
.bios ul li h4 {
  font-size: 18px;
  line-height: 18px;
  letter-spacing: -0.1px;
  text-align: center;
  color: #ebebeb;
  font-family: 'ClanOT-Book', arial, sans-serif;
}
#Bios ul li h3.actor-name, .bios ul li h3.actor-name {
  font-weight: 500;
  margin-bottom: 4px;
}
#Bios ul li h4.character-name, .bios ul li h4.character-name {
  font-weight: 100;
  font-family: 'ClanOT-Medium', arial, sans-serif;
  height: 40px;
}
#Bios ul li .cast-bio-button, .bios ul li .cast-bio-button {
  text-decoration: none;
  font-size: 18px;
  letter-spacing: -0.1px;
  width: 100%;
  text-align: center;
  background: transparent;
  margin: 22px auto;
  border: 1px solid #C7A338;
  transition: all .3s;
}
#Bios ul li .cast-bio-button:hover, .bios ul li .cast-bio-button:hover {
  background-color: #C7A338;
  color: #333;
  transform: translateY(-2px);
}
#Bios ul .button-container, .bios ul .button-container {
  justify-content: flex-start;
  display: flex;
  flex: 0 1 auto;
  align-items: center;
  width: 100%;
  margin: 22px 0;
}

/*Single Cast Bio*/
#full-cast-bio {
  max-width: 638px;
  padding-bottom: 48px;
  margin: 0 auto;
}
#full-cast-bio figure {
  width: 175px;
  margin: 0 auto;
}
#full-cast-bio figure img {
  width: 100%;
}
#full-cast-bio h1 {
  font-size: 36px;
  line-height: 1;
  letter-spacing: 0;
  text-align: center;
}
#full-cast-bio h2 {
  font-size: 16px;
  line-height: 1.12;
  letter-spacing: 0.1px;
  text-align: center;
  color: #ebebeb;
}
#full-cast-bio h3 {
  font-size: 24px;
  line-height: 1.11;
  letter-spacing: 0.2px;
  text-align: left;
  color: #ebebeb;
}
#full-cast-bio p {
  color: #fff;
  font-size: 16px;
  line-height: 1.44;
  margin: 0 28px;
}

/*Video Clip Section*/
#Videos ul, .videos ul {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
}
#Videos ul li.video-box, .videos ul li.video-box {
  width: 100%;
  height: auto;
  padding: 25px 5px;
}
#Videos ul li.video-box h3, .videos ul li.video-box h3 {
  font-size: 18px;
  text-align: left;
  margin: 5px 0;
}

/*Photo Gallery Section*/
.photos ul {
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.photos ul li {
  width: 100%;
}
.photos ul li h3.photo-title {
  font-size: 16px;
  color: #ebebeb;
  float: left;
  max-width: auto;
  clear: none;
  margin-bottom: 10.5px;
}
.photos ul li h3.photo-count {
  font-size: 16px;
  color: #b2b2b2;
  float: right;
  width: auto;
  clear: none;
  margin-bottom: 10.5px;
}

#carousel ul.modal-content {
  display: block;
}

/*Temp fix while I figure out why the gallery is being shown twice*/
.mfp-counter {
  display: none;
}

#press-release {
  max-width: 1280px;
  background: #232323;
  padding: 25px;
  margin: 0 auto;
}
#press-release li {
  margin: 104px 0;
}
#press-release li.press-release-tax {
  margin: 0;
}
#press-release time {
  color: #b2b2b2;
  font-size: 14px;
  text-align: left;
}
#press-release h3 {
  text-align: left;
  margin: 0;
}
#press-release h3 a {
  text-decoration: none;
}
#press-release .entry-header time.press-releases {
  display: block;
  margin-bottom: 40px;
}
#press-release .entry-meta time.press-releases {
  display: none;
}

#Overview .button-container {
  background: #232323;
}

.single-content.press-release-content {
  padding: 26px;
}
.single-content.press-release-content p {
  font-size: 16px;
  line-height: 1.5;
  color: #ebebeb;
}

/*To convert the tabs for mobile: https://css-tricks.com/transformer-tabs/*/
/*TODO: Find a way to make this modular so it doesn't have to be reused for this instance (especially since it has to be taken off for above ipad)*/
/*TODO Hacky, but will have to do for now (until I can redo markup and styles)*/
@media screen and (max-width: 600px) {
  /*Converts tabs to mobile*/
  nav#tabs-dd {
    float: left;
    width: 100%;
    overflow: visible;
    background: #333;
  }

  span.display-tab {
    display: block;
    font-family: 'ClanOT-Medium', arial, sans-serif;
  }

  #tabs-dd.tab {
    overflow: visible;
  }

  #tabs-dd-2.tab {
    overflow: visible;
  }

  .wrapper-dropdown {
    /* Size and position */
    position: relative;
    /* Enable absolute positioning for children and pseudo elements */
    width: 96%;
    height: 50px;
    display: inline-block;
    text-align: left;
    padding: 10px;
    margin: 20px 2%;
    /* Styles */
    background: #3a3a3a;
    color: #ebebeb;
    outline: none;
    cursor: pointer;
    list-style: none;
    /* Font settings */
    font-weight: 500;
    font-size: 18px;
    font-family: 'ClanOT-Book', arial, sans-serif;
    /*make sure it's over images*/
    z-index: 1000;
  }

  .wrapper-dropdown:after {
    content: "\f078";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    /*--adjust as necessary--*/
    color: #C7A338;
    font-size: 18px;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -12px;
  }

  /*This is ipad and above*/
  .wrapper-dropdown .dropdown {
    /* Size & position */
    position: absolute;
    top: 100%;
    left: 0;
    /* Size */
    right: 0;
    /* Size */
    /* Styles */
    background: #3a3a3a;
    font-weight: normal;
    /* Overwrites previous font-weight: bold; */
    /* Hiding */
    opacity: 0;
    pointer-events: none;
    border-top: 1px solid #b2b2b2;
  }

  .wrapper-dropdown.active > .dropdown {
    position: relative;
    top: 14px;
    width: 105%;
    left: -10px;
    display: inline-block;
  }

  #filter.season-filter #season-filter .seasonlink {
    width: 100.5%;
  }

  .wrapper-dropdown .dropdown li {
    text-decoration: none;
    color: #ebebeb;
    padding: 8px 20px;
  }

  /* Hover state */
  .wrapper-dropdown .dropdown li:hover {
    background: #3a3a3a;
  }

  /* Active state */
  .wrapper-dropdown.active .dropdown {
    opacity: 1;
    pointer-events: auto;
  }

  .wrapper-dropdown.active:after {
    content: "\f054";
    font-family: FontAwesome;
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    /*--adjust as necessary--*/
    color: #C7A338;
    font-size: 18px;
    position: absolute;
    right: 16px;
    top: 50%;
    margin-top: -12px;
  }

  .wrapper-dropdown.active {
    background: #3a3a3a;
  }
}
/*TODO: make this and the header social media one style rule*/
ul.social-media {
  width: 150px;
}
ul.social-media li {
  float: Left;
}

ul.social-media.program {
  width: 100%;
}
ul.social-media.program h4 {
  color: #fff;
}
ul.social-media.program h4, ul.social-media.program li {
  display: inline-block;
  float: left;
  width: 50px;
}
ul.social-media.program li {
  margin-top: 1.2em;
}

ul.social-media.program {
  float: left;
}
ul.social-media.program h4 {
  color: #fff;
  float: left;
}
ul.social-media.program li {
  margin-left: 22px;
}
ul.social-media.program li.twitter {
  margin-top: 1.45em;
  margin-left: 0;
}

/**********Season Filters**********/
/*Default*/
.seasonscontent {
  display: none;
}

.tabcontent.active {
  display: block;
}

.seasonlink {
  background: #333;
  font-family: ClanOT-Medium, Arial, sans-serif;
}

.seasonlink.active {
  display: none;
}

#filter.season-filter {
  float: left;
  width: 100%;
  margin: 20px auto;
}
#filter.season-filter .seasonlink {
  width: 107%;
  padding: 10px;
}

nav#filter #season-filter.wrapper-dropdown.active > .dropdown {
  position: relative;
  top: 12px;
}

.overview.tabcontent.active {
  display: block;
}

/*Fix for twitter going too high on program page*/
ul.social-media.program li.twitter {
  margin-top: 1.45em;
}

/*TODO Temp fix for lightbox double counting problem*/
.mfp-counter {
  display: block;
}

/*--------------------------------------------------------------
## Single Highlight Page
--------------------------------------------------------------*/
/*Styles for Single Highlight Page*/
.highlight-summary p {
  font-size: 16px;
}

li.highlight {
  float: left;
  width: 100%;
  overflow: hidden;
}
li.highlight .highlight-cover-image img {
  width: 100%;
}

figure.program-cover-image {
  width: 100%;
  margin: 0;
}

.program-info {
  width: 100%;
  padding: 0 26px;
}
.program-info h3 {
  font-size: 18px;
  color: #ebebeb;
  text-align: left;
  padding-top: 0;
  margin-top: 10px;
}
.program-info figure.highlight-cover-image {
  margin: 1em 0;
}

#Overview #highlight-sections p {
  margin: 0;
}
#Overview .full-width.highlight-info {
  width: 100%;
  padding-right: 25px;
  padding-left: 65px;
}
#Overview .full-width.highlight-info h3 {
  text-align: left;
  font-size: 24px;
}

/*Image Gallery for Highlights*/
#Images ul.social-media {
  margin-top: 20px;
  margin-left: 0;
}
#Images ul.social-media h4 {
  color: #fff;
  float: left;
}
#Images ul.social-media li {
  width: 32px;
  margin-top: 20px;
}
#Images ul.social-media li.twitter {
  margin-top: 23px;
}

/*--------------------------------------------------------------
## Footer
--------------------------------------------------------------*/
#footer {
  background-color: #424242;
  padding: 25px;
}
#footer ul {
  padding: 0;
  margin: 30px 0;
}
#footer li {
  float: left;
  color: #ebebeb;
  font-size: 14px;
  text-align: center;
  list-style: none;
  width: 100%;
  margin-bottom: 20px;
}
#footer h3 {
  font-size: 24px;
  margin-bottom: 10px;
}
#footer a.dusty-orange {
  color: #C7A338;
  text-decoration: none;
}
#footer .social-media-container {
  display: flex;
  width: 100%;
  justify-content: center;
}
#footer .social-media-container ul {
  display: flex;
  margin-bottom: 10px;
}
#footer .social-media-container ul li {
  width: 50px;
  float: none;
  text-align: center;
}
#footer .social-media-container ul li svg {
  height: 22px;
}

footer.site-info {
  background: #000;
  float: left;
  width: 100%;
}
footer.site-info p {
  font-size: 12px;
  text-align: center;
}
footer.site-info p .dusty-orange {
  color: #C7A338;
}

/*--------------------------------------------------------------
# Infinite scroll
--------------------------------------------------------------*/
/* Globally hidden elements when Infinite Scroll is supported and in use. */
.infinite-scroll .posts-navigation,
.infinite-scroll.neverending .site-footer {
  /* Theme Footer (when set to scrolling) */
  display: none;
}

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before. */
.infinity-end.neverending .site-footer {
  display: block;
}

/*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
/**PRELOADER**/
body {
  overflow: hidden;
}

#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(21, 21, 21, 0.9);
  /* change if the mask should have another color then white */
  z-index: 99999999;
  /* makes sure it stays on top */
}

#status {
  width: 200px;
  height: 200px;
  position: absolute;
  left: 50%;
  /* centers the loading animation horizontally one the screen */
  top: 50%;
  /* centers the loading animation vertically one the screen */
  background-image: url("../images/Spinner-0.9s-64px.gif");
  /* path to your loading animation */
  background-repeat: no-repeat;
  background-position: center;
  margin: -100px 0 0 -100px;
  /* is width and height divided by two */
}

.modal-content {
  position: relative;
}

#gallery-preloader {
  position: relative;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.8);
  /* change if the mask should have another color then white */
  z-index: 999;
  /* makes sure it stays on top */
}

#gallery-status {
  display: none;
  width: 200px;
  height: 200px;
  position: absolute;
  left: 50%;
  /* centers the loading animation horizontally one the screen */
  top: 50%;
  /* centers the loading animation vertically one the screen */
  background-image: url("../images/Spinner-0.9s-64px.gif");
  /* path to your loading animation */
  background-repeat: no-repeat;
  background-position: center;
  margin: -100px 0 0 -100px;
  /* is width and height divided by two */
}

#gallery-preloader.gallery-fade-in {
  position: absolute;
  opacity: 1;
}

#gallery-preloader.gallery-fade-in #gallery-status {
  display: block;
}

#gallery-preloader {
  opacity: 0;
}

#gallery-click-through {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(21, 21, 21, 0.9);
  /* change if the mask should have another color then white */
  z-index: 999;
  /* makes sure it stays on top */
}

#gallery-click-through.gallery-fade-in {
  position: absolute;
  opacity: 1;
}

/*--------------------------------------------------------------
# Popup Modal
--------------------------------------------------------------*/
.popup {
  height: 100vh;
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  background-color: rgba(51, 51, 51, 0.9);
  z-index: 9999999;
  opacity: 0;
  visibility: hidden;
  transition: all .3s;
}
.popup__content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 95%;
  background-color: #151515;
  box-shadow: 0 2rem 4rem rgba(21, 21, 21, 0.2);
  border-radius: 3px;
  display: table;
  overflow: hidden;
  opacity: 0;
  transform: translate(-50%, -50%) scale(0.25);
  transition: all .5s .2s;
}
.popup__content #page-title {
  font-size: 1.8rem;
  padding: 2rem 2rem;
}
.popup__content h4 {
  font-family: 'ClanOT-Medium', arial, sans-serif;
  font-size: 1.1rem;
  text-align: center;
  color: #ebebeb;
}
.popup__content p {
  text-align: center;
  color: #ebebeb;
  margin-bottom: 1rem;
}
.popup__content .button {
  margin-bottom: 4rem;
}
.popup:target {
  opacity: 1;
  visibility: visible;
}
.popup:target .popup__content {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}
.popup__close {
  color: white;
  position: absolute;
  top: .5rem;
  right: 1rem;
  font-size: 3rem;
  text-decoration: none;
  display: inline-block;
  transition: all .2s;
  line-height: 1;
  cursor: pointer;
}
.popup__close:hover {
  color: white;
}

/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
.page-content .wp-smiley,
.entry-content .wp-smiley,
.comment-content .wp-smiley {
  border: none;
  margin-bottom: 0;
  margin-top: 0;
  padding: 0;
}

/* Make sure embeds and iframes fit their containers. */
embed,
iframe,
object {
  max-width: 100%;
}

/*--------------------------------------------------------------
## Captions
--------------------------------------------------------------*/
.wp-caption {
  margin-bottom: 1.5em;
  max-width: 100%;
}
.wp-caption img[class*="wp-image-"] {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.wp-caption .wp-caption-text {
  margin: 0.8075em 0;
}

.wp-caption-text {
  text-align: center;
}

/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
/*Custom Photo Gallery*/
.photos ul.modal-content {
  position: relative;
  /*margin: 5em auto 0 auto;*/
  padding: 0;
  width: 68%;
  max-width: 1200px;
  /*opacity: 0; 
      visibility: hidden;*/
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: all 5s;
}
.photos ul.modal-content .image-header {
  width: 100%;
  position: relative;
  /* The Close Button */
}
.photos ul.modal-content .image-header h3 {
  font-size: 24px;
  float: left;
  margin: 0;
  margin-bottom: 5px;
}
.photos ul.modal-content .image-header a {
  text-decoration: none;
  width: 120px;
  font-size: 15px;
  line-height: 1;
  position: absolute;
  width: 120px;
  top: 15px;
}
.photos ul.modal-content .image-header a span {
  margin-left: 5px;
  top: 22px;
}
.photos ul.modal-content .image-header a.expand,
.photos ul.modal-content .image-header a.download-link {
  position: absolute;
}
.photos ul.modal-content .image-header .close {
  color: white;
  width: auto;
  position: absolute;
  top: 0;
  right: 0;
  font-weight: bold;
  text-align: right;
}
.photos ul.modal-content .image-header .close span.close-text {
  font-size: 15px;
}
.photos ul.modal-content .image-header .close span.close-icon {
  font-size: 35px;
}
.photos ul.modal-content li.slide {
  width: 100%;
  float: none;
}
.photos ul.modal-content li.slide img {
  cursor: pointer;
}
.photos:target {
  opacity: 1;
  visibility: visible;
}
.photos:target ul.modal-content {
  opacity: 1;
  transform: translate(-50%, -50%) scale(1);
}

.gallery-link {
  cursor: pointer;
  transition: all 3s;
}
.gallery-link img {
  width: 100%;
  height: auto;
}

.row > .column {
  padding: 0 8px;
}

.row:after {
  content: "";
  display: table;
  clear: both;
}

.column {
  float: left;
  width: 25%;
}

body.modal-view header#masthead {
  z-index: 0;
}

/* The Modal (background) */
.modal {
  display: none;
  /*opacity: 0;*/
  /*need this for transitions*/
  position: fixed;
  z-index: 1000;
  padding-top: 10px;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
}

.close:hover,
.close:focus {
  color: #999;
  text-decoration: none;
  cursor: pointer;
}

.slide {
  display: none;
}

.slide img {
  width: 100%;
  height: auto;
}

.download-link {
  position: absolute;
  top: 0;
  right: 0;
}

.cursor {
  cursor: pointer;
}

/* Next & previous buttons */
.prev,
.next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  bottom: 50%;
  width: auto;
  padding: 16px;
  color: white;
  font-weight: bold;
  transition: 0.6s ease;
  user-select: none;
  -webkit-user-select: none;
}
.prev i,
.next i {
  font-size: 35px;
}

.prev {
  left: 1%;
}

/* Position the "next button" to the right */
.next {
  right: 1%;
}

/* On hover, add a black background color with a little bit see-through */
/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

img {
  margin-bottom: -4px;
}

.caption-container {
  text-align: center;
  background-color: #333;
  opacity: 0.77;
  height: auto;
  padding: 2px 16px;
  color: white;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
}
.caption-container p {
  font-size: 18px;
  color: #ebebeb;
  line-height: 23px;
}
.caption-container #counter {
  width: 25%;
  float: left;
}
.caption-container #caption {
  width: 70%;
  float: right;
  text-align: left;
}

.single-image-wrapper img {
  opacity: 0.6;
  width: 100%;
  min-height: 25vh;
}

.active,
.single-image-wrapper img:hover {
  opacity: 1;
}

img.hover-shadow {
  transition: 0.3s;
}

.hover-shadow:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

/*=================================================
    Temporary Desktop first Mobile styles to keep these encapsulated
    ==============================================*/
@media screen and (max-width: 800px) {
  .photos ul.modal-content {
    width: 90%;
  }
  .photos ul.modal-content .image-header {
    position: initial;
  }
  .photos ul.modal-content .image-header h3 {
    font-size: 18px;
  }
  .photos ul.modal-content .image-header a {
    top: auto;
    text-align: right;
    bottom: -25px;
  }
  .photos ul.modal-content .image-header a.download-link {
    right: 0;
  }
  .photos ul.modal-content .image-header a.expand {
    right: 120px;
  }
  .photos ul.modal-content .image-header span.close-text {
    display: none;
  }
  .photos ul.modal-content .image-header a.close {
    top: -5px;
  }
  .photos ul.modal-content .image-header span.close-icon {
    margin-bottom: 5px;
  }
  .photos ul.modal-content .image-header span.close-icon svg {
    width: 20px;
    height: 20px;
  }
  .photos ul.modal-content .image-header .slide img {
    opacity: 1;
    min-height: 80vh;
  }
  .photos ul.modal-content .prev,
  .photos ul.modal-content .next {
    top: 35%;
  }
  .photos ul.modal-content .caption-container p {
    font-size: 14px;
  }
}
/*--------------------------------------------------------------
## Galleries
--------------------------------------------------------------*/
.gallery {
  margin-bottom: 1.5em;
  display: none;
}

.gallery-item {
  display: inline-block;
  text-align: center;
  vertical-align: top;
  width: 100%;
}
.gallery-columns-2 .gallery-item {
  max-width: 50%;
}
.gallery-columns-3 .gallery-item {
  max-width: 33.33%;
}
.gallery-columns-4 .gallery-item {
  max-width: 25%;
}
.gallery-columns-5 .gallery-item {
  max-width: 20%;
}
.gallery-columns-6 .gallery-item {
  max-width: 16.66%;
}
.gallery-columns-7 .gallery-item {
  max-width: 14.28%;
}
.gallery-columns-8 .gallery-item {
  max-width: 12.5%;
}
.gallery-columns-9 .gallery-item {
  max-width: 11.11%;
}

.gallery-caption {
  display: block;
}

/*--------------------------------------------------------------
# Media Queryes
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## 450px and up
--------------------------------------------------------------*/
@media screen and (min-width: 450px) {
  header#masthead .site-branding {
    text-align: center;
  }

  .program-header figure#banner-image.mobile-banner-image {
    display: none;
  }

  figure#banner-image.laptop {
    display: block;
    margin-top: 2.2rem;
  }

  li.element-item, li.program-cover {
    height: 450px;
  }

  /*Bio Pages*/
  #Bios ul li,
  .bios ul li {
    width: 48%;
    padding: 0;
  }
}
/*--------------------------------------------------------------
## 600px and up
--------------------------------------------------------------*/
@media screen and (min-width: 600px) {
  /******************
     Tablets
     ******************/
  #filter.season-filter {
    width: 320px;
  }

  nav#filter .wrapper-dropdown.active > .dropdown {
    left: -10px;
    width: 103%;
  }

  /*Cover Images*/
  li.element-item {
    height: 550px;
  }

  /*Front Page*/
  #latest-originals li.program-cover {
    width: 23.5%;
    height: 100%;
    margin: 1%;
  }
  #latest-originals li.program-cover:nth-child(1) {
    margin-left: 0;
  }
  #latest-originals li.program-cover:nth-child(4) {
    margin-right: 0;
  }

  #latest-press-releases header {
    position: relative;
    width: 100%;
  }
  #latest-press-releases header h4.desktop-press-releases {
    position: absolute;
    display: block;
    top: 0;
    right: 0;
  }
  #latest-press-releases header h4.desktop-press-releases a {
    text-decoration: none;
  }
  #latest-press-releases h3 {
    text-align: left;
  }
  #latest-press-releases ul {
    margin-top: 64px;
  }
  #latest-press-releases li {
    width: 100%;
    float: left;
    padding-bottom: 0;
    margin-bottom: 30px;
    border-bottom: none;
  }

  section.button-container.all-press-releases {
    display: none;
  }

  /*Originals Pages*/
  /*Corrects an odd margin on the right site*/
  body.page-originals #main {
    padding-left: 15px;
  }

  body.page-highlights #main {
    padding-left: 15px;
  }

  .program-header header.program-page {
    padding: 30px 45px;
  }
  .program-header header.program-page h1 {
    margin: 0;
  }

  nav#filter {
    width: 100%;
  }
  nav#filter #dd,
  nav#filter #ascend-descend,
  nav#filter #search {
    display: inline-block;
    width: 93%;
  }

  #about-epix {
    padding: 18px 15%;
  }

  /*Programming Page*/
  div.tab .tablinks {
    width: 20%;
  }

  /*Overview*/
  #Overview figure,
  .overview figure {
    margin: 1em 4%;
  }

  #Episodes .episode-video,
  .episodes .episode-video {
    width: 100%;
    height: 380px;
    float: left;
    padding-bottom: 30px;
    margin-top: 10px;
  }

  #Bios li figure img,
  .bios li figure img {
    width: 100%;
  }
  #Bios li h3,
  #Bios li h4,
  .bios li h3,
  .bios li h4 {
    font-size: 18px;
    line-height: 18px;
    letter-spacing: -0.1px;
    text-align: center;
    color: #ebebeb;
    font-family: 'ClanOT-Book', arial, sans-serif;
  }
  #Bios li h3.actor-name,
  .bios li h3.actor-name {
    font-weight: 500;
  }
  #Bios li h4.character-name,
  .bios li h4.character-name {
    font-weight: 100;
  }
  #Bios li .cast-bio-button,
  .bios li .cast-bio-button {
    text-decoration: none;
    font-size: 18px;
    letter-spacing: -0.1px;
    width: 100%;
    text-align: center;
    margin: 22px auto;
    border: 1px solid #C7A338;
  }

  /*Videos*/
  #Videos ul li.video-box,
  .videos ul li.video-box {
    width: 48%;
  }

  #press-release ul {
    margin-top: 64px;
  }
  #press-release li {
    width: 100%;
    float: left;
    padding-bottom: 0;
    margin: 30px 0;
    border-bottom: none;
  }
  #press-release h3 {
    text-align: left;
  }

  /*News Page*/
  .press-releases li.element-item {
    height: auto;
  }
  .press-releases li.element-item h1.entry-title {
    text-align: center;
    margin: 0;
  }
  .press-releases li.element-item .entry-header {
    max-width: 989px;
    float: right;
  }
  .press-releases li.element-item .entry-header time {
    display: none;
  }
  .press-releases li.element-item .entry-meta {
    width: 360px;
    margin-left: 45px;
    float: left;
  }
  .press-releases li.element-item .entry-meta time.press-releases {
    display: none;
    font-size: 18px;
    text-align: left;
    margin-bottom: 20px;
  }
  .press-releases li.element-item .entry-meta .press-release-tax {
    float: left;
  }

  .single-content.press-release-content h1 {
    font-size: 50px;
  }
  .single-content.press-release-content p strong {
    font-size: 14px;
    font-family: 'ClanOT-Medium', arial, sans-serif;
  }
  .single-content.press-release-content p em {
    font-family: 'ClanOT-MediumItalic', arial, sans-serif;
  }

  /*Covers Both Hilights and Program Pages*/
  figure.cover-image {
    width: 25%;
    float: left;
    margin: 1em 20px 1em 40px;
  }

  .highlight-info {
    width: 65%;
    float: right;
    padding-left: 0;
  }
  .highlight-info p {
    margin-left: 0;
  }

  .single-image-wrapper img {
    min-height: 36vh;
  }

  /*Highlight Image Galleries*/
  #Images li {
    width: 30%;
    float: left;
    margin-right: 3.33%;
  }
  #Images ul.social-media {
    clear: left;
  }

  /*About*/
  .single-content.about-page {
    padding: 0 50px;
  }

  /*Modal*/
  .popup__content {
    width: 75%;
  }
  .popup__content h1#page-title {
    font-size: 36px;
  }
}
/*--------------------------------------------------------------
## 720px and up
--------------------------------------------------------------*/
@media screen and (min-width: 720px) {
  /*720 and UP*/
  header#masthead ul.social-media.header {
    display: block;
  }

  li.element-item {
    height: 630px;
  }

  /*Gallery*/
  .photos ul {
    justify-content: space-between;
  }
  .photos ul li {
    width: 48%;
  }

  .single-image-wrapper img {
    min-height: 45vh;
  }
}
/*--------------------------------------------------------------
## 801px and up
--------------------------------------------------------------*/
@media screen and (min-width: 801px) {
  header#masthead {
    display: flex;
  }
  header#masthead .main-container {
    max-width: 1280px;
    width: 100%;
    margin: 0 auto;
  }

  #page {
    margin-top: 0;
  }

  body.banner-image #content {
    margin-top: 54px;
  }

  body.single #page {
    margin-top: 0;
  }

  nav#filter .wrapper-dropdown.active > .dropdown {
    position: absolute;
    top: 100%;
    width: 100%;
    left: 0;
  }

  .nav-header {
    width: 100%;
    padding-top: 92px;
  }
  .nav-header nav#filter {
    text-align: center;
  }
  .nav-header nav#filter #dd,
  .nav-header nav#filter #ascend-descend,
  .nav-header nav#filter #search {
    width: 280px;
    padding-left: 18px;
    margin-left: 1.65em;
  }

  #dd.wrapper-dropdown.active + #ascend-descend {
    margin-top: 0 !important;
  }

  li.program-cover,
  li.element-item {
    width: 24%;
    height: 475px;
    padding: 1%;
    margin-bottom: 60px;
  }

  li.element-item {
    height: 350px;
  }

  li figure figcaption {
    padding-top: 25px;
    height: 94px;
    text-align: center;
    font-size: 18px;
    line-height: 23px;
  }

  /*Front Page*/
  #latest-press-releases header {
    position: relative;
    width: 100%;
  }
  #latest-press-releases header h4.desktop-press-releases {
    position: absolute;
    display: block;
    right: 0;
    margin-top: 10px;
  }
  #latest-press-releases header h4.desktop-press-releases a {
    text-decoration: none;
    font-size: 18px;
  }
  #latest-press-releases h3 {
    text-align: left;
  }
  #latest-press-releases ul {
    margin-top: 64px;
  }
  #latest-press-releases li {
    width: 29%;
    float: left;
    position: relative;
    padding-bottom: 0;
    margin-bottom: 70px;
    border-bottom: none;
  }
  #latest-press-releases li .press-release-separator {
    height: 87.9px;
    width: 2px;
    background: #424242;
    position: absolute;
    top: 30px;
    right: -15px;
  }
  #latest-press-releases li:nth-child(1) {
    margin-right: 3%;
  }
  #latest-press-releases li:nth-child(2) {
    margin-left: 3%;
    margin-right: 3%;
  }
  #latest-press-releases li:nth-child(3) {
    margin-left: 3%;
  }
  #latest-press-releases li:nth-child(3) .press-release-separator {
    display: none;
  }

  #originals.press-releases {
    width: 100%;
    max-width: 100%;
    margin-top: 0px;
  }

  header.nav-header.press-releases-header {
    background-color: #232323;
    max-width: 100%;
    width: 100%;
  }

  /*Press Releases*/
  .press-releases li.element-item {
    width: 100%;
    height: 99px;
    float: left;
    height: 210px;
    margin: 0;
    padding-top: 53px;
  }
  .press-releases li.element-item .entry-header {
    width: 74%;
    padding-left: 2%;
  }
  .press-releases li.element-item .entry-header time.press-releases {
    display: none;
  }
  .press-releases li.element-item .entry-meta {
    width: 20%;
    float: left;
    border-right: 1px solid #6d6d6d;
  }
  .press-releases li.element-item .entry-meta time.press-releases {
    display: block;
  }
  .press-releases li.element-item h1 {
    font-size: 30px;
    line-height: 37px;
  }
  .press-releases li.element-item time {
    margin-bottom: 24px;
  }
  .press-releases h4.desktop-press-releases {
    display: block;
  }
  .press-releases li.element-item:nth-child(even) {
    background-color: #2a2a2a;
  }
  .press-releases li.element-item:nth-child(odd) {
    background-color: #232323;
  }

  #about-epix {
    padding: 0;
    background: url("../images/about/about-section_home_bg.jpg") top left no-repeat;
    background-size: cover;
  }
  #about-epix h3 {
    padding-top: 64px;
    margin-top: 0;
  }

  /*Programming Page*/
  figure#banner-image.laptop {
    margin-top: 1.5rem;
  }

  .program-header figure img {
    width: 100%;
    height: 100%;
  }
  .program-header header.program-page.banner {
    position: absolute;
    width: 51%;
    bottom: 41px;
    padding: 0;
    left: 45px;
  }
  .program-header header.program-page.no-banner {
    position: relative;
    width: 100%;
  }
  .program-header header.program-page h1 {
    font-size: 60px;
    text-align: left;
    font-family: 'ClanOT-Book', arial, sans-serif;
    font-weight: 100;
  }
  .program-header header.program-page p {
    font-size: 18px;
    line-height: 31px;
    text-align: left;
    letter-spacing: 0.1px;
  }

  .highlight.program-header {
    background: url("../images/bg_may-highlights.jpg") top left, no-repeat;
    height: 320px;
  }
  .highlight.program-header header.program-page h1 {
    margin-top: 60px;
  }

  .seasonscontent .overview figure {
    margin: 1em 40px;
  }

  #Overview,
  .overview {
    background: #333;
  }
  #Overview img,
  .overview img {
    width: 390px;
  }
  #Overview #press-release,
  .overview #press-release {
    background: #232323;
    max-width: 100%;
    padding-top: 75px;
    margin-top: 48px;
  }
  #Overview ul.social-media.program,
  .overview ul.social-media.program {
    width: 400px;
  }
  #Overview .button-container,
  .overview .button-container {
    display: none;
  }

  /*Episodes*/
  #Episodes li,
  .episodes li {
    width: 100%;
    padding-bottom: 52px;
  }
  #Episodes li:last-child,
  .episodes li:last-child {
    border-bottom: 0;
  }
  #Episodes .episode-video,
  .episodes .episode-video {
    width: 40%;
  }

  .episode-description {
    width: 55%;
    float: right;
  }
  .episode-description h3 {
    font-size: 36px;
    text-align: left;
    margin-top: 52px;
  }
  .episode-description p {
    font-size: 14px;
    line-height: 31px;
  }

  .screen-link.button-container {
    width: 35%;
  }

  /*Cast Bio Section*/
  #Bios ul,
  .bios ul {
    justify-content: left;
  }
  #Bios ul li,
  .bios ul li {
    width: 31%;
    margin-right: 3.5%;
  }
  #Bios ul li figure img,
  .bios ul li figure img {
    width: 100%;
  }
  #Bios ul li h3,
  #Bios ul li h4,
  .bios ul li h3,
  .bios ul li h4 {
    font-size: 18px;
    line-height: 18px;
    letter-spacing: -0.1px;
    text-align: center;
    color: #ebebeb;
    font-family: 'ClanOT-Book', arial, sans-serif;
  }
  #Bios ul li h3.actor-name,
  .bios ul li h3.actor-name {
    font-weight: 500;
  }
  #Bios ul li h4.character-name,
  .bios ul li h4.character-name {
    font-weight: 100;
  }
  #Bios ul li .cast-bio-button,
  .bios ul li .cast-bio-button {
    text-decoration: none;
    font-size: 18px;
    letter-spacing: -0.1px;
    width: 100%;
    text-align: center;
    margin: 22px auto;
    border: 1px solid #C7A338;
  }
  #Bios ul li:nth-child(3n + 3),
  .bios ul li:nth-child(3n + 3) {
    margin-right: 0;
  }

  /*Photo Gallery Section*/
  .photos ul.modal-content {
    width: 90%;
    margin-top: 2em;
  }
  .photos ul.modal-content .image-header {
    position: initial;
    align-items: baseline;
  }
  .photos ul.modal-content .image-header h3 {
    font-size: 24px;
  }
  .photos ul.modal-content .image-header a {
    text-align: right;
  }
  .photos ul.modal-content .image-header a.expand {
    right: 200px;
    margin-top: 5px;
  }
  .photos ul.modal-content .image-header a.download-link {
    right: 80px;
  }
  .photos ul.modal-content .image-header a.expand {
    margin-left: 25%;
  }
  .photos ul.modal-content .image-header span.close-icon {
    margin-bottom: 5px;
  }
  .photos ul.modal-content .image-header .slide img {
    opacity: 1;
    min-height: 80vh;
  }
  .photos ul.modal-content .prev,
  .photos ul.modal-content .next {
    top: 45%;
    bottom: 45%;
  }
  .photos ul.modal-content .caption-container p {
    font-size: 14px;
  }
  .photos ul.modal-content h3.mobile {
    display: none;
  }
  .photos ul.modal-content ul li h3.landscape {
    display: block;
  }

  /*Single Cast Bio*/
  #full-cast-bio {
    max-width: 638px;
    margin: 0 auto;
  }
  #full-cast-bio figure {
    width: 395px;
    margin: 0 auto;
  }
  #full-cast-bio figure img {
    width: 100%;
  }
  #full-cast-bio h1 {
    font-size: 60px;
    line-height: 1;
    letter-spacing: 0;
    text-align: center;
  }
  #full-cast-bio h2 {
    font-size: 24px;
    line-height: 1.12;
    letter-spacing: 0.1px;
    text-align: center;
    color: #fff;
  }
  #full-cast-bio h3 {
    font-size: 36px;
    line-height: 1.11;
    letter-spacing: 0.2px;
    text-align: left;
  }
  #full-cast-bio p {
    color: #fff;
    font-size: 14px;
    line-height: 1.64;
  }

  #press-release {
    padding-right: 43px;
    padding-left: 43px;
  }
  #press-release ul {
    margin-top: 64px;
  }
  #press-release li {
    width: 29%;
    float: left;
    padding-bottom: 0;
    margin-bottom: 30px;
    border-bottom: none;
  }
  #press-release li:nth-child(1) {
    margin-right: 3%;
  }
  #press-release li:nth-child(2) {
    margin-left: 3%;
    margin-right: 3%;
  }
  #press-release li:nth-child(3) {
    margin-left: 3%;
  }
  #press-release h3 {
    text-align: left;
  }

  /*About*/
  .single-content.about-page {
    padding: 0;
  }

  .show-mobile {
    display: none;
  }

  .show-desktop {
    display: block;
  }

  #download-material .download-links li.social {
    width: 22%;
    margin-top: 0;
  }
  #download-material .download-links li {
    width: 357px;
    margin-top: 50px;
    margin-left: 32px;
  }
  #download-material .download-links li a.download-pdf {
    padding-left: 60px;
  }
  #download-material .download-links ul.social-media {
    margin-top: 65px;
  }

  #logo-download ul li.logo {
    margin: 0 3em;
  }
}
/*--------------------------------------------------------------
## IN BETWEENS
--------------------------------------------------------------*/
@media only screen and (max-width: 1080px) and (min-width: 1010px) {
  .main-navigation a {
    font-size: 0.9rem;
  }
}
@media only screen and (max-width: 1010px) and (min-width: 960px) {
  .main-navigation a {
    font-size: 0.8rem;
  }
}
/*--------------------------------------------------------------
## 1024px and up
--------------------------------------------------------------*/
@media screen and (min-width: 1024px) {
  header#masthead .site-branding {
    margin-left: 15px;
    width: 22%;
  }
  header#masthead .main-container ul.social-media.header {
    right: 0px;
  }

  li.element-item {
    height: 470px;
  }

  #Bios ul li,
  .bio ul li,
  .bios ul li {
    width: 22.1%;
  }
  #Bios ul li:nth-child(3n + 3),
  .bio ul li:nth-child(3n + 3),
  .bios ul li:nth-child(3n + 3) {
    margin-right: 3.5%;
  }
  #Bios ul li:nth-child(4n + 4),
  .bio ul li:nth-child(4n + 4),
  .bios ul li:nth-child(4n + 4) {
    margin-right: 0;
  }

  /*Video Clip Section*/
  #Videos ul li.video-box,
  .videos ul li.video-box {
    width: 31.5%;
    height: 100%;
    float: left;
  }
}
/*--------------------------------------------------------------
## 1190px and up (analomy due to uneven title length)
--------------------------------------------------------------*/
/*Gallery Section*/
@media screen and (min-width: 1190px) {
  .photos ul {
    justify-content: left;
  }
  .photos ul li {
    width: 30%;
    margin-right: 3.33%;
  }
  .photos ul li:nth-child(3n + 3) {
    margin-right: 0;
  }
}
/*--------------------------------------------------------------
## 1280px and up
--------------------------------------------------------------*/
@media screen and (min-width: 959px) {
  .mobile {
    display: none;
  }

  .laptop {
    display: block;
  }

  #site-navigation {
    display: block;
  }

  /**
   * Hide Mobile Menu
   */
  #open-mobile {
    display: none;
  }

  #epixMobileMenu {
    display: none;
  }
}
/*--------------------------------------------------------------
## 1280px and up
--------------------------------------------------------------*/
@media screen and (min-width: 1280px) {
  header#masthead ul#social-media {
    float: left;
    margin-right: 38px;
  }
}
/*--------------------------------------------------------------
# IE Only
--------------------------------------------------------------*/
/*Styles targetting IE only*/
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
  .button-container a.button {
    margin: 0;
    margin-top: 56px;
    margin-bottom: 56px;
  }
}