.class__example {
    
    /* tjek main.css for farvenøglerne, definere gerne manglende nøgler med beskrivende navne. */
    /*=========================================================================================*/
    
    background-color: var(--main-background-color);
    
}


/* nemmere css, brugt ude i virkeligheden. (For mere læs om BEM css på nettet) */
/*=============================================================================*/

.block {
    width: 500px;
    height: auto;
}

.block__element {
    width: 100%;
    height: 200px;
    background-color: white;
}

.block__element--modifier {
    width: 100%;
    height: 200px;
    background-color: red;
}

/* nemmere css, brugt ude i virkeligheden. Exemple 2 (For mere læs om BEM css på nettet) */
/* Tjek også HTML for opsættelsen. */
/*=======================================================================================*/

/*
.button {
    width: 300px;
    height: 60px;
    background-color: white;
    display: block;
    padding: 20px;
}

.button__price  {
    font-size: 12px;
}

.button__text  {
    font-size: 14px;
}

.button--orange {
    background-color: orange;
}
*/