/*  grid  */
main > .grid .grid + .grid { margin-top: var(--gutter-y, 2rem); }
main > .grid.bgimage { color: var(--color-white); }
main > .grid.bgimage :is(h1, h2, h3, h4) { color: inherit; }
main > .grid.bgimage > .image > picture { filter: saturate(80%) brightness(60%); }
main > .grid.bgimage.grid-layout-two-one { isolation: isolate; }
main > .grid.bgimage.grid-layout-two-one:before { content: ''; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: linear-gradient(to right, rgb(0 0 0 / .5) 50%, rgb(0 0 0 / 0) 100%); z-index: 1; }
main > .grid.bgimage.grid-layout-two-one > .wrapper { z-index: 2; }


.grid > .wrapper { max-width: calc(var(--max-width, 80rem)); }



/*  image  */
.image-max-width-25percent img { max-width: min(100%, 25%); }
.image-max-width-50percent img { max-width: min(100%, 50%); }
.image-max-width-75percent img { max-width: min(100%, 75%); }
.image-max-width-25vw img { max-width: min(100%, 25vw); }
.image-max-width-50vw img { max-width: min(100%, 50vw); }
.image-max-width-75vw img { max-width: min(100%, 75vw); }



/*  masonry  */
/*
.masonry { margin: 0 auto; padding: .5rem; max-width: 1680px; }
.masonry-column > * { margin: .5rem !important; }
.masonry-column > *:not(:first-child) { margin-top: 1rem !important; }
*/



/*  hoverbox  */
.hoverbox + .hoverbox { margin-top: 1rem; }
a.hoverbox { padding: 0; margin: 0; }
a.hoverbox:hover { background: none; }
.hoverbox .wrapper { z-index: 1; text-shadow: 0 0 .25rem rgb(0 0 0 / 1); font-weight: 600; background: rgb(0 0 0 / .5)}
.hoverbox .box { opacity: 1; transform: scale(1); background: none; }
.hoverbox .image img { transition: transform .5s ease, filter .5s ease; filter: none; }
.hoverbox:hover .image img, .hoverbox:active .image img { transition: transform .5s ease, filter .5s ease; transform: scale(1.1); filter: blur(1px); }
.hoverbox .link:focus-visible .box { outline: 2px solid var(--color-link-focus); }



/*  link  */
.link { color: var(--color-link, #CE2B37); text-decoration: underline; }
.link:hover { color: var(--color-link-hover, #CE2B37); text-decoration: underline; }



/*  button  */
.button, .newsarticle .article > .link:last-child, .newslist .article .inner .image:before {
    display: inline-block;
    padding: .75em 1.5em;
    border: 0;
    border-radius: .375rem;
    background: var(--color-red, #EE2222);
    color: var(--color-white, #FFFFFF);
    font-family: var(--font-family, inherit);
    font-size: var(--font-size, 1rem);
    font-weight: 700;
    text-align: center;
    text-decoration: none;
    text-transform: none;
    transition: color .2s ease, border .2s ease, background-color .2s ease, box-shadow .2s ease;
    cursor: pointer;
}
.button.disabled { background: var(--color-grey); }
.button:hover, .button:focus-visible { background: var(--color-darker-red, #BB1111); color: var(--color-white, #FFFFFF); border: 0; }
.button:focus-visible { outline: 2px solid var(--color-link-focus, #FFAA00); outline-offset: 2px; }
.button.disabled:hover, .button.disabled:focus-visible { background: var(--color-light-grey, #E9E9E9); cursor: default; }
.button.mailformreset { background: var(--color-light-grey, #E9E9E9); color: #990000; }
.button.mailformreset:hover, .button.mailformreset:focus-visible { background: var(--color-darker-red, #BB1111); color: var(--color-white); border: 0; box-shadow: none; }
.button > i.fas:first-child, .button > i.far:first-child { margin-right: .25em; }



/*  mailform  */
.mailform .label .mandatory:after { color: var(--color-green, #009246); }
.mailform .message.success { border-color: var(--color-green, #009246); background-color: var(--color-light-grey, #E9E9E9); }
.mailform form { display: flex; flex-flow: row wrap; justify-content: space-between; }
.mailform .group { width: 100%; }
.mailform .group:not(:first-child:last-child) { width: calc(50% - (var(--columns-gutter-x, 1rem) * .5)); }
.mailform .group:not(:last-child) { margin-bottom: 1rem; }
.mailform .valid .label::after { background-color: var(--color-green, #009246); }
.mailform .mailformtextarea { min-height: 14em; }



/*  horizontal rule  */
hr { border: 0; border-top: 2px solid var(--color-light-grey, #B1B1B1); width: 100%; height: 0; margin: 1.5em auto; }
h1 + hr, h2 + hr, h3 + hr, h4 + hr { margin-top: .5em; }
@media (max-width: 40rem) {
    hr { margin: 1em auto; }
}



/*  text  */
.text-style-large { font-size: 1.875em; line-height: 1.25; font-weight: 300; }
.text-style-medium { font-size: 1.625em; line-height: 1.25; font-weight: 300; }

@media (max-width: 40rem) {
    .text-style-large { font-size: 1.5em; }
    .text-style-medium { font-size: 1.375em; }
}



/*  overlay box  */
.overlaybox { background: var(--color-light-grey, #E9E9E9); border-color: var(--color-red, #CE2B37); }
.overlaybox .close { background: var(--color-red, #CE2B37); }
.overlaybox .close:before, .overlaybox .close:after { background-color: var(--color-red, #CE2B37); }
.overlaybox a { color: var(--color-white, #FFFFFF); }



/*  accordion menu  */
.accordion { border: 2px solid var(--color-light-grey); transition: border-color .3s ease; background: var(--color-white); }
.accordion.opened { border-color: var(--color-red); }
.accordion-head { background: var(--color-white); border-bottom: 0; padding-right: 4rem; transition: border-color .3s ease; }
.accordion-head:focus { outline: none; }
.accordion-head:focus-visible { outline: 2px solid var(--color-link-focus); outline-offset: -4px; }
.accordion-head::after { content: 'i'; top: 50%; right: 1rem; margin-top: -1rem; width: 2rem; height: 2rem; line-height: 2rem; border-radius: 50%; font-size: 1.375rem; text-align: center; color: var(--color-white); background: #0076CC; transition: none; }
.accordion.opened .accordion-head::after { content: '+'; font-size: 3rem; color: var(--color-link); background: none; }
.accordion-content-wrapper { padding-top: 0; }
.accordion + .accordion { margin-top: -1em; }



/*  gallery  */
.gallery > *:not(.button) { padding: .5rem; }