/*
Theme Name: Top of the Hour 26
Theme URI: http://hbsaradio.com
Description: A responsive theme for a radio station built upon Grumby Framework, hastily updated in 2026.
Author: Internal
Author URI: http://hbsaradio.com
Version: 2
Tags: radio
License:
License URI:

It's almost the top of the hour, and it's time to look at the CSS. Coming up inside the next hour, we'll be wondering how wonky this code is and the new from Emile Sande. Well, she gets everywhere else...
*/

/*Custom Styles*/
.container.header {
    background: #0f0f0f;
}

.container.header.records {
    background: #0f0f0f url("images/body-bg-tablet.jpg") no-repeat 75% 0%;
    min-height: 150px;
}

.logo a {
    color: #dc143c;
}

.logo a {
    text-align: left;
    float: left;
    width: 160px;
    height: 150px;
    margin: 20px 0 10px 0;
    background: transparent url("images/logo.png") no-repeat;
    text-indent: -9999px;
    /* -- Aye, it's cheesy, but it links with the yinyl/records theme.. */
    -webkit-transition-duration: 1.6s;
    -moz-transition-duration: 1.6s;
    -o-transition-duration: 1.6s;
    transition-duration: 1.6s;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    transition-property: transform;
    overflow: hidden;
}

.logo a:hover {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
}

.on-air-now {
    text-align: right;
    float: right;
    width: 35%;
    margin: 40px 0 15px 0;
}

.on-air-now p {
    color: #fff;
    font-weight: bold;
    line-height: 120%;
    font-size: 1.7em;
    letter-spacing: -1px;
    text-align: right;
    margin: 1px 0 10px 0;
}

.on-air-now .btn {
    opacity: 0.5;
    transition: opacity 0.9s ease-in-out;
    -moz-transition: opacity 0.9s ease-in-out;
    -webkit-transition: opacity 0.9s ease-in-out;
}

.on-air-now .btn:hover {
    opacity: 1;
    transition: opacity 0.4s ease-in-out;
    -moz-transition: opacity 0.4s ease-in-out;
    -webkit-transition: opacity 0.4s ease-in-out;
}

.on-air-now span {
    /*color: #afafaf;*/
    color: #fff;
    background-color: #dc143c;
    font-weight: bold;
    font-size: 0.8rem;
    /*display: block;*/
    margin: 10px 0 0px 0;
    padding: 1px 3px;
    border-radius: 3px;
}

.on-air-now img {
    float: right;
    margin: 0 0 40px 20px;
    border: 2px solid #fff;
}

.navbar ul li.current_page_item>a,
.navbar ul li.current_page_parent>a,
.navbar ul li.current_page_ancestor>a {
    color: #fff;
    background: #262626;
}

.navbar ul li ul li.current_page_item>a {
    color: #262626;
    background-color: #fff;
}

.navbar ul li.current_page_item>a {
    color: #fff;
}

.container.footer {
    background: #efefef url("images/footer-bg.jpg") no-repeat 75% 100%;
    padding-bottom: 30px;
}

@media only screen and (max-width: 767px) {
    body .container.footer {
        background: #efefef url("images/footer-bg.jpg") no-repeat 85% 100%;
        padding-bottom: 70px;
    }
}

.home-presenters {
    margin: 15px 0 10px 0;
    padding-top: 20px;
    border-top: 2px solid #e4e4e4;
}

@media only screen and (max-width: 767px) {
    body .container .home-presenters {
        margin: 10px 0;
        padding-bottom: 10px;
        padding-top: 18px;
        border-top: 2px solid #e4e4e4;
    }

    /*--close 767*/
}

.home-presenters img {
    border-radius: 3%;
}

.home-presenters ul.presenters li {
    float: left;
    width: 12.5%;
    padding: 0 1.33% 0 0;
}

@media only screen and (max-width: 767px) {
    .home-presenters ul.presenters li {
        float: left;
        width: 25%;
        padding: 0 2% 0 0;
    }
}

.home-presenters ul.presenters li:last {
    padding: 0;
}

.row.featured_pages {
    margin: 12px 0 0 0;
    padding-top: 18px;
    border-top: 2px solid #e4e4e4;
}

@media only screen and (max-width: 767px) {
    body .row.featured_pages {
        margin: 5px 0 0 0;
        padding-top: 20px;
        border-top: 2px solid #e4e4e4;
    }

    /*--close 767*/
}

.row.recent_blog_posts {
    margin-top: 10px;
    margin-bottom: 0px;
    border-top: 2px solid #e4e4e4;
    padding-top: 20px;
}

@media only screen and (max-width: 767px) {
    body .container .recent_blog_posts {
        margin-top: 12px;
        margin-bottom: 0px;
        border-top: 2px solid #e4e4e4;
        padding-top: 20px;
    }

    /*--close 767*/
}

.socialmedia {
    border-top: 2px solid #e4e4e4;
    border-radius: 0 0 2px 2px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

@media only screen and (max-width: 1160px) {
    body .row.socialmedia {
        border-top: 2px solid #e4e4e4;
        border-radius: 0 0 2px 2px;
        padding-top: 10px;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }
}

@media only screen and (max-width: 767px) {
    body .container .socialmedia {
        border-top: 2px solid #e4e4e4;
        border-radius: 0 0 2px 2px;
        padding-top: 10px;
        padding-bottom: 10px;
        margin-bottom: 10px;
    }
}

.socialmedia a {
    padding: 2px 1px 2px 0;
    cursor: pointer;
    opacity: 0.5;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
}

.socialmedia a:hover {
    opacity: 1;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
}

.socialmedia .credit a {
    /*subdued credit */
    text-indent: -9999px;
    background: transparent url(images/icons.png) no-repeat 0 -80px;
    width: 91px;
    height: 10px;
    display: block;
    margin-top: 6px;
    padding: 1px 0 3px 0;
    float: right;
}

.socialmedia-share a {
    width: 20px;
    height: 20px;
    text-indent: -9595px;
    display: block;
    background-image: url(images/icons.png);
    float: left;
    margin-right: 7px;
}

.socialmedia-share a:hover {}

.socialmedia-share a.facebook {
    background-position: 0 0;
}

.socialmedia-share a.twitter {
    background-position: -80px 0;
}

.socialmedia-share a.google-plus {
    background-position: -160px 0;
}

.socialmedia-share a.delicious {
    background-position: -120px -40px;
}

.socialmedia-share a.stumbleupon {
    background-position: -80px -40px;
}

.socialmedia-share a.rss {
    background-position: 0px -40px;
}

.terms {
    text-align: right;
}

form h6.commentspolicy span {
    background-position: -280px -40px;
    background-image: url(images/icons.png);
    background-repeat: no-repeat;
    height: 20px;
    width: 30px;
    margin: 8px 0 0 4px;
    display: block;
    float: left;
}

span.read-more {
    display: block;
    margin: 7px 0 3px 0;
    font-size: 0.9rem;
}

span.read-more a,
a.more-link {
    /*background: #dc143c;*/
    background: #efefef;
    color: #262626;
    padding: 2px 6px 2px 6px;
    font-size: 0.9em;
    border-bottom: 2px solid #e4e4e4;
}

span.read-more a i[class^="icon-"],
i[class*=" icon-"] {
    margin: 0;
}

span.read-more a:hover,
a:hover.more-link {
    text-decoration: none;
    color: #fff;
    background-color: #dc143c;
    border-bottom: 2px solid #ef4c6d;
}

/*Breadcrumb*/
.container.breadcrumb .row {
    border-bottom: 1px solid #efefef;
    padding: 0 0 5px 0;
    margin-bottom: 15px;
    font-size: 12px;
    font-size: 0.9rem;
    color: #9c9c9c;
}

.container.breadcrumb span.delimiter {
    padding: 0 3px;
}

.container.breadcrumb a {
    padding: 0 3px;
    color: #9c9c9c;
}

/*Sidebar Nav*/
@media only screen and (max-width: 767px) {
    body .sidenav {
        display: none;
    }

    /*--close 767*/
}

ul.sid h4 {
    border-bottom: 1px solid #efefef;
    border-bottom: 2px solid #efefef;
}

ul.sid ul {
    margin: 0 0 2em 0;
}

ul.sid ul ul {
    margin: 0 0 0 0.7em;
}

ul.sid ul li {
    padding: 0;
}

ul.sid ul li a {
    display: block;
    border-bottom: 1px solid #efefef;
    padding: 0.4em 0 0.3em 0;
}

ul.sid ul li.current_page_item a {
    color: #262626;
}

/*CTA Special*/
.cta {
    padding: 10px;
    width: 85%;
    border-radius: 5%;
    text-align: center;
    margin: 10px 0 20px 0;
    box-shadow: 1px 1px 10px #9c9c9c;
}

.cta p {
    margin: 0.3em 0;
}

.cta.yellow {
    background-color: #fbba3a;
    border: 1px solid #de960a;
}

.cta.red {
    background-color: #ef4c6d;
    border: 1px solid #dc143c;
}

.cta.blue {
    background-color: #b9ddff;
    border: 1px solid #42a2ff;
}

/*Gateway*/
ul.gateway h5 {
    padding: 0em 0 0.5em 0;
    line-height: 1.2em;
}

ul.gateway li a img {
    border-radius: 5%;
    border-bottom: 2px solid #262626;
}

ul.gateway li {
    margin: 10px 0;
}

/*Tagcloud*/
ul.sid div.tagcloud a {
    padding: 2px 4px 2px 4px;
    display: inline;
    border: none;
    background-color: #efefef;
}

ul.sid div.tagcloud a:hover {
    background-color: #dc143c;
    color: #fff;
}

ul.sid div.tagcloud {
    margin: 0.5em 0 2em 0;
}

/*Schedule Tables*/
table {
    width: 100%;
    border-top: 1px solid #dc143c;
    border-bottom: 1px solid #dc143c;
}

table thead tr th {
    text-align: left;
    font-weight: bold;
    padding: 0px 3px;
}

table tr {
    background-color: #efefef;
    border: 0;
    font-weight: normal;
}

table tr.odd {
    background-color: #fff;
}

table tr td {
    padding: 5px 3px;
    border: 0;
}

#comments {
    margin-top: 15px;
    padding-top: 15px;
}

#comments ol {
    list-style: none;
    margin: 0;
}

#comments ol li {
    border-top: 1px solid #afafaf;
    padding: 15px 0 0 0;
    margin-bottom: 5px;
}

#comments form {
    border-top: 1px solid #afafaf;
    border-bottom: 3px solid #afafaf;
    margin: 20px 0;
    padding: 15px 5px 15px 5px;
    background: #efefef;
}

#comments form input,
#comments form textarea,
#comments form label {
    width: 96%;
    max-width: 350px;
    margin: 0 2%;
    padding: 3px 0;
}

#comments p.notice {
    border-top: 1px solid #42a2ff;
    border-bottom: 1px solid #42a2ff;
    padding: 10px 5px;
    background-color: #b9ddff;
    text-align: center;
}

#comments p.author {
    margin-bottom: 5px;
    font-weight: bold;
    font-size: 1.1em;
}

p.blog-post-details {
    text-transform: uppercase;
    font-size: 0.8em;
    color: #afafaf;
    text-align: right;
    margin-bottom: 3px;
}

ol.comments_list {
    background-color: #e4e4e4;
    padding: 10px;
}

form h6.commentspolicy span {
    background-position: -280px -40px;
    background-image: url(images/icons.png);
    background-repeat: no-repeat;
    height: 20px;
    width: 30px;
    margin: 8px 0 0 4px;
    display: block;
    float: left;
}

/* Stupid WordPress Lazy Load Code Fix */
.home-presenters img,
.featured_pages img {
    contain-intrinsic-size: auto 100px !important;
}