:root {
    --mainOrange: #EEBC32;
    --mainBlauw: #2F4EA4;
    --lightBlauw: #566FB3;
    --ctaBlauw: #2699FB;
    --lightGrey: #F1F1F1;
    --bgGrey: #EFEFEF;
    --darkGrey: #707070;
    --shadowGrey: #C4C4C4;
    --snowWhite: #FAFAFA;
    --errorRood: #FB2626;
    --shadowBlauw: #007FEB;
    
  
    --hoofdTitel: 2em;
    --subTitel: 1.5em;
    --leesTekst: 1em;
}

.bar--positive {
    fill: var(--mainOrange);
}
  
.bar--negative {
    fill: var(--lightBlauw);
}

.datavis {
    background-color: purple; /* placeholder kleur! weghalen! */
}

section.datavis_section {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
        justify-content: space-between;
        align-items: stretch;
        align-content: stretch;
}
body {
    font-family: 'Ubuntu', sans-serif;
    margin: 0em;
}

#muntLinks {
    position: absolute;
    margin-top: -8em;
    width: 8em;
}

#muntRechts {
    position: absolute;
    margin-top: -6em;
    width: 6em;
    right: 0;
    transform: scaleX(-1);
}

.datavis_section a {
    padding: 0em;
    margin-left: 2em;
    margin-right: 2em;
}

.datavis_section a img {
    width: 8em;
}

h1 {
    color: var(--mainBlauw);
}

h1 span {
    color: var(--mainOrange);
}

ul {
    list-style-type: none;
    padding: 0em;
}

img {
    width: 4em;
}

.container {
    display: flex;
    justify-content: center;
    margin-top: 5em;
}

h2 {
    color: #F3B352;
}

.ul_tips {
    padding: 0;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
    color: var(--darkGrey);
    line-height: 1.5em;
    -webkit-transform: translateX(-10000px);
    transform: translateX(-10000px);
}

button {
    background-color: #F3B352;
    color: white;
    border: none;
    font-family: 'Ubuntu', sans-serif;
    padding: 1em;
    padding-right: 2em;
    padding-left: 2em;
    font-weight: bold;
    font-size: 1em;
}

.buttoncontainer {
    display: block;
    text-align: center;
    margin-top: 0em;
    margin-bottom: 5em;
    margin-right: 0em;
    margin-left: 0em;
}



.intro {
    display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	align-content: stretch;
    background: var(--mainBlauw);
}

.intro img {
    width: 10em;
}

#handschoen {
    margin-top: -5em;
    margin-left: 1em;
}

article.info-block {
    margin-top: 4em;
    margin-right: 2em;
    margin-left: 2em;
    max-height: 14em;
    padding: 3em;
    background-color: var(--bgGrey);
    color: var(--darkGrey);
    max-width: 14em;
}

article.samenvatting {
    display: flex;
    flex-direction: column;
    margin: 4em 0em;
    background: var(--snowWhite);
    border-radius: 5px;
    padding-top: 1em;
    padding-bottom: 1em;
    padding-left: 2em;
    padding-right: 10em;
}

article.kolom {
    padding-right: 3em;
    padding-left: 3em;
    width: 280px;
}


hr {
    color: var(--shadowGrey);
}

footer {
    margin-top: 3em;
    width: 100%;
    background-color: var(--mainBlauw);
    display: flex;
}

footer a {
    margin: auto auto;
}

footer a img {
    width: 8em;
}