.dlPara {
    color: red;
    display:flex;
    justify-content: flex-end;
}

.deadlockFlexbox {
    display: flex;
    justify-content: space-between;
}

.selectHeroGrid {
    background-color: rgb(54, 143, 106);
    padding: 1rem;
    max-height: fit-content;
}

.selectHeroCard {
    height: 12rem;
    width: 10rem;
    background-color: brown;
    border: .25rem solid rgb(48, 10, 35);
}

.displayHero {
    display:flex;
    background-color: rgb(121, 139, 78);
    padding: 1rem;
    justify-content: flex-end;
    min-width: 35rem;
}

.displayHeroimg {
    max-width: 40rem;
    max-height:40rem;
}

.heroBG {
    z-index: 0;
    position: absolute;
}

.heroSprite {
    z-index: 1;
}

.abilityCircle {
    display:flex;
    z-index:2;
    margin: 3rem;
    position:absolute;
    padding: .5rem;
    border-radius: 50%;
    background-color: violet;
    
}