:root {
    /*Pokemon-card-colors*/
    --bug-icon: rgb(170, 187, 34);
    --bug-bg: rgb(178, 211, 105);
    --dark-icon: rgb(119,85,68);
    --dark-bg:rgb(131,118,118);    
    --dragon-icon: rgb(119,85,68);
    --dragon-bg:rgb(131,118,118);  
    --electric-icon: rgb(255, 204, 51);
    --electric-bg: rgb(255, 230, 76);
    --fairy-icon: rgb(255, 170, 255);
    --fairy-bg: rgb(241, 176, 237);
    --flying-icon: rgb(207, 206, 218);
    --flying-bg: rgb(191, 190, 200);
    --fighting-icon: rgb(187, 85, 68);
    --fighting-bg: rgb(207, 136, 124);
    --fire-bg: rgb(251, 108, 108);
    --fire-icon: rgb(246, 141, 140);
    --ghost-icon: rgb(102,102,187);
    --ghost-bg: rgb(153,123,154);
    --gras-bg: rgb(70, 209, 177);
    --gras-icon: rgb(97, 225, 202);
    --ground-icon: rgb(221, 187, 85);
    --ground-bg: rgb(192, 157, 116);
    --ice-icon: rgb(131, 212, 239);
    --ice-bg: rgb(157, 221, 210);
    --normal-bg: rgb(207, 207, 195);
    --normal-icon: rgb(187, 187, 170);
    --poison-icon: rgb(170, 85, 153);
    --poison-bg: rgb(180, 134, 220);
    --psychic-icon: rgb(255, 85, 153);
    --psychic-bg: rgb(255, 145, 166);
    --rock-icon: rgb(187, 170, 102);
    --rock-bg: rgb(207, 195, 147);
    --steel-icon: rgb(170,170,187);
    --steel-bg: rgb(195,195,207);
    --water-bg: rgb(118, 188, 251);
    --water-icon: rgb(144, 210, 254);
}


.grass-icon {
    background-color: var(--gras-icon);

}

.grass-bg {
    background-color: var(--gras-bg);

}

.fire-icon {
    background-color: var(--fire-icon);

}

.fire-bg {
    background-color: var(--fire-bg);

}

.water-icon {
    background-color: var(--water-icon);

}

.water-bg {
    background-color: var(--water-bg);

}

.normal-icon {
    background-color: var(--normal-icon);
}

.normal-bg {
    background-color: var(--normal-bg);

}

.bug-icon {
    background-color: var(--bug-icon);
}

.bug-bg {
    background-color: var(--bug-bg);

}

.poison-icon {
    background-color: var(--poison-icon);

}

.poison-bg {
    background-color: var(--poison-bg);

}

.electric-icon {
    background-color: var(--electric-icon);

}

.electric-bg {
    background-color: var(--electric-bg);

}

.ground-icon {
    background-color: var(--ground-icon);

}

.ground-bg {
    background-color: var(--ground-bg);

}

.fairy-icon {
    background-color: var(--fairy-icon);

}

.fairy-bg {
    background-color: var(--fairy-bg);

}

.flying-icon {
    background-color: var(--flying-icon);

}

.flying-bg {
    background-color: var(--flying-bg);

}

.fighting-icon {
    background-color: var(--fighting-icon);

}

.fighting-bg {
    background-color: var(--fighting-bg);

}

.psychic-icon {
    background-color: var(--psychic-icon);

}

.psychic-bg {
    background-color: var(--psychic-bg);

}

.rock-icon {
    background-color: var(--rock-icon);

}

.rock-bg {
    background-color: var(--rock-bg);

}

.dark-icon {
    background-color: var(--dark-icon);

}

.dark-bg {
    background-color: var(--dark-bg);

}


.steel-icon {
    background-color: var(--steel-icon);

}

.steel-bg {
    background-color: var(--steel-bg);

}


.ghost-icon {
    background-color: var(--ghost-icon);

}

.ghost-bg {
    background-color: var(--ghost-bg);

}

.dragon-icon {
    background-color: var(--dragon-icon);

}

.dragon-bg {
    background-color: var(--dragon-bg);

}

.ice-icon {
    background-color: var(--ice-icon);

}

.ice-bg {
    background-color: var(--ice-bg);

}