﻿@charset "UTF-8";
/* ADDS A BROWSER PREFIX TO THE PROPERTY */
/* BACKGROUND GRADIENT */
/* BACKGROUND HORIZONTAL */
/* BACKGROUND RADIAL */
/* BACKGROUND SIZE */
/* BACKGROUND COLOR OPACITY */
/* BORDER RADIUS */
/* BOX */
/* BOX RGBA */
/* BOX SHADOW */
/* BOX SIZING */
/* COLUMNS */
/* DOUBLE BORDERS */
/* FLEX */
/* FLIP */
/* FONT FACE */
/*@mixin font-face($fontFamily: myFont, $eotFileSrc: 'myFont.eot', $woffFileSrc: 'myFont.woff', $ttfFileSrc: 'myFont.ttf') {
  font-family: $fontFamily;
  src: url($eotFileSrc)  format('eot'),
       url($woffFileSrc) format('woff'),
       url($ttfFileSrc)  format('truetype');
}*/
/* OPACITY */
/* OUTLINE RADIUS */
/* RESIZE */
/* ROTATE*/
/* TEXT SHADOW */
/* TRANSFORM  */
/* TRANSFORM STYLE */
/* TRANSITION */
/* TRIPLE BORDERS */
/* KEYFRAMES */
/* ANIMATION */
/*FONT REM PX CONVERT*/
/*rem*/
/**
 * Computes a bottom-shadow for a card effect.
 *
 * @param {Number} $depth - depth level
 *
 * @return {List}
 */
/**
 * Gives a card depth effect.
 *
 * @param {Number} $depth - depth level (between 1 and 5)
 *
 * @link https://www.google.com/design/spec/layout/layout-principles.html#layout-principles-dimensionality Google Design
 *
 * @requires {function} top-shadow
 * @requires {function} bottom-shadow
 */
/* Black To White Scale */
/* #fcfcfc */
/* #fafafa */
/* #f7f7f7 */
/* #f5f5f5 */
/* #f2f2f2 */
/* #f0f0f0 */
/* #ededed */
/* #ebebeb */
/* #e8e8e8 */
/* #e6e6e6 */
/* #d9d9d9 */
/* #cccccc */
/* #bfbfbf */
/* #b3b3b3 */
/* #a6a6a6 */
/* #999999 */
/* #8c8c8c */
/* #808080 */
/* #737373 */
/* #666666 */
/* #595959 */
/* #4d4d4d */
/* #404040 */
/* #333333 */
/* #262626 */
/* #1a1a1a */
/* #0d0d0d */
/* Category Color */
/* Ana Renk */
/* Gündem */
/* Dünya */
/* Ekonomi */
/* Spor */
/* Teknoloji */
/* Yaşam */
/* Foto */
/* Video */
/* Bildirimler */
/* Yazarlar */
/* Gazeteler */
/* Piyasalar */
/* Canlı Yayın */
/* Hava Durumu */
/* Namaz Vakti */
/* Ramazan */
/* Spor Color */
/* Avrupa Sampiyonasi */
/* Dunya Kupasi */
/* Sampiyonlar Ligi*/
/* Uefa Ligi */
/* Custom Color */
/* Spor */
/* Spor 2 */
/* Flat Pallette Color */
/* Font */
/* Thin (Hairline), Extra Light (Ultra Light) */
/* Light */
/* Normal, Regular */
/* Medium, Semi Bold (Demi Bold) */
/* Bold */
/* Light */
/* Regular, Normal  */
/* Medium, Semi Bold (Demi Bold) */
/* Bold */
/* Extra Bold (Ultra Bold) */
/* Light */
/* Regular, Normal  */
/* Medium, Semi Bold (Demi Bold) */
/* Bold */
/* Extra Bold (Ultra Bold) */
/* Font Icon Sets */
/* Font Icon Sets */
/* Rules */
/*#region detail-page-styles */
.detail-image {
  display: block;
  position: relative;
  overflow: hidden;
  margin: 6px 0;
  width: 100%;
  /* figcaption {
        position: absolute;
        bottom: 0;
        left: 0;
        height: 100%;
        width: 100%;
        line-height: 8px;
        z-index: 3;
        text-align: left;

        .text {
            display: none;
        }

        .icon-group {
            position: absolute;
            text-align: center;
            z-index: 8;
            top: 50%;
            width: 100%;
            margin-top: -32px;
        }

        .caption-text {
            display: none;
        }
    }*/ }
  .detail-image .detail-height {
    background: #000000; }
    .detail-image .detail-height .swiper-slide {
      width: 100%;
      height: auto; }
  .detail-image figure {
    display: block;
    margin: 0 auto;
    padding: 0;
    line-height: 0;
    text-align: center;
    background: #000000;
    height: 100%; }
    .detail-image figure .image {
      z-index: 1;
      display: block;
      text-align: center;
      position: relative;
      background: rgba(0, 0, 0, 0.3);
      height: 100%; }
      .detail-image figure .image img, .detail-image figure .image amp-img {
        display: inline-block;
        max-width: 100%;
        max-height: 100%;
        /*height: 100%;*/
        width: auto !important;
        z-index: 2; }
    .detail-image figure .title, .detail-image figure .other-images, .detail-image figure figcaption {
      display: none !important; }
  .detail-image .media-icon {
    position: absolute;
    text-align: center;
    z-index: 8;
    top: 50%;
    width: 100%;
    height: 0;
    margin-top: -32px; }
    .detail-image .media-icon .icon {
      display: inline-block;
      text-align: center; }
      .detail-image .media-icon .icon i {
        display: inline-block;
        width: 64px;
        height: 64px;
        line-height: 64px;
        font-size: 40px;
        border-radius: 64px;
        background: rgba(0, 0, 0, 0.3);
        color: #ffffff; }
  .detail-image .swiper-pager {
    bottom: 4px;
    position: absolute;
    display: inline-block;
    z-index: 9;
    padding: 0 13px; }
  .detail-image .swiper-text {
    position: absolute;
    display: block;
    z-index: 9;
    bottom: 20px;
    padding: 0 16px; }
    .detail-image .swiper-text span {
      display: inline-block;
      margin-right: 3px;
      line-height: 9px;
      font-family: helveticaneue-bold;
      font-size: 9px;
      color: #ffffff;
      opacity: 0.8; }
  .detail-image .image-icon {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 8; }
    .detail-image .image-icon .icon-media-size {
      display: inline-block;
      font-size: 16px;
      line-height: 16px;
      padding: 4px;
      border-radius: 100%;
      background: rgba(0, 0, 0, 0.3);
      color: rgba(255, 255, 255, 0.5);
      border: solid 2px rgba(255, 255, 255, 0.5); }
  .detail-image .caption-text {
    display: block;
    padding: 0 16px;
    margin: 0 auto;
    font: 1.2rem/1.4rem helveticaneue-regular; }
    .detail-image .caption-text p {
      margin: 5px auto; }
    .detail-image .caption-text h3 {
      display: block;
      color: #505050;
      margin-bottom: 5px;
      font: 1.3rem/1.6rem helveticaneue-medium; }
    .detail-image .caption-text .spot {
      display: block;
      color: #505050;
      margin-bottom: 5px; }
    .detail-image .caption-text .agency {
      display: block;
      color: #a4a4a4;
      margin-bottom: 3px; }
    .detail-image .caption-text .link {
      display: block;
      color: #326890;
      margin-bottom: 3px; }
    .detail-image .caption-text .info {
      display: block;
      margin: 3px auto;
      font: 1.1rem/1.2rem helveticaneue-regular; }
      .detail-image .caption-text .info span {
        position: relative;
        display: inline-block;
        color: #a4a4a4;
        padding-right: 16px; }
        .detail-image .caption-text .info span.time {
          font-family: helveticaneue-bold; }
        .detail-image .caption-text .info span:after {
          content: "";
          position: absolute;
          right: 6px;
          top: 50%;
          margin-top: -1px;
          width: 3px;
          height: 3px;
          background: #999999;
          -webkit-border-radius: 3px;
          -khtml-border-radius: 3px;
          -moz-border-radius: 3px;
          -ms-border-radius: 3px;
          -o-border-radius: 3px;
          border-radius: 3px; }
        .detail-image .caption-text .info span:last-child {
          padding-right: 0; }
          .detail-image .caption-text .info span:last-child:after {
            content: none; }

.detail-head {
  display: block;
  margin: 12px auto;
  padding: 0 16px; }
  .detail-head .seo-title {
    display: none; }
  .detail-head .title {
    font-size: 3.6rem;
    line-height: 3.3rem;
    font-family: clarendon-black;
    padding-bottom: 2px; }
  .detail-head .spot {
    font-size: 1.9rem;
    line-height: 2.2rem;
    font-family: clarendon-medium;
    padding-bottom: 6px; }
  .detail-head .category {
    display: inline-block;
    font-size: 1.1rem;
    line-height: 1rem;
    font-family: helveticaneue-bold;
    color: #ffffff;
    margin-bottom: 8px;
    padding: 7px 13px;
    border-radius: 1px; }
  .detail-head .date {
    display: block;
    font-size: 1rem;
    line-height: 1.2rem;
    font-family: helveticaneue-light;
    color: #b8b8b8;
    margin: 4px auto; }

.detail-spot {
  display: block;
  margin: 0 auto;
  padding: 0 16px; }
  .detail-spot .spot {
    font-size: 19px;
    line-height: 22px;
    font-family: clarendon-medium;
    padding-bottom: 6px; }

.detail-publisher {
  position: relative;
  display: block;
  margin: 0 auto;
  padding: 0 16px; }
  .detail-publisher ul {
    display: block;
    margin-bottom: 5px;
    box-align: center;
    align-items: center;
    display: inline-flex;
    flex-flow: row wrap; }
    .detail-publisher ul li {
      position: relative;
      display: inline-block;
      box-align: center;
      align-items: center;
      display: inline-flex;
      flex-flow: row wrap;
      padding-right: 24px;
      margin-bottom: 4px;
      /*&.image {
                float: left;
                display: inline-block;
                margin-right: 8px;

                img, amp-img {
                    position: relative;
                    height: 32px;
                    width: 32px;
                    background: $gray-05;
                    overflow: hidden;
                    @include border-radius(100%);
                }
            }*/ }
      .detail-publisher ul li:after {
        content: '';
        position: absolute;
        right: 12px;
        top: 50%;
        margin-top: -1px;
        display: inline-block;
        height: 2px;
        width: 2px;
        border-radius: 2px;
        background: #d5d5d5; }
      .detail-publisher ul li:last-child:after {
        content: none; }
      .detail-publisher ul li span {
        position: relative;
        display: inline-block;
        line-height: 16px;
        font-size: 9px;
        padding-right: 16px; }
        .detail-publisher ul li span:last-child {
          padding-right: 0; }
          .detail-publisher ul li span:last-child:after {
            display: none; }
  .detail-publisher .image {
    display: inline-block;
    margin-right: 8px; }
    .detail-publisher .image img, .detail-publisher .image amp-img {
      position: relative;
      height: 24px;
      width: 24px;
      background: #f2f2f2;
      overflow: hidden;
      -webkit-border-radius: 100%;
      -khtml-border-radius: 100%;
      -moz-border-radius: 100%;
      -ms-border-radius: 100%;
      -o-border-radius: 100%;
      border-radius: 100%; }
  .detail-publisher .name {
    color: #808080;
    font-family: helveticaneue-bold; }
    .detail-publisher .name em {
      color: #b8b8b8;
      font-family: helveticaneue-regular;
      line-height: 10px;
      display: block; }
  .detail-publisher .datetime {
    color: #b8b8b8;
    font-family: helveticaneue-medium; }
  .detail-publisher .agency {
    color: #b8b8b8;
    font-family: helveticaneue-medium; }
  .detail-publisher .agency {
    color: #b8b8b8;
    font-family: helveticaneue-medium; }

.detail-text {
  display: block;
  font: 1.8rem/2.8rem georgia;
  margin: 8px auto;
  padding: 0 16px;
  letter-spacing: 0;
  color: #212121; }
  .detail-text h1, .detail-text strong, .detail-text b {
    font-family: georgia;
    font-weight: bold; }
  .detail-text p {
    margin-bottom: 10px; }
    .detail-text p > iframe {
      display: block;
      margin: 10px auto;
      width: 100% !important; }
  .detail-text a:not(.link):not(.inside-link):not(.news-link) {
    background: #e7e7e7;
    display: initial;
    padding: 3px;
    color: #212121;
    border-bottom-style: solid;
    border-bottom-width: 1px; }
    .detail-text a:not(.link):not(.inside-link):not(.news-link):hover {
      color: #ffffff; }
  .detail-text br {
    content: ' ';
    display: block;
    margin-bottom: 5px; }
  .detail-text del {
    opacity: 0.5; }
  .detail-text > blockquote {
    margin: 20px auto 10px;
    font-family: clarendon-bold;
    font-size: 19px;
    line-height: 24px;
    padding: 45px 16px 6px;
    background: url(../images/icon-blockquote.svg) no-repeat 16px 0 transparent;
    color: #212121; }
  .detail-text ol, .detail-text ul {
    position: relative;
    padding: 12px;
    border: 1px solid #e9e9e9;
    border-radius: 3px;
    margin-bottom: 12px;
    background: #52a25d;
    background: rgba(82, 162, 93, 0.05); }
    .detail-text ol li, .detail-text ul li {
      display: block;
      padding-bottom: 12px;
      font-family: helveticaneue-regular;
      font-size: 14px; }
    .detail-text ol iframe, .detail-text ul iframe {
      width: 100% !important; }
  .detail-text > iframe {
    display: block;
    margin: 10px auto;
    width: 100% !important; }
  .detail-text iframe[name="yenisafak"] {
    display: block;
    background: #ffffff;
    border: 1px solid #e8e8e8;
    border-radius: .4rem; }
  .detail-text figure {
    margin: 10px auto; }
    .detail-text figure.inside {
      margin-left: 0;
      width: 100%;
      padding: 10px;
      border: solid 1px #e6e6e6;
      background: #ffffff;
      border-radius: 2px; }
      .detail-text figure.inside .image img, .detail-text figure.inside .image amp-img {
        z-index: 2;
        width: 100%; }
      .detail-text figure.inside figcaption {
        padding: 0; }
      .detail-text figure.inside[data-type^="photo"] {
        padding: 0;
        margin-left: -16px !important;
        width: calc(100% + 32px) !important;
        border: none !important;
        border-radius: 0; }
        .detail-text figure.inside[data-type^="photo"] figcaption {
          padding: 0 16px; }

.detail-media {
  display: block;
  margin: 12px auto;
  margin-left: -16px;
  width: calc(100% + 32px);
  background: #000000; }
  .detail-media a, .detail-media a:hover {
    display: block;
    margin: 0;
    padding: 0;
    background: #ffffff !important; }
  .detail-media .media-content {
    display: block;
    width: 100%;
    position: relative; }
    .detail-media .media-content .photo {
      background: rgba(0, 0, 0, 0.3);
      text-align: center;
      display: block;
      z-index: 1; }
      .detail-media .media-content .photo img, .detail-media .media-content .photo amp-img {
        z-index: 2;
        width: 100%; }
    .detail-media .media-content .caption {
      position: absolute;
      bottom: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 3; }
      .detail-media .media-content .caption .icon {
        position: absolute;
        top: 50%;
        margin-top: -22px;
        padding: 0 16px; }
      .detail-media .media-content .caption .magnifier {
        position: absolute;
        right: 12px;
        bottom: 12px;
        height: 24px;
        width: 24px;
        background: url(../images/media-list-magnifier.svg) no-repeat; }
    .detail-media .media-content .text {
      display: block;
      padding: 12px 16px;
      font-family: helveticaneue-regular;
      font-size: 13px;
      line-height: 15px; }
      .detail-media .media-content .text .title, .detail-media .media-content .text .data-title {
        display: block;
        margin-bottom: 5px;
        color: #505050; }
      .detail-media .media-content .text .spot {
        display: block;
        color: #a4a4a4; }

.detail-keywords {
  display: block;
  padding: 12px 16px;
  margin: 12px auto; }
  .detail-keywords .keywords-content .detail-keywords-list {
    list-style: none;
    display: inline-block;
    padding: 0; }
    .detail-keywords .keywords-content .detail-keywords-list li {
      display: inline-block;
      padding-right: 9px;
      padding-bottom: 9px; }
      .detail-keywords .keywords-content .detail-keywords-list li a, .detail-keywords .keywords-content .detail-keywords-list li span {
        display: inline-block;
        height: 32px;
        line-height: 30px;
        font-size: 13px;
        padding: 0 10px;
        border-radius: 3px;
        background: #ffffff;
        color: #202020;
        font-family: helveticaneue-medium;
        border: solid 1px #e1e1e1; }

.detail-others {
  width: 100%;
  display: block;
  padding: 10px 0 1px;
  background-image: url(../images/pattern-main.svg), url(../images/bg-main.png);
  background-repeat: repeat, repeat; }
  .detail-others .others-title {
    display: block;
    position: relative;
    padding: 0 10px;
    margin-bottom: 10px; }
    .detail-others .others-title .icon-page-others {
      position: absolute;
      font-size: 32px;
      color: #727272; }
    .detail-others .others-title .title-text {
      display: block;
      padding-left: 36px;
      height: 32px;
      color: #727272; }
      .detail-others .others-title .title-text h1 {
        display: block;
        line-height: 32px;
        font-size: 11px;
        font-family: helveticaneue-medium; }
      .detail-others .others-title .title-text span {
        display: block;
        line-height: 12px;
        font-size: 9px;
        font-family: helveticaneue-regular; }
  .detail-others .category-list {
    margin: 0; }
  .detail-others .comment-list {
    display: block;
    background: #ffffff;
    -webkit-box-shadow: 0 0 2px #d2d2d2;
    -khtml-box-shadow: 0 0 2px #d2d2d2;
    -moz-box-shadow: 0 0 2px #d2d2d2;
    -ms-box-shadow: 0 0 2px #d2d2d2;
    -o-box-shadow: 0 0 2px #d2d2d2;
    box-shadow: 0 0 2px #d2d2d2;
    border-radius: 2px;
    margin: 10px;
    font-size: 0; }
    .detail-others .comment-list .comment-item:first-child .comment-box {
      border-top: none; }
    .detail-others .comment-list .comment-item:last-child .comment-box:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 100%;
      height: 100%;
      background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 0%, white 100%);
      /* FF3.6-15 */
      background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 0%, white 100%);
      /* Chrome10-25,Safari5.1-6 */
      background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0) 0%, white 100%);
      /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffffff',GradientType=0 );
      /* IE6-9 */ }

.detail-webview {
  display: block;
  background: #f1f1f1; }
  .detail-webview a {
    display: block;
    padding: 8px 10px;
    line-height: 32px;
    font-size: 12px;
    color: #727272;
    font-family: helveticaneue-regular;
    text-align: center; }

.detail-share {
  position: relative;
  display: block;
  margin: 0 auto;
  padding: 0 12px; }
  .detail-share.center {
    text-align: center; }
    .detail-share.center .share-content {
      display: inline-block; }

.detail-smile {
  padding: 0 16px;
  margin: 12px auto 0; }

.detail-comment {
  position: relative;
  padding: 0 16px;
  margin: 10px auto; }
  .detail-comment .head {
    position: absolute;
    top: -11px;
    z-index: 2;
    margin-left: 1.6rem;
    display: inline-block;
    font-family: helveticaneue-bold;
    font-size: 1.2rem;
    line-height: 2.2rem;
    padding: 0 1.2rem;
    color: #fff;
    background: #9f9f9f;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border-bottom-right-radius: 3px; }
    .detail-comment .head:before, .detail-comment .head:after {
      content: "";
      position: absolute;
      left: 0;
      bottom: 0;
      width: 0;
      height: 0;
      z-index: 999;
      opacity: 1; }
    .detail-comment .head:after {
      border-right: 16px solid transparent;
      border-top: 10px solid #9f9f9f;
      bottom: -9px;
      right: 15px; }
  .detail-comment section.pid-comment {
    padding-top: 2.4rem; }
  .detail-comment .comment-count {
    display: inline-block;
    margin: 12px auto;
    width: 72px;
    padding: 0 12px;
    text-align: center; }
    .detail-comment .comment-count i, .detail-comment .comment-count strong, .detail-comment .comment-count span {
      display: block;
      color: gray; }
    .detail-comment .comment-count i {
      font-size: 4.8rem; }
    .detail-comment .comment-count strong {
      font: 3.2rem/3.2rem opensans-bold; }
    .detail-comment .comment-count span {
      font: 1.2rem/1.6rem helveticaneue-regular; }
  .detail-comment .comment-list {
    position: relative;
    display: inline-block;
    margin: 12px auto;
    width: calc(100% - 76px);
    border-left: solid 1px #f2f2f2;
    cursor: pointer; }
    .detail-comment .comment-list:before {
      content: "";
      position: absolute;
      top: 15px;
      left: -8px;
      width: 0;
      height: 0;
      border-top: 8px solid transparent;
      border-bottom: 8px solid transparent;
      border-right: 8px solid #f2f2f2; }
    .detail-comment .comment-list:after {
      content: "";
      position: absolute;
      top: 15px;
      left: -7px;
      width: 0;
      height: 0;
      border-top: 8px solid transparent;
      border-bottom: 8px solid transparent;
      border-right: 8px solid #ffffff; }
    .detail-comment .comment-list .comment-box {
      border: none;
      padding: 8px 0;
      margin-left: 12px; }
      .detail-comment .comment-list .comment-box .text {
        max-height: 120px;
        overflow: hidden; }

.detail-pager {
  padding: 8px 16px;
  background-image: url(../images/pattern-main.svg), url(../images/bg-main.png);
  background-repeat: repeat, repeat;
  /*.pager-list {
        display: block;

        &.left {
            text-align: left;
        }

        li {
            display: inline-block;
            margin-right: 2px;
            width: 27px;
            height: 27px;
            @include border-radius(50%);
            background: $gray-40;
            color: $white;

            &.read {
                background: $gray-20;
                color: $white;
            }

            &.active {
                background: $clr-sport-yellow;
                color: $black;
            }

            span {
                display: block;
                text-align: center;
                @include font(1.2,2.7, $fnt-bold);
            }

            &.prev, &.next {
                background: none;
                border: solid 2px $gray-25;
                text-align:center;

                i {
                    @include font-size(1.2);
                    @include line-height(2.4);
                    color: $gray-25;
                }
            }
        }
    }*/ }
  .detail-pager .pager-text {
    display: block;
    text-align: left; }
    .detail-pager .pager-text .next {
      color: gray;
      font: 1rem/2.4rem helveticaneue-regular; }
    .detail-pager .pager-text .title {
      color: #1a1a1a;
      font: 1rem/2.4rem helveticaneue-bold; }
  .detail-pager .pager-list {
    text-align: center; }
    .detail-pager .pager-list.left {
      text-align: left; }
    .detail-pager .pager-list ul {
      display: block;
      height: 6px; }
    .detail-pager .pager-list li {
      display: inline-block;
      margin: 0 3px;
      width: 6px;
      height: 6px;
      line-height: 6px;
      -webkit-border-radius: 50%;
      -khtml-border-radius: 50%;
      -moz-border-radius: 50%;
      -ms-border-radius: 50%;
      -o-border-radius: 50%;
      border-radius: 50%;
      background: #999999;
      color: #ffffff;
      overflow: hidden;
      /*&.prev, &.next {
                background: none;
                border: solid 2px $gray-25;
                text-align:center;

                i {
                    @include font-size(1.2);
                    @include line-height(2.4);
                    color: $gray-25;
                }
            }*/
      /*&:not(:nth-child(1)) {

                    &:nth-child(5n+0) {
                        border-radius: 0;
                        background: none;
                        width: 6px;
                        height: 6px;
                        border-top: 3px solid transparent;
                        border-bottom: 3px solid transparent;
                        border-left: 4px solid $gray-40;
                    }

                    &:nth-child(6n+1) {
                        border-radius: 0;
                        background: none;
                        width: 6px;
                        height: 6px;
                        border-top: 3px solid transparent;
                        border-bottom: 3px solid transparent;
                        border-right: 4px solid $gray-40;
                    }
                }*/ }
      .detail-pager .pager-list li.read {
        background: #cccccc;
        color: #ffffff; }
      .detail-pager .pager-list li.active {
        background: #ffd743;
        color: black; }
      .detail-pager .pager-list li span {
        display: block;
        text-align: center;
        display: none; }
  .detail-pager .share-content {
    text-align: center;
    padding: 0 0 8px;
    /*width: 108px;*/ }

.detail-popup {
  display: inline-block;
  padding: 16px;
  margin: 0 auto;
  border-radius: 6px;
  background: #ffffff;
  position: relative;
  z-index: 999; }
  .detail-popup .popup-title {
    position: relative;
    display: block;
    height: 32px;
    padding-bottom: 12px;
    border-bottom: solid 1px #e5e5e5;
    font-family: helveticaneue-bold; }
    .detail-popup .popup-title h1 {
      padding-right: 52px;
      display: block;
      font-size: 18px;
      line-height: 32px;
      color: #9d9d9d; }
    .detail-popup .popup-title .close {
      position: absolute;
      right: 0;
      top: 0;
      height: 30px;
      display: block;
      line-height: 30px;
      border-radius: 6px;
      border: solid 1px #d2d2d2;
      font-size: 11px;
      text-align: center;
      color: #9d9d9d;
      padding: 0 10px; }

.detail-font-list {
  display: block;
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: left; }
  .detail-font-list li {
    display: block;
    border-bottom: solid 1px #e5e5e5; }
    .detail-font-list li a {
      position: relative;
      display: block;
      height: 40px;
      color: #6f6f6f; }
    .detail-font-list li i {
      position: absolute;
      display: block;
      height: 40px;
      width: 40px;
      line-height: 40px;
      text-align: center; }
    .detail-font-list li span {
      display: block;
      padding-left: 40px;
      height: 40px;
      line-height: 40px;
      font-family: helveticaneue-medium; }
    .detail-font-list li.selected a {
      background: #d12525;
      color: #ffffff; }
    .detail-font-list li .font1x i {
      font-size: 14px; }
    .detail-font-list li .font1x span {
      font-size: 12px; }
    .detail-font-list li .font2x i {
      font-size: 16px; }
    .detail-font-list li .font2x span {
      font-size: 14px; }
    .detail-font-list li .font3x i {
      font-size: 18px; }
    .detail-font-list li .font3x span {
      font-size: 16px; }
    .detail-font-list li .font4x i {
      font-size: 20px; }
    .detail-font-list li .font4x span {
      font-size: 18px; }
    .detail-font-list li .font5x i {
      font-size: 22px; }
    .detail-font-list li .font5x span {
      font-size: 20px; }
    .detail-font-list li:last-child {
      border-bottom: none; }

/*#endregion */
/*#region media-page-styles */
.media {
  display: block;
  padding-top: 56px;
  -webkit-transition: -webkit-all, 1s, ease-in-out;
  -khtml-transition: all, 1s, ease-in-out;
  -moz-transition: all, 1s, ease-in-out;
  -ms-transition: all, 1s, ease-in-out;
  -o-transition: all, 1s, ease-in-out;
  transition: all, 1s, ease-in-out; }
  .media .media-head {
    display: block;
    margin: 12px auto;
    padding: 0 16px; }
    .media .media-head .title {
      font-size: 19px;
      line-height: 22px;
      font-family: helveticaneue-bold; }
    .media .media-head i {
      font-size: 26px;
      line-height: 22px;
      margin-right: 5px; }
  .media .media-video {
    display: block;
    width: 100%;
    margin-bottom: 10px; }
    .media .media-video .video {
      display: block;
      width: 100%;
      padding: 10px 0;
      background: #000000; }
      .media .media-video .video .jwplayer {
        display: block;
        width: 100%;
        height: auto; }
  .media .media-slider {
    display: block;
    position: relative;
    margin-bottom: 12px;
    -webkit-transition: -webkit-height 0.5s ease-in-out;
    -khtml-transition: height 0.5s ease-in-out;
    -moz-transition: height 0.5s ease-in-out;
    -ms-transition: height 0.5s ease-in-out;
    -o-transition: height 0.5s ease-in-out;
    transition: height 0.5s ease-in-out; }
    .media .media-slider figure {
      width: 100%;
      -webkit-transition: -webkit-all, 0.5s, ease-in-out;
      -khtml-transition: all, 0.5s, ease-in-out;
      -moz-transition: all, 0.5s, ease-in-out;
      -ms-transition: all, 0.5s, ease-in-out;
      -o-transition: all, 0.5s, ease-in-out;
      transition: all, 0.5s, ease-in-out; }
      .media .media-slider figure .image {
        display: block; }
        .media .media-slider figure .image img, .media .media-slider figure .image amp-img {
          width: 100%; }
      .media .media-slider figure .icon-media-size {
        display: none; }
    .media .media-slider figcaption {
      position: relative;
      display: block;
      text-align: center;
      width: 100%;
      z-index: 9; }
      .media .media-slider figcaption .spot,
      .media .media-slider figcaption .text {
        display: none; }
  .media .media-share {
    position: relative;
    display: block;
    margin: 18px 0 12px;
    padding: 0 12px; }
  .media .media-text,
  .media .caption-text {
    padding: 12px 12px 36px;
    font-size: 14px;
    font-family: helveticaneue-regular;
    color: #8f8f8f; }

.drop-content.gallery, .drop-content.photo, .drop-content.video {
  display: block;
  position: fixed;
  visibility: hidden;
  top: 0;
  width: 100%;
  padding-bottom: 56px;
  height: 0;
  z-index: 99;
  background: #ffffff;
  opacity: 0;
  -webkit-transition: -webkit-all, 0.5s, ease-in-out;
  -khtml-transition: all, 0.5s, ease-in-out;
  -moz-transition: all, 0.5s, ease-in-out;
  -ms-transition: all, 0.5s, ease-in-out;
  -o-transition: all, 0.5s, ease-in-out;
  transition: all, 0.5s, ease-in-out; }
  .drop-content.gallery.active, .drop-content.photo.active, .drop-content.video.active {
    height: 100%;
    visibility: visible;
    overflow-y: scroll;
    opacity: 1;
    -webkit-transition: -webkit-all, 0.5s, ease-in-out;
    -khtml-transition: all, 0.5s, ease-in-out;
    -moz-transition: all, 0.5s, ease-in-out;
    -ms-transition: all, 0.5s, ease-in-out;
    -o-transition: all, 0.5s, ease-in-out;
    transition: all, 0.5s, ease-in-out; }
  .drop-content.gallery .gallery-share, .drop-content.photo .gallery-share, .drop-content.video .gallery-share {
    position: relative;
    display: block;
    margin: 18px 0 12px;
    padding: 0 12px; }

.drop-content.single {
  display: block;
  position: fixed;
  visibility: hidden;
  top: 0;
  width: 100%;
  padding-bottom: 56px;
  height: 0;
  z-index: 99;
  background: #ffffff;
  opacity: 0;
  -webkit-transition: -webkit-all, 0.5s, ease-in-out;
  -khtml-transition: all, 0.5s, ease-in-out;
  -moz-transition: all, 0.5s, ease-in-out;
  -ms-transition: all, 0.5s, ease-in-out;
  -o-transition: all, 0.5s, ease-in-out;
  transition: all, 0.5s, ease-in-out; }
  .drop-content.single.active {
    height: 100%;
    visibility: visible;
    overflow-y: scroll;
    opacity: 1;
    -webkit-transition: -webkit-all, 0.5s, ease-in-out;
    -khtml-transition: all, 0.5s, ease-in-out;
    -moz-transition: all, 0.5s, ease-in-out;
    -ms-transition: all, 0.5s, ease-in-out;
    -o-transition: all, 0.5s, ease-in-out;
    transition: all, 0.5s, ease-in-out; }
  .drop-content.single .gallery-share {
    position: relative;
    display: block;
    margin: 18px 0 12px;
    padding: 0 12px; }

/*#endregion */
/*#region figure-css-styles */
figure {
  display: block; }
  figure.inside {
    padding: 0;
    overflow: hidden; }
    figure.inside h3.title {
      font: 2rem/2.4rem clarendon-black;
      margin-bottom: 12px;
      color: black; }
    figure.inside h3 .order {
      display: inline;
      color: #999;
      margin-right: 5px; }
      figure.inside h3 .order.pattern-cross {
        background: url(../images/pattern-common.svg); }
    figure.inside .image {
      position: relative;
      background: #000000;
      text-align: center;
      display: block;
      z-index: 1; }
      figure.inside .image img, figure.inside .image amp-img {
        z-index: 2;
        width: 100%; }
      figure.inside .image .pattern {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 3; }
      figure.inside .image .icon-media-video,
      figure.inside .image .icon-media-gallery {
        position: absolute;
        z-index: 9;
        top: 50%;
        left: 50%;
        margin-left: -32px;
        margin-top: -32px;
        width: 64px;
        height: 64px;
        line-height: 64px;
        font-size: 40px;
        border-radius: 64px;
        text-align: center;
        background: rgba(0, 0, 0, 0.3);
        color: #ffffff; }
      figure.inside .image .icon-media-size {
        position: absolute;
        top: 12px;
        right: 12px;
        font-size: 16px;
        line-height: 16px;
        padding: 4px;
        border-radius: 100%;
        background: rgba(0, 0, 0, 0.3);
        color: rgba(255, 255, 255, 0.5);
        text-align: center;
        border: solid 2px rgba(255, 255, 255, 0.5); }
    figure.inside .other-images {
      font-size: 0; }
      figure.inside .other-images .image {
        display: inline-block;
        margin-top: 5px;
        margin-left: 5px;
        width: calc((100% - 10px) / 3);
        overflow: hidden; }
        figure.inside .other-images .image:first-child {
          margin-left: 0; }
        figure.inside .other-images .image img, figure.inside .other-images .image amp-img {
          z-index: 2;
          width: auto;
          height: auto;
          max-width: 100%;
          max-height: 100%; }
      figure.inside .other-images .show-all {
        margin-top: 5px;
        background-color: #F5F5F5;
        padding: 5px 0;
        color: #656565;
        font-family: helveticaneue-light;
        text-align: center; }
        figure.inside .other-images .show-all .order {
          font: 1.6rem/3.2rem helveticaneue-bold;
          margin-right: 10px; }
        figure.inside .other-images .show-all .title {
          font: 1.6rem/3.2rem helveticaneue-regular; }
    figure.inside figcaption {
      display: block;
      padding: 0 16px;
      margin: 0 auto;
      font: 1.2rem/1.5rem helveticaneue-regular; }
      figure.inside figcaption h3 {
        display: block;
        color: #505050;
        margin: 5px auto;
        font: 1.3rem/1.6rem helveticaneue-medium; }
      figure.inside figcaption .spot {
        display: block;
        color: #505050;
        margin: 5px auto; }
      figure.inside figcaption .agency {
        display: block;
        color: #a4a4a4;
        margin: 5px auto; }
      figure.inside figcaption .link {
        display: block;
        color: #326890;
        margin: 5px auto; }
      figure.inside figcaption .info {
        display: block;
        margin: 5px auto;
        font: 1.1rem/1.2rem helveticaneue-regular; }
        figure.inside figcaption .info span {
          position: relative;
          display: inline-block;
          color: #a4a4a4;
          padding-right: 16px; }
          figure.inside figcaption .info span.time {
            font-family: helveticaneue-bold; }
          figure.inside figcaption .info span:after {
            content: "";
            position: absolute;
            right: 6px;
            top: 50%;
            margin-top: -1px;
            width: 3px;
            height: 3px;
            background: #999999;
            -webkit-border-radius: 3px;
            -khtml-border-radius: 3px;
            -moz-border-radius: 3px;
            -ms-border-radius: 3px;
            -o-border-radius: 3px;
            border-radius: 3px; }
          figure.inside figcaption .info span:last-child {
            padding-right: 0; }
            figure.inside figcaption .info span:last-child:after {
              content: none; }
    figure.inside video, figure.inside iframe {
      width: 100%;
      height: auto; }
  figure.inside-news {
    padding: 5px;
    border: 1px solid #e9e9e9;
    border-radius: 3px; }
    figure.inside-news .link-image {
      position: relative;
      display: inline-block;
      width: 100px;
      height: 100px;
      overflow: hidden;
      z-index: 1; }
      figure.inside-news .link-image img, figure.inside-news .link-image amp-img {
        z-index: 2;
        width: 100%; }
      figure.inside-news .link-image figcaption {
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 3; }
        figure.inside-news .link-image figcaption .icon {
          text-align: center; }
        figure.inside-news .link-image figcaption .share-count {
          position: absolute;
          bottom: 0;
          right: 0;
          display: inline-block;
          padding: 2px 6px;
          background: rgba(0, 0, 0, 0.3);
          color: #ffffff;
          line-height: 14px; }
          figure.inside-news .link-image figcaption .share-count .icon-stats {
            display: inline-block;
            font-size: 12px;
            line-height: 14px;
            margin-right: 4px;
            color: #ffffff; }
          figure.inside-news .link-image figcaption .share-count .counter {
            display: inline-block;
            font-size: 12px;
            line-height: 14px;
            font-family: helveticaneue-regular; }
    figure.inside-news .text {
      position: relative;
      display: inline-block;
      width: calc(100% - 105px);
      font-family: helveticaneue-regular;
      margin: 0;
      font-size: 13px;
      line-height: 15px;
      padding-left: 5px;
      padding-right: 18px;
      height: 100px;
      overflow: hidden; }
      figure.inside-news .text h5 {
        display: block;
        color: #326890;
        font-size: 18px;
        line-height: 19px;
        font-family: clarendon-medium;
        margin: 2px auto; }
      figure.inside-news .text .spot {
        display: block;
        font-size: 14px;
        line-height: 19px;
        font-family: georgia;
        color: #aeaeae;
        overflow: hidden;
        text-overflow: ellipsis; }
      figure.inside-news .text .icon-go-forward {
        position: absolute;
        right: 0;
        bottom: 0;
        color: #aeaeae;
        font-size: 18px; }

.rich {
  display: block;
  margin: 10px auto; }
  .rich h4 {
    font-size: 24px;
    line-height: 24px;
    font-family: clarendon-black;
    margin-bottom: 10px;
    position: relative;
    min-height: 24px;
    color: black; }
    .rich h4 .title-r {
      display: inline-block;
      margin-left: 36px; }
    .rich h4 .order {
      display: inline;
      color: #999; }
      .rich h4 .order.pattern-cross {
        background: url(../images/pattern-common.svg); }
  .rich .image {
    background: transparent !important; }
    .rich .image:after {
      display: none; }
    .rich .image iframe {
      width: 100%;
      min-height: 240px; }

/*#endregion */
.google-news-button {
  margin: 0 0 3.2rem 1.2rem; }
  .google-news-button .google-news-title {
    color: #888;
    font-size: 1.3rem;
    line-height: 2.5rem;
    display: inline-block;
    font-family: helveticaneue-regular; }
  .google-news-button a {
    display: inline-block;
    margin: 0 0.8rem;
    padding: 0.6rem 1.3rem;
    border-radius: 0.3rem;
    border: 0.1rem solid #ccc;
    font-size: 1.2rem;
    line-height: 1.2rem; }
    .google-news-button a img {
      display: inline-block;
      vertical-align: middle;
      width: auto;
      height: 1.2rem; }
