:root {
    --hako-blue: #17428c;
    --hako-blue-manual: #393d84;
    --hako-green: #4e9f2d;
    --hako-green-manual: #61a039;
    --hako-petrol: #20777c;
    --hako-petrol-manual: #4d7579;
    --hako-gray: #9da9b1;
    --hako-gray-manual: #97a0a7;
    --hako-gold: #d4a95e;
    --hako-gold-manual: #c3aa64;
    --hako-white: #ffffff;
    --hako-black: #111111;
    --hako-font-family: Ubuntu, "Roboto Regular", Arial, sans-serif;
    --hako-font-family-light: "Ubuntu Light", Ubuntu, Arial, sans-serif;
    --hako-logo-path: url("../Images/Hako/Logos/hako-logo.svg");
    --hako-keyvisual-path: url("../Images/Hako/Keyvisual/hako-keyvisual.svg");

    --green: var(--hako-green);
    --blueDarker: var(--hako-blue);
    --blue: var(--hako-petrol);
    --white: #ffffff;
    --greenDarker: var(--hako-petrol);
    --black: #111111;
}


.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    color: var(--greenDarker);
}

body {
    color: #2c2d2e;
}

a {
    color: var(--black);
    text-decoration: none;
}


.bg-primary {
    background-color: var(--blueDarker) !important;
}

.btn-primary {
    color: #fff;
    background-color: var(--blueDarker);
    border-color: var(--green);
}

.btn-primary:hover {
    background-color: var(--blue) !important;
    border-color: var(--greenDarker) !important;
}

    .btn-primary.focus, .btn-primary:focus {
        background-color: var(--blueDarker) !important;
        border-color: var(--blueDarker) !important;
    }

.alert-secondary {
    background: var(--green);
    border-color: var(--green);
}