﻿/* notification icon */
a.notification-icon {
    position: relative;
}
a.notification-icon > div {
    position: absolute; top: 10px; left: 6px; font-size: 8pt; background-color: red; border-radius: 50%; height: 20px; width: 20px; text-align:center; line-height: 20px;
}

/* menu navbar */
.menu .navbar-header {
    width: 250px;
    background-color: #2196F3;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
 .menu .navbar-header span.title {
    margin-left: 10px;
}
 .menu .navbar-header .navbar-nav > li > a {
    width: 250px;
}
@media(min-width:768px) {
    .menu .navbar-header {
        width: 50px;
    }
    .menu .navbar-header .navbar-nav > li > a {
        width: 50px;
    }
    .menu .navbar-header span.title {
        display: none;
    }
    .menu .navbar-header.toggled .navbar-nav > li > a {
        width: 50px;
    }
}
@media(min-width:992px) {
    .menu .navbar-header {
        width: 250px;
    }
    .menu .navbar-header .navbar-nav > li > a {
        width: 250px;
    }
    .menu .navbar-header span.title {
        display: inline;
    }
    .menu .navbar-header.toggled {
        width: 50px;
    }
    .menu .navbar-header.toggled span.title {
        display: none;
    }
    .menu .navbar-header.toggled .navbar-nav > li > a {
        width: 50px;
    }
}
.menu.navbar {
    background-color: #293846;
    background-color: #64B5F6;
    color: #fff;
    border: none;
    border-radius: 0px;
    margin-bottom: 10px;
}
.menu.navbar .container-fluid {
    padding-left: 0px;
    margin-right: 0px;
    padding-right: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}
.menu.navbar-default .navbar-nav > li > a {
    color: #fff;
}
.menu.navbar-default .navbar-nav > li > a:hover {
    background-color: #1976D2;
}
.menu.navbar .navbar-header ul.nav.navbar-nav  {
    font-size: 18pt;
}
.menu.navbar .navbar-header ul.nav.navbar-nav li img {
    height: 40px;
    margin-right: 10px;
}
.menu .navbar-nav > li > a {
    line-height: 40px;
}
.menu .navbar-nav > li > span {
    line-height: 40px;
    font-size: 18pt;
    position: relative;
    display: block;
    padding: 14px 14px;
}
.menu.navbar li.active {
    margin-bottom: -5px;
    border-bottom: 5px solid #337ab7;
}
.menu.navbar li.dropdown {
    font-size: 30pt;
}
@media (max-width: 768px) {
    .container-fluid > .navbar-collapse, .container-fluid > .navbar-header, .container > .navbar-collapse, .container > .navbar-header {
        margin-right: 0;
        margin-left: 0;
    }

    .menu .navbar-header {
        float: left;
        width: 50px;
    }

    .menu .navbar-header span.title {
        display: none;
    }

    .menu .navbar-nav {
        float: left;
        margin: 0;
    }

    .navbar-nav > li > a {
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .menu .navbar-header .navbar-nav > li > a {
        width: 50px;
    }

    .navbar-collapse.collapse {
        display: block;
    }

    .navbar-nav > li, .navbar-nav {
        float: left;
    }

    .navbar-nav.navbar-right:last-child {
        margin-right: -15px;
    }

    .menu .navbar-right {
        float: right!important;
    }
}

div.actions {
    margin-bottom: 10px;
}
.btn-primary {
    background-color: #607D8B;
}
.page-header {
    margin-top: 0px;
}
.page-header h1 {
    margin-top: 10px;
    font-size: 14pt;
}

.page-header.card {
	/*background-color: #00BCD4;*/
	/*color: #fff;*/
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	margin-bottom: 20px;
	padding-bottom: 0px;
}


/* nav tabs */
.page-header.card .nav-tabs {
	border-bottom: 0px;
	margin-bottom: 1px;
}
.page-header.card .nav-tabs > li > a {
	border: none;
	text-transform: uppercase;
	border-bottom: 2px solid transparent;
	color: #212121;
}
.page-header.card .nav-tabs> li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover {
	border: none;
	/*color: #fff;*/
    font-weight: bold;
	border-bottom: 2px solid #2196F3;
	background-color: transparent;
}
.page-header.card .nav-tabs.nav > li >a:focus {
    text-decoration: none;
	/*color: #fff;*/
    background-color: transparent;
	border-bottom: 2px solid #2196F3;
}
.page-header.card .nav-tabs.nav > li > a:hover {
	text-decoration: none;
	/*color: #fff;*/
    background-color: transparent;
	border-bottom: 2px solid #B2EBF2;
}



.portal_clickable:hover{
    border: 1px solid #cac4c4;
    border-radius: 5px;
}

.aut-sort:before{
    font-family: FontAwesome;
    padding-right: 0.5em;
    width: 1.28571429em;
    display: inline-block;
    text-align: center;
}

.aut-sortable:before{
    content: "\f0dc";
}

.aut-asc:before{
    content: "\f160";
}

.aut-desc:before{
    content: "\f161";
}

.button_shadow{
    text-shadow: -3px 3px 4px lightgrey;
}

.selected-page{
    color:blue;
}

/*
.list-group-item > i {
    visibility: hidden;
    margin-right: 10px;
}
.highlight {
    background-color: inherit;
}
.list-group-item.highlight > i {
    visibility: visible;
    color: #1ab394;
}
*/

/* list-group */
.list-group > .list-group-item i {
    visibility: hidden;
}
.list-group > .list-group-item.highlight i {
    visibility: visible;
}




.usage-item-heading
{
display: inline-block;
}
.usage-summary-item
{
     border: 1px solid #a1a1a1;
}

.usage-summary-item .usage-item-heading {

}

.usage-summary-item .usage-item-heading div.header {
  background-color: red;
}

.usage-summary-item .usage-item-heading div.header span.label {
  background-color: green;
}

.usage-summary-item .usage-item-heading div.header span.value {
  background-color: gray;
}

.usage-summary-heading-container
{

}
.usage-summary-container
{
    height: 321px;
    /*overflow: scroll;*/
}
.usage-total-duration-panel
{
  display: inline-block;
  border: 1px solid #a1a1a1;
  padding: 8px;
  border-radius: 6px;
}

.usage-total-duration-panel > table > thead > tr > th {
  padding-left: 10px;
}

.usage-total-heading{
    display: inline-block;
    height: 105px;
    margin-top: 36px;
    /* padding-top: 44px; */
    vertical-align: middle;
}

.usage-duration-panel
{
     display: inline-block;
    border: 1px solid #a1a1a1;
    padding: 10px 40px;
    /* background: #dddddd; */
    width: 300px;
    border-radius: 25px;
    margin-top: 30px;
}











.timeline .line {
  width: 1px;
  background-color: silver;
  padding: 0 !important;
  margin: 0 !important; }

.timeline .timegap {
  background-color: silver; }
  .timeline .timegap div.text {
    text-align: center; }

.timeline .timeline-entry {
  min-width: 200px;
  width: 50%; }
  .timeline .timeline-entry .timestamp { }
  .timeline .timeline-entry .title {
    background-color: gray;
    color: white;
    padding: 1px 5px 1px 5px; }
  .timeline .timeline-entry .content {
    display: block; }
  .timeline .timeline-entry .cross {
    background-color: red;
    height: 2px;
    width: 20px;
    display: inline-block;
    position: relative;
    left: -10px; }
  .timeline .timeline-entry.left {
    text-align: right; }
  .timeline .timeline-entry.right {
    text-align: left; }



.splash {
  position: absolute;
  width: 300px;
  height: 200px;
  top: 50%;
  left: 50%;
  margin: -100px 0 0 -150px;
  text-align:center;
  color: #F3F3F3;
}
.splash i {
    margin-top:10px;
    font-size: 64pt;
}
.splash p {
    font-size: 24pt;
    margin-top: 5px;
    color: #DDDDDD;
}

i.warning {
  color: red;
}

tr.search-results-item{
    cursor: pointer;
}

ul.form-tabs > li {
    
    margin-right: 2px;
}

    ul.form-tabs > li > a {
        font-weight: 500;
        color: rgb(192, 192, 192) !important;
    }
    ul.form-tabs > li.active > a {
        font-weight: 600;
        color: rgb(33, 33, 33) !important;
    }
    ul.form-tabs > li > a:hover {
        font-weight: 700;
        color: rgb(33, 33, 33) !important;
    }

.document-unknown{
    visibility: hidden;
}
