.o-portraitbanner{
  width:20px;
  display:block;
  height:20px;
  text-decoration:none;
}
.o-portraitbanner:before{
  content: '';
  background:url('../img/o-portraitbanner.png');
  background-size:cover;
  position:absolute;
  width:20px;
  height:20px;
}

.o-portrait{
  width:20px;
  display:block;
  height:20px;
  text-decoration:none;
}
.o-portrait:before{
  content: '';
  background:url('../img/o-portrait.png');
  background-size:cover;
  position:absolute;
  width:20px;
  height:20px;
}

.o-landscape{
  width:20px;
  display:block;
  height:20px;
  text-decoration:none;
}
.o-landscape:before{
  content: '';
  background:url('../img/o-landscape.png');
  background-size:cover;
  position:absolute;
  width:20px;
  height:20px;
}

img.grayscale {
  filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
  filter: gray; 
  -webkit-filter: grayscale(100%); 
}

.on{
  color: #fffb00 !important;
}

.auto-off{
  background-color: #1d1d1d !important;
  color:gray !important;
}

.blackboard{
  background-color: #181818;
  padding:8px;
  margin:-12px;
}

.whiteboard{
  background-color: white;
  padding:8px;
  border: 4px solid #d7d7d7;
}

.header-cap{
  display: flex;
}

.sidebar .nav-icon{
  margin-top: 12px;;
  margin-right: 12px;
}

.sidebar-mini .main-sidebar .nav-link, .sidebar-mini-md .main-sidebar .nav-link, .sidebar-mini-xs .main-sidebar .nav-link {
  width: 250px !important;
  border-top-left-radius: 32px;
  border-bottom-left-radius: 32px;
}
}  
.content-wrapper{
  margin-top:5px;
}

.navside-brand{
  height:82px;
  padding-left: 0;
  padding-right: 0;
  padding-top: 8px;
  background-color: #969593;
}

.navside-brand-image{
  width: 230px;
}

body{
  background-color: #dededb;
}

.main-header .navbar-nav .nav-item {
    height: 48px;
  }
  
  .navbar-nav {
    height: 60px;
}

.icon-label{
  font-size: 0.6em;
  font-weight: 700;
  color: #181818;
  margin-top: -6px;
}

.main-header .nav-icon, .nav-link {
  padding-top: 8px !important;
}

.main-header .nav-link {
  background-color: white;
  color: #181818;
  height: 4.2rem !important;
} 

.sidebar-mini .main-sidebar .nav-item .nav-link {
  background-color: #454761;
  color:#fff !important;
  height: 4.2rem !important;
}

.main-header {
  border-bottom: none;
}

.main-header .nav-item .nav-link {
  background-color: white;
  color: #181818;
  padding-left: .6rem;
}

.sidebar-mini .main-sidebar .nav-item .nav-link {
  color: #fff !important;
  padding-left: .6rem;
}

.sidebar-mini .main-sidebar .nav-item .nav-link:hover {
  color: #ddd !important;
  padding-left: .6rem;
}

[class*=sidebar-dark-] .nav-treeview>.nav-item {
  padding-left: .2rem;
}

.sidebar-mini .main-sidebar .nav-treeview > .nav-item > .nav-link {
  width: 240px !important;
}

.nav-sidebar .nav-item > .nav-link {
  margin-bottom: .6rem;
}

.nav-sidebar .nav-treeview > .nav-item > .nav-link {
  margin-bottom: .1rem;
}

.nav-sidebar .nav-treeview :last-child {
  margin-bottom: .6rem;
}

.main-header .navlast {
  border-bottom-right-radius: 30px;
  border-top-right-radius: 30px;
}

.main-header .navfirst, .nav-item .navfirst {
  border-bottom-left-radius: 30px;
  border-top-left-radius: 30px;
}

.navbar-white {
  background-color: transparent;
}

.navbar {
  padding-left: 0 !important;
  padding-right: 0 !important;
}