/* 
Stylesheet Implemented By Obvious Media Limited
May 2020
--Website Update

*/

@font-face {
    font-family: "Zurich-regular";
    src: url('/fonts/zurich-bt/ZURCHXC.ttf');
    font-weight: normal;
  }


  @font-face {
    font-family: "Zurich-light";
    src: url('/fonts/zurich-bt/ZURCHLC.ttf');
    font-weight: lighter;

  }


  @font-face {
    font-family: "Zurich-bold";
    src: url('/fonts/zurich-bt/ZURCHBXC.ttf');
    font-weight: bold; 

  }


  @font-face {
    font-family: "century_regular";
    src: url('/fonts/century/Century_Regular.ttf');
    font-weight: normal;
  }
    

  /*@font-face {
  font-family: "utopia_regular";
  src: url('/fonts/utopia/utopia-regular.ttf');
  font-weight: normal;
  }*/

  @font-face {
    font-family: "Clarendon-bt-regular";
    src: url('/fonts/clarendon_cn_bt/Clrndnc.ttf');
    font-weight: normal;

  }

  @font-face {
    font-family: "Clarendon-bt-bold";
    src: url('/fonts/clarendon_cn_bt/Clrndnbc.ttf');
    font-weight: bold;

  }

  @font-face {
    font-family: "Versailles-std-bold";
    src: url('/fonts/versailles/Versailles_LT_Std_75_Bold.ttf');
    font-weight: bold;
  }


  @font-face {
    font-family: "Versailles-std-light";
    src: url('/fonts/versailles/Versailles_LT_Std_45_Light.ttf');
    font-weight: lighter;
  }


  @font-face {
    font-family: "Versailles-std-black";
    src: url('/fonts/versailles/Versailles_LT_Std_95_Black.ttf');
    font-weight: bold;
  }


  html, body {


    font-family: 'utopia-std', serif !important;

  }


  p {
    font-family: 'utopia-std', serif !important;

  }

  #articles_container p {
    font-family: 'utopia-std', serif !important;
    margin-bottom: 5px;
  }




    .main_header1 {
        /* font-family: 'Zurich-light'; */
        font-family: Roboto,'Helvetica Neue';
      }


      .main_header1 ul {
        list-style: none !important;
        padding: 0 !important;
        margin: 0 !important;
      }


      .main_header1 li {
      
        display: inline-block;
        padding: 4px 5px 0px 5px;
        font-size: 20px;
        
      }

      .main_header1 li a{
        color: black !important; 
      }

      .right_top_tabs ul{

        margin-top: 38px;
        margin-bottom: 0px !important;
        color: black;

      }

      #google_translate_element {
        margin-top: -8px !important;
      }



      #main_menu {
        /* margin-top: 66px !important; */
        margin-top: 7px;
        background-image: none !important;
        border-top: 5px solid black;
        background-color: white !important;
        font-family: 'Clarendon-bt-bold' !important;
        min-height: 45px !important;
      }

      /* main menu nav link */
      #main_menu li{
        padding-right: 17px !important; 
        font-size:19px !important;
        
      }

      /*  Latest News */
      #latest_news {
        margin-bottom: 25px !important;
      }

      .ticker-swipe {
        background-color: white !important;
      }

      .ticker-wrapper.has-js {
        border-radius: 0 !important;
        width: inherit !important;
        background-color: white !important;
        padding: 0 !important; 
        border-top: 1px solid black !important;
        border-bottom: 1px solid black !important;
        margin-top: 15px;
      }

      #top_leaderboard {
        text-align: unset !important;
      }

      .ticker-content {
        background-color: white !important;
      }

      .ticker-content a {
        font-family: 'Zurich-light' !important;
        font-weight: 600 !important;
        color: black !important;
      }

      .ticker {
        background-color: white !important;
        overflow: visible !important;
      }

      .time_stamp {
        font-family: 'Zurich-light' !important;
      }

      .ticker-title {
        background-color: black !important;
        position: absolute !important;
        height: 30px !important;
        width: 125px !important;
        color: white;
        line-height: 1;
      }

      .ticker-title span {
        font-family: 'Zurich-bold';
        color: white !important;
      }

       .ticker-swipe {
         width: auto !important;
       }
            

      .logo{
        width: 65%;
        padding-top: 10px;
      }

      img {
        max-width: 100%;
      }

          .right_top_tabs {
        float: right;
        font-family: 'Zurich-light';
      }

      .right_top_tabs li {
        display: inline-block;

      }

      .right_top_tabs li a{
        font-size: 16px;
        color: black;
      }



      /* Article Layout */
      #story {
        width: 100% !important;
        padding-top: 0px !important;
      }
      
      #story h2 {
        font-family: 'Versailles-std-black' !important;
        /* font-family: 'utopia-regular' !important; */
        line-height: 1.1 !important;
        color: black !important;
        font-size: 30px;
        margin-bottom: 5px;
      }


      #story h3.sub_title { font-family: 'utopia-std', serif, "Arial Black", sans-serif; font-size: 15px; }


      #photo_caption { font-family: 'Zurich-light' !important; line-height: initial !important; padding-top: 15px;}


      #story p {
        font-size: 16px !important;
        font-family: 'utopia-std', serif !important;
        line-height: 1.6; 
        text-align: justify !important;
      }

      #story p strong {
        text-align: justify !important;
        font-family: 'utopia-std', serif !important;
        line-height: 1.6; 
      }

      #byline small {
        font-size: 18px !important;
        font-family: 'Zurich-light' !important;
      }
      
      #story #byline p {
        font-size: 14px !important;
        margin-top: 16px !important;
        font-family: 'utopia-std', serif !important;
        color: black !important;
        margin-bottom: 0px !important;
        line-height: 1.2 !important;
      }
      

      /* Article Categories (Section) */
      #news_articles_section h1 a { font-size: 25px !important; }
      #news_articles_section h1 {
        color: #ed1b24 !important;
        font-family: 'Clarendon-bt-bold' !important;
        margin-bottom: 0 !important;
        padding-bottom: 0px !important;
        font-size: 50px;
    
      }

      #news_articles_section {
        width: 100% !important;
    }

    #news_articles_section h1 {
      width: max-content;
    }

    #articles_container.latest_news {
      width: 100% !important;
    }

    .thick_border {
      margin-bottom: 0 !important;
      border-top: 6px solid black;
    }

    .thin_border {
      margin-top: 0 !important;
      /* border-top: 6px solid #cdcdcd; */
    }

    #articles_container #ac1, #articles_container #ac2 {
      width: 100% !important;
      height: auto !important;
      min-height: auto !important;
      padding-right: 0px !important;
    }


    .th_title {
      text-transform: uppercase;
      font-family: 'Zurich-bold' !important;
      margin-bottom: 0 !important;
      color: white !important;
      padding-right: 30px !important;
    }
    

    .section_label {
      background-color: #ed1b24;
      padding: 6px 11px;
    }

    .section_label a {
      text-transform: uppercase;
      font-family: 'Zurich-bold' !important;
      margin-bottom: 0 !important;
      color: white !important;
      padding-right: 30px !important;
    }

    #articles_container {
      width: 100% !important;
    }

    #articles_container.latest_news {
      min-height: auto !important;
    }

    /* #articles_container #ac1 {
      margin-top: 15px; 
      width: 65% !important;
    }

    #articles_container #ac2 {
      margin-top: 15px; 
    }

    #articles_container #ac1 img {
      margin-top: -107px !important;
    }

    #articles_container #ac1 h2 {
      padding-left: 326px !important;
    } */
.grey_contain {
  padding: 15px 10px 15px 10px;
  background-color: #f6f6f6;
  /* font-family: 'century_regular' !important; */
}

.grey_contain, .white_contain {
  min-height: 208px !important; 
}

.white_contain {
  padding: 15px 10px 15px 10px;
  
}

.white_contain .boldFont {
  font-family: 'utopia-std', serif !important;
  font-size: 18px !important;


}

.white_contain .boldFont a{
  min-height: 55px !important;
  display: block !important;
  color: black !important;
  font-weight: bold;
}
.white_contain .boldFont a:hover{
  color: #ed1b24 !important;
}

.white_contain h2 a{
  color: black;
  font-size: 20px;
  font-family: initial;
  font-family: 'Versailles-std-black';
  font-weight: bold;
}

#articles_container #ac1 h2 {
  font-family: 'Versailles-std-black' !important;
  color: black !important;
} 

a.spec {
  font-size: 16px !important;
  font-family: 'Versailles-std-light' !important;
  color: black;
  min-height: 55px !important;
  display: block !important;
  font-weight: 900;
}

a.spec:hover {
  color: #ed1b24 !important;
}

#articles_container {
  font-family: 'utopia-std', serif !important;
}

#articles_container .grey_contain  a{
  font-family: 'Versailles-std-light' !important;
}

#articles_container h2 a{
  font-family: 'Versailles-std-black' !important;
}


/* top section of site */

#slider_container {
  width: 100% !important;
  float: none !important;
  padding-right: 0px !important;
  margin-top: 0px !important;
}

#todays_headlines {
  background: none !important;
  width: 100% !important;
  margin-top: 20px !important;
  float: none !important;
  height: 140px !important;
}

.showcase-content {
  width: 100% !important;
}

.showcase-content-container {
  width: 100% !important;
  height: 335px !important;

}

#videos {
  background: none !important;
  width: 100% !important;
}

#videos #other_videos {
  width: 100% !important;
}

.vid_img {
  width: 100% !important;
}

.vid_caption {
  font-family: 'utopia-std', serif !important;
}

.showcase {
  width: 100% !important;
}

.showcase-thumbnail{
  height: 10px !important;
  border-top: 7px solid #d6d5d3;
  color: #7d898f;
}
/*
.showcase-thumbnail.active {
  border-top: 7px solid #EE383E;
  color: #FF0000;
}*/


.showcase-thumbnail-wrapper-horizontal .showcase-thumbnail {
  width: 90px !important;
}

.showcase-thumbnail-restriction {
  width: 565px !important;

}

#slider_container h1 {
  margin-top: 8px !important;
}

#slider_container h1 a{
  font-size: 42px !important;
  font-family: 'Clarendon-bt-bold' !important;
  line-height: 1 !important;
  min-height: 20px !important;
}

.static-caption {
  margin-top: 10px !important;
  margin-right: 0px !important;
  font-size: 18px !important;
  text-align: justify !important;
  line-height: 1.4 !important;
  color: black !important;
} 


/* today headlines */


.showcase-thumbnail-container {
  /* display: none !important; */
}


#thmp_container {
  width: 100% !important;
  padding-right: 17px !important;
}


#todays_headlines #th {
  width: 100% !important;
  overflow: visible !important;
  height: auto !important;
}

#thmp_container a{
  /* padding: 8px 15px !important; */
  padding: 0 !important;
  font-size: 15px !important;
  margin-bottom: 7px !important;
  line-height: 1.3 !important;
  height: 45px !important;
}

#main_headline_area {
  width: 100% !important;
}

#topHeadlinesCustom{
    position: absolute !important;
    top: 880px !important;
    left: 11px !important;
}

#th .col-sm-4 {
  border-right: 1px solid #cdcdcd !important;
}

#th .col-sm-4:last-child {
  border-right: none !important;

}

#th .col-sm-3 {
  border-right: 1px solid #cdcdcd !important;
}

#th .col-sm-3:last-child {
  border-right: none !important;

}



#topHeadlinesCustom .col {
  border-right: 1px solid #cdcdcd !important;

}

#topHeadlinesCustom .col:last-child {
  border-right: none !important;
}

.showcase-thumbnail-caption {
  font-family: 'utopia-std', serif !important;
}

#topHeadlinesCustom .col a{
    /* display: block !important; */
    /* height: 62px !important; */
}

.mostPopularToonsToday .card-header h4{

  font-family: 'Zurich-bold' !important;
  font-size: 18px !important;
  margin-bottom: 0 !important;
  color: white !important;
  
}

.popular .card-header {

  background-color: #231f20 !important;
  border-top: 4px solid black !important;

}

#most_popular_stories .card-body{
    background-color: #c3d9d6 !important;
    padding: 15px 12px 0px 15px !important;
    /* height: 350px !important; */
}

#most_popular_stories {
  background: none !important;
}


#most_popular_stories ul {
  padding: 0 !important;
  list-style: none !important;
}

#most_popular_stories #mps {
  width: 100% !important;
  overflow: visible !important;
}

#most_popular_stories #mps li a{
    font-size: 18px !important;
    font-family: 'Zurich-light' !important;
    color: black !important;
}

#most_popular_stories #mps li{
  margin-bottom: 1rem !important;
}

#most_popular_stories #mps li a{
  line-height: 0.9 !important;
}

#most_popular_stories #mps li a:hover{
  color: #ed1b24 !important;
}

#most_popular_stories #mps li span{
  line-height: 1.5 !important;
}

.mostPopularToonsToday .card{
  width: 100% !important;
  border: none !important;
  border-radius: 0px !important;
}

.mostPopularToonsToday .card-header {
  border-radius: none !important;
}

.mostPopularToonsToday .toon .card-header{
    background-color: white;
    border-top: 4px solid black;
}

.mostPopularToonsToday .frontPage .card-header{
  background-color: #ed1b24;
  border-top: 4px solid black;
}

.mostPopularToonsToday .toon .card-header h4{ 
  color: black !important;
}

.mostPopularToonsToday .card-header:first-child {

  border-radius: 0px !important;

}

#todays_paper {
  background: none !important;
}

#todays_cartoon {
  background: none !important;
} 

.previous_toons_link{
  font-family: 'utopia-std', serif !important;
  font-size: 20px !important;
  color: black !important;
}

.previous_toons_link:hover {
  color: #ed1b24 !important;
}

.frontPage .card-body{
  background-color: #f2f2f2;
  padding: 7px 0px 7px 0px;
}

.mostPopularToonsToday .card-body {
  height: 370px !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
}

#advetisement_300x250 {
  margin-top: 0px !important;
}


.ored {
  font-family: 'utopia-std', serif !important;
  color: black !important;
}



.more_stories a {
  font-family: 'Zurich-bold' !important;
  color: black !important;
  float: right;
  font-size: 18px;
}

.more_stories a:hover {

  color: #ed1b24 !important;

}

#videos #other_videos ul li {
  height: 150px !important;
  padding-left: 0px !important;
  margin-bottom: 75px !important;
  list-style: none !important;
  width: 210px !important;
}

#videos #other_videos ul li a img { margin-bottom: 5px; }





.front_videos ul li a .play_button{
  z-index: 15845;
  margin-left: -55px !important;
  margin-top: 88px !important;
  border: none !important;
}

.front_videos  h4 {
  font-size: 14px;
  font-family: 'utopia-std', serif !important;
  width: 190px !important;
  line-height: 20px;
  color: black !important;
}

.front_videos h4:hover{

  color: #ed1b24 !important;

}
#more_videos {
  margin-top: 0px !important;
}

#more_videos a {
  color: black !important;
}

#more_videos a:hover {
  color: #ed1b24 !important;
}


#observer_tweets {
  background: none !important;
  margin-top: 0 !important;
}
.disqus-cnt-txt {
  background: url('/images/comment.svg') !important;
  background-repeat: no-repeat !important;
  font-family: 'utopia-std', serif !important;
  color: #ed1b24!important;
  padding-left: 20px !important;
  font-weight: 800;
  background-position: 2% !important;
}



.comment i {
  font-size: 13px;
  color: #ed1b24 !important;
}

.headline_contain{
  min-height: 35px !important;
  display: block !important; 
}

#lotto-container ul {
  margin-top: 81px !important;
}

#lotto-container p{
  margin-top: 14px !important;
}



/* Overlay Search */


#search-btn{
  /* position: absolute;
  top: 1em;
  right: 715px;
  z-index: 1; */
  /* background-color: rgba(0,0,0,0.8); */
  /* padding: 10px; */
  /* border-radius: 2px;
  color: #FFF; */
}

#search-btn:hover{
  /* background-color: rgba(0,0,0,0.5); */
  cursor: pointer;
  
}
#search-overlay{
  display:none;
}
.block {
  position: fixed;
  top: 0;
  right: 0;
  bottom:0 ;
  left: 0;
  overflow: auto;
  text-align: center;
  background: rgba(0, 0, 0, 0.9);
  border: #a0a0a0 solid 1px;
  margin: 0;
  z-index: 1;
}

.block:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: 0;
  /* Adjusts for spacing */
  /* For visualization 
  background: #808080; width: 5px;
  */
}

.centered {
  display: inline-block;
  vertical-align: middle;
  width: 50%;
  padding: 10px 15px;
  color: #FFF;
  border: none;
  background: transparent;
}



#search-box {
  position: relative;
  width: 100%;
  margin: 0;
}

.search-form {
  height: 65px;
  border: 1px solid #999;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  background-color: #fff;
  overflow: hidden;
  font-family: 'Versailles-std-light';
}

#search-text {
  font-size: 14px;
  color: #ddd;
  border-width: 0;
  background: transparent;
}

#search-box input[type="text"] {
  width: 90%;
  padding: 18px 0px;
  color: #333;
  outline: none;
  font-size: 25px;
}

#search-button {
  position: absolute;
  top: 0;
  right: 0;
  height: 3.58em;
  width: 100px;
  font-size: 18px;
  color: #fff;
  text-align: center;
  line-height: 42px;
  border-width: 0;
  background-color: #ed1b24;
  -webkit-border-radius: 0 2px 2px 0;
  -moz-border-radius: 0 2px 2px 0;
  border-radius: 0 2px 2px 0;
  cursor: pointer;
}
/* h1{
  text-align: center;
  font-size: 3.5em;
  color: #fff;
  margin-top: 2em;
  font-weight: 600;
}
h1 span{
  background: #222;
  padding: 10px;
} */
#close-btn{
  position: fixed;
  top: 1em;
  right: 1em;
}
#close-btn:hover{
  color: #777;
  cursor: pointer;
}


/* on click nav */


:focus {
  outline: none;
}


.social_clicks li a:hover {
  color: #ed1b24 !important;
}


.bars{
  font-size: 22px;
  position: absolute;
  /* top: 159px; */
  /* top: 145px; */
  right: -7px;
}

/*
* Full menu
* ----------
* Styles in this section are very
* important and you have to implement
* them if you want for your
* navigation to work properly.
*
*/
.full-menu {
visibility: hidden;
display: table;
position: fixed;

opacity: 0;
background-color: rgba(256, 256, 256, 0.92);
-webkit-transform: scale(0.85);
-ms-transform: scale(0.85);
transform: scale(0.85);
-webkit-transition: all 200ms ease-in-out;
transition: all 200ms ease-in-out;

margin-left: auto;
margin-right: auto;
left: 0;
right: 0;
margin-top: 190px;
height: 580px;
width: 860px;

}

.full-menu ul {

margin: 0px !important;
padding: 0 !important; 
list-style: none !important;
margin-top: -120px;
}


.full-menu .col-sm-4 {
border-left: 2px solid #cdcdcd;
}


.full-menu ul li {
font-size: 18px;
}


.full-menu--open {
visibility: visible;
opacity: 1;
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
z-index: 1;
}
.full-menu--transition {
-webkit-transition: all 200ms ease-in-out;
transition: all 200ms ease-in-out;
}
.full-menu--middle {
display: table-cell;
vertical-align: middle;
border: 1px solid;
}
.menu-toggle {
border: 0;
/* color: #fff; */
background-color: transparent;
}
.menu-toggle:before {
content: '\f0c9';
font-family: 'FontAwesome';
margin: 0 20px 0 0;
}
.menu-toggle--close {
position: absolute;
top: 30px;
right: 30px;
}

.menu-toggle--close:before {
content: '\f00d';
color: #000;
font-size: 40px;
margin: 0;
}


.sidebar .related_list h5 {
  font-size: 26px;
  font-family: 'Zurich-bold';
}

.sidebar .related_list ul{
  padding: 0 !important;
  margin: 0 !important;
  list-style: none;
}

.sidebar .related_list ul li {
  padding-bottom: 10px;
  border-bottom: 1px solid #cdcdcd;
  padding-top: 6px;
  line-height: 1;
}

.sidebar .related_list ul li a {
  font-size: 13px;
  font-family: 'utopia-std', serif !important;
  line-height: 1.3;
  color: black !important;
}

.full-menu ul li a {
  color: black !important;
}

.full-menu ul li a:hover {
  color: #ed1b24 !important;
}

#thmp_container .disqus-cnt-txt {
  float: right !important;
  font-size: 11px !important;
}

#right_column {

  width: 310px !important;

}


.article_toons {
  float: left !important;
  width: 100%;
}


.article_toons .card-header {
  background-color: black !important;
  border-top-right-radius: 0px !important;
  border-top-left-radius: 0px !important;
  border-color: black !important;

} 

.article_toons h4 {
  margin-bottom: 0px !important;
  color: white !important;
  font-family: 'utopia-std', serif !important;
}

.article_toons #todays_cartoon {
  width: 100% !important;
}


#advetisement_300x600 h5 {
  float: left !important;
  font-family: Helvetica, sans-serif !important;
  font-size: 9px !important;
  font-weight: lighter !important;
  color: #363636 !important;
  margin-bottom: 5px !important;
  letter-spacing: 2px !important;
}


#advetisement_300x250 {
  margin-top: 14px !important;
  margin-bottom: 34px !important;
}


.center_ads {
  margin: 0 auto;
}

.section_videos .play_button{
  width: 30px !important;
  margin-top: -55px !important;
  margin-left: 9px !important;
}

.section_videos a{
  color: black !important;
}

.section_videos h4 {
  font-family: 'utopia-std', serif !important;
  width: inherit !important;
  font-size: 11px;
  line-height: 15px;
}

.section_videos h4:hover{
  color: #ed1b24 !important;
}

.videosSection .card-header {
  background-color: black !important;
  border-top-right-radius: 0px !important;
  border-top-left-radius: 0px !important;
  border-color: black !important;
}

.videosSection .card-header h4 {
  font-family: 'utopia-std', serif !important;
  margin-bottom: 0px !important;
  color: white;

}

.e_paper .eBefore{
  color: #ed1b24 !important;
  font-weight: bold;
  right: 177px !important;
  position: absolute !important;
  font-size: 20px;
  top: 51px;
}

.e_paper .eAfter {
  font-weight: bold;
  color: #000 !important;
  position: absolute;
  top: 51px;
  font-size: 20px;
  right: 136px;
}

#sub_menu a {
  color: black !important;
  font-size: 14px !important;
}

#sub_menu {

  margin-top: -7px !important;
  margin-bottom: 22px !important;
  /* border-top: 1px solid; */
  margin-left: 0px !important;

}

.menu_divider {
  padding-right: 10px !important;
}

#sub_menu li {
  padding-right: 8px !important;
}

#articles_container #inside_ac1 img {
  padding-right: 13px !important;
}


.radio_logos img{
  width: 110px !important;
}

.radio_sep{

  position: absolute;
  top: 55px;
  /* right: 125px; */
  font-size: 18px;

}