@charset "UTF-8";
:root {
    --mixology-dark-blue: #224B8E;
    --mixology-dark-green: #00654A;
    --mixology-light-blue: #00BEDF;
    --mixology-light-green: #85C779;
    --mixology-orange: #F27043;
    --mixology-purple: #881345;
    --mixology-red: #EC1B2E;
    --mixology-violet: #B27AB3;
    --mixology-yellow: #FCB813;
    --mixology-white: #FFFFFF;
}

.cocktail {
    /*aspect-ratio: 5 / 3.5;*/
    background: white;
    color: black;
    border-radius: 1.5em;
    overflow: hidden;
    padding: 0 0 2em 0;
    box-shadow: 5px 20px 20px rgba(0, 0, 0, 0.2);
}

.cocktail header {
    font-family: "mostra-nuova", sans-serif;
    font-style: normal;
    color: white;
    background-color: var(--mixology-purple);
    padding: .5em 1em;
}

.cocktail header h1 {
    font-weight: 700;
    text-transform: uppercase;
    font-size: 2.5em;
    margin: 0;
}

.cocktail header h2 {
    font-weight: 400;
    font-size: 1.25em;
    margin: 0;
}

.cocktail .ingredient-list {
    padding: .25em .5em;
}

.cocktail .ingredient-list .ingredient {
    font-family: "mostra-nuova", sans-serif;
    font-weight: 800;
    font-style: normal;
    text-transform: uppercase;
    font-size: 1.2em;
}