/**
 * @homepage.css
 * Homepage styles
 *
 *
 */

/** .no-js defaults */
.no-js ul.small_promo {
  display: none;
}

.no-js ul.large_promo {
  width: 626px!important;
  overflow: hidden;
  height: 100%!important;
}

.no-js ul.large_promo img {
  left: 50%;
  margin-left: -313px;
}

.no-js ul.large_promo li {
  overflow: hidden;
}

.no-js .homepage_full_episodes_section #full-episodes_ad-2 {
  display: none!important;
}

.no-js .homepage_full_episodes_section > ul {
  width: 1308px!important;
}
/* End .no-js */

/* HP PROMO */
.homepage_promo#promo {
  height: 100%;
  float: left;
  width: auto;
  position: relative;
  opacity: 0;
}

.homepage_promo_wrapper#promo_wrapper {
  height: 100%;
  float: left;
  width: 100%;
  position: relative;
  overflow: hidden;
}

.homepage_promo#promo div.timer {
  position: absolute;
  bottom: 21%;
  right: 5%;
  width: 40px;
  height: 40px;
  background: url(../images/homepage/promo/timer.png) 0 0 no-repeat;
  font-size: 39px;
  padding: 1px;
  z-index: 99;
  opacity: 0.4;
}

.homepage_promo#promo .timer > #slice {
  position: absolute;
  width: 1em;
  height: 1em;
  clip: rect(0px,1em,1em,0.5em);
}

.homepage_promo#promo .timer > #slice.gt50 {
  clip: rect(auto, auto, auto, auto);
}

.homepage_promo#promo .timer > #slice > .pie {
  border: 0.1em solid #707070;
  position: absolute;
  width: 0.8em;
  height: 0.8em;
  clip: rect(0em,0.5em,1em,0em);
  -moz-border-radius: 0.5em;
  -webkit-border-radius: 0.5em;
  border-radius: 0.5em;
}

.homepage_promo#promo .timer > #slice > .pie.fill {
  -moz-transform: rotate(180deg)!important;
  -webkit-transform: rotate(180deg)!important;
  -o-transform: rotate(180deg)!important;
  transform: rotate(180deg)!important;
}

.homepage_promo#promo .timer.fill > .percent {
  display: none;
}

.homepage_promo#promo .timer.fill > #slice > .pie {
  border: transparent;
  background-color: #707070;
  width: 1em;
  height: 1em;
}

/* START CALLOUT */
.homepage_promo li.promo > div.callout {
  display: none;
}

.homepage_promo#promo > div.callout * {
  color: #FFF;
}


.homepage_promo#promo > div.callout > div.callout-left {
  /*
  width: 44px;
  height: 67px;
  */
  /*height: 88%;*/
  height: 7.83vh;
  /*height: 5.22vh;*/
  /*width: 3.43vh;*/
  width: 5.15vh;
  background: url(../images/homepage/promo/twitter-banner-left.png) 0 0 no-repeat;
  background-size: auto 100%;
  position: absolute;
  left: 1px;
}

.homepage_promo#promo > div.callout div.callout-right {
  /*
  width: 9px;
  height: 77px;
  */
  height: 100%;
  /*height: 6vh;*/
  height: 9vh;
  /*width: 0.7vh;*/
  width: 1.05vh;
  background: url(../images/homepage/promo/twitter-banner-right.png) 0 0 no-repeat;
  background-size: auto 100%;
  position: absolute;
  right: 0px;
  top: 0;
}

.homepage_promo#promo > div.callout.collapsed > div.callout-left,
.homepage_promo#promo > div.callout.collapsed div.callout-right {
  width: 0;
  -webkit-transition: width 0s linear 0.5s;
  -moz-transition: width 0s linear 0.5s;
  -o-transition: width 0s linear 0.5s;
  transition: width 0s linear 0.5s;
}

.homepage_promo#promo > div.callout a {
  float: left;
  text-decoration: none;
  font-size: 1.7vh;
  line-height: 2.44vh;
  padding: 0.25vh 2vh;
}

.homepage_promo#promo > div.callout div.callout-center {
  background: #00addd;
  float: left;
  /*height: 88%;*/
  height: 7.83vh;
  /*height: 5.22vh;*/
  width: 21.05vh;
  width: 100%;
  overflow: hidden;
}


.homepage_promo#promo > div.callout {
  position: relative;
  max-width: 25.18vh;
  padding: 0 0.7vh 0 3.43vh;
  /*height: 6vh!important;*/
  height: 9vh!important;
  background: transparent!important;
  position: absolute;
  /*right: -0.7vh;*/
  right: -1.05vh;

  -webkit-transition: max-width 0.5s linear;
  -moz-transition: max-width 0.5s linear;
  -o-transition: max-width 0.5s linear;
  transition: max-width 0.5s linear;
  overflow: hidden;
}

.homepage_promo#promo > div.callout.collapsed {
  max-width: 0;
  -webkit-transition: max-width 0.5s linear;
  -moz-transition: max-width 0.5s linear;
  -o-transition: max-width 0.5s linear;
  transition: max-width 0.5s linear;
  overflow: hidden;
}

.homepage_promo#promo > div.callout * {
  color: #FFF;
}

/* END CALLOUT */

.homepage_promo_wrapper#promo_wrapper > ul > li {
  position: relative;
  float: left;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo {
  height: 84%;
  width: 300%;
  overflow: hidden;
  position: relative;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo > li {
  height: 100%;
  width: 33.33333%;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo > li > a > img {
  position: relative;
  height: auto;
  width: 100%;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo > li > div.promo_info {
  position: absolute;
  z-index: 9;
  bottom: 5%;
  left: 5%;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info p,
.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info a,
.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info h4 {
  color: #FFF;
  text-decoration: none;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info p.airing {
  font-size: 18px;
  font-size: 2.5vh;
  font-family: 'AmperstandardLight';
}
.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info p.airing span.airing_part1 {
  text-transform: uppercase;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info h4 {
  font-size: 38px;
  /*font-weight: bold;*/
  text-transform: uppercase;
  font-family: 'AmperstandardHeavy';
  /*font-size: 6.5vh;*/
  font-size: 5.5vh;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info h4,
.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info p.airing {
  /*text-shadow: 2px 2px #000;*/
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info ul {
  padding: 5px 0 0 0;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info ul li {
  line-height: 24px;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info ul li a {
  text-transform: uppercase;
  text-decoration: none;
  font-size: 14px;
  padding: 0px 0 3px 26px;
  /*background: url(../images/homepage/promo/promo-icons.png) 0 0 no-repeat;*/
  background: url(../images/homepage/shows/show-nav-icons.png) no-repeat;
  background-size: 22px auto;
  /*font-family: 'Amperserif'*/
  font-family: 'AmperstandardMedium'
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info ul li a.icon-episodes {
  background-position: 0 -3px;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info ul li a.icon-video {
  background-position: 0 -90px;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info ul li a.icon-photos {
  background-position: 0 -62px;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info ul li a.icon-cast {
  background-position: 0 -33px;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info ul li a.icon-exclusives {
  background-position: 0 -122px;
}


.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info ul li a.icon-facebook {
  text-decoration: none;
  font-size: 11px;
  font-weight: bold;
  padding: 3px 0 3px 26px;
  background: url(../images/homepage/promo/social-icons.png) 0 0 no-repeat ;
  background-position: 7px -15px;
  width: 16px;
  height: 16px;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info ul li a.icon-instagram {
  text-decoration: none;
  font-size: 11px;
  font-weight: bold;
  padding: 3px 0 3px 26px;
  background: url(../images/homepage/promo/social-icons.png) 0 0 no-repeat;
  background-position: 6px -32px;
  width: 16px;
  height: 16px;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info ul li a.icon-getglue {
  text-decoration: none;
  font-size: 11px;
  font-weight: bold;
  padding: 3px 0 3px 26px;
  background: url(../images/homepage/promo/social-icons.png) 0 0 no-repeat;
  background-position: 5px 1px;
  width: 16px;
  height: 16px;
}

.homepage_promo_wrapper#promo_wrapper ul.large_promo div.promo_info ul li a:hover {
  opacity: 0.8;
}

.homepage_promo_wrapper#promo_wrapper ul.small_promo {
  width: 300%;
  height: 16%;
  position: relative;
  overflow: hidden;
}

.homepage_promo_wrapper#promo_wrapper ul.small_promo li {
  height: 100%;
  width: 16.6666667%;
  overflow: hidden;
}

.homepage_promo_wrapper#promo_wrapper ul.small_promo li img {
  position: relative;
  height: auto;
  width: 100%;
}

.homepage_promo_wrapper#promo_wrapper div.promo_title {
  position: absolute;
  bottom: 0; left: 0;
  height: 40px;
  background: #1f323d;
  color: #d5d7c9;
  font-size: 18px;
  font-family: 'AmperstandardHeavy';
  width: 100%;
  text-indent: 15px;
  line-height: 40px;
  text-transform: uppercase;
}

.homepage_promo_wrapper#promo_wrapper > ul.small_promo > li {
  border-left: 1px solid #444;
  left: 0px;
  cursor: pointer;
  border-width:0px;
}

.homepage_promo_wrapper#promo_wrapper > ul.small_promo > li div.overlay {
  width: 100%;
  height: 100%;
  background: #000;
  position: absolute;
  z-index: 9;
  bottom: 0;
  opacity: 0.3;
}

.homepage_promo_wrapper#promo_wrapper > ul.small_promo > li:hover div.overlay {
  visibility: hidden;
}

.hp_search_results_promo .iso-item {
  margin: 15px 15px 15px 0;
}

.homepage_exclusive_section,
.homepage_full_episodes_section,
.homepage_shows_section {
  padding: 0 0 0 25px;
  height: 100%!important;
  position: relative;
  float: left;
  white-space: normal;
}

.homepage_exclusive_section ul,
.homepage_full_episodes_section ul,
.homepage_shows_section > ul {
  clear: left;
}

.homepage_exclusive_section ul li,
.homepage_shows_section > ul > li,
.homepage_full_episodes_section ul li {
  float: left;
  margin: 0 25px 25px 0;
  position: relative;
}

.homepage_exclusive_section h4,
.homepage_full_episodes_section h4,
.homepage_shows_section h4 {
  padding: 15px 0;
  float: left;
  font-size: 1.5em;
}

.homepage_exclusive_section h4 a,
.homepage_full_episodes_section h4 a,
.homepage_shows_section h4 a,
#section_header h4 a {
  text-decoration: none;
  color: #1f323d;
  letter-spacing: .5px;
  /*font-family: 'Amperscript';*/
  font-family: 'AmperstandardHeavy';
  text-transform: uppercase;
}

div.section_header {
  position: relative;
  float: left;
  width: 100%;
}

.homepage_exclusive_section > a,
.homepage_full_episodes_section > a,
.homepage_shows_section > a,
div.section_header > a {
  float: none;
  font-size: 16px;
  /*font-family: 'Amperserif';*/
  font-family: 'AmperstandardMedium';
  /*color: inherit;*/
  text-decoration: none;
  margin: 0 25px 15px 0;
  position: absolute;
  color: #0a63b0;
  right: 0;
  bottom: 2px;
}

.homepage_exclusive_section > a:hover,
.homepage_full_episodes_section > a:hover,
.homepage_shows_section > a:hover,
div.section_header > a:hover {
  opacity: 0.8;
}

.homepage_exclusive_section > ul > li {
  width: 300px;
  height: 349px;
  background: #FFF;
  overflow: hidden;
}

.homepage_exclusive_section > ul > li a {
  display: block;
  width: 100%;
  height: 100%;
}

.homepage_exclusive_section > ul > li img {
  position: relative;
  top: -93px;
}

.homepage_shows_section > ul > li {
  position: relative;
  width: 300px;
}

.homepage_shows_section .show_overlay {
  width: 300px;
  height: 100%;
  position: relative;
  max-height: 435px;
  min-height: 290px;
  overflow: hidden;
}

.homepage_shows_section .show_overlay img {
  max-width: 100%;
}

.homepage_shows_section .show_overlay > a.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  visibility: hidden;
}

.homepage_shows_section .show_overlay > img {
  position: relative;
}

.homepage_shows_section .show_overlay:hover > a.overlay {
  background: url(/profiles/aetv/modules/custom/aetv_homepage/images/homepage/shows/overlay.png) 0 bottom no-repeat;
  visibility: visible;
  display: block;
}

.homepage_shows_section .show_overlay a.overlay > span {
  padding: 0 0 0 32px;
  display: block;
  text-decoration: none;
  font-family: 'Amperserif';
  text-transform: uppercase;
  color: #FFF;
  font-size: 14px;
  line-height: 30px;
  background: url(../images/homepage/shows/show-nav-icons.png) no-repeat;
  position: absolute;
  left: 25px;
  bottom: 25px;
}

.homepage_shows_section .show_overlay a.icon-episodes > span {
  background-position: 0 -3px;
}

.homepage_shows_section .show_overlay a.icon-video > span {
  background-position: 0 -125px;
}

.homepage_shows_section .show_overlay a.icon-photos > span {
  background-position: 0 -86px;
}

.homepage_shows_section .show_overlay a.icon-cast > span {
  background-position: 0 -45px;
}

.homepage_shows_section .show_overlay a.icon-exclusives > span {
  background-position: 0 -170px;
}

.homepage_shows_section .show_overlay a.overlay:hover > span {
  opacity: 0.8;
}

div.left_border {
  border-left: 1px solid #CCC;
  width: 0;
  height: 95%;
  position: absolute;
  left: 0;
  top: 15px;
}

.homepage_full_episodes_section div.left_border {
  display: none;
}

.homepage_full_episodes_section ul {
  width: 1308px;
}

.homepage_full_episodes_section ul li.video {
  width: 302px;
  height: 170px;
}

.homepage_full_episodes_section ul li.ad {
  box-shadow: none;
  -webkit-box-shadow: none;
  left: 327px;
  min-height: 267px;
  width: 302px;
}

.homepage_full_episodes_section ul li a img.video_ext_image {
  width: 302px;
  height: 170px;
}

.homepage_full_episodes_section ul li.placeholder {
  z-index: -1;
}

.homepage_full_episodes_section ul li.transparent a {
  opacity: 0.6;
  transition: opacity 0.2s linear;
}

.homepage_full_episodes_section ul li a,
.homepage_full_episodes_section ul li.opaque a {
  opacity: 1.0;
  transition: opacity 0.2s linear;
}

.homepage_full_episodes_section ul li:hover a,
.homepage_full_episodes_section li.ad a {
  opacity: 1.0!important;
}

.homepage_full_episodes_section a div.overlay {
  width: 302px;
  height: 170px;
  position: absolute;
  background: url(../images/homepage/full-episodes/video-overlay.png) 0 -170px no-repeat;
}

.homepage_full_episodes_section a div.thumb_copy {
  position: absolute;
  left: 10px;
  bottom: 10px;
}

.homepage_full_episodes_section a div.thumb_copy .series {
  text-transform: uppercase;
  /*font-family: 'AmperstandardMedium';*/
  font-size: 12px;
  color: #f0f0f0;
}

.homepage_full_episodes_section a div.thumb_copy .title {
  color: #fff;
  /*font-family: 'AmperstandardLight';*/
  font-size: 20px;
  line-height: 22px;
  font-weight: normal;
  width: 250px;
  /*white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;*/
}

.homepage_full_episodes_section a div.thumb_copy .info {
  color: #fff;
  font-size: 13px;
  line-height: 18px;
  /*font-family: 'Amperscript';*/
}

.homepage_full_episodes_section li.locked div.overlay {
  background-position: 0 0;
}

.aetvUserAuthenticated .homepage_full_episodes_section li.locked div.overlay {
  background-position: 0 -170px;
}

/* qtip styling */
 li.video div.homepage_flyout {
  display: none;
}

.hp_qtip .qtip-tip canvas {
  display: block;
}

.hp_qtip div.qtip div.homepage_flyout {
  position: relative;
}

.hp_qtip div.qtip-content {
  margin: 0;
  padding: 0;
}

.hp_qtip.qtip-pos-br,
.hp_qtip.qtip-pos-bl {
  border-color: #d5d7c9;
}

.hp_qtip.qtip-pos-lt,
.hp_qtip.qtip-pos-rt,
.hp_qtip.qtip-pos-tl,
.hp_qtip.qtip-pos-tr,
.hp_qtip.qtip-pos-rc,
.hp_qtip.qtip-pos-lc {
  border-color: #d5d7c9;
}

div.qtip-pos-lc div.qtip-content {
  -webkit-box-shadow: -4px 4px 10px rgba(51,51,51,0.4)!important;
  -moz-box-shadow: -4px 4px 10px rgba(51,51,51,0.4)!important;
  -o-box-shadow: -4px 4px 10px rgba(51,51,51,0.4)!important;
  box-shadow: -4px 4px 10px rgba(51,51,51,0.4)!important;
}

div.qtip-pos-rc div.qtip-content {
  -webkit-box-shadow: 4px 4px 10px rgba(51,51,51,0.4)!important;
  -moz-box-shadow: 4px 4px 10px rgba(51,51,51,0.4)!important;
  -o-box-shadow: 4px 4px 10px rgba(51,51,51,0.4)!important;
  box-shadow: 4px 4px 10px rgba(51,51,51,0.4)!important;
}

div.qtip div.flyout div.homepage_flyout_top p {
  color: #000;
  line-height: 16px;
  /*font-family: 'AmperstandardLight';*/
  font-family: 'Roboto Condensed', sans-serif;
}

div.qtip div.flyout div.homepage_flyout_top p.episode_title {
  font-size: 16px;
  margin: 0 0 5px 0;
}

div.qtip div.flyout div.homepage_flyout_top p.episode_date {
  font-size: 12px;
}

div.qtip div.flyout div.homepage_flyout_top p.episode_expiration {
  font-size: 11px;
}

div.qtip div.flyout div.homepage_flyout_bot p {
  /*font-family: 'AmperstandardLight';*/
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 14px;
  line-height: 20px;
  letter-spacing: 0.3px;
  color: #000;
  padding: 0 0 10px 0;
}

div.qtip div.flyout div.homepage_flyout_top {
  background:  #d5d7c9;
  padding: 10px 15px;
}

div.qtip div.flyout div.homepage_flyout_bot {
  background: #d5d7c9;
  padding: 5px 10px 10px 15px;
}

/* end qtip styling */

@media all and (max-height: 698px) {
  .homepage_promo_wrapper#promo_wrapper div.promo_title {height: 24px; line-height: 24px;}
}

@media all and (min-height: 530px) {
  .homepage_promo_wrapper#promo_wrapper div.promo_title {height: 24px; line-height: 24px;}
  .homepage_full_episodes_section ul {width: 1308px;}
  .homepage_full_episodes_section #full-episodes_ad-2 {display: none;}
}

@media all and (min-height: 672px) {
  .homepage_full_episodes_section ul {width: 981px;}
  .homepage_exclusive_section h4, .homepage_full_episodes_section h4, .homepage_shows_section h4 {font-size: 1.6em;}
}

@media all and (min-height: 699px) {
  .homepage_promo_wrapper#promo_wrapper div.promo_title {height: 32px; line-height: 32px;}
  .homepage_full_episodes_section ul {width: 1308px;}
}

@media all and (min-height: 749px) {
  .homepage_full_episodes_section ul {width: 981px;}
}

@media all and (min-height: 799px) {
  .homepage_promo_wrapper#promo_wrapper div.promo_title {height: 40px; line-height: 40px;}
  .homepage_exclusive_section h4, .homepage_full_episodes_section h4, .homepage_shows_section h4 {font-size: 1.7em;}
}

@media all and (min-height: 899px) {
  .homepage_exclusive_section h4, .homepage_full_episodes_section h4, .homepage_shows_section h4 {font-size: 1.8em;}
}

@media all and (min-height: 941px) {
  .homepage_full_episodes_section ul {width: 654px;}
}

@media all and (min-height: 999px) {
  .homepage_exclusive_section h4, .homepage_full_episodes_section h4, .homepage_shows_section h4 {font-size: 1.9em;}
}

@media all and (min-height: 1099px) {
  /*.homepage_full_episodes_section #full-episodes_ad-2 {display: block;}*/
  .homepage_exclusive_section h4, .homepage_full_episodes_section h4, .homepage_shows_section h4 {font-size: 2.0em;}
}

/*
.hp_search_results_promo.search_results_promo {
  margin-left: -20px;
}
*/
/* This is causing conflicts with other episode css.
.tile {
  width: 278px!important;
}
*/
