@import url("https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;400;600;700;800;900&display=swap");
@font-face {
font-family: Cera Pro;
font-display: swap;
src: url(//www.mazuvo.ch/wp-content/themes/mazuvo_neu/fonts/Cera-Pro-Light.ttf);
font-weight: 300;
}
@font-face {
font-family: Cera Pro;
font-display: swap;
src: url(//www.mazuvo.ch/wp-content/themes/mazuvo_neu/fonts/Cera-Pro-Medium.ttf);
font-weight: 400;
}
html, body {
font-size: 16px;
scroll-behavior: smooth;
}
@media screen and (max-width: 700px) {
html, body {
font-size: 13px;
}
}
@media screen and (min-width: 2000px) {
html, body {
font-size: 19px;
}
}
body {
font-family: "Nunito", sans-serif;
color: #3b3b3b;
overflow-x: hidden;
font-weight: 300;
}
h1 {
text-transform: uppercase;
font-weight: 300;
}
h2 {
margin-bottom: 2rem;
text-transform: uppercase;
font-weight: 300;
}
h3 {
font-weight: 300;
}
.file-section-heading {
font-weight: 300;
}
.file-section-heading:not(:first-child) {
margin-top: 1.8rem;
}
p {
font-size: 1.2rem;
}
a:focus {
outline: none;
color: white;
}
ul {
text-align: center;
}
ul li {
font-size: 1.2rem;
}
.text-sm * {
font-size: 1em;
}
.container a, .container a > span {
color: rgba(212, 87, 7, 0.77);
position: relative;
text-decoration: none;
padding-bottom: 3px;
}
.container a:before, .container a:after, .container a > span:before, .container a > span:after {
content: "";
position: absolute;
transition: transform 0.3s ease;
}
.container a:before, .container a > span:before {
left: 0;
bottom: 0;
width: 100%;
height: 2px;
background: rgba(212, 87, 7, 0.77);
transform: scaleX(0);
}
.container a:hover, .container a > span:hover {
color: rgba(212, 87, 7, 0.77);
text-decoration: none;
}
.container a:hover::before, .container a > span:hover::before {
transform: scaleX(1);
}
.container {
text-align: center;
}
@media (min-width: 1200px) {
.container {
max-width: 1500px;
}
}
@media (min-width: 1600px) {
.container {
width: auto;
max-width: 80%;
}
}
#masthead {
height: 60vh;
position: relative;
margin-bottom: 3rem;
}
#masthead .header-slider {
height: 100%;
}
#masthead .header-slider .background-image {
height: 100%;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
height: 60vh;
}
#masthead .bar {
background-color: rgba(99, 102, 106, 0.77);
height: 10vh;
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding-left: 1rem;
padding-right: 1rem;
display: flex;
align-items: center;
justify-content: space-between;
}
#masthead .bar .logo {
z-index: 99;
height: 70%;
}
#masthead .bar .logo img {
height: 100%;
}
#masthead .bar span {
display: block;
background: white;
border-radius: 2px;
}
#masthead .bar #menu-toggle {
width: 100px;
height: 100px;
position: relative;
cursor: pointer;
border-radius: 5px;
z-index: 99;
}
#masthead .bar #menu-toggle * {
transition: 0.25s ease-in-out;
}
#masthead .bar #menu-toggle #hamburger {
position: absolute;
height: 100%;
width: 100%;
}
#masthead .bar #menu-toggle #hamburger span {
width: 60px;
height: 4px;
position: relative;
top: 24px;
left: 20px;
margin: 10px 0;
}
#masthead .bar #menu-toggle #hamburger span:nth-child(1) {
transition-delay: 0.5s;
}
#masthead .bar #menu-toggle #hamburger span:nth-child(2) {
transition-delay: 0.625s;
}
#masthead .bar #menu-toggle #hamburger span:nth-child(3) {
transition-delay: 0.75s;
}
#masthead .bar #menu-toggle #cross {
position: absolute;
height: 100%;
width: 100%;
transform: rotate(45deg);
}
#masthead .bar #menu-toggle #cross span:nth-child(1) {
height: 0%;
width: 4px;
position: absolute;
top: 10%;
left: 48px;
transition-delay: 0s;
}
#masthead .bar #menu-toggle #cross span:nth-child(2) {
width: 0%;
height: 4px;
position: absolute;
left: 10%;
top: 48px;
transition-delay: 0.25s;
}
#masthead .bar #menu-toggle.open #hamburger span {
width: 0%;
}
#masthead .bar #menu-toggle.open #hamburger span:nth-child(1) {
transition-delay: 0s;
}
#masthead .bar #menu-toggle.open #hamburger span:nth-child(2) {
transition-delay: 0.125s;
}
#masthead .bar #menu-toggle.open #hamburger span:nth-child(3) {
transition-delay: 0.25s;
}
#masthead .bar #menu-toggle.open #cross span:nth-child(1) {
height: 80%;
transition-delay: 0.625s;
}
#masthead .bar #menu-toggle.open #cross span:nth-child(2) {
width: 80%;
transition-delay: 0.375s;
}
#masthead .bar, #masthead .bar-holder {
background-color: rgba(99, 102, 106, 0.77);
height: 10vh;
position: absolute;
bottom: 0;
left: 0;
right: 0;
padding-left: 1rem;
padding-right: 1rem;
display: flex;
align-items: center;
justify-content: space-between;
}
#masthead .bar .logo, #masthead .bar-holder .logo {
height: 70%;
}
#masthead .bar .logo img, #masthead .bar-holder .logo img {
height: 100%;
}
#masthead .bar span, #masthead .bar-holder span {
display: block;
background: white;
border-radius: 2px;
}
#masthead .bar #menu-toggle, #masthead .bar-holder #menu-toggle {
width: 100px;
height: 100px;
position: relative;
cursor: pointer;
border-radius: 5px;
}
#masthead .bar #menu-toggle *, #masthead .bar-holder #menu-toggle * {
transition: 0.25s ease-in-out;
}
#masthead .bar #menu-toggle #hamburger, #masthead .bar-holder #menu-toggle #hamburger {
position: absolute;
height: 100%;
width: 100%;
}
#masthead .bar #menu-toggle #hamburger span, #masthead .bar-holder #menu-toggle #hamburger span {
width: 60px;
height: 4px;
position: relative;
top: 24px;
left: 20px;
margin: 10px 0;
}
#masthead .bar #menu-toggle #hamburger span:nth-child(1), #masthead .bar-holder #menu-toggle #hamburger span:nth-child(1) {
transition-delay: 0.5s;
}
#masthead .bar #menu-toggle #hamburger span:nth-child(2), #masthead .bar-holder #menu-toggle #hamburger span:nth-child(2) {
transition-delay: 0.625s;
}
#masthead .bar #menu-toggle #hamburger span:nth-child(3), #masthead .bar-holder #menu-toggle #hamburger span:nth-child(3) {
transition-delay: 0.75s;
}
#masthead .bar #menu-toggle #cross, #masthead .bar-holder #menu-toggle #cross {
position: absolute;
height: 100%;
width: 100%;
transform: rotate(45deg);
}
#masthead .bar #menu-toggle #cross span:nth-child(1), #masthead .bar-holder #menu-toggle #cross span:nth-child(1) {
height: 0%;
width: 4px;
position: absolute;
top: 10%;
left: 48px;
transition-delay: 0s;
}
#masthead .bar #menu-toggle #cross span:nth-child(2), #masthead .bar-holder #menu-toggle #cross span:nth-child(2) {
width: 0%;
height: 4px;
position: absolute;
left: 10%;
top: 48px;
transition-delay: 0.25s;
}
#masthead .bar #menu-toggle.open #hamburger span, #masthead .bar-holder #menu-toggle.open #hamburger span {
width: 0%;
}
#masthead .bar #menu-toggle.open #hamburger span:nth-child(1), #masthead .bar-holder #menu-toggle.open #hamburger span:nth-child(1) {
transition-delay: 0s;
}
#masthead .bar #menu-toggle.open #hamburger span:nth-child(2), #masthead .bar-holder #menu-toggle.open #hamburger span:nth-child(2) {
transition-delay: 0.125s;
}
#masthead .bar #menu-toggle.open #hamburger span:nth-child(3), #masthead .bar-holder #menu-toggle.open #hamburger span:nth-child(3) {
transition-delay: 0.25s;
}
#masthead .bar #menu-toggle.open #cross span:nth-child(1), #masthead .bar-holder #menu-toggle.open #cross span:nth-child(1) {
height: 80%;
transition-delay: 0.625s;
}
#masthead .bar #menu-toggle.open #cross span:nth-child(2), #masthead .bar-holder #menu-toggle.open #cross span:nth-child(2) {
width: 80%;
transition-delay: 0.375s;
}
#masthead .bar.sticky, #masthead .bar-holder.sticky {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 5000;
}
#masthead .bar-holder {
background-color: transparent;
}
#main_menu {
position: absolute;
bottom: 10vh;
width: 100%;
height: 0;
background-color: rgba(0, 0, 0, 0.77);
color: white;
transition: 0.5s ease-in-out;
z-index: 10;
pointer-events: none;
}
a {
color: white;
}
a:hover {
color: white;
text-decoration: underline;
}
.bar-top {
display: flex;
justify-content: space-between;
position: absolute;
left: 1rem;
right: 1rem;
top: 1rem;
transition: 0.3s ease;
opacity: 0;
}
.bar-top .left a {
margin-left: 1rem;
text-decoration: underline;
}
.bar-top .right {
display: flex;
}
.bar-top .right a:first-of-type::after {
content: "|";
margin-right: 0.5rem;
margin-left: 0.5rem;
}
@media screen and (max-width: 700px) {
.bar-top {
flex-direction: column;
}
}
.wp-block-media-text {
grid-gap: 1rem;
}
.wp-block-media-text .wp-block-media-text__content {
padding: 0;
}
@media (max-width: 600px) {
.wp-block-media-text.has-media-on-the-right {
grid-template-areas: "media-text-content" "media-text-media";
grid-template-columns: 1fr;
}
}
.line-1 {
position: absolute;
top: 50%;
width: 100%;
transform: translateY(-50%);
transition: 0.3s ease;
opacity: 0;
}
.line-1 ul, .line-1 li, .line-1 a {
display: block;
padding: 0;
margin: 0;
list-style: none;
}
.line-1 .menu {
display: flex;
justify-content: space-around;
}
.line-1 .menu li a:first-of-type {
font-weight: 700;
}
.line-1 .menu > li .sub-menu {
display: block;
}
.line-1 .menu > li .sub-menu li a {
font-weight: 300 !important;
}
@media screen and (max-width: 700px) {
.line-1 .menu {
flex-direction: column;
font-size: 1.25rem;
}
.line-1 .menu > li .sub-menu {
display: none;
}
.line-1 .menu > li .sub-menu a {
padding: 0.5rem;
}
.line-1 .menu > li > a {
padding: 1rem;
}
.line-1 .menu li a {
text-align: center;
text-decoration: none;
}
.line-1 .menu .menu-item-has-children {
position: relative;
}
.line-1 .menu .menu-item-has-children .toggle {
display: block !important;
position: absolute;
right: 0;
top: 0;
width: 4rem;
height: 4rem;
}
.line-1 .menu .menu-item-has-children .toggle::after {
position: absolute;
width: 1rem;
height: 1rem;
content: "";
top: 35%;
left: 50%;
border-right: 1px solid white;
border-bottom: 1px solid white;
transform: translate(-50%, -50%) rotate(45deg);
transition: 0.3s ease;
}
.line-1 .menu .menu-item-has-children.open .toggle::after {
transform: translate(-50%, -50%) rotate(225deg);
}
}
#sub-navigation {
position: fixed;
top: 0;
z-index: 10;
right: 0;
opacity: 1;
transition: 0.3s ease;
}
#sub-navigation a {
display: block;
background-color: rgba(99, 102, 106, 0.77);
color: white;
margin-bottom: 0.25rem;
text-align: center;
min-width: 150px;
padding: 0.25rem;
pointer-events: auto;
}
body.menu_open #main_menu {
height: 50vh;
pointer-events: auto;
}
body.menu_open #main_menu .line-1 {
opacity: 1;
}
body.menu_open #main_menu .bar-top {
opacity: 1;
}
body.menu_open #sub-navigation {
opacity: 0;
}
body.menu_over_screen #main_menu {
position: fixed;
top: 10vh;
}
body.menu_over_screen #sub-navigation {
opacity: 0;
}
body.menu_over_screen.menu_open #main_menu {
height: 100vh;
}
body.menu_open.menu_over_screen header > .bar {
position: fixed !important;
top: 0 !important;
left: 0 !important;
width: 100%;
z-index: 5000;
}
@media screen and (max-width: 700px) {
body.menu_open #masthead {
height: 80vh;
}
body.menu_open #masthead .background-img {
height: 80vh;
}
body.menu_open #main_menu {
height: 70vh;
}
}
.front-page #masthead .bar, .kein-menu #masthead .bar {
justify-content: center;
}
.front-page #masthead .bar #menu-toggle, .kein-menu #masthead .bar #menu-toggle {
display: none;
}
.infos {
font-size: 1.2rem;
}
.single-produkt .orange {
color: rgba(212, 87, 7, 0.77);
font-weight: 700;
}
.single-produkt .infos {
text-transform: uppercase;
text-align: left;
font-weight: 200;
font-size: 1.25rem;
}
.single-produkt .infos .label-warning {
background-color: #ff9f28;
padding: 0.15rem 1rem;
color: white;
font-weight: 400;
}
.single-produkt .infos .label-danger {
background-color: #b5201b;
padding: 0.15rem 1rem;
color: white;
font-weight: 400;
}
.single-produkt .infos .label-success {
background-color: #8eff20;
padding: 0.15rem 1rem;
color: white;
font-weight: 400;
}
.single-produkt .produkt-galerie .bild {
height: 100%;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
background-size: contain;
padding-bottom: 70%;
height: auto;
border: solid 1px rgba(99, 102, 106, 0.77);
}
.single-produkt .share-buttons {
text-align: center !important;
}
footer {
margin-top: 5rem;
background-color: rgba(99, 102, 106, 0.77);
color: white !important;
text-align: center;
}
footer > .container {
padding-top: 2rem;
}
footer a {
padding-bottom: 0;
color: white !important;
}
footer a::before {
display: none;
}
footer a:hover {
color: white !important;
}
footer .ueberschrift {
font-size: 3rem;
line-height: 4rem;
margin-bottom: 1rem;
}
footer .links {
display: flex;
flex-direction: column;
margin-bottom: 1rem;
}
footer .links a {
font-size: 2rem;
}
footer .kontakt p {
margin-bottom: 0;
}
.iframe-3d .title {
font-size: 2rem;
color: white;
padding: 1rem 0;
background-color: rgba(99, 102, 106, 0.77);
}
.iframe-3d iframe {
width: 100%;
height: 550px;
}
.iframe-3d .anchor {
position: relative;
}
.iframe-3d .anchor .target {
position: absolute;
top: -10rem;
}
.page-cover {
position: fixed;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.65);
z-index: 99;
top: 0;
left: 0;
}
.page-cover.light {
background-color: rgba(0, 0, 0, 0.7);
}  @-moz-keyframes rotate-loading {
0% {
transform: rotate(0deg);
-ms-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
-moz-transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
-ms-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-moz-transform: rotate(360deg);
}
}
@-o-keyframes rotate-loading {
0% {
transform: rotate(0deg);
-ms-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
-moz-transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
-ms-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-moz-transform: rotate(360deg);
}
}
@-webkit-keyframes rotate-loading {
0% {
transform: rotate(0deg);
-ms-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
-moz-transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
-ms-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-moz-transform: rotate(360deg);
}
}
@keyframes rotate-loading {
0% {
transform: rotate(0deg);
-ms-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
-o-transform: rotate(0deg);
-moz-transform: rotate(0deg);
}
100% {
transform: rotate(360deg);
-ms-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-o-transform: rotate(360deg);
-moz-transform: rotate(360deg);
}
}
@-moz-keyframes loading-text-opacity {
0% {
opacity: 0;
}
20% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@-o-keyframes loading-text-opacity {
0% {
opacity: 0;
}
20% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@-webkit-keyframes loading-text-opacity {
0% {
opacity: 0;
}
20% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes loading-text-opacity {
0% {
opacity: 0;
}
20% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}
.loading-container,
.loading {
height: 100px;
position: relative;
width: 100px;
border-radius: 100%;
}
.loading-container .loading-smaller,
.loading .loading-smaller {
height: 60px;
width: 60px;
border-radius: 100%;
border: 2px solid transparent;
border-color: transparent #fff transparent #FFF;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%) rotate(-50deg);
}
.loading-container {
margin: 160px auto;
}
.loading {
border: 2px solid transparent;
border-color: transparent #fff transparent #FFF;
-moz-animation: rotate-loading 1.5s linear 0s infinite normal;
-moz-transform-origin: 50% 50%;
-o-animation: rotate-loading 1.5s linear 0s infinite normal;
-o-transform-origin: 50% 50%;
-webkit-animation: rotate-loading 1.5s linear 0s infinite normal;
-webkit-transform-origin: 50% 50%;
animation: rotate-loading 1.5s linear 0s infinite normal;
transform-origin: 50% 50%;
}
.loading-container .loading {
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
#loading-text {
-moz-animation: loading-text-opacity 2s linear 0s infinite normal;
-o-animation: loading-text-opacity 2s linear 0s infinite normal;
-webkit-animation: loading-text-opacity 2s linear 0s infinite normal;
animation: loading-text-opacity 2s linear 0s infinite normal;
color: #ffffff;
font-family: "Nunito", sans-serif;
font-size: 10px;
font-weight: bold;
margin-top: 45px;
opacity: 0;
position: absolute;
text-align: center;
text-transform: uppercase;
top: 0;
width: 100px;
}
.alignleft {
float: left;
}
.fancybox-container {
z-index: 999999992 !important;
}
.single-marke .container p {
text-align: left;
}
.single-marke .container .reihe {
display: flex;
flex-direction: row;
justify-content: space-between;
}
.single-marke .container .reihe .links {
width: 45%;
}
.single-marke .container .reihe .links .messen {
margin-top: 1rem;
padding: 0.5rem;
border: rgba(99, 102, 106, 0.77) solid 1px;
max-width: 600px;
}
.single-marke .container .reihe .links .messen > a {
display: block;
width: fit-content;
}
.single-marke .container .reihe .links .messen .titel {
font-size: 1.25rem;
}
.single-marke .container .reihe .links .messen .modal .modal-dialog {
max-width: 800px;
}
.single-marke .container .reihe .links .messen .modal .modal-dialog .modal-content {
border: none;
border-radius: 0;
}
.single-marke .container .reihe .links .messen .modal .modal-dialog .modal-content .modal-header, .single-marke .container .reihe .links .messen .modal .modal-dialog .modal-content .modal-footer, .single-marke .container .reihe .links .messen .modal .modal-dialog .modal-content .modal-body {
border: none;
}
.single-marke .container .reihe .links .messen .modal .modal-galerie {
width: 100% !important;
}
.single-marke .container .reihe .links .messen .modal .modal-galerie .custom-arrow {
position: absolute;
top: 50%;
background-color: #292b2c;
color: white;
transform: translateY(-50%);
z-index: 1;
padding: 5px 10px;
opacity: 0.6;
cursor: pointer;
transition: 0.3s ease;
}
.single-marke .container .reihe .links .messen .modal .modal-galerie .custom-arrow.custom-arrow-left {
left: 0;
transition: 0.3s ease;
}
.single-marke .container .reihe .links .messen .modal .modal-galerie .custom-arrow.custom-arrow-right {
right: 0;
transition: 0.3s ease;
}
.single-marke .container .reihe .links .messen .modal .modal-galerie .custom-arrow:hover {
opacity: 1;
}
.single-marke .container .reihe .links .messen .modal .modal-galerie .custom-arrow:hover.custom-arrow-left {
left: 5px;
}
.single-marke .container .reihe .links .messen .modal .modal-galerie .custom-arrow:hover.custom-arrow-right {
right: 5px;
}
.single-marke .container .reihe .links .messen .modal .modal-galerie a {
padding-bottom: 0;
padding-bottom: 0;
}
.single-marke .container .reihe .links .messen .modal .modal-galerie a::before {
display: none;
}
.single-marke .container .reihe .links .messen .modal .modal-galerie a::after {
display: none;
}
.single-marke .container .reihe .links .messen .modal .modal-galerie .bg-img {
height: 100%;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
background-size: contain;
height: auto;
padding-bottom: 75%;
}
.single-marke .container .reihe .galerie {
width: 45%;
}
.single-marke .container .reihe .galerie a {
padding-bottom: 0;
padding-bottom: 0;
}
.single-marke .container .reihe .galerie a::before {
display: none;
}
.single-marke .container .reihe .galerie a::after {
display: none;
}
.single-marke .container .reihe .galerie .background-img {
height: 100%;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
height: auto;
padding-bottom: 75%;
}
@media screen and (max-width: 600px) {
.single-marke .container .reihe {
flex-wrap: wrap;
}
.single-marke .container .reihe .galerie {
width: 100%;
}
.single-marke .container .reihe .links {
width: 100%;
}
}
.single-marke .marken-reihe {
display: flex;
}
.single-marke .marken-reihe .video {
padding-left: 0.5rem;
}
@media screen and (max-width: 1000px) {
.single-marke .marken-reihe {
flex-direction: column;
}
.single-marke .marken-reihe .video {
padding: 0.5rem 0;
}
.single-marke .marken-reihe .video video {
max-width: 100%;
}
}
.single-post .bildgalerie {
width: 60%;
margin-left: auto;
margin-right: auto;
}
.single-post .bildgalerie .bild {
height: 100%;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
height: auto;
padding-bottom: 75%;
}
@media screen and (max-width: 700px) {
.single-post .bildgalerie {
width: 100%;
}
}
.share {
margin-top: 2rem;
}
.socials {
background-color: rgba(212, 87, 7, 0.77);
display: flex;
flex-direction: row;
justify-content: space-evenly;
width: fit-content;
padding: 0.35rem;
margin-left: auto;
margin-right: auto;
}
.socials a {
padding-bottom: 0;
}
.socials a::before {
display: none;
}
.socials img {
height: 2rem;
margin: 0 0.75rem;
}
#dokumente-links .downloads {
width: fit-content;
}
#dokumente-links .downloads a {
display: block;
text-transform: uppercase;
background-color: rgba(212, 87, 7, 0.77);
color: white;
padding-bottom: 0;
padding: 0.5rem 2rem;
margin-bottom: 0.5rem;
}
#dokumente-links .downloads a::before {
display: none;
}
.page-template-default #dokumente-links .downloads {
margin-left: auto;
margin-right: auto;
}
.h2-anchor {
position: absolute;
top: -8rem;
}
.selectize-dropdown {
line-height: 1.3;
}
.selectize-dropdown .option {
display: none !important;
}
.selectize-dropdown .option[data-selectable] {
display: block !important;
}
.selectize-control .selectize-input {
border: none;
box-shadow: none;
background-color: transparent; }
.selectize-control .selectize-input .item {
line-height: 1.3;
}
.menu-footer .menu {
list-style-type: none;
display: flex;
justify-content: center;
margin-bottom: 0;
padding: 2rem 0;
}
.menu-footer .menu li::after {
content: "|";
padding-left: 0.5rem;
padding-right: 0.5rem;
}
.menu-footer .menu li:last-of-type::after {
display: none;
}
.menu-footer .menu li a {
color: white;
}
.menu-footer .menu li a:hover {
color: white;
}
.referenz-slider {
margin: 2rem auto;
width: 100%;
max-width: 900px;
position: relative;
}
.referenz-slider .custom-arrow {
position: absolute;
top: 50%;
background-color: #292b2c;
color: white;
transform: translateY(-50%);
z-index: 1;
padding: 5px 10px;
opacity: 0.6;
cursor: pointer;
transition: 0.3s ease;
}
.referenz-slider .custom-arrow.custom-arrow-left {
left: 0;
transition: 0.3s ease;
}
.referenz-slider .custom-arrow.custom-arrow-right {
right: 0;
transition: 0.3s ease;
}
.referenz-slider .custom-arrow:hover {
opacity: 1;
}
.referenz-slider .custom-arrow:hover.custom-arrow-left {
left: 5px;
}
.referenz-slider .custom-arrow:hover.custom-arrow-right {
right: 5px;
}
.referenz-slider .slide {
display: block;
background-position: center;
background-size: cover;
padding-bottom: 50%;
}
.referenz-slider .slide::after, .referenz-slider .slide::before {
display: none !important;
}
.imported {
position: relative;
}
.imported > .anchor {
position: absolute;
top: -8rem;
}
.go-back {
cursor: pointer;
background-color: #F2F0F0;
color: #3b3b3b;
border: solid 1px #3b3b3b;
padding-bottom: 0;
padding: 0.5rem 1.7rem;
display: inline-block;
color: #3b3b3b !important;
line-height: 1.5;
padding: 0.5rem 1.7rem !important;
}
.go-back::before {
display: none;
}
.go-back:hover {
color: #3b3b3b;
text-decoration: none;
}
.wp-block-media-text {
align-items: normal;
}
.wp-block-media-text p {
text-align: left;
}
.single-komm_brand .galerie .background-img {
background-color: #F2F0F0;
}
.kp-loader {
opacity: 0;
transition: 0.3s ease;
}
.kp-loading + .kp-loader {
opacity: 1;
}
.lds-facebook {
display: inline-block;
position: relative;
width: 64px;
height: 64px;
}
.lds-facebook div {
display: inline-block;
position: absolute;
left: 6px;
width: 13px;
background: rgba(59, 59, 59, 0.5);
animation: lds-facebook 1.2s cubic-bezier(0, 0.5, 0.5, 1) infinite;
}
.lds-facebook div:nth-child(1) {
left: 6px;
animation-delay: -0.24s;
}
.lds-facebook div:nth-child(2) {
left: 26px;
animation-delay: -0.12s;
}
.lds-facebook div:nth-child(3) {
left: 45px;
animation-delay: 0s;
}
@keyframes lds-facebook {
0% {
top: 6px;
height: 51px;
}
50%, 100% {
top: 19px;
height: 26px;
}
}
.mce-content-body a {
color: blue;
}
p::after {
content: "";
clear: both;
display: block;
}
.modal {
z-index: 1000000;
}
@media (min-width: 576px) {
.modal-dialog {
margin: 100px auto 30px auto;
}
}
#kp_frontpage_notice a {
color: rgb(212, 87, 7) !important;
}
.slick-dots {
list-style: none;
padding: 0;
display: flex;
justify-content: center;
padding: 1rem 0;
overflow: hidden;
}
.slick-dots li {
display: block;
padding: 0 0.25rem;
height: 25px;
display: flex;
flex-direction: column;
justify-content: flex-end;
}
.slick-dots li button {
font-size: 0;
color: transparent;
width: 4px;
height: 20px;
background-color: rgba(99, 102, 106, 0.27);
cursor: pointer;
display: block;
transition: 0.3s ease;
border: none !important;
outline: none !important;
}
.slick-dots li.slick-active button {
background-color: rgba(99, 102, 106, 0.77);
height: 100%;
}
#kp_frontpage_notice_trigger {
position: fixed;
right: 0.5rem;
top: 200px;
color: white;
border: none !important;
outline: none !important;
box-shadow: none !important;
display: flex;
font-size: 20px;
z-index: 100;
cursor: pointer;
background-color: transparent;
top: auto;
bottom: 30px;
}
#kp_frontpage_notice_trigger .label {
font-size: 2rem;
overflow: hidden;
transform: scaleX(0);
height: 4rem;
display: flex;
justify-content: center;
align-items: center;
padding: 0 0.5em;
padding-left: 1em;
transition: 0.3s transform 0.2s, 0.2s color;
color: transparent;
transform-origin: 100% 50%;
background-color: rgba(99, 102, 106, 0.77);
}
#kp_frontpage_notice_trigger .icon {
font-size: 30px;
width: 4rem;
height: 4rem;
display: flex;
justify-content: center;
align-items: center;
position: relative;
background-color: rgba(99, 102, 106, 0.77);
}
#kp_frontpage_notice_trigger .icon::before {
width: 2.5rem;
height: 2.5rem;
border-radius: 50%;
content: "!";
display: flex;
justify-content: center;
align-items: center;
background-color: white;
font-size: 2rem;
color: black;
}
#kp_frontpage_notice_trigger:hover .label, #kp_frontpage_notice_trigger.hover .label {
transform: scaleX(1);
color: white;
transition: 0.3s transform, 0.2s color 0.3s;
}
.hidden_anchor {
position: relative;
top: -9rem;
}
body.hygn-landing {
font-family: "Cera Pro", sans-serif;
text-align: center;
}
body.hygn-landing h1, body.hygn-landing h2 {
font-weight: 400;
text-transform: none;
color: #54655F;
}
body.hygn-landing h1 {
font-size: 3rem;
margin-bottom: 1rem;
}
body.hygn-landing h2 {
font-size: 2.5rem;
margin-bottom: 1rem;
}
body.hygn-landing #fancybox-container-1, body.hygn-landing .fancybox-container {
display: none !important;
}
body.hygn-landing #masthead {
position: relative;
height: auto;
}
body.hygn-landing #masthead nav {
display: flex;
justify-content: space-between;
padding: 2rem 0;
width: 85%;
margin: 0 auto;
}
body.hygn-landing #masthead nav .logo {
height: 3rem;
display: block;
}
body.hygn-landing #masthead nav .logo img {
height: 100%;
}
body.hygn-landing #masthead video {
height: auto;
width: 85%;
margin: 0 auto;
}
body.hygn-landing #masthead .overlay {
position: absolute;
left: 0;
bottom: -15vh;
height: 65vh;
z-index: 1;
width: 65vh;
pointer-events: none;
}
body.hygn-landing #masthead .overlay .text {
position: absolute;
top: 50%;
left: 50%;
z-index: 12;
transform: translate(-72%, -37%) rotate(-11deg);
color: white;
font-weight: 400;
width: 75%;
pointer-events: auto;
}
body.hygn-landing #masthead .overlay .text p {
margin-bottom: 0;
font-size: 3rem;
line-height: 1.3;
}
body.hygn-landing #masthead .overlay .text a {
display: table;
border-bottom: 2px solid white;
margin: 0 auto;
padding: 0 0.75rem;
}
body.hygn-landing #masthead .overlay .text a:hover {
text-decoration: none;
}
body.hygn-landing #masthead .overlay svg {
height: 100%;
position: absolute;
left: 0;
bottom: 0;
opacity: 0.8;
}
body.hygn-landing #masthead .overlay svg polygon {
fill: #7c8a85;
}
@media screen and (max-height: 780px) {
body.hygn-landing #masthead .overlay {
height: 80vh;
width: 80vh;
}
body.hygn-landing #masthead .overlay .text {
left: 55%;
}
body.hygn-landing #masthead .overlay .text p {
font-size: 2.5rem;
}
}
@media screen and (max-width: 750px) {
body.hygn-landing #masthead {
margin-bottom: 6rem;
}
body.hygn-landing #masthead video {
width: 100%;
}
body.hygn-landing #masthead .overlay {
height: 45vh;
width: 45vh;
}
body.hygn-landing #masthead .overlay .text {
width: 70%;
}
body.hygn-landing #masthead .overlay .text p {
font-size: 1.5rem;
}
}
body.hygn-landing #cta-button {
position: fixed;
right: -100%;
top: 20rem;
width: 15rem;
height: 13rem;
display: block;
transform: rotate(-25deg) scale(1);
transition: 1s ease-in-out all;
z-index: 20;
color: white !important;
}
body.hygn-landing #cta-button svg {
position: absolute;
top: 0;
left: 0;
opacity: 0.8;
height: 100%;
width: 100%;
}
body.hygn-landing #cta-button svg polygon {
fill: #7c8a85;
transition: 0.4s ease-in-out all;
}
body.hygn-landing #cta-button .text {
position: absolute;
top: 50%;
z-index: 1;
left: 50%;
transform: translate(-50%, -50%);
font-size: 2.5rem;
font-weight: 400;
line-height: 1.2;
}
body.hygn-landing #cta-button.show {
right: -1rem;
}
body.hygn-landing #cta-button:hover {
transform: rotate(-15deg) scale(1.1);
}
body.hygn-landing #cta-button:hover svg polygon {
fill: #54655F;
}
@media screen and (max-width: 750px) {
body.hygn-landing #cta-button {
width: 10.5rem;
height: 9rem;
}
body.hygn-landing #cta-button .text {
font-size: 1.5rem;
}
}
body.hygn-landing #main > p, body.hygn-landing #main .wp-block-button {
position: relative;
margin-left: auto;
margin-right: auto;
padding-right: 15px;
padding-left: 15px;
}
@media (min-width: 576px) {
body.hygn-landing #main > p, body.hygn-landing #main .wp-block-button {
padding-right: 15px;
padding-left: 15px;
}
}
@media (min-width: 768px) {
body.hygn-landing #main > p, body.hygn-landing #main .wp-block-button {
padding-right: 15px;
padding-left: 15px;
}
}
@media (min-width: 992px) {
body.hygn-landing #main > p, body.hygn-landing #main .wp-block-button {
padding-right: 15px;
padding-left: 15px;
}
}
@media (min-width: 1200px) {
body.hygn-landing #main > p, body.hygn-landing #main .wp-block-button {
padding-right: 15px;
padding-left: 15px;
}
}
@media (min-width: 576px) {
body.hygn-landing #main > p, body.hygn-landing #main .wp-block-button {
width: 540px;
max-width: 100%;
}
}
@media (min-width: 768px) {
body.hygn-landing #main > p, body.hygn-landing #main .wp-block-button {
width: 720px;
max-width: 100%;
}
}
@media (min-width: 992px) {
body.hygn-landing #main > p, body.hygn-landing #main .wp-block-button {
width: 960px;
max-width: 100%;
}
}
@media (min-width: 1200px) {
body.hygn-landing #main > p, body.hygn-landing #main .wp-block-button {
width: 1140px;
max-width: 100%;
}
}
@media screen and (min-width: 1600px) {
body.hygn-landing #main > p, body.hygn-landing #main .wp-block-button {
max-width: 80%;
width: auto;
}
}
body.hygn-landing #main > p a {
position: relative;
padding-bottom: 3px;
}
body.hygn-landing #main > p a:before, body.hygn-landing #main > p a:after {
content: "";
position: absolute;
transition: transform 0.3s ease;
}
body.hygn-landing #main > p a:before {
left: 0;
bottom: 0;
width: 100%;
height: 2px;
background: #7c8a85;
transform: scaleX(0);
}
body.hygn-landing #main > p a:hover {
color: #7c8a85;
text-decoration: none;
}
body.hygn-landing #main > p a:hover::before {
transform: scaleX(1);
}
body.hygn-landing #main p.nav-links {
font-size: 1.5rem;
}
body.hygn-landing #main a {
color: #7c8a85;
}
body.hygn-landing #main a::before {
background: #7c8a85;
}
body.hygn-landing #kontakt {
background-color: transparent;
z-index: 21;
position: relative;
}
body.hygn-landing #kontakt h2 {
color: white;
}
body.hygn-landing #kontakt svg {
height: 8rem;
width: 100%;
margin-bottom: -0.46rem;
}
body.hygn-landing #kontakt svg polygon {
fill: #7c8a85;
}
body.hygn-landing #kontakt .content {
background-color: #7c8a85;
padding-bottom: 8rem;
position: relative;
}
body.hygn-landing #kontakt .content .text {
margin-top: 1rem;
font-size: 0.8rem;
line-height: 1.4;
margin-bottom: 2rem;
}
body.hygn-landing #kontakt .content .menu {
height: 10rem;
position: absolute;
bottom: 0;
right: 0;
width: 100%;
}
body.hygn-landing #kontakt .content .menu .text {
position: absolute;
z-index: 1234;
top: 57%;
margin-top: 0 !important;
right: 1rem;
}
body.hygn-landing #kontakt .content .menu .text ul {
list-style-type: none;
padding: 0;
margin: 0;
display: flex;
}
body.hygn-landing #kontakt .content .menu .text ul li {
color: #3b3b3b !important;
}
body.hygn-landing #kontakt .content .menu .text ul li a {
color: #3b3b3b !important;
}
body.hygn-landing #kontakt .content .menu .text ul li::after {
content: "|";
padding-left: 0.3rem;
padding-right: 0.5rem;
}
body.hygn-landing #kontakt .content .menu .text ul li:last-of-type::after {
display: none;
}
body.hygn-landing #kontakt .content svg {
margin-bottom: 0;
position: absolute;
bottom: 0;
z-index: 123;
right: 0;
height: 100%;
}
body.hygn-landing #kontakt .content svg polygon {
fill: white;
}
@media screen and (min-width: 1340px) {
body.hygn-landing #kontakt .content svg.desktop-svg {
display: block;
}
body.hygn-landing #kontakt .content svg.mobile-svg {
display: none;
}
}
@media screen and (max-width: 1340px) {
body.hygn-landing #kontakt .content svg.desktop-svg {
display: none;
}
body.hygn-landing #kontakt .content svg.mobile-svg {
display: block;
}
}
@media screen and (max-width: 550px) {
body.hygn-landing #kontakt .content .menu {
height: 6rem;
background-color: white;
}
body.hygn-landing #kontakt .content .menu .text {
top: 50%;
transform: translateY(-50%);
}
}
body.hygn-landing #kontakt form .reihe {
display: flex;
flex-wrap: wrap;
}
body.hygn-landing #kontakt form .reihe .input-group {
flex: 1;
border: 2px solid white;
margin: 0.5rem;
padding: 0.5rem;
position: relative;
min-height: 4rem;
}
body.hygn-landing #kontakt form .reihe .input-group label {
font-size: 1.5rem;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
transition: 0.4s ease all;
width: 100%;
}
body.hygn-landing #kontakt form .reihe .input-group label.open {
top: 0.2rem;
font-size: 0.6rem;
transform: translate(-50%, 0%);
}
body.hygn-landing #kontakt form .reihe .input-group .wpcf7-form-control-wrap {
position: absolute;
top: 1rem;
left: 0;
bottom: 0.8rem;
right: 0;
width: 100%;
}
body.hygn-landing #kontakt form .reihe .input-group input, body.hygn-landing #kontakt form .reihe .input-group textarea {
margin-top: 0;
padding: 1px;
background-color: transparent;
border: none;
text-align: center;
color: white;
font-family: "Cera Pro", sans-serif;
font-size: 1.5rem;
font-weight: 300;
}
body.hygn-landing #kontakt form .reihe .input-group input:focus, body.hygn-landing #kontakt form .reihe .input-group textarea:focus {
outline: none;
}
body.hygn-landing #kontakt form .reihe .input-group .wpcf7-form-control {
border: none;
}
body.hygn-landing #kontakt form .reihe .input-group .selectize-control {
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
width: 100%;
padding: 0;
margin: 0;
height: 100%;
}
body.hygn-landing #kontakt form .reihe .input-group .selectize-control .selectize-input {
height: 100%;
background-color: transparent;
font-size: 1.5rem;
color: white;
box-shadow: none;
padding: 1px;
}
body.hygn-landing #kontakt form .reihe .input-group .selectize-control .selectize-input::after {
display: none;
}
body.hygn-landing #kontakt form .reihe .input-group .selectize-control .selectize-input #anrede-selectized {
display: none !important;
}
body.hygn-landing #kontakt form .reihe .input-group .selectize-control .selectize-dropdown {
background-color: white;
}
body.hygn-landing #kontakt form .reihe .input-area {
min-height: 10rem;
}
body.hygn-landing #kontakt form .reihe .input-area textarea {
height: 100%;
}
body.hygn-landing #kontakt form .reihe .input-check {
transition: 0.3s ease all;
cursor: pointer;
}
body.hygn-landing #kontakt form .reihe .input-check .label {
top: 0.2rem;
font-size: 0.6rem;
transform: translate(-50%, 0%);
position: absolute;
left: 50%;
}
body.hygn-landing #kontakt form .reihe .input-check .label-text {
position: absolute;
top: 54%;
left: 50%;
transform: translate(-50%, -50%);
font-size: 1.5rem;
}
body.hygn-landing #kontakt form .reihe .input-check .wpcf7-form-control-wrap {
display: none;
}
body.hygn-landing #kontakt form .reihe .input-check.checked {
background-color: white;
color: #7c8a85;
}
body.hygn-landing #kontakt form .wpcf7-response-output {
background-color: white;
color: #3b3b3b;
}
body.hygn-landing #kontakt form .kp-submit {
border: none;
background-color: transparent;
color: white;
padding: 0.5rem 1.5rem;
font-size: 2rem;
font-weight: 300;
font-family: "Cera Pro", sans-serif;
border-bottom: 2px solid white;
position: relative;
transition: 0.4s ease all;
margin: 1rem auto;
display: table;
width: auto;
}
body.hygn-landing #kontakt form .kp-submit:hover {
border-bottom-color: #54655F;
background-color: #54655F;
}
@media screen and (max-width: 992px) {
body.hygn-landing #kontakt form .input-group {
width: 100%;
flex: auto !important;
}
}
body.hygn-landing #kp_frontpage_notice_trigger {
display: none;
}
body.hygn-landing .wp-block-button {
margin: 2rem 0;
}
body.hygn-landing .wp-block-button a {
background-color: #7c8a85;
color: white !important;
border-radius: 0;
font-size: 2rem;
padding: 0.5rem 1.5rem;
transition: 0.4s ease all;
}
body.hygn-landing .wp-block-button a::after, body.hygn-landing .wp-block-button a::before {
display: none;
}
body.hygn-landing .wp-block-button a:hover {
background-color: #54655F;
text-decoration: none;
}
#offerten-modal form.sent .wpcf7-response-output, #termin-reservieren-modal form.sent .wpcf7-response-output {
display: none !important;
}
form.sent .wpcf7-response-output {
display: none !important;
}
@media screen and (min-width: 1200px) {
body #masthead .bar .logo, body #masthead .bar-holder .logo {
height: auto;
width: 15vw;
}
body #masthead .bar .logo a, body #masthead .bar-holder .logo a {
display: block;
}
body #masthead .bar .logo a img, body #masthead .bar-holder .logo a img {
width: 100%;
}
body #masthead #menu-container {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 100%;
transition: 0.3s ease all;
background-color: rgba(0, 0, 0, 0.77);
opacity: 0;
}
body #masthead #menu-container .top-section {
display: none;
}
body #masthead #menu-container .breadcrumbs {
color: white;
display: block;
position: absolute;
top: 3rem;
left: 3rem;
}
body #masthead #menu-container .links {
display: block;
position: absolute;
top: 2rem;
right: 3rem;
}
body #masthead #menu-container .links a:first-of-type::after {
content: "|";
margin-right: 0.5rem;
margin-left: 0.5rem;
color: white;
}
body #masthead #menu-container .links a:hover {
text-decoration: none;
}
body #masthead #menu-container > div {
display: block;
overflow: hidden;
height: 0;
max-height: 0;
position: absolute;
top: 5rem;
left: 0;
right: 0;
bottom: 0;
padding-left: 3rem;
padding-right: 3rem;
transition: 0s ease all;
}
body #masthead #menu-container > div.show {
height: 90vh;
max-height: 100%;
transition: 0.3s ease all;
}
body #masthead #menu-container > div ul.menu {
display: flex;
list-style-type: none;
justify-content: space-between;
text-align: left;
margin-bottom: 0;
padding-left: 0;
}
body #masthead #menu-container > div ul.menu li {
font-weight: 600;
}
body #masthead #menu-container > div ul.menu li ul.sub-menu {
text-align: left;
list-style-type: none;
margin-bottom: 0;
padding-left: 0;
}
body #masthead #menu-container > div ul.menu li ul.sub-menu li {
font-weight: 300;
}
body #masthead #menu-container.show {
bottom: 10vh;
}
body #masthead #main_menu_new {
position: absolute;
bottom: 0;
left: 0;
right: 0;
top: 0;
opacity: 0;
transition: 0.5s ease all;
}
body #masthead #main_menu_new .menu-links-mobile {
display: none;
}
body #masthead #main_menu_new .top-section {
display: none;
}
body #masthead #main_menu_new > div {
position: absolute;
bottom: 0;
z-index: 1;
width: 100%;
}
body #masthead #main_menu_new > div ul.menu {
padding-left: calc(15vw + 4rem);
text-align: left;
width: 100%;
padding-right: 8rem;
display: flex;
list-style-type: none;
justify-content: space-evenly;
margin-bottom: 0;
height: 10vh;
align-items: center;
}
body #masthead #main_menu_new > div ul.menu li a {
display: flex;
justify-content: center;
align-items: center;
height: 10vh;
padding: 0 1rem;
border-left: 2px solid transparent;
border-right: 2px solid transparent;
text-decoration: none;
position: relative;
}
body #masthead #main_menu_new > div ul.menu li a::before, body #masthead #main_menu_new > div ul.menu li a::after {
content: "";
height: 2px;
width: 100vw;
background-color: white;
position: absolute;
opacity: 0;
}
body #masthead #main_menu_new > div ul.menu li a::before {
right: 100%;
bottom: 100%;
}
body #masthead #main_menu_new > div ul.menu li a::after {
left: 100%;
bottom: 100%;
}
body #masthead #main_menu_new > div ul.menu li a.show {
border-left: 2px solid white;
border-right: 2px solid white;
}
body #masthead #main_menu_new > div ul.menu li a.show::before, body #masthead #main_menu_new > div ul.menu li a.show::after {
opacity: 1;
}
body #masthead #main_menu_new > div ul.menu li a:hover {
text-decoration: none;
}
body #masthead #main_menu_new > div ul.menu li ul.sub-menu {
display: none;
}
body.front-page #masthead .bar {
justify-content: space-between;
}
body.front-page #masthead .bar #menu-toggle {
display: block;
}
body.sub_open #masthead #sub-navigation {
opacity: 0 !important;
}
body.sub_open #masthead #sub-navigation a {
pointer-events: none !important;
}
body.sub_open #masthead #menu-container {
opacity: 1;
}
body.sub_open #search-form {
opacity: 0 !important;
pointer-events: none !important;
}
body.menu_open #masthead #sub-navigation {
opacity: 1;
}
body.menu_open #masthead #sub-navigation a {
pointer-events: auto;
}
body.menu_open #masthead #main_menu_new {
opacity: 1;
pointer-events: all;
}
body.menu_open #search-form {
opacity: 1;
}
}
@media screen and (max-width: 1200px) {
body #masthead {
transition: 0.5s ease all;
}
body #masthead .header-slider .background-image {
transition: 0.5s ease all;
}
body #masthead .bar .logo, body #masthead .bar-holder .logo {
height: auto;
width: 15rem;
}
body #masthead .bar .logo a, body #masthead .bar-holder .logo a {
display: block;
}
body #masthead .bar .logo a img, body #masthead .bar-holder .logo a img {
width: 100%;
}
body #main_menu_new {
position: absolute;
left: 0;
right: 0;
background-color: rgba(0, 0, 0, 0.77);
bottom: 100%;
height: 70vh;
transition: 0.4s ease all;
opacity: 0;
}
body #main_menu_new .menu-links-mobile {
position: absolute;
bottom: 0;
padding: 1rem;
font-size: 1.7rem; width: 100%;
left: 0;
border-bottom: 2px solid white;
}
body #main_menu_new .menu-links-mobile a:not(:last-child)::after {
content: "|";
margin-left: 0.5rem;
margin-right: 0.5rem;
}
body #main_menu_new .menu-links-mobile a:hover {
text-decoration: none;
}
body #main_menu_new .top-section {
color: white;
padding: 1rem;
font-size: 1.7rem;
border-bottom: 2px solid white;
}
body #main_menu_new ul.menu {
list-style-type: none;
padding-left: 0;
margin-bottom: 0;
}
body #main_menu_new ul.menu li a {
padding: 1rem 1rem;
display: block;
position: relative;
text-align: left;
font-size: 1.7rem;
}
body #main_menu_new ul.menu li a::after {
content: ">";
padding-left: 1rem;
}
body #main_menu_new ul.menu li a:hover {
text-decoration: none;
}
body #menu-container {
position: absolute;
left: 100%;
right: -100%;
top: 0;
bottom: 10vh;
background-color: rgba(0, 0, 0, 0.77);
display: none;
overflow-y: auto;
z-index: 12345374834;
}
body #menu-container .top-section {
display: flex;
flex-wrap: wrap;
color: white;
padding: 1rem;
border-bottom: 2px solid white;
font-size: 1.7rem;
font-weight: 600;
}
body #menu-container .top-section .back {
padding-right: 1rem;
display: block;
}
body #menu-container .top-section .all {
width: 90%;
display: none;
}
body #menu-container .breadcrumbs {
display: none;
}
body #menu-container .links {
display: none;
}
body #menu-container > div {
display: none;
}
body #menu-container > div ul.menu {
padding-left: 0;
margin-bottom: 0;
list-style-type: none;
}
body #menu-container > div ul.menu > li {
display: flex;
position: relative;
flex-wrap: wrap;
}
body #menu-container > div ul.menu > li a {
display: block;
width: 90%;
position: relative;
text-align: left;
padding: 1rem;
font-weight: 600;
font-size: 1.7rem;
pointer-events: none;
}
body #menu-container > div ul.menu > li a:hover {
text-decoration: none;
}
body #menu-container > div ul.menu > li .sub-menu {
display: none;
width: 100%;
list-style-type: none;
padding-left: 0;
margin-bottom: 0;
}
body #menu-container > div ul.menu > li .sub-menu li a {
font-weight: 300;
padding: 0.3rem 1rem;
}
body #menu-container > div ul.menu > li .toggle {
width: 10%;
color: white;
display: flex !important;
justify-content: center;
align-items: center;
transform: rotate(0);
transition: 0.5s ease all;
font-size: 1.7rem;
}
body #menu-container > div ul.menu > li.open .toggle {
transform: rotate(180deg);
}
body #menu-container > div.show {
display: block;
}
body.front-page #masthead .bar {
justify-content: space-between;
z-index: 12345374834;
}
body.front-page #masthead .bar #menu-toggle {
display: block;
}
body.sub_open #main_menu_new {
left: -100%;
right: 100%;
}
body.sub_open #menu-container {
left: 0;
right: 0;
display: block;
}
body.sub_open #menu-container a {
pointer-events: auto !important;
}
body.menu_open #masthead .header-slider .background-image {
height: 80vh;
}
body.menu_open #main_menu_new {
opacity: 1;
}
}
body.menu_over_screen #masthead #main_menu_new > div ul.menu li a.show::after, body.menu_over_screen #masthead #main_menu_new > div ul.menu li a.show::before {
top: 100%;
bottom: auto;
}
body.menu_over_screen #masthead #menu-container {
position: fixed;
z-index: 12345374834;
top: 10vh;
bottom: 100%;
}
body.menu_over_screen #masthead #menu-container.show {
bottom: 0;
}
@media screen and (max-width: 1200px) {
body.menu_over_screen #main_menu_new {
position: fixed;
}
body.menu_over_screen.menu_open #main_menu_new {
top: 10vh;
}
}
.single-marke .kp-loading::after {
content: "Sortiment wird geladen";
top: 0;
left: 0;
right: 0;
}
.product-archive .product-grid {
position: relative;
}
.product-archive .product-grid .single-product {
display: block;
position: absolute;
z-index: 1;
}
.product-archive .img-wrapper {
background-position: center;
background-repeat: no-repeat;
background-size: contain;
height: auto;
padding-bottom: 70%;
position: relative;
}
.product-archive .img-wrapper img {
position: absolute;
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.product-archive .bar {
color: white;
background-color: rgba(0, 0, 0, 0.77);
width: 100%;
padding: 0.25rem;
text-align: left;
margin-top: 0.5rem;
}
.product-archive .title {
text-align: left;
min-height: 72px;
}
.product-archive .full-link {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: block;
}
.product-archive .full-link:before, .product-archive .full-link:after {
display: none;
}
.product-archive .is-loading {
opacity: 1 !important;
}
.product-archive .filter select {
background: #F2F0F0;
color: #3b3b3b;
padding: 0.5rem;
display: block;
border: solid 1px #3b3b3b;
width: 90%;
margin: 0.5rem 0;
}
.product-archive .btn {
background-color: #F2F0F0;
color: #3b3b3b;
border: solid 1px #3b3b3b;
padding: 0.5rem 1.7rem;
margin-bottom: 20px;
display: inline-block;
}
.product-archive .btn:before, .product-archive .btn:after {
display: none;
}
.product-archive .btn:hover {
color: #3b3b3b;
}
#popup a {
color: #292b2c;
}