/* BLOCKCHAIN GREEN THEME */

.loader-bc .loader-node {
    background: #1cff73;
}

.loader-bc .loader-bar-fill {
    background: #1cff73;
}

.loader-bc .loader-label {
    color: #1cff73;
}


/* FULLSTACK BLUE THEME */

.loader-fs .loader-node {
    background: #47a8ff;
}

.loader-fs .loader-bar-fill {
    background: #47a8ff;
}

.loader-fs .loader-label {
    color: #47a8ff;
}


/* UI/UX PINK THEME */

.loader-uiux .loader-node {
    background: #ff66c4;
}

.loader-uiux .loader-bar-fill {
    background: #ff66c4;
}

.loader-uiux .loader-label {
    color: #ff66c4;
}


/* ========================================= */


/*         RESPONSIVE THEME ADJUSTMENTS      */


/* ========================================= */


/* Tablets */

@media (max-width: 768px) {
    .loader-bc .loader-node,
    .loader-fs .loader-node,
    .loader-uiux .loader-node {
        width: 12px;
        height: 12px;
    }
    .loader-bc .loader-label,
    .loader-fs .loader-label,
    .loader-uiux .loader-label {
        font-size: 0.75rem;
    }
    .loader-bc .loader-bar-fill,
    .loader-fs .loader-bar-fill,
    .loader-uiux .loader-bar-fill {
        box-shadow: none;
    }
}


/* Small phones */

@media (max-width: 480px) {
    .loader-bc .loader-node,
    .loader-fs .loader-node,
    .loader-uiux .loader-node {
        width: 10px;
        height: 10px;
    }
    .loader-bc .loader-label,
    .loader-fs .loader-label,
    .loader-uiux .loader-label {
        font-size: 0.7rem;
        letter-spacing: 0.18em;
    }
    .loader-bc .loader-bar-fill,
    .loader-fs .loader-bar-fill,
    .loader-uiux .loader-bar-fill {
        height: 3px;
    }
}


/* Extra small devices (under 360px) */

@media (max-width: 360px) {
    .loader-bc .loader-node,
    .loader-fs .loader-node,
    .loader-uiux .loader-node {
        width: 8px;
        height: 8px;
    }
    .loader-bc .loader-label,
    .loader-fs .loader-label,
    .loader-uiux .loader-label {
        font-size: 0.65rem;
    }
    .loader-bc .loader-bar-fill,
    .loader-fs .loader-bar-fill,
    .loader-uiux .loader-bar-fill {
        height: 3px;
        border-radius: 10px;
    }
}