h2 {color:#004c53;} 
ul.outageTabs {
    list-style-type:none;
    margin-left:0px;
    margin-bottom:0px;
}
.outageTabs li {
    position:relative;    
    list-style:none;
    float:left;    
    color:#000000;
    border:1px solid #808080;
    background-color:#f0f0f0;
    text-align:center;
    padding:.625rem;
    width:33.33%;
    cursor:pointer;    
}
ul.outageTabs li.active {
    background-color:#b0d236;
/*    border-bottom:0px;*/
    color:#004c53;
    cursor:default;
}
ul.outageTabs li.active i.fa {display:inline;margin-right:5px;}
ul.outageTabs li i.fa {display:none;}

ul.outageTabs li.refreshBtn {
    background-color:#ffffff;
    width:10%;
    border:0px;
}
ul.outageTabs li a {color:#004c53;display:block;width:100%;height:100%;}

.update { padding:5px; font-family:"proxima-nova", "HelveticaNeue", "Helvetica", "Arial", sans-serif; font-size:0.9rem;}
.update span { font-weight:600; margin-right:5px; float:left;}
.update:nth-child(even) { background-color:#f0f0f0;}

.row .checklist {margin:0.93rem;padding:0.93rem;background:#f0f0f0;border:1px solid #808080;clear:both;}
.checklist ul.fa-ul {margin-left:2.14rem;margin-bottom:1.5rem;}
ul.tabs {margin-left:0px;margin-bottom:10px;list-style-type:none;float:left;width:100%;}
ul.tabs li {margin-top:10px;padding-left:0px;padding-bottom:0px;float:left;width:100%;}
ul#viewTabs li {margin-top:0px;}
.timeLabel {float:left;margin-top:5px;margin-bottom:5px;}
.pnl {float:left;width:100%;}
.listing-content p.cancelled { color:red; }
#loading {width:100%;padding:10%;text-align:center;}
#streetSearch {width:100%; float:left;}
#refresh {margin-left:5px;font-size:18px;} 
.tabs-content input[type='text'],.tabs-content input[type='email'],.tabs-content textarea { margin-bottom: 0px;background-color:#fff;border:solid #808080 1px;font-size:1rem;}
.checklistInner input[type='text'],.tabs-content input[type='email'],.checklistInner textarea {margin-top:5px;margin-bottom:10px;}
#restorationDetails { border:0; padding:0;}
#restorationDetails th {
    color: #000;
    font-size: 0.75rem;    
    text-align:left;
    padding:0.1rem;
} 
#restorationDetails td {color: #000;font-size: 0.75rem;padding:0.1rem;}
.centre { text-align:center; }
form.outageReport input[type='radio'] {margin-left:5px;margin-right:5px;}
.outageContent label {padding-top:5px;}
#NoOutages {float:left;}
#reportSuccess {padding:10px; }
#reportSuccess h3 { color:#004c53; background-color:#b0d236; padding:5px;}
a.reportOutage, button.reportOutage {padding:15px;color:#004c53;font-size:1rem;}
.centreCol{margin-left:auto;margin-right:auto;width:100%;text-align:center;float:left;}
.zoomToOutageBtn {text-align:center;width:100%}
.fa-play {font-size:0.8rem;}
#map_canvas {
    height: 100%;
    width: 100%;
    border:solid 1px #999999;
    background-color: rgb(229, 227, 223); 
    overflow: hidden;
}
#legend {background-color:#fff;padding:0.1rem;border:solid 1px #777777;font-size:12px;}
.map_view {
    height: 70vh;
    margin-bottom:0.93rem;
}
.listing-title {
    background-color: #b0d236;
    cursor: pointer;
}
.listing-title-active {
    background-color: #E17000;
    cursor: pointer;
}
.listing-title-active h2 {
    color: #fff;
    font-family: "proxima-nova", "HelveticaNeue", "Helvetica", "Arial", sans-serif;
    font-size: 1.0rem;
    font-weight:bold;
    margin: 0;
    padding: 0.5rem 0.9375rem;
    cursor: pointer;
}

.listing-title h2 {
    color: #004c53;
    font-family: "proxima-nova", "HelveticaNeue", "Helvetica", "Arial", sans-serif;
    font-size: 1.0rem;
    font-weight:bold;  
    margin: 0;
    padding: 0.5rem 0.9375rem;
    cursor: pointer;
}
.listing-title h2 i {
    font-size: 1.25rem;
    margin-right: 0.9375rem;
    cursor: pointer;
}
.listing-title-active h2 i {
    font-size: 1.25rem;
    margin-right: 0.9375rem;
    cursor: pointer;
}
.listing-content {
    padding: 0.5rem 0.9375rem;
    position: relative;
}
.listing-content h3 {
    color: #000;
    font-family: "proxima-nova", "HelveticaNeue", "Helvetica", "Arial", sans-serif;
    font-size: 0.75rem;
    margin: 0;
}
.listing-content p {
    color: #000;
    font-family: "proxima-nova", "HelveticaNeue", "Helvetica", "Arial", sans-serif;
    font-size: 0.75rem;
    margin: 0 0 0.625rem 0;
}
.row.listing .listing-content a.map-btn {
    background: #b0d236;    
    font-family: "proxima-nova", "HelveticaNeue", "Helvetica", "Arial", sans-serif;
    font-size: 0.875rem;
    padding: 0.5rem 0.9375rem;    
    bottom: 20px;
    /*right: 20px;*/
}
.row.listing .listing-content a.map-btn i {
    font-size: 1.125rem;
    margin: 0 0 0 0.9375rem;
}
.row.listing .listing-content a.map-btn:hover {
    background: #b0d236;
}
.accordion-navigation a.accordion-link {
    background: #00b0ad;
    color: #fff;
    padding: 0.5rem 0.9375rem;
    font-family: "proxima-nova", "HelveticaNeue", "Helvetica", "Arial", sans-serif;
}

.accordion-navigation a.accordion-link i {
    font-size: 1.25rem;
    margin: 0 0.9375rem 0 0;
}

.accordion .accordion-navigation.listing-content, dd.accordion-navigation.listing-content {
    padding: 0;
    margin: 0.625rem 0 0 0;
}

.accordion .accordion-navigation.active > a, .accordion dd.active > a {
    background: #00b0ad;
}

.accordion .accordion-navigation.active > a:hover, .accordion .accordion-navigation > a:hover {
    background: #0B7D7C;
}

.listing-content {
    padding: 0.5rem 0.9375rem;
    position: relative;
    /*border-left: 1px solid #e5e4e4;
    border-right: 1px solid #e5e4e4;
    border-bottom: 1px solid #e5e4e4;*/
}

.listing-content h3 {
    color: #000;
    font-family: "proxima-nova", "HelveticaNeue", "Helvetica", "Arial", sans-serif;
    font-size: 0.9rem;
    font-weight:bold;
    margin: 0;
}

.listing-content p {
    color: #000;
    font-family: "proxima-nova", "HelveticaNeue", "Helvetica", "Arial", sans-serif;
    font-size: 0.9rem;
    margin: 0 0 0.2rem 0;
}

.listing-content a.map-btn {
    background: #b0d236;
    color: #004c53;
    font-family: "proxima-nova", "HelveticaNeue", "Helvetica", "Arial", sans-serif;
    font-size: 0.9rem;
    padding: 0.5rem;        
    bottom: 20px;
    right: 0px;
}

.listing-content a.map-btn i {
    font-size: 1.125rem;
    margin: 0 0 0 0.9375rem;
}

.listing-content a.map-btn:hover {
    background: #b0d236;
}
.fa-list, .fa-map-marker {padding-left:5px;padding-right:5px;}
ul.mobile.tabs {
    width: 100%;
    margin:0px;
}

ul.tabs.mobile li.active.tab-title {
    background-color: #b0d236;    
    color: #004c53;
}

ul.mobile.tabs li.tab-title {
    width: 50%;    
    float:left;
    padding:10px;    
    position:relative;
    cursor:pointer;
    border: 1px solid #004c53;
    background-color:#f0f0f0;
}

ul.mobile.tabs li.tab-title.active a {            
    background-color:#b0d236;
    border:2px solid #004c53;                        
            
    color:#004c53;
}

ul.mobile.tabs li.tab-title a {
    font-family:  "omnes-pro","HelveticaNeue", "Helvetica", "Arial", sans-serif;
    border:2px solid #b0d236;                        
    font-size:1.1rem;                       
    display: block;
    color:#004c53;
    width: 100%;
    background-color:#fff;
}

ul.mobile.tabs li.tab-title a i {
    margin-right: 0.9375rem;
}

@media only print, screen and (max-width: 55em) {
    #min50 {display:none;}
    #max50 {display:block;}
    #min64{display:none;}
    /*.tabs-content {
	padding-left:0.93rem; 
	padding-right:0.93rem;
	overflow-y: hidden;
        overflow-x: hidden;
    }*/
    .tabs-content > .row > .content {display:block;}

    .tabs-content .mobile-past-present ul.tabs li.tab-title a {
        padding: 0.625rem 0.5rem;
        font-family:  "omnes-pro","HelveticaNeue", "Helvetica", "Arial", sans-serif;
        color:#004c53;            
    }

    /*ul.mobile.tabs {padding-left:0.93rem; padding-right:0.93rem;}*/
    ul.mobile.tabs li.tab-title a {
        padding: 0.625rem 0.625rem;
        font-size: 1.1rem;
    }

    ul.mobile.tabs li.tab-title a i {
        display: inline-block;
        margin-right: 0.75rem;
        width: 17px;
    }

    ul.mobile.tabs li.tab-title a span {
        display: inline-block;
        width: 93px;
    }

    .row.listing .listing-content a.map-btn, .listing-content a.map-btn {
        position: relative;
        display: inline-block;
        text-align: center;
        bottom: auto;
        right: auto;
        margin: 0 0 10px 0;
    }
    
    #viewTabs {display:block;}
    #map_view {display:none;}
    #map_view.active {display:block;}
    #listview {display:none;}
    #listview.active {display:block;}
}

@media only print, screen and (min-width: 55em) {
    #min50 {display:block;}
    #max50 {display:none;}
    #min64{display:none;}
    #viewTabs {display:none;}
    .tabs-content > .row > .content {display:block;}
    .checklistInner {width:85%;margin-left:auto;margin-right:auto;}
    #map_view {display:block;width:59%;padding-right:0px;}    
    #list_view_container {display:block;width:39%;padding-left:1.5rem;padding-right:1.5px;}    
    #pagingControl ul li.ng-scope {font-size:1.1rem;}
    #checklist {margin-left:1.5rem;margin-right:1.5rem;}
}

@media only print, screen and (min-width: 64em) {
    #viewTabs {display:none;}
    #min50 {display:none;}
    #max50 {display:none;}
    #min64{display:block;}
    #map_view {display:block;width:59%;}    
    #list_view_container {display:block;width:39%;}    
}

.map-popup {
    width: 100%;
    max-width: 300px;
}

.map-popup .listing-title {
    background-color: #e17000;
    position: relative;
}

.map-popup span.close {
    position: absolute;
    right: 0px;
    top: 0;
    height: 100%;
    width: 30px;
    font-size: 20px;
    vertical-align: text-top;
    background: #0B7D7C;
}

.map-popup span.close i {
    margin: 0.5625rem 0 0 0.5625rem;
}

.map-popup h2 {
    color: #fff;
    font-size: 0.875rem;
    padding:0.5rem;
}

.map-popup i {
    color: #fff;
    font-size: 16px;
    margin-right: 10px;
}