html {
  height: 100%;
}
body,
h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol {
  margin: 0;
  padding: 0;
}
body {
  height: 100%;
  color: #5F5F5F;
  background: #EAEAEA;
  font-family: Helvetica Neue, Helvetica;
  font-size: 100%;
  font-weight: 300;
}
.center-center {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  text-align: center;
}
.center-center > * {
  margin: auto;
}
.wrapper {
  position: absolute;
  height: 100%;
  width: 100%;
}
.main {
  height: 100%;
  margin-right: 100px;
  overflow: auto;
}
.sidebar {
  position: fixed;
  top: 0;
  right: 0;
  width: 100px;
  height: 100%;
  background-color: #FFFFFF;
  min-height: 900px;
  z-index: 1;
}
.logo {
  height: 52px;
  background: url("Images/logo.png") center center no-repeat;
}
.device-toolbar {
  position: absolute;
  top: 52px;
}
.device-options-toolbar {
  position: absolute;
  bottom: 0;
}
.toolbar-item {
  width: 100px;
  height: 100px;
  cursor: default;
}
.toolbar-item img {
  display: block;
  margin-bottom: 10px;
}
.toolbar-item:hover {
  background-color: #F3F3F3;
}
.toolbar-item .active {
  display: none;
}
.toolbar-item.active {
  color: #FF502B;
}
.toolbar-item.active .normal {
  display: none;
}
.toolbar-item.active .active {
  display: block;
}
.toolbar-item .zoom-in {
  display: none;
}
.toolbar-item.zoom-in .zoom-out {
  display: none;
}
.toolbar-item.zoom-in .zoom-in {
  display: block;
}