.video-play-icon span:before {
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 0 8px 12px;
    font-size: 0;
    border-color: transparent transparent transparent var(--coloring-1)
}
a:active, a:hover {
    text-decoration: initial;
    color: var(--coloring-1)
}
.color-theme-1 {
    color: var(--coloring-1)
}
#displayOptions a.active i {
    color: var(--coloring-1)
}
#displayOptions button:hover {
    background-color: var(--coloring-1);
    border-color: var(--coloring-1);
    color: #fff
}

#displayOptions .btn-outline-dark:not(:disabled):not(.disabled).active, #displayOptions .btn-outline-dark:not(:disabled):not(.disabled):active, #displayOptions .show > .btn-outline-dark.dropdown-toggle {
    background-color: var(--coloring-1);
    border-color: var(--coloring-1);
    color: #fff
}
#displayOptions .view-icon.active .view-icon-svg, #displayOptions .view-icon:hover .view-icon-svg {
    fill: var(--coloring-1)
}
.feedback-container a:active, .feedback-container a:hover {
    color: var(--coloring-1)
}
.btn-primary {
    background-color: var(--coloring-1);
    border-color: var(--coloring-1);
    color: #fff
}

.btn-primary:hover {
    color: #fff;
    background-color: var(--coloring-2);
    border-color: var(--coloring-2)
}
.check-button.btn-primary {
    background-color: var(--coloring-1) !important;
    border-color: var(--coloring-1) !important;
    opacity: 1
}
.dropdown-item.active, .dropdown-item:active {
    color: #fff;
    text-decoration: none;
    background-color: var(--coloring-1)
}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
    background-color: var(--coloring-4);
    border-color: var(--coloring-4);
    color: #fff
}
.btn-primary.btn-primary-gradient {
    background: linear-gradient(to right, var(--coloring-1), #571a51)
}

.btn-primary.btn-primary-gradient:hover {
    background: linear-gradient(to right, var(--coloring-1), var(--coloring-2))
}

.btn-primary-gradient:not(:disabled):not(.disabled).active, .btn-primary-gradient:not(:disabled):not(.disabled):active, .show > .btn-primary-gradient.dropdown-toggle {
    background: linear-gradient(to right, var(--coloring-1), #571a51)
}
.btn-outline-white:hover {
    color: var(--coloring-1);
    background-color: #fff
}.btn-outline-primary {
     color: var(--coloring-1);
     border-color: var(--coloring-1)
 }

.btn-outline-primary:hover {
    color: #fff;
    background-color: var(--coloring-1);
    border-color: var(--coloring-1)
}
.btn-outline-primary:not(:disabled):not(.disabled).active, .btn-outline-primary:not(:disabled):not(.disabled):active, .show > .btn-outline-primary.dropdown-toggle {
    background-color: var(--coloring-1);
    border-color: var(--coloring-1);
    color: #fff
}.btn-header-primary {
     color: var(--coloring-1);
     border-color: transparent;
     background: 0 0
 }

.btn-header-primary:hover {
    background-color: transparent;
    border-color: var(--coloring-1)
}.btn-primary.disabled, .btn-primary:disabled {
     background-color: var(--coloring-1);
     border-color: var(--coloring-1);
     color: #fff
 }.btn-link {
      color: var(--coloring-1);
      text-decoration: initial !important
  }
.btn-multiple-state.btn-primary:disabled {
    opacity: 1;
    background: var(--coloring-3);
    border-color: var(--coloring-3)
}.border-primary, .border-theme-1 {
     border-color: var(--coloring-1) !important
 }
.text-primary, .text-theme-1 {
    color: var(--coloring-1) !important
}
.badge-primary, .badge-theme-1, .bg-primary, .bg-theme-1 {
    background-color: var(--coloring-1) !important;
    color: #fff
}
.badge-outline-primary, .badge-outline-theme-1 {
    background: unset;
    border: 1px solid var(--coloring-1);
    color: var(--coloring-1)
}
.nav-tabs .nav-item.show .nav-link::before, .nav-tabs .nav-link.active::before {
    content: " ";
    background: var(--coloring-1);
    color: #fff;
    border-radius: 10px;
    position: absolute;
    width: calc(100% - 1rem);
    height: 5px;
    top: 0;
    left: 50%;
    transform: translateX(-50%)
}

.nav-tabs.separator-tabs .nav-item.show .nav-link::before, .nav-tabs.separator-tabs .nav-link.active::before {
    content: " ";
    background: var(--coloring-1);
    border-radius: 10px;
    position: absolute;
    width: 100%;
    height: 2px;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    top: unset
}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    border: initial;
    position: relative;
    color: var(--coloring-1)
}

.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    border: initial;
    color: var(--coloring-1)
}


.timer-column .lead {
    color: var(--coloring-1);
    font-size: 2.4rem;
    margin-bottom: .5rem
}
.slick-dots li.slick-active button {
    background: var(--coloring-1)
}

.navbar .icon-menu-item:focus, .navbar .icon-menu-item:hover {
    color: var(--coloring-1)
}
.navbar .menu-button:hover {
    color: var(--coloring-1)
}

.navbar .search .search-icon:hover {
    color: var(--coloring-1)
}

.navbar .header-icon:hover {
    color: var(--coloring-1)
}.navbar .header-icon#notificationButton .count {
     font-size: 9px;
     color: var(--coloring-1);
     border: 1px solid var(--coloring-1);
     border-radius: 10px;
     position: absolute;
     width: 18px;
     height: 15px;
     text-align: center;
     font-weight: 700;
     top: -4px;
     right: 2px;
     line-height: 14px
 }
.menu .main-menu ul li a:focus, .menu .main-menu ul li a:hover {
    color: var(--coloring-1)
}

.menu .main-menu ul li.active a,.dropdown-menu .active {
    color: var(--coloring-1)
}

.menu .main-menu ul li.active:after {
    content: " ";
    background: var(--coloring-1);
    color: #fff;
    border-radius: 10px;
    position: absolute;
    width: 6px;
    height: 90px;
    top: 50%;
    transform: translateY(-50%);
    left: 0
}
.menu .sub-menu ul li.active a, .menu .sub-menu ul li.active i {
    color: var(--coloring-1)
}

.menu .sub-menu ul li.active:after {
    content: " ";
    background: var(--coloring-1);
    border-radius: 10px;
    position: absolute;
    width: 4px;
    height: 4px;
    top: 50%;
    transform: translateY(-50%);
    left: -16px
}
.menu .sub-menu ul.inner-level-menu li a:hover, .menu .sub-menu ul.inner-level-menu li.active a, .menu .sub-menu ul.inner-level-menu li.active i {
    color: var(--coloring-1)
}
.app-menu ul li a:hover i {
    color: var(--coloring-1)
}

.app-menu ul li.active a, .app-menu ul li.active i {
    color: var(--coloring-1)
}.heading-icon {
     color: var(--coloring-1);
     font-size: 20px;
     line-height: inherit;
     margin-right: 5px;
     vertical-align: middle
 }

.heading-number {
    border: 1px solid var(--coloring-1);
    padding: 4px;
    vertical-align: middle;
    margin-right: 10px;
    border-radius: 20px;
    width: 34px;
    height: 34px;
    text-align: center;
    color: var(--coloring-1)
}

.list-thumbnail-letters {
    width: 85px;
    height: 85px;
    background: var(--coloring-1);
    align-items: center;
    display: flex;
    justify-content: center;
    font-size: 1.25rem;
    color: #fff
}
.dashboard-sq-banner {
    background-image: linear-gradient(to right top, #832579, var(--coloring-1), #a9449f);
    background-size: cover;
    height: 385px;
    transition: .5s;
    background-size: 350% auto;
    cursor: pointer
}
.icon-cards-row .lead {
    color: var(--coloring-1);
    margin-bottom: 0
}

.icon-cards-row i {
    font-size: 38px;
    line-height: 66px;
    color: var(--coloring-1)
}
.log-indicator {
    width: 13px;
    height: 13px;
    border: 2px solid var(--coloring-1);
    border-radius: 14px;
    display: inline-block
}

.calendar .alert-info {
    color: var(--coloring-1);
    background-color: initial
}
.fc-toolbar.fc-header-toolbar .btn-group .fc-next-button, .fc-toolbar.fc-header-toolbar .btn-group .fc-prev-button {
    outline: initial !important;
    box-shadow: initial !important;
    border-radius: 40px !important;
    text-align: center;
    min-width: 30px;
    height: 30px;
    padding: .55rem 0;
    background: var(--coloring-1);
    color: #fff;
    border: 1px solid var(--coloring-1);
    line-height: .9 !important;
    font-size: .76rem;
    font-weight: 400 !important
}
.fc-toolbar.fc-header-toolbar .btn-group .fc-next-button:hover, .fc-toolbar.fc-header-toolbar .btn-group .fc-prev-button:hover {
    background-color: transparent;
    border-color: rgba(146, 44, 136, .9);
    color: var(--coloring-1)
}
.fc-bootstrap4 td.fc-today .fc-day-number {
    background: var(--coloring-1);
    color: #fff
}
.fc-day-header {
    color: var(--coloring-1)
}
table.dataTable.dtr-inline.collapsed > tbody > tr[role=row] > td:first-child:before, table.dataTable.dtr-inline.collapsed > tbody > tr[role=row] > th:first-child:before {
    top: unset;
    box-shadow: initial;
    background-color: var(--coloring-1);
    font-size: 12px
}
.alert-primary {
    color: var(--coloring-1);
    background-color: #e4cfe2;
    border-color: rgba(146, 44, 136, .1)
}
.bootstrap-tagsinput .tag {
    background: var(--coloring-1);
    border-radius: 15px;
    padding: 3px 8px;
    margin-bottom: 0;
    display: inline-block;
    font-size: 12px
}
.custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
    background-color: var(--coloring-1) !important
}

.custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--coloring-1) !important;
    box-shadow: initial !important;
    border: 1px solid var(--coloring-1) !important
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before, .custom-radio .custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--coloring-1) !important;
    box-shadow: initial !important
}

.custom-checkbox .custom-control-input:checked ~ .custom-control-label::before, .custom-radio .custom-control-input:checked ~ .custom-control-label::before {
    background-color: var(--coloring-1) !important;
    box-shadow: initial !important
}
.invalid-tooltip, .valid-tooltip, div.error {
    border-radius: .1rem;
    padding: .5rem 1rem;
    font-size: .76rem;
    color: #3a3a3a;
    background: #fff;
    border: 1px solid var(--coloring-1);
    text-align: center;
    width: unset !important;
    position: absolute;
    z-index: 4;
    margin-top: -.5rem;
    left: 50%;
    transform: translateX(-50%);
    line-height: 1.5;
    box-shadow: 0 1px 15px rgba(0, 0, 0, .04), 0 1px 6px rgba(0, 0, 0, .04)
}

.invalid-tooltip::before, .valid-tooltip::before, div.error::before {
    content: "";
    position: absolute;
    top: -5px;
    left: -2.5px;
    margin-left: 50%;
    width: 10px;
    height: 5px;
    border-bottom: solid 5px var(--coloring-1);
    border-left: solid 5px transparent;
    border-right: solid 5px transparent
}
.tooltip-center-top .invalid-tooltip::before, .tooltip-center-top .valid-tooltip::before, .tooltip-center-top div.error::before {
    content: "";
    position: absolute;
    top: initial;
    bottom: -5px;
    border-top: solid 5px var(--coloring-1);
    border-bottom: initial
}
.tooltip-right-top .invalid-tooltip::before, .tooltip-right-top .valid-tooltip::before, .tooltip-right-top div.error::before {
    content: "";
    position: absolute;
    top: initial;
    bottom: -5px;
    border-top: solid 5px var(--coloring-1);
    border-bottom: initial;
    left: initial;
    right: 25px;
    margin-left: 0
}
.tooltip-left-top .invalid-tooltip::before, .tooltip-left-top .valid-tooltip::before, .tooltip-left-top div.error::before {
    content: "";
    position: absolute;
    top: initial;
    bottom: -5px;
    border-top: solid 5px var(--coloring-1);
    border-bottom: initial;
    left: 25px;
    right: initial;
    margin-left: 0
}
.tooltip-label-right .invalid-tooltip::before, .tooltip-label-right .valid-tooltip::before, .tooltip-label-right div.error::before {
    content: "";
    position: absolute;
    left: -5px;
    right: initial;
    margin-left: 0;
    border: initial;
    border-top: solid 5px transparent;
    border-bottom: solid 5px transparent;
    border-right: solid 5px var(--coloring-1);
    bottom: initial;
    top: 12px;
    width: 5px
}

.custom-control-input.is-valid:checked ~ .custom-control-label::before, .was-validated .custom-control-input:valid:checked ~ .custom-control-label::before {
    background-color: var(--coloring-1) !important
}
.select2-container--bootstrap .select2-results__option--highlighted[aria-selected] {
    background-color: var(--coloring-1);
    color: #fff
}

.select2-container--bootstrap .select2-selection--multiple .select2-selection__choice__remove:hover {
    outline: initial;
    text-shadow: initial;
    color: var(--coloring-1)
}
.typeahead.dropdown-menu .active a {
    background-color: var(--coloring-1);
    color: #fff
}
.datepicker table tr td.range {
    color: #fff;
    background-color: var(--coloring-1);
    border-color: var(--coloring-1)
}

.datepicker table tr td.selected, .datepicker table tr td.selected.highlighted {
    color: #fff;
    background-color: var(--coloring-1);
    border-color: var(--coloring-1)
}
.datepicker table tr td.active.active, .datepicker table tr td.active.highlighted.active, .datepicker table tr td.active.highlighted:active, .datepicker table tr td.active:active {
    color: #fff;
    background-color: var(--coloring-1);
    border-color: var(--coloring-1)
}

.datepicker table tr td.active.active.focus, .datepicker table tr td.active.active:focus, .datepicker table tr td.active.active:hover, .datepicker table tr td.active.highlighted.active.focus, .datepicker table tr td.active.highlighted.active:focus, .datepicker table tr td.active.highlighted.active:hover, .datepicker table tr td.active.highlighted:active.focus, .datepicker table tr td.active.highlighted:active:focus, .datepicker table tr td.active.highlighted:active:hover, .datepicker table tr td.active:active.focus, .datepicker table tr td.active:active:focus, .datepicker table tr td.active:active:hover {
    color: #fff;
    background-color: var(--coloring-3);
    border-color: var(--coloring-3)
}

.datepicker table tr td span.active.active, .datepicker table tr td span.active.disabled.active, .datepicker table tr td span.active.disabled:active, .datepicker table tr td span.active.disabled:hover.active, .datepicker table tr td span.active.disabled:hover:active, .datepicker table tr td span.active:active, .datepicker table tr td span.active:hover.active, .datepicker table tr td span.active:hover:active {
    background-color: var(--coloring-3);
    border-color: var(--coloring-3)
}
.dropzone .dz-preview.dz-file-preview .preview-container i, .dropzone .dz-preview.dz-image-preview .preview-container i {
    color: var(--coloring-1);
    font-size: 20px;
    position: absolute;
    left: 50%;
    top: 29px;
    transform: translateX(-50%) translateY(-50%) !important;
    height: 22px
}
.dropzone .dz-preview.dz-file-preview .remove, .dropzone .dz-preview.dz-image-preview .remove {
    position: absolute;
    right: 5px;
    top: 5px;
    color: var(--coloring-1) !important
}
.dropzone .dz-preview.dz-file-preview .dz-progress .dz-upload, .dropzone .dz-preview.dz-image-preview .dz-progress .dz-upload {
    width: 100%;
    background: var(--coloring-1) !important
}
.dropzone .dz-error.dz-preview.dz-file-preview .dz-error-mark, .dropzone .dz-error.dz-preview.dz-file-preview .dz-success-mark {
    color: var(--coloring-1) !important
}
.custom-switch.custom-switch-primary .custom-switch-input:checked + .custom-switch-btn {
    background: var(--coloring-1);
    border: 1px solid var(--coloring-1)
}
.custom-switch.custom-switch-primary-inverse .custom-switch-input:checked + .custom-switch-btn {
    background: #fff;
    border: 1px solid var(--coloring-1)
}

.custom-switch.custom-switch-primary-inverse .custom-switch-input:checked + .custom-switch-btn:after {
    background: var(--coloring-1)
}
.custom-select:focus {
    border-color: var(--coloring-1)
}
.sw-main.sw-theme-default > ul.step-anchor > li.active > a::before {
    content: " ";
    position: absolute;
    background: var(--coloring-1);
    width: calc(100% - 1rem);
    border-radius: 10px;
    height: 5px;
    top: 0;
    left: 50%;
    transform: translateX(-50%)
}
.sw-main > ul.step-anchor > li.active > a {
    color: var(--coloring-1) !important
}
.sw-main.sw-theme-check > ul.step-anchor > li.done > a:after, .sw-main.sw-theme-dots > ul.step-anchor > li.done > a:after {
    background: var(--coloring-1)
}

.sw-main.sw-theme-dots > ul.step-anchor > li.active > a:after {
    background: initial;
    border: 2px solid var(--coloring-1)
}
.sw-main.sw-theme-check > ul.step-anchor > li.active > a:after {
    background: var(--coloring-1)
}

.noUi-connect {
    background: var(--coloring-1)
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: var(--coloring-1)
}
.nav-link.active {
    color: var(--coloring-1)
}

.page-item .page-link.next {
    background: var(--coloring-1);
    color: #fff;
    border: 1px solid var(--coloring-1)
}

.page-item .page-link.prev {
    background: var(--coloring-1);
    border: 1px solid var(--coloring-1);
    color: #fff
}

.page-item .page-link.first, .page-item .page-link.last {
    background: 0 0;
    color: var(--coloring-1);
    border: 1px solid var(--coloring-1);
    border-radius: 30px
}

.page-item .page-link.first:hover, .page-item .page-link.last:hover {
    background: var(--coloring-1);
    color: #fff;
    border: 1px solid var(--coloring-1)
}

.page-item .page-link:hover {
    background-color: transparent;
    border-color: #b938ad;
    color: var(--coloring-1)
}

.page-item.active .page-link {
    background: 0 0;
    border: 1px solid var(--coloring-1);
    color: var(--coloring-1)
}

.progress-bar {
    background-color: var(--coloring-1)
}

.progress-bar-circle svg path:last-of-type {
    stroke: var(--coloring-1)
}
.progress-banner {
    height: 200px;
    background-image: linear-gradient(to right top, #832579, var(--coloring-1), #a9449f);
    transition: .5s;
    background-size: 200% auto;
    cursor: pointer
}
.br-theme-bootstrap-stars .br-widget a.br-active:after {
    color: var(--coloring-1);
    font-weight: 900
}

.br-theme-bootstrap-stars .br-widget a.br-selected:after {
    color: var(--coloring-1);
    font-weight: 900
}


.cropper-line {
    background-color: var(--coloring-1)
}

.cropper-point {
    background-color: var(--coloring-1)
}

.cropper-view-box {
    outline-color: var(--coloring-1);
    outline: var(--coloring-1)
}
.ql-snow .ql-toolbar .ql-picker-item.ql-selected, .ql-snow .ql-toolbar .ql-picker-item:hover, .ql-snow .ql-toolbar .ql-picker-label.ql-active, .ql-snow .ql-toolbar .ql-picker-label:hover, .ql-snow .ql-toolbar button.ql-active, .ql-snow .ql-toolbar button:hover, .ql-snow.ql-toolbar .ql-picker-item.ql-selected, .ql-snow.ql-toolbar .ql-picker-item:hover, .ql-snow.ql-toolbar .ql-picker-label.ql-active, .ql-snow.ql-toolbar .ql-picker-label:hover, .ql-snow.ql-toolbar button.ql-active, .ql-snow.ql-toolbar button:hover {
    color: var(--coloring-1)
}
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-fill, .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill, .ql-snow .ql-toolbar .ql-picker-item:hover .ql-fill, .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill, .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-fill, .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill, .ql-snow .ql-toolbar .ql-picker-label:hover .ql-fill, .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill, .ql-snow .ql-toolbar button.ql-active .ql-fill, .ql-snow .ql-toolbar button.ql-active .ql-stroke.ql-fill, .ql-snow .ql-toolbar button:hover .ql-fill, .ql-snow .ql-toolbar button:hover .ql-stroke.ql-fill, .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-fill, .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke.ql-fill, .ql-snow.ql-toolbar .ql-picker-item:hover .ql-fill, .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke.ql-fill, .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-fill, .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke.ql-fill, .ql-snow.ql-toolbar .ql-picker-label:hover .ql-fill, .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke.ql-fill, .ql-snow.ql-toolbar button.ql-active .ql-fill, .ql-snow.ql-toolbar button.ql-active .ql-stroke.ql-fill, .ql-snow.ql-toolbar button:hover .ql-fill, .ql-snow.ql-toolbar button:hover .ql-stroke.ql-fill {
    fill: var(--coloring-1)
}
.ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke, .ql-snow .ql-toolbar .ql-picker-item.ql-selected .ql-stroke-mitter, .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke, .ql-snow .ql-toolbar .ql-picker-item:hover .ql-stroke-mitter, .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke, .ql-snow .ql-toolbar .ql-picker-label.ql-active .ql-stroke-mitter, .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke, .ql-snow .ql-toolbar .ql-picker-label:hover .ql-stroke-mitter, .ql-snow .ql-toolbar button.ql-active .ql-stroke, .ql-snow .ql-toolbar button.ql-active .ql-stroke-mitter, .ql-snow .ql-toolbar button:hover .ql-stroke, .ql-snow .ql-toolbar button:hover .ql-stroke-mitter, .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke, .ql-snow.ql-toolbar .ql-picker-item.ql-selected .ql-stroke-mitter, .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke, .ql-snow.ql-toolbar .ql-picker-item:hover .ql-stroke-mitter, .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke, .ql-snow.ql-toolbar .ql-picker-label.ql-active .ql-stroke-mitter, .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke, .ql-snow.ql-toolbar .ql-picker-label:hover .ql-stroke-mitter, .ql-snow.ql-toolbar button.ql-active .ql-stroke, .ql-snow.ql-toolbar button.ql-active .ql-stroke-mitter, .ql-snow.ql-toolbar button:hover .ql-stroke, .ql-snow.ql-toolbar button:hover .ql-stroke-mitter {
    stroke: var(--coloring-1)
}
.ck.ck-button.ck-on, .ck.ck-button.ck-on:not(.ck-disabled):focus, .ck.ck-button.ck-on:not(.ck-disabled):hover, .ck.ck-button:not(.ck-disabled):focus, .ck.ck-button:not(.ck-disabled):hover, a.ck.ck-button.ck-on, a.ck.ck-button.ck-on:not(.ck-disabled):focus, a.ck.ck-button.ck-on:not(.ck-disabled):hover, a.ck.ck-button:not(.ck-disabled):focus, a.ck.ck-button:not(.ck-disabled):hover {
    background: initial;
    color: var(--coloring-1);
    box-shadow: initial;
    outline: initial
}
.theme-colors .theme-button {
    position: absolute;
    left: -32px;
    background: #fff;
    padding: 13px 7px 13px 7px;
    border-radius: .2rem;
    color: #3a3a3a;
    box-shadow: -2px 0 5px rgba(0, 0, 0, .04);
    font-size: 20px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--coloring-1)
}
.loading {
    display: inline-block;
    width: 30px;
    height: 30px;
    border: 2px solid rgba(146, 44, 136, .2);
    border-radius: 50%;
    border-top-color: var(--coloring-1);
    animation: spin 1s ease-in-out infinite;
    -webkit-animation: spin 1s ease-in-out infinite;
    left: calc(50% - 15px);
    top: calc(50% - 15px);
    position: fixed;
    z-index: 1
}
.library-app .media-thumbnail-icon i, .select-from-library-container .media-thumbnail-icon i {
    font-size: 35px;
    margin: 0 auto;
    line-height: 48px;
    color: var(--coloring-1)
}
.video-js .vjs-big-play-button .vjs-icon-placeholder {
    color: var(--coloring-1)
}
.video-js .vjs-control-bar .vjs-control.vjs-button, .video-js .vjs-control-bar .vjs-remaining-time, .video-js .vjs-control-bar .vjs-volume-panel {
    margin-right: .5em;
    background: #fff;
    color: var(--coloring-1);
    border-radius: 15px;
    box-shadow: 0 3px 30px rgba(0, 0, 0, .1), 0 3px 20px rgba(0, 0, 0, .1)
}

.video-js .vjs-control-bar .vjs-play-progress {
    background: var(--coloring-1)
}

.video-js .vjs-control-bar .vjs-play-progress:before {
    color: var(--coloring-1)
}
.video-js .vjs-control-bar .vjs-volume-panel .vjs-volume-level {
    background: var(--coloring-1)
}
i.large-icon {
    font-size: 38px;
    line-height: 90px;
    color: var(--coloring-1)
}
.slider-nav .left-arrow, .slider-nav .right-arrow {
    padding-top: 7px;
    font-size: 20px;
    color: var(--coloring-1);
    display: inline-block;
    vertical-align: middle;
    margin: 0 5px;
    border: initial;
    position: initial;
    transform: initial;
    top: initial;
    left: initial;
    right: initial;
    padding-left: 5px;
    padding-right: 5px
}

.slider-dot.glide__bullet--active {
    background: var(--coloring-1) !important
}
.glide.thumbs .glide__arrows .glide__arrow--left {
    border: initial;
    background: initial;
    box-shadow: initial;
    top: 20px;
    left: -50px;
    font-size: 20px;
    color: var(--coloring-1)
}

.glide.thumbs .glide__arrows .glide__arrow--right {
    border: initial;
    background: initial;
    box-shadow: initial;
    top: 20px;
    right: -50px;
    font-size: 20px;
    color: var(--coloring-1)
}

.rtl .tooltip-label-right .invalid-tooltip::before, .rtl .tooltip-label-right .valid-tooltip::before {
    left: initial;
    right: -5px;
    border-right: initial;
    border-left: solid 5px var(--coloring-1)
}
.rtl .tooltip-label-right .invalid-tooltip:before, .rtl .tooltip-label-right .valid-tooltip:before, .rtl .tooltip-label-right div.error:before {
    left: auto;
    right: -10px;
    border-right: 5px solid transparent;
    border-left: 5px solid var(--coloring-1)
}
footer.page-footer .breadcrumb-item + .breadcrumb-item::before {
    color: var(--coloring-1)
}
.landing-page h1 {
    font-size: 3rem;
    color: var(--coloring-1);
    margin-bottom: 2rem
}

.landing-page h2 {
    font-size: 1.8rem;
    color: var(--coloring-1);
    margin-bottom: 2rem
}

.landing-page h3 {
    font-size: 1.4rem;
    line-height: 1.4;
    color: var(--coloring-1)
}

.landing-page .btn-outline-semi-light:active, .landing-page .btn-outline-semi-light:hover {
    border: 1px solid var(--coloring-3);
    background: var(--coloring-3)
}
.landing-page .landing-page-nav.headroom--not-top .navbar-nav a:active, .landing-page .landing-page-nav.headroom--not-top .navbar-nav a:hover {
    color: var(--coloring-1)
}
.landing-page .landing-page-nav.headroom--not-top .navbar-nav li.active::before {
    content: " ";
    background-color: var(--coloring-1)
}

.landing-page .landing-page-nav.headroom--not-top .navbar-nav .btn-outline-semi-light {
    border: 1px solid rgba(146, 44, 136, .3);
    color: var(--coloring-1)
}

.landing-page .landing-page-nav.headroom--not-top .navbar-nav .btn-outline-semi-light:active, .landing-page .landing-page-nav.headroom--not-top .navbar-nav .btn-outline-semi-light:hover {
    border: 1px solid var(--coloring-1);
    background: var(--coloring-1);
    color: #fff
}
.landing-page i.large-icon {
    font-size: 60px;
    line-height: 110px;
    color: var(--coloring-1);
    display: initial
}

.landing-page .feedback-container a:active, .landing-page .feedback-container a:hover {
    color: var(--coloring-1)
}

.landing-page .video-play-icon span:before {
    color: var(--coloring-1);
    content: "\f101"
}

.monsterpurple-light-1 {
    background-color: var(--coloring-1)
}
.bootstrap-tagsinput.focus, .form-control:focus {
    border-color: var(--coloring-5)
}
.custom-select.is-valid:focus, .form-control.is-valid:focus, .was-validated .custom-select:valid:focus, .was-validated .form-control:valid:focus {
    border-color: var(--coloring-5)
}
.custom-select.is-invalid:focus, .form-control.is-invalid:focus, .was-validated .custom-select:invalid:focus, .was-validated .form-control:invalid:focus {
    border-color: var(--coloring-5)
}
.custom-file-input:focus, .custom-file-label:focus {
    border-color: var(--coloring-5)
}

.custom-file-input:focus ~ .custom-file-label {
    border-color: var(--coloring-5);
    box-shadow: initial
}

.custom-file-input:focus ~ .custom-file-label::after {
    border-color: var(--coloring-5)
}