.theme-dark {
  background: #2d3b49;
  /* Old browsers */
  background: -moz-radial-gradient(top, #2d3b49 0%, #101e2c 100%);
  /* FF3.6+ */
  background: -webkit-gradient(radial, left top, left bottom, color-stop(0%, #2d3b49), color-stop(100%, #101e2c));
  /* Chrome,Safari4+ */
  background: -webkit-radial-gradient(top, #2d3b49 0%, #101e2c 100%);
  /* Chrome10+,Safari5.1+ */
  background: -o-radial-gradient(top, #2d3b49 0%, #101e2c 100%);
  /* Opera 11.10+ */
  background: -ms-radial-gradient(top, #2d3b49 0%, #101e2c 100%);
  /* IE10+ */
  background: radial-gradient(to bottom, #2d3b49 0%, #101e2c 100%);
  /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000',GradientType=0 );
  /* IE6-9 */
  -webkit-filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#000000',GradientType=0 );
  /* LG WebOS 3 */
  color: #fff;
  /*==============Button=================*/
  /*==============List Item=================*/
  /*==============Progress bar=================*/
  /*============== Keyboard =================*/
}

.theme-dark .ui-grid-container {
  -ms-overflow-style: none;
}

.theme-dark ::-webkit-scrollbar {
  width: 0px;
  background: transparent;
}

.theme-dark .secondary-bg {
  background-color: #2f3237;
}

.theme-dark .highlight {
  background-color: #1d7be3;
  color: #fff;
}

.theme-dark .text-active {
  color: #1d7be3;
  font-size: 300%;
}

.theme-dark .text-inactive {
  color: #bebfc1;
}

.theme-dark a:hover,
.theme-dark a:active,
.theme-dark a:focus {
  color: #1d7be3;
  text-decoration: none;
}

.theme-dark button::selection {
  background-color: none;
}

.theme-dark .as-btn {
  font-size: 90%;
  width: 47%;
  background-color: #1A2531;
  color: white;
  padding: 1.5vh;
  outline: none !important;
}

.theme-dark .as-btn:disabled {
  color: #bebfc1;
}

.theme-dark .as-btn:hover:enabled, .theme-dark .btn:focus:enabled, .theme-dark .as-btn:active {
  color: #fff;
  background-color: #1d7be3;
}

.theme-dark .list-group {
  -webkit-box-shadow: none;
  box-shadow: none;
}

.theme-dark .list-group-item:hover {
  background-color: transparent;
  color: #fff;
}

.theme-dark .list-group-item.active,
.theme-dark .list-group-item.focus {
  background-color: #1d7be3 !important;
  color: #fff;
}

.theme-dark .progress-bar {
  background-color: #1d7be3;
}

.theme-dark .as-keyboard {
  background-color: #2f3237;
  color: #fff;
}

.theme-dark .as-keyboard .key-primary {
  background-color: #43484e;
  color: #bebfc1;
}

.theme-dark .as-keyboard .key-focus, .theme-dark .as-keyboard .key-selected, .theme-dark .as-keyboard .key:active {
  background-color: #1d7be3;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  border-radius: 0px;
}

sidebar, .sidebar {
  display: flex;
  color: white;
  background-color: #040b17;
  cursor: pointer;
  pointer-events: all;
  z-index: 3;
  position: relative;
}

sidebar .sidebar-container, .sidebar .sidebar-container {
  width: 4.5vmax;
}

sidebar .sidebar-container-open .icon-container-slide, .sidebar .sidebar-container-open .icon-container-slide {
  transform: translateX(0);
}

sidebar .icon-container, .sidebar .icon-container {
  display: flex;
  z-index: 2;
  position: relative;
  height: 100%;
  flex-direction: column;
  padding: 2vmin 0;
  align-content: center;
  overflow: hidden;
  background-color: #040b17;
}

sidebar .icon-container .menu-icon-container, .sidebar .icon-container .menu-icon-container {
  display: flex;
  flex-direction: column;
}

sidebar .icon-container .menu-icon-selected, .sidebar .icon-container .menu-icon-selected {
  position: relative;
}

sidebar .icon-container .menu-icon-selected .menu-selected-edge, .sidebar .icon-container .menu-icon-selected .menu-selected-edge {
  position: absolute;
  height: 80%;
  top: 10%;
  left: 0;
  width: 0.5vmin;
  background-color: #1d7be3;
}

sidebar .icon-container .menu-icon-selected i, .sidebar .icon-container .menu-icon-selected i {
  opacity: 1 !important;
}

sidebar .icon-container .menu-label-selected, .sidebar .icon-container .menu-label-selected {
  opacity: 1 !important;
}

sidebar .icon-container .menu-icon, .sidebar .icon-container .menu-icon {
  padding: 2vmin 0;
  display: flex;
  align-items: center;
  flex-direction: row;
  width: 25vmax;
}

sidebar .icon-container .menu-icon i, .sidebar .icon-container .menu-icon i {
  opacity: 0.6;
  line-height: 0.9;
  width: 4.5vmax;
  font-size: 300%;
  text-align: center;
}

sidebar .icon-container .menu-icon .icon-recent, .sidebar .icon-container .menu-icon .icon-recent {
  font-size: 340%;
}

sidebar .icon-container .menu-icon .icon-search, .sidebar .icon-container .menu-icon .icon-search {
  font-size: 260%;
}

sidebar .icon-container .sub-menu-label-collection, .sidebar .icon-container .sub-menu-label-collection {
  display: block;
  flex-direction: column;
  width: 25vmax;
  max-height: 47vmin;
  overflow-y: scroll;
  margin-top: -1vmin;
  padding-bottom: 2vmin;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

sidebar .icon-container .sub-menu-label-collection ::-webkit-scrollbar, .sidebar .icon-container .sub-menu-label-collection ::-webkit-scrollbar {
  display: none;
}

@media screen and (orientation: portrait) {
  sidebar .icon-container .sub-menu-label-collection, .sidebar .icon-container .sub-menu-label-collection {
    max-height: calc(100vh - 55vmin);
  }
}

sidebar .icon-container .sub-menu-label-collection span, .sidebar .icon-container .sub-menu-label-collection span {
  display: block;
  min-width: 100%;
  max-width: 100%;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

sidebar .icon-container .menu-label, .sidebar .icon-container .menu-label {
  margin-left: 0.5vmax;
  margin: 1vmin 0;
  font-size: 170%;
  opacity: 0.6;
  font-family: Roboto-Medium;
}

sidebar .icon-container .sub-menu-label, .sidebar .icon-container .sub-menu-label {
  opacity: 0.6;
  margin: 0;
  padding: 2vmin 2.5vmin 2vmin 4.6vmax;
}

sidebar .icon-container-slide, .sidebar .icon-container-slide {
  position: absolute !important;
  top: 0;
  left: 0;
  width: 25vmax;
  height: 100%;
  transform: translateX(-100%);
  background-color: #040b17;
  -webkit-transition: transform 0.5s;
  /* Safari */
  transition: transform 0.5s;
  z-index: 1 !important;
  flex-flow: row wrap;
  align-content: flex-start;
}
