.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus{
  background-color: #015bb3;
  border-color:#015bb3;
} 

.sidebar-offcanvas a{ 
  color: #015bb3; 
  font-size: 14px; 
  letter-spacing: 0.2px; 
} 
 
.sidebar-offcanvas img{ height: 22px; } 
 
.sidebar-offcanvas a.active img{  
    -webkit-filter: brightness(200%); 
    filter: brightness(200%);  
} 

.sidebar-tags{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
 
.sidebar-offcanvas .badge{ margin-top: 3px; } 
 
@media screen and (max-width:1200px) { 
 
.sidebar-offcanvas a{ 
  font-size: 14px; 
  letter-spacing: 0.1px; 
} 
 
} 
 
@media screen and (max-width: 992px) { 
 
.sidebar-offcanvas a{ 
  font-size: 16px; 
  letter-spacing: 0.2px; 
} 
 
#sidebar-mobile .list-group-item img{ height: 22px; } 
 
} 
 
@media screen and (max-width: 767px) { 
 
.sidebar-offcanvas a{ 
  font-size: 14px; 
  letter-spacing: 0.1px; 
} 
 
  .row-offcanvas { 
    position: relative; 
    -webkit-transition: all .25s ease-out; 
         -o-transition: all .25s ease-out; 
            transition: all .25s ease-out; 
  } 
 
  .row-offcanvas-right { 
    right: 0; 
  } 
 
  .row-offcanvas-left { 
    left: 0; 
    margin-left: 0px; 
  } 
 
  .row-offcanvas-right 
  .sidebar-offcanvas { 
    right: -50%; /* 6 columns */ 
  } 
 
  .row-offcanvas-left 
  .sidebar-offcanvas { 
    left: -75%; /* 6 columns */ 
  } 
 
  .row-offcanvas-right.active { 
    right: 50%; /* 6 columns */ 
  } 
 
 .row-offcanvas-left.active { 
    left: 75%; /* 6 columns */ 
  } 
 
  .sidebar-offcanvas { 
    position: absolute; 
    top: 45px; 
    width: 75%; /* 6 columns */ 
  } 
}