/*space for left side menu */
header, main, footer {
    padding-left: 240px;
}

@media only screen and (max-width : 992px) {
    header, main,  footer {
        padding-left: 0;
    }
}

main.login { padding-left: 0 }

/* fallback */
@font-face { font-family: 'Material Icons'; font-style: normal; font-weight: 400; src: local('Material Icons'),
    local('MaterialIcons-Regular'), url('../fonts/MaterialIcons-Regular.woff2') format('woff2'); }

.material-icons { font-family: 'Material Icons'; font-weight: normal; font-style: normal; font-size: 24px; line-height: 1;
    letter-spacing: normal; text-transform: none; display: inline-block; white-space: nowrap; word-wrap: normal;
    direction: ltr; -webkit-font-feature-settings: 'liga'; -webkit-font-smoothing: antialiased; }

/* app css stylesheet */
.menu { list-style: none; border-bottom: 0.1em solid black; margin-bottom: 2em; padding: 0 0 0.5em; }
.menu:before { content: "["; }
.menu:after { content: "]"; }
.menu > li { display: inline; }
.menu > li:before { content: "|"; padding-right: 0.3em; }
.menu > li:nth-child(1):before { content: ""; padding: 0; }
.hasErrorMsg { margin-bottom: 0 !important; }
.app-title { font-size: 1.3em; padding: 0.3em 0.8em; }
.app-logo img { height: 3.5em; margin-right: 1em }
.nav-wrapper a, .side-nav a { color: teal !important; }
.card-title { font-size: 1em !important; color: teal }
.nav-wrapper .material-icons { font-size:1.5em }
.side-nav a { height:48px; line-height: 48px; }
.side-nav .material-icons { float:left; line-height:48px; margin:0 16px 0 0; }
.nopadmargin { padding: 0 !important; margin: 0 !important }
.error-msg, .info-msg { margin-bottom: 5px; padding: 5px !important; font-size: 0.9em }
.error-msg { background: #ffe0b2;  color: red }
.info-msg {  background: #eceff1;  color: #263238 }
.display-grid {  }
.display-grid th,
.display-grid td { color: #666 !important; padding: 3px !important; font-size: 0.8em !important }
.wait-spinner { position:fixed; top: 50%; left: 50%; width:30em; height:18em; margin-top: -9em; margin-left: -15em;
    borrder: 1px solid #ccc; background-ccolor: #f3f3f3; z-index:1000; opaccity: .8; z-index: 999999999 }
.report-filter { padding: 10px; margin: 8px; border: 1px solid #e0e0e0 }
.report-filter input { margin:0 13px 5px 13px; height: 2rem; padding: 3px; font-size: 0.8em; width: 95%; }
.report-filter .select-dropdown { margin:0 13px 5px 13px !important; padding: 3px !important; font-size: 0.8em !important; width: 95% !important; }
/* numbered buttons */
#status-buttons { margin-bottom: 1em }
#status-buttons a { display:inline-block; font-size:12px; margin-right:10px; text-align:center; text-transform:uppercase; color: teal }
#status-buttons a:hover { text-decoration:none; }
#status-buttons span { color:#ffffff; background:teal; display:block; height:30px; margin:0 auto 10px; padding-top:5px; width:30px;  border-radius:50%; }
#status-buttons a.active span   { background:#00BC8C; }
.bill-summary { font-size: 1.5em }
.collection-item { padding-left: 20px !important; font-size: 0.8em; }
.collection .secondary-content { font-size: 1em; padding: 0 0.5em; }
.collection-item .row { margin-bottom: 0; }
.collection-item .col { padding: 0; }
.collection-actions { position: relative; display: inline-block; top:5px; right: 0; }
.collection-actions ul { margin: 7px 25px 0 0; padding: 0; bottom: 0; top:0 !important; right: 0 !important; }
.collection-actions li { margin: 0 !important; padding: 0 !important; }
.info-chip { font-size: 0.7em; color: white }
.info-chip { background: gray }
/* modal styles */
.modal { }
.modal .modal-header { padding: 5px 5px 5px 20px; background: teal; color: white; font-size: 0.8em !important; text-transform: uppercase }
.modal .md-title { font-size: 0.8em; color: teal !important; }
.md-collection li { font-size: 0.8em !important }