.component_top{ position:absolute; left:50%; top:45px; transform:translateX(-50%); transition:top 1s} .component_top a{ display:block; padding:0} .component_top img{ display:block; height:32px; width:108px} @media only screen and (min-width:1025px){ .scrolled .component_top{ top:24px} .layout_2 .component_top{ top:22px} } @media only screen and (max-width:1024px){ .component_top{ top:18px} .component_top img{ height:24px; width:82px} } @media only screen and (max-width:639px){ .component_top{ top:18px} .component_top img{ height:18px; width:70px} } .component_top_navi{ padding:24px 0 0 20px} .component_top_navi ul{ list-style-type:none; margin:0; padding:0} .component_top_navi ul li{ padding:0; margin:0; display:inline-block; vertical-align:top} .component_top_navi ul.menue_table>li{ position:relative} .component_top_navi a{ color:var(--color-white); font-family:NHaasGroteskDsPro,serif; font-size:16px; line-height:1.5; letter-spacing:.32px; text-transform:uppercase} .component_top_navi a.menue:link,.component_top_navi a.menue:visited,.component_top_navi a.menue:hover,.component_top_navi a.menue:focus{ display:block; position:relative} .component_top_navi a.menue.naviSecondButton:after,.component_top_navi a.navi_link.naviThirdButton:after{ content:" +"} #naviMobile{ display:none} .component_top_navi li .naviSecond,.component_top_navi li .naviThird{ display:none} .component_top_navi li .naviSecond li,.component_top_navi li .naviThird li{ display:block} .component_top_navi li .naviSecond>li a,.component_top_navi li .naviThird>li a{ font-family:ACaslonPro,serif; display:block; white-space:nowrap; padding:0; color:var(--color-white); line-height:35px; transition:color .1s; text-transform:none; font-style:italic} @media only screen and (min-width:1024px){ .component_top_navi{ padding:48px 24px 0; transition:padding-top 1s} .scrolled .component_top_navi,.layout_2 .component_top_navi{ padding-top:27px} .menue_table_container{ max-width:1225px; margin:0 auto; display:flex; justify-content:space-between} .menue_table_container .menue_table:nth-child(1)>li{ margin-right:40px} .menue_table_container .menue_table:nth-child(2)>li{ margin-left:40px} .component_top_navi li:hover>a.menue,.component_top_navi a.menue.active{ opacity:.8} .component_top_navi li .naviSecond{ display:block; position:static; width:100%; padding:0; overflow:hidden; height:0; transition:.2s} .component_top_navi li .naviSecond>li a:hover{ opacity:.8} .component_top_navi li .naviSecond>li a.active{ opacity:.8} .component_top_navi li:hover .naviSecond{ padding:17px 0; height:auto} .component_top_navi li .naviThird{ padding-left:24px} .component_top_navi .naviSecond li.hover .naviThird{ display:block} } @media only screen and (max-width:1024px){ .component_top_navi{ padding:20px 0 0 30px !important} #naviMobile{ display:block; position:relative; width:35px; height:28px; cursor:pointer; z-index:11} #naviMobile::before,#naviMobile::after,#naviMobile>span::before{ content:""; border-bottom:2px solid var(--color-white); position:absolute; left:0; width:22px} #naviMobile::before{ top:5px; transition-property:top,transform; transition-duration:.3s,.3s; transition-delay:.3s,0s; width:12px} #naviMobile::after{ bottom:5px; transition-property:bottom,transform; transition-duration:.3s,.3s; transition-delay:.3s,0s; width:12px; left:10px} #naviMobile>span::before{ transition:opacity .3s} #naviMobile>span::before{ top:50%; margin-top:-1px} .NavOpened #naviMobile::before{ top:50%; transform:rotate(45deg); transition-delay:0s,.3s; width:20px; left:2px} .NavOpened #naviMobile::after{ bottom:calc(50% - 2px); transform:rotate(-45deg); transition-delay:0s,.3s; width:20px; left:2px} .NavOpened #naviMobile>span::before{ opacity:0} .component_top_navi .menue_table_container{ display:block; position:fixed; top:64px; left:0; bottom:0; right:0; z-index:-1; padding-top:20px; background:linear-gradient(180deg, rgba(60, 64, 48, 0.9) 0%, rgba(60, 64, 48, 0.5) 100%); overflow:scroll; opacity:0; transition:.4s; transform:translateY(-100%)} .NavOpened .component_top_navi .menue_table_container{ transform:translateY(0); opacity:1} .component_top_navi ul li{ display:block; width:100%; text-align:center; position:relative; padding:0 !important} .component_top_navi a.menue:link,.component_top_navi a.menue:visited,.component_top_navi a.menue:hover,.component_top_navi a.menue:focus{ line-height:35px; font-size:22px; display:inline-block; margin-bottom:10px} } @media only screen and (max-width:639px){ .component_top_navi{ padding:18px 0 0 24px !important} #naviMobile{ height:22px} .component_top_navi .menue_table_container{ top:56px} } @media only screen and (max-height:380px){ .component_top_navi ul.menue_table{ padding-top:20px} } .layout_1 .component_site{ padding:0} @media only screen and (max-width:1024px){ .layout_1 .component_site{ padding:0} } .component_footer{ background:#3c4030; padding:120px var(--template-gutter-size) var(--template-gutter-size)} .component_footer .footer_container{ text-align:center; margin:0 auto; max-width:1225px} .component_footer .footer_container img{ display:inline-block; height:32px; width:108px} .component_footer .footer_menue_1{ margin-top:120px; display:flex; flex-wrap:wrap; justify-content:center; gap:40px} .component_footer .footer_menue_1 a{ color:var(--color-white); font-family:NHaasGroteskDsPro,serif; font-size:16px; font-style:normal; font-weight:500; line-height:150%; letter-spacing:.32px; text-transform:uppercase; transition:opacity .3s} .component_footer .footer_menue_1 a:hover,.component_footer .footer_menue_1 a.active{ opacity:.8} .component_footer .footer_social{ margin:40px auto; display:flex; justify-content:center; gap:16px} .component_footer .footer_social a{ width:32px; height:32px; background-position:center; background-repeat:no-repeat; background-size:contain; transition:opacity .3s} .component_footer .footer_social a:hover{ opacity:.8} .component_footer .footer_social a.button_fb{ background-image:url(/images/icons/icon_facebook.svg)} .component_footer .footer_social a.button_tw{ background-image:url(/images/icons/icon_twitter.svg)} .component_footer .footer_social a.button_in{ background-image:url(/images/icons/icon_instagram.svg)} .component_footer .footer_social a.button_yt{ background-image:url(/images/icons/KOBR_social-icon_youtube_white_01.svg)} .component_footer .footer_navi_1{ display:flex; justify-content:center; gap:40px} .component_footer .footer_navi_1 a{ font-family:ACaslonPro,serif; color:#aeb2a1; font-size:16px; font-style:italic; font-weight:600; line-height:150%; letter-spacing:.32px; transition:opacity .3s} .component_footer .footer_navi_1 a:hover,.component_footer .footer_navi_1 a.active{ opacity:.8} .component_footer .footer_navi_2{ margin-top:40px; display:flex; flex-direction:column; justify-content:center} .component_footer .footer_navi_2 .footer_copyright{ font-family:ACaslonPro,serif; color:var(--color-white); font-size:16px; font-style:italic; font-weight:normal; line-height:1.4; letter-spacing:.32px; opacity:.4} .component_footer .footer_navi_2 .footer_pm{ opacity:.4} .component_footer .footer_navi_2 .footer_pm,.component_footer .footer_navi_2 .footer_pm a{ color:var(--color-white); font-size:13px; font-weight:normal; line-height:1.4; letter-spacing:.39px; text-transform:uppercase} @media screen and (max-width:1024px){ .component_footer{ padding-top:80px} .component_footer .footer_menue_1{ margin-top:80px} } @media screen and (max-width:768px){ .component_footer{ padding-top:40px} .component_footer .footer_menue_1{ margin-top:40px} } @media screen and (max-width:639px){ .component_footer{ padding-bottom:16px} .component_footer .footer_container img{ height:24px; width:90px} .component_footer .footer_menue_1{ gap:12px} .component_footer .footer_menue_1 a{ font-size:14px} .component_footer .footer_social{ margin:32px auto} .component_footer .footer_navi_1{ gap:12px} .component_footer .footer_navi_1 a{ font-size:14px} .component_footer .footer_navi_2{ margin-top:24px} } .content_component_12{ position:relative} .content_component_12 .template_headlines{ position:absolute; bottom:80px; left:50%; transform:translateX(-50%); padding:8px 40px 2px; border:2px solid var(--color-white); border-radius:48px; text-align:center} .content_component_12 .template_headlines *{ color:var(--color-white)} @media screen and (max-width:1023px){ .content_component_12 .template_headlines{ padding-top:10px} } @media screen and (max-width:639px){ .content_component_12{ padding:280px 10px 0; text-align:center; background:var(--color-kobr-darkgreen)} .content_component_12 .template_headlines{ position:static; transform:none; display:inline-block; margin:10px auto 0; padding-top:5px} .content_component_12 .template_headlines h1{ font-size:20px} } .component_topbild .toppic_box{ width:100%} .component_topbild img{ display:block; width:100%} .component_topbild .module_path{ position:absolute; bottom:30px; left:0; right:0; text-align:center} .component_topbild .module_path a{ font-family:ACaslonPro,serif; color:var(--color-white); font-size:14px; font-weight:bold; font-style:italic; line-height:1.3; margin-right:5px; letter-spacing:.28px} .component_topbild .module_path a:after{ content:">"; display:inline-block; padding-left:5px} .component_topbild .module_path a.path_active{ font-family:NHaasGroteskDsPro,serif; font-weight:bold; font-style:normal; margin-right:0} .component_topbild .module_path a.path_active:after{ display:none} .component_topbild .module_path a:hover{ opacity:.8} @media screen and (max-width:639px){ .component_topbild .toppic_box{ position:absolute; top:0; left:0; height:280px; overflow:hidden; border-bottom:1px solid var(--color-white)} .component_topbild .toppic_box img{ object-fit:cover; width:100%; height:100%} .component_topbild .module_path{ position:static; margin:8px 10px 0; padding-bottom:12px} } .teaser{ color:#fff; position:relative; width:100%; margin:-5px} .teaser .teaser-background{ position:absolute; top:0; bottom:0; width:calc(100vw + 10px); background-position:center; background-repeat:no-repeat; background-size:cover; filter:blur(12px)} .teaser .teaser-contents{ display:flex; position:relative; top:0; width:calc(min(100vw, var(--content-max-width)) + 10px); height:fit-content; flex-direction:row-reverse; background-color:rgba(60,64,48,.4); padding-left:calc((100vw - var(--content-max-width)) / 2); padding-right:calc((100vw - var(--content-max-width)) / 2)} .teaser .teaser-contents .content_sitename{ color:#fff; border:2px solid #fff; border-radius:80px; text-align:center; padding:5px 34px 0; width:fit-content; font-family:ACaslonPro,serif; font-size:24px; font-style:italic; font-weight:normal; line-height:150%; letter-spacing:.48px} .teaser .teaser-contents .content_sitename>span:nth-child(even){ font-family:NHaasGroteskDsPro,sans-serif; font-style:normal; font-weight:bold} @media only screen and (max-width:639px){ .teaser .teaser-contents .content_sitename{ font-size:20px; padding:0 24px} } .teaser .teaser-contents .content_text{ padding:30px 0} .teaser .teaser-contents .content_text>div:nth-child(2){ margin-left:30%} .teaser .teaser-contents .content_text>div:nth-child(3){ margin-left:8%} .teaser .teaser-contents .content_text i{ font-size:21px; line-height:140%} @media only screen and (max-width:639px){ .teaser .teaser-contents .content_text i{ font-size:18px} } .teaser .teaser-contents .content-learn-more{ padding:7.5px 12px 12px; border-bottom:1px solid #fff; width:fit-content} .teaser .teaser-contents .content-learn-more a,.teaser .teaser-contents .content-learn-more{ color:#fff; font-weight:500; line-height:1} .teaser .teaser-contents .content-learn-more a i,.teaser .teaser-contents .content-learn-more i{ font-weight:600; font-size:22px; line-height:1} @media only screen and (max-width:639px){ .teaser .teaser-contents .content-learn-more a i,.teaser .teaser-contents .content-learn-more i{ font-size:18px} } .teaser .teaser-contents .teaser-text{ align-self:end; flex-grow:1; width:50%; height:fit-content; display:flex; align-content:center} .teaser .teaser-contents .teaser-text .teaser-text-inner .content_text{ white-space:nowrap} .component_teaser_single a,.component_teaser_single *{ color:#fff !important} .component_teaser_single .teaser-contents .teaser-image-wrapper{ position:relative; height:fit-content; text-align:center; align-self:center; padding:120px 10px} .component_teaser_single .teaser-contents .teaser-image-wrapper .teaser-image img{ height:622px} .component_teaser_single .teaser-contents .teaser-text{ padding-bottom:100px} @media only screen and (max-width:1300px){ .component_teaser_single .teaser-contents{ flex-direction:column !important} .component_teaser_single .teaser-contents .teaser-image-wrapper{ width:unset; padding-bottom:20px} .component_teaser_single .teaser-contents .teaser-text{ height:fit-content !important; align-self:center !important; justify-content:center} .component_teaser_single .teaser-contents .teaser-image img{ height:500px} } @media only screen and (max-width:639px){ .component_teaser_single .teaser .teaser-contents{ width:100%; box-sizing:border-box; padding:32px 0} .component_teaser_single .teaser .teaser-contents .teaser-text{ width:100%; box-sizing:border-box; padding:0 24px; text-align:center} .component_teaser_single .teaser .teaser-contents .teaser-text .teaser-text-inner .content_text{ white-space:normal} .component_teaser_single .teaser .teaser-contents .content_text>div:nth-child(2){ margin-left:0} .component_teaser_single .teaser .teaser-contents .content_text>div:nth-child(3){ margin-left:0} .component_teaser_single .teaser .teaser-contents .content-learn-more{ margin:0 auto} .component_teaser_single .teaser .teaser-contents .teaser-image-wrapper{ padding:0 0 24px} .component_teaser_single .teaser .teaser-contents .teaser-image img{ height:auto; width:100%; max-width:196px; margin:0 auto} } .quick_register_reader_form{ background:url("/images/newsletter/Rectangle 680.png") no-repeat center; background-size:cover; height:fit-content; width:unset; max-width:unset; color:#fff; padding:84px 20px; display:flex; flex-direction:column; align-items:center; text-align:center} .quick_register_reader_form>*>*{ margin:auto; width:fit-content; color:#fff} .quick_register_reader_form form{ color:#fff} .quick_register_reader_form .headline{ font-size:24px; line-height:150%; letter-spacing:.48px; border:2px solid #fff; border-radius:80px; padding:5px 32px 0; margin-bottom:56px; color:#fff; width:fit-content} .quick_register_reader_form .content-upper,.quick_register_reader_form .content-lower{ font-family:NHaasGroteskDsPro,serif; letter-spacing:.66px; line-height:130%; text-align:center} .quick_register_reader_form .content-upper{ padding-bottom:20px} .quick_register_reader_form .content-lower{ padding-bottom:80px} .quick_register_reader_form .form-row{ display:flex} .quick_register_reader_form .form-row .row{ width:410px; display:flex; height:61px; padding-top:10px} .quick_register_reader_form .form-row .row label{ display:none} .quick_register_reader_form .form-row .row input{ font-family:NHaasGroteskDsPro,serif; border:none; border-bottom:1px solid #fff} .quick_register_reader_form .form-row .row input::placeholder{ opacity:1 !important; color:var(--color-white) !important} .quick_register_reader_form .form-row .row input::-webkit-input-placeholder{ opacity:1 !important; color:var(--color-white) !important} .quick_register_reader_form .form-row .submit_button{ display:flex; justify-content:center; align-items:center; font-family:NHaasGroteskDsPro,serif; background-color:#fff; border-radius:90% 100%; height:51px; width:140px; margin:0 0 0 18px; text-transform:uppercase; color:var(--color-kobr-blue); font-size:14px; font-weight:550; line-height:130%; transition:opacity .3s} .quick_register_reader_form .form-row .submit_button:hover{ opacity:.8} @media only screen and (max-width:639px){ .quick_register_reader_form{ padding:32px 20px} .quick_register_reader_form .headline{ font-size:20px; padding:0 24px; margin-bottom:24px} .quick_register_reader_form .form-row{ flex-direction:column; align-items:center; width:100%} .quick_register_reader_form .form-row .row{ width:100%} .quick_register_reader_form .form-row .submit_button{ margin:0} .quick_register_reader_form .content-lower{ padding-bottom:40px} }