.fire {
    background-image: linear-gradient(180deg, rgb(231, 130, 7), rgb(228, 190, 3));
    border: 8px solid rgb(247, 206, 2);
}

.water {
    background-image: linear-gradient(180deg, rgb(6, 3, 188), rgb(4, 99, 214));
    border: 8px solid rgb(2, 112, 247);
}

.grass {
    background-image: linear-gradient(180deg, rgb(0, 94, 30), rgb(48, 189, 78));
    border: 8px solid rgb(41, 166, 68);
}

.electric {
    background-image: linear-gradient(180deg, rgb(248, 216, 90), rgb(254, 178, 3));
    border: 8px solid rgb(242, 169, 0);
}

.ice {
    background-image: linear-gradient(180deg, rgb(168, 222, 222), rgb(66, 123, 123));
    border: 8px solid rgb(88, 160, 160);
}

.fighting {
    background-image: linear-gradient(180deg, rgb(190, 145, 108), rgb(173, 93, 56));
    border: 8px solid rgb(160, 82, 45);
}

.poison {
    background-image: linear-gradient(180deg, rgb(174, 31, 55), rgb(189, 60, 105));
    border: 8px solid rgb(165, 50, 90);
}

.ground {
    background-image: linear-gradient(180deg, rgb(146, 91, 25), rgb(164, 129, 81));
    border: 8px solid rgb(139, 109, 68);
}

.flying {
    background-image: linear-gradient(180deg, rgb(190, 176, 234), rgb(88, 72, 141));
    border: 8px solid rgb(90, 76, 138);
}

.bug {
    background-image: linear-gradient(180deg, rgb(96, 113, 65), rgb(83, 158, 99));
    border: 8px solid rgb(95, 187, 115);
}

.rock {
    background-image: linear-gradient(180deg, rgb(170, 157, 100), rgb(141, 128, 81));
    border: 8px solid rgb(138, 127, 88);
}

.ghost {
    background-image: linear-gradient(180deg, rgb(148, 139, 165), rgb(75, 59, 85));
    border: 8px solid rgb(75, 63, 82);
}

.dragon {
    background-image: linear-gradient(180deg, rgb(113, 56, 244), rgb(74, 30, 136));
    border: 8px solid rgb(74, 30, 136);
}

.dark {
    background-image: linear-gradient(180deg, rgb(93, 74, 62), rgb(52, 40, 40));
    border: 8px solid rgb(64, 48, 48);
}

.fairy {
    background-image: linear-gradient(180deg, rgb(166, 8, 183), rgb(255, 0, 247));
    border: 8px solid rgb(247, 2, 239);
}

.normal {
    background-image: linear-gradient(180deg, rgb(252, 248, 10), rgb(199, 169, 113));
    border: 8px solid rgb(134, 108, 59);
}

.steel {
    background-image: linear-gradient(180deg, rgb(197, 197, 227), rgb(86, 86, 90));
    border: 8px solid rgb(161, 161, 186);
}

.psychic {
    background-image: linear-gradient(180deg, rgb(185, 185, 222), rgb(72, 72, 88));
    border: 8px solid rgb(161, 161, 186);
}