hestiacp/web/css/src/themes/dark.css

/*  
    Theme Name:  Dark
    Author:      Kristan Kenney (@kristankenney)
    Website:     www.hestiacp.com 
*/

body {
  background-color: #282828;
}

b,
strong {
  color: #cacaca;
}

button,
select {
  text-shadow: 0 0 0 #d4d4d4 !important;
}

body {
  color: #cdcdcd;
}

.body-login, .body-reset {
  background: #303030 !important;
  background: radial-gradient(circle, rgba(77,77,77,1) 0%, rgba(31,31,31,1) 100%) !important;
}

a {
  color: #cdcdcd;
}

.disabled {
}

.l-header {
  background: #454545;
  border-bottom: 1px solid #505050;
  text-shadow: 1px 1px rgba(0,0,0,0.5);
  box-shadow: 0px 8px 15px rgba(0,0,0,0.25);
}

.l-menu__item.l-menu__item--active a {
  color: #dadada;
  background: linear-gradient(to bottom, rgba(15,15,15,0.6) 0%,rgba(45,45,45,0.75) 30%,rgba(60,60,60,1) 95%);
  text-shadow: 0px 1px rgba(0,0,0,0.5);
  border-left-color: #353535;
  border-right-color: #353535;
}

.l-menu__item a {
  color: #e7e7e7;
}

.l-menu__item a:hover {
  color: #dadada !important;
  text-shadow: 1px 1px rgba(0,0,0,0.5) !important;
  background: linear-gradient(to bottom, rgba(15,15,15,0.6) 0%,rgba(45,45,45,0.75) 30%,rgba(60,60,60,1) 95%) !important;
  box-shadow: none !important;
}
.l-menu__item a:active {
  background: linear-gradient(to bottom, rgba(15,15,15,0.7) 0%,rgba(45,45,45,0.85) 30%,rgba(50,50,50,1) 95%) !important;
  color: #fff !important;
  text-shadow: 0px -1px 1px rgba(0,0,0,0.5) !important;
}

.l-menu__item.l-menu__item--active:hover {
  background: linear-gradient(to bottom, rgba(255,255,255,0.15) 0%,rgba(255,255,255,0.15) 30%,rgba(255,255,255,0.15) 95%) !important;
}

.lang-ar .l-menu__item a {
  padding: 11px 11px;
}

.lang-de .l-menu__item a {
  padding: 11px 12px;
}

.lang-tw .l-menu__item a {
  padding: 13px 18px;
}

.l-profile {
  overflow: hidden;
  float: right;
}

.l-profile__logout {
  color: #e7e7e7 !important;
}

.l-profile__server {
  color: #ceefff;
  margin-top: 10px;
  float: left;
}

.l-profile__notifications {
  color: #fff;
  cursor: pointer;
  font-weight: 600;
  padding: 10px 5px 0;
  font-size: 1.2rem !important;
  line-height: 0.95rem;
  border-left: 1px solid transparent !important;
  border-right: 1px solid transparent !important;
}

.l-profile__notifications.active.l-profile__notifications.updates:active {
  background: linear-gradient(to bottom, rgba(15,15,15,0.6) 0%,rgba(45,45,45,0.75) 30%,rgba(60,60,60,1) 95%) !important;
  color: #046c98 !important;
  text-shadow: 0px -1px 1px rgba(0,0,0,0.5) !important;
  box-shadow: none !important;
  transition: 0.2s;
  border-left: 1px solid transparent !important;
  border-right: 1px solid transparent !important;
}

.l-profile__notifications:hover,.l-profile__notifications.updates:hover {
  text-shadow: 1px 1px rgba(0,0,0,0.5) !important;
  background: linear-gradient(to bottom, rgba(15,15,15,0.6) 0%,rgba(45,45,45,0.75) 30%,rgba(60,60,60,1) 95%) !important;
  border: none !important;
  border-left: 1px solid transparent !important;
  border-right: 1px solid transparent !important;
  box-shadow: none !important;
}

.notification-container {
  background-color: rgba(50,50,50,0.99);
  text-shadow: 0px 1px rgba(0,0,0,0.5);
  color: #dadada;
  border: 1px solid #404040;
}

.notification-container .empty .status-icon {
  color: #dadada;
}

.notification-container .unseen {
  color: #dadada;
}

.notification-container li {
  border-bottom: 1px solid #282828;
}

.notification-container .mark-seen {
  background-color: #ff3478;
}

.notification-container .unseen .title a,
.notification-container .unseen .title {
  color: #fff !important;
}

.notification-container a {
  color: #4fabe9;
}

.notification-container a:hover {
  color: #0099ff;
}

.notification-container a:active {
  color: #0079cb;
}

.alert {
  border: 1px solid #212121;
}

.alert.alert-danger {
  background-color: #d13535;
}

.alert.alert-danger i.fas {
  color: #d13535;
}

.alert.alert-success {
}

.alert.alert-success i.fas {
}

.card {
  float: left;
  background: #454545;
  color: #fafafa;
  text-shadow: 0px 1px rgba(0,0,0,0.95) !important;
  border: 1px solid #606060;
  box-shadow: 0px 1px 4px rgba(0,0,0,0.2),
              inset 0px 0px 60px rgba(0,0,0,0.25);
}

.card.disable {
}

.card.disable .card-thumb {
}

.card .card-details {
}

.card .card-details p {
  color: #bdbdbd;
}

.card p.card-title {
  color: #fafafa;
}

.card .card-thumb {
}

.card .card-thumb img {
}

.card button {
}

.l-stat {
  background-color: #282828;
}

.l-stat__col {
}

.l-stat__col li {
  color: #b7b7b7 !important;
}

.l-stat__col a {
  border-bottom: 4px solid #282828;
  background-color: #282828;
}

.l-stat__col a:hover {
  border-bottom: 4px solid #d7d7d7;
}

.l-stat__col a:active, .l-stat__col a:focus {
  border-bottom: 4px solid #d11755;
}

.l-stat__col--active a {
  border-bottom: 4px solid #e93b76;
}

.l-stat.active .l-stat__col.focus a {
  border-bottom: 4px solid #e93b76;
}

.l-stat.active .l-stat__col.focus a .l-stat__col-title {
}

.l-stat__col a:hover .l-stat__col-title {
  color: #d7d7d7;
}

.l-stat__col a:active .l-stat__col-title {
}

.l-stat__col-title {
  font-weight: 500;
  color: #bcbcbc;
  text-shadow: 0px 1px rgba(0,0,0,0.4);
}

.l-stat__col--active .l-stat__col-title {
  color: #ff558f;
}

.l-stat__col .fas {
  color: #707070;
  padding: 4px;
}

.l-stat__col--active .fas {
  color: #aaaaaa;
}

.l-separator.selected,
.l-separator {
  border-top: 1px solid #454545;
}

div.l-content > div.l-separator:nth-of-type(2) {
}

div.l-content > div.l-separator:nth-of-type(4) {
  border-bottom: 1px solid #454545;
  background-color: #282828;
  box-shadow: 0px 4px 6px rgba(0,0,0,0.25) !important;
}

.l-sort {
  background-color: #282828;
}

.context-menu.sort-order {
  background-color: rgba(40,40,40,0.95);
  box-shadow: 0 2px 16px 0 rgba(20, 20, 20, 0.65);
  border-radius: 4px;
  border: 1px solid rgba(90,90,90,1);
}

.context-menu li {
  border-bottom: 1px solid #454545;
  color: #dadada;
}

.context-menu.sort-order span.active {
  background-color: #454545 !important;
  color: #fff;
  background: linear-gradient(to bottom, rgba(15,15,15,0.6) 0%,rgba(45,45,45,0.75) 30%,rgba(60,60,60,1) 95%);
  text-shadow: 0px 1px rgba(0,0,0,0.8);
}

.context-menu.sort-order span:hover {
  color: #fff;
  background:  linear-gradient(to bottom, rgba(25,25,25,0.6) 0%,rgba(55,55,55,0.75) 30%,rgba(70,70,70,1) 95%);
  text-shadow: 0px -1px 1px rgba(0,0,0,0.5);
  box-shadow: inset 0px 0px 1px rgba(0,0,0,0.4),
              inset -1px -1px 4px rgba(40,40,40,0.4);
}

.context-menu.sort-order span:active,.context-menu.sort-order span:focus {
  background: linear-gradient(to bottom, rgba(35,35,35,0.6) 0%,rgba(65,65,65,0.75) 30%,rgba(80,80,80,1) 95%);
  color: #fff;
  text-shadow: 0px -1px 1px rgba(0,0,0,0.5);
  box-shadow: inset 0px 0px 1px rgba(0,0,0,0.4),
              inset -1px -1px 4px rgba(40,40,40,0.4);
}

.l-sort-toolbar .sort-by:hover {
  color: #d4d4d4;
}

.l-sort-toolbar .sort-by:hover b {
  color: #d4d4d4;
}

.l-sort-toolbar .toggle-all:hover {
  color: #d4d4d4;
}

.l-sort-toolbar__filter-apply {
  border: 1px solid #454545;
  background-color: #424242;
  text-shadow: 1px 1px rgba(0,0,0,0.9) !important;
  box-shadow: 0px 1px 1px rgba(0,0,0,0.4) !important;
  color: #cacaca;
  font-size: 1em;
}

.l-sort-toolbar__filter-apply:hover {
  color: #0099ff;
  background-color: #454545;
}

.l-sort-toolbar__filter-apply:active {
  color: #0074c2;
  text-shadow: 0px -1px rgba(255,255,255,0.2);
  box-shadow: inset 1px 1px 0px rgba(0,0,0,0.2);
}

.l-sort-toolbar .vst {
  color: #dadada;
}

.l-sort-toolbar .vst:hover {
  color: #ff3478;
}

.l-sort-toolbar .vst:active {
}

.l-sort-toolbar .vst.selected {
  color: #ff3478;
}

.l-unit-toolbar__buttonstrip {
}

.l-unit-toolbar__buttonstrip a {
}

.l-unit-toolbar__buttonstrip .fas {
}

.subtitle {
  color: #ff3478;
}

.l-select {
  border: 1px solid #454545;
  box-shadow: 0px 1px 1px rgba(0,0,0,0.4) !important;
}

.l-select:after {
}

.l-select select {
  background-color: #212121;
  box-shadow: 0px 1px 1px rgba(0,0,0,0.4) !important;
}

.l-select select:focus {
}

.lang-ru .l-select select {
}

.l-select select option {
}

.l-sort-toolbar .l-select {
  border: 1px solid #454545;
  background-color: #454545;
  text-shadow: 0px 1px rgba(0,0,0,0.65);
  text-shadow: 1px 1px rgba(0,0,0,0.9);
}

.l-unit {
  color: #dadada;
}

.table-header {
  background: #404040 !important;
  border-left: 1px solid #212121 !important;
  border-right: 1px solid #212121 !important;
  border-bottom: 1px solid #212121 !important;
  border-top: 1px solid #454545 !important;
  text-shadow: 0px 1px rgba(0,0,0,0.95);
  border-bottom-left-radius: 0px !important;
  border-bottom-right-radius: 0px !important;
  color: #dadada;
  box-shadow: inset 0px 1px 1px rgba(0,0,0,0.3) !important;
}

.table-header:hover {
  background-color: #404040 !important;
  border-left: 1px solid #212121 !important;
  border-right: 1px solid #212121  !important;
  box-shadow: inset 0px 1px 1px rgba(0,0,0,0.3) !important;
}

.table-header .fas {
}

.units .l-unit {
  background-color: #303030;
  border-bottom: 1px solid #282828;
  border-left: 1px solid #212121;
  border-right: 1px solid #212121;
}

.l-unit:hover, .units .l-unit:hover {
  box-shadow: 0px 2px 10px rgba(20,20,20,0.20);
  background-color: #353535;
  text-shadow: 0px 1px rgba(0,0,0,0.5);
  border-left: 1px solid #212121;
  border-right: 1px solid #212121;
}

.units .l-unit.l-unit--starred {
  border-left: 2px solid #ff3478;
}

.units.active .l-unit.focus {
  background-color: #353535;
}

.units.active .l-unit.focus .l-unit__name {
}

.units.active .l-unit.focus .l-unit-toolbar__col--right {
}

.units > div:last-child {
}

.l-unit-ft {
  color: #cdcdcd;
}

.l-unit:hover .l-unit-toolbar__col--right {
}

.l-unit--blue {
}

.l-unit--suspended {
    background: #252525 !important;
    color: #606060 !important;
    text-shadow: 0px -1px rgba(0,0,0,0.4) !important;
    box-shadow: inset 0px 0px 2px rgba(0,0,0,0.2);
}

.l-unit--suspended a {
    color: #606060 !important;
    text-shadow: 0px -1px rgba(0,0,0,0.4) !important;
}

.units .l-unit.l-unit--outdated {
  color: #d4d4d4;
  background-color: #981111;
}

.l-unit--outdated.selected {
  background: #b70000 !important;
  color: #fff !important;
  text-shadow: none !important;
}
.l-unit--outdated.selected b {
  color: #fff !important;
}
.l-unit--suspended .l-unit__name,
.l-unit--suspended b,
.l-unit--outdated .l-unit__name,
.l-unit--outdated b {
  color: #606060;
}

.l-unit--outdated .l-unit__name {

}
.l-unit--outdated b {
  color: #d4d4d4;
}

.l-unit--suspended .l-percent {
}

.l-unit--suspended .l-percent__fill {
}

.l-unit--suspended .l-unit__name,
.l-unit--suspended .l-unit__name span {
}

.l-unit--suspended.selected .l-unit__name,
.l-unit--suspended.selected .l-unit__name span {
  color: #707070;
}

.l-unit--suspended.selected {
  background-color: #454545 !important;
  color: #707070 !important;
}

.l-unit-ft .subtitle,
.l-unit .subtitle {
  color: #ff3478;
}

.l-unit__name {
  color: #dadada;
}

.l-unit__stats:hover {
  background: transparent !important;
}

.l-unit__stat-col--left a, .l-unit__stat-col--left a:visited {
  color: #fafafa;
}

.l-unit__stat-col--left a:hover {
  color: #fff;
}

.title b,
.title {
  color: #ff3478;

}

.title {

}

/* form styles */

.vst-error {
  color: #ff3333;

}

.vst-ok {
  color: #53ba55;
}

.vst-ok a {
  color: #ffffff;
}

.vst-ok a:hover {
  color: #ff3478;
}

.vst-ok a:active {
}

.login-box td,
.data td {
  color: #d4d4d4;
}

.data input[type="checkbox"] {
}

.data a {
}

label {
}

label:hover {
  color: #d4d4d4 !important;
}
.vst-textinput {
    background-color: #454545;
    border: 1px solid #606060;
    color: #d4d4d4;
    box-shadow: 0px 1px 4px rgba(0,0,0,0.35);
}
.vst-textinput:hover {
    border: 1px solid #0090ff;
    background-color: #494949;
}
.vst-textinput:focus {
    background-color: #222222;
    border-color: #0080df;
    color: #fff !important;
    box-shadow: 0px 1px 6px rgba(0,52,91,0.75);
}
.vst-textinput.console{
    
}
.vst-textinput.short {
    
}
    
.vst-input {
  background-color: #454545;
  border: 1px solid #606060;
  color: #d4d4d4;
  box-shadow: 0px 1px 4px rgba(0,0,0,0.35);
}
.vst-input:hover {
  border-color: #0090ff;
  background-color: #494949;
}

.vst-input:focus {
  background-color: #222222;
  border-color: #0080df;
  color: #fff;
  box-shadow: 0px 1px 6px rgba(0,52,91,0.75);
}

.vst-input:disabled,
.vst-list:disabled,
.vst-textinput:disabled
 {
  background-color: #303030;
  text-shadow: 1px 1px rgba(0,0,0,0.3);
  color: #acacac;
  border-color: #606060;
}

.vst-input:focus:disabled {
}

.vst-input:disabled:hover,
.vst-list:disabled:hover,
.vst-textinput:disabled:hover {
  border-color: #606060 !important;
}

.vst-input.long {

}
.vst-input.short {

}
.vst-input.vst-list-editor {

}
.vst-input.vst-list-editor:focus {
  background-color: #222222;
  box-shadow: none !important;
}

.vst-list {
  background-color: #454545;
  border: 1px solid #606060;
  color: #d4d4d4;
  text-shadow: 0 0 0 #d4d4d4;
  box-shadow: 0px 1px 4px rgba(0,0,0,0.35);
}

select.vst-list:-moz-focusring {

}

.vst-list.long-2 {

}
.vst-list option {

}
.vst-list:hover {
  border-color: #0090ff;
  background-color: #494949;
}
.vst-list:focus {
  background-color: #222222;
  border-color: #0080df;
  color: #fff;
  box-shadow: 0px 1px 6px rgba(0,52,91,0.75);
}

.vst-list.flat {
  border: 1px solid #454545;
  color: #fff;
}
.vst-list.flat:hover {
  color: #ff3478;
}
.vst-list.flat option {
  color: #d4d4d4;
}

a.vst-text,
a.vst-text b{
  color: #fff;
}
a.vst-text:hover,
a.vst-text:hover b{
  color: #ff3478;
}
a.vst-text:active,
a.vst-text:active b{
  color: #ff3478;
}

.advanced-options {
  background: #454545 !important;
  border: 1px solid #505050 !important;
  text-shadow: 0px 1px rgba(0,0,0,0.4);
  box-shadow: inset 0px 0px 2px rgba(0,0,0,0.5), 
              0px 2px 6px rgba(0,0,0,0.4) !important;
  color: #fff !important;
  padding: 4px 0px 0px 18px;
  overflow: hidden;
  height: 28px;
}

.advanced-options a {
  color: #fff !important;
}

.advanced-options .fas {

}
#advanced-options .console{

}

.generate {
  color: #29a9ff;
  border-radius: 4px;
  
}
.generate:hover {
  background-color: #ff3478;
  border-color: #ff3478;
}
.generate:active {
  background-color: #be1f54;
  border-color: #be1f54;
}


.vst-advanced {
  border-bottom: 0px solid #326b9b;
  color: #0094f7;
  font-size: 0.8rem;
  padding: 4px 12px;
  text-decoration: none;
  border-radius: 4px;
  text-transform: none !important;
}

.login-box .vst-advanced:hover {
  color: #ff3478 !important;
  background-color: transparent;
  border-color: transparent;
  border: none !important;
  background: none !important;
  box-shadow: none !important;
}

.login-box .vst-advanced:active {
  color: #be1f54 !important;
  border: none !important;
  background: none !important;
  box-shadow: none !important;
}

.vst-advanced:hover {
  color: #fff;
  background-color: #ff3478;
  border-color: #ff3478;
  text-decoration: none;
}

.login-box .vst-advanced:active,
.vst-advanced:active {
  color: #fff;
  background-color: #be1f54;
  border-color: #be1f54;
  text-decoration: none;
}

.login-box .vst-advanced {
  border-bottom: none;
  color: #326b9b;
  font-size: 0.85em !important;
  padding: 2px 2px 0;
  text-decoration: none;
  text-transform: uppercase;
  border: none !important;
  background: none !important;
  box-shadow: none !important;
}

.vst-checkbox {

}
.lets-encrypt-note {

}

.additional-control {
  color: #0099ff;
}
.additional-control:hover {
  background-color: #ff3478;
  border-color: #ff3478;
}
.additional-control:active {

}

.additional-control.ftp-remove-user {

}

.additional-control.delete:hover,
.additional-control.ftp-remove-user:hover {

}
.additional-control.delete:active,
.additional-control.ftp-remove-user:active {

}
.additional-control.add:hover {

}
.additional-control.add:active{

}

.additional-control.remove-ns {

}

.data .step-left {

}
.hide-password {

}
.toggle-psw-visibility-icon {

}
.show-passwords-enabled-action {

}
.ftp-path-value,
.hint,
td.hint {
  color: #a2a2a2;
  font-size: 0.8rem;
}
.ftp-path-prefix { padding-top: 12px; font-size: 0.8rem; color: #555; }

.ui-dialog .ui-dialog-buttonpane button {
  box-shadow: 0px 1px 4px rgba(0,0,0,0.1),
  inset 0px 0px 1px #000,
  inset 0px 0px 3px rgba(0,0,0,0.5) !important;
}

.ui-button, .button, .ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only.submit, .vst-advanced, .to-shortcuts, .to-top {
  font-size: 0.85rem !important;
  font-weight: 400 !important;
  color: #eeeeee !important;
  border: 1px solid #707070 !important;
  background: rgb(48,48,48) !important;
  background: linear-gradient(0deg, rgba(48,48,48,1) 0%, rgba(53,53,53,1) 35%, rgba(69,69,69,1) 100%) !important;
  box-shadow: 0px 1px 4px rgba(0,0,0,0.2),
              inset 0px 0px 1px rgba(20,20,20,1),
              inset 0px 0px 3px rgba(0,0,0, 0.5) !important;
  text-shadow: 0px 1px 1px rgba(0,0,0,0.35) !important;
}

.ui-button:hover, .button:hover, .ui-button.cancel:hover, .button.cancel:hover,
.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only.submit:hover, .vst-advanced:hover, .to-shortcuts:hover, .to-top:hover  {
  color: #fff !important;
  text-shadow: 1px 1px rgba(0,0,0,0.25) !important;
  border: 1px solid #0098ff !important;
  background: linear-gradient(0deg, rgba(58,58,58,1) 0%, rgba(68,68,68,1) 35%, rgba(79,79,79,1) 100%) !important;
  background-color: #454545;
  box-shadow: 0px 1px 3px rgba(0,0,0,0.35),
              inset 0px 0px 1px rgba(0,0,0,1),
              inset 0px 0px 3px rgba(0,0,0,0.65) !important;
  transition: 0.2s;
}
.ui-button:focus,.ui-button:active,
.button:active,.button:focus,.ui-button.cancel:focus,.ui-button.cancel:active,
.button.cancel:active,.button.cancel:focus,
.ui-button.ui-widget.ui-state-default.ui-corner-all.ui-button-text-only.submit:active, .vst-advanced:active, .to-shortcuts:active, .to-top:active,
.to-shortcuts:focus, .to-top:focus   {
  border: 1px solid #0066b4 !important;
  background: linear-gradient(0deg, rgba(69,69,69,1) 0%, rgba(53,53,53,1) 35%, rgba(48,48,48,1) 100%) !important;
  color: #d4d4d4 !important;
  text-shadow: 0px -1px 1px rgba(0,0,0,0.55) !important;
  box-shadow: 0px 1px 3px rgba(0,0,0,0.3),
              inset 0px 0px 1px rgba(0,0,0,1),
              inset -1px -1px 4px rgba(30,30,30,0.4) !important;
}

.ui-button-text-only {
  text-shadow: 0px 1px rgba(0,0,0,0.5);
}

.ui-dialog .ui-dialog-buttonpane button span.ui-button-text {

}

.ui-dialog .ui-button:hover span {
  color: #fafafa !important;
}

.ui-button-text-only .selected {

}

.ui-button.cancel,
.button.cancel {
  color: #eeeeee !important;
  border: 1px solid #454545 !important;
  background: rgb(48,48,48) !important;
  background: linear-gradient(0deg, rgba(48,48,48,1) 0%, rgba(53,53,53,1) 35%, rgba(69,69,69,1) 100%) !important;
}

.ui-button-text {
  color: #eeeeee !important;
}

.ui-button.cancel:active,
.button.cancel:active {

}
a.button.cancel {

}


.ui-dialog button.cancel {
  border: 1px solid #d4d4d4;
  background-color: #d4d4d4;
}

.ui-button.danger:hover, .button.danger:hover {
  background: rgb(133,0,0);
  background: linear-gradient(0deg, rgba(133,0,0,1) 0%, rgba(203,0,0,1) 100%) !important;
  color: #fff !important;
  text-shadow: 0px 1px rgba(0,0,0,0.45) !important;
  border: 1px solid rgb(170, 0, 0) !important;
}

.ui-button.danger:active, .button.danger:active, .ui-button.danger:focus, .button.danger:focus {
  background: rgb(133,0,0);
  background: linear-gradient(180deg, rgba(133,0,0,1) 0%, rgba(203,0,0,1) 100%) !important;
  color: #4d0000 !important;
  text-shadow: 0px -1px 1px rgba(255,255,255,0.3) !important;
  border: 1px solid rgb(251, 71, 51) !important;
}

.ui-button span {

}
.ui-button:hover span {
  color: #d4d4d4 !important;
}
.ui-button:active span {
  color: #d4d4d4;
}

.ui-button.cancel span {

}
.ui-button:hover span {

}
.ui-button:active span {

}

.ui-dialog button.cancel span {
  color: #fff !important;
}

.unlim-trigger {

}
.optional {

}
.data-active b {

}
.data-suspended b {

}
.data-date {

}
.data-dotted {

}
.mail-infoblock-td {

}
.mail-infoblock {
  color: #fff;
  border: 1px solid #606060;
  margin-top: 87px;
  box-shadow: 0px 1px 4px rgba(0,0,0,0.35);
  background-color: #454545;
}

.mail-infoblock:hover {

}

.mail-infoblock td {
  color: #dadada;

}
.mail-infoblock td:first-child{

}
.mail-infoblock div {

}
.mail-infoblock a {
  color: #52b9ff;
}
.mail-infoblock a:hover {
  color: #ff3478;
}

.additional-info {

}
.additional-info td {

}

.additional-info td.details {

}

:focus {outline:none;}
::-moz-focus-inner {border:0;}

.login {
  background-color: #282828;
  box-shadow: 0px 8px 25px rgba(0,0,0, 0.3), inset 0px 0px 2px rgba(0,0,0,0.25) !important;
}

.login-welcome {
  color: #fff !important;
}

.page-title {
  color: #e8e8e8 !important;
}

.qr-code {
  border: 1px solid #3b3b3b;
  box-shadow: 0px 1px 4px rgba(0,0,0,0.35);
}

.password-option {

}

.login a.error {
  color: #f864fa;

}

.hestiacp {

}
.hestiacp:hover {

}
.hestiacp:active {
  color: #ff3478;
}

.login-bottom {

}

.l-unit.selected {
  background-color: #454545;
  color: #d4d4d4;
  box-shadow: 0px 2px 10px rgba(30,30,30,0.35);
  text-shadow: 0px 1px rgba(0,0,0,0.5);
  border-left: 1px solid #212121;
  border-right: 1px solid #212121;
}

.l-unit.selected:hover {
  background-color: #555555;
  color: #d4d4d4;
  box-shadow: none !important;
  text-shadow: 0px 1px rgba(0,0,0,0.4);
}

.l-unit.selected b,
.l-unit.selected strong {
  color: #d4d4d4;
}


/* MAIN MENU COLLAPSED */
.console-output {
  color: #dadada !important;
}

form#vstobjects {

}

form#vstobjects.suspended {
  background-color: #282828;
}

.pill {
}

.pill.usage{
  box-shadow: inset 0px 1px 1px rgba(0,0,0,0.85), 0px 1px 1px rgba(0,0,0,0.2);
  background-color: rgba(15,15,15,0.5);
  border: 1px solid rgba(120,120,120,0.95);
  text-shadow: 0px 1px 1px rgba(0,0,0,0.5);
  color: #909090;
}

.pill.usage b { color: #d8d8d8; }

.badge {
  box-shadow: 0px 1px 2px rgba(70,70,70,0.5), 
              inset 0px 2px 2px rgba(0,0,0,0.65);
  text-shadow: 0px 1px 2px rgba(0,0,0,0.5);
  border: 1px solid #212121 !important;
}

.badge.large {
}

.badge.raised {
  background: radial-gradient(ellipse at center, rgba(40,40,40,0.2) 0%,rgba(80,80,80,0.05) 100%);
}

.l-unit--suspended .badge {
  background: #303030 !important;
  color: #808080 !important;
  text-shadow: 0px -1px rgba(0,0,0,0.4) !important;
  box-shadow: 0px 1px 2px rgba(25,25,25,0.3) !important;
}

.pill.gray, .badge.gray {
  border: 1px solid #181818;
  background-color: #252525;
  color: #dadada;
  text-shadow: 0px 1px rgba(0,0,0,0.7) !important;
}

.pill.blue, .badge.blue {

}

.pill.purple, .badge.purple {

}

.pill.teal, .badge.teal {

}

.pill.maroon, .badge.maroon {
  background-color: #ff3478;
}

.pill.red, .badge.red {

}

.pill.orange, .badge.orange {

}

.pill.green, .badge.green {

}

.pill.lightblue, .badge.lightblue {

}

.status-icon.large {

}

.status-icon.yellow, .status-icon.yellow:hover {
  color: #f3e72c;
}
.status-icon.teal, .status-icon.teal:hover {
  color: #33cccc;
}
.status-icon.purple, .status-icon.purple:hover {
  color: #c364ff;
}

.status-icon.maroon, .status-icon.maroon:hover {
  color: #ff3478;
}

.status-icon.red, .status-icon.red:hover {

}

.status-icon.green, .status-icon.green:hover {
  color: #37cf39;
}

.status-icon.orange, .status-icon.orange:hover {

}

.status-icon.lightblue, .status-icon.lightblue:hover {

}

.status-icon.highlight, .status-icon.highlight:hover {
  color: #dadada;
}

.status-icon.blue, .status-icon.blue:hover {
  color: #0092f4;
}

.status-icon.dim {
  color: #808080;
  text-shadow: 1px 1px rgba(0,0,0,0.3);
}

.l-unit--suspended .status-icon.dim {
  color: #808080 !important;
  text-shadow: 0px !important;
}

.search-input {
  background-color: #212121;
  border: 1px solid #454545;
  box-shadow: 0px 1px 1px rgba(0,0,0,0.4) !important;

}

.ui-dialog .ui-dialog-buttonpane {
  border-color: #404040 !important;
  background-color: #252525 !important;
}

.shortcuts {
  background: rgba(30,30,30,0.95);
  border: 1px solid rgba(255,255,255,0.25);
  box-shadow: 0px 0px 20px rgba(0,0,0,0.5);
  border-bottom: none !important;
}

.shortcuts .header {
  border-bottom: 1px solid #353535;
}

.shortcuts .title {

}
.shortcuts .close {

}
.shortcuts .close:hover {

}
.shortcuts .close:active {

}

.shortcuts .close .fas {

}
.shortcuts ul {

}
.shortcuts ul li {

}
.shortcuts ul li.step-top {

}
.shortcuts ul li span {

}
.shortcuts ul li span.bigger {

}

.description {

}
.description ul{

}

.description li{

}

.description a {

}
.description a.purchase {

}
.description a.purchase:hover {
  color: #d4d4d4;
}
.description a.purchase:active {
  color: #d4d4d4;
}

.description a.cancel {

}
.description a.cancel:hover {

}
.description a.cancel:active {

}

.description.cancel-success {

}

.description .licence {

}

.description .licence input {

}

.description span {

}

.description .twoco {

}

.ui-dialog {
  background-color: rgba(45,45,45,0.95) !important;
  border: 1px solid rgba(80,80,80,0.97) !important;
  box-shadow: inset 0px 1px 3px rgba(0,0,0,0.25), 
              0px 8px 25px rgba(0,0,0,0.9) !important;
}

.ui-dialog .ui-dialog-content {
  color: #dadada !important;
}

.ui-dialog .ui-dialog-title {
  color: #f12569 !important;
  font-weight: 600;
}

.ui-dialog-buttonpane {

}

.ui-widget {

}

.ui-widget-overlay {

}

.helper-container {
  box-shadow: 0px 1px 4px rgba(0,0,0,0.25);
  border: 1px solid #606060;
  background-color: #454545;
}

.context-helper:active {
  color: #ff3478;
}

.cron-helper-tabs a {
  color: #cacaca;
}

.cron-helper-tabs a:hover {
  color: #ff3478 !important;
}
.cron-helper-tabs a:active {
  color: #3b9de8 !important;
}
.cron-helper-tabs .ui-tabs-selected a {
  color: #ff3478 !important;
}

.cron-helper-tabs p {
  color: #dadada;

}

.server-info-name {
  color: #fafafa !important;
}

.server-info-output {
  background: #282828;
}

.icon-server-info {
  color: #707070;
}

.ui-widget-header a {
  color: #cacaca !important; 
}

.graph-rounded {
  border-radius: 8px;
}

.body-rrd .units .l-unit {
  background-color: #282828 !important;
  border-left: 1px solid transparent !important;
  border-right: 1px solid transparent !important;
}

.l-percent {
  border-bottom: 2px solid #585858 !important;
}

.body-stats .l-unit__name {
  color: #eee !important;
}

.statistics-count {
  border-bottom: 1px dotted #707070;
  border-right: 1px dotted #707070;
}

.body-stats .units .l-unit {
  background-color: #282828 !important;
  border-bottom: 1px solid #404040 !important;
  border-left: 1px solid #282828 !important;
  border-right: 1px solid #282828 !important;
}

.body-stats .units:hover .l-unit:hover {
  background-color: #303030 !important;
  color: #fff !important;
}

.body-stats .units:hover .l-unit:hover b,.body-stats .units:hover .l-unit:hover strong  {
  color: #fff !important;
}

@media screen and (max-width: 950px) {
  .helper-container {
    display: none;
  }
}