@import "fonts.css";
@import "vars.css";
@import "header.css";
@import "footer.css";
@import "elements.css";
@import "sidebar.css";
@import "menu.css";
@import "workshops.css";
@import "contact.css";

body {
    font-family: 'Barlow Semi Condensed', sans-serif;
    background-image: var(--background-gradient);
    font-size: 22px;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'DCCAsh', sans-serif;
    margin-bottom: 0;
}

h1, h2 {
    font-size: 2.2rem;
    letter-spacing: 3px;
}

h3 {
    font-size: 2rem;
    letter-spacing: 2px;
}

h4 {
    font-size: 1.8rem;
    letter-spacing: 2px;
}

h5, h6 {
    font-size: 1.6rem;
    letter-spacing: 1px;
}

a {
    text-decoration: none;
}

.content-block {
    a {
        text-decoration: none;
        font-weight: bold;
        color: var(--color-lok-blue);

        &:hover {
            color: var(--color-lok-yellow);
        }
    }
}

.main-content {
    margin: auto;
    padding: 30px 170px 30px 40px;
    max-width: 95%;
    min-height: 800px;

    @media (max-width: 767.99px) {
        max-width: 99%;
        padding: 30px 40px;
        min-height: unset;
    }

    @media (max-width: 575.99px) {
        max-width: 99%;
        padding: 5px 10px;
    }
}

a.home-link {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 200;
}