body{
    background-color: #4a4a4a;
}

#buttons{
    display: flex;
    flex-wrap: wrap;
    max-width: 36em;
}

.typen{
    text-shadow: 0px 0px 5px black;
    color: white;
}

.zelle{
    background-color: white;
    height: 2em;
    text-align: center;
    padding-top: 0.7em;
    border: black 0.5px solid;
    width: 5em;
}

.auswahl{
    border-radius: 0.9em;
    border-width: 0.3em;
    margin: 0.8em;
    height: 2.7em;
    width: 5.6em;
    outline: none;
}   

#ergebnis{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    width: fit-content;
}

.wrapper{
    display: flex;
}

.active{
    border-color: steelblue;
}

@media only screen and (min-width: 500px){
    #ergebnis{
        flex-direction: row;
    }

    .wrapper{
        flex-direction: column;
    }
}

/* #region farben*/
    .normal{
        background-color: #a9a878;
    }
    .feuer{
        background-color: #f07f2d;
    }
    .wasser{
        background-color: #698ff0;
    }
    .gras{
        background-color: #75c94f;
    }
    .elektro{
        background-color: #f7d12d;
    }
    .eis{
        background-color: #98d8d8;
    }
    .kampf{
        background-color: #be3127;
    }
    .gift{
        background-color: #a13fa3;
    }
    .boden{
        background-color: #e0bf70;
    }
    .flug{
        background-color: #a890f4;
    }
    .psycho{
        background-color: #fa5688;
    }
    .käfer{
        background-color: #a8b821;
    }
    .stein{
        background-color: #b6a03d;
    }
    .geist{
        background-color: #705798;
    }
    .drache{
        background-color: #6d39fe;
    }
    .unlicht{
        background-color: #6f5848;
    }
    .stahl{
        background-color: #b8b8d0;
    }
    .fee{
        background-color: #e89daa;
    }

    .black{
        background-color: black;
        color: white;
    }

    .darkred{
        background-color: darkred;
    }

    .red{
        background-color: red;
    }

    .green{
        background-color: green;
    }
    
    .darkgreen{
        background-color: darkgreen;
    }

/* #endregion farben*/