@charset "UTF-8";
/* Inevio Main CSS */
/*

    Element z-index:

    z-index: 999 -> Launchpad
    z-index: 9991 -> Apps labelbod

*/
/* Basic Rules */
html {
  height: 100%;
}
body {
  width: 100%;
  height: 100%;
  float: left;
  overflow: hidden;
  background: #1e1e1e url('') center center no-repeat;
  background-size: cover;
  zoom: 1;
}
progress {
  border: none;
  background: #f00;
  background-size: auto auto;
  color: #0f0;
  /*For IE10*/

  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
}
progress:not([value]) {
  background: #00f;
  background-size: auto;
}
progress:not([value])::-moz-progress-bar {
  background: #00f;
}
progress:not([value])::-webkit-progress-bar {
  background: #00f;
}
progress::-moz-progress-bar {
  background: #0f0;
}
progress::-webkit-progress-bar {
  background: #f00;
}
progress::-webkit-progress-value {
  background: #0f0;
}
.wz-prototype,
.wz-download-iframe {
  display: none !important;
}
.ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.wz-scroll {
  overflow: hidden !important;
  position: relative;
}
.wz-scroll-textarea {
  position: absolute;
}
.wz-scroll-bar {
  position: absolute;
  background-color: #dadada;
  z-index: 1;
  /* To Do -> Valorar meter 99999 */

  opacity: 0;
  border-radius: 6px;
}
/* To Do -> Hay mas reglas de la barra de scroll abajo, fusionarlas */
.wz-scroll-bar-vertical {
  width: 6px;
  margin: 5px 3px 5px 0;
  right: 0;
}
.wz-scroll-bar-horizontal {
  height: 6px;
  margin: 0 5px 3px 5px;
  bottom: 0;
}
.wz-scroll-slider {
  background-color: #c2c2c2;
  border-radius: 5px;
}
.wz-scroll-bar-vertical .wz-scroll-slider {
  width: 6px;
  height: 0;
  max-height: 70%;
}
.wz-scroll-bar-horizontal .wz-scroll-slider {
  height: 6px;
  width: 0;
  max-width: 70%;
}
.wz-scroll-bottom {
  width: 100%;
}
.wz-scroll-drag {
  overflow: hidden;
}
.wz-scroll-drag:hover,
.wz-scroll-drag:hover * {
  cursor: grab;
  cursor: -webkit-grab;
  cursor: -moz-grab;
}
body.wz-scroll-dragging,
body.wz-scroll-dragging * {
  cursor: grabbing !important;
  cursor: -webkit-grabbing !important;
  cursor: -moz-grabbing !important;
}
input:focus,
textarea:focus {
  outline: none;
}
/* Background */
body.login,
body.register,
body.contact,
body.maintenance {
  background-image: url('');
}
body.login *,
body.register *,
body.contact *,
body.maintenance * {
  font-family: 'Lato', 'Open Sans', 'Effra', helvetica, arial, verdana, sans-serif !important;
}
/* Desktop */
#wz-desktop {
  float: left;
  -webkit-backface-visibility: hidden;
  z-index: 0;
  position: relative;
}
/* Wallpaper */
#wz-wallpaper {
  height: 100%;
  width: 100%;
  position: absolute;
  z-index: -1;
}
#wz-wallpaper img {
  position: absolute;
}
/* Uploader */
#wz-uploader {
  display: none;
}
/* Taskbar */
#wz-taskbar {
  float: left;
  width: 50px;
  background-color: rgba(36, 41, 47, 0.902);
  z-index: 1;
  position: relative;
}
#wz-taskbar .wz-scroll-bar-vertical {
  z-index: 3;
}
#wz-taskbar .wz-scroll-bar-vertical {
  width: 5px;
  background: transparent;
  z-index: 3;
}
#wz-taskbar .wz-scroll-bar-vertical .wz-scroll-slider {
  width: 5px;
  background: rgba(0, 0, 0, 0.2);
}
#wz-taskbar-area {
  float: left;
  width: 60px;
  border-top: 0px;
  padding-top: 6px;
  overflow-y: hidden;
  overflow-x: auto;
  position: initial;
}
#wz-taskbar-label {
  position: absolute;
  background: #FFF;
  box-shadow: 0 0 1px rgba(0, 0, 0, 0.7);
  padding: 5px 8px;
  border-radius: 3px;
  left: 76px;
  display: none;
  z-index: 999991;
  white-space: nowrap;
}
#wz-taskbar-label:after,
#wz-taskbar-label:before {
  right: 100%;
  border: 1px solid transparent;
  content: " ";
  width: 0;
  height: 0;
  position: absolute;
  pointer-events: none;
}
#wz-taskbar-label:after {
  top: 50%;
  margin-top: -5px;
  border-width: 5px;
  border-color: rgba(136, 183, 213, 0);
  border-right-color: #FFF;
}
#wz-taskbar-label:before {
  top: 50%;
  margin-top: -6px;
  border-width: 6px;
  border-color: rgba(194, 225, 245, 0);
  border-right-color: rgba(0, 0, 0, 0.25);
}
#wz-taskbar-label span {
  font-size: 14px;
  color: #646464;
}
#wz-taskbar-peek {
  position: absolute;
  left: 60px;
  margin-top: -8px;
  z-index: 99991;
  display: none;
  overflow: hidden;
  background: #FFF;
  border-radius: 3px;
  padding: 5px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25);
}
#wz-taskbar-peek.show {
  display: block;
}
#wz-taskbar-peek figure {
  width: 80px;
  height: 56px;
  padding-top: 24px;
  float: left;
  clear: both;
  margin-bottom: 6px;
  border-radius: 3px;
  text-align: center;
  background: #666;
  border: 1px solid #4B4B4B;
}
#wz-taskbar-peek figure:last-child {
  margin: 0;
}
#wz-taskbar-peek figure:hover {
  background: #7ebe30;
  border: 1px solid #4E9C21;
}
#wz-taskbar-peek span {
  font-size: 30px;
  color: #FFF;
}
#wz-taskbar-clock {
  float: left;
  padding: 10px 0 8px;
  width: 60px;
}
#wz-taskbar .wz-taskbar-clock-hour {
  float: left;
  padding-left: 1px;
  width: 45px;
  color: #fff;
  text-align: right;
  letter-spacing: -1px;
  font-size: 13px;
  font-family: Lato;
}
#wz-taskbar-launcher {
  /*
    position: absolute;
    bottom: 0;
    */

  float: left;
  width: 60px;
  height: 31px;
  border-top: 1px solid #3d464d;
  background-image: -moz-linear-gradient(90deg, #24292f 0%, #394048 100%);
  background-image: -webkit-linear-gradient(90deg, #24292f 0%, #394048 100%);
  background-image: -ms-linear-gradient(90deg, #24292f 0%, #394048 100%);
  display: none;
}
#wz-taskbar-launcher:hover {
  border-top: 1px solid rgba(255, 255, 255, 0.25);
  background-image: -moz-linear-gradient(bottom, rgba(145, 201, 11, 0.5), rgba(166, 226, 22, 0.5));
  background-image: -webkit-linear-gradient(bottom, rgba(145, 201, 11, 0.5), rgba(166, 226, 22, 0.5));
  background-image: -o-linear-gradient(bottom, rgba(145, 201, 11, 0.5), rgba(166, 226, 22, 0.5));
  background-image: linear-gradient(to top, rgba(145, 201, 11, 0.5), rgba(166, 226, 22, 0.5));
}
body.launchpad #wz-taskbar-launcher {
  border-top: 1px solid #aeca65;
  background-image: -moz-linear-gradient(bottom, #7cab0c, #93b831);
  background-image: -webkit-linear-gradient(bottom, #7cab0c, #93b831);
  background-image: -o-linear-gradient(bottom, #7cab0c, #93b831);
  background-image: linear-gradient(to top, #7cab0c, #93b831);
}
#wz-taskbar-launcher figure {
  width: 18px;
  height: 19px;
  margin: 6px 21px 3px;
  background: url('') 0 0;
  background-size: 36px 19px;
}
body.launchpad #wz-taskbar-launcher figure {
  background-position: -18px 0;
}
#wz-taskbar .wz-app-icon {
  width: 60px;
  height: 42px;
  float: left;
}
#wz-taskbar .wz-app-icon:hover {
  background-color: #3d464d;
}
#wz-taskbar .wz-app-icon.unloaded {
  opacity: 0.5;
}
#wz-taskbar .wz-app-icon i {
  width: 2px;
  height: 32px;
  float: left;
  margin-top: 4px;
  transition-property: height, margin-top;
  transition-duration: 0.2s;
  transition-timing-function: ease-out;
}
#wz-taskbar .wz-app-icon.opened i {
  background: #FFF;
  opacity: 0;
}
#wz-taskbar .wz-app-icon:hover i {
  height: 42px !important;
  margin-top: 0 !important;
}
#wz-taskbar .wz-app-icon img {
  width: 34px;
  height: 34px;
  float: left;
  margin-left: 11px;
  margin-top: 4px;
}
#wz-taskbar .wz-app-icon figcaption {
  display: none;
}
#wz-taskbar .wz-app-icon[data-notifications],
#wz-launchpad .wz-launchpad-app[data-notifications] {
  position: relative;
}
#wz-taskbar .wz-app-icon[data-notifications]:after,
#wz-launchpad .wz-launchpad-app[data-notifications]:after {
  position: absolute;
  top: -1px;
  right: 10px;
  height: 15px;
  padding: 1px 5px;
  background-image: -moz-linear-gradient(bottom, #c04a3f 0%, #d56057 100%);
  background-image: -o-linear-gradient(bottom, #c04a3f 0%, #d56057 100%);
  background-image: linear-gradient(to top, #e53a40 0%, #f05056 100%);
  color: #fff;
  content: attr(data-notifications);
  text-align: center;
  font-size: 11px;
  line-height: 14px;
  border-radius: 9px;
  font-family: 'Lato';
  -webkit-box-shadow: 0 1px 2px rgba(0, 1, 1, 0.2);
  -moz-box-shadow: 0 1px 2px rgba(0, 1, 1, 0.2);
  box-shadow: 0 1px 2px rgba(0, 1, 1, 0.2);
}
#wz-launchpad .wz-launchpad-app[data-notifications]:after {
  position: absolute;
  height: 30px;
  width: 30px;
  font-size: 19px;
  line-height: 29px;
  top: 1px;
  right: 20px;
}
#wz-taskbar .wz-app-icon[data-notifications=""]:after,
#wz-launchpad .wz-launchpad-app[data-notifications=""]:after {
  display: none;
}
#wz-launchpad {
  width: 0;
  position: absolute;
  left: 60px;
  display: none;
  background: rgba(36, 36, 36, 0.6);
  box-shadow: -1px 0 0 rgba(255, 255, 255, 0.15) inset;
  border-right: 1px solid rgba(0, 0, 0, 0.15);
  z-index: 99999;
  padding: 30px;
  overflow: hidden;
  line-height: 10px;
}
/*
#wz-launchpad-finder{
    width: 268px;
    height: 32px;
    border: 1px solid rgba( 0, 0, 0, 0.8 );
    border-radius: 3px;
    background: #FFF;
    float: left;
}

#wz-launchpad-finder img{
    float: left;
    margin: 9px 10px;
}

#wz-launchpad-finder input{
    width: 219px;
    padding: 8px 10px 7px 5px;
    font-size: 14px;
    color: #646464;
    float: left;
    border-radius: 3px;
}

#wz-launchpad-finder input::-webkit-input-placeholder {
   color: #B1B1B7;
   line-height: 18px;
}

#wz-launchpad-finder input:-moz-placeholder { /* Firefox 18- *//*
   color: #B1B1B7;
}

#wz-launchpad-finder input::-moz-placeholder {  /* Firefox 19+ *//*
   color: #B1B1B7;
}

#wz-launchpad-finder input:-ms-input-placeholder {
   color: #B1B1B7;
}
*/
#wz-launchpad-logout {
  float: right;
  height: 34px;
}
/*.changing-launchpad #wz-launchpad-logout{
    display: none;
}*/
#wz-launchpad-logout span {
  float: right;
  color: rgba(255, 255, 255, 0.7);
  font-size: 14px;
  margin-right: 15px;
  margin-top: 12px;
}
#wz-launchpad-logout:hover span {
  color: #FFF;
}
#wz-launchpad-logout:active span {
  color: rgba(255, 255, 255, 0.7);
}
#wz-launchpad-logout figure {
  width: 34px;
  height: 34px;
  float: right;
  background: url('') no-repeat 0 0;
  background-size: 102px 34px;
}
#wz-launchpad-logout:hover figure {
  background-position: -34px 0;
}
#wz-launchpad-logout:active figure {
  background-position: -68px 0;
}
#wz-launchpad-apps {
  float: left;
  text-align: center;
  margin-top: 40px;
}
#wz-launchpad-apps .wz-launchpad-app {
  width: 100px;
  display: inline-block;
  vertical-align: top;
  text-align: center;
  margin: 0 10px 20px;
  border: 1px solid transparent;
  border-radius: 3px;
  padding: 10px;
}
#wz-launchpad-apps .wz-launchpad-false-app {
  width: 100px;
  height: 93px;
  display: inline-block;
  vertical-align: top;
  text-align: center;
  margin: 0 10px 20px;
  border: 1px solid transparent;
  border-radius: 3px;
  padding: 10px;
  opacity: 0;
}
#wz-launchpad-apps .wz-launchpad-app:hover {
  background: rgba(147, 184, 49, 0.25);
  border: 1px solid #7CAB0C;
}
#wz-launchpad-apps .wz-launchpad-app img {
  width: 70px;
  height: 70px;
  display: inline-block;
}
#wz-launchpad-apps .wz-launchpad-app figcaption {
  width: 100px;
  display: inline-block;
  text-align: center;
  margin-top: 10px;
  color: #FFF;
  font-size: 14px;
  line-height: 15px;
}
/*
#wz-launchpad-pages{
    height: 12px;
    float: left;
    text-align: center;
}

#wz-launchpad-pages figure{
    width: 12px;
    height: 12px;
    display: inline-block;
}

#wz-launchpad-pages i{
    width: 8px;
    height: 8px;
    margin-top: 2px;
    margin-left: 2px;
    border-radius: 4px;
    background: #707D75;
    display: block;
}

#wz-launchpad-pages .active i{
    background: #FFF;
}
*/
/* Banner Notifications */
#wz-notification {
  position: absolute;
  top: 15px;
  right: 15px;
  width: 274px;
  z-index: 999999;
}
#wz-notification .wz-banner {
  float: left;
  width: 268px;
  margin-bottom: 15px;
  border-radius: 3px;
  background-image: -moz-linear-gradient(bottom, rgba(23, 23, 23, 0.75), rgba(53, 53, 53, 0.75));
  background-image: -webkit-linear-gradient(bottom, rgba(23, 23, 23, 0.75), rgba(53, 53, 53, 0.75));
  background-image: -o-linear-gradient(bottom, rgba(23, 23, 23, 0.75), rgba(53, 53, 53, 0.75));
  background-image: linear-gradient(to top, rgba(23, 23, 23, 0.75), rgba(53, 53, 53, 0.75));
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.75), inset 0 1px rgba(255, 255, 255, 0.1);
  position: relative;
}
#wz-notification .wz-banner-left {
  width: 32px;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  padding: 0 10px;
  background: rgba(0, 0, 0, 0.2);
  box-shadow: 1px 0 rgba(0, 0, 0, 0.35), inset -1px 0 rgba(255, 255, 255, 0.1);
  height: 100%;
  position: absolute;
}
#wz-notification .wz-banner-right {
  float: right;
  width: 186px;
  min-height: 30px;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
  padding: 12px 15px;
}
#wz-notification .wz-banner-left img {
  max-height: 32px;
  max-width: 32px;
  display: inline-block;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
#wz-notification .wz-banner header {
  width: 100%;
  display: block;
  float: left;
  color: #FFF;
  font-size: 13px;
  height: 14px;
  max-width: 180px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
#wz-notification .wz-banner p {
  float: left;
  clear: left;
  color: #CECECE;
  font-size: 11px;
  line-height: 12px;
  margin-top: 4px;
  width: 180px;
  max-height: 98px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
#wz-notification .wz-banner header:empty,
#wz-notification .wz-banner p:empty {
  display: none;
}
#wz-notification .wz-banner-button {
  width: 67px;
  float: left;
  padding: 6px 10px;
  border-radius: 3px;
  background-image: -moz-linear-gradient(bottom, #2e2e2e, #383838);
  background-image: -webkit-linear-gradient(bottom, #2e2e2e, #383838);
  background-image: -o-linear-gradient(bottom, #2e2e2e, #383838);
  background-image: linear-gradient(to top, #2e2e2e, #383838);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
  border: 1px solid #252525;
  margin-top: 10px;
}
#wz-notification .wz-banner-button:hover {
  background-image: -moz-linear-gradient(bottom, #3a3a3a, #3e3e3e);
  background-image: -webkit-linear-gradient(bottom, #3a3a3a, #3e3e3e);
  background-image: -o-linear-gradient(bottom, #3a3a3a, #3e3e3e);
  background-image: linear-gradient(to top, #3a3a3a, #3e3e3e);
}
#wz-notification .wz-banner-button:active {
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
  background-image: -moz-linear-gradient(top, #333333, #383838);
  background-image: -webkit-linear-gradient(top, #333333, #383838);
  background-image: -o-linear-gradient(top, #333333, #383838);
  background-image: linear-gradient(to bottom, #333333, #383838);
}
#wz-notification .wz-banner-button-right {
  float: right;
}
#wz-notification .wz-banner-button i {
  float: left;
  width: 16px;
  height: 16px;
  margin-right: 4px;
  background: url('../image/notification/button.png') no-repeat;
  background-size: 32px 16px;
  display: none;
}
#wz-notification .wz-banner-button span {
  width: 100%;
  float: left;
  text-align: center;
  font-size: 11px;
  color: #FFF;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
#wz-notification .wz-banner-button.accept {
  background-image: -moz-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: -webkit-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: -o-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: linear-gradient(to top, #00aeef, #52cae0);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), inset 0 1px rgba(255, 255, 255, 0.2);
  padding: 6px 10px 3px;
  width: 69px;
  border: none;
}
#wz-notification .wz-banner-button.accept:hover {
  background-image: -moz-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: -webkit-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: -o-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: linear-gradient(to top, #00aeef, #52cae0);
}
#wz-notification .wz-banner-button.accept:active {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), inset 0 1px 1px rgba(0, 0, 0, 0.2);
  background-image: -moz-linear-gradient(top, #00aeef, #52cae0);
  background-image: -webkit-linear-gradient(top, #00aeef, #52cae0);
  background-image: -o-linear-gradient(top, #00aeef, #52cae0);
  background-image: linear-gradient(to bottom, #00aeef, #52cae0);
}
#wz-notification .wz-banner-button.accept i {
  background-position: 0 0;
  display: block;
}
#wz-notification .wz-banner-button.accept span {
  width: 46px;
  margin-top: 1px;
  text-align: left;
}
#wz-notification .wz-banner-button.cancel {
  background-image: -moz-linear-gradient(bottom, #b83e38, #da605b);
  background-image: -webkit-linear-gradient(bottom, #b83e38, #da605b);
  background-image: -o-linear-gradient(bottom, #b83e38, #da605b);
  background-image: linear-gradient(to top, #b83e38, #da605b);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), inset 0 1px rgba(255, 255, 255, 0.2);
  padding: 6px 10px 3px;
  width: 69px;
  border: none;
}
#wz-notification .wz-banner-button.cancel:hover {
  background-image: -moz-linear-gradient(bottom, #d14841, #e56964);
  background-image: -webkit-linear-gradient(bottom, #d14841, #e56964);
  background-image: -o-linear-gradient(bottom, #d14841, #e56964);
  background-image: linear-gradient(to top, #d14841, #e56964);
}
#wz-notification .wz-banner-button.cancel:active {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4), inset 0 1px 1px rgba(0, 0, 0, 0.2);
  background-image: -moz-linear-gradient(top, #b7443e, #c6534e);
  background-image: -webkit-linear-gradient(top, #b7443e, #c6534e);
  background-image: -o-linear-gradient(top, #b7443e, #c6534e);
  background-image: linear-gradient(to bottom, #b7443e, #c6534e);
}
#wz-notification .wz-banner-button.cancel i {
  background-position: -16px 0;
  display: block;
}
#wz-notification .wz-banner-button.cancel span {
  width: 46px;
  margin-top: 1px;
  text-align: left;
}
#wz-notification .wz-banner-close {
  display: none;
  position: absolute;
  top: -10px;
  right: -10px;
  width: 10px;
  height: 10px;
  padding: 5px;
  border-radius: 11px;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
  border: 1px solid #252525;
  background-image: -moz-linear-gradient(bottom, #2e2e2e, #383838);
  background-image: -webkit-linear-gradient(bottom, #2e2e2e, #383838);
  background-image: -o-linear-gradient(bottom, #2e2e2e, #383838);
  background-image: linear-gradient(to top, #2e2e2e, #383838);
}
#wz-notification .wz-banner-close:hover {
  background-image: -moz-linear-gradient(bottom, #3a3a3a, #3e3e3e);
  background-image: -webkit-linear-gradient(bottom, #3a3a3a, #3e3e3e);
  background-image: -o-linear-gradient(bottom, #3a3a3a, #3e3e3e);
  background-image: linear-gradient(to top, #3a3a3a, #3e3e3e);
}
#wz-notification .wz-banner-close:active {
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
  background-image: -moz-linear-gradient(top, #333333, #383838);
  background-image: -webkit-linear-gradient(top, #333333, #383838);
  background-image: -o-linear-gradient(top, #333333, #383838);
  background-image: linear-gradient(to bottom, #333333, #383838);
}
#wz-notification .wz-banner-close i {
  width: 10px;
  height: 9px;
  float: left;
  display: block;
  background: url('../image/win_buttons.png') no-repeat;
  background-size: 30px 27px;
  background-position: -20px 0;
}
/* App */
.wz-view-container {
  position: absolute;
}
.wz-view {
  width: 544px;
  height: 550px;
  border-radius: 3px;
  box-shadow: 0 25px 25px 0 rgba(0, 0, 0, 0.25), 0 0 25px 5px rgba(0, 0, 0, 0.2);
  background: #fff;
  display: block;
  overflow: hidden;
  position: relative;
}
.wz-app-focus .wz-view {
  box-shadow: 0 25px 25px 0 rgba(0, 0, 0, 0.5), 0 0 25px 5px rgba(0, 0, 0, 0.25);
}
.wz-view.wz-view-maximized {
  border-radius: 0;
}
.wz-view.wz-view-minimized {
  display: none;
}
.wz-widget {
  position: absolute;
  /*overflow: hidden;*/

}
#wz-view-prototype,
#wz-widget-prototype {
  display: none;
}
.wz-view-resizer-n {
  width: 100%;
  height: 6px;
  position: absolute;
  top: -3px;
  z-index: 1;
  cursor: n-resize;
}
.wz-view-resizer-e {
  width: 6px;
  height: 100%;
  position: absolute;
  top: 0;
  right: -3px;
  z-index: 1;
  cursor: e-resize;
}
.wz-view-resizer-s {
  width: 100%;
  height: 6px;
  position: absolute;
  bottom: -3px;
  z-index: 1;
  cursor: s-resize;
}
.wz-view-resizer-w {
  width: 6px;
  height: 100%;
  position: absolute;
  top: 0;
  left: -3px;
  z-index: 1;
  cursor: w-resize;
}
.wz-view-resizer-ne {
  width: 6px;
  height: 6px;
  position: absolute;
  top: -3px;
  right: -3px;
  z-index: 1;
  cursor: ne-resize;
}
.wz-view-resizer-se {
  width: 6px;
  height: 6px;
  position: absolute;
  bottom: -3px;
  right: -3px;
  z-index: 1;
  cursor: se-resize;
}
.wz-view-resizer-sw {
  width: 6px;
  height: 6px;
  position: absolute;
  bottom: -3px;
  left: -3px;
  z-index: 1;
  cursor: sw-resize;
}
.wz-view-resizer-nw {
  width: 6px;
  height: 6px;
  position: absolute;
  top: -3px;
  left: -3px;
  z-index: 1;
  cursor: nw-resize;
}
.wz-view-maximized .wz-view-n,
.wz-view-maximized .wz-view-e,
.wz-view-maximized .wz-view-s,
.wz-view-maximized .wz-view-w,
.wz-view-maximized .wz-view-ne,
.wz-view-maximized .wz-view-se,
.wz-view-maximized .wz-view-sw,
.wz-view-maximized .wz-view-nw {
  display: none;
}
.wz-view-minimize,
.wz-view-maximize,
.wz-view-close {
  width: 10px;
  height: 9px;
  padding: 6px;
  float: left;
  border: 1px solid transparent;
  border-radius: 2px;
}
.wz-view-minimize:hover,
.wz-view-maximize:hover,
.wz-view-close:hover {
  border: 1px solid #999;
}
.wz-view-maximize,
.wz-view-close {
  margin-left: 5px;
}
.wz-view-minimize i,
.wz-view-maximize i,
.wz-view-close i {
  width: 10px;
  height: 9px;
  display: block;
  background: url('../image/win_buttons.png') no-repeat;
  background-size: 30px 27px;
}
.wz-view-minimize i {
  background-position: 0 -18px;
}
.dark .wz-view-minimize i {
  background-position: 0 0;
}
.wz-view-maximize i {
  background-position: -10px -18px;
}
.dark .wz-view-maximize i {
  background-position: -10px 0;
}
.wz-view-close i {
  background-position: -20px -18px;
}
.dark .wz-view-close i {
  background-position: -20px 0;
}
.wz-view-option {
  float: left;
  padding: 6px;
  border: 1px solid transparent;
  border-radius: 2px;
}
.wz-view-option.right {
  float: right;
}
.wz-view-option:hover {
  border: 1px solid #999;
}
.wz-view-menu.dark {
  border-bottom: 1px solid #000;
  background-image: -moz-linear-gradient(50% 0% -90deg, #303030 0%, #1a1a1a 100%);
  background-image: -webkit-linear-gradient(-90deg, #303030 0%, #1a1a1a 100%);
  background-image: -o-linear-gradient(-90deg, #303030 0%, #1a1a1a 100%);
  background-image: linear-gradient(0deg, #1a1a1a 0%, #303030 100%);
}
.wz-view-menu-radius {
  border-radius: 3px 3px 0 0;
}
.wz-view-maximized .wz-view-menu-radius {
  border-radius: 0;
}
.wz-view-menu-group {
  float: left;
  padding: 10px 20px 6px;
  height: 24px;
  border-right: 1px solid #e0e0e0;
}
.wz-ui-header.dark .wz-view-menu-group {
  border-right: 1px solid #252525;
  box-shadow: -1px 0 rgba(255, 255, 255, 0.1) inset;
}
.wz-view-menu-group.right {
  float: right;
}
.wz-view-menu-group:last-child {
  border-right: none;
  border-left: 1px solid #e0e0e0;
}
.wz-ui-header.dark .wz-view-menu-group:last-child {
  border-right: none;
  border-left: 1px solid #252525;
  box-shadow: -1px 0 rgba(255, 255, 255, 0.1);
}
.wz-view-minimized .wz-view-resizer {
  display: none;
}
/* Context Menu */
#wz-contextmenu {
  position: absolute;
  min-width: 161px;
  max-width: 300px;
  list-style: none;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25);
  border-radius: 3px;
  background: #FFF;
}
#wz-contextmenu:empty {
  display: none;
}
#wz-contextmenu li {
  padding: 10px 16px;
  color: #646464;
  font-size: 14px;
}
#wz-contextmenu li:hover {
  background: #EAF3E7;
  box-shadow: 0 1px 0 #c9eabe inset, 0 -1px 0 #c9eabe inset;
}
#wz-contextmenu li.disabled {
  background: #e6e6e6;
  color: rgba(100, 100, 100, 0.7);
  box-shadow: none;
}
#wz-contextmenu li.warning {
  box-shadow: none;
  background: rgba(220, 81, 58, 0.8);
  color: #FFFEFE;
}
#wz-contextmenu li.warning:hover {
  background: #DC513A;
}
/* LOGIN */
#wz-login hr {
  width: 276px;
  float: left;
  margin-top: 12px;
  border: none;
  border-top: 1px solid #FFF;
}
#wz-login .wz-login-button,
#wz-login .wz-register-button {
  border-radius: 3px;
  background-color: #36ABFF;
  background-image: -moz-linear-gradient(50% 0% -90deg, #3cb5ff 0%, #2c99ff 100%);
  background-image: -webkit-linear-gradient(-90deg, #3cb5ff 0%, #2c99ff 100%);
  background-image: -o-linear-gradient(-90deg, #3cb5ff 0%, #2c99ff 100%);
  background-image: linear-gradient(0deg, #2c99ff 0%, #3cb5ff 100%);
  border-top: 1px solid #50BDFF;
  box-shadow: 0 1px 2px #161616;
  color: #FFF;
  cursor: pointer;
  box-sizing: content-box;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
}
#wz-login .wz-login-button:hover,
#wz-login .wz-register-button:hover {
  background-color: #54B8FF;
  background-image: -moz-linear-gradient(50% 0% -90deg, #4dc5ff 0%, #38afff 100%);
  background-image: -webkit-linear-gradient(-90deg, #4dc5ff 0%, #38afff 100%);
  background-image: -o-linear-gradient(-90deg, #4dc5ff 0%, #38afff 100%);
  background-image: linear-gradient(0deg, #38afff 0%, #4dc5ff 100%);
  border-top: 1px solid #60CBFF;
}
#wz-login .wz-login-button-disabled,
#wz-login .wz-login-button-disabled:hover {
  background: rgba(58, 58, 58, 0.2);
  border-top: 1px solid #333;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
  color: #666;
  cursor: default;
}
#wz-login .wz-login-input {
  border: 1px solid transparent;
}
#wz-login .wz-login-input:focus {
  border: 1px solid #56B4EF;
  box-shadow: 0 0 3px rgba(82, 168, 236, 0.6), inset 0 0 3px rgba(82, 168, 236, 0.3);
}
#wz-login {
  width: 880px;
  height: 500px;
  margin: 0 auto;
}
#wz-login header {
  width: 880px;
  height: 120px;
  text-align: center;
}
#wz-login header figure {
  width: 234px;
  height: 53px;
  display: inline-block;
  margin-top: 30px;
  background: url('../image/logo.png');
  background-size: cover;
}
#wz-login header span {
  display: inline-block;
  margin-left: 30px;
  margin-top: 50px;
  font-size: 26px;
  color: #FFF;
  vertical-align: top;
}
#wz-login .wz-login-left {
  float: left;
  margin-left: 15px;
  width: 500px;
  padding: 15px;
  background: #3E3E3E;
  border-radius: 3px;
  text-align: center;
}
#wz-login button {
  width: 135px;
  height: 32px;
  margin-top: 10px;
  padding: 0 10px;
  font-size: 15px;
  line-height: 16px;
  display: inline-block;
}
#wz-login .wz-login-right {
  float: right;
  margin-right: 15px;
  width: 306px;
}
#wz-login .wz-login-right article {
  width: 276px;
  padding: 15px;
  background: #3E3E3E;
  border-radius: 3px;
}
#wz-login .wz-login-start {
  height: 145px;
  font-size: 12px;
  color: #AAA;
}
#wz-login .wz-login-mail {
  height: 126px;
  margin-top: 25px;
  text-align: center;
}
#wz-login .wz-login-sign {
  float: left;
  font-size: 16px;
  color: #FFF;
}
#wz-login .wz-login-username {
  width: 256px;
  height: 28px;
  float: left;
  margin-top: 12px;
  border-radius: 3px;
  padding: 0 9px;
  font-size: 13px;
  color: #222;
  background: #FFF;
}
#wz-login .wz-login-password {
  width: 180px;
  height: 28px;
  float: left;
  margin-top: 12px;
  border-radius: 3px;
  padding: 0 9px;
  font-size: 13px;
  color: #222;
  background: #FFF;
}
#wz-login input::-webkit-input-placeholder {
  padding-top: 2px;
  color: #666;
}
#wz-login input:-moz-placeholder {
  color: #000;
}
#wz-login input::-moz-placeholder {
  color: #000;
}
#wz-login input:-ms-input-placeholder {
  padding-top: 2px;
  color: #666;
}
#wz-login .wz-login-submit {
  width: 71px;
  height: 30px;
  float: left;
  margin-top: 12px;
  margin-left: 5px;
  font-size: 13px;
}
#wz-login .wz-login-checkbox {
  float: left;
  margin-top: 16px;
  cursor: pointer;
}
#wz-login .wz-login-remember {
  float: left;
  margin-left: 5px;
  margin-top: 17px;
  cursor: pointer;
}
#wz-login .wz-login-dot {
  float: left;
  margin-left: 10px;
  margin-top: 17px;
}
#wz-login .wz-login-forgot {
  float: left;
  margin-left: 10px;
  margin-top: 17px;
  cursor: pointer;
}
#wz-login .wz-login-forgot:hover {
  color: #FFF;
}
#wz-login .wz-login-mail span {
  font-size: 16px;
  color: #AAA;
  float: left;
  margin-left: 5px;
}
#wz-login .wz-login-mail span:first-child {
  color: #FFF;
  margin-left: 0;
}
#wz-login .wz-mail-user {
  width: 256px;
  height: 28px;
  float: left;
  margin-top: 12px;
  border-radius: 3px;
  padding: 0 9px;
  font-size: 13px;
  color: #222;
}
#wz-login .wz-mail-submit {
  width: 135px;
  height: 32px;
  margin-top: 22px;
  font-size: 15px;
  padding: 0 10px;
  line-height: 16px;
  display: inline-block;
}
#wz-login footer {
  width: 880px;
  height: 23px;
  padding-top: 7px;
  position: absolute;
  bottom: 0;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  background: #3E3E3E;
  text-align: center;
}
#wz-login footer a {
  text-decoration: none;
}
#wz-login footer span {
  font-size: 12px;
  color: #AAA;
  margin: 10px 5px;
  cursor: pointer;
}
#wz-login footer span:hover {
  color: #FFF;
}
/* REGISTER */
#wz-login .wz-register {
  width: 276px;
  height: 326px;
  padding: 15px;
  float: right;
  margin-right: 15px;
  background: #3E3E3E;
  border-radius: 3px;
}
#wz-login .wz-register span {
  color: #FFFFFF;
  float: left;
}
#wz-login .wz-register-input {
  border: 1px solid transparent;
}
#wz-login .wz-register-input:focus {
  border: 1px solid #56B4EF;
  box-shadow: 0 0 3px rgba(82, 168, 236, 0.6), inset 0 0 3px rgba(82, 168, 236, 0.3);
}
#wz-login .wz-register-input {
  width: 256px;
  height: 28px;
  padding: 0 9px;
  float: left;
  margin-top: 12px;
  background: #FFF;
  font-size: 13px;
  color: #222;
  border-radius: 3px;
}
#wz-login .wz-register-weekey {
  width: 142px;
}
#wz-login .wz-register-submit {
  float: left;
  font-size: 13px;
  height: 30px;
  margin-left: 5px;
  margin-top: 12px;
  width: 108px;
}
#wz-login .wz-register-title {
  margin-top: 14px;
}
/* STICKER GHOST */
#wz-stick-ghost {
  position: absolute;
  display: none;
  background: rgba(230, 230, 230, 0.5);
  z-index: 999;
}
#wz-stick-ghost.display {
  display: block;
}
.wz-dialog {
  position: absolute;
  left: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.4);
  opacity: 1;
  z-index: 99999;
  width: 100%;
  height: 100%;
}
.wz-dialog article {
  position: absolute;
  width: 478px;
  background: #f6f6f6;
  text-align: right;
  padding: 26px 18px 14px 26px;
  border-radius: 3px;
  box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.15);
  /*margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;*/

}
.wz-dialog .localapps {
  text-align: center;
  height: 552px;
  width: 409px;
  border-radius: 6px;
  padding-right: 40px;
  padding-left: 40px;
  left: calc(50% - 205px) !important;
  top: calc(50% - 296px) !important;
  background-color: #fff;
}
.wz-dialog .localapps img {
  width: 157px;
  height: 168px;
  margin-bottom: 35px;
  margin-top: 26px;
  margin-left: 7px;
}
.wz-dialog .localapps header {
  text-align: center;
  font-family: Lato;
  font-size: 37px;
  font-weight: bold;
  margin-bottom: 24px;
  padding-right: 0px;
  color: #545f65;
}
.wz-dialog .localapps p {
  text-align: center;
  font-family: Lato;
  font-size: 17px;
  color: #889399;
  padding: 0;
  line-height: 1.8;
}
.wz-dialog .localapps p.multiline {
  text-align: center;
}
.wz-dialog .localapps .ui-btn {
  width: 236px;
  border-radius: 4px;
  margin: 5px 0 0;
}
.wz-dialog .localapps .ui-btn span {
  line-height: 21px;
}
.wz-dialog .localapps .dismiss {
  margin-top: 28px;
  font-family: Lato;
  font-size: 14px;
  color: #889399;
  display: block;
  cursor: pointer;
}
.wz-dialog .localapps .dismiss:hover {
  text-decoration: underline;
}
.wz-dialog header {
  font-size: 17px;
  font-family: "Lato";
  color: #4d4d4e;
  font-weight: bold;
  line-height: 1.2;
  text-align: left;
  margin-bottom: 20px;
  padding-right: 8px;
}
.wz-dialog p {
  font-family: "Lato";
  color: #666666;
  line-height: 1.6;
  text-align: left;
  color: #474D4B;
  font-size: 15px;
  margin-bottom: 30px;
  padding-right: 8px;
}
.wz-dialog p.multiline {
  text-align: justify;
}
.wz-dialog input {
  /*
    width: 322px;
    height: 44px;
    margin: 0 auto;
    margin-top: 25px;
    border-radius: 2px;
    padding: 1px;
    font-size: 16px;
    color: #FFF;
    padding-left: 18px;
    display: block;

    box-shadow: 0 1px 1px -1px #050506 inset, 0 1px 0 #3A3A3B;

    background-image: -moz-linear-gradient(50% 0% -90deg,rgb(25,25,26) 0%,rgb(21,21,22) 100%);
    background-image: -webkit-linear-gradient(-90deg,rgb(25,25,26) 0%,rgb(21,21,22) 100%);
    background-image: -o-linear-gradient(-90deg,rgb(25,25,26) 0%,rgb(21,21,22) 100%);
    background-image: linear-gradient(0deg,rgb(21,21,22) 0%,rgb(25,25,26) 100%);
    */

  margin-bottom: 10px;
}
/*
.wz-dialog input:focus{

    padding: 0;
    padding-left: 17px;
    border: 1px solid #245276;

}

.wz-dialog input + input{

    margin-top: 8px;

}

.wz-dialog input.small{

    width: 100px;

}

.wz-dialog input.medium{

    width: 100px;


}

.wz-dialog input.large{

    width: 100px;

}
*/
/*
.wz-dialog.buttons-2 button{
    margin: 0 12px;
}
*/
.wz-dialog button {
  margin: 0 4px;
}
.wz-dialog button:last-child {
  margin: 0 0 0 4px;
}
/*
.wz-dialog button{

    border-radius: 2px;
    border-top: 1px solid #4B4B4D;
    padding: 10px 25px;
    text-align: center;
    display: inline-block;
    margin: 25px 10px 20px 10px;
    box-shadow: 0 1px 1px #111;
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    font-size: 16px;
    color: #FFF;
    cursor: pointer;

    background-image: -moz-linear-gradient(50% 0% -90deg,rgb(54,54,57) 0%,rgb(39,39,41) 100%);
    background-image: -webkit-linear-gradient(-90deg,rgb(54,54,57) 0%,rgb(39,39,41) 100%);
    background-image: -o-linear-gradient(-90deg,rgb(54,54,57) 0%,rgb(39,39,41) 100%);
    background-image: linear-gradient(0deg,rgb(39,39,41) 0%,rgb(54,54,57) 100%);

}

.wz-dialog button:hover{

    border-top: 1px solid #5D5D60;

    background-image: -moz-linear-gradient(50% 0% -90deg,rgb(75,75,77) 0%,rgb(55,55,56) 100%);
    background-image: -webkit-linear-gradient(-90deg,rgb(75,75,77) 0%,rgb(55,55,56) 100%);
    background-image: -o-linear-gradient(-90deg,rgb(75,75,77) 0%,rgb(55,55,56) 100%);
    background-image: linear-gradient(0deg,rgb(55,55,56) 0%,rgb(75,75,77) 100%);

}

.wz-dialog button.big{
    padding: 10px 40px;
}

.wz-dialog button.active{

    border-top: 1px solid #50BDFF;

    background-image: -moz-linear-gradient(50% 0% -90deg,rgb(60,181,255) 0%,rgb(44,153,255) 100%);
    background-image: -webkit-linear-gradient(-90deg,rgb(60,181,255) 0%,rgb(44,153,255) 100%);
    background-image: -o-linear-gradient(-90deg,rgb(60,181,255) 0%,rgb(44,153,255) 100%);
    background-image: linear-gradient(0deg,rgb(44,153,255) 0%,rgb(60,181,255) 100%);

}

.wz-dialog button.active:hover{

    border-top: 1px solid #60CBFF;

    background-image: -moz-linear-gradient(50% 0% -90deg,rgb(77,197,255) 0%,rgb(56,175,255) 100%);
    background-image: -webkit-linear-gradient(-90deg,rgb(77,197,255) 0%,rgb(56,175,255) 100%);
    background-image: -o-linear-gradient(-90deg,rgb(77,197,255) 0%,rgb(56,175,255) 100%);
    background-image: linear-gradient(0deg,rgb(56,175,255) 0%,rgb(77,197,255) 100%);

}

.wz-dialog button.disabled{

    border-top: 1px solid #333334;
    background: rgba(58,58,59,0.2);
    box-shadow: 0 1px 1px rgba(0,0,0,0.4);
    color: #666;
    cursor: default;

}

.wz-dialog button.disabled:hover{

    border-top: 1px solid #333334;
    background: rgba(58,58,59,0.2);
    box-shadow: 0 1px 1px rgba(0,0,0,0.4);

}

.wz-dialog button.warning{

    border-top: 1px solid #A14C53;
    background: #96383F;

}

.wz-dialog button.warning:hover{

    border-top: 1px solid #AB5E65;
    background: #A14C53;

}
*/
/* Cards */
body.landing a,
body.login a,
body.forgotRequest a,
body.forgotRecover a,
body.register a,
body.contact a,
body.maintenance a {
  color: #7ebe30;
  text-decoration: none;
  cursor: pointer;
}
body.landing a:hover,
body.login a:hover,
body.forgotRequest a:hover,
body.forgotRecover a:hover,
body.register a:hover,
body.contact a:hover,
body.maintenance a:hover {
  text-decoration: underline;
}
#wz-card-container {
  width: 536px;
  margin: 0 auto;
  opacity: 0;
}
#wz-card-logo {
  width: 100%;
  float: left;
  text-align: center;
}
#wz-card-logo img {
  width: 196px;
  height: 40px;
  display: inline-block;
  cursor: pointer;
}
#wz-card-logo a {
  cursor: pointer;
}
#wz-card {
  float: left;
  margin-top: 25px;
  padding: 25px 18px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.05), 0 1px 5px rgba(0, 0, 0, 0.2);
  border-radius: 3px;
  background-color: #F6F6F6;
  position: relative;
}
#wz-card .wz-card-title {
  width: 100%;
  float: left;
  margin-bottom: 10px;
  font-size: 16px;
  color: #484D4C;
}
#wz-card input {
  width: 210px;
  border: 1px solid #DCDCDC;
  border-radius: 5px;
  background: #FFF;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
  font-size: 12px;
  color: #484D4C;
  padding: 0 15px;
  float: left;
  height: 32px;
}
#wz-card input::-webkit-input-placeholder {
  padding-top: 2px;
}
#wz-card input.uppercase:valid {
  text-transform: uppercase;
}
#wz-card input:focus,
#wz-card textarea:focus {
  border: 1px solid #7ebe30;
}
#wz-card input.short {
  width: 84px;
}
#wz-card input.margin-left {
  margin-left: 10px;
}
#wz-card input.margin-top {
  margin-top: 15px;
}
#wz-card textarea {
  width: 210px;
  border: 1px solid #DCDCDC;
  border-radius: 5px;
  background: #FFF;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
  font-size: 12px;
  color: #484D4C;
  padding: 10px 15px;
  float: left;
}
#wz-card .wz-card-footer {
  position: absolute;
  left: 0;
  bottom: 0;
}
#wz-card .wz-card-footer-left {
  width: 3px;
  height: 7px;
  float: left;
  background: url("../image/card/border.png") no-repeat 0 0;
  background-size: 6px 7px;
}
#wz-card .wz-card-footer-middle {
  width: 1px;
  height: 7px;
  float: left;
  background: url("../image/card/middle.png") repeat;
  background-size: 1px 7px;
}
#wz-card .wz-card-footer-right {
  width: 3px;
  height: 7px;
  float: left;
  background: url("../image/card/border.png") no-repeat -3px 0;
  background-size: 6px 7px;
}
/* Landing Card */
body.landing {
  background: #fff;
  overflow: auto;
  width: auto;
  float: none;
  height: auto;
  min-width: 870px;
}
body.landing * {
  font-family: 'Lato', sans-serif;
}
body.landing h1 {
  font-size: 72px;
  font-weight: bold;
  color: #fff;
  line-height: 92px;
}
body.landing h2 {
  font-size: 37px;
  color: #fff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  font-weight: lighter;
  margin-bottom: 28px;
}
body.landing p {
  font-size: 19px;
  color: #fefefe;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  display: inline-block;
  line-height: 28px;
}
body.landing .landing-section {
  width: 100%;
  height: 656px;
  float: left;
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d;
  transform-style: preserve-3d;
}
body.landing .landing-section:after {
  content: '';
  width: 100%;
  height: 1px;
  background: rgba(0, 0, 0, 0.15);
  margin-top: -1px;
  position: absolute;
}
body.landing .landing-column {
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
body.landing .landing-header {
  width: 100%;
  background: rgba(255, 255, 255, 0.95);
  padding: 15px 0;
  height: 40px;
  position: fixed;
  top: 0;
  z-index: 1;
  box-shadow: 0 1px rgba(0, 0, 0, 0.15);
}
body.landing .landing-header .landing-column {
  width: 858px;
  padding: 0 6px;
}
body.landing .landing-header-logo {
  height: 40px;
  width: 196px;
  background: url('../image/landing/logo.png');
  background-size: 196px 40px;
  float: left;
  cursor: pointer;
}
body.landing .landing-navigation {
  float: right;
  margin: 2px 0;
}
body.landing .landing-navigation a {
  float: left;
  font-size: 16px;
  padding: 10px 20px;
  color: #9A9A9A;
  text-align: center;
  text-decoration: none;
  border-radius: 18px;
  -webkit-transition: color 0.2s, background 0.2s;
  -moz-transition: color 0.2s, background 0.2s;
  -ms-transition: color 0.2s, background 0.2s;
  -o-transition: color 0.2s, background 0.2s;
  transition: color 0.2s, background 0.2s;
  margin-right: 8px;
  outline: none;
}
body.landing .landing-navigation a:hover {
  color: #777;
}
body.landing .landing-navigation-button-login {
  font-size: 14px !important;
  padding: 12px 16px 10px;
  box-shadow: 0 0 0 2px #9a9a9a inset;
  display: block;
  float: left;
  margin-left: 8px;
  line-height: 16px;
}
body.landing .landing-navigation-button-login:hover {
  color: #fff !important;
  background: #9a9a9a;
}
body.landing .landing-navigation-button-register {
  font-size: 14px !important;
  color: #60b25e !important;
  padding: 12px 10px 10px;
  box-shadow: 0 0 0 2px #60b25e inset;
  display: block;
  float: left;
  margin-right: 0;
  line-height: 16px;
}
body.landing .landing-navigation-button-register:hover {
  color: #fff !important;
  background: #60b25e;
}
body.landing .landing-hero {
  background: #a79c9a url('../image/landing/hero-2880.jpg');
  background-position: center bottom;
  background-size: cover;
  height: 745px;
  position: relative;
}
body.landing .landing-hero-shadow {
  height: 100%;
  background-color: rgba(53, 59, 67, 0.5);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15) inset;
}
body.landing .landing-hero .landing-column {
  width: 700px;
  height: 404px;
  margin: auto;
  position: absolute;
  left: 0;
  right: 0;
}
body.landing .landing-hero.hide-arrow .landing-hero-down-base {
  display: none !important;
}
body.landing .landing-hero h1 {
  margin-bottom: 40px;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  opacity: 0;
}
body.landing .landing-hero p {
  width: 528px;
  font-size: 30px;
  color: #fff;
  font-weight: lighter;
  line-height: 38px;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
  opacity: 0;
}
body.landing .landing-hero button {
  margin-top: 40px;
  padding: 22px 45px;
  height: 66px;
  border-radius: 33px;
  background-color: #60b25e;
  font-family: Lato;
  font-size: 23px;
  color: #fefefe;
  cursor: pointer;
  outline: none;
  opacity: 0;
}
body.landing .landing-hero button:hover {
  background-color: #4ea34b;
}
body.landing .landing-hero button:active {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) inset;
  background-color: #60b25e;
}
body.landing .landing-hero-down-base {
  cursor: pointer;
  width: 52px;
  height: 52px;
  border-radius: 26px;
  position: absolute;
  bottom: 70px;
  left: 0;
  right: 0;
  margin: auto;
  background: url('../image/landing/hero_base.png');
  background-size: 52px 52px;
  opacity: 0;
  display: none;
}
body.landing .landing-hero-down-arrow {
  cursor: pointer;
  width: 27px;
  height: 16px;
  margin: 20px 12.5px 16px 12.5px;
  background: url('../image/landing/hero_arrow.png');
  background-size: 27px 16px;
}
body.landing .landing-section-portal .landing-column {
  background: #9f9386 url('../image/landing/section1-2880.jpg') no-repeat;
  background-size: cover;
  background-position: 0;
  height: 656px;
}
body.landing .landing-section-portal h2 {
  padding-top: 70px;
}
body.landing .landing-section-portal p {
  width: 534px;
}
body.landing .landing-section-connected .landing-column {
  background: #716f70 url('../image/landing/section2-2880.jpg') no-repeat;
  background-size: cover;
  background-position: 0;
  height: 656px;
}
body.landing .landing-section-connected h2 {
  padding-top: 408px;
}
body.landing .landing-section-connected p {
  width: 534px;
}
body.landing .landing-section-easy {
  background: #817d7f;
}
body.landing .landing-section-easy .landing-column {
  background: #817d7f url('../image/landing/section3-2880.jpg') no-repeat;
  background-size: cover;
  background-position: 0;
  height: 656px;
}
body.landing .landing-section-easy .container {
  margin: 0 auto;
  width: 385px;
  padding-left: 400px;
}
body.landing .landing-section-easy h2 {
  text-align: left;
  padding-top: 145px;
  width: 385px;
}
body.landing .landing-section-easy p {
  text-align: left;
  width: 385px;
}
body.landing .landing-section-easy .landing-create-account-row {
  text-align: left;
}
body.landing .landing-create-account-row {
  display: block;
}
body.landing .landing-create-account {
  margin-top: 25px;
  opacity: 0.9;
  cursor: pointer;
  display: inline-block;
  padding: 5px;
}
body.landing .landing-create-account figcaption {
  font-family: Lato;
  font-size: 17px;
  color: #fefefe;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  display: inline-block;
  cursor: pointer;
}
body.landing .landing-create-account i {
  background: url('../image/landing/arrow.png');
  width: 12px;
  height: 11px;
  background-size: 12px 11px;
  display: inline-block;
  margin-left: 8px;
  vertical-align: middle;
  cursor: pointer;
}
body.landing .landing-create-account:hover {
  opacity: 1;
}
body.landing .landing-create-account:hover figcaption {
  text-decoration: underline;
}
body.landing .landing-section-price {
  background: #4d4643 url('../image/landing/pricing.jpg');
  background-position: center bottom;
  background-size: cover;
}
body.landing .landing-section-price .landing-column {
  padding: 140px 0;
}
body.landing .landing-section-price h2 {
  font-size: 58px;
  color: #fff;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
body.landing .landing-section-price h3 {
  font-size: 50px;
  color: #4c4c4c;
  font-weight: 200;
}
body.landing .landing-section-price p {
  font-size: 18px;
  color: #fff;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  margin-bottom: 80px;
  width: 100%;
}
body.landing .landing-price-card-wrapper {
  height: 370px;
}
body.landing .landing-price-card {
  width: 303px;
  height: 370px;
  border-radius: 3px;
  background-color: #f6f6f6;
  box-shadow: 0 1px rgba(0, 0, 0, 0.15);
  position: relative;
}
body.landing .landing-price-card-left {
  float: left;
  margin-left: 75px;
}
body.landing .landing-price-card-right {
  float: right;
  margin-right: 75px;
}
body.landing .landing-price-card p {
  width: 303px;
  font-size: 16px;
  color: #4c4c4c;
  margin: 0 0 14px;
  text-shadow: none;
  line-height: 16px;
}
body.landing .landing-price-card .wz-ui-button {
  margin-top: 8px;
}
body.landing .landing-price-card-header {
  width: 303px;
  height: 116px;
  padding-top: 35px;
  border-radius: 3px 3px 0 0;
  border-bottom: 1px solid #dcdcdc;
  margin-bottom: 30px;
  background: #ffffff;
  background-image: -moz-linear-gradient(top, #ffffff, #f3f3f3);
  background-image: -webkit-linear-gradient(top, #ffffff, #f3f3f3);
  background-image: -o-linear-gradient(top, #ffffff, #f3f3f3);
  background-image: linear-gradient(to bottom, #ffffff, #f3f3f3);
}
body.landing .landing-price-card-header p {
  font-weight: 200;
  font-size: 28px;
  line-height: 28px;
  color: #7ebe30;
  margin: 16px 0 0;
}
body.landing .landing-price-card-ribbon {
  width: 86px;
  height: 86px;
  position: absolute;
  top: 0;
  right: 0;
  background: url('../image/landing/price_ribbon.png');
  background-size: 86px 86px;
}
body.landing .landing-price-card-footer {
  position: absolute;
  left: 0;
  bottom: 0;
}
body.landing .landing-price-card-footer-left {
  width: 3px;
  height: 7px;
  float: left;
  background: url("../image/card/border.png") no-repeat 0 0;
  background-size: 6px 7px;
}
body.landing .landing-price-card-footer-middle {
  width: 297px;
  height: 7px;
  float: left;
  background: url("../image/card/middle.png") repeat;
  background-size: 1px 7px;
}
body.landing .landing-price-card-footer-right {
  width: 3px;
  height: 7px;
  float: left;
  background: url("../image/card/border.png") no-repeat -3px 0;
  background-size: 6px 7px;
}
body.landing .landing-footer {
  width: 100%;
}
body.landing .landing-footer-notified {
  padding: 68px 42px;
  width: 790px;
}
body.landing .landing-footer-notified-box {
  width: 783px;
  height: 149px;
  padding: 46px 0 0;
  border-radius: 6px;
  background-color: #fff;
  box-shadow: 0 1px #dcdcdc;
  border: solid 1px #dcdcdc;
  background: #ffffff;
  background-image: -moz-linear-gradient(top, #ffffff, #fafafa);
  background-image: -webkit-linear-gradient(top, #ffffff, #fafafa);
  background-image: -o-linear-gradient(top, #ffffff, #fafafa);
  background-image: linear-gradient(to bottom, #ffffff, #fafafa);
}
body.landing .landing-modal {
  width: 100%;
  height: 100%;
  position: fixed;
  display: none;
  z-index: 100;
  background: rgba(0, 0, 0, 0.5);
}
body.landing .landing-modal-form {
  position: fixed;
  top: 50%;
  left: 50%;
  width: 700px;
  height: 583px;
  margin-left: -350px;
  margin-top: -340px;
  background-color: #f7f8fa;
  border: solid 1px rgba(0, 0, 0, 0.15);
  border-radius: 5px;
  z-index: 200;
  padding-top: 15px;
}
body.landing .landing-modal-form strong {
  color: red;
}
body.landing .landing-modal-form div {
  margin-left: 30px;
  margin-top: 15px;
  margin-bottom: 10px;
  color: #545f65;
  float: left;
}
body.landing .landing-modal-form input {
  margin-left: 30px;
  width: 623px;
  height: 49px;
  padding-left: 15px;
  border-radius: 3px;
  border: 1px solid #ccd3d5;
  font-size: 17px;
  margin-top: 0;
  margin-right: 0;
  margin-bottom: 0;
  background-color: #fff;
  float: left;
}
body.landing .landing-modal-form .sector-dropdown {
  margin-left: 30px;
  width: 593px;
  height: 49px;
  padding-left: 15px;
  border-radius: 3px 0px 0px 3px;
  border: 1px solid #ccd3d5;
  font-size: 17px;
  margin-top: 0;
  margin-right: 0;
  margin-bottom: 0;
  background-color: #fff;
  float: left;
}
body.landing .landing-modal-form .error {
  border-color: #eb3254;
  color: #eb3254;
}
body.landing .landing-modal-form .sector-dropdown span {
  color: #a9a9a9;
  margin-top: 14px;
  position: absolute;
}
body.landing .landing-modal-form .sector-dropdown.error span {
  color: #eb3254;
}
body.landing .landing-modal-form .sector-dropdown .black {
  color: black;
}
body.landing .landing-modal-form figure {
  float: left;
  height: 51px;
  width: 30px;
  background-image: -moz-linear-gradient(90deg, #69a55b 0%, #72b261 100%);
  background-image: -webkit-linear-gradient(90deg, #69a55b 0%, #72b261 100%);
  background-image: -ms-linear-gradient(90deg, #69a55b 0%, #72b261 100%);
  border-radius: 0 3px 3px 0;
}
body.landing .landing-modal-form .drop i {
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 5px solid #fff;
  top: 28px;
  position: relative;
  margin-left: 10px;
}
body.landing .landing-modal-form .sector-dropdown-selector {
  display: none;
  position: absolute;
  background-color: #fff;
  margin-left: 30px;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  width: 640px;
  background-color: rgba(255, 255, 255, 0.98);
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  border: solid 1px rgba(0, 0, 0, 0.15);
  margin-top: 2px;
  padding-top: 5px;
  padding-bottom: 5px;
  overflow-y: scroll;
  height: 200px;
  top: 291px;
}
body.landing .landing-modal-form .sector-dropdown-selector .sector {
  font-size: 19px;
  color: #545f65;
  padding-top: 10px;
  padding-bottom: 10px;
  height: 19px;
  padding-left: 40px;
}
body.landing .landing-modal-form .sector-dropdown-selector .sector:hover {
  background-color: #60b25e;
  color: #fff;
}
body.landing .landing-modal-form .sector.active i {
  background: url(../image/sprite-white@2x.png);
  width: 16px;
  height: 16px;
  position: absolute;
  background-position-x: 32px;
  left: 13px;
}
body.landing .landing-modal-form .sector.active:hover i {
  background-position-x: 16px;
}
body.landing .landing-modal-form .more-info {
  margin-left: 30px;
  width: 625px;
  height: 139px;
  padding-top: 20px;
  padding-left: 15px;
  border-radius: 3px;
  border: 1px solid #ccd3d5;
  font-size: 17px;
}
body.landing .landing-modal-form .thanks-subscribe {
  display: none;
  height: 600px;
  width: 702px;
  position: absolute;
  top: -1px;
  left: -1px;
  background: rgba(0, 0, 0, 0.5);
}
body.landing .landing-modal-form .thanks-subscribe .container {
  background-color: #f7f8fa;
  width: 100%;
  margin: 100px 0px 0px 0px;
  padding-top: 40px;
  height: 345px;
}
body.landing .landing-modal-form .thanks-subscribe .container i {
  background: url(../image/landing/nice.png);
  background-size: 119px 119px;
  height: 119px;
  width: 119px;
  float: left;
  margin: 0 291px 0 292px;
}
body.landing .thanks-subscribe .thanks {
  color: #545f65;
  font-size: 36px;
  float: left;
  padding-left: 105px;
  padding-right: 99px;
  text-align: center;
  margin-top: 25px;
}
body.landing .thanks-subscribe .notice {
  color: #889399;
  font-size: 19px;
  float: left;
  margin-top: 36px;
  padding-left: 153px;
  padding-right: 148px;
  text-align: center;
}
body.landing .landing-footer-notified-input-bar {
  margin-top: 31px;
}
body.landing .landing-footer-notified-box h2 {
  font-weight: normal;
}
body.landing .landing-footer-notified-input-field {
  width: 330px;
  height: 42px;
  background-color: #fcfeff;
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  border: solid 1px #dcdcdc;
  border-radius: 6px;
  padding-left: 12px;
  margin: 0 7px;
}
body.landing .landing-footer-notified-input-field:focus {
  border: 1px solid #7ebe30;
}
body.landing .landing-modal .landing-footer-notified-input-button {
  width: 115px;
  float: right;
  margin-right: 29px;
  margin-top: 28px;
}
body.landing .landing-footer-notified-input-button,
body.landing .landing-footer-open-dialog-button {
  cursor: pointer;
  width: 145px;
  height: 46px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  background-image: -moz-linear-gradient(90deg, #50a54e 0%, #60b25e 100%);
  background-image: -webkit-linear-gradient(90deg, #50a54e 0%, #60b25e 100%);
  background-image: -ms-linear-gradient(90deg, #50a54e 0%, #60b25e 100%);
  color: white;
}
body.landing .landing-footer-notified-input-button:hover {
  background-image: -moz-linear-gradient(90deg, #50a54e 0%, #60b25e 100%);
  background-image: -webkit-linear-gradient(90deg, #50a54e 0%, #60b25e 100%);
  background-image: -ms-linear-gradient(90deg, #50a54e 0%, #60b25e 100%);
  background-image: -moz-linear-gradient(90deg, #5cb05a 0%, #6ebd6c 100%);
  background-image: -webkit-linear-gradient(90deg, #5cb05a 0%, #6ebd6c 100%);
  background-image: -ms-linear-gradient(90deg, #5cb05a 0%, #6ebd6c 100%);
  box-shadow: inset 0px -2px 0px 0px rgba(0, 0, 0, 0.2);
}
body.landing .landing-footer-notified-input-button:active {
  background-image: -moz-linear-gradient(90deg, #5baa59 0%, #499848 100%);
  background-image: -webkit-linear-gradient(90deg, #5baa59 0%, #499848 100%);
  background-image: -ms-linear-gradient(90deg, #5baa59 0%, #499848 100%);
  box-shadow: inset 0px 2px 0px 0px rgba(0, 0, 0, 0.2);
}
body.landing .landing-footer-line {
  height: 1px;
  background: #dcdcdc;
}
body.landing .landing-footer .landing-column {
  padding: 50px 0;
}
body.landing .landing-footer a {
  margin: 0 15px;
  font-size: 16px;
  color: #808080;
}
body.landing .landing-footer span {
  /*margin: 0 15px 0 30px;*/

  font-size: 16px;
  color: #808080;
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi) {
  body.landing .landing-header-logo {
    background-image: url('../image/landing/logo@2x.png');
  }
  body.landing .landing-hero-down-base {
    background-image: url('../image/landing/hero_base@2x.png');
  }
  body.landing .landing-hero-down-arrow {
    background-image: url('../image/landing/hero_arrow@2x.png');
  }
  body.landing .landing-create-account i {
    background-image: url('../image/landing/arrow@2x.png');
  }
  body.landing .landing-price-card-ribbon {
    background-image: url('../image/landing/price_ribbon@2x.png');
  }
  body.landing .landing-modal-form .thanks-subscribe .container i {
    background-image: url('../image/landing/nice@2x.png');
  }
}
/* To Do -> Recheck rules */
@media all and (max-width: 2560px), all and (max-device-width: 2560px) {
  body {
    background-image: url('../wallpaper/2560.jpg');
  }
  body.landing .landing-hero {
    background-image: url('../image/landing/hero-2560.jpg');
  }
  body.landing .landing-section-portal .landing-column {
    background-image: url('../image/landing/section1-2560.jpg');
  }
  body.landing .landing-section-connected .landing-column {
    background-image: url('../image/landing/section2-2560.jpg');
  }
  body.landing .landing-section-easy .landing-column {
    background-image: url('../image/landing/section3-2560.jpg');
  }
  body.login,
  body.register,
  body.contact,
  body.maintenance {
    background-image: url('../wallpaper/default/2560.jpg');
  }
}
@media all and (max-width: 1920px), all and (max-device-width: 1920px) {
  body {
    background-image: url('../wallpaper/1920.jpg');
  }
  body.landing .landing-hero {
    background-image: url('../image/landing/hero-1920.jpg');
  }
  body.landing .landing-section-portal .landing-column {
    background-image: url('../image/landing/section1-1920.jpg');
  }
  body.landing .landing-section-connected .landing-column {
    background-image: url('../image/landing/section2-1920.jpg');
  }
  body.landing .landing-section-easy .landing-column {
    background-image: url('../image/landing/section3-1920.jpg');
  }
  body.login,
  body.register,
  body.contact,
  body.maintenance {
    background-image: url('../wallpaper/default/1920.jpg');
  }
}
@media all and (max-width: 1440px), all and (max-device-width: 1440px) {
  body {
    background-image: url('../wallpaper/1440.jpg');
  }
  body.landing .landing-hero {
    background-image: url('../image/landing/hero-1440.jpg');
  }
  body.landing .landing-section-portal .landing-column {
    background-image: url('../image/landing/section1-1440.jpg');
  }
  body.landing .landing-section-connected .landing-column {
    background-image: url('../image/landing/section2-1440.jpg');
  }
  body.landing .landing-section-easy .landing-column {
    background-image: url('../image/landing/section3-1440.jpg');
  }
  body.login,
  body.register,
  body.contact,
  body.maintenance {
    background-image: url('../wallpaper/default/1440.jpg');
  }
}
@media all and (max-width: 1280px), all and (max-device-width: 1280px) {
  body {
    background-image: url('../wallpaper/1280.jpg');
  }
  body.landing .landing-hero {
    background-image: url('../image/landing/hero-1280.jpg');
  }
  body.landing .landing-section-portal .landing-column {
    background-image: url('../image/landing/section1-1280.jpg');
  }
  body.landing .landing-section-connected .landing-column {
    background-image: url('../image/landing/section2-1280.jpg');
  }
  body.landing .landing-section-easy .landing-column {
    background-image: url('../image/landing/section3-1280.jpg');
  }
  body.login,
  body.register,
  body.contact,
  body.maintenance {
    background-image: url('../wallpaper/default/1280.jpg');
  }
}
/* Common Cards */
body.login,
body.forgotRequest,
body.forgotRecover,
body.register,
body.contact,
body.maintenance {
  background-color: #B4D3DC;
}
/* Login Card */
body.login #wz-card-container {
  width: 268px;
}
body.login #wz-card .wz-card-footer-middle {
  width: 272px;
}
/* Register Card */
body.register #wz-card-container {
  width: 530px;
}
body.register #wz-card .wz-card-footer-middle {
  width: 524px;
}
#wz-card .wz-card-register-terms {
  width: 240px;
  height: 17px;
  padding: 12px 0 11px;
  float: left;
  margin-top: 25px;
  margin-right: 2px;
}
/* Contact Card */
body.contact #wz-card-container {
  width: 530px;
}
body.contact #wz-card .wz-card-footer-middle {
  width: 524px;
}
/* Maintenance Card */
body.maintenance #wz-card-container {
  width: 624px;
}
body.maintenance #wz-card .wz-card-footer-middle {
  width: 618px;
}
/* ForgotRequet Card */
body.forgotRequest #wz-card-container,
body.forgotRecover #wz-card-container {
  width: 268px;
}
body.forgotRequest #wz-card .wz-card-footer-middle,
body.forgotRecover #wz-card .wz-card-footer-middle {
  width: 272px;
}
body.forgotRecover #wz-card-forgotRecover-form .password {
  margin-bottom: 15px;
}
/* Browsers Card */
/*
.register .card-footer-middle{
    width: 524px;
}
*/
#wz-card .wz-card-login-checkbox,
#wz-card .wz-card-register-terms-checkbox {
  width: 7px;
  height: 7px;
  float: left;
  padding: 4px;
  border: 1px solid #DCDCDC;
  border-radius: 3px;
  background: #FFF;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.1);
}
#wz-card .wz-card-login-checkbox i,
#wz-card .wz-card-register-terms-checkbox i {
  width: 7px;
  height: 7px;
  background: url("../image/card/tick.png") no-repeat;
  background-size: 7px 7px;
  display: none;
}
#wz-card .wz-card-login-checkbox.checked i,
#wz-card .wz-card-register-terms-checkbox.checked i {
  display: block;
}
#wz-card .wz-card-login-checkbox-description,
#wz-card .wz-card-register-terms-checkbox-description {
  float: left;
  margin-left: 5px;
  margin-top: 4px;
  font-size: 11px;
  color: #484D4C;
}
#wz-card .wz-card-login-button,
#wz-card .wz-card-forgotRequest-button,
#wz-card .wz-card-forgotRecover-button,
#wz-card .wz-card-register-button,
#wz-card .wz-card-contact-button {
  width: 220px;
  padding: 10px;
  float: left;
  margin-top: 25px;
  border: 1px solid #389520;
  border-radius: 3px;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.3);
  background-image: -moz-linear-gradient(bottom, #4e9c21, #7ebe30);
  background-image: -webkit-linear-gradient(bottom, #4e9c21, #7ebe30);
  background-image: -o-linear-gradient(bottom, #4e9c21, #7ebe30);
  background-image: linear-gradient(to top, #4e9c21, #7ebe30);
}
#wz-card .wz-card-contact-button {
  margin-top: 15px;
}
#wz-card .wz-card-login-button:hover,
#wz-card .wz-card-forgotRequest-button:hover,
#wz-card .wz-card-forgotRecover-button:hover,
#wz-card .wz-card-register-button:hover,
#wz-card .wz-card-contact-button:hover {
  background-image: -moz-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: -webkit-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: -o-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: linear-gradient(to top, #00aeef, #52cae0);
}
#wz-card .wz-card-login-button:active,
#wz-card .wz-card-forgotRequest-button:active,
#wz-card .wz-card-forgotRecover-button:active,
#wz-card .wz-card-register-button:active,
#wz-card .wz-card-contact-button:active {
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
  background-image: -moz-linear-gradient(bottom, #609125, #448a1c);
  background-image: -webkit-linear-gradient(bottom, #609125, #448a1c);
  background-image: -o-linear-gradient(bottom, #609125, #448a1c);
  background-image: linear-gradient(to top, #609125, #448a1c);
}
#wz-card .wz-card-login-button.margin-left,
#wz-card .wz-card-register-button.margin-left {
  margin-left: 10px;
}
#wz-card .wz-card-login-button span,
#wz-card .wz-card-forgotRequest-button span,
#wz-card .wz-card-forgotRecover-button span,
#wz-card .wz-card-register-button span,
#wz-card .wz-card-contact-button span {
  width: 100%;
  float: left;
  text-align: center;
  font-size: 18px;
  color: #FFF;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
#wz-card .wz-card-login-register {
  float: right;
  font-size: 11px;
  margin-top: 4px;
}
#wz-card .wz-card-login-options {
  width: 240px;
  height: 17px;
  padding: 12px 0 11px;
  float: left;
  margin-top: 8px;
}
#wz-card .wz-card-login-forgot {
  float: right;
  font-size: 11px;
  margin-top: 4px;
}
#wz-card .wz-card-login-button {
  margin-top: 10px;
}
#wz-card-login-form .wz-login-remember-checkbox {
  display: none;
}
#wz-card .wz-card-contact-left {
  float: left;
  width: 240px;
  margin-right: 7px;
}
#wz-card .wz-card-contact-right {
  float: left;
  width: 240px;
  margin-left: 7px;
}
#wz-card .wz-card-contact-right textarea {
  height: 165px;
  width: 206px;
}
#wz-card .wz-card-maintenance-title-big {
  width: 500px;
  float: left;
  margin: 15px 44px;
  margin-top: 15px;
  text-align: center;
  font-size: 36px;
  line-height: 42px;
  color: #484D4C;
}
#wz-card .wz-card-maintenance-description-big {
  width: 500px;
  float: left;
  margin: 15px 44px;
  text-align: center;
  font-size: 15px;
  line-height: 19px;
  color: #484D4C;
}
#wz-card .wz-card-maintenance-social-buttons {
  width: 100%;
  float: left;
  margin: 20px 0;
  text-align: center;
}
#wz-card .wz-card-maintenance-social-button-twitter {
  height: 11px;
  padding: 5px;
  background-color: #F8F8F8;
  border: 1px solid #CCC;
  border-radius: 3px;
  cursor: pointer;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#dedede));
  background-image: -moz-linear-gradient(top, #ffffff, #dedede);
  background-image: -o-linear-gradient(top, #ffffff, #dedede);
  background-image: linear-gradient(top, #ffffff, #dedede);
  display: inline-block;
}
#wz-card .wz-card-maintenance-social-button-twitter * {
  cursor: pointer;
}
#wz-card .wz-card-maintenance-social-button-twitter:hover {
  border: 1px solid #BBB;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#d9d9d9));
  background-image: -moz-linear-gradient(top, #f8f8f8, #d9d9d9);
  background-image: -o-linear-gradient(top, #f8f8f8, #d9d9d9);
  background-image: linear-gradient(top, #f8f8f8, #d9d9d9);
}
#wz-card .wz-card-maintenance-social-button-twitter:active {
  background-color: #EFEFEF;
  box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1) inset;
  border: 1px solid #BBB;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#d9d9d9));
  background-image: -moz-linear-gradient(top, #f8f8f8, #d9d9d9);
  background-image: -o-linear-gradient(top, #f8f8f8, #d9d9d9);
  background-image: linear-gradient(top, #f8f8f8, #d9d9d9);
}
#wz-card .wz-card-maintenance-social-button-twitter i {
  width: 16px;
  height: 11px;
  float: left;
  background: url("../image/card/twitter.png") no-repeat;
  background-size: 16px 11px;
}
#wz-card .wz-card-maintenance-social-button-twitter span {
  float: left;
  margin-left: 3px;
  font-family: 'Helvetica Neue', Arial, sans-serif;
  font-size: 11px;
  color: #333;
  font-weight: bold;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}
.wz-ui-button {
  padding: 0 10px;
  min-width: 86px;
  height: 34px;
  border-radius: 3px;
  background-image: -moz-linear-gradient(90deg, #69a55a 0%, #79bf68 100%);
  background-image: -webkit-linear-gradient(90deg, #69a55a 0%, #79bf68 100%);
  background-image: -ms-linear-gradient(90deg, #69a55a 0%, #79bf68 100%);
  background-image: -o-linear-gradient(90deg, #69a55a 0%, #79bf68 100%);
  background-image: linear-gradient(0, #69a55a 0%, #79bf68 100%);
  box-shadow: inset 0px -2px 0px 0px rgba(0, 0, 0, 0.3);
  font-size: 13px;
  font-family: 'Lato';
  color: #fefefe;
  text-transform: uppercase;
  line-height: 1.2;
  text-align: center;
  text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.19);
  outline: none;
}
.wz-ui-button:hover {
  background-color: #85e74e;
  background-image: -webkit-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: -moz-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: -o-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: linear-gradient(to top, #00aeef, #52cae0);
}
.wz-ui-button:active {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) inset;
  background-color: #539f29;
  background-image: -webkit-linear-gradient(top, #448a1c, #609125);
  background-image: -moz-linear-gradient(top, #448a1c, #609125);
  background-image: -o-linear-gradient(top, #448a1c, #609125);
  background-image: linear-gradient(to bottom, #448a1c, #609125);
}
.wz-ui-button.disabled,
.wz-ui-button.disabled:hover,
.wz-ui-button.disabled:active {
  background-color: #75D142;
  box-shadow: 0 1px rgba(255, 255, 255, 0.3) inset;
  border: 1px solid #8DCA8D;
  background-image: -webkit-linear-gradient(bottom, #a7cd90, #bede97);
  background-image: -moz-linear-gradient(bottom, #a7cd90, #bede97);
  background-image: -o-linear-gradient(bottom, #a7cd90, #bede97);
  background-image: linear-gradient(to top, #a7cd90, #bede97);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
.wz-ui-button.black {
  background-image: -moz-linear-gradient(90deg, #58616a 0%, #6d7883 100%);
  background-image: -webkit-linear-gradient(90deg, #58616a 0%, #6d7883 100%);
  background-image: -ms-linear-gradient(90deg, #58616a 0%, #6d7883 100%);
  background-image: -o-linear-gradient(90deg, #58616a 0%, #6d7883 100%);
  background-image: linear-gradient(0, #58616a 0%, #6d7883 100%);
  box-shadow: inset 0px -2px 0px 0px rgba(0, 0, 0, 0.3);
}
.wz-ui-button.black:hover {
  background-color: #616161;
  background-image: -webkit-linear-gradient(bottom, #4c4c4c, #737373);
  background-image: -moz-linear-gradient(bottom, #4c4c4c, #737373);
  background-image: -o-linear-gradient(bottom, #4c4c4c, #737373);
  background-image: linear-gradient(to top, #4c4c4c, #737373);
}
.wz-ui-button.black:active {
  background-color: #282828;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) inset;
  background-image: -webkit-linear-gradient(top, #3f3f3f, #4d4d4d);
  background-image: -moz-linear-gradient(top, #3f3f3f, #4d4d4d);
  background-image: -o-linear-gradient(top, #3f3f3f, #4d4d4d);
  background-image: linear-gradient(to bottom, #3f3f3f, #4d4d4d);
}
.wz-ui-button.black.disabled,
.wz-ui-button.black.disabled:hover,
.wz-ui-button.black.disabled:active {
  background-color: #434343;
  box-shadow: 0 1px rgba(255, 255, 255, 0.2) inset;
  border: 1px solid #979797;
  background-image: -webkit-linear-gradient(bottom, #a0a0a0, #b1b1b1);
  background-image: -moz-linear-gradient(bottom, #a0a0a0, #b1b1b1);
  background-image: -o-linear-gradient(bottom, #a0a0a0, #b1b1b1);
  background-image: linear-gradient(to top, #a0a0a0, #b1b1b1);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
.wz-ui-button.red {
  background-image: -moz-linear-gradient(90deg, #ef5251 0%, #ff6160 100%);
  background-image: -webkit-linear-gradient(90deg, #ef5251 0%, #ff6160 100%);
  background-image: -ms-linear-gradient(90deg, #ef5251 0%, #ff6160 100%);
  background-image: -o-linear-gradient(90deg, #ef5251 0%, #ff6160 100%);
  background-image: linear-gradient(0, #ef5251 0%, #ff6160 100%);
  box-shadow: inset 0px -2px 0px 0px rgba(0, 0, 0, 0.3);
}
.wz-ui-button.red:hover {
  background-color: #dc513a;
  background-image: -webkit-linear-gradient(bottom, #e34840, #e86f6a);
  background-image: -moz-linear-gradient(bottom, #e34840, #e86f6a);
  background-image: -o-linear-gradient(bottom, #e34840, #e86f6a);
  background-image: linear-gradient(to top, #e34840, #e86f6a);
}
/*
.wz-ui-button.red.hover{

    background-color: #dc513a;
    background-image: -webkit-linear-gradient( bottom, #e34840, #e86f6a );
    background-image: -moz-linear-gradient( bottom, #e34840, #e86f6a );
    background-image: -o-linear-gradient( bottom, #e34840, #e86f6a );
    background-image: linear-gradient( to top, #e34840, #e86f6a );

}
*/
.wz-ui-button.red:active {
  background-color: #dc513a;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) inset;
  background-image: -webkit-linear-gradient(top, #a43733, #c85551);
  background-image: -moz-linear-gradient(top, #a43733, #c85551);
  background-image: -o-linear-gradient(top, #a43733, #c85551);
  background-image: linear-gradient(to bottom, #a43733, #c85551);
}
/*
.wz-ui-button.red.active{

    background-color: #dc513a;
    box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.2 ) inset;
    background-image: -webkit-linear-gradient( top, #a43733, #c85551 );
    background-image: -moz-linear-gradient( top, #a43733, #c85551 );
    background-image: -o-linear-gradient( top, #a43733, #c85551 );
    background-image: linear-gradient( to bottom, #a43733, #c85551 );

}
*/
.wz-ui-button.red.disabled,
.wz-ui-button.red.disabled:hover,
.wz-ui-button.red.disabled:active {
  background-color: #DC513A;
  box-shadow: 0 1px rgba(255, 255, 255, 0.3) inset;
  border: 1px solid #C69D9D;
  background-image: -webkit-linear-gradient(bottom, #dc9f9c, #ecafad);
  background-image: -moz-linear-gradient(bottom, #dc9f9c, #ecafad);
  background-image: -o-linear-gradient(bottom, #dc9f9c, #ecafad);
  background-image: linear-gradient(to top, #dc9f9c, #ecafad);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
.wz-ui-button.blue {
  background-color: #66a3da;
  box-shadow: 0 1px rgba(255, 255, 255, 0.2) inset;
  border: solid 1px #4679a6;
  background-image: -webkit-linear-gradient(top, #6daade, #508bc0);
  background-image: -moz-linear-gradient(top, #6daade, #508bc0);
  background-image: -o-linear-gradient(top, #6daade, #508bc0);
  background-image: linear-gradient(to bottom, #6daade, #508bc0);
}
.wz-ui-button.blue:hover {
  background-color: #76b6ec;
  background-image: -webkit-linear-gradient(top, #7abaf0, #5a96cc);
  background-image: -moz-linear-gradient(top, #7abaf0, #5a96cc);
  background-image: -o-linear-gradient(top, #7abaf0, #5a96cc);
  background-image: linear-gradient(to bottom, #7abaf0, #5a96cc);
}
/*
.wz-ui-button.blue.hover{

    background-color: #76b6ec;
    background-image: -webkit-linear-gradient( top, #7abaf0, #5a96cc );
    background-image: -moz-linear-gradient( top, #7abaf0, #5a96cc );
    background-image: -o-linear-gradient( top, #7abaf0, #5a96cc );
    background-image: linear-gradient( to bottom, #7abaf0, #5a96cc );

}
*/
.wz-ui-button.blue:active {
  background-color: #6dabe1;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2) inset;
  background-image: -webkit-linear-gradient(top, #5084b1, #669fd1);
  background-image: -moz-linear-gradient(top, #5084b1, #669fd1);
  background-image: -o-linear-gradient(top, #5084b1, #669fd1);
  background-image: linear-gradient(to bottom, #5084b1, #669fd1);
}
/*
.wz-ui-button.blue.active{

    background-color: #6dabe1;
    box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.2 ) inset;
    background-image: -webkit-linear-gradient( top, #5084b1, #669fd1 );
    background-image: -moz-linear-gradient( top, #5084b1, #669fd1 );
    background-image: -o-linear-gradient( top, #5084b1, #669fd1 );
    background-image: linear-gradient( to bottom, #5084b1, #669fd1 );

}
*/
.wz-ui-button.blue.disabled,
.wz-ui-button.blue.disabled:hover,
.wz-ui-button.blue.disabled:active {
  background-color: #66A3DA;
  box-shadow: 0 1px rgba(255, 255, 255, 0.2) inset;
  border: 1px solid #A2BCD2;
  background-image: -webkit-linear-gradient(bottom, #a7c5df, #b6d4ee);
  background-image: -moz-linear-gradient(bottom, #a7c5df, #b6d4ee);
  background-image: -o-linear-gradient(bottom, #a7c5df, #b6d4ee);
  background-image: linear-gradient(to top, #a7c5df, #b6d4ee);
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
}
.wz-ui-list {
  width: 214px;
  height: 158px;
  background-color: #FFF;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15);
  border-radius: 3px;
  margin: 0;
  list-style: none;
  padding: 0;
}
.wz-ui-list li {
  font-size: 13px;
  color: #646464;
  line-height: 24px;
  padding: 0 6px;
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
  margin-bottom: 2px;
}
.wz-ui-list li:first-child {
  margin-top: 2px;
}
.wz-ui-list li:hover {
  background-color: #EAF3E7;
  border-top: 1px solid #C9EABE;
  border-bottom: 1px solid #C9EABE;
}
.wz-ui-list li.active {
  background: #7ebe30;
  border-top: 1px solid #70ab2b;
  border-bottom: 1px solid #70ab2b;
  color: #fff;
}
.wz-ui-list.dark {
  background-color: #333538;
  box-shadow: 0 0 0 1px #2a2a2a, 0 1px rgba(255, 255, 255, 0.1) inset;
}
.wz-ui-list.dark li {
  color: #FFF;
}
.wz-ui-list.dark li:hover {
  background-color: #404244;
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
}
.wz-ui-list.dark li.active {
  background: #7ebe30;
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
  color: #fff;
}
.wz-scroll-bar.dark {
  width: 6px;
  height: 136px;
  border-radius: 3px;
  background-color: #9FA0A1;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1) inset;
}
.wz-scroll-bar.dark .wz-scroll-slider {
  height: 38px;
  border-radius: 3px;
  background-color: #333538;
}
.wz-scroll-bar.dark {
  background-color: #292A2D;
  box-shadow: 0 2px 2px rgba(0, 0, 0, 0.1) inset;
}
.wz-scroll-bar.dark .wz-scroll-slider {
  background-color: #FFF;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15), 0 2px 2px rgba(0, 0, 0, 0.1) inset;
  background-image: -webkit-linear-gradient(top, #ffffff, #d3d3d3);
  background-image: -moz-linear-gradient(top, #ffffff, #d3d3d3);
  background-image: -o-linear-gradient(top, #ffffff, #d3d3d3);
  background-image: linear-gradient(to bottom, #ffffff, #d3d3d3);
}
/* UI Kit */
.wz-ui-header {
  width: 100%;
  height: 40px;
  border-radius: 3px 3px 0 0;
  background-color: #CBCBCB;
  background-image: -moz-linear-gradient(90deg, #f2f2f2 0%, #fafaf8 100%);
  background-image: -webkit-linear-gradient(90deg, #f2f2f2 0%, #fafaf8 100%);
  background-image: -ms-linear-gradient(90deg, #f2f2f2 0%, #fafaf8 100%);
  background-image: -o-linear-gradient(90deg, #f2f2f2 0%, #fafaf8 100%);
  background-image: linear-gradient(0, #f2f2f2 0%, #fafaf8 100%);
  border-bottom: 1px solid #e0e0e0;
  position: relative;
  z-index: 1;
}
.wz-ui-header.dark {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15), inset 0 1px rgba(255, 255, 255, 0.1);
  border-bottom-color: #252525;
  background-color: #131313;
  background-image: -webkit-linear-gradient(bottom, #2e2e2e, #383838);
  background-image: -moz-linear-gradient(bottom, #2e2e2e, #383838);
  background-image: -o-linear-gradient(bottom, #2e2e2e, #383838);
  background-image: linear-gradient(to top, #2e2e2e, #383838);
}
/* Todavia sin revisar */
.wz-ui-head span {
  float: left;
  margin: 12px 14px;
  font-size: 13px;
  color: #666;
}
.wz-ui-head article {
  float: right;
  padding: 15px 20px 16px;
  border-left: 1px solid rgba(0, 0, 0, 0.2);
  box-shadow: -1px 0 rgba(255, 255, 255, 0.1);
}
.wz-ui-head article i {
  width: 10px;
  height: 9px;
  float: left;
  background: url("../image/win_buttons.png") no-repeat;
  background-size: 30px 18px;
}
.wz-ui-head article i.min {
  background-position: 0 -9px;
}
.wz-ui-head article i.max {
  background-position: -10px -9px;
  margin: 0 15px;
}
.wz-ui-head article i.close {
  background-position: -20px -9px;
}
.wz-ui-head.dark span {
  color: #FFF;
  text-shadow: 0 -1px rgba(0, 0, 0, 0.15);
}
.wz-ui-head.dark article {
  padding: 15px 20px;
  margin-top: 1px;
  border-left: 1px solid #252525;
}
.wz-ui-head.dark article i.min {
  background-position: 0 0;
}
.wz-ui-head.dark article i.max {
  background-position: -10px 0;
}
.wz-ui-head.dark article i.close {
  background-position: -20px 0;
}
.wz-ui-dropdown {
  width: 174px;
  height: 160px;
  background-color: #FFF;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15);
  border-radius: 3px;
  position: relative;
}
.wz-ui-dropdown:after,
.wz-ui-dropdown:before {
  bottom: 100%;
  left: 85%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
.wz-ui-dropdown:after {
  border-color: 1px solid transparent;
  border-bottom-color: #FFF;
  border-width: 6px;
  margin-left: -6px;
}
.wz-ui-dropdown:before {
  border-color: 1px solid transparent;
  border-bottom-color: #BFBFBF;
  border-width: 7px;
  margin-left: -7px;
  box-shadow: 0 1px #FFF;
}
.wz-ui-dropdown article {
  width: 146px;
  height: 26px;
  float: left;
  padding: 6px 14px;
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
}
.wz-ui-dropdown article:hover {
  background-color: #EAF3E7;
  border-top: 1px solid #C9EABE;
  border-bottom: 1px solid #C9EABE;
}
.wz-ui-dropdown article.hover {
  background-color: #EAF3E7;
  border-top: 1px solid #C9EABE;
  border-bottom: 1px solid #C9EABE;
}
.wz-ui-dropdown article i {
  width: 14px;
  height: 16px;
  float: left;
  margin-top: 4px;
  background: url("../app/11/dropdown.png") no-repeat;
  background-size: 56px 16px;
}
.wz-ui-dropdown article i.info {
  background-position: -28px 0;
}
.wz-ui-dropdown article i.stats {
  background-position: -42px 0;
}
.wz-ui-dropdown article i.db {
  background-position: -14px 0;
}
.wz-ui-dropdown article i.config {
  background-position: 0 0;
}
.wz-ui-dropdown article span {
  font-size: 13px;
  color: #646464;
  line-height: 24px;
  float: left;
  margin-left: 8px;
}
.wz-ui-dropdown.dark {
  background-color: #333538;
  box-shadow: 0 0 0 1px #2a2a2a, 0 1px rgba(255, 255, 255, 0.1) inset;
}
.wz-ui-dropdown.dark:after {
  border-bottom-color: #333538;
}
.wz-ui-dropdown.dark:before {
  border-bottom-color: #2a2a2a;
  box-shadow: 0 1px #333538;
}
.wz-ui-dropdown.dark article {
  color: #FFF;
}
.wz-ui-dropdown.dark article:hover {
  background-color: #404244;
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
}
.wz-ui-dropdown.dark article.hover {
  background-color: #404244;
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
}
.wz-ui-dropdown.dark article span {
  color: #FFF;
}
.wz-ui-input {
  width: 204px;
  height: 28px;
  padding: 0 10px;
  border-radius: 3px;
  background-color: #FCFEFF;
  box-shadow: 0 1px rgba(0, 0, 0, 0.05) inset;
  border: 1px solid #DCDCDC;
  font-size: 13px;
  color: #464646;
  cursor: text;
}
.wz-ui-input:focus {
  border: 1px solid #7ebe30;
}
.wz-ui-input.active {
  border: 1px solid #7ebe30;
}
.wz-ui-input.error {
  border: 1px solid #DA605B;
}
.wz-ui-input.disabled {
  background-color: #F0F0F0;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1) inset;
  border: 1px solid #C6C6C6;
  color: #A8A8A8;
  cursor: default;
}
.wz-ui-input[type="checkbox"] {
  display: none;
}
.wz-ui-input[type="checkbox"] + label i {
  display: inline-block;
  width: 17px;
  height: 17px;
  margin: -1px 4px 0 0;
  vertical-align: middle;
  background: url('../image/checkbox_white.png') -17px 0 no-repeat;
  background-size: 51px 17px;
}
.wz-ui-input[type="checkbox"]:checked + label i {
  background-position: 0 0;
}
.wz-ui-input[type="checkbox"].checked + label i {
  background-position: 0 0;
}
.wz-ui-input[type="checkbox"].disabled + label i {
  background-position: -34px 0;
}
.wz-ui-input.dark[type="checkbox"] + label i {
  display: inline-block;
  width: 17px;
  height: 17px;
  margin: -1px 4px 0 0;
  vertical-align: middle;
  background: url('../image/checkbox_black.png') -17px 0 no-repeat;
  background-size: 51px 17px;
}
.wz-ui-input.dark[type="checkbox"]:checked + label i {
  background-position: 0 0;
}
.wz-ui-input.dark[type="checkbox"].checked + label i {
  background-position: 0 0;
}
.wz-ui-input.dark[type="checkbox"].disabled + label i {
  background-position: -34px 0;
}
.wz-ui-input[type="radio"] {
  display: none;
}
.wz-ui-input[type="radio"] + label i {
  display: inline-block;
  width: 17px;
  height: 17px;
  margin: -1px 4px 0 0;
  vertical-align: middle;
  background: url('../image/radio_white.png') -17px 0 no-repeat;
}
.wz-ui-input[type="radio"]:checked + label i {
  background-position: 0 0;
}
.wz-ui-input[type="radio"].checked + label i {
  background-position: 0 0;
}
.wz-ui-input[type="radio"].disabled + label i {
  background-position: -34px 0;
}
.wz-ui-input.dark[type="radio"] + label i {
  display: inline-block;
  width: 17px;
  height: 17px;
  margin: -1px 4px 0 0;
  vertical-align: middle;
  background: url('../image/radio_black.png') -17px 0 no-repeat;
}
.wz-ui-input.dark[type="radio"]:checked + label i {
  background-position: 0 0;
}
.wz-ui-input.dark[type="radio"].checked + label i {
  background-position: 0 0;
}
.wz-ui-input.dark[type="radio"].disabled + label i {
  background-position: -34px 0;
}
/* -------------- NEW UI-KIT ---------------- */
/* ----------------------------------------------------- */
/* ------------------NORMAL BUTTONS -------------------- */
/* ----------------------------------------------------- */
.ui-btn {
  width: 100px;
  height: 34px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  background-color: #ccd3d5;
  border: solid 1px #ccd3d5;
  background-image: -webkit-linear-gradient(bottom, #fafafa, #ffffff);
  background-image: -moz-linear-gradient(bottom, #fafafa, #ffffff);
  background-image: -o-linear-gradient(bottom, #fafafa, #ffffff);
  background-image: -ms-linear-gradient(bottom, #fafafa, #ffffff);
  background-image: linear-gradient(to top, #fafafa, #ffffff);
}
.ui-btn span {
  font-family: Lato;
  font-size: 15px;
  color: #545f65;
  max-width: calc(100% - 20px);
  display: inline-block;
  vertical-align: bottom;
  line-height: 17px;
}
.ui-btn:hover {
  background-color: #fff;
  -webkit-box-shadow: 0 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: 0 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px rgba(0, 0, 0, 0.05);
  background-image: none;
}
.ui-btn:active {
  background-image: -webkit-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -moz-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -o-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -ms-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: linear-gradient(to bottom, #dfe3e6, #ecf0f3);
}
.ui-btn:disabled {
  background-image: none;
  background-color: #fff;
  opacity: 0.5;
}
.ui-btn:disabled span {
  color: #545f65;
}
.ui-btn.small {
  width: 85px;
  height: 28px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.ui-btn.small span {
  font-size: 13px;
  max-width: calc(100% - 14px);
  line-height: 14px;
}
.ui-btn.big {
  width: 115px;
  height: 46px;
}
.ui-btn.big span {
  font-size: 19px;
  max-width: calc(100% - 28px);
  line-height: 20px;
}
/* ----------------------- dark ------------------------ */
.dark .ui-btn {
  background-color: #434d56;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05), inset 0 1px rgba(255, 255, 255, 0.03);
  -moz-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05), inset 0 1px rgba(255, 255, 255, 0.03);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05), inset 0 1px rgba(255, 255, 255, 0.03);
  border: solid 1px #2c3238;
  background-image: -webkit-linear-gradient(bottom, #404951, #47525b);
  background-image: -moz-linear-gradient(bottom, #404951, #47525b);
  background-image: -o-linear-gradient(bottom, #404951, #47525b);
  background-image: -ms-linear-gradient(bottom, #404951, #47525b);
  background-image: linear-gradient(to top, #404951, #47525b);
}
.dark .ui-btn span {
  color: #d2dce2;
}
.dark .ui-btn:hover {
  background-color: #3b434a;
  background-image: -webkit-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -moz-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -o-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -ms-linear-gradient(bottom, #49535c, #535f6a);
  background-image: linear-gradient(to top, #49535c, #535f6a);
}
.dark .ui-btn:hover span {
  color: #fff;
}
.dark .ui-btn:active {
  background-color: #3b434a;
  border: solid 1px #2c3238;
  background-image: -webkit-linear-gradient(top, #323a40, #3d444b);
  background-image: -moz-linear-gradient(top, #323a40, #3d444b);
  background-image: -o-linear-gradient(top, #323a40, #3d444b);
  background-image: -ms-linear-gradient(top, #323a40, #3d444b);
  background-image: linear-gradient(to bottom, #323a40, #3d444b);
}
.dark .ui-btn:disabled span {
  color: #d2dce2;
}
/* ----------------------------------------------------- */
/* ------------------ ACCEPT BUTTONS ------------------- */
/* ----------------------------------------------------- */
.ui-btn.accept {
	  border: none;
  background-color: #58ac56;
  background-image: -webkit-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: -moz-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: -o-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: -ms-linear-gradient(bottom, #00aeef, #52cae0);
  background-image: linear-gradient(to top, #00aeef, #52cae0);

}
.ui-btn.accept span {
  color: #fefefe;
  text-shadow: 0 1px rgba(0, 0, 0, 0.15);
}
.ui-btn.accept:hover {
	opacity: 0.8;
	  border: none;
  -webkit-box-shadow: inset 0 -1px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 -1px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 -1px rgba(0, 0, 0, 0.2);
  background-image: -webkit-linear-gradient(bottom,#00aeef, #52cae0);
  background-image: -moz-linear-gradient(bottom,#00aeef, #52cae0);
  background-image: -o-linear-gradient(bottom,#00aeef, #52cae0);
  background-image: -ms-linear-gradient(bottom,#00aeef, #52cae0);
  background-image: linear-gradient(to top,#00aeef, #52cae0);
}
.ui-btn.accept:active {
  
  -webkit-box-shadow: inset 0 2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 2px rgba(0, 0, 0, 0.2);
  background-image: -webkit-linear-gradient(top, #32aae0, #00aeef);
  background-image: -moz-linear-gradient(top, #32aae0, #00aeef);
  background-image: -o-linear-gradient(top, #32aae0, #00aeef);
  background-image: -ms-linear-gradient(top, #32aae0, #00aeef);
  background-image: linear-gradient(to bottom, #32aae0, #00aeef);
}
.ui-btn.accept:disabled {
  opacity: 0.5;
}
.ui-btn.accept:disabled span {
  color: #fefefe;
}
/* ----------------------- dark ------------------------ */
/* ----------------------------------------------------- */
/* ------------------ CANCEL BUTTONS ------------------- */
/* ----------------------------------------------------- */
.ui-btn.cancel {
  background-color: #f45756;
  background-image: -webkit-linear-gradient(bottom, #ef5251, #f75a59);
  background-image: -moz-linear-gradient(bottom, #ef5251, #f75a59);
  background-image: -o-linear-gradient(bottom, #ef5251, #f75a59);
  background-image: -ms-linear-gradient(bottom, #ef5251, #f75a59);
  background-image: linear-gradient(to top, #ef5251, #f75a59);
  border: none;
}
.ui-btn.cancel span {
  color: #fefefe;
  text-shadow: 0 1px rgba(0, 0, 0, 0.15);
}
.ui-btn.cancel:hover {
  background-color: #f66564;
  -webkit-box-shadow: inset 0 -2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 -2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 -2px rgba(0, 0, 0, 0.2);
  background-image: -webkit-linear-gradient(bottom, #f25c5b, #f76968);
  background-image: -moz-linear-gradient(bottom, #f25c5b, #f76968);
  background-image: -o-linear-gradient(bottom, #f25c5b, #f76968);
  background-image: -ms-linear-gradient(bottom, #f25c5b, #f76968);
  background-image: linear-gradient(to top, #f25c5b, #f76968);
}
.ui-btn.cancel:active {
  background-color: #d2403e;
  -webkit-box-shadow: inset 0 2px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: inset 0 2px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 2px rgba(0, 0, 0, 0.15);
  background-image: -webkit-linear-gradient(top, #d03a39, #d64948);
  background-image: -moz-linear-gradient(top, #d03a39, #d64948);
  background-image: -o-linear-gradient(top, #d03a39, #d64948);
  background-image: -ms-linear-gradient(top, #d03a39, #d64948);
  background-image: linear-gradient(to bottom, #d03a39, #d64948);
  border: none;
}
.ui-btn.cancel:disabled {
  opacity: 0.5;
}
.ui-btn.cancel:disabled span {
  color: #fefefe;
}
/* ----------------------- dark ------------------------ */
/* ----------------------------------------------------- */
/* -------------------- GRAY BUTTONS ------------------- */
/* ----------------------------------------------------- */
.ui-btn.gray {
  background-color: #5f6972;
  background-image: -webkit-linear-gradient(bottom, #59616a, #636d77);
  background-image: -moz-linear-gradient(bottom, #59616a, #636d77);
  background-image: -o-linear-gradient(bottom, #59616a, #636d77);
  background-image: -ms-linear-gradient(bottom, #59616a, #636d77);
  background-image: linear-gradient(to top, #59616a, #636d77);
  border: none;
}
.ui-btn.gray span {
  color: #fefefe;
  text-shadow: 0 1px rgba(0, 0, 0, 0.15);
}
.ui-btn.gray:hover {
  background-color: #71777e;
  -webkit-box-shadow: inset 0 -2px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: inset 0 -2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 -2px rgba(0, 0, 0, 0.2);
  background-image: -webkit-linear-gradient(bottom, #6c7279, #737a81);
  background-image: -moz-linear-gradient(bottom, #6c7279, #737a81);
  background-image: -o-linear-gradient(bottom, #6c7279, #737a81);
  background-image: -ms-linear-gradient(bottom, #6c7279, #737a81);
  background-image: linear-gradient(to top, #6c7279, #737a81);
}
.ui-btn.gray:active {
  background-color: #505760;
  -webkit-box-shadow: inset 0 2px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: inset 0 2px rgba(0, 0, 0, 0.15);
  box-shadow: inset 0 2px rgba(0, 0, 0, 0.15);
  background-image: -webkit-linear-gradient(top, #495057, #58616a);
  background-image: -moz-linear-gradient(top, #495057, #58616a);
  background-image: -o-linear-gradient(top, #495057, #58616a);
  background-image: -ms-linear-gradient(top, #495057, #58616a);
  background-image: linear-gradient(to bottom, #495057, #58616a);
}
.ui-btn.gray:disabled {
  opacity: 0.5;
}
.ui-btn.gray:disabled span {
  color: #fefefe;
}
/* ----------------------- dark ------------------------ */
.dark .ui-btn.gray {
  background-color: #fff;
  background-image: -webkit-linear-gradient(bottom, #fafafa, #ffffff);
  background-image: -moz-linear-gradient(bottom, #fafafa, #ffffff);
  background-image: -o-linear-gradient(bottom, #fafafa, #ffffff);
  background-image: -ms-linear-gradient(bottom, #fafafa, #ffffff);
  background-image: linear-gradient(to top, #fafafa, #ffffff);
  border: none;
}
.dark .ui-btn.gray span {
  color: #545f65;
}
.dark .ui-btn.gray:hover {
  background-color: #fff;
  background-image: none;
  -webkit-box-shadow: inset 0 -2px rgba(63, 71, 80, 0.15);
  -moz-box-shadow: inset 0 -2px rgba(63, 71, 80, 0.15);
  box-shadow: inset 0 -2px rgba(63, 71, 80, 0.15);
}
.dark .ui-btn.gray:active {
  background-color: #fff;
  -webkit-box-shadow: inset 0 2px rgba(63, 71, 80, 0.2);
  -moz-box-shadow: inset 0 2px rgba(63, 71, 80, 0.2);
  box-shadow: inset 0 2px rgba(63, 71, 80, 0.2);
  background-image: -webkit-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -moz-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -o-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -ms-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: linear-gradient(to bottom, #dfe3e6, #ecf0f3);
}
.dark .ui-btn.gray:disabled span {
  color: #545f65;
}
/* ----------------------------------------------------- */
/* -------------------- NORMAL INPUT ------------------- */
/* ----------------------------------------------------- */
.ui-input {
  width: 225px;
  height: 28px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  background-color: #fff;
  border: solid 1px #ccd3d5;
  padding: 0px 8px;
}
.ui-input input {
  font-family: Lato;
  font-size: 13px;
  color: #545f65;
  padding-top: 6px;
  width: 100%;
}
.ui-input.active {
  -webkit-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  border: solid 1px #60b25e;
}
.ui-input.active input {
  width: calc(100% - 25px);
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
}
.ui-input figure {
  display: none;
  float: right;
  width: 14px;
  height: 14px;
  margin: 7px 0px 7px 0px;
}
.ui-input.active figure {
  display: inline-block;
}
.ui-input figure i {
  background-image: url('../image/uikit/sprite-white.png');
  width: 14px;
  height: 14px;
  background-size: 99px 16px;
  background-repeat: no-repeat;
  display: inline-block;
  background-position: -32px 0px;
}
.ui-input.error {
  font-weight: bold;
  color: #eb3254;
  border: solid 1px #eb3254;
}
.ui-input.disabled {
  color: #bbc0c3;
  background-color: #f0f0f0;
  border: solid 1px #ccd3d5;
}
.ui-input input::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */

  padding-top: 2px;
  color: #889399;
}
.ui-input input:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */

  padding-top: 2px;
  opacity: 1;
  color: #889399;
}
.ui-input input::-moz-placeholder {
  /* Mozilla Firefox 19+ */

  padding-top: 2px;
  opacity: 1;
  color: #889399;
}
.ui-input input:-ms-input-placeholder {
  /* Internet Explorer 10-11 */

  padding-top: 2px;
  color: #889399;
}
/* ----------------------- dark ------------------------ */
.dark .ui-input {
  background-color: #545f65;
  border: 1px solid #323940;
}
.dark .ui-input input {
  color: #d2dce2;
  background-color: #545f65;
}
.dark .ui-input.active {
  background-color: #545f65;
  -webkit-box-shadow: inset 0 2px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 2px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 2px rgba(0, 0, 0, 0.05);
}
.dark .ui-input.active input {
  color: white;
}
.dark .ui-input.error {
  background-color: #545f65;
  -webkit-box-shadow: inset 0 2px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 2px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 2px rgba(0, 0, 0, 0.05);
  border: solid 1px #ec6e68;
  color: #ec6e68;
}
.dark .ui-input.disabled {
  color: #737d84;
  background-color: #4a535b;
  border: solid 1px #384048;
}
.dark .ui-input figure i {
  background-image: url('../image/uikit/sprite-dark.png');
  background-size: 91px 16px;
}
.dark .ui-input.active {
  border: solid 1px #60b25e;
}
.dark .ui-input input::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */

  padding-top: 2px;
  color: #d2dce2;
}
.dark .ui-input input:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */

  padding-top: 2px;
  opacity: 1;
  color: #d2dce2;
}
.dark .ui-input input::-moz-placeholder {
  /* Mozilla Firefox 19+ */

  padding-top: 2px;
  opacity: 1;
  color: #d2dce2;
}
.dark .ui-input input:-ms-input-placeholder {
  /* Internet Explorer 10-11 */

  padding-top: 2px;
  color: #d2dce2;
}
/* ----------------------------------------------------- */
/* -------------------- SEARCH INPUT ------------------- */
/* ----------------------------------------------------- */
.ui-input-search {
  width: 328px;
  height: 38px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  background-color: #fff;
  border: solid 1px #ccd3d5;
}
.ui-input-search .search-icon {
  float: left;
  width: 16px;
  padding-left: 14px;
  padding-right: 10px;
  padding-bottom: 2px;
  padding-top: 2px;
  height: 16px;
  border-right: 1px solid #ccd3d5;
  margin: 9px 10px 0px 0px;
}
.ui-input-search .search-icon i {
  background-image: url('../image/uikit/sprite-white.png');
  width: 16px;
  height: 16px;
  background-repeat: no-repeat;
  display: inline-block;
  background-size: 99px 16px;
}
.ui-input-search input {
  border: none;
  margin-top: 9px;
  width: calc(100% - 58px);
  font-family: Lato;
  color: #889399;
}
.ui-input-search .delete-content {
  display: none;
  float: right;
  width: 14px;
  height: 14px;
  margin: 13px 7px 13px 0px;
}
.ui-input-search.active .delete-content {
  display: inline-block;
}
.ui-input-search .delete-content i {
  background-image: url('../image/uikit/sprite-white.png');
  width: 14px;
  height: 14px;
  background-repeat: no-repeat;
  display: inline-block;
  background-position: -32px 0px;
  background-size: 99px 16px;
}
.ui-input-search.active input {
  width: calc(100% - 78px);
}
.ui-input-search.active {
  border: 1px solid #60b25e;
  -webkit-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
}
.ui-input-search.active .search-icon {
  border-right: 1px solid #60b25e;
}
.ui-input-search.active .search-icon i {
  background-position: -16px 0px;
}
.ui-input-search.active input {
  color: #545f65;
}
.ui-input-search.disabled {
  color: #aab1b5;
  background-color: #f0f0f0;
}
.ui-input-search input::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */

  padding-top: 2px;
  color: #889399;
}
.ui-input-search input:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */

  padding-top: 2px;
  opacity: 1;
  color: #889399;
}
.ui-input-search input::-moz-placeholder {
  /* Mozilla Firefox 19+ */

  padding-top: 2px;
  opacity: 1;
  color: #889399;
}
.ui-input-search input:-ms-input-placeholder {
  /* Internet Explorer 10-11 */

  padding-top: 2px;
  color: #889399;
}
/* ----------------------- dark ------------------------ */
.dark .ui-input-search {
  background-color: #545f65;
  border: 1px solid #323940;
}
.dark .ui-input-search .search-icon {
  border-right: 1px solid rgba(188, 197, 202, 0.5);
}
.dark .ui-input-search .search-icon i {
  background-image: url('../image/uikit/sprite-dark.png');
  background-size: 91px 16px;
}
.dark .ui-input-search input {
  background-color: #545f65;
  color: #d2dce2;
}
.dark .ui-input-search.active .search-icon {
  border-right: 1px solid #60b25e;
}
.dark .ui-input-search.active {
  border: 1px solid #60b25e;
}
.dark .ui-input-search .delete-content i {
  background-image: url('../image/uikit/sprite-dark.png');
  background-size: 91px 16px;
}
.dark .ui-input-search.active .search-icon i {
  background-position: -16px 0px;
}
.dark .ui-input-search.active input {
  color: white;
}
.dark .ui-input-search.disabled {
  opacity: 0.7;
}
/* ----------------------------------------------------- */
/* ------------------ DROPDOWN INPUT ------------------- */
/* ----------------------------------------------------- */
.ui-input-dropdown {
  width: 62px;
  background-color: #fff;
  font-family: Lato;
  font-size: 13px;
  color: #6f7578;
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.ui-input-dropdown-input {
  height: 24px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  border: solid 1px #ccd3d5;
}
.ui-input-dropdown.active .ui-input-dropdown-input {
  border: 1px solid #60b25e;
}
.ui-input-dropdown.active figure {
  border-left: 1px solid #60b25e;
}
.ui-input-dropdown.active .ui-input-dropdown-input input {
  -webkit-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
}
.ui-input-dropdown-input input {
  float: left;
  width: 46px;
  padding: 5px 0px 0px 8px;
  color: #6f7578;
}
.ui-input-dropdown-input figure {
  float: right;
  width: 13px;
  height: 24px;
  display: inline-block;
  margin: 0px;
  border-left: 1px solid #ccd3d5;
}
.ui-input-dropdown-input figure:active {
  background-image: -webkit-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -moz-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -o-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -ms-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: linear-gradient(to bottom, #dfe3e6, #ecf0f3);
}
.ui-input-dropdown-input figure i {
  background-image: url('../image/uikit/sprite-white.png');
  width: 5px;
  height: 3px;
  margin: 11px 4px 10px 4px;
  display: inline-block;
  background-size: 99px 16px;
  background-position: -46px 0px;
}
.ui-input-dropdown-dropdown {
  display: none;
  background-color: white;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  border: 1px solid #ccd3d5;
  position: absolute;
  width: 60px;
}
.ui-input-dropdown-dropdown article {
  padding: 9px 0 0 10px;
  height: 21px;
}
.ui-input-dropdown-dropdown article:hover {
  background-color: #60b25e;
  color: white;
}
.ui-input-dropdown-dropdown.selecting {
  display: block;
}
.ui-input-dropdown figure:hover {
  -webkit-border-radius: 0 3px 3px 0;
  -moz-border-radius: 0 3px 3px 0;
  border-radius: 0 3px 3px 0;
  background-color: #fff;
  -webkit-box-shadow: 0 2px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: 0 2px rgba(0, 0, 0, 0.05);
  box-shadow: 0 2px rgba(0, 0, 0, 0.05);
}
.ui-input-dropdown.disabled {
  opacity: 0.5;
}
.ui-input-dropdown .separator {
  display: block;
  height: 2px;
  background-color: #f7f8fa;
}
/* ----------------------- dark ------------------------ */
.dark .ui-input-dropdown {
  background-color: #545f65;
  color: #d2dce2;
}
.dark .ui-input-dropdown-input {
  border: 1px solid #323940;
}
.dark .ui-input-dropdown-input figure {
  -webkit-border-radius: 0 2px 2px 0;
  -moz-border-radius: 0 2px 2px 0;
  border-radius: 0 2px 2px 0;
  background-color: #ccd3d5;
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.03);
  -moz-box-shadow: inset 0 1px rgba(255, 255, 255, 0.03);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.03);
  background-image: -webkit-linear-gradient(bottom, #404951, #47525b);
  background-image: -moz-linear-gradient(bottom, #404951, #47525b);
  background-image: -o-linear-gradient(bottom, #404951, #47525b);
  background-image: -ms-linear-gradient(bottom, #404951, #47525b);
  background-image: linear-gradient(to top, #404951, #47525b);
  border-left: 1px solid #323940;
}
.dark .ui-input-dropdown-input figure i {
  background-image: url('../image/uikit/sprite-white.png');
}
.dark .ui-input-dropdown-input input {
  color: #d2dce2;
  background-color: #545f65;
}
.dark .ui-input-dropdown-dropdown {
  display: none;
  background-color: #545f65;
  border: 1px solid #323940;
}
.dark .ui-input-dropdown-dropdown.selecting {
  display: block;
}
.dark .ui-input-dropdown figure:hover {
  -webkit-border-radius: 0 3px 3px 0;
  -moz-border-radius: 0 3px 3px 0;
  border-radius: 0 3px 3px 0;
  background-color: #fff;
  -webkit-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.05), inset 0 1px rgba(255, 255, 255, 0.03);
  -moz-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.05), inset 0 1px rgba(255, 255, 255, 0.03);
  box-shadow: 0 2px 1px rgba(0, 0, 0, 0.05), inset 0 1px rgba(255, 255, 255, 0.03);
  background-image: -webkit-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -moz-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -o-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -ms-linear-gradient(bottom, #49535c, #535f6a);
  background-image: linear-gradient(to top, #49535c, #535f6a);
}
.dark .ui-input-dropdown.disabled {
  opacity: 0.5;
}
.dark .ui-input-dropdown .separator {
  background-color: #3f4750;
}
/* ----------------------------------------------------- */
/* -------------------- SELECT INPUT ------------------- */
/* ----------------------------------------------------- */
.ui-select {
  width: 157px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  background-color: #fcfeff;
  -webkit-box-shadow: inset 0 2px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 2px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 2px rgba(0, 0, 0, 0.05);
  border: solid 1px #ccd3d5;
  font-family: Lato;
  font-size: 13px;
  color: #6f7578;
}
.ui-select-input {
  height: 30px;
}
.ui-select-input article {
  width: calc(100% - 32px);
  float: left;
  padding: 9px 0px 0px 10px;
}
.ui-select-input figure {
  float: right;
  width: 13px;
  height: 30px;
  display: inline-block;
  margin: 0px;
  border-left: 1px solid #ccd3d5;
}
.ui-select-input figure i {
  background-image: url('../image/uikit/sprite-white.png');
  width: 5px;
  height: 10px;
  margin: 10px 4px 9px 4px;
  display: inline-block;
  background-size: 99px 16px;
  background-position: -56px 0px;
}
.ui-select-input.selecting {
  display: none;
}
.ui-select-dropdown {
  display: none;
  background-color: white;
  border-radius: 4px;
}
.ui-select-dropdown article {
  padding: 9px 0 0 10px;
  height: 21px;
}
.ui-select-dropdown article:hover {
  background-color: #60b25e;
  color: white;
}
.ui-select-dropdown.disabled {
  opacity: 0.5;
}
.ui-select-dropdown.selecting {
  display: block;
}
/* ----------------------- dark ------------------------ */
.dark .ui-select {
  background-color: #545f65;
  border: solid 1px #323940;
  color: #d2dce2;
}
.dark .ui-select-input figure {
  float: right;
  -webkit-border-radius: 0 2px 2px 0;
  -moz-border-radius: 0 2px 2px 0;
  border-radius: 0 2px 2px 0;
  background-color: #ccd3d5;
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.03);
  -moz-box-shadow: inset 0 1px rgba(255, 255, 255, 0.03);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.03);
  background-image: -webkit-linear-gradient(bottom, #404951, #47525b);
  background-image: -moz-linear-gradient(bottom, #404951, #47525b);
  background-image: -o-linear-gradient(bottom, #404951, #47525b);
  background-image: -ms-linear-gradient(bottom, #404951, #47525b);
  background-image: linear-gradient(to top, #404951, #47525b);
  border-left: solid 1px #323940;
}
.dark .ui-select-input figure i {
  background-image: url('../image/uikit/sprite-white.png');
  width: 5px;
  height: 10px;
  margin: 10px 4px 9px 4px;
  display: inline-block;
  background-size: 99px 16px;
  background-position: -51px 0px;
}
.dark .ui-select-dropdown {
  display: none;
  background-color: #545f65;
}
.dark .ui-select-dropdown.selecting {
  display: block;
}
.dark .ui-select-dropdown.disabled {
  opacity: 0.5;
}
/* ----------------------------------------------------- */
/* -------------------- CONTEXT MENU ------------------- */
/* ----------------------------------------------------- */
@keyframes fadein {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeout {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
.ui-context-menu {
  width: 155px;
  padding: 5px 0px;
  border-radius: 6px;
  border: 1px solid #ccd3d5;
  animation: fadein 0.2s;
  background: #fff;
}
.ui-context-menu .item {
  width: 135px;
  height: 20px;
  padding-left: 20px;
  color: #545f65;
  padding-top: 8px;
  font-size: 13px;
}
.ui-context-menu .item.children span {
  float: left;
  width: 120px;
}
.ui-context-menu .item.children figure {
  float: right;
  width: 15px;
  height: 20px;
  display: inline-block;
  margin: 0;
}
.ui-context-menu .item.children i {
  background-image: url('../image/uikit/sprite-white.png');
  width: 3px;
  height: 7px;
  margin: 4px 4px 7px 4px;
  display: inline-block;
  background-size: 99px 16px;
  background-position: 35px 0px;
}
.ui-context-menu .item.children .ui-context-menu {
  margin-left: 135px;
  margin-top: -11px;
  display: none;
}
.ui-context-menu .item:hover {
  background-color: #60b25e;
  color: white;
}
.ui-context-menu .item.children:hover i {
  background-position: 31px 0px;
}
.ui-context-menu .separator {
  width: 135px;
  height: 1px;
  margin: 5px 10px;
  background-color: #e5e9ea;
}
.ui-context-menu .title {
  font-size: 9px;
  font-weight: bold;
  color: #889399;
  height: 13px;
  padding: 8px 0px 0px 20px;
}
/* ----------------------- dark ------------------------ */
.dark .ui-context-menu {
  background-color: #545f65;
  border: 1px solid #323940;
}
.dark .ui-context-menu .item {
  color: #d2dce2;
}
.dark .ui-context-menu .item.children span {
  float: left;
  width: 120px;
}
.dark .ui-context-menu .item.children figure {
  float: right;
  width: 15px;
  height: 20px;
  display: inline-block;
  margin: 0;
}
.dark .ui-context-menu .item:hover {
  background-color: #60b25e;
  color: white;
}
.dark .ui-context-menu .separator {
  background-color: #788287;
}
.dark .ui-context-menu .title {
  color: #d2dce2;
}
/* ----------------------------------------------------- */
/* ------------------------ TABS ----------------------- */
/* ----------------------------------------------------- */
.ui-tab {
  height: 26px;
  width: 554px;
  border-bottom: 1px solid #ccd3d5;
}
.ui-tab .ui-tab-element {
  float: left;
  list-style-type: none;
  margin-left: 2px;
  height: 25px;
  min-width: 55px;
  border-top: 1px solid transparent;
  border-right: 1px solid transparent;
  border-left: 1px solid transparent;
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0;
}
.ui-tab.close {
  height: 30px;
}
.ui-tab.close .ui-tab-element {
  -webkit-border-radius: 0px 0px 0 0;
  -moz-border-radius: 0px 0px 0 0;
  border-radius: 0px 0px 0 0;
  height: 29px;
  margin-left: 0px;
}
.ui-tab.close .ui-tab-element span {
  margin-top: 9px;
}
.ui-tab .ui-tab-element:hover {
  border-top: 1px solid #ccd3d5;
  border-right: 1px solid #ccd3d5;
  border-left: 1px solid #ccd3d5;
  background-color: #eef0f4;
}
.ui-tab.close .ui-tab-element:hover {
  background-color: #eef0f4;
}
.ui-tab .ui-tab-element:hover span {
  color: #545f65;
}
.ui-tab .ui-tab-element.active {
  border-top: 1px solid #ccd3d5;
  border-right: 1px solid #ccd3d5;
  border-left: 1px solid #ccd3d5;
  background-color: #fff;
}
.ui-tab .ui-tab-element span {
  float: left;
  width: calc(100% - 20px);
  text-align: center;
  margin-top: 6px;
  font-size: 13px;
  padding-left: 10px;
  padding-right: 10px;
}
.ui-tab .ui-tab-element span {
  color: #889399;
}
.ui-tab .ui-tab-element.active span {
  color: #545f65;
}
/* ------------------------ dark ------------------------ */
.dark .ui-tab {
  border-bottom: 1px solid #323940;
}
.dark .ui-tab .ui-tab-element:hover {
  border-top: 1px solid #363c43;
  border-right: 1px solid #363c43;
  border-left: 1px solid #363c43;
  background-color: #363c43;
}
.dark .ui-tab .ui-tab-element.active {
  border-top: 1px solid #323940;
  border-right: 1px solid #323940;
  border-left: 1px solid #323940;
  background-color: #545f65;
}
.dark .ui-tab .ui-tab-element.active span {
  color: #d2dce2;
}
/* ----------------------------------------------------- */
/* ---------------------- CHECKBOX --------------------- */
/* ----------------------------------------------------- */
.ui-checkbox {
  position: relative;
  width: 13px;
  height: 13px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  border: solid 1px #ccd3d5;
  overflow: hidden;
  background-color: #60b25e;
  animation: ui-checkbox-background-out-animation 0.2s forwards, ui-checkbox-border-out-first-animation 0.2s forwards, ui-checkbox-border-out-second-animation 0.2s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out, ease-in-out, ease-in-out;
}
.ui-checkbox.active {
  background-color: #cfe8ce;
  box-shadow: 0px 0px 0px 3px #60b25e;
  animation: ui-checkbox-border-in-animation 0.2s forwards, ui-checkbox-background-in-animation 0.2s forwards, ui-checkbox-bordertrans-in-animation 0.2s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out, ease-in-out, ease-in-out;
  z-index: 1;
  overflow: hidden;
  border: solid 1px #ccd3d5;
}
.ui-checkbox.active:before {
  content: "";
  float: left;
  position: absolute;
  width: 13px;
  height: 13px;
  background-color: #60b25e;
  z-index: 1;
  animation: 0.01s ui-checkbox-before-appear-animation forwards, ui-checkbox-check-in-animation 0.2s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out, ease-in-out;
  animation-delay: 0.2s;
  margin-left: 0px;
  opacity: 0;
}
.ui-checkbox.active i {
  float: left;
  position: absolute;
  width: 7px;
  height: 8px;
  background-image: url('../image/uikit/tick.png');
  background-size: 7px 8px;
  margin: 3px;
  opacity: 0;
  animation: 0.1s ui-checkbox-check-appear-animation forwards;
  animation-delay: 0.21s;
  animation-iteration-count: 1;
}
.ui-checkbox i {
  float: left;
  position: absolute;
  width: 7px;
  height: 8px;
  background-image: none;
  background-size: 7px 8px;
  margin: 3px;
  animation: 0.25s ui-checkbox-check-disappear-animation forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
}
.ui-checkbox.inactive {
  background-color: #f0f0f0;
  animation: none;
  box-shadow: none;
}
.ui-checkbox.inactive i {
  animation: none;
}
@keyframes ui-checkbox-border-in-animation {
  0% {
    box-shadow: 0px 0px 0px 3px rgba(96, 178, 94, 0.3), inset 0px 1px #c6dfc5;
  }
  100% {
    box-shadow: 0px 0px 0px 0px #60b25e, inset 0px 1px #60b25e;
  }
}
@keyframes ui-checkbox-background-in-animation {
  0% {
    background-color: #cfe8ce;
  }
  100% {
    background-color: #60b25e;
  }
}
@keyframes ui-checkbox-bordertrans-in-animation {
  0% {
    border: solid 1px #abc9b1;
  }
  100% {
    border: solid 1px #60b25e;
  }
}
@keyframes ui-checkbox-before-appear-animation {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes ui-checkbox-check-appear-animation {
  /*0%{ background-image: none; }
      100%{ background-image: url('@{static}/image/uikit/tick.png'); }*/
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes ui-checkbox-check-in-animation {
  0% {
    margin-left: 0px;
  }
  100% {
    margin-left: 15px;
  }
}
@keyframes ui-checkbox-background-out-animation {
  0% {
    background-color: #60b25e;
  }
  100% {
    background-color: #fff;
  }
}
@keyframes ui-checkbox-border-out-first-animation {
  0% {
    box-shadow: 0px 0px 0px 0px #60b25e;
  }
  100% {
    box-shadow: 0px 0px 0px 3px rgba(96, 178, 94, 0), inset 0 1px rgba(0, 0, 0, 0.05);
  }
}
@keyframes ui-checkbox-border-out-second-animation {
  0% {
    border: solid 1px #60b25e;
  }
  100% {
    border: solid 1px  #ccd3d5;
  }
}
@keyframes ui-checkbox-check-disappear-animation {
  0% {
    background-image: url('../image/uikit/tick.png');
    opacity: 1;
    transform: scale(1);
  }
  100% {
    background-image: url('../image/uikit/tick.png');
    opacity: 0;
    transform: scale(1.4);
  }
}
/* ------------------------ dark ------------------------ */
.dark .ui-checkbox {
  position: relative;
  width: 13px;
  height: 13px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  border: solid 1px #323940;
  overflow: hidden;
  background-color: #60b25e;
  animation: ui-checkbox-background-out-dark-animation 0.2s forwards, ui-checkbox-border-out-first-dark-animation 0.2s forwards, ui-checkbox-border-out-third-dark-animation 0.2s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out, ease-in-out, ease-in-out;
}
.dark .ui-checkbox.active {
  background-color: #cfe8ce;
  box-shadow: 0px 0px 0px 3px #60b25e;
  animation: ui-checkbox-border-in-dark-animation 0.2s forwards, ui-checkbox-background-in-dark-animation 0.2s forwards, ui-checkbox-bordertrans-in-dark-animation 0.2s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out, ease-in-out, ease-in-out;
  z-index: 1;
  overflow: hidden;
  border: solid 1px #ccd3d5;
}
.dark .ui-checkbox.active:before {
  content: "";
  float: left;
  position: absolute;
  width: 13px;
  height: 13px;
  background-color: #60b25e;
  z-index: 1;
  animation: 0.01s ui-checkbox-before-appear-dark-animation forwards, ui-checkbox-check-in-dark-animation 0.2s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out, ease-in-out;
  animation-delay: 0.2s;
  margin-left: 0px;
  opacity: 0;
}
.dark .ui-checkbox.active i {
  float: left;
  position: absolute;
  width: 7px;
  height: 8px;
  background-image: url('../image/uikit/tick.png');
  background-size: 7px 8px;
  margin: 3px;
  animation: 0.1s ui-checkbox-check-appear-dark-animation forwards;
  animation-delay: 0.21s;
  animation-iteration-count: 1;
  opacity: 0;
}
.dark .ui-checkbox i {
  float: left;
  position: absolute;
  width: 7px;
  height: 8px;
  background-image: none;
  background-size: 7px 8px;
  margin: 3px;
  animation: 0.2s ui-checkbox-check-disappear-dark-animation forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
}
.dark .ui-checkbox.inactive {
  background-color: #4a535b;
  border: 1px solid #384048;
  animation: none;
  box-shadow: none;
}
.dark .ui-checkbox.inactive i {
  animation: none;
}
@keyframes ui-checkbox-border-in-dark-animation {
  0% {
    box-shadow: 0px 0px 0px 3px rgba(96, 178, 94, 0.3), inset 0px 1px #55755f;
  }
  100% {
    box-shadow: 0px 0px 0px 0px #60b25e, inset 0px 1px #60b25e;
  }
}
@keyframes ui-checkbox-background-in-dark-animation {
  0% {
    background-color: #587863;
  }
  100% {
    background-color: #60b25e;
  }
}
@keyframes ui-checkbox-bordertrans-in-dark-animation {
  0% {
    border: solid 1px #405e49;
  }
  100% {
    border: solid 1px #60b25e;
  }
}
@keyframes ui-checkbox-before-appear-dark-animation {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes ui-checkbox-check-appear-dark-animation {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes ui-checkbox-check-in-dark-animation {
  0% {
    margin-left: 0px;
  }
  100% {
    margin-left: 15px;
  }
}
@keyframes ui-checkbox-background-out-dark-animation {
  0% {
    background-color: #60b25e;
  }
  100% {
    background-color: #545f65;
  }
}
@keyframes ui-checkbox-border-out-first-dark-animation {
  0% {
    box-shadow: 0px 0px 0px 0px #60b25e;
  }
  100% {
    box-shadow: 0px 0px 0px 3px rgba(96, 178, 94, 0), inset 0 1px rgba(0, 0, 0, 0.05);
  }
}
@keyframes ui-checkbox-border-out-second-dark-animation {
  0% {
    box-shadow: 0px 0px 0px 2px #60b25e;
  }
  100% {
    box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  }
}
@keyframes ui-checkbox-border-out-third-dark-animation {
  0% {
    border: solid 1px #60b25e;
  }
  100% {
    border: solid 1px  #323940;
  }
}
@keyframes ui-checkbox-check-disappear-dark-animation {
  0% {
    background-image: url('../image/uikit/tick.png');
    opacity: 1;
    transform: scale(1);
  }
  100% {
    background-image: url('../image/uikit/tick.png');
    opacity: 0;
    transform: scale(1.4);
  }
}
/* ----------------------------------------------------- */
/* ------------------- RADIO BUTTONS ------------------- */
/* ----------------------------------------------------- */
.ui-radio-button {
  position: relative;
  width: 13px;
  height: 13px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  background-color: #60b25e;
  -webkit-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  border: solid 1px #ccd3d5;
  animation: ui-radio-button-forth-animation 0.17s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
}
.ui-radio-button.active {
  background-color: #cfe8ce;
  box-shadow: 0px 0px 0px 3px #60b25e;
  border: solid 1px #ccd3d5;
  animation: ui-radio-button-first-animation 0.2s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
}
.ui-radio-button i {
  float: left;
  width: 7px;
  height: 7px;
  background-color: #fff;
  border-radius: 10px;
  margin-top: 3px;
  margin-left: 3px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15);
  opacity: 0;
  animation: ui-radio-button-third-animation 0.17s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
}
.ui-radio-button.active i {
  animation: ui-radio-button-second-animation 0.13s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
  animation-delay: 0.2s;
}
.ui-view-spot.inactive {
  background-color: #f0f0f0;
  animation: none;
}
@keyframes ui-radio-button-first-animation {
  0% {
    box-shadow: 0px 0px 0px 3px rgba(96, 178, 94, 0.3), inset 0px 1px #c6dfc5;
    background-color: #cfe8ce;
    border: solid 1px #abc9b1;
  }
  100% {
    box-shadow: 0px 0px 0px 0px #60b25e, inset 0px 1px #60b25e;
    background-color: #60b25e;
    border: solid 1px #60b25e;
  }
}
@keyframes ui-radio-button-second-animation {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes ui-radio-button-third-animation {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(0);
  }
}
@keyframes ui-radio-button-forth-animation {
  0% {
    background-color: #60b25e;
    box-shadow: 0px 0px 0px 0px #60b25e;
    border: solid 1px #60b25e;
  }
  100% {
    background-color: #fff;
    box-shadow: 0px 0px 0px 3px rgba(96, 178, 94, 0), inset 0 1px rgba(0, 0, 0, 0.05);
    border: solid 1px  #ccd3d5;
  }
}
/* ------------------------ dark ------------------------ */
.dark .ui-radio-button {
  position: relative;
  width: 13px;
  height: 13px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  border-radius: 10px;
  background-color: #60b25e;
  -webkit-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  box-shadow: inset 0 1px rgba(0, 0, 0, 0.05);
  border: solid 1px #323940;
  animation: ui-radio-button-forth-dark-animation 0.17s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
}
.dark .ui-radio-button.active {
  background-color: #cfe8ce;
  box-shadow: 0px 0px 0px 3px #60b25e;
  border: solid 1px #ccd3d5;
  animation: ui-radio-button-first-dark-animation 0.2s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
}
.dark .ui-radio-button i {
  float: left;
  width: 7px;
  height: 7px;
  background-color: #fff;
  border-radius: 10px;
  margin-top: 3px;
  margin-left: 3px;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.15);
  opacity: 0;
  animation: ui-radio-button-third-dark-animation 0.17s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
}
.dark .ui-radio-button.active i {
  animation: ui-radio-button-second-dark-animation 0.13s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
  animation-delay: 0.2s;
}
.dark .ui-view-spot.inactive {
  background-color: #4a535b;
  animation: none;
  border: 1px solid #384048;
  box-shadow: none;
}
@keyframes ui-radio-button-first-dark-animation {
  0% {
    box-shadow: 0px 0px 0px 3px rgba(96, 178, 94, 0.3), inset 0px 1px #55755f;
    background-color: #587863;
    border: solid 1px #405e49;
  }
  100% {
    box-shadow: 0px 0px 0px 0px #60b25e, inset 0px 1px #60b25e;
    background-color: #60b25e;
    border: solid 1px #60b25e;
  }
}
@keyframes ui-radio-button-second-dark-animation {
  0% {
    opacity: 0;
    transform: scale(0);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes ui-radio-button-third-dark-animation {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  100% {
    opacity: 0;
    transform: scale(0);
  }
}
@keyframes ui-radio-button-forth-dark-animation {
  0% {
    background-color: #60b25e;
    box-shadow: 0px 0px 0px 0px #60b25e;
    border: solid 1px #60b25e;
  }
  100% {
    background-color: #545f65;
    box-shadow: 0px 0px 0px 3px rgba(96, 178, 94, 0), inset 0 1px rgba(0, 0, 0, 0.05);
    border: solid 1px  #323940;
  }
}
/* ----------------------------------------------------- */
/* ------------------- GROUPED ICONS ------------------- */
/* ----------------------------------------------------- */
.ui-icons-grouped {
  width: 109px;
  height: 27px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #fff;
  -webkit-box-shadow: 0 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: 0 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px rgba(0, 0, 0, 0.05);
}
.ui-icons-grouped figure {
  width: 27px;
  height: 25px;
  border-top: solid 1px #c2cacd;
  border-bottom: solid 1px #c2cacd;
  background-color: #fff;
  float: left;
  margin: 0;
}
.ui-icons-grouped figure:first-child {
  border-left: solid 1px #c2cacd;
  border-radius: 3px 0 0 3px;
}
.ui-icons-grouped figure:last-child {
  border-right: solid 1px #c2cacd;
  width: 26px;
  border-radius: 0 3px 3px 0;
}
.ui-icons-grouped figure:hover {
  background-color: #eef0f4;
}
.ui-icons-grouped figure:active {
  background-image: -webkit-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -moz-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -o-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -ms-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: linear-gradient(to bottom, #dfe3e6, #ecf0f3);
  background-color: none;
}
.ui-icons-grouped i {
  float: left;
  position: absolute;
  margin-left: -1px;
  margin-top: 7px;
  margin-bottom: 6px;
  margin-left: 12px;
  width: 14px;
  height: 12px;
  border-right: solid 1px #c2cacd;
  z-index: 1;
}
.ui-icons-grouped .ui-alignment-justified i {
  border: 0;
}
.ui-icons-grouped .active i::after {
  content: "";
  float: left;
  width: 26px;
  position: absolute;
  height: 25px;
  padding-bottom: inherit;
  margin-top: -8px;
  margin-left: -13px;
  border: 1px solid #56a054;
  background-color: #60b25e;
}
.ui-icons-grouped .active.ui-alignment-left i::after {
  content: "";
  float: left;
  width: 26px;
  position: absolute;
  height: 25px;
  padding-bottom: inherit;
  margin-top: -8px;
  margin-left: -13px;
  border: 1px solid #56a054;
  background-color: #60b25e;
  border-radius: 3px 0 0 3px;
}
.ui-icons-grouped .active.ui-alignment-justified i::after {
  content: "";
  float: left;
  width: 26px;
  position: absolute;
  height: 25px;
  padding-bottom: inherit;
  margin-top: -8px;
  margin-left: -13px;
  border: 1px solid #56a054;
  background-color: #60b25e;
  border-radius: 0 3px 3px 0;
}
.ui-icons-grouped .ui-alignment-left i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 12;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 0 0;
  z-index: 2;
}
.ui-icons-grouped .ui-alignment-center i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 12;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 44px 0;
  z-index: 2;
}
.ui-icons-grouped .ui-alignment-right i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 12;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 29px 0;
  z-index: 2;
}
.ui-icons-grouped .ui-alignment-justified i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 12;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 14px 0;
  z-index: 2;
}
.ui-icons-grouped .active.ui-alignment-left i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 12;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 0 23px;
  z-index: 2;
}
.ui-icons-grouped .active.ui-alignment-center i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 12;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 44px 23px;
  z-index: 2;
}
.ui-icons-grouped .active.ui-alignment-right i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 12;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 29px 23px;
  z-index: 2;
}
.ui-icons-grouped .active.ui-alignment-justified i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 12;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 14px 23px;
  z-index: 2;
}
/* ------------------------ dark ------------------------ */
.dark .ui-icons-grouped {
  width: 109px;
  height: 27px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  -webkit-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.05), inset 0 2px rgba(255, 255, 255, 0.03);
  -moz-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.05), inset 0 2px rgba(255, 255, 255, 0.03);
  box-shadow: 0 2px 1px rgba(0, 0, 0, 0.05), inset 0 2px rgba(255, 255, 255, 0.03);
  background-image: -webkit-linear-gradient(bottom, #404951, #47525b);
  background-image: -moz-linear-gradient(bottom, #404951, #47525b);
  background-image: -o-linear-gradient(bottom, #404951, #47525b);
  background-image: -ms-linear-gradient(bottom, #404951, #47525b);
  background-image: linear-gradient(to top, #404951, #47525b);
}
.dark .ui-icons-grouped figure {
  border-top: solid 1px #2c3238;
  border-bottom: solid 1px #2c3238;
  background-color: transparent;
}
.dark .ui-icons-grouped figure:first-child {
  border-left: solid 1px #2c3238;
  border-radius: 3px 0 0 3px;
}
.dark .ui-icons-grouped figure:last-child {
  border-right: solid 1px #2c3238;
  border-radius: 0 3px 3px 0;
}
.dark .ui-icons-grouped i {
  border-right: solid 1px #2c3238;
}
.dark .ui-icons-grouped figure:hover {
  background-color: #545f65;
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.03);
  -moz-box-shadow: inset 0 1px rgba(255, 255, 255, 0.03);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.03);
  background-image: -webkit-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -moz-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -o-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -ms-linear-gradient(bottom, #49535c, #535f6a);
  background-image: linear-gradient(to top, #49535c, #535f6a);
}
.dark .ui-icons-grouped figure:active {
  background-color: #363c43;
  background-image: -webkit-linear-gradient(top, #323a40, #3d444b);
  background-image: -moz-linear-gradient(top, #323a40, #3d444b);
  background-image: -o-linear-gradient(top, #323a40, #3d444b);
  background-image: -ms-linear-gradient(top, #323a40, #3d444b);
  background-image: linear-gradient(to bottom, #323a40, #3d444b);
}
.dark .ui-icons-grouped .ui-alignment-left i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 11;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 0 11px;
  z-index: 2;
}
.dark .ui-icons-grouped .ui-alignment-center i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 11;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 44px 11px;
  z-index: 2;
}
.dark .ui-icons-grouped .ui-alignment-right i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 11;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 29px 11px;
  z-index: 2;
}
.dark .ui-icons-grouped .ui-alignment-justified i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 11;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 14px 11px;
  z-index: 2;
}
.dark .ui-icons-grouped .active.ui-alignment-left i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 12;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 0 23px;
  z-index: 2;
}
.dark .ui-icons-grouped .active.ui-alignment-center i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 12;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 44px 23px;
  z-index: 2;
}
.dark .ui-icons-grouped .active.ui-alignment-right i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 12;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 29px 23px;
  z-index: 2;
}
.dark .ui-icons-grouped .active.ui-alignment-justified i::before {
  content: "";
  float: left;
  width: 14;
  position: absolute;
  height: 12;
  padding-bottom: inherit;
  margin-left: -6px;
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 14px 23px;
  z-index: 2;
}
/* ----------------------------------------------------- */
/* ----------------- UNGROUPED ICONS ------------------- */
/* ----------------------------------------------------- */
.ui-icons-ungrouped {
  height: 30px;
}
.ui-alignment-btn {
  float: left;
  width: 26px;
  height: 26px;
  background-color: transparent;
  margin: 0px 2px 0px 0px;
  border: 1px solid transparent;
}
.ui-alignment-dropdown {
  float: left;
  width: 38px;
  height: 26px;
  background-color: transparent;
  margin: 0px 2px 0px 0px;
  border: 1px solid transparent;
}
.ui-alignment-btn:hover,
.ui-alignment-dropdown:hover {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #fff;
  -webkit-box-shadow: 0 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: 0 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px rgba(0, 0, 0, 0.05);
  border: solid 1px #c2cacd;
}
.ui-alignment-btn:active,
.ui-alignment-dropdown:active {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #fff;
  border: solid 1px #c2cacd;
  background-image: -webkit-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -moz-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -o-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -ms-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: linear-gradient(to bottom, #dfe3e6, #ecf0f3);
  box-shadow: none;
}
.ui-alignment-btn.active,
.ui-alignment-dropdown.active {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #fff;
  border: solid 1px #60b25e;
}
.ui-alignment-btn.inactive,
.ui-alignment-dropdown.inactive {
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background-color: #fff !important;
  border: solid 1px #c2cacd;
  background-image: none;
}
.ui-alignment-btn i {
  float: left;
  width: 14px;
  height: 11px;
  margin: 7px 6px 8px 6px;
}
.ui-alignment-dropdown i {
  float: left;
  width: 26px;
  height: 13px;
  margin: 6px 6px 7px 6px;
  background-image: url('../image/uikit/sprite-align-dropdown.png');
}
.ui-alignment-left-btn i {
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 0 0;
}
.ui-alignment-center-btn i {
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 44px 0;
}
.ui-alignment-right-btn i {
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 29px 0;
}
.ui-alignment-justified-btn i {
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 14px 0;
}
.ui-alignment-btn.inactive i {
  opacity: 0.5;
}
/* ------------------------ dark ------------------------ */
.dark .ui-alignment-btn:hover,
.dark .ui-alignment-dropdown:hover {
  background-color: #545f65;
  -webkit-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.05), inset 0 2px rgba(255, 255, 255, 0.03);
  -moz-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.05), inset 0 2px rgba(255, 255, 255, 0.03);
  box-shadow: 0 2px 1px rgba(0, 0, 0, 0.05), inset 0 2px rgba(255, 255, 255, 0.03);
  border: solid 1px rgba(0, 0, 0, 0.3);
  background-image: -webkit-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -moz-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -o-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -ms-linear-gradient(bottom, #49535c, #535f6a);
  background-image: linear-gradient(to top, #49535c, #535f6a);
}
.dark .ui-alignment-btn:active,
.dark .ui-alignment-dropdown:active {
  background-color: #363c43;
  border: solid 1px rgba(0, 0, 0, 0.3);
  background-image: -webkit-linear-gradient(top, #323a40, #3d444b);
  background-image: -moz-linear-gradient(top, #323a40, #3d444b);
  background-image: -o-linear-gradient(top, #323a40, #3d444b);
  background-image: -ms-linear-gradient(top, #323a40, #3d444b);
  background-image: linear-gradient(to bottom, #323a40, #3d444b);
  box-shadow: none;
}
.dark .ui-alignment-btn.active,
.dark .ui-alignment-dropdown.active {
  background-color: #60b25e;
  border: solid 1px rgba(0, 0, 0, 0.2);
  background-image: none;
}
.dark .ui-alignment-btn.inactive {
  background-color: #545f65 !important;
  border: solid 1px rgba(0, 0, 0, 0.2);
  background-image: none;
}
.dark .ui-alignment-dropdown i {
  background-position: 0 13px;
}
.dark .ui-alignment-left-btn i {
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 0 11px;
}
.dark .ui-alignment-center-btn i {
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 44px 11px;
}
.dark .ui-alignment-right-btn i {
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 29px 11px;
}
.dark .ui-alignment-justified-btn i {
  background-image: url('../image/uikit/sprite-align.png');
  background-position: 14px 11px;
}
/* ----------------------------------------------------- */
/* ----------------------- ALERT ----------------------- */
/* ----------------------------------------------------- */
.alert {
  float: left;
  position: absolute;
  margin-top: 41px;
  width: 100%;
  height: calc(100% - 41px);
  -webkit-border-radius: 0 0 6px 6px;
  -moz-border-radius: 0 0 6px 6px;
  border-radius: 0 0 6px 6px;
  background-color: rgba(0, 0, 0, 0.4);
  animation: ui-alert-appear-animation 0.2s forwards;
  animation-iteration-count: 1;
  animation-timing-function: ease-in-out;
  display: none;
}
.alert-content {
  position: absolute;
  width: 437px;
  height: 151px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  background-color: #fff;
  -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15);
  left: 50%;
  transform: translate(-50%, -50%);
  top: 50%;
  padding-top: 26px;
  padding-left: 26px;
  padding-right: 16px;
  padding-bottom: 16px;
}
@keyframes ui-alert-appear-animation {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.alert-title {
  font-family: Lato;
  float: left;
  font-size: 17px;
  font-weight: bold;
  color: #545f65;
  margin-bottom: 26px;
}
.alert-txt {
  font-family: Lato;
  line-height: 24px;
  float: left;
  font-size: 15px;
  color: #545f65;
  margin-bottom: 26px;
}
.alert .ui-btn.accept,
.alert .ui-btn.gray,
.alert .ui-btn.cancel {
  float: right;
  margin-left: 7px;
  margin-bottom: 16px;
  margin-right: 0px;
}
/* ----------------------- dark ------------------------ */
.dark .alert-content {
  background-color: #535e64;
}
.dark .alert-title {
  color: white;
}
.dark .alert-txt {
  color: #d2dce2;
}
/* ----------------------------------------------------- */
/* ---------------------- WINDOW ----------------------- */
/* ----------------------------------------------------- */
.ui-window {
  width: 600px;
  height: 600px;
  border-radius: 7px;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  background-color: transparent;
  -webkit-box-shadow: 0 20px 40px rgba(34, 31, 26, 0.3);
  -moz-box-shadow: 0 20px 40px rgba(34, 31, 26, 0.3);
  box-shadow: 0 20px 40px rgba(34, 31, 26, 0.3);
}
.ui-header {
  float: left;
  height: 40px;
  width: 100%;
  border-bottom: 1px solid #ccd3d5;
  background-color: #fff;
  background-image: -webkit-linear-gradient(bottom, #e9ecef, #f9fafb);
  background-image: -moz-linear-gradient(bottom, #e9ecef, #f9fafb);
  background-image: -o-linear-gradient(bottom, #e9ecef, #f9fafb);
  background-image: -ms-linear-gradient(bottom, #e9ecef, #f9fafb);
  background-image: linear-gradient(to top, #e9ecef, #f9fafb);
}
.ui-header-brand {
  float: left;
  padding-left: 16px;
  padding-top: 13px;
  padding-bottom: 12px;
}
.ui-header-brand span {
  float: left;
  font-size: 15px;
  font-family: 'Lato';
  color: #545f65;
}
.ui-header .ui-header-buttons {
  float: right;
}
.ui-header .ui-header-buttons .ui-minimize,
.ui-header .ui-header-buttons .ui-maximize {
  margin-right: 8px;
}
.ui-header .ui-header-buttons .ui-close {
  margin-right: 12px;
}
.ui-header .ui-header-buttons .ui-minimize,
.ui-header .ui-header-buttons .ui-maximize,
.ui-header .ui-header-buttons .ui-close {
  float: left;
  margin-top: 8px;
  margin-bottom: 8px;
  height: 10px;
  width: 10px;
  padding: 7px;
  border: 1px solid transparent;
  margin-left: 0;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.ui-header-buttons .ui-minimize:hover,
.ui-header-buttons .ui-maximize:hover,
.ui-header-buttons .ui-close:hover {
  -webkit-box-shadow: 0 1px rgba(0, 0, 0, 0.05);
  -moz-box-shadow: 0 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px rgba(0, 0, 0, 0.05);
  border: solid 1px #c2cacd;
  background-color: #fff;
}
.ui-header-buttons .ui-minimize:active,
.ui-header-buttons .ui-maximize:active,
.ui-header-buttons .ui-close:active {
  border: solid 1px #c2cacd;
  background-image: -webkit-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -moz-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -o-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: -ms-linear-gradient(top, #dfe3e6, #ecf0f3);
  background-image: linear-gradient(to bottom, #dfe3e6, #ecf0f3);
  box-shadow: none;
}
.ui-header .ui-header-buttons .inactive:hover,
.ui-header .ui-header-buttons .inactive:active {
  border: 1px solid transparent;
  background-image: none;
  background-color: transparent;
  box-shadow: none;
}
.ui-minimize i {
  float: left;
  width: 10px;
  height: 10px;
  background: url('../image/uikit/sprite-icons-white.png');
  background-size: 40px 10px;
}
.ui-maximize i {
  float: left;
  width: 10px;
  height: 10px;
  background: url('../image/uikit/sprite-icons-white.png');
  background-position: 30px 0;
  background-size: 40px 10px;
}
.ui-close i {
  float: left;
  width: 10px;
  height: 10px;
  background: url('../image/uikit/sprite-icons-white.png');
  background-position: 10px 0;
  background-size: 40px 10px;
}
.ui-header-buttons .inactive i {
  opacity: 0.3;
}
.ui-navbar {
  float: left;
  width: 180px;
  height: calc(100% - 41px);
  border-radius: 0 0 0 6px;
  background-color: #f7f8fa;
  border-right: 1px solid #ccd3d5;
}
.ui-navgroup {
  float: left;
}
.ui-navgroup-title {
  float: left;
  padding-left: 16px;
  padding-top: 17px;
  padding-bottom: 17px;
}
.ui-navgroup-title-txt {
  float: left;
  font-size: 11px;
  font-family: 'Lato';
  color: #868c8e;
}
.ui-navgroup-element {
  float: left;
  width: 180px;
  height: 24px;
  border-top: 1px solid transparent;
  border-bottom: 1px solid transparent;
  margin-bottom: 2px;
}
.ui-navgroup-element:hover {
  background-color: #d9eadb;
  border-top: 1px solid #c1dfc2;
  border-bottom: 1px solid #c1dfc2;
}
.ui-navgroup .ui-navgroup-element.active {
  background-color: #60b25e;
  border-top: 1px solid #60b25e;
  border-bottom: 1px solid #60b25e;
}
.ui-navgroup-element-icon {
  float: left;
  padding-top: 6px;
  padding-bottom: 5px;
  padding-left: 18px;
  padding-right: 8px;
  width: 14px;
  height: 24px;
  margin: 0px;
}
.ui-navgroup-element-icon i {
  float: left;
  width: 14px;
  height: 14px;
}
.ui-navgroup-element-txt {
  float: left;
  padding-top: 6px;
  padding-bottom: 5px;
  font-size: 13px;
  font-family: 'Lato';
  color: #545f65;
}
.active .ui-navgroup-element-txt {
  color: #fff;
}
.ui-window-content {
  float: left;
  width: calc(100% - 181px);
  height: calc(100% - 41px);
  background-color: #fff;
  border-radius: 0 0 6px 0;
}
/* ------------------------ dark ------------------------ */
.dark .ui-window {
  background-color: #2c3238;
  background-image: none;
}
.dark .ui-header {
  border-bottom: 1px solid #2c3238;
  background-color: #2c3238;
  background-image: none;
}
.dark .ui-header-brand span {
  color: #bdc4c6;
}
.dark .ui-header-buttons .ui-minimize:hover,
.dark .ui-header-buttons .ui-maximize:hover,
.dark .ui-header-buttons .ui-close:hover {
  background-color: #545f65;
  -webkit-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.05), inset 0 1px rgba(255, 255, 255, 0.03);
  -moz-box-shadow: 0 2px 1px rgba(0, 0, 0, 0.05), inset 0 1px rgba(255, 255, 255, 0.03);
  box-shadow: 0 2px 1px rgba(0, 0, 0, 0.05), inset 0 1px rgba(255, 255, 255, 0.03);
  border: solid 1px rgba(0, 0, 0, 0.3);
  background-image: -webkit-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -moz-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -o-linear-gradient(bottom, #49535c, #535f6a);
  background-image: -ms-linear-gradient(bottom, #49535c, #535f6a);
  background-image: linear-gradient(to top, #49535c, #535f6a);
  -moz-background-clip: padding;
  -webkit-background-clip: padding;
  background-clip: padding-box;
}
.dark .ui-header-buttons .ui-minimize:active,
.dark .ui-header-buttons .ui-maximize:active,
.dark .ui-header-buttons .ui-close:active {
  background-color: #363c43;
  border: solid 1px rgba(0, 0, 0, 0.3);
  background-image: -webkit-linear-gradient(top, #323a40, #3d444b);
  background-image: -moz-linear-gradient(top, #323a40, #3d444b);
  background-image: -o-linear-gradient(top, #323a40, #3d444b);
  background-image: -ms-linear-gradient(top, #323a40, #3d444b);
  background-image: linear-gradient(to bottom, #323a40, #3d444b);
  -moz-background-clip: padding;
  -webkit-background-clip: padding;
  background-clip: padding-box;
  box-shadow: none;
}
.dark .ui-header .ui-header-buttons .inactive:hover,
.dark .ui-header .ui-header-buttons .inactive:active {
  border: 1px solid transparent;
  background-image: none;
  background-color: transparent;
  box-shadow: none;
}
.dark .ui-minimize i {

  background-size: 40px 10px;
}
.dark .ui-maximize i {
  background: url('./uikit/sprite-icons-dark.png');
  background-position: 30px 0;
  background-size: 40px 10px;
}
.dark .ui-close i {
  background: url('./uikit/sprite-icons-dark.png');
  background-position: 10px 0;
  background-size: 40px 10px;
}
.dark .ui-navbar {
  background-color: #363d46;
  border-right: 1px solid #2c3238;
}
.dark .ui-navgroup-title-txt {
  color: #9ea4a6;
}
.dark .ui-navgroup-element:hover {
  background-color: #3e544b;
  border-top: 1px solid #45674f;
  border-bottom: 1px solid #45674f;
}
.dark .ui-navgroup .ui-navgroup-element.active {
  background-color: #60b25e;
  border-top: 1px solid #60b25e;
  border-bottom: 1px solid #60b25e;
}
.dark .ui-navgroup-element-txt {
  color: #bdc4c6;
}
.dark .active .ui-navgroup-element-txt,
.dark .ui-navgroup-element:hover .ui-navgroup-element-txt {
  color: #fff;
}
.dark .ui-window-content {
  background-color: #3f4750;
}