﻿@font-face {
  font-family: 'AtlasGrotesk-Regular';
  src: url("/static/fonts/AtlasGroteskWeb/AtlasGrotesk-Regular-Web.eot");
  src: url("/static/fonts/AtlasGroteskWeb/AtlasGrotesk-Regular-Web.eot?#iefix") format("embedded-opentype"), url("/static/fonts/AtlasGroteskWeb/AtlasGrotesk-Regular-Web.woff") format("font/x-woff"), url("/static/fonts/AtlasGroteskWeb/AtlasGrotesk-Regular-Web.ttf") format("truetype"), url("/static/fonts/AtlasGroteskWeb/AtlasGrotesk-Regular-Web.svg#Avenir") format("image/svg+xml");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'AtlasGrotesk-Medium';
  src: url("/static/fonts/AtlasGroteskWeb/AtlasGrotesk-Medium-Web.eot");
  src: url("/static/fonts/AtlasGroteskWeb/AtlasGrotesk-Medium-Web.eot?#iefix") format("embedded-opentype"), url("/static/fonts/AtlasGroteskWeb/AtlasGrotesk-Medium-Web.woff") format("font/x-woff"), url("/static/fonts/AtlasGroteskWeb/AtlasGrotesk-Medium-Web.ttf") format("truetype"), url("/static/fonts/AtlasGroteskWeb/AtlasGrotesk-Medium-Web.svg#Avenir") format("image/svg+xml");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'Baskerville';
  src: url("/static/fonts/Baskerville10/Baskerville10Pro.eot");
  src: url("/static/fonts/Baskerville10/Baskerville10Pro.eot?#iefix") format("embedded-opentype"), url("/static/fonts/Baskerville10/Baskerville10Pro.woff") format("woff"), url("/static/fonts/Baskerville10/Baskerville10Pro.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'BaskervilleItalic';
  src: url("/static/fonts/Baskerville10/Baskerville10Pro-Italic.eot");
  src: url("/static/fonts/Baskerville10/Baskerville10Pro-Italic.eot?#iefix") format("embedded-opentype"), url("/static/fonts/Baskerville10/Baskerville10Pro-Italic.woff") format("woff"), url("/static/fonts/Baskerville10/Baskerville10Pro-Italic.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'BaskervilleSemibold';
  src: url("/static/fonts/Baskerville10/Baskerville-SemiBold.eot");
  src: url("/static/fonts/Baskerville10/Baskerville-SemiBold.eot?#iefix") format("embedded-opentype"), url("/static/fonts/Baskerville10/Baskerville-SemiBold.woff") format("woff"), url("/static/fonts/Baskerville10/Baskerville-SemiBold.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}
.latestFeatures ul, .recomFeatures ul, .mostReadFeatures ul, .buttonsContainer ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.latestFeatures .headerContainer .header, .recomFeatures .header, .mostReadFeatures .header {
  color: #000000;
  font-family: "AtlasGrotesk-Medium", Arial, Helvetica, sans-serif;
  font-size: 20px;
  font-weight: normal;
  line-height: 20px;
}

.latestFeatures ul > li .description, .recomFeatures ul li .description {
  color: #000000;
  font-family: "AtlasGrotesk-Regular", Arial, Helvetica, sans-serif;
  font-size: 14px;
  font-weight: normal;
  line-height: 20px;
}

.latestFeatures ul > li .categoryTitle, .recomFeatures ul li .title {
  color: #575757;
  font-family: "AtlasGrotesk-Medium", Arial, Helvetica, sans-serif;
  font-size: 11px;
  font-weight: normal;
  line-height: 11px;
  text-transform: uppercase;
}

.buttonsContainer ul li a.buttons {
  background-color: transparent;
  border: 2px solid #2b2b2b;
  color: #2b2b2b;
  display: inline-block;
  font-family: "AtlasGrotesk-Regular", Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: normal;
  height: 48px;
  line-height: 48px;
  text-align: center;
  text-decoration: none;
  width: 160px;
  -webkit-transition: background-color 0.4s ease 0s, color 0.2s ease 0s, opacity 0.2s ease 0s;
  -moz-transition: background-color 0.4s ease 0s, color 0.2s ease 0s, opacity 0.2s ease 0s;
  -ms-transition: background-color 0.4s ease 0s, color 0.2s ease 0s, opacity 0.2s ease 0s;
  -o-transition: background-color 0.4s ease 0s, color 0.2s ease 0s, opacity 0.2s ease 0s;
  transition: background-color 0.4s ease 0s, color 0.2s ease 0s, opacity 0.2s ease 0s;
}

.latestFeatures ul > li img {
  height: 238px;
  width: 380px;
}

.recomFeatures ul li img {
  height: 175px;
  width: 280px;
}

.latestFeatures .headerContainer .allArticles:before {
  content: "";
  border-bottom: 0 solid #000000;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.happeningFeaturedItem .mainImgCont .imgoverlay, .latestFeatures ul > li > a .imgoverlay, .recomFeatures ul li > a .imgoverlay, .Play_Button .imgoverlay {
  background-color: transparent;
  border-bottom: 0 solid #D70C00;
  bottom: 0;
  overflow: hidden;
  height: 0;
  width: 100%;
  position: absolute;
}

body {
  background: #ffffff;
  height: 100%;
  min-width: 962px;
}

h1, h2, h3, h4, h5, h6, p {
  margin: 0;
}

a img {
  border: none;
}

#daily, #wrapper {
  background: transparent;
}

#daily .container {
  background: #fff;
  padding: 0;
  width: 1280px;
}

/* Happening Featured Item */
.happeningFeaturedItem > a {
  display: block;
  text-decoration: none;
}
.happeningFeaturedItem > a:hover {
  text-decoration: none;
}
.happeningFeaturedItem .header {
  font-family: "Baskerville", Arial, Helvetica, sans-serif;
  font-size: 50px;
  font-weight: normal;
  line-height: 39px;
  margin: 60px auto 22px;
  text-align: center;
}
.happeningFeaturedItem .headerTitle {
  color: #000000;
  font-family: "AtlasGrotesk-Regular", Arial, Helvetica, sans-serif;
  font-size: 18px;
  font-weight: normal;
  margin-bottom: 22px;
  text-align: center;
}
.happeningFeaturedItem .mainImgCont {
  display: block;
  height: auto;
  margin: 0 auto;
  overflow: hidden;
  width: 800px;
}
.happeningFeaturedItem .mainImgCont:hover .imgoverlay {
  -webkit-transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  -moz-transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  -ms-transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  -o-transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  height: 98.7%;
  background-color: rgba(0, 0, 0, 0.15);
  border-bottom: 3px solid #D70C00;
  position: absolute;
  z-index: 10;
  height: 100%;
}
.happeningFeaturedItem .mainImgCont:hover .categoryTitle, .happeningFeaturedItem .mainImgCont:hover .subheader, .happeningFeaturedItem .mainImgCont:hover .description {
  color: #808080;
}
.happeningFeaturedItem .mainImg {
  width: 800px;
  height: 500px;
}
.happeningFeaturedItem .categoryTitle {
  color: #575757;
  font-family: "AtlasGrotesk-Medium", Arial, Helvetica, sans-serif;
  font-size: 11px;
  line-height: 11px;
  margin: 14px 16.1018% 14px;
  text-align: center;
  text-transform: uppercase;
  -webkit-transition: color 0.2s ease 0s;
  -moz-transition: color 0.2s ease 0s;
  -ms-transition: color 0.2s ease 0s;
  -o-transition: color 0.2s ease 0s;
  transition: color 0.2s ease 0s;
}
.happeningFeaturedItem .subheader {
  color: #000000;
  font-family: "Baskerville", Arial, Helvetica, sans-serif;
  font-size: 36px;
  font-weight: normal;
  line-height: 45px;
  margin: 0 16.1018% 8px;
  text-align: center;
  -webkit-transition: color 0.2s ease 0s;
  -moz-transition: color 0.2s ease 0s;
  -ms-transition: color 0.2s ease 0s;
  -o-transition: color 0.2s ease 0s;
  transition: color 0.2s ease 0s;
}
.happeningFeaturedItem .description {
  color: #000000;
  font-family: "AtlasGrotesk-Regular", Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: normal;
  line-height: 22px;
  margin: 0 16.1018%;
  text-align: center;
  -webkit-transition: color 0.2s ease 0s;
  -moz-transition: color 0.2s ease 0s;
  -ms-transition: color 0.2s ease 0s;
  -o-transition: color 0.2s ease 0s;
  transition: color 0.2s ease 0s;
}
/* More News */
.moreNews > h3.headlines {
  color: #000000;
  font-family: "AtlasGrotesk-Medium", Arial, Helvetica, sans-serif;
  font-size: 20px;
  font-weight: normal;
  line-height: 25px;
  margin-bottom: 10px;
  padding: 0 5px;
  text-transform: capitalize;
}

/* section container */
.sectionContainer {
  background-color: #fff;
  display: block;
  margin: 0 auto;
  padding: 43px 0 0;
  width: 1180px;
}

/* Latest Features */
.latestFeatures .headerContainer {
  margin-bottom: 18px;
  position: relative;
}
.latestFeatures .headerContainer .header {
  float: left;
}
.latestFeatures .headerContainer .allArticles {
  color: #575757;
  float: right;
  font-family: "AtlasGrotesk-Regular", Arial, Helvetica, sans-serif;
  font-size: 16px;
  font-weight: normal;
  line-height: 20px;
  position: relative;
  text-decoration: none;
  -webkit-transition: color 0.2s ease 0s;
  -moz-transition: color 0.2s ease 0s;
  -ms-transition: color 0.2s ease 0s;
  -o-transition: color 0.2s ease 0s;
  transition: color 0.2s ease 0s;
}
.latestFeatures .headerContainer .allArticles:hover {
	color: #000000;
}
.latestFeatures .headerContainer .allArticles:before {
  -webkit-transition: border-bottom 0.2s ease 0s;
  -moz-transition: border-bottom 0.2s ease 0s;
  -ms-transition: border-bottom 0.2s ease 0s;
  -o-transition: border-bottom 0.2s ease 0s;
  transition: border-bottom 0.2s ease 0s;
}
.latestFeatures .headerContainer .allArticles:hover:before {
  border-bottom: 3px solid #000000;
}
.latestFeatures ul > li {
  float: left;
  margin-right: 1.69491%;
  margin-bottom: 5.08474%;
  width: 32.20338%;
}
.latestFeatures ul > li:nth-child(3n+3) {
  margin-right: 0;
}
.latestFeatures ul > li > a {
  display: block;
  position: relative;
}
.latestFeatures ul > li > a:hover .imgoverlay {
  -webkit-transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  -moz-transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  -ms-transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  -o-transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  height: 98.7%;
  background-color: rgba(0, 0, 0, 0.15);
  border-bottom: 3px solid #D70C00;
  position: absolute;
  z-index: 10;
}
.latestFeatures ul > li > a:hover .Play_Button.white, .latestFeatures ul > li > a:hover .Play_Button.black {
  opacity: 1;
  filter: alpha(opacity=100);
}
.latestFeatures ul > li > a:hover .categoryTitle, .latestFeatures ul > li > a:hover .subheader, .latestFeatures ul > li > a:hover .description {
  color: #808080;
}
.latestFeatures ul > li img {
  display: block;
}
.latestFeatures ul > li .categoryTitle {
  margin-top: 14px;
  margin-bottom: 15px;
  -webkit-transition: color 0.2s ease 0s;
  -moz-transition: color 0.2s ease 0s;
  -ms-transition: color 0.2s ease 0s;
  -o-transition: color 0.2s ease 0s;
  transition: color 0.2s ease 0s;
}
.latestFeatures ul > li .subheader {
  margin-bottom: 11px;
  color: #000000;
  font-family: "Baskerville", Arial, Helvetica, sans-serif;
  font-size: 25px;
  font-weight: normal;
  -webkit-transition: color 0.2s ease 0s;
  -moz-transition: color 0.2s ease 0s;
  -ms-transition: color 0.2s ease 0s;
  -o-transition: color 0.2s ease 0s;
  transition: color 0.2s ease 0s;
}
.latestFeatures ul > li .description {
  -webkit-transition: color 0.2s ease 0s;
  -moz-transition: color 0.2s ease 0s;
  -ms-transition: color 0.2s ease 0s;
  -o-transition: color 0.2s ease 0s;
  transition: color 0.2s ease 0s;
}

/* Recommended Features */
.recomFeatures .header {
  margin-bottom: 20px;
}
.recomFeatures ul li {
  float: left;
  margin-right: 1.69491%;
  margin-bottom: 5.08474%;
  width: 23.72881%;
}
.recomFeatures ul li:nth-child(4n+4) {
  margin-right: 0;
}
.recomFeatures ul li > a {
  display: block;
  position: relative;
}
.recomFeatures ul li > a:hover .imgoverlay {
  -webkit-transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  -moz-transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  -ms-transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  -o-transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  transition: background-color 0.4s ease 0s, border-bottom 0.2s ease 0s;
  height: 98.7%;
  background-color: rgba(0, 0, 0, 0.15);
  border-bottom: 3px solid #D70C00;
  position: absolute;
  z-index: 10;
}
.recomFeatures ul li > a:hover .Play_Button.white, .recomFeatures ul li > a:hover .Play_Button.black {
  opacity: 1;
  filter: alpha(opacity=100);
}
.recomFeatures ul li > a:hover .title, .recomFeatures ul li > a:hover .subheader, .recomFeatures ul li > a:hover .description {
  color: #808080;
}
.recomFeatures ul li img {
  display: block;
}
.recomFeatures ul li .title {
  margin-top: 14px;
  margin-bottom: 15px;
  -webkit-transition: color 0.2s ease 0s;
  -moz-transition: color 0.2s ease 0s;
  -ms-transition: color 0.2s ease 0s;
  -o-transition: color 0.2s ease 0s;
  transition: color 0.2s ease 0s;
}
.recomFeatures ul li .subheader {
  margin-bottom: 11px;
  color: #000000;
  font-family: "Baskerville", Arial, Helvetica, sans-serif;
  font-size: 25px;
  font-weight: normal;
  -webkit-transition: color 0.2s ease 0s;
  -moz-transition: color 0.2s ease 0s;
  -ms-transition: color 0.2s ease 0s;
  -o-transition: color 0.2s ease 0s;
  transition: color 0.2s ease 0s;
}
.recomFeatures ul li .description {
  -webkit-transition: color 0.2s ease 0s;
  -moz-transition: color 0.2s ease 0s;
  -ms-transition: color 0.2s ease 0s;
  -o-transition: color 0.2s ease 0s;
  transition: color 0.2s ease 0s;
}

/* Most Read Features */
.mostReadFeatures .header {
	margin-bottom: 20px;
}
.mostReadFeatures ul li {
  border-bottom: 1px solid #cccccc;
  float: left;
  height: 80px;
  line-height: 80px;
  margin-right: 1.69491%;
  width: 49.15254%;
}
.mostReadFeatures ul li:nth-child(1), .mostReadFeatures ul li:nth-child(2) {
  border-top: 1px solid #cccccc;
}
.mostReadFeatures ul li:nth-child(2n) {
  margin-right: 0;
}
.mostReadFeatures ul li a {
  font-family: "Baskerville", Arial, Helvetica, sans-serif;
  font-size: 22px;
  font-weight: normal;
  text-decoration: none;
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mostReadFeatures ul li a:hover {
  color: #575757 !important;
}
.mostReadFeatures table {
  width: 100%;
}
.mostReadFeatures table tbody tr:last-child td:after {
  border-top: 1px solid #cccccc;
  content: "";
  position: absolute;
  left: 0;
  top: auto;
  right: 10px;
  bottom: 0;
}
.mostReadFeatures table tbody tr:last-child td:nth-child(2n) {
  padding-left: 10px;
}
.mostReadFeatures table tbody tr td {
  width: 50%;
  vertical-align: middle;
  position: relative;
}
.mostReadFeatures table tbody tr td:nth-child(1):before {
  border-top: 1px solid #cccccc;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  right: 10px;
  bottom: auto;
}
.mostReadFeatures table tbody tr td:nth-child(2):after {
  border-top: 1px solid #cccccc;
  content: "";
  position: absolute;
  left: 10px;
  top: auto;
  right: 0;
  bottom: 0;
}
.mostReadFeatures table tbody tr td:nth-child(2n) {
  padding-left: 10px;
}
.mostReadFeatures table tbody tr td a, .mostReadFeatures table tbody tr td a:visited, .mostReadFeatures table tbody tr td a:active {
	color: #000000;
}
.mostReadFeatures table tbody tr td a {
  display: inline-block;
  font-family: "Baskerville", Arial, Helvetica, sans-serif;
  font-size: 18px;
  font-weight: normal;
  padding: 20px 0;
  text-decoration: none;
}
.mostReadFeatures table tbody tr td a:hover {
  color: #575757 !important;
}
.mostReadFeatures table tbody tr:first-child td:nth-child(2):before {
  border-top: 1px solid #cccccc;
  content: "";
  position: absolute;
  left: 10px;
  top: 0;
  right: 0;
  bottom: auto;
}

/* Buttons */
.buttonsContainer {
  padding: 60px 0;
}
.buttonsContainer ul li {
  float: left;
  margin-right: 1.69491%;
  width: 49.15254%;
}
.buttonsContainer ul li a.buttons.right {
  float: right;
}
.buttonsContainer ul li a.buttons.left {
  float: left;
}
.buttonsContainer ul li a.buttons:hover {
  background-color: #000000;
  color: #FFFFFF !important;
}
.buttonsContainer ul li + li {
  margin-right: 0;
}

/* Play Buttons */
.Play_Button {
  background-repeat: no-repeat;
  background-position: center center;
  height: 100%;
  position: absolute;
  width: 100%;
  margin: 0;
  
}
.Play_Button.black {
  background-image: url("/static/images/homePage/Play-icon-hover-black.png");
  opacity: 0.7;
  filter: alpha(opacity=70);
    
  -webkit-transition: opacity 0.2s ease 0s;
  -moz-transition: opacity 0.2s ease 0s;
  -ms-transition: opacity 0.2s ease 0s;
  -o-transition: opacity 0.2s ease 0s;
  transition: opacity 0.2s ease 0s;
}
.Play_Button.white {
  background-image: url("/static/images/homePage/Play-icon-hover-white.png");
  opacity: 0.7;
  filter: alpha(opacity=70);
    
  -webkit-transition: opacity 0.2s ease 0s;
  -moz-transition: opacity 0.2s ease 0s;
  -ms-transition: opacity 0.2s ease 0s;
  -o-transition: opacity 0.2s ease 0s;
  transition: opacity 0.2s ease 0s;
}

/* */
.borderBottom {
  border-bottom: 1px solid #cccccc;
}

/* media query */
/* BODY */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
  body {
    min-width: 100%;
  }
}

/* Container */
@media (min-width: 962px) and (max-width: 1279px) {
  #daily .container {
	margin: 0 auto;
    width: 100%;
  }
}
@media (min-width: 1280px) {
  #daily .container {
    margin: 0 auto;
    width: 100%;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
	#daily .container {
		margin: 0;
		width: 100%;
	}
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
  #daily .container {
    margin: 0;
    width: 100%;
  }
}
/* More News */
@media (min-width: 962px) and (max-width: 1279px) {
  .moreNews {
    margin-left: 5%;
    margin-right: 5%;
    width: auto;
  }
}
@media (min-width: 1280px) {
  .moreNews {
    margin: 0 auto;
    width: 1180px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
  .moreNews {
    margin-left: 5%;
    margin-right: 5%;
    width: auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
  .moreNews {
    margin-left: 5%;
    margin-right: 5%;
    width: auto;
  }
}
/* Section Container */
@media (min-width: 962px) and (max-width: 1279px) {
  .sectionContainer {
    margin-left: 5%;
    margin-right: 5%;
    width: auto;
  }
}
@media (min-width: 1280px) {
  .sectionContainer {
    margin: 0 auto;
    width: 1180px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
  .sectionContainer {
    margin-left: 5%;
    margin-right: 5%;
    width: auto;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
  .sectionContainer {
    margin-left: 5%;
    margin-right: 5%;
    width: auto;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
  .happeningFeaturedItem {
    margin-left: 15px;
    margin-right: 15px;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) and (-webkit-min-device-pixel-ratio: 1) {
  .latestFeatures, .recomFeatures, .mostReadFeatures, .buttonsContainer {
    margin-left: 15px;
    margin-right: 15px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) and (-webkit-min-device-pixel-ratio: 1) {
  .latestFeatures, .recomFeatures, .mostReadFeatures, .buttonsContainer {
    margin-left: 15px;
    margin-right: 15px;
  }
}
