/* color */
.text-primary,
.btn-outline-primary,
.bg-soft-primary,
.navbar .navbar-nav .nav-item .nav-link:hover,
.navbar .navbar-nav .nav-item .nav-link:focus,
.navbar .navbar-nav .nav-item .nav-link.active,
.nav-sticky .navbar-nav .nav-item .nav-link:hover,
.nav-sticky .navbar-nav .nav-item .nav-link:active,
.nav-sticky .navbar-nav .nav-item .nav-link:focus,
.nav-sticky .navbar-nav .nav-item .nav-link.active,
.client-carousel .carousel-control-next:after,
.client-carousel .carousel-control-prev:after {
    color: #00cfa6 !important;
}

/* background-color */
.bg-primary,
.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn-soft-primary:hover,
.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.btn-outline-primary.active,
.nav-sticky .nav-btn {
    background-color: #00cfa6 !important;
}

/* border */
.btn-primary,
.btn-outline-primary,
.nav-sticky .nav-btn {
    border: 1px solid #00cfa6 !important;
}

.navbar .navbar-nav .nav-item .nav-link.active::before,
.client-carousel .carousel-control-prev,
.client-carousel .carousel-control-next,
.bg-soft-primary {
    background-color: rgba(0, 188, 212, 0.1);
}

.btn-soft-primary {
    background-color: rgba(0, 188, 212, 0.1);
    color: #00cfa6;
}

.navbar .nav-btn {
    border: 1px solid rgba(0, 188, 212, 0.3);
}

.svg-primary {
    fill: rgba(0, 188, 212, 0.2);
    color: #00cfa6;
}

.filter-tab li.active {
    border-bottom: 1px solid #00cfa6;
}

.lines .line {
    background: rgba(0, 188, 212, 0.1);
}

.lines .line:after {
    background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), color-stop(75%, #00cfa6), to(#00cfa6));
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, #00cfa6 75%, #00cfa6 100%);
}

.loading-spinner {
    margin-top: 1.5rem;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60px;
    height: 60px;
    border-radius: 50%;
    border: 4px solid #ffffff;
    border-top-color: #3498db;
    animation: spin 1s infinite linear;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}