/* Theme Name: Gartenflora.de Theme URI: Description: Author: Weventure Author URI: https://www.weventure.de */ /* code temp ... -webkit-transition: all 5555ms cubic-bezier(0.645, 0.045, 0.355, 1.000); -moz-transition: all 5555ms cubic-bezier(0.645, 0.045, 0.355, 1.000); -ms-transition: all 5555ms cubic-bezier(0.645, 0.045, 0.355, 1.000); -o-transition: all 5555ms cubic-bezier(0.645, 0.045, 0.355, 1.000); transition: all 5555ms cubic-bezier(0.645, 0.045, 0.355, 1.000); -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -webkit-opacity: 1; -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; font-family: 'Montserrat', sans-serif; font-family: 'PT Serif', serif; font-family: 'Dancing Script', cursive; #292729 */ /* core ----------------------------------------------------------------------------- */ * { font-family: 'Montserrat', sans-serif; } section { position: relative; } :root { --gf-white: #fff; --gf-black: #555; /*122430*/ --gf-text: #5D5D5D; --gf-border: #979797; --gf-grey: #888; --gf-lightgrey: #979797; --gf-green: #52AE32; --gf-darkgreen: #6E873A; --gf-pink: #E5007D; --gf-lightpink: #FFF6F9; } #counter { display: none; position: fixed; top: 4rem; left: 1rem; padding: 0.5rem 1rem; z-index: 1000; background-color: black; color: lime; } /* head ----------------------------------------------------------------------------- */ header { position: relative; padding-bottom: 6rem; z-index: 2000; } .wv-head-frame { position: relative; padding: 0; text-align: center; } .wv-head-frame ul { padding: 0; } .wv-head { height: 97px; margin: 0; } .wv-head-magazin { position: relative; top: 0; left: 0; height: 97px; width: auto; padding: 0 0 0 171px; z-index: 600; display: inline-block; text-decoration: none; color: #555; } .wv-head-magazin:hover { text-decoration: inherit; color: inherit; } .wv-head-magazin img { position: absolute; display: block; height: 150px; width: 171px; left: 0; margin: 0 0 -53px 0; padding: 0 1rem 0 0; } .wv-head-magazin span { display: block; text-align: left; } .wv-head-magazin span:first-of-type { padding-top: 30px; } .wv-head-magazin span:last-of-type { color: #E5007D; text-transform: uppercase; } .wv-head-social { list-style: none outside none; padding-top: 50px !important; } .wv-head-social li { display: inline-block; border-radius: 100%; overflow: hidden; margin: 0 0.3rem; } .wv-head-social li a, .wv-head-social.social-content a { display: block; background-color: #555; color: #fff; width: 1.75rem; height: 1.75rem; text-align: center; line-height: 1.85rem; font-size: 1rem; text-decoration: none; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; filter: alpha(opacity=40); -webkit-opacity: 0.4; -moz-opacity: 0.4; -khtml-opacity: 0.4; opacity: 0.4; } .estimated-time-social-container, .author-social-container { display: flex; justify-content: space-between; padding-top: 10px; } .estimated-time-social-container .wv-head-social.wv-single-social, .author-social-container .wv-head-social.wv-single-social { padding-top: 0px !important; margin: 0; } .yoast-reading-time__spacer, .author-spacer { display: inline-block; width: .5em } .yoast-container, .author-container { display: flex; align-items: center; } .yoast-container { color: rgb(93, 93, 93); } .yoast-reading-time__wrapper.custom { line-height: 1; margin-bottom: 0; } .wv-block-content .yoast-reading-time__wrapper { display: none; } .wv-head-social.social-content { display: flex; justify-content: flex-end; } .wv-head-social.social-content a { border-radius: 50%; margin: 0 0.3rem; } .wv-content { position: relative; } .wv-content .toc_container { position: sticky; top: 0; } .wv-content.wv-content-cat .wv-block-content { width: auto; height: auto; margin: 0px 10%; } .wv-tablet { display: block !important; } .desktopVersion { display: none !important; } .mobileVersion { display: block !important; } @media (min-width: 1350px) { .wv-tablet { display: none !important; } .desktopVersion { display: block !important; } .mobileVersion { display: none !important; } } .wv-head-social li a:hover, .wv-head-social.social-content a:hover { background-color: #555; color: #fff; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60); -webkit-opacity: 0.6; -moz-opacity: 0.6; -khtml-opacity: 0.6; opacity: 0.6; } .wv-menu-imprint {} .wv-menu-imprint ul { position: relative; width: 100%; text-align: right; list-style: none outside none; padding: 60px 0 0 0; margin: 0; } .wv-menu-imprint ul li { display: inline-block; margin-left: 1rem; } .wv-menu-imprint ul li a { color: #888; font-size: 0.8rem; line-height: 2; text-transform: none; text-align: right; } .wv-menu-imprint ul li.login { white-space: nowrap; } .wv-menu-imprint ul li.login a { color: #E5007D; } .wv-sub .wv-head { height: auto; } .wv-sub .wv-head-magazin { padding: 0 0 0 1rem; font-size: 0.8rem; height: auto; } .wv-sub .wv-head-magazin span:first-of-type { padding-top: 10px; } .wv-sub .wv-head-social { padding-top: 20px !important; } .wv-sub .wv-menu-imprint ul { padding: 20px 0 0 0; } .wv-sub .wv-menu-imprint ul li.login { padding-right: 1rem; } .wv-sub .wv-menu-imprint i { display: none !important; } .wv-menu-main { position: absolute; z-index: 500; display: block; width: 100%; border-top: 2px #E5007D solid; background-color: #fff; padding: 1rem 1rem 0 1rem; -webkit-box-shadow: 0px 10px 20px 7px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0px 10px 20px 7px rgba(0, 0, 0, 0.1); box-shadow: 0px 10px 20px 7px rgba(0, 0, 0, 0.1); } .wv-menu-main .row { margin: 0; } .wv-menu-main .gf-logo { display: inline-block; padding: 1rem 0; } .wv-sub .wv-menu-main .gf-logo { display: none; } .wv-menu-main .gf-logo img { display: inline-block; height: auto; max-width: 326px; width: 100%; } .gf-logo img { display: inline-block; height: auto; max-width: 326px; width: 100%; } .wv-menu-main ul { list-style: none outside none; padding: 0; } .wv-menu-main a { position: relative; z-index: 10; color: #555; display: inline-block; font-size: 0.8rem; line-height: 3; font-weight: 700; text-transform: uppercase; text-decoration: none; } .wv-menu-main .active a, .wv-menu-main a:hover { color: #E5007D; } .wv-menu-main .wv-gf-sub { position: absolute; left: 0; margin-top: -0.3rem; } .wv-menu-main .wv-gf-sub img { width: 120px; padding: 0; } .wv-menu-main .wv-search { position: absolute; right: 1rem; } .wv-menu-main .wv-search a i.far { font-size: 120%; } .wv-head-frame #wv-menu { border-top: 1px #555 solid; } .wv-sub .wv-head-frame #wv-menu { border-top: 0; } .wv-ani-helper { height: 0; margin: 0; padding: 0; overflow: hidden; text-align: left; } .wv-ani-helper { -webkit-transition: all 200ms cubic-bezier(0.645, 0.045, 0.355, 1.000); -moz-transition: all 200ms cubic-bezier(0.645, 0.045, 0.355, 1.000); -ms-transition: all 200ms cubic-bezier(0.645, 0.045, 0.355, 1.000); -o-transition: all 200ms cubic-bezier(0.645, 0.045, 0.355, 1.000); transition: all 200ms cubic-bezier(0.645, 0.045, 0.355, 1.000); } .wv-ani-helper .row { padding-top: 1rem; border-top: 1px #555 solid; } .wv-ani-helper .row .row { background-color: rgba(0, 0, 0, 0.05); padding: 0; border-top: 1px #52AE32 solid; } .wv-ani-helper .row ul li { margin: 0 1rem; } .wv-ani-helper .row .row ul li { margin: 0; } #wv-mm-1 .wv-ani-helper li a { text-align: left; } #wv-mm-2 .wv-ani-helper li a { text-align: center; } #wv-mm-3 .wv-ani-helper li a { text-align: center; } #wv-mm-4 .wv-ani-helper li a { text-align: center; } #wv-mm-5 .wv-ani-helper li a { text-align: center; } #wv-mm-6 .wv-ani-helper li a { text-align: center; } .wv-ani-helper a { padding: 0 1rem; display: block; } .wv-ani-helper a:hover { color: #52AE32; } .wv-ani-helper form { text-align: center; padding: 1rem 0 1rem 0; display: block; width: 100%; } .wv-ani-helper form * { -webkit-appearance: none; appearance: none; border: 0; } .wv-ani-helper form input[type='text'] { width: calc(60% - 2rem); background-color: rgba(0, 0, 0, 0.05); color: #555; padding: 0 1rem; height: calc(2.5rem - 1px); font-size: 1rem; border-bottom: 1px #555 solid; } .wv-ani-helper form input[type='submit'] { width: auto; color: #fff; background-color: #E5007D; padding: 0 2rem; height: 2.5rem; font-size: 1rem; } .wv-ani-helper p { padding: 1rem 15% 2rem 15%; text-align: center; } #wv-mobile-switch { position: absolute; top: 0; right: calc(1rem + 30px); z-index: 1000; list-style: none outside none; } #wv-mobile-switch li { display: inline-block; width: 30px; margin-left: 0.25rem; text-align: center; } #wv-mobile-switch li a { display: block; width: 30px; } #wv-mobile-switch li a i { font-size: 25px; line-height: 30px; } #wv-mobile-switch .fas { color: #E5007D; } #wv-mobile-switch .far { color: #888; } @media (min-width: 576px) { .wv-desktop-block { display: block; } .wv-desktop-flex { display: -ms-flexbox; display: flex; } .wv-mobile { display: none; } .wv-col-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .wv-col-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } } @media (min-width: 900px) { .wv-desktop-block { display: block; } .wv-desktop-flex { display: -ms-flexbox; display: flex; } .wv-col-3 { -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; } .wv-col-6 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } } @media (max-width: 970px) { .wv-menu-main .wv-gf-sub { position: relative; } .wv-menu-main .wv-search { position: relative; right: 0; } } #menu-impressum { display: flex; } #menu-impressum>.menu-item { width: 6rem; padding: 0 5px 0 5px; min-width: min-content; display: flex; justify-content: center; } #menu-impressum>.menu-item:nth-last-child(-n + 4)>a { color: var(--gf-pink) !important; } #menu-impressum>.menu-item:first-child>a { color: white; flex-grow: 1; text-align: center; } #menu-impressum>li:nth-child(-n + 1) { border: 1px solid var(--gf-green); background-color: var(--gf-green); } #menu-impressum>li:nth-last-child(-n + 4) { border: 1px solid var(--gf-pink); background-color: var(--gf-pink); } #menu-impressum>.menu-item:nth-last-child(-n + 4)>a { color: white !important; display: flex; align-items: center; } #menu-impressum>.menu-item:nth-last-child(-n + 4):hover>a { color: white !important; transition: 0.35s ease-in-out; } #menu-impressum>.menu-item:first-child:hover>a { color: var(--gf-green); transition: 0.35s ease-in-out; } #menu-impressum>li:nth-child(-n + 1):hover { border: 1px solid var(--gf-pink); background-color: var(--gf-pink); transition: 0.35s ease-in-out; } #menu-impressum>li:nth-last-child(-n + 4):hover { border: 1px solid var(--gf-pink); background-color: white; transition: 0.35s ease-in-out; } #menu-impressum>.menu-item:nth-last-child(-n + 4):hover>a { color: var(--gf-pink) !important; transition: 0.35s ease-in-out; } @media (max-width: 576px) { .wv-mobile { display: block; } .wv-mobile ul { margin: 0; } #wv-menu-sub .wv-mobile ul { border-top: 1px #979797 solid; } #wv-menu-sub { display: none; border-bottom: 0; } .wv-desktop-flex { display: none !important; } } @media (max-width: 575px) { .wv-sub .wv-menu-main .gf-logo { display: inline-block; } } @media (max-width: 900px) { .wv-desktop-block { display: none !important; } header { padding-bottom: 0; } .wv-head-frame { text-align: left; } .wv-menu-main { position: relative; padding: 0 30px 0 30px; border-top: 0; } .wv-menu-main .gf-logo { padding: 1rem 15px 1rem 15px; line-height: 0; } .wv-menu-main .gf-logo img { width: auto; max-width: 100%; min-width: 0px; height: 30px !important; } .menu-active #wv-menu-sub, .menu-search #wv-menu-sub { display: block; } #wv-menu-sub .wv-imprint ul { padding: 1rem 0; } #wv-menu-sub .wv-imprint li { padding-left: 15px; padding-right: 15px; display: inline-block; } #wv-menu-sub .wv-imprint li.login { display: none; } #wv-menu-sub .wv-imprint li a { color: #888; } .wv-hide-menu { display: none !important; } .menu-search .wv-hide-menu { display: none !important; } .menu-active .wv-hide-menu, .menu-search .wv-hide-menu { display: inline-block !important; } .wv-show-menu { display: inline-block !important; } .menu-active .wv-show-menu, .menu-search .wv-show-menu { display: none !important; } .wv-ani-helper .row { margin: 0; } .wv-ani-helper .row ul li { margin: 0; } #wv-mm-1 .wv-ani-helper li a { text-align: left; } #wv-mm-2 .wv-ani-helper li a { text-align: left; } #wv-mm-3 .wv-ani-helper li a { text-align: left; } #wv-mm-4 .wv-ani-helper li a { text-align: left; } #wv-mm-5 .wv-ani-helper li a { text-align: left; } #wv-mm-6 .wv-ani-helper li a { text-align: left; } .wv-col-3 { -ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%; } .wv-col-6 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } #wv-mm-2 .col, #wv-mm-4 .col { width: 100%; max-width: 100%; min-width: 100%; } #wv-mm-2 ul, #wv-mm-4 ul { margin-bottom: 0; } #wv-mm-2 ul:last-of-type, #wv-mm-4 ul:last-of-type { margin-bottom: 1rem; } .menu-active #wv-mm-6 { display: none; } .menu-search #wv-mm-6 .wv-ani-helper { height: auto !important; } .menu-search #wv-mm-6 p { padding: 1rem 15px 2rem 15px; } } @media screen and (max-width: 577px) { #menu-impressum { display: flex; flex-direction: column !important; gap: 0; } #menu-impressum>li { background-color: white !important; } #menu-impressum>.menu-item:first-child>a { color: var(--gf-green); } #menu-impressum>.menu-item:nth-last-child(-n + 4)>a { color: var(--gf-pink) !important; gap: 1rem; } .row.wv-mobile.wv-imprint .menu-item { width: 100% !important; min-width: 100% !important; padding-left: 15px !important; } #wv-menu-sub .wv-imprint ul { padding: 0; } #wv-mobile-switch ul { gap: 1rem; } } @media (max-width: 600px) { .wv-col-3 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } .wv-col-6 { -ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%; } #wv-menu-sub .wv-imprint li { width: calc(50% - 30px); } .wv-menu-main { padding: 0; } #wv-mobile-switch { right: 1rem; } #wv-mobile-switch li {} } @media (max-width: 360px) { .wv-head-frame.container { display: flex; flex-wrap: wrap; } .wv-menu-main { text-align: center; } #wv-mobile-switch { position: static; order: 2; width: 100%; text-align: center; background-color: #fff; margin-bottom: 15px; } #wv-mobile-switch ul li:not(#wv-mobile-switch ul li:first-child) { margin-left: 15px; } } /* foot ----------------------------------------------------------------------------- */ footer { position: relative; z-index: 500; padding: 0 0 2rem 0; overflow: hidden; } footer * { color: #555; font-size: 0.8rem; } footer .gf-logo { display: block; padding: 1rem 0; } footer .gf-logo img { display: block; height: auto; width: 10rem; } footer ul { list-style: none outside none; padding: 0; } footer a { text-decoration: underline; } footer a:hover { color: #E5007D; } footer b { display: block; padding-bottom: 0.5rem; } footer ul a { text-decoration: none; } footer ul a:hover { text-decoration: underline; } footer .wv-foot-social { display: block; width: 1.75rem; } footer .wv-foot-social li { display: block; border-radius: 100%; overflow: hidden; margin: 0 0 0.5rem 0; } footer .wv-foot-social li a { display: block; background-color: #555; width: 1.75rem; height: 1.75rem; text-align: center; line-height: 1.85rem; text-decoration: none; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; filter: alpha(opacity=40); -webkit-opacity: 0.4; -moz-opacity: 0.4; -khtml-opacity: 0.4; opacity: 0.4; } footer .wv-foot-social li a:hover { background-color: #555; color: #fff; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; filter: alpha(opacity=60); -webkit-opacity: 0.6; -moz-opacity: 0.6; -khtml-opacity: 0.6; opacity: 0.6; } footer .wv-foot-social li a i { color: #fff; font-size: 1rem; } footer .wv-footer-head { background-color: #52AE32; position: relative; width: 100vw; min-height: 100px; padding: 50px 0 30px 0; border-radius: 400vw 400vw 0vw 00vw / 30vw 30vw 0vw 0vw; border-bottom-left-radius: initial; border-bottom-right-radius: initial; /*background-image: url('./images/footer-head.svg'); background-size: 100vw auto; background-position: center center;*/ } footer .wv-footer-head p { text-align: center; color: #fff; font-size: 1.4rem; } footer .wv-footer-head a { background-color: #E5007D; color: #fff; padding: 0.25rem 1.5rem; border-radius: 30px; display: inline-block; margin: 0 1rem; font-size: 80%; text-decoration: none; } footer .wv-footer-head a:hover { background-color: #fff; color: #555; } /* text ----------------------------------------------------------------------------- */ h1 { color: #555; font-size: 2rem; line-height: 1.2; font-weight: 500; padding: 0 0 1rem 0; margin: 0; } h1::first-line { color: #E5007D; } h1.alt { color: #E5007D; font-size: 2rem; line-height: 1.2; font-weight: 500; padding: 0 0 1rem 0; margin: 0; } h1.alt span { display: block; color: #555; } h1.alt::first-line { color: inherit; } h2 { font-size: 1.8rem; line-height: 1.4; font-weight: 400; padding: 2rem 0 1rem 0; } h3 { font-size: 1.3rem; line-height: 1.4; font-weight: 400; padding: 1rem 0 0.5rem 0; } h4 { font-size: 1rem; } h5 { font-size: 1rem; } h6 { font-size: 1rem; } p { color: #5d5d5d; font-size: 1rem; line-height: 1.7; } li { color: #5d5d5d; font-size: 1rem; line-height: 1.7; } .btn.gf { background-color: #E5007D; color: #fff; padding: 0.35rem 1.5rem 0.25rem 1.5rem; font-size: 100%; text-decoration: none; text-transform: uppercase; } .btn.gf:hover { background-color: #52AE32; color: #fff; } /* hero ----------------------------------------------------------------------------- */ .wv-hero-slider { max-width: 1500px; margin: 0px auto; max-height: 600px; margin-bottom: 25px; } .wv-hero-slider .slick-list { height: 65vh; max-height: 600px; min-height: 300px; } .wv-hero-slider .wv-slide-background { position: relative; z-index: 100; width: 100vw; max-width: 1500px; border-radius: 0% 0% 70% 26% / 113% 73% 49% 7%; height: 65vh; max-height: 600px; min-height: 300px; background-color: #979797; background-size: cover; background-repeat: no-repeat; background-position: center center; } .wv-hero-slider .wv-slide-text { position: relative; z-index: 200; margin-top: -55vh; left: -2rem; width: 60%; min-width: 500px; max-width: 700px; height: auto; background-color: rgba(255, 255, 255, 0.93); border-width: 0; border-radius: 46% 76% 99% 39% / 70% 40% 101% 57%; padding: 80px 110px 90px 80px; } .wv-hero-slider .wv-slide-text .btn { background-color: #E5007D; color: #fff; padding: 0.25rem 1.5rem; font-size: 80%; text-decoration: none; text-transform: uppercase; } .wv-hero-slider .wv-slide-text .btn:hover { background-color: #52AE32; color: #fff; } .wv-hero-slider .slick-arrow { position: absolute; top: 50%; z-index: 500; margin: -40px 0 0 0; cursor: pointer; } .wv-hero-slider .slick-arrow svg { width: 80px; height: 80px; } .wv-hero-slider .slick-prev { left: 0px; } .wv-hero-slider .slick-next { right: 0px; } .wv-hero-slider .slick-dots { list-style: none outside none; text-align: center; padding: 0; } .wv-hero-slider .slick-dots li { width: auto; display: inline-block; } .wv-hero-slider .slick-dots li button { font-size: 0; line-height: 0; background-color: #E5007D; border-width: 0; border-radius: 100%; width: 0.8rem; height: 0.8rem; display: block; margin: 0.35rem; padding: 0; } .wv-hero-slider .slick-dots li.slick-active button { background-color: #555; } @media (max-width: 900px) { /* mobile */ .wv-hero-slider .slick-list { height: auto; max-height: inherit; min-height: inherit; } .wv-hero-slider .wv-slide-background { height: 40vh; } .wv-hero-slider .wv-slide-text { margin-top: 2rem; left: 0; width: 100%; min-width: 100%; max-width: 100%; border-radius: 0; padding: 0 10%; text-align: center; } .wv-hero-slider .slick-arrow { top: 50vh; } .wv-hero-slider .slick-dots { margin-top: 1rem; } } @media (max-width: 767px) { /* mobile */ .wv-hero-slider .slick-dots li button { margin: 10px; } } @media (max-width: 400px) { /* mobile */ .wv-hero-slider .slick-prev { display: none; } .wv-hero-slider .slick-next { display: none; } } @media (max-width: 360px) { /* mobile */ .wv-hero-slider .wv-slide-text { padding: 0 15px; } } @media(min-width: 901px) { /* mobile */ .wv-home .wv-hero-slider .wv-slide-text { left: 70px; } } .wv-hero { padding-top: 0; margin-bottom: 2rem; overflow: hidden; } .wv-hero .wv-hero-background { display: block; position: relative; width: 100%; height: 55vh; max-height: 600px; min-height: 300px; z-index: 100; background-color: #979797; background-repeat: no-repeat; background-position: center center; background-size: cover; } .wv-hero .wv-hero-headline { position: absolute; z-index: 200; top: 12vh; margin-left: 2rem; width: 60%; min-width: 500px; max-width: 700px; height: auto; background-color: rgba(255, 255, 255, 0.93); border-width: 0; border-radius: 60% 76% 95% 60% / 80% 52% 110% 80%; padding: 80px 110px 90px 90px; } .wv-hero .wv-hero-headline-noBubble { z-index: 200; top: 12vh; width: 60%; min-width: 500px; max-width: 700px; height: auto; padding-top: 20px; } .wv-hero .wv-hero-caption { position: absolute; bottom: 0; right: 0; z-index: 300; color: #fff; padding: 1rem 0; text-align: center; font-size: 0.8rem; line-height: 1.4; margin: 0 2% 0 2%; } .wv-video-hero .wv-hero-caption { text-align: right; font-size: 0.8rem; line-height: 1.4; margin: 0; padding-top: 3px; } @media (max-width: 900px) { /* mobile */ .wv-hero .wv-hero-background { height: 40vh; } .wv-hero .wv-hero-headline { position: relative; top: 1rem; margin-left: 0; width: 100%; min-width: 100%; max-width: 100%; border-radius: 0; padding: 0; } } @media (max-width: 360px) { /* mobile */ .wv-hero .wv-hero-headline { padding: 0 15px; } } .wv-content table { margin: 0 0 1rem 0; } .wv-content tr:first-of-type td { background-color: #FAF9F5 !important; } .wv-content td { padding: 5px; } .wv-content tr:hover td { background-color: #FFF6F9; } /* content ----------------------------------------------------------------------------- */ .wv-no-hero { padding-top: 1rem; padding-bottom: 1rem; } .wv-no-hero img { width: 100%; height: auto; } .wv-content { padding-bottom: 100px; overflow: hidden; } .wv-block-content { width: 70%; height: auto; margin: 0; flex-grow: 1; } .wv-block-content.single-block { display: table; table-layout: fixed; } .gf020-blog-post { display: table-footer-group; } .wv-block-content .wv-excerpt .wprm-recipe.wprm-recipe-snippet.wprm-recipe-template-gartenflora-2 { display: none; } .wv-block-content a, .wv-hero #breadcrumbs a, .wv-video-hero #breadcrumbs a { color: #52AE32; text-decoration: underline; } .wv-block-content a:hover, .wv-hero #breadcrumbs a:hover, .wv-video-hero #breadcrumbs a:hover { color: #E5007D; } .wv-breadcrumbs { display: block; padding: 0 0 2rem 0; } .wv-breadcrumbs a::before { content: '›'; display: inline-block; padding-left: 0.5rem; padding-right: 0.5rem; } .wv-breadcrumbs a:first-of-type::before { display: none; } .wv-breadcrumbs span { display: inline-block; padding-left: 1rem; color: #979797; } .wp-block-embed-youtube iframe { width: 100% !important; } .wv-article { padding-bottom: 2rem; } .wv-article a { color: inherit; text-decoration: none; } .wv-article img { width: 100%; height: auto; background-position: center center; background-size: cover; background-repeat: no-repeat; background-color: #E5007D; } .wv-article h3 { font-family: 'PT Serif', serif; font-weight: normal; color: #555; } .wv-article p { font-size: 0.8rem; display: block; } .wv-article .wv-date { font-size: 0.8rem; display: block; color: #888; } .wv-article .wv-cat { font-size: 0.8rem; display: block; color: #6E873A; padding: 0 0 0.5rem 0; } .wv-article .ad-hint { position: absolute; top: -1rem; left: 15px; font-size: 0.6rem; color: #888; } .wp-embed-aspect-16-9 iframe { height: calc((1110px * .8) * 0.5625); } @media(max-width: 1200px) { .wp-embed-aspect-16-9 iframe { height: calc((940px * .8) * 0.5625); } } @media(max-width: 970px) { .wp-embed-aspect-16-9 iframe { height: calc(((100vw - 30px) * .8) * 0.5625); } } @media (max-width: 360px) { .wp-embed-aspect-16-9 iframe { height: calc((100vw - 60px) * 0.5625); } } .article-video .article_image_container { position: relative; } .play-button-container { background-color: rgba(255, 255, 255, 0.8); width: 100%; height: 30px; position: absolute; bottom: 0; display: flex; align-items: center; padding: 5px 15px; justify-content: space-between; } .play-button { width: 36px; height: 24px; background-image: url(/wp-content/themes/gartenflora.de/images/play-single.png); background-repeat: no-repeat; margin-right: 10px; } .play-bar::before { content: " "; width: 12px; height: 12px; background-color: var(--gf-green); position: absolute; top: -5px; bottom: 0; left: 0; border-radius: 100%; } .play-bar { height: 3px; background-color: var(--gf-green); border-radius: 5px; position: relative; flex-grow: 1; } .wv-illu-left { position: absolute; left: 0; width: 15vw; height: auto; top: 10vh; } .wv-illu-right { position: absolute; right: 0; width: 15vw; height: auto; } .wv-illu-btm { bottom: 0; top: auto; } .wv-illu-left.wv-single {} .wv-illu-right.wv-single { bottom: 40%; } .wv-illu-left.wv-single.wv-illu-btm { bottom: 0; top: auto; } .wv-illu-right.wv-single.wv-illu-btm { bottom: 0; } @media (min-width: 1120px) and (max-width: 1320px) { .wv-illu-left, .wv-illu-right { width: 13vw !important; } } @media (max-width: 1120px) { .wv-illu-left, .wv-illu-right { width: 10vw !important; } } @media (max-width: 360px) { /* mobile */ .wv-illu-left { display: none !important; } .wv-illu-right { display: none !important; } } .gf-title-frame { position: relative; display: block; width: 100%; overflow: hidden; text-align: center; padding: 2rem 0; } .gf-title-frame .gf-title { position: relative; display: inline-block; font-size: 1.6rem; color: #6E873A; font-family: 'PT Serif', serif; font-weight: normal; padding: 0 1.5rem; } .gf-title-frame .gf-title::before { content: ''; position: absolute; width: 970px; height: 1px; overflow: hidden; top: 49%; right: 100%; background-color: #6E873A; } .gf-title-frame .gf-title::after { content: ''; position: absolute; width: 970px; height: 1px; overflow: hidden; top: 49%; left: 100%; background-color: #6E873A; } .gf-leaderboard { position: relative; left: 50%; margin: 5rem -364px 2rem -364px; display: block; } .gf-leaderboard .ad-hint { position: absolute; top: -1rem; left: 0; font-size: 0.6rem; color: #888; } @media (max-width: 727px) { .gf-leaderboard { display: none !important; } } .wp-block-button__link { background-color: #E5007D !important; color: #fff !important; text-decoration: none !important; } .wp-block-button__link:hover { background-color: #52AE32 !important; color: #fff !important; text-decoration: none !important; } .wp-block-image img { height: auto; } .wp-block-image figcaption { font-size: 0.825rem; } .wp-block-gallery li { margin-right: 15px !important; } .wp-block-gallery li figure { display: block !important } .wp-block-gallery li img { max-width: 100%; height: auto !important; flex: none; } .wp-block-gallery li figcaption { position: relative !important; bottom: auto !important; background: none !important; background-color: #FFF6F9 !important; color: #5d5d5d !important; height: auto !important; padding: 10px !important; } .wp-block-gallery .slick-arrow { position: absolute; top: 50%; z-index: 500; margin: -40px 0 0 0; cursor: pointer; } .wp-block-gallery .slick-arrow svg { width: 80px; height: 80px; } .wp-block-gallery .slick-prev { left: -70px; } .wp-block-gallery .slick-next { right: -55px; } @media (max-width: 500px) { /* mobile */ .wp-block-gallery li { margin-right: 0 !important; } .wp-block-gallery .slick-prev { left: -55px; } .wp-block-gallery .slick-next { right: -55px; } } /* kleinanzeigen ----------------------------------------------------------------------------- */ .wv-kleinanzeige { padding: 2rem 0; border-top: 1px #888 dashed; } .wv-kleinanzeige:first-of-type { padding: 0 0 1rem 0; border-top: 0; } .wv-kleinanzeige p { font-family: 'PT Serif', serif; color: #555; } /* category, search ----------------------------------------------------------------------------- */ .wv-category { position: relative; left: 50%; } .wv-category article img { width: 300px; height: 170px; } .wv-category .wv-grid-col-50 article img { width: 100%; height: auto; } .wv-category-ad { position: relative; width: 300px; height: 250px; z-index: 200; background-color: #4789bc; display: block; margin-bottom: 5rem; } .wv-category-ad-bg { position: absolute; width: 200px; height: 200px; z-index: 100; top: 80px; left: 145px; background-color: #FFF6F9; } .wv-category .ad-hint { position: absolute; top: -1rem; left: 15px; font-size: 0.6rem; color: #888; } .wv-category .wv-top-news-col { width: 300px !important; max-width: 330px; } .wv-category-separator { display: block; padding: 2rem 0; } .wv-category-separator svg { width: 100%; height: auto; } @media (min-width: 990px) { .wv-category { margin: 0 -480px; width: 960px; } .wv-category .wv-grid-col-50 { width: 420px; flex-basis: 1; } .wv-category .wv-grid-col-50:first-of-type { width: 415px; } .wv-category .wv-grid-col-50 .wv-grid-col-50 { width: 210px; } } @media (min-width: 660px) and (max-width: 990px) { .wv-category { margin: 0 -315px; width: 630px; } .wv-category .wv-grid-col-50 { width: 630px; flex-basis: unset; } .wv-category .wv-grid-col-50:first-of-type { width: 630px; } .wv-category .wv-grid-col-50 .wv-grid-col-50 { width: 210px; flex-basis: 1; } } @media (max-width: 660px) { .wv-category { margin: 0 -150px; width: 300px; } .wv-category .wv-grid-col-50 { width: 300px; flex-basis: unset; } .wv-category .wv-grid-col-50:first-of-type { width: 300px; } .wv-category .wv-grid-col-50 .wv-grid-col-50 { width: 300px; flex-basis: unset; } } /* ads ----------------------------------------------------------------------------- */ .ad-billboard { position: relative; left: 50%; margin: 3rem -485px 2rem -485px; display: block; } .ad-billboard ins a::before { content: "Anzeige"; position: absolute; top: -1rem; left: 0; font-size: 0.6rem; color: #888; } @media (max-width: 969px) { .ad-billboard { display: none !important; } } .ad-leaderboard-post, .ad-mobile-post { position: relative; left: 0; margin: 3rem auto 2rem auto; display: block; width: max-content; } .ad-leaderboard { position: relative; left: 50%; margin: 3rem -364px 2rem -364px; display: block; } .ad-leaderboard ins a::before, .ad-leaderboard-post ins a::before { content: "Anzeige"; position: absolute; top: -1rem; left: 0; font-size: 0.6rem; color: #888; } @media (max-width: 727px) { .ad-leaderboard, .ad-leaderboard-post { display: none !important; } } .ad-mobile { position: relative; left: 50%; margin: 3rem -150px 2rem -150px; display: block; } .ad-mobile ins a::before, .ad-mobile-post ins a::before { content: "Anzeige"; position: absolute; top: -1rem; left: 0; font-size: 0.6rem; color: #888; } @media (max-width: 300px) { .ad-mobile, .ad-mobile-post { display: none !important; } } .ad-content-rectangle { position: relative; float: right; display: block; width: auto; min-width: 0; } .ad-content-rectangle ins a { position: relative; display: block; width: 300px; height: auto; margin: 0 0 4rem 2rem; } .ad-content-rectangle ins a img { position: relative; z-index: 100; } .ad-content-rectangle ins a::before { content: "Anzeige"; position: absolute; top: -1rem; left: 0; font-size: 0.6rem; color: #888; left: 32px } /*.ad-content-rectangle ins::after { content: ""; position: absolute; bottom: 1rem; right: -2rem; z-index: -1; width: 70%; height: 70%; background-color: #FFF6F9; }*/ .wv-block-intro-container .ad-content-rectangle { display: flex; justify-content: flex-end; } @media (max-width: 800px) { .ad-content-rectangle { float: none; margin: 0px auto; width: 300px; } .ad-content-rectangle ins a { margin: 0 0 4rem 0; } .ad-content-rectangle ins::before { left: 0; } .wv-block-intro-container { display: flex; } .wv-block-intro-container .ad-content-rectangle { order: 1; } } @media (max-width: 300px) { .ad-content-rectangle { display: none !important; } } @media(max-width: 989px) { .interscrollar_bar { width: 100%; text-align: center; background-color: var(--gf-green); color: #fff; height: 28px; } .interscrollar_bar p { color: #fff; } .scroll_container { height: 480px !important; position: relative; cursor: pointer; } .scroll_container .scroll_wrapper { position: absolute !important; top: 0 !important; left: 0; width: 100%; height: 480px !important; border: 0 !important; margin: 0 !important; padding: 0 !important; clip: rect(0, auto, auto, 0) !important; -webkit-clip-path: polygon(0px 0px, 100% 0px, 100% 100%, 0px 100%) !important; clip-path: polygon(0px 0px, 100% 0px, 100% 100%, 0px 100%) !important; } .scroll_container .scroll_inner { position: fixed !important; top: 50% !important; left: 50% !important; right: 50% !important; bottom: 50%; margin: auto 0; width: 100%; height: 480px; -webkit-transform: translate(-50%) !important; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; } #ad_interscroller .gf011-ad, #ad_interscroller.ad-content-rectangle, #ad_interscroller .wv-category-ad { height: 560px !important; background-color: #fff !important; } #ad_interscroller.ad-content-rectangle, #ad_interscroller .wv-category-ad { margin-bottom: 15px; margin-left: 0px !important; } #ad_interscroller .gf011-ad-bg, #ad_interscroller .ad-hint, #ad_interscroller.ad-content-rectangle ins::before, #ad_interscroller.ad-content-rectangle ins::after, #ad_interscroller .wv-category-ad-bg { display: none; background-color: transparent; } } /* pagination ----------------------------------------------------------------------------- */ .pagination { position: relative; display: block; width: 100%; text-align: center; padding: 2rem 0 2rem 0; } .pagination a.page-numbers { line-height: 2rem; font-size: 0.6rem; text-align: center; width: 2rem; height: 2rem; margin: 0 0.25rem; display: inline-block; color: #52AE32; background-color: #eee; border-radius: 2rem; } .pagination a.page-numbers { text-decoration: none; } .pagination a.page-numbers:hover { color: #fff; background-color: #E5007D; } .pagination a.page-numbers.next, .pagination a.page-numbers.prev { width: auto; padding: 0 1rem; } .pagination span.current { line-height: 2rem; font-size: 0.6rem; text-align: center; width: 2rem; height: 2rem; margin: 0 0.25rem; display: inline-block; color: #fff; background-color: #52AE32; border-radius: 2rem; } @media (max-width: 360px) { .author-social-container .wv-head-social.wv-single-social { padding: 0; } } @media (max-width: 576px) { /*xs - sollte aber kaum vorkommen */ .container { max-width: 100vw; } .wv-head { height: auto; } .wv-head-magazin { padding: 0 0 0 1rem; font-size: 0.8rem; height: auto; } .wv-head-magazin span:first-of-type { padding-top: 10px; } .wv-menu-imprint ul { padding: 20px 0 0 0; } .wv-menu-imprint ul li.login { padding-right: 1rem; } .wv-menu-main .wv-search { position: relative; right: 0; } .wv-content .wp-block-image .alignleft, .wv-content .wp-block-image .alignright { float: none; text-align: center; margin-left: 0; margin-right: 0; width: 100%; } .wv-content .wp-block-image .alignleft img, .wv-content .wp-block-image .alignright img { max-width: 100%; } } @media (min-width: 576px) and (max-width: 768px) { /*sm*/ .container { max-width: 100vw; } .wv-head { height: auto; } .wv-head-magazin { padding: 0 0 0 1rem; font-size: 0.8rem; height: auto; } .wv-head-magazin span:first-of-type { padding-top: 10px; } .wv-head-social { padding-top: 20px !important; } .wv-menu-imprint ul { padding: 20px 0 0 0; } .wv-menu-imprint ul li.login { padding-right: 1rem; } .wv-menu-main .wv-search { position: relative; right: 0; } .wv-content .wp-block-image .alignleft, .wv-content .wp-block-image .alignright { float: none; text-align: center; margin-left: 0; margin-right: 0; width: 100%; } .wv-content .wp-block-image .alignleft img, .wv-content .wp-block-image .alignright img { max-width: 100%; } } @media (min-width: 768px) and (max-width: 970px) { /*md*/ .container { max-width: 100vw; } .wv-head { height: auto; } .wv-head-magazin { padding: 0 0 0 1rem; font-size: 0.8rem; height: auto; } .wv-head-magazin span:first-of-type { padding-top: 10px; } .wv-head-social { padding-top: 20px !important; } .wv-menu-imprint ul { padding: 20px 0 0 0; } .wv-menu-imprint ul li.login { padding-right: 1rem; } } @media (min-width: 970px) and (max-width: 992px) { /*lg*/ .container { max-width: 970px; } .wv-head { height: auto; } .wv-head-magazin { padding: 0 0 0 1rem; font-size: 0.8rem; height: auto; } .wv-head-magazin span:first-of-type { padding-top: 10px; } .wv-head-social { padding-top: 20px !important; } .wv-menu-imprint ul { padding: 20px 0 0 0; } .wv-menu-imprint ul li.login { padding-right: 1rem; } } @media (min-width: 992px) and (max-width: 1200px) { /*lg*/ .container { max-width: 970px; } .wv-home .wv-menu-imprint ul li.login { position: absolute; right: 0; top: 0.5rem; border: 1px #E5007D solid; padding: 0.25rem 0.75rem; } .wv-home .wv-menu-imprint ul li.login i.fas { border-radius: 100%; overflow: hidden; font-size: 1rem; width: 1rem; height: 1rem; margin-right: 0.5rem; text-align: center; } } @media (min-width: 1200px) { /*xl*/ .container { max-width: 1140px; } .wv-home .wv-menu-imprint ul li.login { position: absolute; right: 0; top: 0.5rem; border: 1px #E5007D solid; padding: 0.25rem 0.75rem; } .wv-home .wv-menu-imprint ul li.login i.fas { border-radius: 100%; overflow: hidden; font-size: 1rem; width: 1rem; height: 1rem; margin-right: 0.5rem; text-align: center; } } .wp-embed-footer { display: none; } .nl-popup-list li::marker { font-size: 1.5rem } .nl-popup-list { padding-left: 25px !important; list-style-image: url("/wp-content/uploads/2021/08/check-solid.svg") !important; } .nl-popup-list li { margin-top: -5px !important; } .nl-popup-list { margin: 0 auto; max-width: max-content; } .newsletter-block { background-color: rgba(229, 0, 125, .1); border-radius: 10px; padding: 0 0 1rem 0; } .newsletter-block figure { width: 30%; margin: 0 auto 1rem auto !important; } @media screen and (max-width: 500px) { .g-recaptcha>div { max-width: 100% !important } .g-recaptcha iframe { max-width: 100% !important; } } .nl-popup-img { max-width: 40%; } .wp-block-group.newsletter-block .wp-block-image { margin: 0 auto !important; } .wp-block-group.newsletter-block .wp-block-column { display: flex; justify-content: center; align-items: center; } .wp-block-group.newsletter-block .wp-block-group__inner-container { display: flex; flex-flow: row wrap; align-items: center; justify-content: center; padding: 2rem 0; } .wp-block-group.newsletter-block .wp-block-group__inner-container>* { max-width: 90% !important; margin: 0rem auto 1rem auto; } .wv-ani-helper.extended { max-height: 80vh !important; height: 100% !important; transition: max-height ease-out 2s, opacity ease .8s; opacity: 1; } .wv-ani-helper { max-height: 0 !important; transition: max-height ease-in 2s, opacity ease .8s; opacity: 0; } @media screen and (max-width: 500px) { html #sgpb-popup-dialog-main-div-wrapper { display: block; } html #sgpb-popup-dialog-main-div-wrapper>div:first-child { top: 25px !important; left: 25px !important; } } /* Advertorial Logo */ .advertorial-logo-container { display: flex; align-items: flex-start; align-content: flex-start; column-gap: 15px; flex-wrap: wrap; padding-left: 20px; } .advertorial-logo-container img { max-height: 100px; max-width: 175px; } .advertorial-logo-container p { margin-bottom: 0; width: 100%; } @media(max-width: 992px) { #wv-menu-sub { position: relative !important; } #breadcrumbs { margin-top: 10px; } .advertorial-logo-container p { width: 100%; margin-bottom: 10px; } .advertorial-logo-container { flex-wrap: wrap; padding-left: 0; order: 0; margin-bottom: 30px; } .wv-block-intro-container.wv-intro-advert .wv-excerpt { order: 1; margin-bottom: 0; } } @media screen and (max-width: 550px) { #wv-menu-sub { position: relative !important; } div#wv-mobile-switch ul { display: flex; justify-content: space-around; align-items: center; padding: 1rem 0 0 0; } div#wv-mm-6.opened, div#wv-mm-6.opened .wv-ani-helper, .opened #wv-ani-helper-6 { height: 100px !important; max-height: 100px !important; opacity: 1 !Important; } div#wv-ani-helper-6 .row.justify-content-center p { display: none; } div#wv-ani-helper-6 .row.justify-content-center { padding-top: 0 !important; } } .row.wv-mobile.opened+.wv-sub .wv-ani-helper, .row.wv-mobile.opened+.wv-sub .wv-ani-helper { animation: menuFade ease 1s forwards; max-height: 100% !important; height: 0%; opacity: 0; } .row.wv-mobile a { width: 100%; position: relative; z-index: 99999; } .row.wv-mobile.wv-imprint .menu-item { display: flex !important; padding: 0 0 0 15px !important; flex: 1 !important; min-width: 50% !important; max-width: 50% !important; width: 50% !important; border-top: 2px solid transparent; } .row.wv-mobile.wv-imprint .menu-item:focus, .row.wv-mobile.wv-imprint .menu-item:active { border-bottom: 2px solid #E5007D !important; border-top: 2px solid #E5007D !important; } .row.wv-mobile.wv-imprint .menu-item.menu-item-type-custom:last-child { margin: 0 auto !important; } .row.wv-mobile.wv-imprint .menu-item.menu-item-type-custom a { width: 100%; } div#wv-mobile-switch ul { display: flex; justify-content: space-around; } div#wv-mobile-switch ul li a { margin: 0 !important; width: 100% !important; padding: .5rem 0 0 0; } div#wv-mobile-switch ul li { display: flex; justify-content: center; margin: 0 !important; width: 100% !important; } @keyframes menuFade { 0% { opacity: 0; height: 0%; } 100% { opacity: 1; height: 100% !important; } } /*New Toc*/ .wv-content .wpj-jtoc-container .wpj-jtoc--title { color: #212529; font-size: 20px; line-height: 23px; margin-bottom: 20px; } .wv-content .wpj-jtoc-container .wpj-jtoc--toc .wpj-jtoc--body { padding: 3px; } .wv-content .wpj-jtoc-container .wpj-jtoc--toc .wpj-jtoc--nav { background-color: #FFF; box-shadow: 0px 0px 6px #00000014; border: 1px solid #F1F3EB; padding: 0 15px; width: 100%; } .wv-content .container { display: flex; gap: 95px; } .wv-content.finished .custom-post-sidebar { position: absolute; max-width: 285px; top: auto; bottom: 100px; } .wv-content.stick .custom-post-sidebar { position: fixed; max-width: 285px; top: 7dvh; } .wv-content .container .wpj-jtoc-container .wpj-jtoc--body .wpj-jtoc--nav .wpj-jtoc--item { padding: 13px 0 !important; color: #888888; line-height: 1.5; margin: 0 !important; } .wv-content .container .wpj-jtoc-container .wpj-jtoc--body .wpj-jtoc--nav .wpj-jtoc--item:not(:last-child) { border-bottom: 1px solid #F1F3EB; } .wv-content .container .wpj-jtoc-container .wpj-jtoc--body .wpj-jtoc--nav .wpj-jtoc--item a:hover { text-decoration: none; color: #52AE32 !important; } /*Intro Post Section*/ #wpj-jtoc { margin: 0; } .wpj-jtoc-container { width: 30%; max-width: 285px; } .wv-block-intro-container { width: 100%; justify-content: space-between; } .wv-block-intro-container .wv-excerpt { flex-basis: 50%; } .wv-block-intro-container .wv-excerpt p, .wv-block-intro-container .wv-excerpt strong { font-family: 'PT Serif', sans-serif; font-size: 20px; line-height: 28px; letter-spacing: 0.1px; } .wv-block-intro-container .ad-content-rectangle { flex-basis: 300px; margin: 5px; margin-top: 15px; } /*Steckbrief Styling*/ #gf025-block_9943716173c6a2c1274e96f75ec486d3 { max-width: 740px; } .gf025 .steckbrief-container { display: flex; flex-wrap: wrap; background-color: #FBFBFB; padding: 40px 15px; } .gf025 .steckbrief-subcontainer { width: 50%; display: flex; align-items: center; margin-bottom: 25px; } .gf025 .steckbrief-subcontainer p { width: 100%; font-family: 'Montserrat', sans-serif; } .gf025 .steckbrief-subcontainer img { width: 65px; height: 65px; margin-right: 30px; } .gf025 .steckbrief-subcontainer-text { width: 60%; border-bottom: 1px solid #BABABA; } .gf025 .steckbrief-title { font-weight: bold; margin: 0; } @media(max-width: 620px) { .gf025 .steckbrief-container { max-width: 350px; } .gf025 .steckbrief-subcontainer { width: 100%; } .gf025 .steckbrief-subcontainer-text { width: 70%; } } /*Moodboard*/ .first-moodboard-container, .second-moodboard-container { display: flex; margin: 40px 0; align-items: flex-start; } .first-moodboard-container .text-container, .second-moodboard-container .text-container { height: 100%; display: flex; flex-direction: column; align-items: flex-end; margin-right: 20px; } .second-moodboard-container .text-container { align-items: flex-start; margin-right: 0; margin-left: 20px; } .first-moodboard-container .text-container img, .second-moodboard-container .text-container img { max-width: 55px; } .first-moodboard-container .moodboard-text, .second-moodboard-container .moodboard-text { color: #52AE32; font-size: 24px; margin: 0; text-align: right; font-family: tornac-regular, sans-serif; } .second-moodboard-container .moodboard-text { text-align: left; } .moodboard-img-container, .moodboard-container img { max-width: 455px; } .moodboard-img-container { position: relative; } .moodboard-img-container p { position: absolute; bottom: 0; right: 10px; z-index: 300; color: #fff; text-align: center; font-size: 0.8rem; line-height: 1.4; } @media (max-width: 920px) { .first-moodboard-container { flex-direction: column; align-items: center; } .moodboard-img-container, .moodboard-img-container img { max-width: 100%; } .second-moodboard-container { flex-direction: column-reverse; align-items: center; } .moodboard-container .text-container img { display: none; } .first-moodboard-container .text-container p, .second-moodboard-container .text-container p { text-align: center; margin-bottom: 20px; } } /*Cross Selling*/ .cross-posts .cross-posts-content { display: flex; gap: 18px; } .cross-posts .cross-posts-item { width: 33%; } .cross-posts .cross-posts-item a { text-decoration: none; } .cross-posts .cross-posts-item img { width: 100%; height: auto; } .cross-post-title { margin-top: 10px; } /*New Hint*/ .hint-with-text-container { display: flex; } .hint-with-text-container .rosa-hint-container, .hint-with-text-container .hint-long-text { flex-basis: 50%; } .hint-with-text-container .rosa-hint-container { background-color: #FFF6F9; padding: 30px 35px; height: 100%; } .hint-with-text-container .hint-long-text p { padding-right: 20px; } .hint-with-text-container .rosa-hint-container .hint-title { font-family: tornac-regular, sans-serif; color: #E5007D; padding: 0 !important; } @media (max-width: 920px) { .hint-with-text-container { display: flex; flex-direction: column; } .hint-with-text-container .rosa-hint-container, .hint-with-text-container .hint-long-text { flex-basis: 100%; } .hint-with-text-container .rosa-hint-container { margin-bottom: 40px; } } /*Post Mobile Breack*/ @media (max-width: 992px) { .wv-content.stick .custom-post-sidebar, .wv-content.finished .custom-post-sidebar { position: static; } .wv-content .container { flex-wrap: wrap; gap: 50px; width: 100%; } .yoast-reading-time__wrapper.custom, .yoast-reading-time__spacer { display: none; } .wv-content .wv-block-content, .wv-content .wpj-jtoc-container { width: 100%; } .estimated-time-social-container .yoast-container { flex-wrap: wrap } .wv-block-intro-container .wv-excerpt { margin-bottom: 40px; } .gf025 .joli-heading { padding: 0; } .gf025 .steckbrief-container { padding-top: 10px; } } @media (max-width: 668px) { .wv-block-intro-container .ad-content-rectangle { flex-basis: 100%; flex-direction: column; margin: 0; justify-content: flex-start; } .wv-block-intro-container { flex-direction: column; } } @media (max-width: 570px) { .estimated-time-social-container, .estimated-time-social-container, .author-social-container { flex-direction: column; } .cross-posts-content { flex-direction: column; } .cross-posts .cross-posts-item { width: 100%; } } @media(max-width: 360px) { .estimated-time-social-container, .author-social-container { justify-content: flex-start; align-items: flex-start; } .estimated-time-social-container .yoast-container { align-items: flex-start; justify-content: flex-start; } .estimated-time-social-container .wv-head-social.wv-single-social { padding: 0; } .wv-hero .wv-hero-headline, .wv-video-hero .wv-hero-headline { padding: 0; } .second-moodboard-container .text-container { margin-left: 0; } .wv-content { padding-bottom: 50px; } } /*Social Icons*/ .shariff li { background-color: white !important; } .shariff li.twitter:hover { background-color: #32bbf5 !important; } .shariff li.facebook:hover { background-color: #4273c8 !important; } .shariff li.pinterest:hover { background-color: #e70f18 !important; } /*Changes 12.04.23*/ /*Breadcrumbs*/ p#breadcrumbs { font-size: 13px; } /*TOC*/ .--jtoc-is-active>.wpj-jtoc--item-content>a { font-weight: bold; } .breakable-table td { border: 1px solid; padding: 5px; } .breakable-table tbody> :first-child td { font-weight: bolder; } @media (max-width: 768px) { .breakable-table td::before { content: attr(data-label); word-wrap: break-word; background: #eee; border-right: 2px solid black; padding: 1em; font-weight: bold; margin-right: 10px; display: flex; display: -webkit-flex; flex-wrap: wrap; align-items: center; hyphens: auto; -webkit-hyphens: auto; height: 100%; } .breakable-table td { width: 100%; padding: 0; display: grid; align-items: center; grid-template-columns: 50% 50%; hyphens: auto; -webkit-hyphens: auto; } .breakable-table tr { float: left; width: 100%; margin-bottom: 2em; } .breakable-table tbody>:first-child { display: none; } .gf020-bg { display: none; } } /*Garten Kategorie*/ .wv-content.wv-content-cat .wv-block-content { margin: 0 auto; } .garten-header { margin-top: 30px; width: 100%; text-align: center; } .monat-item { width: 262px; height: 262px; position: relative; } .monat-item a div { position: absolute; margin: 0 auto; left: 0; right: 0; top: 39%; text-align: center; color: white; font-size: 35px; } .monats-container { display: flex; position: relative; margin: 0 auto; flex-wrap: wrap; gap: 20px; margin-bottom: 30px; margin-top: 20px; justify-content: center; } .monats-kachel img { transition: transform ease .4s; object-fit: contain; } .monat-item:hover { transform: scale(1.02); } .monat-item { transition: all 0.1s ease; } .monats-kachel::before { content: ""; width: 100%; height: 100%; display: block; position: absolute; background-color: #000; opacity: 0.2; } @media(max-width: 573px) { .monat-item { width: 190px; height: 190px; position: relative; } .monat-item a div { font-size: 30px; } } @media(max-width: 523px) { .monats-container { justify-content: center; } } @media (max-width: 430px) { .monats-container { column-gap: 0; justify-content: space-between; } .monat-item { width: 47%; height: auto; aspect-ratio: 1 / 1; } .monat-item a div { font-size: 26px; } } @media (max-width: 360px) { .monat-item a div { font-size: 22px; } } .gf-logo img { aspect-ratio: auto 361 / 53; } .gf020 img { aspect-ratio: auto 312 / 421; } .gf003 img { aspect-ratio: auto 1181 / 21; } .wv-mobile ul#menu-impressum { justify-content: center; align-items: center; } .wv-mobile ul#menu-impressum li { width: 100% !important; max-width: 100% !important; justify-content: center !important; align-items: center !important; padding: 0 !important; display: flex !important; } .wv-mobile ul#menu-impressum li a { width: 100% !important; max-width: 100% !important; justify-content: center; } /*Garten Kategorie*/ .garten-header { margin-top: 30px; width: 100%; text-align: center; } .monat-item { width: 262px; height: 262px; position: relative; } .monat-item a div { position: absolute; margin: 0 auto; left: 0; right: 0; top: 39%; text-align: center; color: white; font-size: 35px; } .monats-container { display: flex; position: relative; margin: 0 auto; flex-wrap: wrap; gap: 20px; margin-bottom: 30px; margin-top: 20px; justify-content: center; } .monats-kachel img { transition: transform ease .4s; object-fit: contain; } .monat-item:hover { transform: scale(1.02); } .monat-item { transition: all 0.1s ease; } .monats-kachel::before { content: ""; width: 100%; height: 100%; display: block; position: absolute; background-color: #000; opacity: 0.2; } .wv-content-cat .row.restricted-width { margin: 0 calc(10% - 15px); } .wv-content.wv-content-cat .wv-block-content.restricted-width { margin: 0 10%; } .wv-content.wv-content-cat .wv-block-content { margin: 0; } @media(max-width: 573px) { .monat-item { width: 190px; height: 190px; position: relative; } .monat-item a div { font-size: 30px; } } @media(max-width: 523px) { .monats-container { justify-content: center; } } @media (max-width: 430px) { .monats-container { column-gap: 0; justify-content: space-between; } .monat-item { width: 47%; height: auto; aspect-ratio: 1 / 1; } .monat-item a div { font-size: 26px; } } @media (max-width: 360px) { .monat-item a div { font-size: 22px; } } /*Authors*/ .author-container { display: flex; gap: 20px; margin-bottom: 20px; } .author-container .author-name a, .author-container .author-wrapper { color: #5d5d5d; font-weight: 600; text-decoration: none; } .author-container .author-name { line-height: 18px; display: flex; flex-direction: row; gap: 4px; } .author-container .image-container img { width: 50px; height: 50px; border-radius: 50%; object-fit: cover; } .author-text-container { font-size: 15px; } /*Pagination author page*/ .wv-related-posts-slider { margin-left: 0; margin-right: 0; } .wv-related-posts-slider .wv-excerpt { padding-left: 0; padding-right: 0; } .wv-related-posts-slider .post-wrapper { display: flex; flex-direction: row; gap: 20px; } .wv-related-posts-slider .author_pagination { width: 100%; text-align: center; } .wv-related-posts-slider .author_pagination .page-numbers { line-height: 2rem; font-size: .6rem; text-align: center; width: 2rem; height: 2rem; margin: 0 0.25rem; display: inline-block; color: #52AE32; background-color: #eee; border-radius: 2rem; } .wv-related-posts-slider .author_pagination .page-numbers.next { width: auto; padding: 0 1rem; } .wv-related-posts-slider h2 { font-size: 28px; font-weight: 500; } .wv-related-posts-slider .author_pagination .page-numbers.current { line-height: 2rem; font-size: .6rem; text-align: center; width: 2rem; height: 2rem; margin: 0 0.25rem; display: inline-block; color: #fff; background-color: #52AE32; border-radius: 2rem; } .hero-author-container { display: flex; flex-direction: row; justify-content: space-between; gap: 20px; margin-top: 70px; } .hero-author-container .author-image-container img { width: 360px; height: 360px; object-fit: cover; } .hero-author-container .author-infos-container { width: 55%; } .hero-author-container .author-infos-container h1 { padding-bottom: 4px; } .hero-author-container .author-infos-container .author-tags { font-size: 24px; font-weight: 500; margin-bottom: 20px; color: #5d5d5d; } .hero-author-container .author-infos-container .author-info { font-size: 20px; line-height: 30px; font-weight: 500; color: #5d5d5d; } .wv-related-posts-slider .post-wrapper { width: 100%; } @media(min-width: 992px) { .wv-related-posts-slider .post-wrapper .wv-excerpt { max-width: 33%; } } @media(max-width: 900px) { .wv-block-related-posts .post-wrapper { flex-wrap: wrap; width: 100%; } .wv-block-related-posts .wv-excerpt { max-width: 48%; flex-basis: auto; flex-grow: unset; } .quote-block .gf002-icon { top: 23%; left: 120px; } .hero-author-container { flex-direction: column; } .hero-author-container .author-image-container, .hero-author-container .author-infos-container { width: 100%; } .hero-author-container .author-image-container { display: flex; justify-content: center; } .hero-author-container .author-infos-container .author-info { font-size: 12.8px; line-height: 1.7; } } @media(max-width: 776px) { .wv-block-related-posts .wv-excerpt { max-width: 100%; flex-basis: auto; flex-grow: unset; } } @media(max-width: 400px) { .hero-author-container .author-image-container img { width: 250px; height: 250px; } .quote-block .gf002-icon { top: 45px; left: 120px; } } /* Seedcalendar */ .seedcalendar-legend { text-align: right; font-size: 16px; color: #555; font-weight: 500; line-height: 22px; display: flex; flex-direction: column; border: 2px solid #52ae3282; padding: 15px; } .seedcalendar-legend-line { width: 40px; height: 6px; display: inline-block; border-radius: 1px; margin-left: 20px; margin-bottom: 2px; } .seedcalendar-container { margin-bottom: 100px; } .seedcalendar-container .pink { background-color: #E5017D } .seedcalendar-container .green { background-color: #83D867 } .seedcalendar-container .grey { background-color: #555; } .seedcalendar-header { margin-top: 14px; background-color: #50AD32; display: flex; align-items: center; justify-content: space-between; border-bottom: 2px solid #FCFCFC; } .seedcalendar-header .seedcalendar-name { font-size: 24px; font-weight: 700; line-height: 44px; } .seedcalendar-header .seedcalendar-name, .seedcalendar-content .seedcalendar-item-name { width: 16.67%; padding-left: 18px; } .seedcalendar-header .seedcalendar-months { font-size: 19px; font-weight: 700; padding: 7px 0; } .seedcalendar-header .seedcalendar-months, .seedcalendar-content .seedcalendar-item-months { display: flex; width: 53.33%; text-align: center; justify-content: space-between; } .seedcalendar-header .seedcalendar-meta, .seedcalendar-content .seedcalendar-item-meta{ display: flex; width: 30%; text-align: center; } .seedcalendar-header .seedcalendar-meta .seedcalendar-meta-aussaat, .seedcalendar-item-meta .seedcalendar-item-meta-aussaat { width: 23%; } .seedcalendar-header .seedcalendar-meta .seedcalendar-meta-aussaattiefe, .seedcalendar-item-meta .seedcalendar-item-meta-aussaattiefe{ width: 36%; } .seedcalendar-header .seedcalendar-meta .seedcalendar-meta-keimtemperatur, .seedcalendar-item-meta .seedcalendar-item-meta-keimtemperatur { width: 30%; } .seedcalendar-header .seedcalendar-meta .seedcalendar-meta-abstand, .seedcalendar-item-meta .seedcalendar-item-meta-abstand { width: 34%; } .seedcalendar-header .seedcalendar-meta div { writing-mode: vertical-rl; -webkit-transform: rotate(180deg); transform: rotate(180deg); -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; display: flex; justify-content: center; align-items: center; max-height: 104px; word-break: break-word; hyphens: auto; font-size: 16px; font-weight: 700; padding: 5px 0; line-height: normal; } .seedcalendar-header .seedcalendar-months span{ writing-mode: vertical-rl; -webkit-transform: rotate(180deg); transform: rotate(180deg); -webkit-transform-origin: 50% 50%; transform-origin: 50% 50%; width: 100%; display: flex; justify-content: center; align-items: center; } .seedcalendar-header div { color: #fff; } .seedcalendar-content { background-color: #F2F2F2; } .seedcalendar-content .seedcalendar-item { display: flex; align-items: center; justify-content: space-between; } .seedcalendar-item-line { position: absolute; height: 7px; border-radius: 1px; } .seedcalendar-item-line.grey { top: 7px; } .seedcalendar-item-line.green { top: 18px; } .seedcalendar-item-line.pink { top: 29px; } .seedcalendar-content .seedcalendar-item-name { font-size: 16px; color: #50AD32; font-weight: 500; padding-top: 10px; padding-bottom: 10px; } @media screen and (min-width: 997px){ .seedcalendar-content .seedcalendar-item-name, .seedcalendar-content .seedcalendar-item-month, .seedcalendar-item-meta > div { min-height: 44px; } } .seedcalendar-item-meta > div { display: flex; justify-content: center; align-items: center; } .seedcalendar-content .seedcalendar-item-months { position: relative; } .seedcalendar-content .seedcalendar-item-month { padding: 10px 0; width: 100%; } .seedcalendar-content .seedcalendar-item-meta { font-size: 16px; text-align: center; font-weight: 500; color: #8C8C8C; } .seedcalendar-content .seedcalendar-item-month span { display: none; } .seedcalendar-content .seedcalendar-item-name a { text-decoration: none; } @media(max-width: 996px) { .seedcalendar-header { display: none; } .seedcalendar-legend .seedcalendar-legend-item { display: flex; flex-direction: row-reverse; justify-content: flex-end; align-items: center; } .seedcalendar-legend-line { margin-left: 0; margin-right: 6px; margin-bottom: 0; } .seedcalendar-content .seedcalendar-item { flex-direction: column; } .seedcalendar-content .seedcalendar-item-name, .seedcalendar-header .seedcalendar-name, .seedcalendar-content .seedcalendar-item-months, .seedcalendar-header .seedcalendar-name, .seedcalendar-content .seedcalendar-item-meta { width: 100%; } .seedcalendar-content .seedcalendar-item-name { font-size: 22px; line-height: normal; height: 100%; padding-top: 10px; padding-bottom: 10px; padding-left: 10px; background-color: rgba(80, 173, 50, 0.05); } .seedcalendar-content { background-color: transparent; } .seedcalendar-content .seedcalendar-item-month span { display: block; font-size: 16px; font-weight: 500; color: #EEE; font-variant-numeric: lining-nums tabular-nums; } .seedcalendar-content .seedcalendar-item-month { border-left: 1px solid #EEE; } .seedcalendar-content .seedcalendar-item-months { border-right: 1px solid #EEE; border-top: 1px solid #EEE; border-bottom: 1px solid #EEE; margin-top: 3px; } .seedcalendar-item-meta .seedcalendar-item-meta-aussaat, .seedcalendar-item-meta .seedcalendar-item-meta-aussaattiefe, .seedcalendar-item-meta .seedcalendar-item-meta-keimtemperatur, .seedcalendar-item-meta .seedcalendar-item-meta-abstand { width: 33.33%; background-color: rgba(229, 1, 125, 0.05); } .seedcalendar-item-meta { gap: 2px; margin-top: 3px; } .seedcalendar-item-meta > div { border: none; flex-direction: column-reverse; padding: 10px 13px; height: auto; align-self: stretch; } .seedcalendar-item-meta div::before { content: attr(data-label); word-break: break-word; width: 100%; display: block; line-height: normal; font-size: 12px; color: #E5017D; hyphens: auto; } .seedcalendar-container { margin-bottom: 30px; } .seedcalendar-legend { margin-top: 0; } } @media(max-width: 460px) { .seedcalendar-content .seedcalendar-item-month { height: 100%; padding: 4px 0; } .seedcalendar-item-line { height: 5px; } .seedcalendar-item-line.grey { top: 6px; } .seedcalendar-item-line.green { top: 13px; } .seedcalendar-item-line.pink { top: 20px; } } .seedcalendar-text-container{ display: flex; justify-content: space-between; align-items: end; gap: 1.5rem; } .seedcalendar-text { max-width: 800px; } .seedcalendar-text p { margin-bottom: 0; } .seedcalendar-content .seedcalendar-item:nth-child(odd){ background-color: white; } .seedcalendar-legend-item { width: 250px; } .seedcalendar-content { margin-top: 2rem; } @media (max-width: 767px){ .seedcalendar-text-container { flex-flow: row wrap; } } @media (min-width: 997px){ .seedcalendar-item-month, .seedcalendar-item-meta > div { position: relative; } .seedcalendar-item-month::before, .seedcalendar-item-meta > div::before { content:""; position:absolute; left: 0; top: -2rem; width: 2px; background-color: #FCFCFC; height: 100px; } .seedcalendar-item { overflow: hidden; } .seedcalendar-item-line { z-index: 5; } }