﻿body
{
    background-color: #f2f1eb;
}
.bottom-right-text {
    content: "";
    position: absolute;
    bottom: .8em;
    right: 1.2em;
    color: #820000;
    font-family: "Source Serif Pro";
    font-size: .9em;
    letter-spacing: .05em;
    text-transform: uppercase
}

.small-square {
    color: #5f574f;
    position: absolute;
    top: 0;
    margin: 0 0 0 -15px;
    content: '\25AA'
}

@media (max-width:767px)
{
    .h3, h3 {
        font-size: 1.1875em;
        line-height: 1.36842105em
    }
}

@media (min-width:768px) and (max-width:991px) 
{
    .h3, h3 {
        font-size: 1.375em;
        line-height: 1.27272727em
    }
}

@media (min-width:992px) 
{
    .h3, h3 {
        font-size: 1.5em;
        line-height: 1.20833333em
    }
}

@media (max-width:767px) {
    .h4, h4 {
        font-size: 1.0625em;
        line-height: 1.29411765em
    }
}





.external-link:after
{
    content: "\f08e" !important;
    font-family: FontAwesome !important;
    font-size: .6em !important;
    font-weight: 200 !important;
    margin-left: .6em !important;
    vertical-align: middle !important
}

.see-all-link:after 
{
    content: "\f138";
    font-family: FontAwesome;
    font-size: .7125em;
    margin-left: .4em;
    vertical-align: middle
}

div:focus {
    outline: 0
}

dl {
    margin-top: 5px
}

hr {
    border-color: #d5d0c0
}

label {
    font-weight: 600
}

input::-webkit-input-placeholder {
    color: rgba(0,0,0,.6) !important
}

input::-moz-placeholder {
    color: #000 !important
}

input:-moz-placeholder {
    color: #000 !important
}

input:-ms-input-placeholder {
    color: rgba(0,0,0,.6) !important
}

.topics-buttons a {
    color: #4d4f53
}

    .topics-buttons a .btn-category {
        margin-bottom: 5px
    }

.abs-left, .abs-right {
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%)
}

.abs-left {
    left: 10px
}

.abs-right {
    right: 10px
}

.btn {
    line-height: 1;
    padding: 0;
    font-size: .9375em
}

    .btn a {
        display: block;
        width: 100%;
        height: 100%;
        padding: .75em;
        font-weight: 400;
        text-transform: capitalize;
        text-decoration: none
    }

        .btn a:active, .btn a:focus, .btn a:hover {
            text-decoration: none
        }

a.btn {
    padding: .5em .75em;
    font-weight: 400;
    text-decoration: none
}

.modal .btn, input.btn {
    padding: .5em .75em
}

.btn-primary {
    background-color: #8c1515;
    border-color: #761212;
    color: #fff
}

    .btn-primary:active, .btn-primary:focus, .btn-primary:hover {
        background-color: #a21818;
        border-color: #761212;
        color: #fff
    }

    .btn-primary a {
        color: #fff
    }

        .btn-primary a:active, .btn-primary a:focus, .btn-primary a:hover {
            background-color: #a21818;
            border-color: #761212;
            color: #fff
        }

.btn-one {
    background-color: #009b76;
    border-color: #008263;
    color: #fff
}

    .btn-one:active, .btn-one:focus, .btn-one:hover {
        background-color: #00b489;
        border-color: #008263;
        color: #fff
    }

    .btn-one a {
        color: #fff
    }

        .btn-one a:active, .btn-one a:focus, .btn-one a:hover {
            background-color: #00b489;
            border-color: #008263;
            color: #fff
        }

.btn-two {
    background-color: #007c92;
    border-color: #006679;
    color: #fff
}

    .btn-two:active, .btn-two:focus, .btn-two:hover {
        background-color: #0092ab;
        border-color: #006679;
        color: #fff
    }

    .btn-two a {
        color: #fff
    }

        .btn-two a:active, .btn-two a:focus, .btn-two a:hover {
            background-color: #0092ab;
            border-color: #006679;
            color: #fff
        }

.btn-three {
    background-color: #4d5357;
    border-color: #414649;
    color: #fff;
    margin-bottom: 10px
}

    .btn-three:active, .btn-three:focus, .btn-three:hover {
        background-color: #596065;
        border-color: #414649;
        color: #fff
    }

    .btn-three a {
        color: #fff
    }

        .btn-three a:active, .btn-three a:focus, .btn-three a:hover {
            background-color: #596065;
            border-color: #414649;
            color: #fff
        }

.btn-four {
    background-color: #8c1515;
    border-color: #761212;
    color: #fff
}

    .btn-four:active, .btn-four:focus, .btn-four:hover {
        background-color: #a21818;
        border-color: #761212;
        color: #fff
    }

    .btn-four a {
        color: #fff
    }

        .btn-four a:active, .btn-four a:focus, .btn-four a:hover {
            background-color: #a21818;
            border-color: #761212;
            color: #fff
        }

.btn-su-alert {
    background-color: #3f3c30;
    border-color: #312e25;
    color: #fff
}

    .btn-su-alert:active, .btn-su-alert:focus, .btn-su-alert:hover {
        background-color: #4d4a3b;
        border-color: #312e25;
        color: #fff
    }

    .btn-su-alert a {
        color: #fff
    }

        .btn-su-alert a:active, .btn-su-alert a:focus, .btn-su-alert a:hover {
            background-color: #4d4a3b;
            border-color: #312e25;
            color: #fff
        }

.btn-light {
    background-color: transparent;
    border-color: #4d4f53;
    color: #2e2d29
}

    .btn-light:active, .btn-light:focus, .btn-light:hover {
        background-color: #4d4f53;
        border-color: #4d4f53;
        color: #fff
    }

    .btn-light a {
        color: #2e2d29
    }

        .btn-light a:active, .btn-light a:focus, .btn-light a:hover {
            background-color: #4d4f53;
            border-color: #4d4f53;
            color: #fff
        }

.btn-category {
    background-color: silver;
    border-color: silver;
    color: #2e2d29;
    margin-bottom: 5px;
    margin-right: 2px
}

    .btn-category:active, .btn-category:focus, .btn-category:hover {
        background-color: #4d4f53;
        border-color: silver;
        color: #fff
    }

    .btn-category a {
        color: #2e2d29
    }

        .btn-category a:active, .btn-category a:focus, .btn-category a:hover {
            background-color: #4d4f53;
            border-color: silver;
            color: #fff
        }

.btn-u {
    display: inline-block;
    position: relative;
    padding: 8px 13px;
    border: 0;
    cursor: pointer;
    background: #d5d0c0;
    color: #5f574f;
    font-size: .9375em;
    text-decoration: none;
    text-shadow: none
}

    .btn-u:hover {
        color: #fbfbf9;
        background: #3f3c30;
        text-decoration: none;
        -webkit-transition: all .4s ease-in-out;
        -o-transition: all .4s ease-in-out;
        transition: all .4s ease-in-out
    }

    .btn-u i {
        font-size: 1.13333em
    }

.small-square {
    color: #5f574f;
    position: absolute;
    top: 0;
    margin: 0 0 0 -15px;
    content: '\25AA'
}

.color-red {
    color: #820000
}

.uppercase {
    text-transform: uppercase
}

#hero-image img {
    display: block;
    max-width: 100%;
    height: auto
}

.info-box {
    margin: 0 15px 30px;
    display: table
}

    .info-box .icon-container, .info-box .text-container {
        display: table-cell;
        vertical-align: top;
        min-width: 65px
    }

    .info-box .icon-container {
        text-align: center
    }

    .info-box .text-container {
        padding-left: 15px
    }

    .info-box .offset {
        padding-left: 65px
    }

    .info-box h2 {
        font-size: 1.125em;
        font-weight: 400;
        line-height: 1.2em;
        padding: 5px 0;
        text-transform: uppercase;
        color: #820000
    }

    .info-box ul {
        padding-left: 0;
        list-style: none
    }

        .info-box ul li {
            line-height: 1.1em;
            margin-bottom: 10px
        }

    .info-box dt {
        font-size: 1.1em
    }

        .info-box dt a, .info-box li a {
            text-decoration: none
        }

            .info-box dt a:active, .info-box dt a:hover, .info-box li a:active, .info-box li a:hover {
                text-decoration: underline
            }

.margin-bottom-5 {
    margin-bottom: 5px;
    clear: both
}

.margin-bottom-10 {
    margin-bottom: 10px;
    clear: both
}

.margin-bottom-20 {
    margin-bottom: 20px;
    clear: both
}

.margin-bottom-25 {
    margin-bottom: 25px;
    clear: both
}

.margin-bottom-30 {
    margin-bottom: 30px;
    clear: both
}

.margin-bottom-40 {
    margin-bottom: 40px;
    clear: both
}

.margin-bottom-50 {
    margin-bottom: 50px;
    clear: both
}

.margin-bottom-60 {
    margin-bottom: 60px;
    clear: both
}


ul.vbar {
    list-style: none;
    padding: 0
}

    ul.vbar li {
        display: inline-block;
        padding: 0 .5em;
        border-right: 1px solid #000
    }

        ul.vbar li:first-of-type {
            padding-left: 0
        }

        ul.vbar li:last-of-type {
            border-right: none
        }

.well {
    box-shadow: 0 0 8px #d5d0c0;
    border: medium none;
    border-radius: 0;
    padding: 20px;
    margin-bottom: 3em;
    background: #fff
}

    .well h2 {
        padding: 10px 0 4px;
        font-size: 1.2em;
        border-bottom: none;
        color: #820000
    }

    .well h3 {
        font-size: 1em;
        font-weight: 700
    }

    .well ul {
        list-style-type: square;
        list-style-image: url(../images/bullet.gif)
    }

        .well ul li {
            position: relative;
            margin-bottom: 7px;
            line-height: 1.1em
        }

    .well img {
        display: block;
        max-width: 100%;
        height: auto;
        background-color: rgba(0,0,0,0);
        margin-bottom: 6px;
        padding: 2px
    }

    .well.well-calendar-list h3 {
        display: inline-block;
        padding-right: 4px
    }

    .well.well-calendar-list ul {
        display: inline-block;
        padding: 0;
        list-style-type: none
    }

        .well.well-calendar-list ul li {
            display: inline-block;
            padding-right: 3px
        }

    .info-box .fa, .well .fa {
        color: #DAD7CB;
        margin: 0
    }

.embed-container {
    position: relative;
    padding-bottom: 56.25%;
    height: 0
}

    .embed-container iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%
    }

.media-attrib, .media-caption {
    font-family: 'Source Sans Pro',Arial,sans-serif;
    font-size: .9375em
}

.media-attrib {
    font-style: italic;
    text-align: right
}

p.media-attrib {
    margin-bottom: .25em
}

.media-caption {
    margin-top: .5em;
    line-height: 1.3em
}

p.media-caption {
    margin-bottom: 0
}

#story-banner p.media-caption {
    margin-bottom: 1em
}

@media (max-width:767px) {
    .pull-right.pull-right-wide p.media-caption {
        margin-bottom: 1em
    }
}

.mugshot .media-caption {
    text-align: center;
    margin-top: .6em
}

@media (max-width:767px) {
    .mugshot .media-caption {
        font-size: 1.0625em;
        line-height: 1.47058824em
    }
}

@media (min-width:768px) and (max-width:991px) {
    .mugshot .media-caption {
        font-size: 1em;
        line-height: 1.4375em
    }
}

@media (min-width:992px) and (max-width:1199px) {
    .mugshot .media-caption {
        font-size: 1.0625em;
        line-height: 1.58823529em
    }
}

@media (min-width:1200px) {
    .mugshot .media-caption {
        font-size: 1.0625em;
        line-height: 1.52941176em
    }
}

.media-caption .media-attrib {
    font-size: inherit
}

.mugshot .media-caption .media-attrib {
    display: block;
    text-align: center;
    font-size: 14px;
    font-size: 1.4rem
}

.headshot img, img.headshot {
    border-radius: 50%
}

.sidebar-margin {
    margin-left: 2em;
    margin-right: 2em
}

.sidebar-section h2 {
    color: #8c1515;
    font-family: 'Source Serif Pro','Times New Roman',Times,serif;
    font-size: 1.33333em;
    padding: 5px;
    margin-left: -5px;
    margin-bottom: .5em;
    border-bottom: 1px solid #d5d0c0
}

.sidebar-section p {
    color: #2e2d29;
    font-size: 1em;
    line-height: 1.2em;
    margin-top: .1em;
    margin-bottom: 1.4em
}

    .sidebar-section p.side-byline {
        color: #8c1515;
        font-size: .8em;
        font-weight: 600;
        text-transform: uppercase;
        margin-bottom: 0
    }

.sidebar-section .sidebar-icon {
    font-size: 12px
}

.page-section {
    margin-left: none;
}

.descriptor {
    font-size: .9em;
    font-weight: 600;
    letter-spacing: .04em;
    line-height: 1.5;
    margin-bottom: 4px;
    color: #5f574f
}


#content {
    margin-top: 3em;
    margin-bottom: 3em
}

aside a {
    color: #000;
    text-decoration: none
}

aside hr {
    margin: 0
}

.infobox {
    background-color: #fff;
    background-position: right bottom;
    background-repeat: no-repeat;
    min-height: 180px
}

.no-underline, .no-underline:hover {
    text-decoration: none
}

.card {
    border-top: none;
    border-left: none;
    background-color: #fff;
    padding: 0;
    position: relative;
    box-shadow: 0 0 8px #d5d0c0;
    min-height: 150px;
    margin-bottom:10px;
}

@media (max-width:767px) {
    .card {
        min-height: 150px
    }
}

@media (max-width:767px) {
    .large.card {
        padding-right: 1.2em
    }
}

.short.card {
    padding: 0 1.2em
}

.large.card img {
    width: 100%;
    height: auto;
    padding: 0;
    margin: 0
}

.full.card img {
    float: none;
    clear: both;
    width: 100%;
    height: auto;
    padding: 0;
    margin: 0
}

@media (max-width:767px) {
    .large.card img, .short.card img {
        width: 100px;
        height: 100px
    }
}

.story-supplement.card h2 {
    color: #8c1515;
    font-family: 'Source Serif Pro','Times New Roman',Times,serif;
    font-size: 1.5em;
    font-weight: 400;
    text-align: center;
    border-bottom: none
}

.full.card h3 {
    font-size: 2.1em
}

@media (min-width:992px) {
    .full.card h3 {
        font-size: 3.1em
    }
}

@media (max-width:767px) {
    .card h3 {
        font-size: 1.25em
    }
}

.full.card .teaser {
    font-size: 1.125em
}

@media (min-width:992px) {
    .full.card .teaser {
        font-size: 1.25em;
        line-height: 1.35em
    }
}

@media (min-width:992px) {
    .card .category {
        font-size: 1.2em
    }
}

.short.card .card-photo {
    margin-top: 1.5em;
    float: right;
    padding-left: 1em;
    padding-bottom: 1em
}

@media (max-width:767px) {
    .large.card .card-photo, .short.card .card-photo {
        margin-top: 1.5em;
        float: right;
        padding-left: 1em;
        padding-right: 0 !important
    }
}

@media (max-width:767px) {
    #top-story-1.card .card-photo {
        padding-top: 20px
    }
}

@media (max-width:767px) {
    .large.card .embed-responsive, .short.card .embed-responsive {
        padding-top: 1.5em
    }
}

@media (max-width:767px) {
    .large.card .embed-responsive .embed-responsive-item, .large.card .embed-responsive embed, .large.card .embed-responsive iframe, .large.card .embed-responsive object, .large.card .embed-responsive video, .short.card .embed-responsive .embed-responsive-item, .short.card .embed-responsive embed, .short.card .embed-responsive iframe, .short.card .embed-responsive object, .short.card .embed-responsive video {
        border-top: 20px solid #fff
    }
}

.card .card-content {
    padding: 1.2em;
    clear: both
}

@media (max-width:767px) {
    .card .card-content {
        clear: none
    }
}

.short.card .card-content {
    display: inline
}

.full.card .card-content {
    display: block;
    height: auto
}

@media (min-width:992px) {
    .full.card .card-content {
        padding: 2.4em
    }
}

.card .card-content p {
    font-family: 'Source Sans Pro',Arial,sans-serif;
    font-size: .9375em;
    font-weight: 400;
    padding: 0;
    margin: 0;
    line-height: 1.2857em;
    margin-bottom: 1em
}

    .card .card-content p:last-child {
        margin-bottom: 0
    }

.social.card .card-content p {
    text-align: left
}

.twitter.social.card .card-content p {
    font-size: 1.125em;
    text-align: center;
    line-height: 1.4444em
}

.card .card-content .meta {
    display: block;
    text-transform: uppercase;
    color: #820000;
    font-size: .8em;
    font-weight: 600;
    font-size: .8150em;
    line-height: 1.53846154em;
    margin-bottom: .46153846em
}

.card .card-content h3 {
    font-weight: 600;
    font-family: 'Source Serif Pro','Times New Roman',Times,serif;
    color: #000;
    margin: 0;
    margin-top: .2em;
    margin-bottom: .4em;
    padding: 0;
    font-size: 1.1275em;
    line-height: 1.10526316em;
    margin-bottom: .31578947em
}

@media (max-width:767px) {
    .card .card-content h3 {
        font-size: 1.25em
    }
}

.full.card .card-content h3 {
    font-size: 1.875em;
    line-height: 1.13333333em;
    margin-bottom: .2em
}

@media (min-width:992px) {
    .full.card .card-content h3 {
        font-size: 1.625em;
        line-height: 1.14285714em;
        margin-bottom: .14285714em
    }
}

.social.card .card-content h3 {
    font-family: 'Source Sans Pro',Arial,sans-serif;
    font-weight: 400;
    text-align: center
}

    .social.card .card-content h3:hover {
        text-decoration: underline
    }

.card .card-content a {
    text-decoration: none;
    color: inherit
}

.social.card .card-content a {
    color: #8c1515
}

.card .card-content a:hover {
    color: #8c1515;
    text-decoration: underline
}

.social.card .card-content a:hover {
    text-decoration: underline
}

.facebook.social.card .card-content > img, .twitter.social.card .card-content > img {
    padding-bottom: 1em
}

.social.card .card-content .social-img img {
    margin: auto
}

.instagram.social.card .card-content .social-img img {
    width: 200px
}

.social.card .card-content .actions {
    text-align: center;
    vertical-align: middle
}

    .social.card .card-content .actions a {
        display: inline-block;
        margin: 0 8px;
        background: url(../images/social_actions.png) no-repeat 0 0;
        background-size: 160px 61px;
        width: 23px;
        height: 16px;
        background-position: 0 0;
        background-position: var(--bgX) var(--bgY)
    }

.instagram.social.card .card-content .actions a {
    background-position-y: -46px;
    --bgY: -46px
}

.twitter.social.card .card-content .actions a {
    background-position-y: -22px;
    --bgY: -22px
}

.instagram.social.card .card-content .actions a.like {
    background-position-x: 0;
    --bgX: 0
}

.facebook.social.card .card-content .actions a.like {
    background-position-x: 1px;
    --bgX: 1px
}

.instagram.social.card .card-content .actions a.like:hover {
    background-position-x: -83px;
    --bgX: -83px
}

.facebook.social.card .card-content .actions a.like:hover {
    background-position-x: -82px;
    --bgX: -82px
}

.twitter.social.card .card-content .actions a.favorite {
    background-position-x: -60px;
    --bgX: -60px
}

    .twitter.social.card .card-content .actions a.favorite:hover {
        background-position-x: -143px;
        --bgX: -143px
    }

.social.card .card-content .actions a.comment {
    background-position-y: -46px;
    --bgY: -46px
}

.instagram.social.card .card-content .actions a.comment {
    background-position-x: -32px;
    --bgX: -32px
}

    .instagram.social.card .card-content .actions a.comment:hover {
        background-position-x: -115px;
        --bgX: -115px
    }

.twitter.social.card .card-content .actions a.reply {
    background-position-x: 0;
    --bgX: 0
}

    .twitter.social.card .card-content .actions a.reply:hover {
        background-position-x: -83px;
        --bgX: -83px
    }

.twitter.social.card .card-content .actions a.retweet {
    background-position-x: -28px;
    --bgX: -28px
}

    .twitter.social.card .card-content .actions a.retweet:hover {
        background-position-x: -111px;
        --bgX: -111px
    }

.facebook.social.card .card-content .actions a.share {
    background-position-x: -32px;
    --bgX: -32px
}

    .facebook.social.card .card-content .actions a.share:hover {
        background-position-x: -115px;
        --bgX: -115px
    }

.card.social .channel-icon {
    text-align: center
}

    .card.social .channel-icon a i {
        padding-top: 1.2em;
        color: #8a887d
    }

    .card.social .channel-icon a:hover {
        text-decoration: none
    }

.instagram.card.social .channel-icon a:hover {
    color: #125688
}

    .instagram.card.social .channel-icon a:hover i {
        color: #125688
    }

.facebook.card.social .channel-icon a:hover {
    color: #4767b1
}

    .facebook.card.social .channel-icon a:hover i {
        color: #4767b1
    }

.twitter.card.social .channel-icon a:hover {
    color: #55acee
}

    .twitter.card.social .channel-icon a:hover i {
        color: #55acee
    }

.card.social .channel-icon img {
    float: none !important
}

.story-supplement.card .story-supplement-content {
    padding: 1em
}

#bottom .card {
    margin-top: 1em
}

#skip a, #skip a:hover, #skip a:visited {
    position: absolute;
    left: 0;
    top: -500px;
    width: 1px;
    height: 1px;
    overflow: hidden
}

    #skip a:active, #skip a:focus {
        position: static;
        width: auto;
        height: auto;
        color: #fff
    }

#header {
    z-index: 999;
    padding: 12px 0 30px 0;
    background-color: #8c1515
}

#logo {
    border-right: 1px solid #f2f1eb;
    display: table-cell;
    float: none;
    margin: 0;
    padding: 0 10px 0 0;
    vertical-align: bottom
}

    #logo img {
        max-width: 160px
    }

#header a, #mainmenu a {
    text-decoration: none
}

#signature {
    display: table-cell;
    height: auto;
    vertical-align: bottom;
    padding-left: 10px
}

    #signature #site-name, #signature #site-slogan {
        font-family: inherit;
        text-rendering: optimizelegibility
    }

    #signature #site-name {
        color: #f2f1eb;
        font-size: 27px;
        font-weight: 300;
        line-height: 1em;
        margin-bottom: -3px
    }

        #signature #site-name a {
            color: #f2f1eb;
            text-decoration: none;
            font-weight: 300
        }

        #signature #site-name #site-name-2 {
            display: none
        }

    #signature #site-slogan {
        display: none
    }

body.two-line-signature #signature #site-name span {
    font-size: .7em;
    line-height: 1.1em
}

    body.two-line-signature #signature #site-name span#site-name-2 {
        display: block
    }

body.site-slogan #signature #site-slogan {
    display: block;
    margin-bottom: -4px;
    margin-top: 4px
}

    body.site-slogan #signature #site-slogan a {
        color: #f2f1eb;
        font-size: 18px;
        font-weight: 300;
        font-style: italic;
        line-height: 1.2em
    }

#nav-search {
    min-height: 30px;
    position: relative;
    display: inline-block;
    width: 260px;
    width: calc(100% - 70px)
}

@media (min-width:768px) {
    #nav-search {
        float: right;
        margin: -60px 0 0 0;
        max-width: 320px
    }
}

#search-form {
    position: relative
}

#search-field {
    height: 30px;
    width: 100%;
    color: #5f574f;
    padding: 4px 33px 4px 10px;
    border: 2px solid #e9e6df;
    background-color: #fbfbf9;
    border-radius: 8px;
    font-size: .9375em;
    -moz-appearance: none;
    -webkit-appearance: none
}

#search-type input:focus {
    outline: 2px solid #0098db
}

#search-form #search-btn {
    cursor: pointer;
    border: none;
    height: 26px;
    width: 26px;
    background-color: #fbfbf9;
    position: absolute;
    right: 5px;
    top: 2px;
    font-size: .9375em
}

    #search-form #search-btn i {
        color: #5f574f
    }

    #search-form #search-btn:hover {
        opacity: .6
    }

    #search-form #search-btn:focus {
        outline: 2px solid #0098db
    }

#mainmenu {
    font-family: 'Source Sans Pro',Arial,sans-serif;
    background-color: #fff;
    border-bottom: 1px solid #cdccc7;
    -webkit-box-shadow: 0 -4px 8px -2px rgba(0,0,0,.2);
    box-shadow: 0 -4px 8px -2px rgba(0,0,0,.2)
}

@media (max-width:767px) {
    #mainmenu {
        position: relative;
        width: 100%
    }
}

@media (max-width:767px) {
    #mainmenu.fixed {
        position: fixed;
        top: -16em;
        z-index: 100;
        width: 100%;
        display: block;
        -webkit-transition: all .5s cubic-bezier(1,.01,1,.76);
        -o-transition: all .5s cubic-bezier(1,.01,1,.76);
        transition: all .5s cubic-bezier(1,.01,1,.76)
    }
}

@media (max-width:767px) {
    #mainmenu.fixed.visible {
        top: 0;
        -webkit-box-shadow: 1px 1px 5px 1px rgba(0,0,0,.1);
        box-shadow: 1px 1px 5px 1px rgba(0,0,0,.1);
        -webkit-transition: all .5s cubic-bezier(0,.8,.33,1);
        -o-transition: all .5s cubic-bezier(0,.8,.33,1);
        transition: all .5s cubic-bezier(0,.8,.33,1)
    }
}

#mainmenu ul {
    font-family: inherit;
    padding-left: 0;
    font-size: 1em
}




#su-wrap {
    min-height: 100%;
    overflow-x: hidden
}

#su-content {
    overflow: visible;
    padding-bottom: 120px
}







@media (max-width:767px) {
    .size-detect-xs {
        display: inline
    }

    .auto-clear .col-xs-1:nth-child(12n+1) {
        clear: left
    }

    .auto-clear .col-xs-2:nth-child(6n+1) {
        clear: left
    }

    .auto-clear .col-xs-3:nth-child(4n+1) {
        clear: left
    }

    .auto-clear .col-xs-4:nth-child(3n+1) {
        clear: left
    }

    .auto-clear .col-xs-6:nth-child(odd) {
        clear: left
    }

    body {
        padding: 0
    }

    #header .container {
        padding: 0 10px
    }

    #body .container {
        padding: 0 20px
    }

        #body .container:first-child {
            padding: 0
        }

    #logo {
        max-width: 300px
    }

    #search-form .btn-search {
        width: 22px;
        height: 22px;
        top: 5px;
        right: 5px
    }

    #footer .container {
        padding: 0 20px !important
    }

    #footer ul.footer-list {
        margin-bottom: 25px
    }

        #footer ul.footer-list li {
            font-size: 1.3em;
            margin-bottom: 10px
        }

    #footer .block h3 {
        border-bottom: 1px solid #8c1515;
        margin-bottom: 10px;
        padding-bottom: 5px;
        font-size: 1.1em
    }

    #footer p.copyright {
        padding-top: 25px
    }

    #global-footer p.copyright {
        padding: 15px 0
    }

    #global-footer #termsofuse {
        display: block
    }
}



@media (min-width:768px) {
    #global-footer .clear {
        clear: none
    }

    #global-footer #bottom-logo {
        margin: -5px 0 10px
    }

    #global-footer #bottom-text {
        margin-top: 2px
    }

        #global-footer #bottom-text ul li {
            width: auto;
            margin: 0 15px 3px 0;
            padding: 0;
            float: none;
            clear: left;
            display: inline-block
        }

    #global-footer p.copyright {
        text-align: left
    }
}

@media (min-width:768px) and (max-width:991px) {
    .size-detect-sm {
        display: inline
    }

    .auto-clear .col-sm-1:nth-child(12n+1) {
        clear: left
    }

    .auto-clear .col-sm-2:nth-child(6n+1) {
        clear: left
    }

    .auto-clear .col-sm-3:nth-child(4n+1) {
        clear: left
    }

    .auto-clear .col-sm-4:nth-child(3n+1) {
        clear: left
    }

    .auto-clear .col-sm-6:nth-child(odd) {
        clear: left
    }

    #footer-3 {
        clear: both
    }
}

@media (min-width:992px) {
    .two-column {
        -moz-column-count: 2;
        -moz-column-gap: 20px;
        -webkit-column-count: 2;
        -webkit-column-gap: 20px;
        column-count: 2;
        column-gap: 20px
    }


}

@media (min-width:992px) and (max-width:1199px) {
    .size-detect-md {
        display: inline
    }

    .auto-clear .col-md-1:nth-child(12n+1) {
        clear: left
    }

    .auto-clear .col-md-2:nth-child(6n+1) {
        clear: left
    }

    .auto-clear .col-md-3:nth-child(4n+1) {
        clear: left
    }

    .auto-clear .col-md-4:nth-child(3n+1) {
        clear: left
    }

    .auto-clear .col-md-6:nth-child(odd) {
        clear: left
    }
}

@media (min-width:1200px) {
    .size-detect-lg {
        display: inline
    }

    .auto-clear .col-lg-1:nth-child(12n+1) {
        clear: left
    }

    .auto-clear .col-lg-2:nth-child(6n+1) {
        clear: left
    }

    .auto-clear .col-lg-3:nth-child(4n+1) {
        clear: left
    }

    .auto-clear .col-lg-4:nth-child(3n+1) {
        clear: left
    }

    .auto-clear .col-lg-6:nth-child(odd) {
        clear: left
    }
}

/* B.Tech CSE Data Science and AI page polish */
#btechAiBlog {
    --bt-primary: #470052;
    --bt-primary-dark: #27002f;
    --bt-accent: #c8102e;
    --bt-ink: #172033;
    --bt-text: #344054;
    --bt-muted: #667085;
    --bt-line: #d9e2ef;
    --bt-soft: #f6f8fb;
    --bt-panel: #ffffff;
}

#btechAiBlog.section {
    background: linear-gradient(180deg, #ffffff 0, #ffffff 260px, #fff 260px, var(--bt-soft) 100%);
}

#btechAiBlog .left-section,
#btechAiBlog .intro-section,
#btechAiBlog .form-box {
    border: 1px solid var(--bt-line) !important;
    border-radius: 8px !important;
    background: var(--bt-panel) !important;
    box-shadow: 0 12px 30px rgba(23, 32, 51, 0.08) !important;
}

#btechAiBlog .left-section {
    overflow: hidden;
}

#btechAiBlog .main-img {
    height: 450px !important;
    object-fit: cover !important;
    object-position: center !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

#btechAiBlog .headingh1 {
    margin: 24px 28px 14px !important;
    color: var(--bt-ink) !important;
    font-size: 30px !important;
    font-weight: 750 !important;
    line-height: 1.25 !important;
    letter-spacing: 0 !important;
}

#btechAiBlog .tab {
    margin: 0 28px 28px !important;
    padding: 16px 0 0 !important;
    border-top: 1px solid var(--bt-line);
    background: transparent !important;
    box-shadow: none !important;
}

#btechAiBlog .tab li a {
    border: 1px solid #e7edf5 !important;
    border-radius: 6px !important;
    background: #f7f9fc !important;
    color: #303846 !important;
    font-weight: 650 !important;
    box-shadow: none !important;
}

#btechAiBlog .tab li.active a,
#btechAiBlog .tab li a:hover,
#btechAiBlog .tab li a:focus {
    background: var(--bt-primary) !important;
    border-color: var(--bt-primary) !important;
    color: #ffffff !important;
}

#btechAiBlog .form-box {
    border-top: 4px solid var(--bt-accent) !important;
}

#btechAiBlog .intro-section {
    padding: 38px 40px !important;
    border-top: 4px solid var(--bt-accent) !important;
}

#btechAiBlog .intro-section h2 {
    margin: 34px 0 16px !important;
    padding-bottom: 12px;
    border-bottom: 1px solid #edf1f6;
    color: var(--bt-primary-dark) !important;
    font-size: 26px !important;
    font-weight: 750 !important;
}

#btechAiBlog .intro-section h2:first-of-type {
    margin-top: 0 !important;
}

#btechAiBlog .intro-section h3 {
    color: var(--bt-primary-dark) !important;
    font-size: 20px !important;
    font-weight: 750 !important;
}

#btechAiBlog .intro-section h4 {
    color: var(--bt-ink) !important;
}

#btechAiBlog .intro-section p,
#btechAiBlog .intro-section li,
#btechAiBlog .intro-section td {
    color: var(--bt-text) !important;
    font-size: 16px !important;
    line-height: 1.75 !important;
}

#btechAiBlog .intro-section p {
    text-align: left !important;
}

#btechAiBlog .intro-section strong {
    color: var(--bt-primary-dark) !important;
    font-weight: 750 !important;
}

#btechAiBlog .highlight-box {
    margin: 26px 0 !important;
    padding: 24px 26px !important;
    background: #ffffff !important;
    border: 1px solid #e8ddea !important;
    border-left: 5px solid var(--bt-accent) !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 24px rgba(23, 32, 51, 0.06) !important;
}

#btechAiBlog .highlight-box h2,
#btechAiBlog .highlight-box h3,
#btechAiBlog .highlight-box h4 {
    margin-top: 0 !important;
    margin-bottom: 10px !important;
    padding-bottom: 0 !important;
    border-bottom: 0 !important;
    color: var(--bt-primary-dark) !important;
}

#btechAiBlog .highlight-box p,
#btechAiBlog .highlight-box span,
#btechAiBlog .highlight-box strong {
    color: var(--bt-text) !important;
    opacity: 1 !important;
}

#btechAiBlog .table-responsive-custom {
    border: 1px solid var(--bt-line);
    border-radius: 8px;
    background: #ffffff;
}

#btechAiBlog .intro-section table {
    border-collapse: separate !important;
    border-spacing: 0 !important;
    margin: 0 !important;
}

#btechAiBlog .intro-section th {
    background: var(--bt-primary-dark) !important;
    border-color: var(--bt-primary-dark) !important;
    color: #ffffff !important;
    font-weight: 750 !important;
}

#btechAiBlog .intro-section td {
    border-color: #e6ecf4 !important;
}

#btechAiBlog .intro-section td:first-child {
    color: var(--bt-primary-dark) !important;
    font-weight: 750 !important;
}

#btechAiBlog .intro-section tr:nth-child(even) {
    background: #f8fafc !important;
}

#btechAiBlog .info-card,
#btechAiBlog .faq-item,
#btechAiBlog .cta-box {
    border-radius: 8px !important;
    background: #ffffff !important;
    border: 1px solid var(--bt-line) !important;
    box-shadow: 0 8px 20px rgba(23, 32, 51, 0.05) !important;
}

#btechAiBlog .info-card {
    border-top: 3px solid var(--bt-primary) !important;
    border-left: 1px solid var(--bt-line) !important;
}

#btechAiBlog .cta-box {
    border-left: 5px solid var(--bt-accent) !important;
}

#btechAiBlog .cta-button {
    border-radius: 6px !important;
    background: var(--bt-accent) !important;
    box-shadow: none !important;
}

#btechAiBlog .cta-button:hover,
#btechAiBlog .cta-button:focus {
    background: #a80d25 !important;
}

#btechAiBlog .faq-item h4 {
    color: var(--bt-primary-dark) !important;
}

@media (max-width: 992px) {
    #btechAiBlog .main-img {
        height: 280px !important;
    }

    #btechAiBlog .intro-section {
        padding: 28px 24px !important;
    }
}

@media (max-width: 576px) {
    #btechAiBlog .main-img {
        height: 220px !important;
    }

    #btechAiBlog .headingh1 {
        margin: 20px 18px 12px !important;
        font-size: 21px !important;
    }

    #btechAiBlog .tab {
        margin: 0 18px 20px !important;
    }

    #btechAiBlog .intro-section {
        padding: 24px 18px !important;
    }

    #btechAiBlog .intro-section h2 {
        font-size: 22px !important;
    }
}

/*
   Professional blog/course theme for converted ASPX articles.
   This keeps the converted pages aligned with the cleaner BPharm-Course.aspx layout.
*/

:root {
    --iu-blog-primary: #450052;
    --iu-blog-primary-dark: #2f0038;
    --iu-blog-blue: #0170b9;
    --iu-blog-ink: #182233;
    --iu-blog-line: #e3e8ef;
    --iu-blog-soft: #f7f8fb;
    --iu-blog-card: #ffffff;
}

body {
    background: var(--iu-blog-soft);
}

.section {
    background: linear-gradient(180deg, #ffffff 0, #ffffff 285px, #fff 285px, var(--iu-blog-soft) 100%);
    padding: 24px 0 50px;
}

.section > .container {
    width: min(1220px, calc(100% - 40px));
    max-width: 1220px;
    padding-left: 0;
    padding-right: 0;
}

.section > .container > .row {
    display: grid;
    grid-template-columns: minmax(0, 786px) 370px;
    gap: 24px;
    align-items: start;
    justify-content: center;
    margin-left: 0;
    margin-right: 0;
}

.section > .container > .row > .container-fluid.p-0 {
    display: contents;
    width: 100%;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.custom-row {
    display: contents !important;
}

.left-section,
.right-section {
    min-width: 0;
}

.left-section {
    grid-column: 1;
    grid-row: 1;
    flex: none !important;
    background: var(--iu-blog-card);
    border: 1px solid var(--iu-blog-line);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 14px 36px rgba(24, 34, 51, 0.08);
}

.right-section {
    grid-column: 2;
    grid-row: 1 / span 2;
    flex: none !important;
    position: sticky;
    top: 96px;
    height: fit-content;
}

.main-img {
    display: block;
    width: 100% !important;
    height: 450px;
    border-radius: 0 !important;
    object-fit: cover;
    object-position: center;
    box-shadow: none !important;
}

.headingh1 {
    margin: 22px 26px 14px !important;
    color: var(--iu-blog-ink) !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
    font-size: 31px !important;
    font-weight: 700 !important;
    line-height: 1.24 !important;
    letter-spacing: 0;
    white-space: normal !important;
    overflow-wrap: break-word;
    word-break: normal;
}

.tab {
    display: flex !important;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 26px 26px !important;
    padding: 18px 0 0 !important;
    list-style: none;
    border-top: 1px solid var(--iu-blog-line);
}

.tab li {
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none;
}

.tab li a {
    display: inline-flex !important;
    align-items: center;
    min-height: 38px;
    padding: 9px 15px !important;
    border: 1px solid #edf0f5;
    border-radius: 6px !important;
    background: #f5f7fa !important;
    color: #333b49 !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none !important;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.tab li.active a,
.tab li a:hover,
.tab li a:focus {
    background: var(--iu-blog-primary) !important;
    border-color: var(--iu-blog-primary) !important;
    color: #ffffff !important;
    box-shadow: 0 8px 18px rgba(69, 0, 82, 0.18);
}

.form-box {
    background: var(--iu-blog-card) !important;
    border: 1px solid var(--iu-blog-line);
    border-top: 4px solid var(--iu-blog-primary);
    border-radius: 8px !important;
    padding: 14px !important;
    box-shadow: 0 14px 36px rgba(24, 34, 51, 0.1) !important;
}

.form-box iframe,
.form-box .npf_wgts {
    width: 100% !important;
    max-width: 100% !important;
}

.intro-section-wrapper {
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    max-width: none !important;
    margin: 24px 0 0 !important;
    padding: 0 !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
    color: var(--iu-blog-ink) !important;
    line-height: 1.75 !important;
}

.intro-section {
    width: 100% !important;
    padding: 34px 36px !important;
    background: var(--iu-blog-card) !important;
    border: 1px solid var(--iu-blog-line);
    border-top: 4px solid var(--iu-blog-primary);
    border-radius: 8px !important;
    box-shadow: 0 12px 32px rgba(24, 34, 51, 0.07) !important;
}

.intro-section h1,
.intro-section h2,
.intro-section h3,
.intro-section h4,
.intro-section .headingh2,
.intro-section .main-heading {
    color: var(--iu-blog-primary) !important;
    font-family: "Segoe UI", Arial, sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: 0;
}

.intro-section h2,
.intro-section .headingh2,
.intro-section .main-heading {
    margin: 10px 0 18px !important;
    font-size: 28px !important;
    line-height: 1.3 !important;
}

.intro-section h3 {
    margin: 28px 0 12px !important;
    font-size: 22px !important;
    line-height: 1.35 !important;
}

.intro-section h4.panel-title {
    margin: 20px 0 10px !important;
    padding: 14px 16px;
    background: #fbf8fc;
    border: 1px solid #eaddec;
    border-left: 4px solid var(--iu-blog-primary);
    border-radius: 8px;
    font-size: 17px !important;
    line-height: 1.45 !important;
}

.intro-section h4.panel-title a {
    color: var(--iu-blog-primary-dark) !important;
    text-decoration: none !important;
}

.intro-section h4.panel-title a:hover,
.intro-section h4.panel-title a:focus {
    color: var(--iu-blog-blue) !important;
}

.intro-section p,
.intro-section .lead,
.intro-section li,
.intro-section td,
.intro-section th {
    font-family: "Segoe UI", Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 1.75 !important;
}

.intro-section p,
.intro-section .lead {
    margin: 0 0 16px !important;
    color: #374151 !important;
    font-weight: 400 !important;
    text-align: left !important;
}

.intro-section table p {
    margin: 0 !important;
}

.intro-section ul,
.intro-section ol {
    margin: 14px 0 20px;
    padding-left: 24px;
}

.intro-section li {
    margin-bottom: 8px;
    color: #374151 !important;
}

.intro-section strong,
.intro-section b {
    color: var(--iu-blog-primary-dark) !important;
    font-weight: 700 !important;
}

.intro-section a {
    color: var(--iu-blog-blue);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.intro-section table {
    width: 100% !important;
    max-width: 100%;
    margin: 22px 0 !important;
    border-collapse: separate !important;
    border-spacing: 0 !important;
    border: 1px solid var(--iu-blog-line) !important;
    border-radius: 8px;
    overflow: hidden;
    background: #ffffff;
    box-shadow: 0 8px 22px rgba(24, 34, 51, 0.05);
}

.intro-section tbody,
.intro-section tr {
    width: 100%;
}

.intro-section th,
.intro-section td {
    height: auto !important;
    padding: 13px 16px !important;
    border: 0 !important;
    border-bottom: 1px solid var(--iu-blog-line) !important;
    color: #374151 !important;
    vertical-align: top;
    text-align: left !important;
}

.intro-section th,
.intro-section tr:first-child td {
    background: var(--iu-blog-primary) !important;
    color: #ffffff !important;
    font-weight: 700 !important;
}

.intro-section th *,
.intro-section tr:first-child td * {
    color: #ffffff !important;
}

.intro-section td:first-child {
    font-weight: 700 !important;
    color: var(--iu-blog-primary-dark) !important;
}

.intro-section tr:nth-child(even) td {
    background: #f8fafc !important;
}

.intro-section tr:last-child td,
.intro-section tr:last-child th {
    border-bottom: 0 !important;
}

.intro-section img {
    max-width: 100%;
    height: auto;
}

.intro-section article.card.short.list-item {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    gap: 18px;
    align-items: start;
    margin: 0 0 18px;
    padding: 18px;
    border: 1px solid var(--iu-blog-line);
    border-radius: 8px;
    background: #ffffff;
    box-shadow: 0 8px 20px rgba(24, 34, 51, 0.05);
}

.intro-section article.card.short.list-item img {
    width: 150px !important;
    height: 100px !important;
    object-fit: cover;
    border-radius: 6px;
}

.glyphicon-plus,
.short-full.glyphicon-plus {
    color: var(--iu-blog-primary) !important;
    margin-right: 8px;
}

#Overview,
#Eligibility,
#Eligibilty,
#Duration,
#Scope,
#Faq,
#Career,
#About,
#Course,
#Highlights,
#Syllabus,
#Admission {
    scroll-margin-top: 150px;
}

html {
    scroll-behavior: smooth;
}

@media (max-width: 1199px) {
    .section > .container {
        width: min(100% - 28px, 1120px);
    }

    .section > .container > .row {
        grid-template-columns: minmax(0, 1fr) 340px;
    }

    .main-img {
        height: 320px;
    }

    .headingh1 {
        font-size: 28px !important;
    }
}

@media (max-width: 991px) {
    .section {
        padding-top: 16px;
        background: var(--iu-blog-soft);
    }

    .custom-row {
        display: block !important;
    }

    .section > .container > .row,
    .section > .container > .row > .container-fluid.p-0 {
        display: block;
    }

    .right-section {
        position: static !important;
        margin-top: 22px;
    }

    .main-img {
        height: 280px;
    }

    .headingh1 {
        font-size: 26px !important;
    }

    .intro-section {
        padding: 28px 24px !important;
    }
}

@media (max-width: 575px) {
    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }

    .section {
        width: 100vw;
        max-width: 100vw;
        overflow-x: hidden;
    }

    .section > .container {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 10px;
        padding-right: 10px;
        box-sizing: border-box;
    }

    .section > .container > .row,
    .section > .container > .row > .container-fluid.p-0,
    .custom-row,
    .left-section,
    .right-section,
    .form-box,
    .intro-section-wrapper,
    .intro-section {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box;
    }

    .main-img {
        height: 220px;
    }

    .headingh1 {
        width: calc(100vw - 56px) !important;
        max-width: 340px;
        margin: 18px 18px 12px !important;
        font-size: 20px !important;
        line-height: 1.3 !important;
        overflow-wrap: anywhere;
        word-break: break-word;
    }

    .tab {
        width: calc(100vw - 56px) !important;
        max-width: 340px;
        margin: 0 18px 20px !important;
        gap: 8px;
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .tab li a {
        min-height: 36px;
        padding: 8px 12px !important;
        font-size: 13px !important;
        white-space: nowrap;
    }

    .intro-section {
        padding: 22px 18px !important;
    }

    .intro-section h2,
    .intro-section .headingh2,
    .intro-section .main-heading {
        font-size: 23px !important;
    }

    .intro-section h3 {
        font-size: 20px !important;
    }

    .intro-section p,
    .intro-section .lead,
    .intro-section li,
    .intro-section td,
    .intro-section th {
        font-size: 15px !important;
    }

    .intro-section table {
        display: block;
        overflow-x: auto;
        white-space: normal;
    }

    .intro-section article.card.short.list-item {
        display: block;
    }

    .intro-section article.card.short.list-item img {
        display: block;
        margin-bottom: 12px;
    }
}

/* Shared readable highlight pattern for converted blog pages.
   This overrides older inline purple gradient cards without editing each page. */
.intro-section .highlight-box,
.highlight-box {
    background: #ffffff !important;
    border: 1px solid #e4e8f0 !important;
    border-left: 5px solid #c8102e !important;
    border-radius: 8px !important;
    box-shadow: 0 10px 24px rgba(24, 34, 51, 0.06) !important;
    color: #344054 !important;
}

.intro-section .highlight-box h2,
.intro-section .highlight-box h3,
.intro-section .highlight-box h4,
.highlight-box h2,
.highlight-box h3,
.highlight-box h4 {
    color: #27002f !important;
    border-bottom: 0 !important;
    padding-bottom: 0 !important;
}

.intro-section .highlight-box p,
.intro-section .highlight-box span,
.intro-section .highlight-box strong,
.highlight-box p,
.highlight-box span,
.highlight-box strong {
    color: #344054 !important;
    opacity: 1 !important;
}
