/*
Theme Name: MyBroadband Nightcrawler
Theme URI: http://mybroadband.co.za
Author: MyBroadband
Author URI: https://mybroadband.co.za
Description: MyBroadband Nightcrawler is a change to include the new MyBroadband identity.
Version: 1.0

*/


/** =================== MONTSERRAT =================== **/

/** Montserrat Light **/
@font-face {
    font-family: "Montserrat";
    font-weight: 300;
    font-style: normal;
    font-display: swap;
    src: url("fonts/Montserrat-Light.eot");
    src: local('Montserrat Light'), local('Montserrat-Light'),
         url("fonts/Montserrat-Light.eot?#iefix") format('embedded-opentype'),
         url("fonts/Montserrat-Light.woff2") format("woff2"),
         url("fonts/Montserrat-Light.woff") format("woff");
}

/** Montserrat Regular **/
@font-face {
    font-family: "Montserrat";
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: url("fonts/Montserrat-Regular.eot");
    src: local('Montserrat Regular'), local('Montserrat-Regular'),
         url("fonts/Montserrat-Regular.eot?#iefix") format('embedded-opentype'),
         url("fonts/Montserrat-Regular.woff2") format("woff2"),
         url("fonts/Montserrat-Regular.woff") format("woff");
}


/** Montserrat SemiBold **/
@font-face {
    font-family: "Montserrat";
    font-weight: 600;
    font-style: normal;
    font-display: swap;
    src: url("fonts/Montserrat-SemiBold.eot");
    src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'),
         url("fonts/Montserrat-SemiBold.eot?#iefix") format('embedded-opentype'),
         url("fonts/Montserrat-SemiBold.woff2") format("woff2"),
         url("fonts/Montserrat-SemiBold.woff") format("woff");
}

/** Montserrat Bold **/
@font-face {
    font-family: "Montserrat";
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: url("fonts/Montserrat-Bold.eot");
    src: local('Montserrat Bold'), local('Montserrat-Bold'),
         url("fonts/Montserrat-Bold.eot?#iefix") format('embedded-opentype'),
         url("fonts/Montserrat-Bold.woff2") format("woff2"),
         url("fonts/Montserrat-Bold.woff") format("woff");
}
/* ----------- */


/** =================== OPEN SANS =================== **/

/** Open Sans Light **/
@font-face {
    font-family: "Open Sans";
    font-weight: 300;
    font-style: normal;
    font-display: swap;
    src: local('Open Sans Light'), local('OpenSans-Light'),
         url("fonts/OpenSans-Light.woff2") format("woff2"),
         url("fonts/OpenSans-Light.woff") format("woff");
}

/** Open Sans Regular **/
@font-face {
    font-family: "Open Sans";
    font-weight: 400;
    font-style: normal;
    font-display: swap;
    src: local('Open Sans Regular'), local('OpenSans-Regular'),
         url("fonts/OpenSans-Regular.woff2") format("woff2"),
         url("fonts/OpenSans-Regular.woff") format("woff");
}


/** Open Sans SemiBold **/
@font-face {
    font-family: "Open Sans";
    font-weight: 600;
    font-style: normal;
    font-display: swap;
    src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
         url("fonts/OpenSans-SemiBold.woff2") format("woff2"),
         url("fonts/OpenSans-SemiBold.woff") format("woff");
}

/** Open Sans Bold **/
@font-face {
    font-family: "Open Sans";
    font-weight: 700;
    font-style: normal;
    font-display: swap;
    src: local('Open Sans Bold'), local('OpenSans-Bold'),
         url("fonts/OpenSans-Bold.woff2") format("woff2"),
         url("fonts/OpenSans-Bold.woff") format("woff");
}
/* ----------- */

body {
    font-family: Montserrat, "Helvetica Neue", sans-serif;
    margin: 0px;
    color: #2d3339;
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    background: #f1f1f1;
}
a {
    color: #1173b4;
    text-decoration: none;
}
.entry-content a:hover {
    text-decoration: underline;
}
.site {
    position: relative;
    z-index: 10;
    width: 1020px;
    margin: 0 auto;
    background: #fff;
    border-left: solid 1px #f1f1f1;
    border-right: solid 1px #f1f1f1;
}
.skip-link {
    display: none;
}

/* LOGO */
.site-title {
    display: none;
}
.logo {
    display: block;
    width: 300px;
    height: 63px;
    margin: 0 auto;
}
.logo img {

}
.header_ad {
    padding-top: 15px;
    text-align: center;
    padding-bottom: 15px;
    min-height: 90px;
    width: 728px;
    margin: 0 auto;
}
h3 {
    font-size: 18pt;
}
/* ----------- */


/* MAIN CONTENT */
.site-main {
    margin: 0px 30px;
    padding-bottom: 30px;
    display: block;
    min-height: 100vh;
}
.box-title h2 {
    font-weight: 600;
    text-transform: uppercase;
    margin: 5px 0px 20px 0px;
    padding-top: 5px;
}
.box-title .title-line {
    display: block;
    border-top: solid 2px #2d3339;
    width: 50px;   
}
.box-title .title-linked {
    color: #2d3339;
    text-decoration: none;
}
.top-bar {
    width: 100%;
    background: #fff;
    padding: 15px 0px;
    color: #ababad;
    border-top: solid 3px #2d3339;
}
.top-bar a {
    color: #2d3339;
    transition: all 0.3s;
}
.top-bar a:hover {
    color: #1d1d1d;
    transition: all 0.3s;
}
.top-social-links {
    float: right;
    margin-right: 20px;
}
.top-social-links a {
    margin-left: 20px;
    line-height: 63px;
}
.magazine-top-link {
    padding: 0px 15px 0px 0px;
    margin-right: 0px;
    float: right;
    line-height: 63px;
}
.type-page {
    padding-top: 20px;
}

.main-side-ad { display: inline-block; }
/* ----------- */

/* NAVIGATION */
.menu {
    border-bottom: solid 1px #eee;
    border-top: solid 1px #eee;
}
.menu ul {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex; 
    align-items: stretch;
    justify-content: space-between;
    margin: 0px 30px;
    padding: 0px;
}
.menu ul li {
    list-style: none;
    display: block;
    flex: 0 1 auto;
    text-align: center;
}
.menu ul li a {
    text-decoration: none;
    color: #2d3339;
    text-transform: uppercase;
    display: block;
    padding: 20px 0px;
    font-size: 14px;
    letter-spacing: 0.3px;
    font-weight: 600;
}
.menu ul li a:after {
    background: #2d333a;
    top: 20px;
    left: 0px;
    content: '';
    display: block;
    height: 2px;
    position: relative;
    right: 5px;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: -webkit-transform 334ms cubic-bezier(0.4, 0, 1, 1);
    transition: -webkit-transform 334ms cubic-bezier(0.4, 0, 1, 1);
    transition: transform 334ms cubic-bezier(0.4, 0, 1, 1);
    transition: transform 334ms cubic-bezier(0.4, 0, 1, 1), -webkit-transform 334ms cubic-bezier(0.4, 0, 1, 1);
}
.menu ul li a:hover:after,.menu ul li a:focus:after {
    -webkit-transform:scaleX(1);
    transform:scaleX(1);
    -webkit-transition:-webkit-transform 334ms cubic-bezier(0, 0, 0.2, 1);
    transition:-webkit-transform 334ms cubic-bezier(0, 0, 0.2, 1);
    transition:transform 334ms cubic-bezier(0, 0, 0.2, 1);
    transition:transform 334ms cubic-bezier(0, 0, 0.2, 1), -webkit-transform 334ms cubic-bezier(0, 0, 0.2, 1);
}
.sub-menu {
    position: absolute;
    background: rgba(255, 255, 255, 0.96);
    justify-content: space-between;
    display: none;
    width: 960px;
    padding: 10px 30px;
    z-index: 3;
    border-bottom: solid 1px #eee;
}
.sub-menu ul {
    margin: 0px;
    padding: 0px;
    width: 300px;
}
.sub-menu ul li {
    list-style: none;
    margin: 5px 0px;
}
.sub-menu ul li a {
    color: #8d8d8d;
    font-size: 10pt;
    transition: all 0.3s;
}
.sub-menu ul li a:hover {
    color: #535353;
    text-decoration: none;
    transition: all 0.3s;
}
.nav-search-bar {
    width: 100%;
    padding: 48px;
    text-align: center;
    font-size: 49pt;
    border: none;
    color: #666;
    background: none;
    margin: 0px 10px;
}
.nav-search-bar:focus {
    outline: none;
}
.search-menu i {
    pointer-events: none;
}

.mobile-site-header {
    display: none;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 10;
    height: 50px;
    background: #fff;    
    -moz-box-shadow:    0px -10px 25px 0px #000;
    -webkit-box-shadow: 0px -10px 25px 0px #000;
    box-shadow:         0px -10px 25px 0px #000;
    
}
.mobile-logo {
    background: #2d333a;
    transition: all 0.3s;
}
.mobile-logo:hover {
    background: #0f1317;
    transition: all 0.3s;
}
.mobile-logo img {
    width: 50px;
    height: 50px;
    -webkit-backface-visibility: hidden;
}
.mobile-menu-button {
    line-height: 50px;
    position: absolute;
    right: 0px;
    width: 50px;
    text-align: center;
    color: #888;
    cursor: pointer;
    transition: all 0.3s;
    background: #fff;
}
.mobile-menu-button:hover {
    color: #2d3339;
    transition: all 0.3s;
}
.mobile-search-button {
    line-height: 50px;
    position: absolute;
    right: 50px;
    width: 50px;
    text-align: center;
    color: #888;
    cursor: pointer;
    transition: all 0.3s;
    background: #fff;
}
.mobile-search-button:hover {
    color: #2d3339;
    transition: all 0.3s;
}
.mobile-menu-close {
    line-height: 50px;
    position: absolute;
    right: 0px;
    width: 50px;
    text-align: center;
    color: #fff;
    cursor: pointer;
    transition: all 0.3s;
    pointer-events: none;
    z-index: 12;
}
.mobile-overlay {
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    background: rgba(0, 0, 0, 0.4);
    z-index: 11;
}
.mobile-menu {
    position: fixed;
    z-index: 12;
    background: #2d3339;
    width: 80%;
    height: 100%;
    left: 0px;
    top: 0px;
    margin-left: -80%;
    overflow: scroll;
}
.mobile-menu ul {
    list-style: none;
    padding: 0px;
    margin: 0px;
}
.mobile-menu ul li a {
    color: #bbb;
    display: block;
    padding: 14px 20px;
    border-bottom: solid 1px #2d3339;
    font-size: 10pt;
    font-weight: 600;
    transition: all 0.3s;
}
.mobile-menu ul li a:hover {
    background: #2d2d2d;
    transition: all 0.3s;
}
.mobile-expand i {
    float: right;
}
.mobile-menu ul li ul {
    display: none;
}
.mobile-menu ul li ul li a {
    background: #2b2b2b;
    padding: 14px 35px;
    transition: all 0.3s;
}
.mobile-menu ul li ul li a:hover {
    background: #252525;
    transition: all 0.3s;
}
.mobile-bar-share {
    color: #888;
    line-height: 50px;
    margin-left: 15px;
    font-size: 15px;
}
.mobile-bar-share a {
    font-size: 13px;
    display: inline-block;
    text-align: center;
    height: 30px;
    margin-right: 10px;
    width: 30px;
    color: #fff;
    line-height: 30px;
    transition: all 0.3s;
    margin-top: 11px;
}
.mobile-bar-share a:hover {
    background: #2d3339;
    transition: all 0.3s;
}
.mobile-search-bar {
    display: none;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 11;
    height: 50px;
    background: #fff;   
}
.mobile-search-bar .search-bar-button {
    line-height: 50px;
    position: absolute;
    left: 0px;
    width: 50px;
    text-align: center;
    color: #888;
}
.mobile-search-bar .search-bar-close {
    line-height: 50px;
    position: absolute;
    right: 0px;
    width: 50px;
    text-align: center;
    color: #888;
    cursor: pointer;
}
.mobile-search-bar form {
    line-height: 50px;
    position: absolute;
    left: 50px;
}
.mobile-search-bar form input {
    min-width: 210px;
    border: none;
    outline: none;
    font-size: 12pt;
    color: #555;
}

/* FOLLOW US */
.follow-buttons {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: stretch;
    justify-content: space-between;   
}
.follow-buttons a {
    background: #fff;
    color: #2d3339;
    width: 40px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    border: solid 1px #ddd;
    transition: all 0.3s;
}
.follow-buttons a:hover {
    color: #fff;
    border: solid 1px #4b4b4b;
    background: #4b4b4b !important;
}
.mobile-footer-menu .follow-buttons a {
    background: none;
    border: none;
}
.mobile-footer-menu .follow-buttons a:hover {
    color: #fff;
    border: none;
    background: none;
}
/* ----------- */ 

/* FOOTER */
.site-footer {
    width: 1020px;
    margin: 0 auto;
    z-index: 9;
    position: relative;
    background: #F1F1F1;
}

.site-footer .site-info {
    background: #2b2d32;
    padding: 20px 0px;
}

.site-footer .footer-sub-menu {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    position: relative;
    background: none;
    justify-content: space-between;
    margin: 0px 30px;
    width: 960px;
    padding: 10px 0px;
    
}
.site-footer a {
    color: #d5d5d6;
    font-size: 11pt;
}
.site-footer a:hover {
    color: #ffffff;
}
.site-footer ul {
    margin: 0px;
    padding: 0px;
    width: 300px;
}
.site-footer ul li {
    margin: 9px 0px;
    list-style: none;
}
.site-footer .footer-header {
    margin-bottom: 20px;
}
.site-footer .footer-header span {
    width: 30px;
    height: 2px;
    border-top: solid 2px #fff;
    display: block;
    margin-bottom: 5px;
}
.site-footer .footer-header a {
    color: #fff;
    font-size: 14pt;
    font-weight: 600;
}
.mobile-footer-menu {
    display: none;
}
/* ----------- */

/*FOOTER LOGOS*/

.logo-column-1 img {
    width: 100%;
    height: auto;
}

.footer-logos-inner {
    width: 1150px;
    margin: auto;
}

.clearfix:after, .clearfix:before {
    content: " ";
    display: table;
}

.footer-logos-three-columns {
    width: 100%;
    overflow-x: hidden !important;
}

.footer-logos-three-columns>.footer-logos-three-columns-inner {
    margin: 0 -12px;
}

.footer-logos-three-columns .footer-logos-column {
    width: 33.33%;
    float: left;
}

.footer-logos-three-columns .footer-logos-column .logo-column-inner {
    padding: 0 12px;
}
/* ----------- */

/* NEWS FEED STYLING */
.feature_article {
    width: 630px;
    float: left;
    margin-right: 30px;
    position: relative;
}
.feature-overlay {
    width: 100%;
    height: 100%;
    background: -moz-linear-gradient(top, rgba(0,0,0,0.3) 0%, rgba(0,0,0,1) 100%);
    background: -webkit-linear-gradient(top, rgba(0,0,0,0.3) 0%,rgba(0,0,0,1) 100%);
    background: linear-gradient(to bottom, rgba(0,0,0,0.3) 0%,rgba(0,0,0,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=0 );
    position: absolute;
    top: 0px;
    left: 0px;
    transition: all 0.3s;
    pointer-events: none;
    z-index: 1;
    opacity: 0.9;
}
.feature-overlay:hover {
    background: none;
}
.feature_article header {
    position: absolute;
    bottom: 0px;
    padding: 15px;
    z-index: 2;
    pointer-events: none;
}
.feature_article header .entry-title a {
    font-size: 24pt;
    color: #fff;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
}
.feature_article header .entry-title {
    line-height: 24pt;
}
.feature_article .meta_date {
    color: #fff;
}
.feature_article .post-thumbnail {
    display: block;
    max-height: 250px;
    min-height: 250px;
    overflow: hidden;
    background: #f5f5f5;
}
.feature_article .post-thumbnail img {
    margin-top: -90px;
}
.feature_article_container {
    margin-bottom: 30px;
    padding-top: 30px;
}
.row_article_container {
    justify-content: space-between;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    margin: 0px 0px 30px;
    width: 990px;
}
.row_article_container .row_article {
    width: 300px;
}
.below_row_article_container {
    justify-content: space-between;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    margin: 0px 0px 30px;
    width: 630px;
}
.below_row_article_container .row_article {
    width: 185px;
}
.below_row_article_container .row_article .post-thumbnail {
    height: auto;
    min-height: 100px;
}
.below_row_article_container .entry-header {
    padding-top: 0px;
}
.below_article_feed {
    margin-top: 20px;
}
.below_article_feed .entry-title a {
    color: #2d3339;
    text-decoration: none;
    font-size: 13pt;
    font-weight: 400;
    line-height: 13pt;
}
.below_article_feed .entry-title {
    margin: 0px;
    line-height: 16pt;
}
.row_article header {
    position: relative;
    padding-top: 5px;
}
.row_article .post-thumbnail {
    height: 160px;
    overflow: hidden;
    display: block;
    margin-bottom: 5px;
    min-height: 160px;
    background: #f5f5f5;
}
.row_article .post-thumbnail img {

}
.entry-title {
    margin: 0px;
    line-height: 18pt;
}
.entry-title a {
    color: #2d3339;
    text-decoration: none;
    font-size: 16pt;
    font-weight: 400;
}
.entry-title a:hover {
    text-decoration: underline;
}
.post-thumbnail img {
    width: 100%;
    height: auto;
    transition: all 0.3s;
    -webkit-backface-visibility: hidden;
}
.post-thumbnail img:hover {
    opacity: 0.9;
    transition: all 0.3s;
}
.feed_article_container {
    width: 620px;
    float: left;
}
.feed_artice_side {
    float:right;
    width: 300px;
}
.feed_article {
    overflow: auto;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: solid 1px #eee;
}
.feed_artice_side .ad {
    margin: 0 auto;
    width: 300px;
}
.feed_article .post-thumbnail {
    width: 200px;
    max-height: 135px;
    display: block;
    float: left;
    margin-right: 20px;
    min-height: 135px;
    line-height: 0px;
    background: #f5f5f5;
    overflow: hidden;
}
.meta_date {
    color: #ababad;
    margin-top: 5px;
    font-size: 11pt;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
}
.meta_comments {
    font-size: 10pt;
    margin-top: 5px;   
}
.feed_leaderboard {
    width: 100%;
    text-align: center;
    margin-bottom: 30px;
}
.feed_leaderboard .ad {
    width: 728px;
    margin: 0 auto;
}
.feed-button {
    padding: 9px 0px;
    color: #2d3339;
    background: #fff;
    cursor: pointer;
    font-size: 10pt;
    border: solid 1px #2d3339;
    text-decoration: none;
    display: block;
    text-align: center;
    transition: all 0.3s;
    font-weight: bold;
    text-transform: uppercase;
}
.feed-button:hover {
    color: #fff;
    background: #2d3339;
    text-decoration: none;
}
.side_feed_article_container {
    margin-top: 20px;
    margin-bottom: 20px;
}
.side_feed_article_container .post-thumbnail {
    display: block;
    width: 100px;
    height: 100px;
    float: left;
    overflow: hidden;
    margin-right: 20px;
    min-height: 100px;
}
.side_feed_article_container .post-thumbnail img {
    height: 100%;
    width: auto;
    margin-left: -25px;
    margin-top: 0px;
}
.side_feed_article_container .entry-header {
    background: none;
    padding-top: 0px;
    position: initial;
}
.side_feed_article_container .row_article {
    border-bottom: solid 1px #eee;
    padding-bottom: 20px;
    margin-bottom: 20px;
}
.side_feed_article_container .entry-title a {
    font-size: 12pt;
    line-height: 14pt;
}
.home-posts-navigation a {
    padding: 9px 0px;
    color: #2d3339;
    background: #fff;
    cursor: pointer;
    font-size: 10pt;
    border: solid 1px #2d3339;
    text-decoration: none;
    display: block;
    text-align: center;
    transition: all 0.3s;
    text-transform: uppercase;
    font-weight: bold;
}
.home-posts-navigation a:hover {
    color: #fff;
    background: #2d3339;
    text-decoration: none;
}
.page-posts-navigation {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: stretch;
    justify-content: space-between;   
}
.page-posts-navigation a {
    padding: 9px 0px;
    color: #2d3339;
    background: #fff;
    cursor: pointer;
    transition: background 0.3s ease;
    font-size: 10pt;
    border: solid 1px #2d3339;
    text-decoration: none;
    text-align: center;
    transition: all 0.3s;
    width: 460px;
    display: block;
    flex: 0 1 auto;  
    font-weight: bold;
    text-transform: uppercase;
}
.page-posts-navigation a:hover {
    color: #fff;
    background: #2d3339;
    text-decoration: none;
}
.feature_article_container .category-caption {
    color: #fff;
}
.category-caption {
    color: #2779b7;
    font-size: 11pt;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
}
.category-caption:hover {
    color: #2d333a;
}
.atlas {
    padding-left: 7px;
    padding-right: 6px;
}
/* ----------- */

/* ARTICLE VIEW */
.the-post {
    width: 600px;
    float: left;
    border-right: solid 1px #eee;
    padding-right: 30px;
    padding-top: 20px;
}
.the-post .article-title {
    line-height: 30pt;
    font-size: 26pt;   
}
.the-post .post .post-thumbnail {
    pointer-events: none;
    display: block;
    max-height: 400px;
    min-height: 250px;
    overflow: hidden;
    background: #f5f5f5;
}
.the-post .ad {
    text-align: center;
    margin-top: 20px;
    margin: 0 auto;
    width: fit-content;
}
.single-side {
    float: right;
    width: 300px;
    padding-top: 30px;
}
.single-side .ad {
    margin: 0 auto; 
    width: 300px;
}
.article-title {
    font-size: 24pt;
}
.entry-content {
    color: #2d3339;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
}
.entry-content p {
    line-height: 18pt;
    font-size: 13pt;
}
.entry-content p strong {
    font-weight: 600;
}
.entry-content ul li {
    line-height: 18pt;
    font-size: 13pt;
    margin-bottom: 5px;
    padding-left: 5px;
}
.entry-content ul li strong {
    font-weight: 600;
}
.entry-content ol li {
    line-height: 18pt;
    font-size: 13pt;
    margin-bottom: 5px;
    padding-left: 5px;
}
.entry-content ol li strong {
    font-weight: 600;
}
.aligncenter {
    height: auto;
    margin: 0 auto;
    display: block;
    max-width: 100%;
    -webkit-backface-visibility: hidden;
}
.alignright {
    float: right; margin: 0 0 1em 1em;
}
.alignleft {
    float: left; margin: 0 1em 1em 0;
}
hr {
    border: 0;
    height: 1px;
    background: #eee;
    margin-top: 30px;
    margin-bottom: 25px;
    display: block;
}
.tags a {
    color: #2d3339;
    text-transform: uppercase;
    font-size: 0.75rem;
    padding: 5px 10px;
    white-space: nowrap;
    border: solid 1px #ddd;
    display: inline-block;
    transition: all 0.3s;
    margin-top: 4px;
}
.tags a:hover {
    color: #fff;
    background: #2d3339;
    border: solid 1px #2d3339;
    text-decoration: none;
}
.entry-footer {
    border-top: solid 1px #eee;
    margin-bottom: 20px;
}
.article-meta {
    color: #ababad;
    margin-top: 10px;
    font-size: 11pt;
    margin-bottom: 15px;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
}
.article-meta .post-date {
    padding-left: 15px;
    padding-right: 15px;
}
.article-meta a {
    color: #777;
}
.article-meta a:hover {
    color: #383838;
    text-decoration: none;
}
.article-share-buttons a {
    display: inline-block;
    float: left;
    text-align: center;
    height: 36px;
    margin-right: 10px;
    width: 36px;
    transition: all 0.3s;
    color: #fff;
    line-height: 36px;
    transition: all 0.3s;
}
.article-share-buttons a:hover {
    background: #2d3339;
}
.facebook-share { background: #3B5998; transition: all 0.3s; }
.twitter-share { background: #55ACEE; transition: all 0.3s; }
.googleplus-share { background: #db4437; transition: all 0.3s; }
.whatsapp-share { background: #1ebea5; transition: all 0.3s; }
.linkedin-share { background: #0077B5; transition: all 0.3s; }
.email-share { background: #bababa; transition: all 0.3s; }
.counter {
    color: #2d3339;
    float: left;
    text-align: center;
    border-right: solid 1px #efefef;
    padding-right: 12px;
}
.counter .number {
    font-size: 20pt;
    line-height: 0px;
    margin-top: 12px;
    margin-bottom: 13px;   
}
.counter .share-text {
    font-size: 9pt;
    height: 13px;
}
.social-section {
    margin-top: 20px;
    padding-bottom: 5px;
}
.link-forum {
    white-space: nowrap;
    display: inline-block;
    width: 100%;
    line-height: 27pt;
    transition: all 0.3s;
    background: #2d3339;
    color: #fff;
    border: none;
    text-align: center;
    text-transform: uppercase;
    font-size: 10pt;
    font-weight: bold;
}
.link-forum:hover {
    color: #fff;
    background: #2d3339;
    text-decoration: none;
}
.link-forum i {
    margin-left: 5px;
    font-size: 10pt;   
}
.bottom-share {
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    margin-bottom: 20px;
}
.bottom-share a {
    color: #fff;
    display: block;
    flex: 0 1 auto;
    text-align: center;
    width: 49%;
    text-transform: uppercase;
    font-size: 10pt;
    padding: 10px 0px;
    transition: all 0.3s;
    text-transform: uppercase;
    font-weight: bold;
}
.bottom-share a:hover {
    text-decoration: none;
    background: #2d3339;
}
.bottom-facebook-share {
    background: #3B5998;
}
.bottom-twitter-share {
    background: #55ACEE;
}
.bottom-whatsapp-signup {
    background: #1ebea5;
}
.whatsapp-button {
    background: #1ebea5;
    color: #fff;
    display: block;
    text-align: center;
    padding: 10px;
    font-size: 10pt;
    text-transform: uppercase;
    font-weight: bold;
}
.whatsapp-button:hover {
    background: #2d3339;
}
.article-top-bar {
    position: fixed;
    width: 100%;
    top: 0px;
    left: 0px;
    background: #fff;
    box-shadow: 0 0 10px 0 rgba(0,0,0,0.28);
    margin-top: -70px;
}
.article-top-bar .article-top-bar-title div {
    color: #2d3339;
    font-size: 22pt;
    font-weight: 600;  
    line-height: 60px;
    display: block;
    float: none;
    width: 2000px;
    position: relative;
}
.article-top-bar .article-top-bar-title {
    display: block;
    float: none;
    position: relative;
    overflow: hidden;
}
.article-top-bar .article-top-bar-logo img {
    width: 100%;
    height: auto;
}
.article-top-bar .article-top-bar-logo {
    height: 60px;
    width: 60px;
    float: left;
    background: #2d333a;
    margin-right: 20px;
    transition: all 0.3s;
}
.article-top-bar .article-top-bar-logo:hover {
    background: #1d2227;
    transition: all 0.3s;
}
.article-top-bar-share {
    float: right;
    line-height: 60px;
    color: #888;
    margin-right: 30px;   
}
.article-top-bar-share a {
    display: inline-block;
    float: right;
    text-align: center;
    height: 38px;
    margin-left: 14px;
    width: 38px;
    color: #fff;
    line-height: 38px;
    transition: all 0.3s;
    margin-top: 10px;
}
.article-top-bar-share a:hover {
    background: #2d3339;
    transition: all 0.3s;
}
.line-end {
    background: linear-gradient(to right, rgba(255, 255, 255, 0), #FFF) repeat scroll 0% 0% transparent;
    bottom: 0px;
    max-height: 100%;
    position: absolute;
    right: 0px;
    height: 100%;
    width: 150px;
    z-index: 999;
    border-right: solid 30px #fff;
}
.entry-content p iframe {
    width: 100%;
    margin: 0;
    border: none;
}
.entry-content iframe {
    width: 100%;
    margin: 0;
    border: none;
}
.presented-title {
    background-color: #E5E5E5;
    font-size: 13px;
    padding: 3px 8px;
    display: inline-block;
    margin-top: 5px;
    color: #2d3339;
    margin-right: 7px;
}
.presented-article-title {
    background-color: #E5E5E5;
    font-size: 13px;
    padding: 3px 8px;
    display: inline-block;
    margin-bottom: 8px;
}
.show-comments {
    width: auto;
    color: #2d3339;
    cursor: pointer;
    font-size: 10pt;
    margin-bottom: 5px;
    margin-top: 10px;
    transition: background 0.3s ease;
    border-width: 1px;
    border-style: solid;
    border-color: #2d3339;
    border-image: initial;
    padding: 9px !important;
    background: rgb(255, 255, 255) !important;
        font-weight: bold;
    text-transform: uppercase;
    text-align: center;
}
.show-comments:hover {
    color: #fff;
    background: #2d3339 !important;
}
.comments-policy {
    font-weight: 600;
}
.comments-policy span {
    color: #bf2b2b;
}
.switch {
    background: #2d3339;
    height: 12px;
    width: 20px;
    border-radius: 12px;
    display: inline-block;
    position: relative;
    top: 3px;
    margin-left: 2px;
    cursor: pointer;
    opacity: 0.2;
    line-height: 18px;
}
.toggle {
    background: #fff;
    height: 10px;
    width: 10px;
    border-radius: 10px;
    display: inline-block;
    position: relative;
    top: -2px;
    left: 1px;
}
.auto-load-label {
    font-size: 10pt;
    font-weight: 300;
    text-transform: initial;
    float: right;
    color: #aaa;
    line-height: 34px;
}
blockquote {
    font-style: italic;
    border-left: solid 2px #ddd;
    padding-left: 15px;
    margin-left: 25px;
}
figure {
    width: 100%;
    height: auto;
    margin: 0px;
    padding: 0px;
    margin-bottom: 20px !important;
}
figure img {
    width: 100%;
    height: auto;
    margin: 0px;
    padding: 0px;
}
figcaption {
    color: #555;
    font-size: 10pt;   
}
#disqus_thread {
    outline:0;
}
/* ----------- */

/* POLLS */
.wp-polls-form p strong {
    font-weight: 400;
}
.wp-polls-form p a {
    font-size: 9pt;
    text-decoration: none;
    color: #777;
    margin-top: 10px;
    display: block;
}
.wp-polls-form p a:hover {
    color: #2d3339;
}
.wp-polls-form .Buttons {
    width: 100%;
    padding: 9px !important;
    color: #2d3339;
    background: #fff !important;
    cursor: pointer;
    transition: background 0.3s ease;
    font-size: 10pt;
    border: solid 1px #2d3339;
    margin-bottom: 5px;
    -webkit-appearance: none;
    font-weight: bold;
    text-transform: uppercase;
    border-radius: 0;
}
.wp-polls-form .Buttons:hover {
    color: #fff;
    background: #2d3339 !important;
}
.wp-polls-ul {
    margin: 0px;
}
.wp-polls-ul li {
    border-bottom: 1px solid #eee !important;
    margin-bottom: 10px !important;
    padding-bottom: 12px !important
}
.wp-polls-ans p {
    margin: 0px;
}
/* ----------- */

/* SIDEBAR */
.side-box {
    margin-top: 30px;
    margin-bottom: 30px;
}
/* ----------- */

/* SIDE FEED */
.side-feed h2 {
    line-height: 15pt;   
}
.side-feed h2 a {
    font-size: 12pt;   
}
.side-feed .feed_article {
    margin-bottom: 15px;
    padding-bottom: 15px;   
}
/* ----------- */

/* NEWSLETTER */
.subscribe-form {
    width: auto;
    border: solid 1px #ddd;
    margin: 0px;
    height: 36px;
    background: #fff;
}
.newsletter-subscribe {
    border: 0;
    padding-left: 10px;
    line-height: 32px;
    width: calc(100% - 110px);
    float: left;
    outline: none;
    margin: 0px;
    background: none;
}
.newsletter-subscribe:focus {
    outline: none;
}
.newsletter-response {
    text-align: center;
    width: 100%;
    display: block;
    line-height: 34px;
    font-size: 9pt;
    color: #888;
}
.subscribe-class {
    border-radius: 0px;
    border: 0;
    background: #c33;
    color: #fff;
    line-height: 36px;
    float: right;
    padding: 0px 15px;
    margin: 0px;
    height: 36px;
    font-size: 9pt;
    font-weight: bold;
}
.subscribe-class:hover {
    cursor: pointer;
    background: #a21a1a;
}
.article-top-newsletter {
    float: right;   
    width: 295px;
}
.article-bottom-newsletter {
    margin-top: 20px;
}
.article-bottom-newsletter .title {
    color: #2d3339;
    text-decoration: none;
    font-size: 16pt;
    font-weight: 400;
    margin-bottom: 10px;
}
.feed-newsletter {
    border-bottom: solid 1px #eee;
    padding-bottom: 20px;
    margin-bottom: 20px;
    width: 100%;
}
.feed-newsletter .title {
    color: #2d3339;
    text-decoration: none;
    font-size: 16pt;
    font-weight: 400;
    margin-bottom: 10px;
}
.follow-subscribe {
    width: 100%;
    margin-top: 20px;
}
.top-subscribe {
    float: left;
    margin-left: 30px;
    width: 100%;
    max-width: 210px;
    margin-top: 12px;
}
.float-newsletter-bar {
    background: #c33;
    padding: 15px 0px;
    color: #fff;
    position: fixed; 
    bottom: -100px;
    z-index: 11;
    width: 100%;
}
.float-newsletter-bar .newsletter-form {
    max-width: 1020px;
    width: 100%;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}
.float-newsletter-bar form {
    width: 100%;
}
.float-newsletter-bar .newsletter-caption {
    line-height: 36px;
    width: 50%;
}
.float-newsletter-bar .close-newsletter {
    cursor: pointer;
    line-height: 36px;
    margin-left: 5px;
    padding: 0px 15px;
}
.grecaptcha-badge {
    bottom: 80px !important;
}
/* ----------- */

/* CATEGORY PAGE */
.page-title {
    text-align: center;
    border-bottom: solid 3px #eee;
    padding: 20px;
}
/* ----------- */

/* Next and Previous Article Box */
#next-article { border: solid 1px #ddd; cursor: pointer; position: fixed; top: 75%; right: 0px; height: 100px; z-index: 99; background: #fcfcfc; }
.next-arrow { position: absolute; background: #fafafa; height: 102px; right: -1px; top: -1px; border-left: solid 1px #ddd; z-index: 4; }
.next-arrow img { margin-top: 32px; padding: 8px; }
.next-article-link { margin-right: -280px; }
.next-article-link .next-span { z-index: 2; width: 80px; position: absolute; bottom: 5px; left: 109px; border-top: solid 1px #ddd; color: #666; font-size: 9pt; }
#previous-article { border: solid 1px #ddd; cursor: pointer; position: fixed; top: 75%; left: 0px; height: 100px; z-index: 99; background: #fcfcfc; }
.previous-arrow { position: absolute; background: #fafafa; height: 102px; left: -3px; top: -1px; border-right: solid 1px #ddd; z-index: 4; }
.previous-arrow img { margin-top: 32px; padding: 8px; -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); }
.previous-article-link { margin-left: -291px; }
.previous-article-link .previous-span { z-index: 2; width: 100px; position: absolute; bottom: 5px; right: 179px; border-top: solid 1px #ddd; color: #666; font-size: 9pt; }
.next-previous-article img { height: 100px; width: auto; margin-left: -25px; }
.next-previous-article .the-image { width: 100px; overflow: hidden; height: 100px; float: left; }
.next-previous-article .the-text { font-size: 11pt; color: #263034; font-weight: 600; line-height: 14pt;width: 170px; display: block; float: left; padding: 7px 10px 0px 10px; z-index: 3; position:relative; background: #fcfcfc; }
.next-previous-article i { width: 30px; text-align: center; line-height: 100px; }
/* ----------- */

/* MyBroadband Table Styling */
.mybb_table { width: 100%; overflow-y: hidden; -ms-overflow-style: -ms-autohiding-scrollbar; -webkit-overflow-scrolling: touch; }
.mybb_table table {font-size: 12px; width: 100%; border-collapse: collapse; }
.mybb_table tr { border-bottom: solid 1px #ddd; }
.mybb_table th { border-bottom: solid 3px #D9D9D9; color: #fff; font-weight: bold; background: #2d333a; text-align: left; }
.mybb_table table { border-bottom: solid 3px #ddd; }
.mybb_table table ul li { font-size: 12px !important; color: #364444 !important; line-height: 16px !important; }
.mybb_table table ul { padding-left: 12px !important; }
.mybb_table table td p { font-size: 12px; line-height: 16px; }
/* ----------- */

/* Rotate element */
.rotate-0 {
    transition: all 0.2s ease-in-out;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    transform: rotate(0deg);
}
.rotate-180 {
    transition: all 0.2s ease-in-out;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    transform: rotate(180deg);
}
/* ----------- */

/* Responsive first step */
@media screen and (max-width: 1010px) {
    .site { width: auto; padding: 0px 15px; overflow: hidden; border: none; }
    .site-inner { width: 700px; margin: 0 auto; }
    #main { margin: 0px; margin-top: 40px; }
    .feature_article_container { margin: 0px; padding-top: 0px; }
    .feature_article { margin: 0px; width: calc(100% + 30px); width: -o-calc(100% + 30px); width: -webkit-calc(100% + 30px); width: -moz-calc(100% + 30px); margin-left: -15px; float: none; margin-bottom: 15px; }
    .feature_article .post-thumbnail { height: auto; line-height: 0px; }
    .feature_article .post-thumbnail img { margin-top: 0px; }
    .ad { text-align: center; }
    .feed_leaderboard .ad { width: 300px; margin: 0 auto; }
    .feed_article_container { width: auto; float: none; }
    .feed_article .post-thumbnail { display: block; width: 120px; height: 80px; float: left; overflow: hidden; margin-right: 15px; min-height: 0px; }
    .feed_article .post-thumbnail img { height: 100%; width: auto; margin-top: 0px; }
    .feed_article header { padding-left: 135px; }
    .row_article_container { width: auto; float: none; display: block; margin: 0px 0px 20px; }
    .row_article_container .row_article { width: 100%; }    
    .below_row_article_container { width: 100%; display: block; }
    .below_row_article_container .row_article { width: 100%; }
    .row_article .post-thumbnail { display: block; width: 120px; height: 80px; float: left; overflow: hidden; margin-right: 15px; min-height: 0px; }
    .row_article .post-thumbnail img { height: 100%; width: auto; margin-top: 0px; margin-left: 0px; }
    .row_article header { position: inherit;  padding: 0px; padding-left: 135px; }
    .row_article { overflow: auto; padding-bottom: 20px; border-bottom: solid 1px #eee; margin-bottom: 20px; }
    .feed_artice_side { float: none; width: 100%; }
    #wallpaper_ad { display: none; }
    .site-footer { width: auto;}
    .site-footer .site-info { padding: 20px 15px; }
    .site-footer .footer-sub-menu { display: none; }
    .site-branding { display: none; }
    .masthead { display: none; }
    .top-bar { display: none; }
    .menu { display: none; }
    .entry-title { line-height: 13pt; }
    .entry-title a { font-size: 13pt; line-height: 13pt; }
    .meta_date { margin-top: 3px; font-size: 10pt; }
    .category-caption { margin-bottom: 3px; font-size: 10pt; }
    .side-feed h2 { line-height: 13pt; }
    .mobile-footer-menu { display: block; }
    .mobile-site-header { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; }
    .article-top-bar { display: none; }
    .share-hide { display: none; }
    .page-title { font-size: 15pt; }
    .type-page { padding-top: 40px; }
    .float-newsletter-bar .newsletter-caption { display: none;}
    .float-newsletter-bar form { margin-left: 15px;}
    .the-post { width: auto; float: none; padding: 20px 0px; border: none; z-index: 8; }
    .the-post .post-thumbnail img { width: 112%; margin-left: -6%; height: auto; }
    .single-side { width: 100%; float: none; }
    .forum_click { display: none; }
    .social-section { display: none; }
    .next-previous-article { display: none; }
    
    .main-side-ad { margin-bottom: 20px; display: none; }
}

/* Responsive second step */
@media screen and (max-width: 710px) {
    .site-inner { width: auto; }
}

/*Footer logos responsiveness*/
@media screen and (max-width: 768px) {
    .footer-logos-inner {
        width: 100%;
    }
    .footer-logos-three-columns .footer-logos-column {
        width: 100%;
    }
    .footer-logos img {
        padding: 25px 0px;
        width: auto;
    }
}
