/*
Theme Name: Tannewaegzunft Solothurn
Text Domain: Tannewaegzunft Solothurn
Description: Custom Theme für die Tannewägzunft Solothurn.
Version: 0.1
Author: Simon Berni
*/

body {
    margin: 0;
    padding: 0;
    min-height: 100vh;
    width: 100%;
    display: flex;
    flex-direction: column;
    font-family: Arial, Helvetica, sans-serif;
    color: white;
}

/* start of font-sizes */
body * {
    font-size: 1.3rem;
    line-height: 2em;
}

.has-small-font-size, .has-small-font-size * {
    font-size: 1rem !important;
}

.has-medium-font-size, .has-medium-font-size * {
    font-size: 1.2rem !important;
}

.has-large-font-size, .has-large-font-size * {
    font-size: 1.5rem !important;
}

.has-x-large-font-size, .has-x-large-font-size * {
    font-size: 1.7rem !important;
}

body h1 {
    font-size: 3rem;
    color: #fef200;
}

body h1.has-small-font-size {
    font-size: 2.8rem !important;
}

body h1.has-medium-font-size {
    font-size: 2.9rem !important;
}

body h1.has-large-font-size {
    font-size: 3.2rem !important;
}

body h1.has-x-large-font-size {
    font-size: 3.5rem !important;
}

body h2 {
    font-size: 2.5rem;
}

body h2.has-small-font-size {
    font-size: 2.3rem !important;
}

body h2.has-medium-font-size {
    font-size: 2.4rem !important;
}

body h2.has-large-font-size {
    font-size: 2.6rem !important;
}

body h2.has-x-large-font-size {
    font-size: 2.7rem !important;
}

body h3 {
    font-size: 2rem;
}

body h3.has-small-font-size {
    font-size: 1.8rem !important;
}

body h3.has-medium-font-size {
    font-size: 1.9rem !important;
}

body h3.has-large-font-size {
    font-size: 2.1rem !important;
}

body h3.has-x-large-font-size {
    font-size: 2.2rem !important;
}

body h4 {
    font-size: 1.8rem;
}

body h4.has-small-font-size {
    margin-bottom: 3rem;
    font-size: 1.6rem !important;
}

body h4.has-medium-font-size {
    font-size: 1.7rem !important;
}

body h4.has-large-font-size {
    font-size: 1.9rem !important;
}

body h4.has-x-large-font-size {
    font-size: 2rem !important;
}

body h5 {
    font-size: 1.3rem;
}

body h5.has-small-font-size {
    font-size: 1rem !important;
}

body h5.has-medium-font-size {
    font-size: 1.2rem !important;
}

body h5.has-large-font-size {
    font-size: 1.4rem !important;
}

body h5.has-x-large-font-size {
    font-size: 1.5rem !important;
}

body h6 {
    font-size: 1rem;
}

body h6.has-small-font-size {
    font-size: 0.9rem !important;
}

body h6.has-medium-font-size {
    font-size: 0.95rem !important;
}

body h6.has-large-font-size {
    font-size: 1.1rem !important;
}

body h6.has-x-large-font-size {
    font-size: 1.25rem !important;
}

summary {
    line-height: 2.5em;
}

figcaption {
    font-size: 1rem;
    line-height: 2.5em;
}

figure.has-small-font-size>figcaption {
    font-size: 0.8rem;
}

figure.has-medium-font-size>figcaption {
    font-size: 0.9rem;
}

figure.has-large-font-size>figcaption {
    font-size: 1.2rem;
}

figure.has-x-large-font-size>figcaption {
    font-size: 1.4rem;
}

details p {
    font-size: 1.2rem;
}

details.has-small-font-size p {
    font-size: 0.9rem;
}

details.has-medium-font-size p {
    font-size: 1.1rem;
}

details.has-large-font-size p {
    font-size: 1.4rem;
}

details.has-x-large-font-size p {
    font-size: 1.6rem;
}

pre.has-small-font-size code {
    font-size: 1rem !important;
}

pre.has-medium-font-size code {
    font-size: 1.2rem !important;
}

pre.has-large-font-size code {
    font-size: 1.5rem !important;
}

pre.has-x-large-font-size code {
    font-size: 1.7rem !important;
}

main ul li {
    line-height: 1.8em;
}

cite {
    font-size: 1.1rem;
    line-height: 2em;
}

blockquote.has-small-font-size>cite {
    font-size: 0.9rem;
}

blockquote.has-medium-font-size>cite {
    font-size: 1rem;
}

blockquote.has-large-font-size>cite {
    font-size: 1.3rem;
}

blockquote.has-x-large-font-size>cite {
    font-size: 1.5rem;
}

pre.wp-block-verse {
    font-style: italic;
}

p.wp-block-paragraph {
    margin: 3rem;
}
/* end of font-sizes */

header {
    margin: 0;
    padding: 0;
    height: 8rem;
    width: 100%;
    position: fixed;
    top: 0;
    display: flex;
    flex-grow: 0;
    z-index: 10;
    align-items: center;
    justify-content: center;
    background-color: rgba(0,0,0,0.8);
    backdrop-filter: blur(4px);
    box-shadow: 0 0 0 0.3px #fef200;
}

header a {
    height: 100%;
    width: auto;
}

.header-logo {
    margin: 1rem;
    height: 6rem;
    width: auto;
}

.header-logo img {
    height: 100%;
    width: auto;
}

main {
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    align-items: center;
    position: relative;
    background-color: #111111;
}

.header-space {
    margin-bottom: 2rem;
    height: 8rem;
    width: 100%;
    background-color: black;
}

div.content {
    padding: 0 4rem 0 4rem;
    max-width: 100rem;
}

main.homepage {
    text-align: center;
}

hr {
    margin: 3rem 0rem;
}

a {
    color: #fef200;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

nav a:hover {
    text-decoration: none;
}

body>footer a {
    color: white;
}

/* style external links */
main a[href^="http://"]::after, main a[href^="https://"]::after {
    content: "";
    margin-left: 0.25rem;
    width: 0.7rem;
    height: 0.7rem;
    display: inline-block;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='16' width='16' viewBox='0 0 512 512'%3E%3C!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2023 Fonticons, Inc.--%3E%3Cpath fill='%23a9c25d' d='M352 0c-12.9 0-24.6 7.8-29.6 19.8s-2.2 25.7 6.9 34.9L370.7 96 201.4 265.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L416 141.3l41.4 41.4c9.2 9.2 22.9 11.9 34.9 6.9s19.8-16.6 19.8-29.6V32c0-17.7-14.3-32-32-32H352zM80 32C35.8 32 0 67.8 0 112V432c0 44.2 35.8 80 80 80H400c44.2 0 80-35.8 80-80V320c0-17.7-14.3-32-32-32s-32 14.3-32 32V432c0 8.8-7.2 16-16 16H80c-8.8 0-16-7.2-16-16V112c0-8.8 7.2-16 16-16H192c17.7 0 32-14.3 32-32s-14.3-32-32-32H80z'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
}

/* exclude domain from external link styling */
main a[href^="http://localhost/"]::after, main a[href^="https://localhost/"]::after, .wp-block-social-links a::after {
    display: none !important;
}

main figure {
    min-width: 100%;
}

main figure>img, video {
    max-height: 50rem;
    width: auto;
    border-radius: 0.5rem;
}

figure.homepage-banner {
    margin: -4rem;
    margin-bottom: 4rem;
    max-width: 200%;
}

figure.homepage-banner img {
    border-radius: 0;
}

figure.wp-block-gallery figure {
    min-width: 0;
}

.wp-block-gallery.has-nested-images figure.wp-block-image figcaption {
    margin-top: 0;
    margin-bottom: 0;
    padding: 1rem;
    background: none;
    color: black;
    font-size: 1.2rem;
    position: unset;
}

.wp-block-gallery.has-nested-images figure.wp-block-image figcaption>strong {
    font-size: 1.3rem;
}

.wp-block-video [poster] {
    object-fit: contain;
}

audio::-webkit-media-controls-panel {
    background-color: #a9c25d;
}

div.wp-block-file {
    margin: 0;
    display: inline-grid;
    line-height: 1.5rem;
    text-align: center;
}

.wp-block-file:not(.wp-element-button) {
    font-size: 1.3rem;
}

.wp-block-file *+.wp-block-file__button {
    margin-left: 0;
}

div.wp-block-file a {
    margin-top: 0.25rem;
    margin-bottom: 0.25rem;
    font-weight: bold;
}

div.wp-block-file a:hover {
    color: #c4d590;
    text-decoration: none;
}

div.wp-block-file a.wp-block-file__button {
    margin: 0;
    background: none;
    border: 3px solid #a9c25d;
    border-radius: 0.5rem;
    color: black;
    font-weight: unset !important;
    transition: 0.5s;
}

div.wp-block-file a.wp-block-file__button:hover {
    background-color: #a9c25d;
    color: white;
    transition: 0.5s;
}

.wp-block-media-text {
    margin-top: 3rem;
    margin-bottom: 3rem;
    margin-left: auto;
    margin-right: auto;
    width: 50%;
    display: block;
}

.wp-block-media-text__content>p.wp-block-paragraph {
    margin: 0.5rem;
}

.wp-block-media-text__media img, .wp-block-media-text__media video {
    max-height: unset;
}

.wp-block-buttons>.wp-block-button {
    margin: 2rem;
}

.wp-block-button__link {
    border: 3px solid #fef200;
    background: none;
    text-decoration: none;
    transition: 0.5s;
}

.wp-block-button__link:hover {
    border: 3px solid #fef200;
    background-color: #fef200;
    color: black;
    text-decoration: none;
    transition: 0.5s;
}

.wp-block-button.is-style-outline>.wp-block-button__link {
    border: 3px solid #fef200;
    transition: 0.5s;
}

.wp-block-button.is-style-outline>.wp-block-button__link:hover {
    background-color: #fef200;
    color: white;
    text-decoration: none;
    transition: 0.5s;
}

.wp-block-separator {
    border-top: 1px solid #fef200;
}

.wp-block-calendar caption {
    font-weight: bold;
}

.wp-block-calendar th {
    background-color: #a9c25d;
    color: white;
}

.wp-block-calendar td>a:hover {
    color: #c4d590;
    text-decoration: none;
}

.wp-block-search__label {
    line-height: 2rem;
    font-weight: bold;
}

.wp-block-search__input {
    border: 1px solid #a9c25d;
}

.wp-block-search__button {
    border: 1px solid #a9c25d;
    background: none;
}

.wp-block-search__button:hover {
    background-color: #a9c25d;
    color: white;
}

/* PAGE MENUS */
.page-nav {
    margin-top: 0.2rem;
    margin-bottom: 0.2rem;
    width: 100%;
    float: left;
}

.page-nav img {
    border-radius: 0;
}

.page-nav .wp-block-cover__inner-container {
    margin: 1rem;
    max-width: max-content;
    border-bottom: 1px solid rgba(255, 255, 255, 0);
    transition: border-bottom 1s;
}

.page-nav .wp-block-cover__inner-container:hover {
    border-bottom: 1px solid rgba(255, 255, 255, 1);
}

.page-nav h3 {
    margin-bottom: 0.25rem;
}

.page-nav a {
    color: white;
}

.page-nav a:hover {
    text-decoration: none;
}


form {
    margin: auto;
    padding: 2em;
    width: 80%;
    font-size: max(2vh, 16px);
}

form p {
    width: 100%;
}

input {
    margin-right: 1em;
    height: 3em;
    width: 46%;
    display: flex;
    flex: 1 0 50%
}

textarea {
    height: 5em;
    width: 92%;
}

input, textarea {
    margin-bottom: 1em;
    padding: 0.5em 1em;
    border: 1px solid #ccc;
}

button {
    padding: 0.5em 1em;
    border: 1px solid #ccc;
    background-color: white;
}

button:hover {
    transition-duration: 0.5s;
    cursor: pointer;
    border: 1px solid #ccc;
    background-color: #ccccccd8;
}

footer {
    margin: 0;
    padding: 1rem 4rem;
    min-height: 5rem;
    display: flex;
    z-index: 9;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
    background-color: black;
    box-shadow: 0 0 0 0.3px #fef200;
}

footer>div.container {
    width: 75%;
    max-width: 50rem;
}

#wpforms-17-field_1, #wpforms-17-field_2 {
    max-width: unset;
}

@media screen and (max-width: 1250px) {

    .wp-block-media-text {
        width: 75%;
    }

}

@media screen and (max-width: 750px) {

	body h1 {
        font-size: 2.3rem;
    }

    body h2 {
        font-size: 2rem;
    }

    body h4 .has-small-font-size {
        font-size: 1.2rem;
    }

    body p, a {
        font-size: 1rem;
    }
	
	div.content {
        padding: 0 2rem 0 2rem;
    }
	
    .wp-block-media-text {
        width: 100%;
    }

    footer>div.container {
    width: 100%;
    }

}