.vnix-skin .gradient {
    background: #222735;
    background: linear-gradient(135deg, #222735 0, #4f68a6 100%)
}

.vnix-skin .primary-color,
.vnix-skin ul.stepper li.active a .circle,
.vnix-skin ul.stepper li.completed a .circle,
ul.stepper li.active a .vnix-skin .circle,
ul.stepper li.completed a .vnix-skin .circle {
    background-color: #309e9e !important
}

.vnix-skin .navbar {
    color: #fff;
    background-color: #353b50
}

.vnix-skin .navbar .navbar-nav .nav-item .dropdown-menu a {
    color: #000
}

.vnix-skin .navbar .navbar-nav .nav-item .dropdown-menu a:active,
.vnix-skin .navbar .navbar-nav .nav-item .dropdown-menu a:focus,
.vnix-skin .navbar .navbar-nav .nav-item .dropdown-menu a:hover {
    background-color: #36b6b6
}

.vnix-skin .navbar.double-nav a {
    color: #fff
}

.vnix-skin .navbar form .md-form .form-control {
    font-weight: 300;
    color: #fff
}

.vnix-skin .navbar form .md-form .form-control::-webkit-input-placeholder {
    color: #fff
}

.vnix-skin .navbar form .md-form .form-control::-moz-placeholder {
    color: #fff
}

.vnix-skin .navbar form .md-form .form-control:-ms-input-placeholder {
    color: #fff
}

.vnix-skin .navbar form .md-form .form-control::-ms-input-placeholder {
    color: #fff
}

.vnix-skin .navbar form .md-form .form-control::placeholder {
    color: #fff
}

.vnix-skin .page-footer {
    background-color: #353b50
}

.vnix-skin .side-nav {
    background-color: #4c5678
}

.vnix-skin .side-nav .logo-wrapper > div {
    background-color: transparent !important
}

.vnix-skin .side-nav .sn-avatar-wrapper img {
    border: 3px solid #2b8f8f
}

.vnix-skin .side-nav .social {
    border-bottom: 1px solid rgba(153, 153, 153, .3)
}

.vnix-skin .side-nav .collapsible li {
    background-color: transparent
}

.vnix-skin .side-nav .collapsible li .collapsible-header {
    color: #fff;
    -webkit-transition: all .3s linear;
    transition: all .3s linear
}

.vnix-skin .side-nav .collapsible li .collapsible-header.active,
.vnix-skin .side-nav .collapsible li .collapsible-header:hover {
    background-color: rgba(37, 207, 207, .8)
}

.vnix-skin .side-nav .collapsible li .collapsible-body a {
    color: #fff
}

.vnix-skin .side-nav .collapsible li .collapsible-body a.active,
.vnix-skin .side-nav .collapsible li .collapsible-body a:active,
.vnix-skin .side-nav .collapsible li .collapsible-body a:hover {
    color: #40c6c6
}

.vnix-skin .side-nav .collapsible li .collapsible-body a .fab,
.vnix-skin .side-nav .collapsible li .collapsible-body a .far,
.vnix-skin .side-nav .collapsible li .collapsible-body a .fas {
    color: #fff
}

.vnix-skin .side-nav .collapsible li a:not(.collapsible-header) {
    color: #fff;
    -webkit-transition: all .3s linear;
    transition: all .3s linear
}

.vnix-skin .side-nav .collapsible li a:not(.collapsible-header).active,
.vnix-skin .side-nav .collapsible li a:not(.collapsible-header):active,
.vnix-skin .side-nav .collapsible li a:not(.collapsible-header):hover {
    color: #40c6c6 !important
}

.vnix-skin .side-nav .sidenav-bg.mask-strong:after,
.vnix-skin .side-nav .sidenav-bg:after {
    background: rgba(14, 15, 32, .8)
}

.vnix-skin .side-nav .sidenav-bg.mask-light:after {
    background: rgba(14, 15, 32, .65)
}

.vnix-skin .side-nav .sidenav-bg.mask-slight:after {
    background: rgba(14, 15, 32, .5)
}

.vnix-skin .btn-fld {
    height: 42px !important;
    margin: 0 !important;
}

.vnix-skin .btn-primary.focus,
.vnix-skin .btn-primary:focus {
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .btn-primary.active,
.vnix-skin .btn-primary:active,
.vnix-skin .btn-primary:focus {
    background-color: #257b7b
}

.vnix-skin .btn-primary.dropdown-toggle {
    background-color: #40c6c6 !important
}

.vnix-skin .btn-primary.dropdown-toggle:focus,
.vnix-skin .btn-primary.dropdown-toggle:hover {
    background-color: #54cccc !important
}

.vnix-skin .btn-primary:not([disabled]):not(.disabled).active,
.vnix-skin .btn-primary:not([disabled]):not(.disabled):active,
.show > .vnix-skin .btn-primary.dropdown-toggle {
    background-color: #257b7b !important;
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .btn-primary:not([disabled]):not(.disabled).active:focus,
.vnix-skin .btn-primary:not([disabled]):not(.disabled):active:focus,
.show > .vnix-skin .btn-primary.dropdown-toggle:focus {
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .primary-ic {
    color: #40c6c6 !important
}

.vnix-skin .md-form .prefix.active,
.vnix-skin .md-outline input[type=date]:focus:not([readonly]) + label,
.vnix-skin .md-outline input[type=datetime-local]:focus:not([readonly]) + label,
.vnix-skin .md-outline input[type=tel]:focus:not([readonly]) + label,
.vnix-skin .md-outline input[type=number]:focus:not([readonly]) + label,
.vnix-skin .md-outline input[type=search]:focus:not([readonly]) + label,
.vnix-skin .md-outline input[type=search-md]:focus:not([readonly]) + label,
.vnix-skin .md-outline input[type=text]:focus:not([readonly]) + label,
.vnix-skin .md-outline input[type=password]:focus:not([readonly]) + label,
.vnix-skin .md-outline input[type=email]:focus:not([readonly]) + label,
.vnix-skin .md-outline input[type=url]:focus:not([readonly]) + label,
.vnix-skin .md-outline input[type=time]:focus:not([readonly]) + label,
.vnix-skin .md-outline textarea:focus:not([readonly]) + label,
.vnix-skin .primary-ic:focus,
.vnix-skin .primary-ic:hover,
.vnix-skin input[type=number]:focus:not([readonly]) + label,
.vnix-skin input[type=text]:focus:not([readonly]) + label,
.vnix-skin input[type=password]:focus:not([readonly]) + label,
.vnix-skin input[type=email]:focus:not([readonly]) + label,
.vnix-skin textarea.md-textarea:focus:not([readonly]) + label {
    color: #40c6c6
}

.vnix-skin table.table a.btn.btn-primary {
    color: #fff
}

.vnix-skin .btn-secondary {
    color: #fff;
    background-color: #7e51b4 !important
}

.vnix-skin .btn-secondary:hover {
    color: #fff;
    background-color: #8b63bc
}

.vnix-skin .btn-secondary.focus,
.vnix-skin .btn-secondary:focus {
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .btn-secondary.active,
.vnix-skin .btn-secondary:active,
.vnix-skin .btn-secondary:focus {
    background-color: #4d306f
}

.vnix-skin .btn-secondary.dropdown-toggle {
    background-color: #7e51b4 !important
}

.vnix-skin .btn-secondary.dropdown-toggle:focus,
.vnix-skin .btn-secondary.dropdown-toggle:hover {
    background-color: #8b63bc !important
}

.vnix-skin .btn-secondary:not([disabled]):not(.disabled).active,
.vnix-skin .btn-secondary:not([disabled]):not(.disabled):active,
.show > .vnix-skin .btn-secondary.dropdown-toggle {
    background-color: #4d306f !important;
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .btn-secondary:not([disabled]):not(.disabled).active:focus,
.vnix-skin .btn-secondary:not([disabled]):not(.disabled):active:focus,
.show > .vnix-skin .btn-secondary.dropdown-toggle:focus {
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .secondary-ic {
    color: #7e51b4 !important
}

.vnix-skin .secondary-ic:focus,
.vnix-skin .secondary-ic:hover {
    color: #7e51b4
}

.vnix-skin table.table a.btn.btn-secondary {
    color: #fff
}

.vnix-skin .btn-default {
    color: #fff;
    background-color: #293756 !important
}

.vnix-skin .btn-default:hover {
    color: #fff;
    background-color: #314267
}

.vnix-skin .btn-default.focus,
.vnix-skin .btn-default:focus {
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .btn-default.active,
.vnix-skin .btn-default:active,
.vnix-skin .btn-default:focus {
    background-color: #080b11
}

.vnix-skin .btn-default.dropdown-toggle {
    background-color: #293756 !important
}

.vnix-skin .btn-default.dropdown-toggle:focus,
.vnix-skin .btn-default.dropdown-toggle:hover {
    background-color: #314267 !important
}

.vnix-skin .btn-default:not([disabled]):not(.disabled).active,
.vnix-skin .btn-default:not([disabled]):not(.disabled):active,
.show > .vnix-skin .btn-default.dropdown-toggle {
    background-color: #080b11 !important;
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .btn-default:not([disabled]):not(.disabled).active:focus,
.vnix-skin .btn-default:not([disabled]):not(.disabled):active:focus,
.show > .vnix-skin .btn-default.dropdown-toggle:focus {
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .default-ic {
    color: #293756 !important
}

.vnix-skin .default-ic:focus,
.vnix-skin .default-ic:hover {
    color: #293756
}

.vnix-skin a.btn:not([href]):not([tabindex]),
.vnix-skin a.btn:not([href]):not([tabindex]):focus,
.vnix-skin a.btn:not([href]):not([tabindex]):hover,
.vnix-skin table.table a.btn.btn-default {
    color: #fff
}

.vnix-skin .btn-outline-primary {
    color: #40c6c6 !important;
    background-color: transparent !important;
    border: 2px solid #40c6c6 !important
}

.vnix-skin .btn-outline-primary.active,
.vnix-skin .btn-outline-primary:active,
.vnix-skin .btn-outline-primary:active:focus,
.vnix-skin .btn-outline-primary:focus,
.vnix-skin .btn-outline-primary:hover {
    color: #40c6c6 !important;
    background-color: transparent !important;
    border-color: #40c6c6 !important
}

.vnix-skin .btn-outline-primary:not([disabled]):not(.disabled).active,
.vnix-skin .btn-outline-primary:not([disabled]):not(.disabled):active,
.show > .vnix-skin .btn-outline-primary.dropdown-toggle {
    background-color: transparent !important;
    border-color: #40c6c6 !important;
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .btn-outline-primary:not([disabled]):not(.disabled).active:focus,
.vnix-skin .btn-outline-primary:not([disabled]):not(.disabled):active:focus,
.show > .vnix-skin .btn-outline-primary.dropdown-toggle:focus {
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .btn-outline-secondary {
    color: #7e51b4 !important;
    background-color: transparent !important;
    border: 2px solid #7e51b4 !important
}

.vnix-skin .btn-outline-secondary.active,
.vnix-skin .btn-outline-secondary:active,
.vnix-skin .btn-outline-secondary:active:focus,
.vnix-skin .btn-outline-secondary:focus,
.vnix-skin .btn-outline-secondary:hover {
    color: #7e51b4 !important;
    background-color: transparent !important;
    border-color: #7e51b4 !important
}

.vnix-skin .btn-outline-secondary:not([disabled]):not(.disabled).active,
.vnix-skin .btn-outline-secondary:not([disabled]):not(.disabled):active,
.show > .vnix-skin .btn-outline-secondary.dropdown-toggle {
    background-color: transparent !important;
    border-color: #7e51b4 !important;
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .btn-outline-secondary:not([disabled]):not(.disabled).active:focus,
.vnix-skin .btn-outline-secondary:not([disabled]):not(.disabled):active:focus,
.show > .vnix-skin .btn-outline-secondary.dropdown-toggle:focus {
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .btn-outline-default {
    color: #293756 !important;
    background-color: transparent !important;
    border: 2px solid #293756 !important
}

.vnix-skin .btn-outline-default.active,
.vnix-skin .btn-outline-default:active,
.vnix-skin .btn-outline-default:active:focus,
.vnix-skin .btn-outline-default:focus,
.vnix-skin .btn-outline-default:hover {
    color: #293756 !important;
    background-color: transparent !important;
    border-color: #293756 !important
}

.vnix-skin .btn-outline-default:not([disabled]):not(.disabled).active,
.vnix-skin .btn-outline-default:not([disabled]):not(.disabled):active,
.show > .vnix-skin .btn-outline-default.dropdown-toggle {
    background-color: transparent !important;
    border-color: #293756 !important;
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .btn-outline-default:not([disabled]):not(.disabled).active:focus,
.vnix-skin .btn-outline-default:not([disabled]):not(.disabled):active:focus,
.show > .vnix-skin .btn-outline-default.dropdown-toggle:focus {
    -webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15)
}

.vnix-skin .card .btn-action {
    background: #293756
}

.vnix-skin .card .btn-action:focus,
.vnix-skin .card .btn-action:hover {
    background-color: #314267 !important
}

.vnix-skin .card .btn-action.active {
    background-color: #080b11 !important
}

.vnix-skin .md-outline input[type=date]:focus:not([readonly]),
.vnix-skin .md-outline input[type=datetime-local]:focus:not([readonly]),
.vnix-skin .md-outline input[type=tel]:focus:not([readonly]),
.vnix-skin .md-outline input[type=number]:focus:not([readonly]),
.vnix-skin .md-outline input[type=search]:focus:not([readonly]),
.vnix-skin .md-outline input[type=search-md]:focus:not([readonly]),
.vnix-skin .md-outline input[type=text]:focus:not([readonly]),
.vnix-skin .md-outline input[type=password]:focus:not([readonly]),
.vnix-skin .md-outline input[type=email]:focus:not([readonly]),
.vnix-skin .md-outline input[type=url]:focus:not([readonly]),
.vnix-skin .md-outline input[type=time]:focus:not([readonly]),
.vnix-skin .md-outline textarea:focus:not([readonly]) {
    border-color: #40c6c6;
    -webkit-box-shadow: inset 0 0 0 1px #40c6c6;
    box-shadow: inset 0 0 0 1px #40c6c6
}

.vnix-skin .md-bg input[type=date],
.vnix-skin .md-bg input[type=datetime-local],
.vnix-skin .md-bg input[type=tel],
.vnix-skin .md-bg input[type=number],
.vnix-skin .md-bg input[type=search],
.vnix-skin .md-bg input[type=search-md],
.vnix-skin .md-bg input[type=text],
.vnix-skin .md-bg input[type=password],
.vnix-skin .md-bg input[type=email],
.vnix-skin .md-bg input[type=url],
.vnix-skin .md-bg input[type=time],
.vnix-skin .md-bg textarea.md-textarea {
    background-image: linear-gradient(to bottom, #40c6c6, #40c6c6), linear-gradient(to bottom, #ced4da, #ced4da)
}

.vnix-skin input[type=number]:focus:not([readonly]),
.vnix-skin input[type=text]:focus:not([readonly]),
.vnix-skin input[type=password]:focus:not([readonly]),
.vnix-skin input[type=email]:focus:not([readonly]),
.vnix-skin textarea.md-textarea:focus:not([readonly]) {
    border-color: #40c6c6;
    -webkit-box-shadow: 0 1px 0 0 #40c6c6;
    box-shadow: 0 1px 0 0 #40c6c6
}

.vnix-skin input[type=checkbox]:checked + label:before {
    border-right: 2px solid #40c6c6;
    border-bottom: 2px solid #40c6c6
}

.vnix-skin input[type=checkbox].filled-in:checked + label:before {
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff
}

.vnix-skin input[type=checkbox].filled-in:checked + label:after {
    background-color: #40c6c6;
    border-color: #40c6c6
}

.vnix-skin .select-wrapper.colorful-select.md-form.md-outline span.caret.active {
    color: #40c6c6 !important
}

.vnix-skin .select-wrapper.colorful-select.md-form.md-outline input.select-dropdown:focus {
    border-color: #40c6c6;
    -webkit-box-shadow: inset 0 0 0 1px #40c6c6;
    box-shadow: inset 0 0 0 1px #40c6c6
}

.vnix-skin .select-wrapper.colorful-select.md-form.md-outline + label.active {
    color: #40c6c6
}

.vnix-skin .select-wrapper.colorful-select.md-form .dropdown-content li a,
.vnix-skin .select-wrapper.colorful-select.md-form .dropdown-content li span:hover,
.vnix-skin .select-wrapper.colorful-select.md-form .dropdown-content li.active {
    background-color: #40c6c6 !important
}

.vnix-skin .select-wrapper.colorful-select.md-form .dropdown-content li.disabled.active {
    background-color: transparent !important
}

.vnix-skin .top-nav-collapse {
    background-color: #353b50
}

.vnix-skin .carousel-multi-item .carousel-indicators li,
.vnix-skin .carousel-multi-item .carousel-indicators li.active,
.vnix-skin .carousel-multi-item .controls-top > a {
    background-color: #40c6c6
}

.vnix-skin .card-header,
.vnix-skin .form-header {
    background-color: #48c8c8
}

.vnix-skin .spinner-primary-color,
.vnix-skin .spinner-primary-color-only {
    border-color: #309e9e
}

.vnix-skin .pagination-primary-color .page-item.active .page-link,
.vnix-skin .pagination-primary-color .page-item.active .page-link:focus,
.vnix-skin .pagination-primary-color .page-item.active .page-link:hover {
    color: #fff;
    background-color: #309e9e
}

.vnix-skin .pagination-primary-color .page-link {
    color: #309e9e
}

.vnix-skin .pagination-primary-color .page-link:focus {
    -webkit-box-shadow: none;
    box-shadow: none
}