/* oswald-regular - latin */
@font-face {
    font-family: "Oswald";
    font-style: normal;
    font-weight: 400;
    src: url("/assets/fonts/oswald/oswald-v49-latin-regular.eot");
    /* IE9 Compat Modes */
    src:
        local(""),
        url("/assets/fonts/oswald/oswald-v49-latin-regular.eot?#iefix") format("embedded-opentype"),
        /* IE6-IE8 */
        url("/assets/fonts/oswald/oswald-v49-latin-regular.woff2") format("woff2"),
        /* Super Modern Browsers */
        url("/assets/fonts/oswald/oswald-v49-latin-regular.woff") format("woff"),
        /* Modern Browsers */
        url("/assets/fonts/oswald/oswald-v49-latin-regular.ttf") format("truetype"),
        /* Safari, Android, iOS */
        url("/assets/fonts/oswald/oswald-v49-latin-regular.svg#Oswald") format("svg");
    /* Legacy iOS */
}

/* oswald-700 - latin */
@font-face {
    font-family: "Oswald";
    font-style: normal;
    font-weight: 700;
    src: url("/assets/fonts/oswald/oswald-v49-latin-700.eot");
    /* IE9 Compat Modes */
    src:
        local(""),
        url("/assets/fonts/oswald/oswald-v49-latin-700.eot?#iefix") format("embedded-opentype"),
        /* IE6-IE8 */
        url("/assets/fonts/oswald/oswald-v49-latin-700.woff2") format("woff2"),
        /* Super Modern Browsers */
        url("/assets/fonts/oswald/oswald-v49-latin-700.woff") format("woff"),
        /* Modern Browsers */
        url("/assets/fonts/oswald/oswald-v49-latin-700.ttf") format("truetype"),
        /* Safari, Android, iOS */
        url("/assets/fonts/oswald/oswald-v49-latin-700.svg#Oswald") format("svg");
    /* Legacy iOS */
}

/* roboto-mono-regular - latin */
@font-face {
    font-family: "Roboto Mono";
    font-style: normal;
    font-weight: 400;
    src: url("/assets/fonts/roboto-mono/roboto-mono-v22-latin-regular.eot");
    /* IE9 Compat Modes */
    src:
        local(""),
        url("/assets/fonts/roboto-mono/roboto-mono-v22-latin-regular.eot?#iefix") format("embedded-opentype"),
        /* IE6-IE8 */
        url("/assets/fonts/roboto-mono/roboto-mono-v22-latin-regular.woff2") format("woff2"),
        /* Super Modern Browsers */
        url("/assets/fonts/roboto-mono/roboto-mono-v22-latin-regular.woff") format("woff"),
        /* Modern Browsers */
        url("/assets/fonts/roboto-mono/roboto-mono-v22-latin-regular.ttf") format("truetype"),
        /* Safari, Android, iOS */
        url("/assets/fonts/roboto-mono/roboto-mono-v22-latin-regular.svg#RobotoMono") format("svg");
    /* Legacy iOS */
}

/* roboto-mono-700 - latin */
@font-face {
    font-family: "Roboto Mono";
    font-style: normal;
    font-weight: 700;
    src: url("/assets/fonts/roboto-mono/roboto-mono-v22-latin-700.eot");
    /* IE9 Compat Modes */
    src:
        local(""),
        url("/assets/fonts/roboto-mono/roboto-mono-v22-latin-700.eot?#iefix") format("embedded-opentype"),
        /* IE6-IE8 */
        url("/assets/fonts/roboto-mono/roboto-mono-v22-latin-700.woff2") format("woff2"),
        /* Super Modern Browsers */
        url("/assets/fonts/roboto-mono/roboto-mono-v22-latin-700.woff") format("woff"),
        /* Modern Browsers */
        url("/assets/fonts/roboto-mono/roboto-mono-v22-latin-700.ttf") format("truetype"),
        /* Safari, Android, iOS */
        url("/assets/fonts/roboto-mono/roboto-mono-v22-latin-700.svg#RobotoMono") format("svg");
    /* Legacy iOS */
}

:root {
    --textColor: #fbe800;
    --backgroundColor: #191919;
    --buttonBackgroundColor: #fbe800;
    --buttonTextColor: #191919;
    --buttonHoverBackgroundColor: #191919;
    --buttonHoverTextColor: #fbe800;
}

body,
html {
    min-width: 100%;
    min-height: 100%;
    background-color: var(--backgroundColor);
    color: var(--textColor);
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    font-family: "Roboto Mono", sans-serif;
    font-weight: 400;
}

a {
    font-size: 15px;
    color: var(--textColor) !important;
    text-transform: none;
    font-weight: 400;
}

img {
    width: 100%;
}

.header-image {
    aspect-ratio: 1513/1591;
    object-fit: cover;
    object-position: center;
}

.image-wrapper {
    position: relative;
    width: 100%;
    margin-top: -10%;
    margin-bottom: -10%;
    overflow: hidden;
}

.image-wrapper.background {
    z-index: 1;
    background-color: white;
}

.image-wrapper.foreground {
    position: absolute;
    top: 0;
    z-index: 100;
}

.image-wrapper > img {
    width: 200%;
    margin-left: 50%;
    transform: translateX(-40%);
}

.logo {
    position: absolute;
    top: 50%;
    z-index: 100;
    width: 64%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.logo img {
    width: 100%;
}

h1 {
    font-family: "Oswald", sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 30px;
    line-height: 35px;
    font-size: 7vw;
    line-height: 8vw;
}

h2 {
    font-family: "Oswald", sans-serif;
    font-weight: 700;
    text-transform: uppercase;
    font-size: 30px;
    line-height: 35px;
    font-size: 5vw;
    line-height: 6vw;
}

.btn.fsf-btn {
    font-family: "Oswald", sans-serif;
    font-weight: 700;
    background-color: var(--buttonBackgroundColor);
    color: var(--buttonTextColor) !important;
    border-color: var(--buttonBackgroundColor);
    /* -webkit-box-shadow: 4px 4px 0px 0px var(--textColor);
    box-shadow: 4px 4px 0px 0px var(--textColor); */
    padding: 10px 15px 12px 15px;
    border-width: 2px;
    text-transform: uppercase;
    border-radius: 0;
    font-size: 20px;
    line-height: 20px;
    transition: 0.3s;
    white-space: nowrap;
}

.btn.fsf-btn:hover {
    background-color: var(--buttonHoverBackgroundColor);
    color: var(--buttonHoverTextColor) !important;
}

.btn.ab-btn {
    position: absolute;
    z-index: 200;
    top: 20px;
    padding: 7px 10px 5px 10px;
}

.btn:not(.ab-btn) {
    font-size: 20px;
    line-height: 20px;
    padding: 12px 15px 18px 15px;
}

.btn.shop {
    left: 20px;
}

.btn.tickets {
    right: 20px;
}

.tourdates,
.album,
.festivaldates,
.impressum {
    position: relative;
    font-size: 16px;
    background-color: var(--backgroundColor);
    z-index: 105;
}

.tourdates {
    text-transform: uppercase;
    margin-top: 6vw;
}

.tourdates .city {
    font-weight: 700;
}

.festivaldates {
    text-transform: uppercase;
    margin-top: 6vw;
}

.tourdates:before,
.line:before {
    position: absolute;
    content: "";
    left: 50%;
    top: 0%;
    transform: translateX(-50%);
    width: 80%;
}

.tourdates .row > [class^="col"]:nth-child(2) {
    font-family: "Roboto Mono", sans-serif;
    font-weight: 700;
}

.festivaldates .row > [class^="col"]:nth-child(2) {
    font-family: "Roboto Mono", sans-serif;
    font-weight: 700;
}

.album img {
    width: 100%;
}

.btn.btn-primary {
    background-color: var(--backgroundColor);
    color: var(--textColor) !important;
    border: none;
    font-size: 17px;
    line-height: 22px;
    text-transform: none;
    padding: 15px;
    border-radius: 17px;
}

.mt-4 {
    margin-top: 40px !important;
}

.mb-4 {
    margin-bottom: 40px !important;
}

.mt-5 {
    margin-top: 50px !important;
}

.mb-5 {
    margin-bottom: 50px !important;
}

.button-item {
    margin-top: 2vw;
}

.tourdates .button-item {
    margin-top: 6.2vw;
}

.misc .button-item {
    margin-top: 6.2vw;
}

.tour-item:nth-child(2) {
    margin-top: 3vw;
}

.footer {
    margin-top: 200px;
}

hr {
    border-top: 2px solid var(--textColor);
    opacity: 1;
}

@media (min-width: 768px) {
    .tourdates {
        font-size: 20px;
    }
}

@media (min-width: 992px) {
    .image-wrapper > img {
        width: 100%;
        margin-left: 0%;
        transform: translateX(0%);
    }

    .logo {
        width: 24%;
    }

    .tourdates {
        font-size: 25px;
    }

    .festivaldates {
        font-size: 25px;
    }

    .tourdates,
    .album {
        padding: 0 5%;
    }

    .btn.btn-primary {
        font-size: 30px;
        line-height: 35px;
        padding: 30px;
        border-radius: 30px;
    }

    .btn:not(.ab-btn) {
        font-size: 40px;
        line-height: 40px;
        padding: 10px 15px 12px 15px;
    }

    .mt-4 {
        margin-top: 80px !important;
    }

    .mb-4 {
        margin-bottom: 80px !important;
    }

    .mt-5 {
        margin-top: 100px !important;
    }

    .mb-5 {
        margin-bottom: 100px !important;
    }
}

@media (min-width: 1200px) {
    h1 {
        font-size: 80px;
        line-height: 85px;
        font-size: 4vw;
        line-height: 4.3vw;
    }

    h2 {
        font-size: 80px;
        line-height: 85px;
        font-size: 3vw;
        line-height: 3.3vw;
    }

    .image-wrapper {
        margin-top: -20%;
        margin-bottom: -10%;
    }

    .tourdates {
        font-size: 1.25vw;
        margin-top: 0;
    }

    .festivaldates {
        font-size: 1.3vw;
        margin-top: 0;
    }

    .line:before {
        left: 0;
        top: 50%;
        width: unset;
        transform: translateY(-50%);
        height: 80%;
        border-top: none;
        border-left: 2px solid #fff700;
    }

    .tour-item {
        margin-top: 1.25vw;
    }

    .tour-item:nth-child(2) {
        margin-top: 3vw;
    }

    .button-item {
        margin-top: 2vw;
    }

    .tourdates .button-item {
        margin-top: 4.2vw;
    }

    .footer {
        margin-top: 400px;
    }
}

.container.container-full-width {
    max-width: 100% !important;
}

.show-cookies-btn {
    display: none;
}