@import url('custom.css');
@import url('countdown-counter.css');
/******************************************************************************************
 * General Tag overrides 
 *****************************************************************************************/

address {
    border-left: 10px solid #eee;
    padding-left: 15px;
    margin-left: 10px;
}


div.design_content {
    overflow: hidden;
}
/*CMTA Blue #0069aa*/
/*Quotes*/
blockquote {
    border: none;
    /*margin: 1.5em 10px;
    padding: 0.5em 10px;*/
    quotes: "\201C""\201D""\2018""\2019";
}

    blockquote:before,
    blockquote:after {
        color: #ccc;
        font-size: 4em;
        line-height: 0.1em;
        margin-right: 0.25em;
    }

    blockquote:before {
        content: open-quote;
        vertical-align: -0.4em;
    }

    blockquote:after {
        content: close-quote;
        vertical-align: -0.6em;
    }

    blockquote p {
        display: inline;
    }

.aside-callOut {
}

#content .contact-person {
    display: block;
    padding: 10px;
}

.gray-light {
    background: #EDF0FA !important;
}

#content div.gray-light.small .panel-body {
    padding-top: 15px !important;
}

.modal-body .thumbnail {
    margin: 0;
}

@media (max-width: 990px) {
    #content .border-right {
        border-right: none;
    }
}

.map-thumbnail {
    padding: 0px;
    border: 1px solid #ddd;
    border-radius: 2px;
    background: #edf0f8;
    margin:0;
}

.img-caption {
    display: block;
    font-weight: 100;
    margin: 0px;
    font-size: 85%;
    font-style: italic;
    padding: 5px 0px;
    color: #444;
    cursor: pointer;
    border-top: 1px solid #ddd;
}

    .img-caption:hover {
        color: #000;
    }
/****************************************************************************************
 * CAPMETRO SERVICE TYPES - ROUTE BADGES
 ****************************************************************************************/
.route-badges {
    display: block;
    margin-right: 5px;
}

    .route-badges .label {
        color: #444;
        font-size: 14px;
        font-weight: 400;
        background: #fff;
        padding: 0.2em 0.6em 0.2em 0.35em;
        margin: 5px 0;
        display: inline-block;
        border: 1px solid #fff;
        /*border: 1px solid rgba(0,0,0,.075);
        -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
        box-shadow: 0 1px 1px 0 rgba(0,0,0,.1);
        border-radius: .15em;*/
    }

    .route-badges a.label:hover, .route-badges a.label:focus {
        color: #000;
        border: 1px solid rgba(0,0,0,.095);
        box-shadow: 0 1px 1px 0 rgba(0,0,0,.5);
        -webkit-transition: box-shadow 2s ease-out;
        -moz-transition: box-shadow 2s ease-out;
        -o-transition: box-shadow 2s ease-out;
        transition: box-shadow 2s ease-out;
    }

    .route-badges .badge {
        border-radius: 2px;
        color: rgb(255,255,255);
        line-height: 1;
        vertical-align: middle;
        display: inline-block;
        margin-right: 4px;
        font-size: 13px;
        font-weight: 700;
        text-align: center;
        padding: 3px 4px 2px;
    }

        .route-badges .badge#metrobus, .route-badges .badge.metrobus {
            background-color: #01579b;
        }

        .route-badges .badge#metrorapid, .route-badges .badge.metrorapid {
            background-color: #616161;
        }

        .route-badges .badge#metroexpress, .route-badges .badge.metroexpress {
            background-color: #a82428;
        }

        .route-badges .badge#metrorail, .route-badges .badge.metrorail {
            background-color: #a82428;
        }

        .route-badges .badge#carts, .route-badges .badge.carts {
            background-color: #444;
        }
/* <span class="route-badges"><a title="Route 990 Manor/Elgin Express" class="label" href="/schedmap/?svc=0&f1=990&s=0&d=E" target="_blank"><span class="badge" id="metroexpress">990</span>Manor/Elgin Expres</a></span>
 */

/****************************************************************************************
 * Overrides for mobile
 ****************************************************************************************/
@media (max-width: 768px) {
    #content .summary-list div.collapse h3,
    #content .summary-list div.collapse p {
        /*padding-left: 0px !important;*/
    }

    #content .summary-list div.collapse ul {
        /*padding-left: 10px !important;*/
    }
        /*Level 3 datalist override*/
        #content .summary-list div.collapse ul.lvl3 {
            padding-left: 40px !important;
        }

            #content .summary-list div.collapse ul.lvl3 li {
                background: transparent !important;
            }

    .container .summary-list div ul {
        padding-left: 40px !important;
    }

        .container .summary-list div ul > span > li,
        #content .summary-list div.collapse ul li {
            background: #ffffff !important;
            color: #000000;
            border: none;
            padding: 0 0 10px 0;
            list-style-type: disc;
        }

    #content .summary-list div.collapse .caption ul li {
        margin: 0 0 0 10px;
        background: none !important;
    }

    #details .caption {
        padding: 0;
        clear: both;
        float: none;
        font-size: 100%;
    }
}
/*************************************************/
/* Custom Float pulled from BSv4 alpha */
/*************************************************/
.float-left {
    float: left !important;
}

.float-right {
    float: right !important;
}

.float-none {
    float: none !important;
}

@media (min-width:576px) {
    .float-sm-left {
        float: left !important;
    }

    .float-sm-right {
        float: right !important;
    }

    .float-sm-none {
        float: none !important;
    }
}

@media (min-width:768px) {
    .float-md-left {
        float: left !important;
    }

    .float-md-right {
        float: right !important;
    }

    .float-md-none {
        float: none !important;
    }

    .img-margin-left {
        margin-left: 20px !important;
    }
}

@media (min-width:992px) {
    .float-lg-left {
        float: left !important;
    }

    .float-lg-right {
        float: right !important;
    }

    .float-lg-none {
        float: none !important;
    }
}

@media (min-width:1200px) {
    .float-xl-left {
        float: left !important;
    }

    .float-xl-right {
        float: right !important;
    }

    .float-xl-none {
        float: none !important;
    }
}
/****************************************************************************************
 * MetroWorks Specific
 ****************************************************************************************/
#tools {
    padding: 20px;
    background: #edf0f8;
}

    #tools #admin-tool {
        text-decoration: none;
        font-size: 12px;
        font-style: italic;
        margin: 15px auto 0;
        display: block;
        padding: 7px 10px;
        border: 1px dashed;
        font-weight: 400;
        text-align: center;
    }

.mw-steps {
    margin-top: 20px;
    margin-bottom: 20px;
}

.bluechart-header small {
    font-size: 50%;
    vertical-align: middle;
    display: block;
}

.no-background {
    background: #fff;
}

table.bluechart > thead > tr > th, table.bluechart > thead > tr > td {
    min-width: 110px;
}

ul#tabNav {
}

.summary-list ul#tabNav li {
    padding: 0 !important;
    border: none !important;
    font-size: 150%;
}

.ad-pics > div {
    background: #fff;
}

@media (max-width: 768px) {
    #content .summary-list div#adOptions ul {
        padding: 0px !important;
    }

        #content .summary-list div#adOptions ul li {
            margin-right: -20px;
            margin-left: -20px;
            padding: 0px !important;
            background-color: #555;
            color: #fff;
            border-color: #fff;
        }

        #content .summary-list div#adOptions ul#tabNav li {
            margin: 0 0 4px 0;
            padding: 0px;
            background-color: transparent;
            background-color: #fff;
            color: #fff !important;
            border: 1px #ccc solid;
        }

    .summary-list ul#tabNav > li.active > a,
    .summary-list ul#tabNav > li.active > a:focus,
    .summary-list ul#tabNav > li.active > a:hover {
        color: #fff;
        cursor: default;
        background-color: #0069aa;
        border-bottom-color: transparent;
    }

    #content .summary-list div#adOptions ul li > div,
    #content .summary-list div#adOptions ul li > div.collapse {
        padding: 0 !important;
    }
}

#content .summary-list div ul.list-unstyled, #content .summary-list div ul.list-unstyled li #content .summary-list ul.list-unstyled, #content .summary-list ul.list-unstyled li {
    padding-left: 0;
    list-style: none;
    list-style-type: none;
    border-top: 0 none;
    border-bottom: 0 none;
}

.inline {
    display: inline;
}
    .bs-glyphicons .icon, .bs-glyphicons .glyphicon {
        font-size:36px;
    }

    .bs-glyphicons li { height: 135px; }

    .highlight pre code {
        font-size: 12px;
    }