@import url('https://fonts.googleapis.com/css2?family=Bai+Jamjuree:wght@400;500;600;700&display=swap');

:root {
    --color-purple: #3e0e2f;
    --color-white: white;
    --color-text: #7b175c;
}


.skill-card {
    width: 170px;
    padding: 10px;
}


.shadow-effect {
    background-color: var(--color-purple);
    color: var(--color-white);
    transition: all 0.5s;
    border: 2px solid transparent;
    /* Add a transparent border initially */
}

.shadow-effect:hover {
    background-color: var(--color-white);
    border-color: var(--color-purple);
    color: var(--color-purple);
}

.skill-heading {
    font-weight: 700;
    color: var(--color-purple);
}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
    background-color: transparent;
    color: var(--color-white);
    background: rgb(31, 4, 22);
    background: linear-gradient(90deg, rgba(31, 4, 22, 1) 0%, rgba(198, 54, 153, 1) 62%, rgba(220, 178, 207, 1) 100%);
    animation: slidebg 5s linear infinite;
}
.nav-pills .nav-link {
    color: var(--color-purple);
}


@media (max-width: 991px) {

    .skill-heading{
        
        font-size: 14px;
    }

    .skill-heading-row{
        display: flex;
        justify-content: space-around;
    }
}