:root {
    --soft-blue: #62b8e8;
    --soft-blue-30: rgba(98, 184, 232, 0.3);
    --black: #000000;
    --silver: #b6bdb8;
    --soft-silver-30: rgba(182, 189, 184, 0.3);
    --very-light-brown: #d4b489;
    --darkish-blue: #003399;
    --maize: #fcc552;
    --white: #FFF;
    --bluehead: #164193;
}

.white {
    color: var(--white) !important;
}
.black {
    color: black !important;
}
.blue {
    color: var(--darkish-blue);
}
.bg-blue {
    background-color: var(--darkish-blue);
    color: var(--white);
}
.soft-blue {
    color: var(--soft-blue);
}
.bg-soft-blue {
    background-color: var(--soft-blue);
}
.content.bg-soft-blue .smallhead {
    color: var(--white);
}
.content.bg-soft-blue h2 {
    color: var(--darkish-blue);
}
.bg-soft-blue-30 {
    background-color: var(--soft-blue-30);
}
.bg-silver {
    background-color: var(--soft-silver-30);
}

div[class^="wrapper bg-"] {
    background-position: left top;
    background-repeat: no-repeat;
    background-size: 100%;
}
div[class^="content bg-"] {
    background-position: left top;
    background-repeat: no-repeat;
    background-size: 100%;
}
body[class^="bg-"] {
    background-position: left 50px;
    background-repeat: no-repeat;
    background-size: 100%;
}

.bg-soft-blue-e {
    background-image: url('../images/svg/bg-soft-blue.svg');
}

.bg-maize {
    background-image: url('../images/svg/bg-maize.svg');
    background-size: 59% !important;
}

.bg-dark-blue-30 {
    background-image: url('../images/svg/bg-dark-blue-30.svg');
}
.bg-silver-30 {
    background-image: url('../images/svg/bg-silver-30.svg');
}
.bg-light-brown-30 {
    background-image: url('../images/svg/bg-light-brown-30.svg');
}

.bg-blue-triangle {
    background-image: url('../images/svg/bg-blue-triangle.svg');
}
.bg-danke {
    background-image: url('../images/svg/bg_hellblau.svg');
}

.bg-member {
    background-image: url('../images/svg/bg-white.svg');
    background-color: var(--soft-silver-30);
}

@media (min-width: 768px) {
body[class^="bg-"] {
    background-position: left 75px;
}
}

@media (min-width: 992px) {
body[class^="bg-"] {
    background-position: left 100px;
}
}