:root {
--base-color-text: white;
--base-color-accent: white;
--base-color-light: silver;
--base-color-background: #005673;
--base-font-family: Verdana,Geneva,sans-serif;
--base-line-height: 1.5;
--base-font-size: clamp(15px, 0.95vw, 18px);
--base-font-size-small: calc(0.8*var(--base-font-size));
--base-font-size-large: calc(1.75*var(--base-font-size));
--base-space: calc(1.2*var(--base-font-size));
--base-offset: clamp(18px, 1.6vw, 30px);
--base-content-width: 850px;
--base-content-width-wide: 1100px;
--base-layout-width: 100%;
}
body {
background: url(//www.vibraphonissimo.de/wp-content/uploads/background.jpg);
background-attachment: fixed;
background-size: cover;
background-position: center;
}
header {
display: flex;
align-items: start;
justify-content: right;
padding: 1em 0 1em;
flex-wrap: wrap;
}
header figure {
margin: 0 auto 0 calc(var(--base-offset)*2);
width: 5em;
}
.home header figure {
display: none;
}
header .menu {
display: none;
}
footer a, footer a::after {
text-decoration-color: transparent;
transition: all 150ms ease-in-out;
}
.header__widgets {
margin-right: calc(var(--base-offset)*2);
min-width: 72px;
height: 30px;
}
.wp-block-social-links {
margin-bottom: 0;
}
.wp-block-columns {
gap: calc(var(--base-space)*2);
}
article a {
text-decoration: underline;
word-break: break-all;
}
.home .wp-block-group {
display: flex;
}
.home .wp-block-group .wp-block-image {
margin: 1em auto 3em;
}
.home .wp-block-group .wp-block-image:first-child {
display: none;
}
.home .wp-block-query .wp-block-post {
margin-bottom: 1em;
}
.home .wp-block-query .wp-block-post-title {
margin-bottom: 0;
}
body:not(.home) main .site-layout-container {
margin-top: 5em;
}
.current_page_item a, .current_page_item a::after, footer a:hover, footer a:hover::after {
text-decoration: underline;
}
footer .site-layout-container__inner {
display: flex;
flex-direction: column-reverse;
gap: 1em;
align-items: center;
justify-content: center;
padding: 5em 0 1.5em;
flex-wrap: wrap;
}
footer .menu {
display: flex;
gap: 1em;
align-items: center;
font-size: var(--base-font-size-small);
justify-content: center;
flex-wrap: wrap;
}
.footer__widgets p {
margin: 0;
font-size: var(--base-font-size-small);
}
h2 {
font-weight: normal;
margin-top: -1em;
}
.wp-block-gallery .wp-block-image {
margin: 0;
background-color: white;
padding: 0.5em;
flex-grow: 0 !important;
aspect-ratio: 1;
}
.wp-block-gallery .wp-block-image img {
max-height: 100%;
}
@media (max-width:781px) {
.home .wp-block-columns .wp-block-column:first-child {
display: none;
}
.home .wp-block-group .wp-block-image:first-child {
display: inherit;
margin-right: 0 !important;
}
.home .wp-block-group .wp-block-image:last-child {
margin-left: var(--base-space) !important;
}
header figure {
margin-left: auto;
margin-right: calc(50vw - 5em - 72px - var(--base-offset)*2);
width: 10em;
}
header figure a {
margin: 3em auto;
width: 10em;
display: block;
}
.header__widgets {
margin-right: var(--base-offset);
}
a[href="https://vibra.dev.plue.tech/ueber-vibraphonissimo/"],
a[href="https://vibra.dev.plue.tech/kooperationspartner-und-stiftungen/"],
a[href="https://vibra.dev.plue.tech/vibraphon-meeting/"] {
font-size: 0;
text-decoration: none !important;
}
a[href="https://vibra.dev.plue.tech/ueber-vibraphonissimo/"]::after {
content: "Über";
font-size: var(--base-font-size-small);
}
a[href="https://vibra.dev.plue.tech/kooperationspartner-und-stiftungen/"]::after {
content: "Kooperation";
font-size: var(--base-font-size-small);
}
a[href="https://vibra.dev.plue.tech/vibraphon-meeting/"]::after {
content: "Meeting";
font-size: var(--base-font-size-small);
}
}
@media (min-width:1100px) {	
.wp-block-social-links {
position: fixed;
}
header figure a {
position: fixed;
width: 5em;
}
body:not(.home) main .site-layout-container {
padding-right: 200px;
}
}