/* DRYNET frontend styles for the Divi 5 build (formerly Simple CSS + GenerateBlocks global styles) Loaded after Divi; Divi's per-module CSS is printed inline/deferred, so selectors here carry extra specificity (.et_pb_module / .et_pb_accordion …) or !important where Divi's generated rules otherwise win. Icon glyphs are CSS masks (currentColor) of the old site's SVGs: FontAwesome check-circle / calendar-alt, Phosphor check-square / arrow-right / plus-square / minus-square. */ /* --- Home hero: headline over the photo, gradient + tint, parallax variables (drynet.js) --- */ .drynet-hero{position:relative;isolation:isolate;display:grid;aspect-ratio:3/2;--px:0px;--py:0px;--pr:0deg} .drynet-hero>.et_pb_row{grid-area:1/1;width:100%;max-width:none} .drynet-hero__media{position:relative;z-index:1;min-height:100%} .drynet-hero__media>.et_pb_column,.drynet-hero__image,.drynet-hero__image .et_pb_image_wrap{height:100%;min-height:100%;display:block} .drynet-hero__image img{width:100%;height:100%;object-fit:cover;object-position:center top;filter:opacity(80%)} .drynet-hero__media::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(0deg,#121214 0%,rgba(14,14,20,0) 20%),linear-gradient(to left,rgba(18,18,20,.2),rgba(18,18,20,.2))} .drynet-hero>.et_pb_row:not(.drynet-hero__media){position:relative;z-index:10} .drynet-hero{row-gap:0;gap:0} .drynet-hero>.et_pb_row.drynet-hero__content,.drynet-hero__content{position:relative;z-index:10;align-self:end!important;justify-self:center;margin:0 auto;width:100%;max-width:1264px;padding:4rem 2rem 8rem!important} .drynet-hero h1{margin-bottom:2rem!important;padding-bottom:0;text-wrap:balance;overflow-wrap:normal;word-wrap:normal;word-break:normal} .drynet-hero__sub,.drynet-rule-left{border-left:2px solid #c60047;padding-left:24px;font-weight:500;font-size:18px;line-height:1.5;text-shadow:0 0 10px #09090a;text-wrap:balance;margin:0!important} @media (max-width:1024px){.drynet-hero{aspect-ratio:auto;display:flex;flex-direction:column;row-gap:0;gap:0}.drynet-hero__media{aspect-ratio:3/2;min-height:0}.drynet-hero>.et_pb_row.drynet-hero__content,.drynet-hero__content{padding:2rem!important}} @media (max-width:767px){.drynet-hero>.et_pb_row.drynet-hero__content,.drynet-hero__content{padding:2rem 1.5rem!important}} /* phone: long German words ("Vertrauenswürdige") may hyphenate instead of running off the 12vw headline */ @media (max-width:767px){.drynet-hero h1{overflow-wrap:normal;word-break:normal}.drynet-hero h1:lang(de){hyphens:auto;-webkit-hyphens:auto}} .drynet-hero__circle{position:absolute;left:67%;top:50%;z-index:5;margin-left:var(--px);margin-top:var(--py);transform:translate(-50%,-50%) rotate(var(--pr));transition:transform 140ms ease-out,margin 140ms ease-out;will-change:transform,margin;pointer-events:none} .drynet-hero__circle img{width:clamp(580px,64vw,1500px);max-width:none;height:auto;opacity:0;mix-blend-mode:soft-light;animation:drynetCircleIntro 1.4s ease forwards;animation-delay:2s} @keyframes drynetCircleIntro{0%{opacity:0;transform:rotate(-6deg)}60%{opacity:.65;transform:rotate(8deg)}100%{opacity:.65;transform:rotate(0deg)}} @media (max-width:1024px){.drynet-hero__circle{left:67.5%;top:35%}.drynet-hero__circle img{width:clamp(260px,50vw,720px);opacity:.45}} @media (max-width:768px){.drynet-hero__circle{display:none!important}} /* --- Network nodes canvas (bottom left of the hero) --- */ .nodes-deco{position:absolute;left:20px;bottom:20px;width:min(33vw,640px);height:min(28vw,420px);opacity:.7;pointer-events:none;z-index:6} .nodes-canvas{width:100%;height:100%;display:block} .drynet-hero .et_pb_module.drynet-hero__nodes{position:static!important;height:0;margin:0!important;padding:0} @media (max-width:1024px){.nodes-deco{left:16px;bottom:16px;width:min(46vw,520px);height:min(36vw,340px);opacity:.62}} @media (max-width:768px){.nodes-deco{left:14px;bottom:auto;top:clamp(24px,10vh,120px);width:min(92vw,430px);height:min(60vw,280px);opacity:.38;z-index:3}} @media (prefers-reduced-motion:reduce){.nodes-deco{display:block;opacity:.28}} /* --- Image hero (full-bleed photo) + 200px fade into the dark section below --- */ .drynet-image-hero img,.drynet-image-band img{width:100%;height:auto;display:block} .drynet-fade{position:relative;z-index:5;margin-top:-200px;min-height:200px;background:linear-gradient(180deg,rgba(18,18,20,0) 0%,#121214 75%)} .drynet-fade-image{position:relative} .drynet-fade-image::after{content:"";position:absolute;left:0;right:0;bottom:0;height:200px;pointer-events:none;background:linear-gradient(180deg,rgba(18,18,20,0) 0%,#121214 75%)} /* --- Split hero (About / Contact / Cyber Security Group): text left, photo fills the right column --- */ .drynet-split-hero .et_pb_column{position:relative} .drynet-split-hero__img,.drynet-split-hero__img .et_pb_image_wrap{position:static} .drynet-split-hero__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover} .drynet-hero-box{border-left:1px solid #d2d2d6;border-bottom:1px solid #d2d2d6;padding:0 0 32px 40px;margin-top:0} .drynet-hero-box p:last-child{margin-bottom:0;padding-bottom:0} .drynet-split-hero h1{margin-bottom:2rem!important;padding-bottom:0} .drynet-dim img{filter:opacity(.6)} @media (max-width:980px){.drynet-split-hero__img img{position:static;height:auto}.drynet-hero-box{padding:0 0 24px 30px}} /* --- Sticky service sidebar --- */ @media (min-width:981px){.et_pb_column.drynet-sticky{position:sticky;top:1px;align-self:flex-start}} /* --- Small helpers --- */ .drynet-overflow-hidden{overflow:hidden} html,body{overflow-x:hidden;overflow-x:clip} /* --- Header over the hero --- */ .et-l--header{position:relative;z-index:60} .et-l--header .et_pb_section.drynet-header,.et_pb_section.drynet-header{position:absolute!important;top:0;left:0;right:0;width:100%;z-index:60;background:transparent!important} .drynet-header .et_pb_menu__menu>nav>ul>li>a{color:#fff} .drynet-header .et_pb_menu__wrap{justify-content:center} .drynet-header .pll-parent-menu-item img{vertical-align:middle;margin-right:.35em} /* --- Typography helpers used inside text modules --- */ .drynet-tagline{color:inherit;font-size:.875rem;font-weight:700;letter-spacing:2px;line-height:1.2em;text-transform:uppercase;margin-bottom:1rem!important} .drynet-tagline--light{color:#fff} .drynet-small{font-size:1rem!important;line-height:1.5em!important} .drynet-meta{font-size:.9375rem;font-weight:600;letter-spacing:1px;text-transform:uppercase;margin-bottom:1rem!important} /* --- Check items (FontAwesome regular check-circle, 1em currentColor) --- */ .drynet-check{display:flex;align-items:center;gap:.5em;font-size:1.2rem!important;font-weight:600;line-height:1.5em!important;margin-bottom:1.5rem;padding-bottom:0} .drynet-check::before{content:"";flex:0 0 1em;width:1em;height:1em;background:currentColor;-webkit-mask:url("data:image/svg+xml,") center/contain no-repeat;mask:url("data:image/svg+xml,") center/contain no-repeat} .drynet-check svg{width:1em;height:1em;flex:none;fill:currentColor} .drynet-check--sm{font-size:1rem!important;font-weight:400;margin-bottom:0} /* --- Check lists (two columns, Phosphor check-square outline in var(--check)) --- */ .et-l--body .drynet-checklist,.et_pb_text .drynet-checklist{list-style:none!important;padding-left:0;margin-left:0} .et-l--body .drynet-checklist li,.et_pb_text .drynet-checklist li{list-style:none!important;margin-left:0} .drynet-checklist{display:flex;flex-wrap:wrap;column-gap:2rem;row-gap:1rem;margin:0 0 3rem!important;padding:0!important} .drynet-checklist li,.et_pb_text .drynet-checklist li,.et-l--body .drynet-checklist li,.et_pb_tab .drynet-checklist li{position:relative;flex:1 1 40%;margin:0;padding-left:1.6em!important;font-size:1rem;line-height:1.5em;color:inherit} .drynet-checklist li::before{content:"";position:absolute;left:0;top:.2em;width:1em;height:1em;background:var(--check,#c60047);-webkit-mask:url("data:image/svg+xml,") center/contain no-repeat;mask:url("data:image/svg+xml,") center/contain no-repeat} @media (max-width:767px){.drynet-checklist{flex-direction:column}.drynet-checklist li{flex:1 1 auto}} /* --- Numbered steps 01-04: navy 84x75 badge, text beside it --- */ .drynet-step{display:flex;flex-wrap:wrap;align-items:center;gap:1rem} .drynet-step__no{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-width:84px;padding:1.5rem 1rem;background:#0e0e24;color:#fff;border-radius:8px;font:700 2.8rem/27px Lato,sans-serif;letter-spacing:0} .drynet-step__body{flex:1 1 300px;min-width:0} .drynet-step h4{margin:0 0 .4rem!important;padding:0!important;font-size:1.3125rem} .drynet-step p{margin:0!important;padding:0!important;font-size:1.125rem;line-height:1.5em} @media (max-width:767px){.drynet-step h4{font-size:1.125rem}} /* steps are separate text modules inside a Divi flex column: the column's row-gap (--vertical-gap, usually 1.5rem) already separates them, so the 2.6rem pitch is topped up by the difference (inherit the column's variable, Divi redefines --vertical-gap:30px on every module) */ .drynet-step-wrap+.drynet-step-wrap{--vertical-gap:inherit;margin-top:calc(2.6rem - var(--vertical-gap,0px))!important} .drynet-stack>.drynet-step-wrap+.drynet-step-wrap{margin-top:2.6rem!important} .drynet-stack>.et_pb_module{width:100%} .drynet-step+.drynet-step{margin-top:2.6rem} /* --- Service sub navigation + pillar card: stacked white pills with Phosphor arrow-right --- */ .drynet-linklist,.drynet-pillars,.et_pb_text .drynet-linklist,.et_pb_text .drynet-pillars{display:flex;flex-direction:column;flex-wrap:nowrap;gap:1.2rem;list-style:none!important;padding:0!important;margin:0!important} .et_pb_text .drynet-linklist li,.et_pb_text .drynet-pillars li,.drynet-linklist li,.drynet-pillars li{list-style:none!important;padding-left:0;margin:0} .drynet-linklist li a,.drynet-pillars li a{display:flex;justify-content:space-between;align-items:center;gap:.5em;padding:10px 16px;border:1px solid #d2d2d6;border-radius:6px;background:#fff;color:#09090a;font:600 1.125rem/1.5 Lato,sans-serif;letter-spacing:0;text-transform:none;text-decoration:none;transition:all .5s} .drynet-linklist li a::after,.drynet-pillars li a::after{content:"";flex:0 0 1em;width:1em;height:1em;background:currentColor;-webkit-mask:url("data:image/svg+xml,") center/contain no-repeat;mask:url("data:image/svg+xml,") center/contain no-repeat} .drynet-linklist li a:hover,.drynet-linklist li a:focus,.drynet-pillars li a:hover,.drynet-pillars li a:focus{background:#0e0e24;border-color:#d2d2d6;color:#fff} .drynet-linklist li.is-active a,.drynet-pillars li.is-active a{background:#c60047;color:#fff} .drynet-linklist li.is-active a:hover,.drynet-pillars li.is-active a:hover{background:#0e0e24} /* --- Cards / grids --- */ .drynet-grid>.drynet-card{height:100%}.drynet-card{box-sizing:border-box} .drynet-grid>.et_pb_module{min-width:0} .drynet-card .et_pb_text{padding:0} .drynet-card h2{margin-top:0} .drynet-card>.et_pb_text:not(:last-child) p:last-child{margin-bottom:1.5rem} .et_pb_column>.drynet-card:only-child{flex:1 1 auto} /* --- Post content: full width for Divi pages, 820px column for classic (Gutenberg) posts/guides/legal pages --- */ .drynet-post-content{width:100%;margin:0;align-self:stretch} .drynet-post-content:not(:has(.et-l--post)):not(:has(.et_pb_section)){max-width:820px;margin-left:auto;margin-right:auto;padding:5rem 1.25rem} .drynet-post-content--single{padding:0!important;max-width:none!important;margin:0!important} .drynet-post-content:not(:has(.et_pb_section)) h2,.drynet-post-content:not(:has(.et_pb_section)) h3{margin-top:2rem} .drynet-post-content:not(:has(.et_pb_section)) h2,.drynet-post-content:not(:has(.et_pb_section)) h3{margin-bottom:1.5rem!important} .drynet-post-content:not(:has(.et_pb_section)) h4{margin-bottom:1rem!important} .drynet-post-content .wp-block-image figcaption.wp-element-caption{text-align:center;font-size:.8125em;font-style:italic;color:#4c4c52;margin-top:.5em} .drynet-post-content--single,.drynet-post-content--single p,.drynet-post-content--single li{line-height:1.5em!important} .drynet-post-content--single h2,.drynet-post-content--single h3,.drynet-post-content--single h4{margin-top:0;padding-bottom:0} .drynet-post-content--single h2{font-size:clamp(1.875rem,1.389vw + 1.208rem,2.25rem)} .drynet-post-content--single h3{font-size:clamp(1.313rem,.694vw + .979rem,1.5rem)} .drynet-post-content--single h4{font-size:clamp(1.125rem,.694vw + .792rem,1.313rem)} .drynet-post-content--single p{padding-bottom:0!important;margin:0 0 1.5rem} .drynet-post-content--single hr.wp-block-separator{border:0;border-top:1px solid #808080;opacity:1;width:100%;margin:2.75rem 0 2.5rem} .drynet-post-content--single .wp-block-image{margin:0 0 1.5rem} .drynet-post-content--single ul:not(.drynet-checklist),.drynet-post-content--single ol{padding:0 0 0 3rem;margin:0 0 1.5rem;line-height:1.5em} .drynet-post-content--single li{margin:0} .drynet-post-content--single .wp-block-image.size-full img{width:100%;height:auto} .drynet-post-content .wp-block-columns{display:flex;gap:1em;margin-bottom:1.5rem} .drynet-post-content .wp-block-column{flex:1 1 0;min-width:0} .drynet-post-content .wp-block-column:empty{display:none} .drynet-post-content .wp-block-column .has-text-align-center{text-align:center} @media (max-width:767px){.drynet-post-content .wp-block-columns{flex-direction:column}} /* --- Text rhythm inside generated sections: headings 1.5rem below, paragraphs 1.5rem apart --- */ .drynet-section .et_pb_text h1,.drynet-section .et_pb_text h2,.drynet-section .et_pb_text h3,.drynet-section .et_pb_text h4{margin-top:0;padding-bottom:0;margin-bottom:1.5rem} .drynet-section .et_pb_text h1{margin-bottom:2rem} .drynet-section .et_pb_text :is(h1,h2,h3,h4,h5,h6){overflow-wrap:normal;word-wrap:normal;word-break:normal} .et_pb_module.et_pb_blurb.drynet-iconbox>.et_pb_blurb_content,.et_pb_module.et_pb_blurb.drynet-iconbox .et_pb_module_header{word-break:normal;overflow-wrap:normal;word-wrap:normal} .et_pb_section.drynet-section.et_flex_section{--vertical-gap:0px} .drynet-section .et_pb_text p{padding-bottom:0} .drynet-section .et_pb_text p:not(:last-child){margin-bottom:1.5rem} .drynet-section .et_pb_text p:last-child{margin-bottom:0} .drynet-section .et_pb_text.drynet-flow-gap .et_pb_text_inner>:is(h2,h3,h4,h5,h6):last-child{margin-bottom:0!important} .drynet-card .et_pb_text .et_pb_text_inner>:is(h2,h3,h4):last-child,.drynet-card .et_pb_text .drynet-rule-red:last-child{margin-bottom:0!important} .drynet-section .et_pb_text figure.wp-block-table{margin:0 0 1.5em} .drynet-step>p:empty{display:none} /* text module / lone button followed by another module (gb2divi.flow marks it): the old 1.5rem paragraph margin, minus the column's own row gap (Divi redefines --vertical-gap on every module, so inherit the column's value) */ .drynet-section .et_pb_module.drynet-flow-gap{--vertical-gap:inherit;margin-bottom:max(0px,calc(1.5rem - var(--vertical-gap,0px)))!important} /* separator: the 2px line is the whole module box (Divi's inline-block internal div is ~23px tall otherwise) */ .drynet-section .et_pb_divider.et_pb_module .et_pb_divider_internal{display:block;height:2px} /* --- Page hero --- */ .drynet-page-hero h1{margin-bottom:0!important} /* --- Footer --- */ .et_pb_section.et_pb_section_sticky.drynet-footer{padding-bottom:6rem!important} .drynet-footer .et_pb_image{align-self:flex-start} @media (max-width:980px){.drynet-footer .et_pb_image{align-self:center}} .drynet-footer__title{font-size:.9375rem;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:#09090a;margin-bottom:1rem!important} .drynet-footer .drynet-linklist,.drynet-footer .et_pb_text .drynet-linklist{gap:.5rem} .drynet-footer .drynet-linklist li a{border:0;border-radius:0;background:transparent;padding:0;font-weight:400;font-size:1rem;line-height:1.5em;color:#09090a;justify-content:flex-start} .drynet-footer .drynet-linklist li a::after{content:none;display:none} .drynet-footer .drynet-linklist li a:hover,.drynet-footer .drynet-linklist li a:focus{background:transparent;color:#4c4c52} .drynet-footer-bottom p{margin:0!important;padding:0!important} .drynet-footer-bottom .et_pb_text_inner{display:flex;flex-wrap:wrap;justify-content:center;column-gap:2rem} .drynet-footer-bottom a{margin:0;color:#09090a;text-decoration:none} .drynet-footer-bottom a:hover{color:#4c4c52} @media (max-width:980px){.drynet-footer .et_pb_text,.drynet-footer .drynet-linklist li a{text-align:center;justify-content:center}.drynet-footer-bottom .et_pb_text_inner{flex-direction:column;row-gap:0}} /* --- Author box (group module: 120px round avatar + text in a flex row, 800x184) --- */ .drynet-author .et_pb_image{flex:0 0 120px;width:120px} .drynet-author .et_pb_image img{border-radius:100%;width:120px;height:120px;object-fit:cover;display:block} .drynet-author .et_pb_text{flex:1 1 auto;min-width:0} .drynet-author .et_pb_text p:last-child{margin-bottom:0!important} /* --- Header menu module: transparent, Lato 18px/400 mixed-case white links (hover: white, 80%), black 200px dropdown, red 24/7 block flush right; phone: 24/7 hidden, logo + black 45px hamburger centred --- */ .drynet-header .et_pb_menu,.drynet-header .et_pb_menu .et_pb_menu_inner_container{background:transparent!important} .drynet-header .et_pb_menu__menu nav>ul>li>a,.drynet-header .et_pb_menu .et-menu>li>a{color:#fff!important} .drynet-header .et_pb_menu .et-menu>li>a{padding:1em 20px;font-size:18px;font-weight:400;text-transform:none;letter-spacing:0;column-gap:10px;white-space:nowrap} /* items never shrink (the absolutely positioned chevron would land on the label) */ .drynet-header .et_pb_menu .et-menu>li{flex:0 0 auto;padding:0!important;margin:0!important} /* old `ul{display:flex;flex-wrap:wrap}`: on laptop widths the menu wraps onto a second 63px row instead of overflowing */ .drynet-header .et_pb_menu .et-menu,.drynet-header .et_pb_menu nav>ul{margin:0;flex-wrap:wrap;justify-content:center;row-gap:0} .drynet-header .et_pb_menu__menu nav>ul>li>a:hover{color:#fff!important;opacity:.8} .drynet-header .et_pb_menu .et_pb_menu__menu{justify-content:center;position:relative} .drynet-header .et_pb_menu .et-menu>li.menu-item-has-children>a:first-child{padding-right:46px} .drynet-header .et_pb_menu .et-menu>li.menu-item-has-children>a:first-child:after{top:50%;margin-top:-8px;right:20px;font-size:16px;line-height:16px;color:#fff} /* DE: eight longer labels - tighter links (old DE header element: 1em 14px) so the row fits and the chevron stays clear of "Deutsch" */ .drynet-header--de .et_pb_menu .et-menu>li>a{padding:1em 14px} .drynet-header--de .et_pb_menu .et-menu>li.menu-item-has-children>a:first-child{padding-right:40px} .drynet-header--de .et_pb_menu .et-menu>li.menu-item-has-children>a:first-child:after{right:14px} /* dropdown (desktop nav only: Divi clones .et-menu into ul.et_mobile_menu): black 200px list, items stacked, right aligned */ .drynet-header .et_pb_menu .et-menu .sub-menu{width:200px;padding:0;right:0;left:auto;background:#000;border-top:0;box-shadow:none;white-space:normal} .drynet-header .et_pb_menu .et-menu .sub-menu li{display:block;float:none;width:100%;padding:0;margin:0} .drynet-header .et_pb_menu .et-menu .sub-menu a{display:block;width:100%;box-sizing:border-box;padding:1em 20px;background:#000;color:#fff;font-size:18px;line-height:1.5} .drynet-header .et_pb_menu .et-menu .sub-menu a:hover{background:#000;color:#fff;opacity:.8} /* Solutions / Leistungen (the sub-menu with the 15 services): white panel grouped Connect / Secure / Operate like the old GB Pro mega menu (#fff, padding 32px, 32px column gap, shadow; uppercase Lato 1rem headings, .875rem links 12px 0). The li goes static so the panel spans the menu column; the 5+5+5 order of apply_menus.sh fills the three columns. */ .drynet-header .et_pb_menu .et-menu>li:has(>.sub-menu>li:nth-child(10)){position:static} .drynet-header .et_pb_menu .et-menu .sub-menu:has(>li:nth-child(10)){display:grid;grid-auto-flow:column;grid-template-rows:repeat(5,auto);grid-template-columns:repeat(3,minmax(0,1fr));column-gap:32px;row-gap:0;left:50%;right:auto;transform:translateX(-50%);width:min(1200px,calc(100vw - 4rem));max-width:none;margin:0;padding:32px;background:#fff!important;border-radius:4px;box-shadow:0 2px 4px rgba(0,0,0,.06),0 8px 16px rgba(0,0,0,.1)} .drynet-header .et_pb_menu .et-menu .sub-menu:has(>li:nth-child(10)) li{width:auto} .drynet-header .et_pb_menu .et-menu .sub-menu:has(>li:nth-child(10)) a{background:transparent!important;color:#121214!important;font:700 1rem/1.5 Montserrat,sans-serif;padding:12px 8px;border-radius:4px;transition:box-shadow .3s} .drynet-header .et_pb_menu .et-menu .sub-menu:has(>li:nth-child(10)) a:hover{opacity:1;box-shadow:3px 3px 3px 3px #d2d2d6} .drynet-header .et_pb_menu .et-menu .sub-menu:has(>li:nth-child(10))>li:nth-child(5n+1)::before{display:block;color:#121214;font:700 2.25rem/1.2 Montserrat,sans-serif;letter-spacing:0;text-transform:none;margin:0 8px 24px} .drynet-header .et_pb_menu .et-menu .sub-menu:has(>li:nth-child(10))>li:nth-child(1)::before{content:"Connect"} .drynet-header .et_pb_menu .et-menu .sub-menu:has(>li:nth-child(10))>li:nth-child(6)::before{content:"Secure"} .drynet-header .et_pb_menu .et-menu .sub-menu:has(>li:nth-child(10))>li:nth-child(11)::before{content:"Operate"} .drynet-header--de .et_pb_menu .et-menu .sub-menu:has(>li:nth-child(10))>li:nth-child(1)::before{content:"Vernetzen"} @media (min-width:981px){.drynet-header .et_pb_row>.et_pb_column:nth-child(2){flex:0 1 auto;width:auto;max-width:none;min-width:0}.drynet-header .et_pb_row>.et_pb_column:nth-child(1){flex:1 1 0;min-width:150px}.drynet-header .et_pb_row>.et_pb_column:nth-child(3){flex:1 1 0;min-width:max-content}.drynet-header .et_pb_row>.et_pb_column:nth-child(1) img{max-width:100%}} @media (min-width:981px) and (max-width:1366px){.drynet-header .et_pb_menu .et-menu>li>a{padding:1em 14px}.drynet-header .et_pb_menu .et-menu>li.menu-item-has-children>a:first-child{padding-right:40px}.drynet-header .et_pb_menu .et-menu>li.menu-item-has-children>a:first-child:after{right:14px}.drynet-header--de .et_pb_menu .et-menu>li>a{padding:1em 10px}.drynet-header--de .et_pb_menu .et-menu>li.menu-item-has-children>a:first-child{padding-right:34px}.drynet-header--de .et_pb_menu .et-menu>li.menu-item-has-children>a:first-child:after{right:10px}} .drynet-header--de .et_pb_menu .et-menu .sub-menu:has(>li:nth-child(10))>li:nth-child(6)::before{content:"Absichern"} .drynet-header--de .et_pb_menu .et-menu .sub-menu:has(>li:nth-child(10))>li:nth-child(11)::before{content:"Betreiben"} .drynet-header .et_pb_button.drynet-support-open,.drynet-header .drynet-support-open .et_pb_button{padding:1rem 2rem!important;border-radius:0;border-width:0;white-space:nowrap} .drynet-header .et_pb_menu .et_mobile_nav_menu .mobile_menu_bar:before{color:#fff} /* tablet + phone: the logo box (200-240px) is centred in its column (Divi's margin:0 spacing beats its own phone alignment rule) */ @media (max-width:980px){.drynet-header .et_pb_column .et_pb_image{align-self:center;margin-left:auto!important;margin-right:auto!important}} @media (max-width:767px){.drynet-header .drynet-support-open,.drynet-header .drynet-header__help{display:none!important}.drynet-header .et_pb_row{justify-content:center}.drynet-header .et_mobile_nav_menu .mobile_menu_bar{background:#000;width:45px;height:45px;padding:10px;display:flex;align-items:center;justify-content:center;margin:18px auto 0}.drynet-header .mobile_menu_bar:before{font-size:25px;color:#fff}} /* off-canvas menu (old partial overlay: #000, white links 1em 20px, sub-menu items inline at full width) */ .drynet-header .et_mobile_menu{border-top:0;padding:0 0 60px} .drynet-header .et_mobile_menu li a{padding:1em 20px;font-size:18px;color:#fff!important;border-bottom:0} .drynet-header .et_mobile_menu .sub-menu{width:auto;background:transparent;padding-left:0} .drynet-header .et_mobile_menu .sub-menu a{background:transparent;width:auto} /* --- Icon boxes: 54px square tile, left-aligned, 2rem to the heading (old .gb-shape) --- */ .drynet-iconbox:not(.drynet-iconbox--center) .et_pb_main_blurb_image,.et_pb_module.et_pb_blurb.drynet-iconbox:not(.drynet-iconbox--center)>.et_pb_blurb_content>.et_pb_main_blurb_image{text-align:left;margin-bottom:2rem} .drynet-iconbox .et_pb_main_blurb_image img,.drynet-iconbox .et_pb_image_wrap img{width:54px!important;height:54px!important;max-width:54px} .drynet-iconbox .et_pb_image_wrap{margin:0} .drynet-iconbox .et_pb_blurb_content{max-width:none;row-gap:0} .drynet-iconbox:not(.drynet-iconbox--center) .et_pb_blurb_content{text-align:left} .drynet-iconbox .et_pb_blurb_container h3,.drynet-iconbox .et_pb_module_header{margin-top:0;padding-bottom:0;margin-bottom:1.5rem} .drynet-iconbox .et_pb_blurb_description p:last-child{margin-bottom:0;padding-bottom:0} /* icon left: Divi's display:table blurb ignores the image margin - use a flex row with the old 2rem column gap */ .et_pb_module.et_pb_blurb.drynet-iconbox.et_pb_blurb_position_left>.et_pb_blurb_content{display:flex;flex-direction:row;--flex-direction:row;align-items:flex-start;column-gap:2rem;row-gap:0} .drynet-iconbox.et_pb_blurb_position_left .et_pb_main_blurb_image,.et_pb_module.et_pb_blurb.drynet-iconbox.et_pb_blurb_position_left>.et_pb_blurb_content>.et_pb_main_blurb_image{display:block;width:54px!important;flex:0 0 54px;margin:0!important;padding:0} .et_pb_module.et_pb_blurb.drynet-iconbox.et_pb_blurb_position_left>.et_pb_blurb_content>.et_pb_blurb_container{display:block;padding-left:0;flex:1 1 auto;min-width:0} /* centred variant (industries): Divi prints .et_pb_blurb_N .et_pb_blurb_container{text-align:start} after this file */ .et_pb_module.et_pb_blurb.drynet-iconbox--center>.et_pb_blurb_content>.et_pb_main_blurb_image,.et_pb_module.et_pb_blurb.drynet-iconbox--center .et_pb_blurb_container,.et_pb_module.et_pb_blurb.drynet-iconbox--center .et_pb_blurb_content,.et_pb_module.et_pb_blurb.drynet-iconbox--center .et_pb_blurb_description,.et_pb_module.et_pb_blurb.drynet-iconbox--center .et_pb_module_header{text-align:center!important} .et_pb_module.et_pb_blurb.drynet-iconbox--center>.et_pb_blurb_content>.et_pb_main_blurb_image{margin-bottom:2rem} /* coloured 54px tile (old .gb-shape): Divi's `.et_pb_blurb .et_pb_image_wrap{display:block}` would stretch it to a bar */ .et_pb_blurb.drynet-iconbox--tile .et_pb_image_wrap,.et_pb_blurb.drynet-iconbox--tile .et_pb_image_wrap.et_pb_only_image_mode_wrap,.et_pb_module.et_pb_blurb.drynet-iconbox--tile>.et_pb_blurb_content>.et_pb_main_blurb_image .et_pb_image_wrap{display:inline-flex!important;align-items:center;justify-content:center;width:54px!important;height:54px!important;max-width:54px;padding:12px!important;box-sizing:border-box;border-radius:2%;line-height:0} .drynet-iconbox--tile .et_pb_main_blurb_image{width:auto} .drynet-iconbox--tile .et_pb_image_wrap img,.et_pb_blurb.drynet-iconbox--tile .et_pb_image_wrap img{width:30px!important;height:30px!important;max-width:30px} /* below 1024px the old icon rows stack: tile above the heading, text full width */ @media (max-width:1024px){.et_pb_module.et_pb_blurb.drynet-iconbox.et_pb_blurb_position_left>.et_pb_blurb_content{display:flex;flex-direction:column;--flex-direction:column;align-items:flex-start;column-gap:0}.et_pb_module.et_pb_blurb.drynet-iconbox.et_pb_blurb_position_left>.et_pb_blurb_content>.et_pb_main_blurb_image{display:block;width:54px!important;margin:0 0 2rem 0!important}.et_pb_module.et_pb_blurb.drynet-iconbox.et_pb_blurb_position_left>.et_pb_blurb_content>.et_pb_blurb_container{width:100%}} /* --- Buttons: keep button groups shrink-wrapped (sizes come from divi5.button(): 3px border, 10px 20px padding) --- */ .drynet-buttons>.et_pb_module{width:auto;flex:0 0 auto;margin:0!important} .et_pb_section .et_pb_button{border-style:solid} /* --- FAQ accordion, thin-rule variant (service pages): transparent items, 1px bottom rule, plus/minus-square --- */ .et_pb_accordion.drynet-faq .et_pb_toggle.et_pb_module{background:transparent;border-width:0 0 1px 0;border-style:solid;border-color:#d2d2d6;border-radius:0;padding:1em;margin-bottom:.4rem} .et_pb_accordion.drynet-faq .et_pb_toggle .et_pb_toggle_title{color:#000;margin-bottom:1rem!important} .et_pb_accordion.drynet-faq{gap:0!important;row-gap:0!important} .et_pb_accordion.drynet-faq .et_pb_toggle .et_pb_toggle_content{padding-top:0!important} .et_pb_accordion.drynet-faq--bars .et_pb_toggle .et_pb_toggle_title{margin-bottom:0!important} .et_pb_accordion.drynet-faq--bars .et_pb_toggle.et_pb_module{background:transparent!important;padding:0!important;margin-bottom:8px!important} .et_pb_accordion.drynet-faq--bars .et_pb_toggle .et_pb_toggle_title{background:#f7f7fa;padding:1.5rem 2rem;margin:0 0 5px!important;transition:background .5s} .et_pb_accordion.drynet-faq--bars .et_pb_toggle.et_pb_module .et_pb_toggle_title:before{right:2rem} .et_pb_accordion.drynet-faq--bars .et_pb_toggle .et_pb_toggle_content{background:#fff;padding:.5rem 2rem 1rem!important;margin-top:0!important} .et_pb_accordion.drynet-faq .et_pb_toggle.et_pb_module .et_pb_toggle_title:before{content:""!important;display:block;position:absolute;top:50%;right:0;left:auto;margin-top:-.5em;width:1em;height:1em;line-height:1;color:inherit;background:currentColor;-webkit-mask:url("data:image/svg+xml,") center/contain no-repeat;mask:url("data:image/svg+xml,") center/contain no-repeat} .et_pb_accordion.drynet-faq .et_pb_toggle_open.et_pb_module .et_pb_toggle_title:before{display:block;font-size:21px;color:inherit;-webkit-mask-image:url("data:image/svg+xml,");mask-image:url("data:image/svg+xml,")} .et_pb_accordion.drynet-faq .et_pb_toggle_open .et_pb_toggle_title{font-weight:600} .et_pb_accordion.drynet-faq .et_pb_toggle_content p:last-child{margin-bottom:0;padding-bottom:0} /* --- FAQ accordion, grey-bar variant (Solutions): #f7f7fa bars, plain plus/minus --- */ .et_pb_accordion.drynet-faq--bars .et_pb_toggle.et_pb_module{background:#f7f7fa;border:0;border-radius:0;padding:1.5rem 2rem;margin-bottom:5px;transition:background .5s} .et_pb_accordion.drynet-faq--bars .et_pb_toggle.et_pb_module:hover{background:#fff} .et_pb_accordion.drynet-faq--bars .et_pb_toggle .et_pb_toggle_title{font:600 1.125rem/1.5 Lato,sans-serif;color:#000} .et_pb_accordion.drynet-faq--bars .et_pb_toggle.et_pb_module .et_pb_toggle_title:before{-webkit-mask-image:url("data:image/svg+xml,");mask-image:url("data:image/svg+xml,")} .et_pb_accordion.drynet-faq--bars .et_pb_toggle_open.et_pb_module .et_pb_toggle_title:before{font-size:18px;-webkit-mask-image:url("data:image/svg+xml,");mask-image:url("data:image/svg+xml,")} .et_pb_accordion.drynet-faq--bars .et_pb_toggle .et_pb_toggle_content{margin-top:1em;padding:2rem} /* --- Real-world carousel (drynet.js): one slide per view, round arrows, dots --- */ .drynet-carousel{overflow:hidden;display:flex;flex-wrap:nowrap!important;flex-direction:row!important;width:100%} .drynet-carousel__track{display:flex;flex-wrap:nowrap;transition:transform .5s} .drynet-carousel>.et_pb_module,.drynet-carousel .drynet-slide{flex:0 0 100%;min-width:100%;max-width:100%;width:100%;transition:transform .5s} .drynet-slide{box-sizing:border-box} .drynet-slide__image{min-height:500px} .drynet-slide__text h3,.drynet-slide__text h2{margin-bottom:0} .drynet-carousel__nav{display:flex;justify-content:space-between;align-items:center;margin-top:24px;margin-bottom:0} .drynet-carousel__nav button{width:40px;height:40px;border-radius:50%;border:0;padding:0;background:#d2d2d6;color:#09090a;display:grid;place-items:center;cursor:pointer;transition:.5s} .drynet-carousel__nav button svg{width:20px;height:20px;fill:currentColor} .drynet-carousel__nav button:hover,.drynet-carousel__nav button:focus-visible{background:#fff} .drynet-carousel__nav .dots{display:flex;gap:6px} .drynet-carousel__nav .dot{width:8px;height:8px;min-width:0;border-radius:50%;background:#fff;border:0;padding:0;display:block;cursor:pointer;transition:background .5s} .drynet-carousel__nav .dot.is-active,.drynet-carousel__nav .dot:hover{background:#c60047} @media (prefers-reduced-motion:reduce){.drynet-carousel__track,.drynet-carousel .drynet-slide{transition:none}} .drynet-slide>.et_pb_module{width:100%;max-width:100%;min-width:0} @media (max-width:1024px){.drynet-slide{grid-template-columns:1fr!important;--column-count:1}.drynet-slide__image{aspect-ratio:4/3;min-height:0!important;height:auto;width:100%;max-width:100%;order:-1}.drynet-slide__text{padding:1.5rem!important}} /* --- Industries tabs: transparent centred tab bar with a 2px underline in the industry colour --- */ .et_pb_tabs.drynet-tabs{border:0!important;border-radius:0;background:transparent;margin-bottom:1rem!important} .et_pb_tabs.drynet-tabs .et_pb_tabs_controls{background:transparent!important;display:flex;flex-wrap:wrap;justify-content:center;gap:1rem;border:0;margin-bottom:calc(2rem + 20px)} .et_pb_tabs.drynet-tabs .et_pb_tabs_controls:after{display:none} .et_pb_tabs.drynet-tabs .et_pb_tabs_controls li{border:0;border-bottom:2px solid #fff;padding:0 3rem 8px;background:transparent!important;transition:all .5s} .et_pb_tabs.drynet-tabs .et_pb_tabs_controls li a{padding:0;color:#fff!important;font:600 .875rem/1.2 Lato,sans-serif;letter-spacing:2px;text-transform:uppercase} .et_pb_tabs.drynet-tabs .et_pb_tabs_controls li:nth-child(1).et_pb_tab_active,.et_pb_tabs.drynet-tabs .et_pb_tabs_controls li:nth-child(1):hover{border-bottom-color:#388e3c} .et_pb_tabs.drynet-tabs .et_pb_tabs_controls li:nth-child(2).et_pb_tab_active,.et_pb_tabs.drynet-tabs .et_pb_tabs_controls li:nth-child(2):hover{border-bottom-color:#37474f} .et_pb_tabs.drynet-tabs .et_pb_tabs_controls li:nth-child(3).et_pb_tab_active,.et_pb_tabs.drynet-tabs .et_pb_tabs_controls li:nth-child(3):hover{border-bottom-color:#c60047} .et_pb_tabs.drynet-tabs .et_pb_tabs_controls li:nth-child(4).et_pb_tab_active,.et_pb_tabs.drynet-tabs .et_pb_tabs_controls li:nth-child(4):hover{border-bottom-color:#ef6c00} .et_pb_tabs.drynet-tabs .et_pb_all_tabs{background:transparent;padding:0} .et_pb_tabs.drynet-tabs .et_pb_tab{padding:0} .drynet-tabpane{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))} .drynet-tabpane__card{background:#09090a;color:#fff;padding:4rem;display:flex;flex-direction:column;justify-content:center;align-items:flex-start} .drynet-tabpane__card h2,.drynet-tabpane__card h3,.et-l--body .drynet-tabpane__card h3{font-size:1.5rem;margin:0 0 1.5rem;padding-bottom:0;line-height:calc(6px + 2ex);color:#fff!important} .drynet-tabpane__card p,.drynet-tabpane__card li{color:#fff} .drynet-tabpane__card p{font-size:1.125rem;margin-bottom:1.5rem;padding-bottom:0} .drynet-tabpane__card .drynet-checklist{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:column;grid-template-rows:repeat(2,auto);column-gap:2rem;row-gap:1rem} @media (max-width:767px){.drynet-tabpane__card .drynet-checklist{display:flex}} .drynet-tabpane__img{width:100%;height:100%;object-fit:cover;display:block} @media (max-width:1024px){.drynet-tabpane{display:flex;flex-direction:column-reverse}.drynet-tabpane__img{aspect-ratio:4/3;height:auto}} @media (max-width:767px){.drynet-tabpane__card{padding:1.5rem}.et_pb_tabs.drynet-tabs .et_pb_tabs_controls{flex-direction:column;flex-wrap:nowrap;align-items:stretch;row-gap:2rem;max-width:100%}.et_pb_tabs.drynet-tabs .et_pb_tabs_controls li{display:block;float:none;width:100%;text-align:center;padding:0 2rem 8px}.et_pb_tabs.drynet-tabs .et_pb_tabs_controls li a{display:block;text-align:center}} /* --- Blog: "Latest articles" cards (home), image left, red calendar icon in the meta --- */ .et_pb_blog.drynet-articles .et_pb_posts,.et_pb_blog.drynet-articles .et_pb_blog_posts,.et_pb_blog.drynet-articles .et_pb_blog_grid_wrapper{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:3rem;--column-count:2} .et_pb_blog.drynet-articles .et_pb_post{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:1fr auto auto 1fr;column-gap:2rem;row-gap:0;align-items:center;margin:0;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;width:100%!important} .et_pb_blog.drynet-articles .et_pb_post .entry-featured-image-url,.et_pb_blog.drynet-articles .et_pb_post .et_pb_image_container{grid-column:1;grid-row:1/-1;margin:0!important;display:block;align-self:center;width:100%} .et_pb_blog.drynet-articles .et_pb_post .entry-title{grid-column:2;grid-row:2} .et_pb_blog.drynet-articles .et_pb_post .post-meta{grid-column:2;grid-row:3} .et_pb_blog.drynet-articles .et_pb_post .post-content,.et_pb_blog.drynet-articles .et_pb_post .post-content-inner{display:none} .et_pb_blog.drynet-articles .et_pb_post img{border-radius:0;width:100%;height:auto;object-fit:cover;display:block} .et_pb_blog.drynet-articles .entry-title{margin-bottom:1rem;padding-bottom:0} .et_pb_blog.drynet-articles .entry-title a{color:#121214} .et_pb_blog.drynet-articles .entry-title a:hover{color:#4c4c52} .et_pb_blog.drynet-articles .post-meta{display:inline-flex;align-items:center;gap:8px;margin:0} .drynet-articles .post-meta::before,.drynet-archive .post-meta .published::before,.drynet-post-hero .et_pb_title_meta_container::before{content:"";flex:0 0 1em;display:inline-block;width:1em;height:1em;margin-bottom:2px;vertical-align:-.1em;background:#c60047;-webkit-mask:url("data:image/svg+xml,") center/contain no-repeat;mask:url("data:image/svg+xml,") center/contain no-repeat} .drynet-archive .post-meta .published{display:inline-flex;align-items:center;gap:8px} .drynet-post-hero .et_pb_title_meta_container{display:inline-flex;align-items:center;column-gap:8px;margin-bottom:0} @media (max-width:1024px){.et_pb_blog.drynet-articles .et_pb_posts,.et_pb_blog.drynet-articles .et_pb_blog_posts,.et_pb_blog.drynet-articles .et_pb_blog_grid_wrapper,.et_pb_blog.drynet-articles .et_pb_post{grid-template-columns:1fr!important;--column-count:1}.et_pb_blog.drynet-articles .et_pb_post{grid-template-rows:auto auto auto;row-gap:1rem}.et_pb_blog.drynet-articles .et_pb_post .entry-featured-image-url,.et_pb_blog.drynet-articles .et_pb_post .et_pb_image_container{grid-column:1;grid-row:1}.et_pb_blog.drynet-articles .et_pb_post .entry-title{grid-column:1;grid-row:2}.et_pb_blog.drynet-articles .et_pb_post .post-meta{grid-column:1;grid-row:3}} /* --- Blog archive (News): flat list with image left, sidebar list, boxed pagination --- */ .drynet-archive .et_pb_post{border:0!important;border-radius:0!important;padding:0!important;background:transparent;box-shadow:none;min-width:0} .et_pb_blog.drynet-archive-list .et_pb_blog_posts,.et_pb_blog.drynet-archive-list .et_pb_posts,.et_pb_blog.drynet-archive-sidebar .et_pb_blog_posts,.et_pb_blog.drynet-archive-sidebar .et_pb_posts{--column-count:1!important;grid-template-columns:minmax(0,1fr)!important} .et_pb_blog.drynet-archive-list .et_pb_blog_posts{row-gap:2rem} .et_pb_blog.drynet-archive-sidebar .et_pb_blog_posts{row-gap:12px} .et_pb_blog.drynet-archive-list .et_pb_post{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:1fr auto auto 1fr;column-gap:2rem;row-gap:0;align-items:center;margin-bottom:0} .et_pb_blog.drynet-archive-list .et_pb_post .entry-featured-image-url,.et_pb_blog.drynet-archive-list .et_pb_post .et_pb_image_container{margin:0!important;display:block;grid-column:1;grid-row:1/-1} .et_pb_blog.drynet-archive-list .et_pb_post .entry-title{grid-column:2;grid-row:2;align-self:end} .et_pb_blog.drynet-archive-list .et_pb_post>.post-meta{grid-column:2;grid-row:3;align-self:start} .et_pb_blog.drynet-archive-list .et_pb_post img{border-radius:0;width:100%;height:auto;display:block} .drynet-archive .entry-title{margin-bottom:1rem;padding-bottom:0} .drynet-archive .entry-title a{color:#121214} .drynet-archive .entry-title a:hover{color:#4c4c52} .drynet-archive .post-meta{display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;font-size:0;margin:0} .drynet-archive .post-meta a,.drynet-archive .post-meta span{font-size:15px} .et_pb_blog.drynet-archive-sidebar .et_pb_post{margin-bottom:0;min-width:0} .et_pb_blog.drynet-archive-sidebar .entry-title{margin:0;padding:0} .drynet-archive .pagination{display:flex;flex-wrap:wrap;gap:12px;margin-top:3rem} .drynet-archive .pagination a{display:inline-flex;align-items:center;padding:4px 12px;font-size:14px;font-weight:600;line-height:1.5;color:#0e0e24;background:#fff;border:2px solid #0e0e24;border-radius:2px;text-decoration:none;transition:all .5s} .drynet-archive .pagination a:hover{background:#0e0e24;color:#fff} .drynet-archive .pagination .alignleft,.drynet-archive .pagination .alignright{float:none} @media (max-width:1024px){.et_pb_blog.drynet-articles .et_pb_post::after,.et_pb_blog.drynet-archive-list .et_pb_post::after,.et_pb_blog.drynet-archive-list .et_pb_post .post-content{display:none}.et_pb_blog.drynet-articles .entry-title{margin-bottom:0}} @media (max-width:1024px){.drynet-archive .et_pb_column:first-child{order:2;margin-top:3rem}.et_pb_blog.drynet-archive-list .et_pb_post{grid-template-columns:1fr;grid-template-rows:auto;row-gap:2rem}.et_pb_blog.drynet-archive-list .et_pb_post .et_pb_image_container,.et_pb_blog.drynet-archive-list .et_pb_post .entry-featured-image-url,.et_pb_blog.drynet-archive-list .et_pb_post .entry-title,.et_pb_blog.drynet-archive-list .et_pb_post>.post-meta{grid-column:1;grid-row:auto}} @media (max-width:980px){.et_pb_blog_grid .et_pb_salvattore_content,.et_pb_blog_grid .et_pb_blog_grid_wrapper,.et_pb_blog_grid .et_pb_blog_posts{grid-template-columns:1fr!important;--column-count:1}.et_pb_blog_grid .column{width:100%!important}} /* --- Post hero (single post / guide): h1 1.5rem above the white date meta, framed featured image right --- */ .drynet-post-hero .entry-title{margin-bottom:1.5rem!important;padding-bottom:0} .drynet-post-hero .drynet-post-hero__image img{display:block;width:100%;height:auto;object-fit:cover} /* --- Prev / next article cards ([drynet_postnav] shortcode, single post / guide) --- */ .drynet-postnav-wrap .et_pb_text_inner{padding:0} .drynet-postnav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;padding-bottom:2rem} .drynet-postnav a{display:flex;align-items:center;background:#f7f7fa;color:#121214;text-decoration:none;transition:all .5s} .drynet-postnav a:hover{transform:translate3d(0,-3px,0);color:#4c4c52} .drynet-postnav img{flex:0 0 100px;width:100px;height:auto;min-height:96px;align-self:stretch;object-fit:cover;display:block} .drynet-postnav p{flex:1;margin:0!important;padding:1rem 1.5rem!important;font-size:1rem;line-height:1.5em} .drynet-postnav__next p{text-align:right} @media (max-width:1024px){.drynet-postnav{grid-template-columns:1fr}} /* --- Comments (guides only): hidden where comments are closed, 1px black fields, primary submit --- */ .drynet-comments:not(:has(#commentform)):not(:has(.commentlist)){display:none} .drynet-comments #commentform textarea,.drynet-comments #commentform input[type='text'],.drynet-comments #commentform input[type='email'],.drynet-comments #commentform input[type='url']{border-radius:0} .drynet-comments #commentform .et_pb_button{padding:10px 20px!important;border-radius:0} .drynet-comments .comment-notes{display:none} /* --- Archive byline: 3rem round author avatar left, date above author (Divi prints "author | date") --- */ .et_pb_blog.drynet-archive-list .post-meta,.et_pb_blog.drynet-archive-list .et_pb_post .post-meta{display:grid;grid-template-columns:3rem minmax(0,1fr);grid-template-rows:auto auto;grid-auto-rows:0;column-gap:1rem;row-gap:0;align-items:center;font-size:0!important;line-height:0;overflow:hidden;margin:0} .et_pb_blog.drynet-archive-list .post-meta .published,.et_pb_blog.drynet-archive-list .post-meta .author,.et_pb_blog.drynet-archive-list .post-meta .author a{font-size:15px;line-height:1.5} .et_pb_blog.drynet-archive-list .post-meta::before{content:"";grid-column:1;grid-row:1/span 2;width:3rem;height:3rem;border-radius:100%;background:url(/wp-content/uploads/2025/11/Mitarbeiterfotos-Drynet-8-1.jpg) center/cover} .et_pb_blog.drynet-archive-list .post-meta .published{grid-column:2;grid-row:1} .et_pb_blog.drynet-archive-list .post-meta .author{grid-column:2;grid-row:2;margin-top:.5rem} /* --- Archive pagination ([drynet_pagination]: Back · 1 2 [3] 4 5 · Next) --- */ .drynet-pagination-wrap .et_pb_text_inner{padding:0} .drynet-archive .pagination .page-numbers{display:inline-flex;align-items:center;padding:4px 12px;font-size:14px;font-weight:600;line-height:1.5;color:#0e0e24;background:#fff;border:2px solid #0e0e24;border-radius:2px;text-decoration:none;transition:all .5s} .drynet-archive .pagination .page-numbers.current,.drynet-archive .pagination .page-numbers:hover{background:#0e0e24;color:#fff} .drynet-archive .pagination .page-numbers.dots{border-color:transparent;background:transparent} /* --- Page conversion helpers (gb2divi.py P03/P09/P12/P16/P18/P21): inline GB styles kept as classes --- */ .drynet-section{position:relative} .drynet-deco-circle{position:absolute;top:40px;right:40px;width:300px;max-width:100%;margin:0!important;filter:invert(5%);z-index:0;pointer-events:none} .drynet-deco-circle img{width:100%;height:auto;display:block} .drynet-section .et_pb_row:has(.drynet-deco-circle),.drynet-section .et_pb_column:has(>.drynet-deco-circle){position:static} .drynet-section .et_pb_row:has(.drynet-deco-circle)>.et_pb_column>.et_pb_module:not(.drynet-deco-circle){position:relative;z-index:1} @media (max-width:767px){.drynet-deco-circle{top:20px;right:20px;width:200px}} .drynet-quote{display:block;width:54px;height:54px;margin:0 auto 24px;fill:#c60047;color:#c60047} .drynet-quote svg{width:100%;height:100%;fill:currentColor} .drynet-glyph svg{width:54px;height:54px;fill:#c60047} .drynet-glyph--center{text-align:center} .drynet-section .et_pb_text .drynet-rule-red,.drynet-rule-red{padding-bottom:1.8rem!important;border-bottom:1px solid #c60047;margin-bottom:1.5rem!important} .drynet-section .et_pb_text .drynet-rule,.drynet-rule{padding-bottom:1rem!important;border-bottom:1px solid #d2d2d6;margin-bottom:1.6rem!important} .drynet-center,.has-text-align-center{text-align:center} .has-text-align-right{text-align:right} .has-text-align-left{text-align:left} .drynet-balance{text-wrap:balance} .drynet-medium{font-weight:500} .drynet-w600{font-weight:600!important} .drynet-h2-xl{font-size:3rem!important} .drynet-maxw-500{max-width:500px;margin-left:auto;margin-right:auto} .drynet-mb-0{margin-bottom:0!important} .drynet-mb-0-4rem{margin-bottom:.4rem!important} .drynet-mb-1rem{margin-bottom:1rem!important} .drynet-mb-1-25rem{margin-bottom:1.25rem!important} .drynet-mb-1-5rem{margin-bottom:1.5rem!important} .drynet-mb-1-8rem{margin-bottom:1.8rem!important} .drynet-mb-2rem{margin-bottom:2rem!important} .drynet-mb-3rem{margin-bottom:3rem!important} .drynet-mb-4rem{margin-bottom:4rem!important} .drynet-center-group>.et_pb_module{width:100%} .drynet-center-group .et_pb_text_inner{text-align:inherit} .drynet-narrow{margin-left:auto;margin-right:auto} /* images: cover / contain / fill heights, drop shadow, dimming, tablet aspect ratios (P12) */ .drynet-cover .et_pb_image_wrap,.drynet-cover .et_pb_image_wrap img,.drynet-cover img{height:inherit;width:100%!important;max-width:100%;object-fit:cover;display:block} @media (max-width:1024px){.drynet-cover .et_pb_image_wrap,.drynet-cover .et_pb_image_wrap img,.drynet-cover img{height:auto!important;aspect-ratio:7/6;object-fit:cover}} .et_pb_image.drynet-img-center{margin-left:auto!important;margin-right:auto!important;align-self:center} .drynet-contain .et_pb_image_wrap,.drynet-contain img{height:inherit;width:auto;max-width:100%;object-fit:contain;display:block} .drynet-fill,.drynet-fill .et_pb_image_wrap{height:100%;display:block} .drynet-fill img{width:100%;height:100%;object-fit:cover;display:block} .drynet-dropshadow img{filter:drop-shadow(0 10px 20px rgba(26,26,28,.12))} @media (max-width:1024px){.drynet-ar-4-3 img{aspect-ratio:4/3;object-fit:cover;width:100%}.drynet-ar-16-9 img{aspect-ratio:16/9;object-fit:cover;width:100%}.drynet-fill,.drynet-fill .et_pb_image_wrap{height:auto}.drynet-fill img{height:auto}} /* tables + colour marks in text modules (CSG programme, P16) */ .et_pb_text table{width:100%;table-layout:fixed;border-collapse:collapse;border:1px solid currentColor} .et_pb_text th,.et_pb_text td{border:1px solid currentColor;padding:.5em;text-align:center;vertical-align:middle;font-size:1.125rem} .et_pb_text thead{border-bottom:3px solid currentColor} .et_pb_text th{font-weight:700} .et_pb_text mark{background:transparent} .has-accent-2-color{color:#c60047} /* fake e-mail field + button row (home field-guide panel, P18) */ .drynet-form-row{width:100%} .drynet-form-row .drynet-fake-input-wrap{flex:1 1 auto;min-width:0} .drynet-fake-input{display:block;flex:1;padding:15px 24px;border:1px solid #d2d2d6;border-radius:2px;background:#fff;color:#6b6b73;font-weight:500;line-height:1.5} .drynet-form-row .et_pb_button{padding-top:17px!important;padding-bottom:17px!important;white-space:nowrap} @media (max-width:767px){.drynet-form-row .drynet-fake-input-wrap{width:100%}} /* quote author row: 4rem round avatar + name (P18) */ .drynet-author-row .et_pb_image{flex:0 0 auto;width:4rem} .drynet-author-row .et_pb_image img{width:4rem;height:4rem;border-radius:100%;object-fit:cover;display:block} .drynet-author-row .et_pb_text{flex:1 1 auto;min-width:0} .drynet-author-row .et_pb_text p{margin:0!important;padding:0!important} /* testimonial card (P03): centred text, no overlap below 1024px */ .drynet-testimonial-section{position:relative;z-index:5} @media (max-width:767px){.drynet-testimonial-section{padding-left:0!important;padding-right:0!important}} .drynet-testimonial .et_pb_text,.drynet-testimonial .et_pb_text_inner{text-align:center} .drynet-testimonial>.et_pb_module{width:100%} @media (max-width:1024px){.drynet-testimonial{margin-bottom:0!important}} /* split hero (P06): text box flush with the 1200px container, photo column fills the band */ .drynet-split-hero .drynet-split-hero__left{padding-left:max(2rem,calc(50vw - 600px))} .drynet-split-hero .drynet-split-hero__right{min-height:100%} .drynet-split-hero .drynet-split-hero__text>.et_pb_module{width:100%} @media (max-width:980px){.drynet-split-hero .drynet-split-hero__left{padding-left:0}.drynet-split-hero .drynet-split-hero__text{max-width:none!important}} /* grid rows whose GB source reverses the order on tablets (image first) */ @media (max-width:1024px){.et_pb_row.drynet-row-reverse{flex-direction:column-reverse}} /* 2fr/1fr grid (home feature list + phone): reproduce the old 728/364 split instead of Divi's 16/24 formula */ @media (min-width:981px){.et_pb_row.drynet-row-2-1>.et_flex_column_16_24{width:calc(66.6667% - var(--horizontal-gap-parent,0px)*2/3)!important}.et_pb_row.drynet-row-2-1>.et_flex_column_8_24{width:calc(33.3333% - var(--horizontal-gap-parent,0px)/3)!important}} /* =================================================================================================== UX layer (2026-09-22): hero v2, trust strip, content pages (build_content_pages.py), forms, CTA bar, a11y =================================================================================================== */ /* --- accessibility baseline --- */ .drynet-skip{position:absolute;left:1rem;top:-100px;z-index:100000;padding:.75rem 1.25rem;background:#c60047;color:#fff;font:700 1rem/1 Lato,sans-serif;border-radius:4px;text-decoration:none} .drynet-skip:focus{top:1rem;outline:3px solid #fff;outline-offset:2px} :where(a,button,[tabindex],input,select,textarea,summary):focus-visible{outline:3px solid #c60047;outline-offset:3px;border-radius:2px} .et_pb_button:focus-visible,.drynet-btn:focus-visible{outline-color:#fff} .mobile_menu_bar{cursor:pointer} @media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}} /* --- hero v2: breadcrumb, subline, buttons --- */ .drynet-page-hero .drynet-breadcrumb-wrap,.drynet-page-hero .drynet-hero-meta-wrap{margin:0!important;padding:0!important} .drynet-page-hero .drynet-breadcrumb-wrap:empty,.drynet-page-hero .drynet-hero-meta-wrap:empty{display:none} .drynet-breadcrumb ol{display:flex;flex-wrap:wrap;gap:.25rem .5rem;list-style:none!important;margin:0 0 1.5rem!important;padding:0!important;font:600 .8125rem/1.4 Lato,sans-serif;letter-spacing:.5px;text-transform:uppercase} .drynet-breadcrumb li{list-style:none!important;margin:0;padding:0;color:rgba(255,255,255,.7);display:flex;align-items:center;gap:.5rem} .drynet-breadcrumb li+li::before{content:"";width:.45em;height:.45em;border-right:1.5px solid currentColor;border-top:1.5px solid currentColor;transform:rotate(45deg);opacity:.7} .drynet-breadcrumb a{color:rgba(255,255,255,.85);text-decoration:none} .drynet-breadcrumb a:hover,.drynet-breadcrumb a:focus{color:#fff;text-decoration:underline} .drynet-breadcrumb [aria-current]{color:#fff} .drynet-hero-meta{display:flex;flex-direction:column;gap:2rem;margin-top:.5rem} .drynet-page-hero .drynet-hero__sub{max-width:720px;color:#fff;border-left:2px solid #c60047;padding-left:24px;font:500 1.125rem/1.5 Lato,sans-serif;text-shadow:0 0 10px #09090a;text-wrap:balance;margin:0!important} .drynet-hero__cta{display:flex;flex-wrap:wrap;gap:1rem;align-items:center} .drynet-btn{display:inline-flex;align-items:center;gap:.6em;padding:12px 24px;border:3px solid transparent;border-radius:0;font:600 15px/1.5 Lato,sans-serif;letter-spacing:2px;text-transform:uppercase;text-decoration:none;transition:all .3s} .drynet-btn--white{background:#fff;border-color:#fff;color:#0e0e24} .drynet-btn--white:hover,.drynet-btn--white:focus{background:transparent;color:#fff} .drynet-btn--ghost{background:transparent;border-color:rgba(255,255,255,.6);color:#fff} .drynet-btn--ghost:hover,.drynet-btn--ghost:focus{border-color:#fff;background:#fff;color:#0e0e24} .drynet-btn--primary{background:#0e0e24;border-color:#0e0e24;color:#fff} .drynet-btn--primary:hover,.drynet-btn--primary:focus{background:transparent;color:#0e0e24} .drynet-btn__icon{width:1.1em;height:1.1em;background:currentColor;-webkit-mask:url("data:image/svg+xml,") center/contain no-repeat;mask:url("data:image/svg+xml,") center/contain no-repeat} @media (max-width:767px){.drynet-hero__cta .drynet-btn{width:100%;justify-content:center}.drynet-page-hero .drynet-hero__sub{font-size:1rem;padding-left:16px}} /* --- trust strip --- */ .drynet-trust-section .et_pb_row{max-width:1200px} .drynet-trust-wrap{margin:0!important;padding:0!important} .drynet-trust{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem 2rem;list-style:none!important;margin:0!important;padding:1.25rem 0!important} .drynet-trust li{list-style:none!important;margin:0;padding:0;display:flex;align-items:center;gap:.75rem;font:600 .9375rem/1.35 Lato,sans-serif;color:#09090a} .drynet-trust__icon{flex:0 0 auto;width:1.75rem;height:1.75rem;background:#c60047;-webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat} .drynet-trust__item--handshake{--ico:url("data:image/svg+xml,")} .drynet-trust__item--shield{--ico:url("data:image/svg+xml,")} .drynet-trust__item--headset{--ico:url("data:image/svg+xml,")} .drynet-trust__item--anchor{--ico:url("data:image/svg+xml,")} @media (max-width:1024px){.drynet-trust{grid-template-columns:repeat(2,1fr)}} @media (max-width:480px){.drynet-trust{grid-template-columns:1fr;gap:.75rem}} /* --- content pages: sections, cards, specs, pricing, related, logos --- */ .drynet-content-section .drynet-grid>.drynet-card{height:100%} .drynet-content-card .drynet-card__icon{margin:0 0 .5rem!important} .drynet-content-card .drynet-card__icon img{width:48px;height:48px} .drynet-content-card .et_pb_button_module_wrapper{margin-top:auto!important} .drynet-content-card h3{font-size:1.3125rem!important;line-height:1.3!important;margin-bottom:1rem!important} .drynet-more{font-weight:700;text-decoration:none;display:inline-flex;align-items:center;gap:.4em} .drynet-more::after{content:"";width:1em;height:1em;background:currentColor;-webkit-mask:url("data:image/svg+xml,") center/contain no-repeat;mask:url("data:image/svg+xml,") center/contain no-repeat;transition:transform .3s} .drynet-more:hover::after,.drynet-card:hover .drynet-more::after{transform:translateX(4px)} .drynet-related-card{transition:transform .3s,box-shadow .3s} .drynet-related-card:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(0,0,0,.12)} .drynet-related-card h3{font-size:1.25rem!important;margin-bottom:.5rem!important} .drynet-related-card p:last-child{margin-top:auto!important} .drynet-section .et_pb_text figure.drynet-specs{margin:0;overflow-x:auto} .drynet-specs table{width:100%;border-collapse:collapse;border:0;font-size:1.0625rem;line-height:1.5} .drynet-specs th,.drynet-specs td{text-align:left;vertical-align:top;padding:.9rem 1rem;border:0;border-bottom:1px solid #d2d2d6} .drynet-specs th{width:32%;font-weight:700;color:#09090a;background:#f7f7fa} .drynet-specs tr:last-child th,.drynet-specs tr:last-child td{border-bottom:0} .drynet-specs tr:first-child th,.drynet-specs tr:first-child td{border-top:2px solid #0e0e24} @media (max-width:767px){.drynet-specs th,.drynet-specs td{display:block;width:auto;padding:.6rem .75rem}.drynet-specs th{border-bottom:0;padding-bottom:.2rem}.drynet-specs td{padding-top:0;border-bottom:1px solid #d2d2d6}} .drynet-pricing-card .drynet-checklist{margin:0!important;flex-direction:column} .drynet-pricing-card .drynet-checklist li{flex:1 1 auto;font-size:1rem} .drynet-pricing-card .drynet-price{font-family:Montserrat,sans-serif;font-size:1.5rem;line-height:1.2;margin-top:.5rem!important} .drynet-pricing-card .drynet-price .drynet-dim{font:400 .9375rem/1.4 Lato,sans-serif} .drynet-pricing-card .drynet-tagline{color:#c60047} .drynet-small{font-size:.9375rem!important;line-height:1.5} .drynet-dim{opacity:.72} .drynet-content-img img{width:100%;height:auto;display:block} .drynet-logos .drynet-logo img{max-height:110px;width:auto;margin:0 auto} .drynet-logo-text{font-family:Montserrat,sans-serif;font-size:1.125rem} .drynet-checklist-wrap .drynet-checklist{margin-bottom:0!important} .drynet-checklist--stack{flex-direction:column} /* --- forms: brand styling for Bit Form and the request forms --- */ .bf-btn.bf-button,.bitforms button[type=submit].bf-btn{background:#0e0e24!important;border:3px solid #0e0e24!important;border-radius:0!important;color:#fff!important;font:600 15px/1.5 Lato,sans-serif!important;letter-spacing:2px!important;text-transform:uppercase!important;padding:10px 20px!important;transition:all .3s!important} .bf-btn.bf-button:hover,.bf-btn.bf-button:focus{background:transparent!important;color:#0e0e24!important} .drynet-form{display:block;max-width:880px} .drynet-form__hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden} .drynet-form__grid{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem 1.5rem} .drynet-form__field{display:flex;flex-direction:column;gap:.4rem;font:600 .9375rem/1.4 Lato,sans-serif;color:#09090a} .drynet-form__field--wide,.drynet-form__consent{grid-column:1/-1} .drynet-form__field input,.drynet-form__field select,.drynet-form__field textarea{width:100%;padding:.8rem 1rem;border:1px solid #d2d2d6;border-radius:6px;background:#fff;color:#121214;font:400 1rem/1.5 Lato,sans-serif;transition:border-color .2s,box-shadow .2s} .drynet-form__field input:focus,.drynet-form__field select:focus,.drynet-form__field textarea:focus{outline:none;border-color:#0e0e24;box-shadow:0 0 0 3px rgba(14,14,36,.12)} .drynet-form__field input:user-invalid,.drynet-form__field textarea:user-invalid{border-color:#c60047} .drynet-form__req{color:#c60047;margin-left:.15em} .drynet-form__consent{display:flex;gap:.75rem;align-items:flex-start;font:400 .9375rem/1.5 Lato,sans-serif;color:#121214} .drynet-form__consent input{margin-top:.3em;width:1.1rem;height:1.1rem;flex:0 0 auto;accent-color:#c60047} .drynet-form__submit{margin-top:1.75rem;background:#0e0e24;border:3px solid #0e0e24;color:#fff;padding:12px 28px;font:600 15px/1.5 Lato,sans-serif;letter-spacing:2px;text-transform:uppercase;cursor:pointer;transition:all .3s} .drynet-form__submit:hover,.drynet-form__submit:focus{background:transparent;color:#0e0e24} .drynet-form__error{color:#c60047;font-weight:700;margin:0 0 1rem} .drynet-form__success{padding:2rem;border-left:4px solid #388e3c;background:#f7f7fa} .drynet-form__success h3{margin:0 0 .75rem!important} .et_pb_section.et_pb_with_background.drynet-section .drynet-form__field span{color:inherit} @media (max-width:767px){.drynet-form__grid{grid-template-columns:1fr}} /* --- sticky mobile contact bar --- */ .drynet-ctabar{position:fixed;left:0;right:0;bottom:0;z-index:99990;display:none;grid-template-columns:repeat(3,1fr);background:#121214;padding-bottom:env(safe-area-inset-bottom,0px);box-shadow:0 -6px 24px rgba(0,0,0,.25);transform:translateY(0);transition:transform .3s ease} .drynet-ctabar.is-hidden{transform:translateY(110%)} .drynet-ctabar__item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;min-height:56px;padding:.5rem .25rem;color:#fff!important;font:600 .75rem/1.2 Lato,sans-serif;letter-spacing:1px;text-transform:uppercase;text-decoration:none;border-right:1px solid rgba(255,255,255,.1)} .drynet-ctabar__item:last-child{border-right:0} .drynet-ctabar__item--call{background:#c60047} .drynet-ctabar__icon{width:1.35rem;height:1.35rem;background:#fff;-webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat} .drynet-ctabar__item--call .drynet-ctabar__icon{--ico:url("data:image/svg+xml,")} .drynet-ctabar__item--wa .drynet-ctabar__icon{--ico:url("data:image/svg+xml,")} .drynet-ctabar__item--req .drynet-ctabar__icon{--ico:url("data:image/svg+xml,")} @media (max-width:980px){.drynet-ctabar{display:grid}body.drynet-has-ctabar{padding-bottom:calc(56px + env(safe-area-inset-bottom,0px))}} .drynet-grid--4 .drynet-pricing-card{padding:2rem 1.5rem!important} .drynet-grid--4 .drynet-pricing-card h3{font-size:1.125rem!important} /* footer v2: five columns -> 2 columns on tablet, 1 on phone */ .drynet-footer .drynet-footer__claim p{color:#4c4c52;font-size:.9375rem} @media (max-width:1100px) and (min-width:981px){.drynet-footer .drynet-footer-row{flex-wrap:wrap}.drynet-footer .drynet-footer-row>.et_pb_column{flex:1 1 30%!important;width:auto!important}} @media (max-width:980px){.drynet-footer .drynet-footer-row>.et_pb_column{flex:1 1 45%!important;width:auto!important}} @media (max-width:600px){.drynet-footer .drynet-footer-row>.et_pb_column{flex:1 1 100%!important}} /* header nav v2 (9 items + help): 16px between 1181 and 1500px with a flag-only language item; below 1181px the nine items do not fit next to the logo and the help button, so the hamburger menu takes over early */ @media (max-width:1500px) and (min-width:1181px){ .drynet-header .et_pb_menu .et-menu>li>a,.drynet-header--de .et_pb_menu .et-menu>li>a{padding:1em 11px;font-size:16px} .drynet-header .et_pb_menu .et-menu>li.menu-item-has-children>a:first-child,.drynet-header--de .et_pb_menu .et-menu>li.menu-item-has-children>a:first-child{padding-right:30px} .drynet-header .et_pb_menu .et-menu>li.menu-item-has-children>a:first-child:after,.drynet-header--de .et_pb_menu .et-menu>li.menu-item-has-children>a:first-child:after{right:10px;font-size:14px;margin-top:-7px} .drynet-header .et_pb_menu .et-menu>li.pll-parent-menu-item>a:first-child{font-size:0!important;line-height:0;padding:20px 30px 20px 11px!important} .drynet-header .et_pb_menu .et-menu>li.pll-parent-menu-item>a img{margin:0;width:20px;height:auto;vertical-align:middle} .drynet-header .et_pb_menu .et-menu>li.pll-parent-menu-item .sub-menu a{font-size:16px;line-height:1.5} } @media (max-width:1180px) and (min-width:981px){ .drynet-header .et_pb_menu .et_pb_menu__menu{display:none!important} .drynet-header .et_pb_menu .et_mobile_nav_menu{display:flex!important;justify-content:flex-end;width:100%;padding-right:1rem} .drynet-header .et_pb_menu .et_pb_menu__wrap{justify-content:flex-end} } /* service pages on phones/tablets (UX #4): content first, the sticky CONNECT/SECURE/OPERATE sidebar follows */ @media (max-width:980px){.et_pb_row:has(>.et_pb_column.drynet-sticky)>.et_pb_column.drynet-sticky{order:2}.et_pb_row:has(>.et_pb_column.drynet-sticky){display:flex;flex-direction:column}} /* carousel dots: 8px dots stay, the tap target grows to 24px */ .drynet-carousel__nav .dots{gap:4px} .drynet-carousel__nav .dot{width:24px;height:24px;min-width:24px;background:transparent;position:relative;display:grid;place-items:center} .drynet-carousel__nav .dot::before{content:"";width:8px;height:8px;border-radius:50%;background:#fff;transition:background .5s} .drynet-carousel__nav .dot.is-active,.drynet-carousel__nav .dot:hover{background:transparent} .drynet-carousel__nav .dot.is-active::before,.drynet-carousel__nav .dot:hover::before{background:#c60047} /* web font stacks with metric-matched fallbacks (CLS): Divi writes 'Montserrat',Helvetica,Arial,... per module and offers no hook for the fallback list, so the heading and body stacks are pinned here */ .et-l :is(h1,h2,h3,h4,h5,h6):not(.et_pb_toggle_title),.et-l .et_pb_module_header,.et-l .et_pb_post_content h2,.et-l .et_pb_post_content h3{font-family:'Montserrat','Montserrat Fallback',Helvetica,Arial,sans-serif!important} .et-l .et_pb_text,.et-l .et_pb_text p,.et-l .et_pb_text li,.et-l .et_pb_blurb_description,.et-l .et_pb_toggle_content,.et-l .et_pb_button,.et-l .et-menu a,.drynet-form,.drynet-trust li,.drynet-breadcrumb ol,.et-l .et_pb_toggle_title{font-family:'Lato','Lato Fallback',Helvetica,Arial,sans-serif!important} /* Divi's Critical CSS puts the Theme Builder body rules (row width 100%, section paddings) into the DEFERRED stylesheet, so the first paint used Divi's defaults (row 80% wide, section padding 4%) and the page jumped when the deferred CSS arrived (CLS 0.3-0.9 on phones). The structural values are pinned here (render-blocking). */ .et-l--body .et_pb_section.drynet-body{padding:0} .et-l--body .et_pb_section.drynet-body>.et_pb_row{width:100%;max-width:100%;padding:0} .et-l--body .et_pb_section.drynet-page-hero{padding:16rem 2rem 10rem 2rem} .et-l--body .et_pb_section.drynet-page-hero>.et_pb_row,.et-l--body .et_pb_section.drynet-trust-section>.et_pb_row{width:100%;max-width:1200px;padding:0} .et-l--body .et_pb_section.drynet-trust-section{padding:0 2rem} .et-l--body .et_pb_section.drynet-archive>.et_pb_row,.et-l--body .et_pb_section.drynet-single>.et_pb_row{width:100%;max-width:1200px;padding:0} @media (max-width:980px){.et-l--body .et_pb_section.drynet-page-hero{padding:12rem 1.5rem 7.5rem 1.5rem}.et-l--body .et_pb_section.drynet-trust-section{padding:0 1.5rem}} /* links inside text on the content pages: underlined (not colour only); white on dark bands */ .drynet-content-section .et_pb_text_inner p a:not(.drynet-more),.drynet-content-section .et_pb_blurb_description a,.drynet-content-section .et_pb_toggle_content a{text-decoration:underline;text-underline-offset:.15em} .drynet-section--dark .et_pb_blurb_description a,.drynet-section--dark .et_pb_text_inner a:not(.et_pb_button):not(.drynet-btn),.drynet-section--dark .et_pb_toggle_content a{color:#fff} .drynet-section--dark .drynet-card .et_pb_text_inner a{color:inherit} /* trust strip: Peplink Gold Partner badge image */ .drynet-trust__item--badge img{flex:0 0 auto;width:44px;height:44px;object-fit:contain;background:#fff;border-radius:50%} /* footer: Gold Partner badge next to the contact block */ .drynet-footer__badge img{width:120px;height:auto;display:block} @media (max-width:980px){.drynet-footer__badge img{margin:0 auto}} /* --- own cookie consent (drynet-consent.php) --- */ .drynet-consent{position:fixed;left:1rem;bottom:1rem;z-index:99995;max-width:440px;width:calc(100% - 2rem)} .drynet-consent[hidden]{display:none} .drynet-consent__card{background:#121214;color:#fff;padding:1.5rem 1.5rem 1.25rem;border-radius:8px;box-shadow:0 16px 48px rgba(0,0,0,.35);font:400 .9375rem/1.5 Lato,sans-serif} .drynet-consent__title{margin:0 0 .5rem!important;font:700 1.125rem/1.3 Montserrat,sans-serif;color:#fff} .drynet-consent__text{margin:0 0 1rem;color:#d2d2d6} .drynet-consent__text a{color:#fff;text-decoration:underline} .drynet-consent__options[hidden],.drynet-consent__btn[hidden]{display:none} .drynet-consent__options{display:flex;flex-direction:column;gap:.75rem;margin:0 0 1rem;padding:1rem;background:rgba(255,255,255,.06);border-radius:6px} .drynet-consent__opt{display:flex;gap:.75rem;align-items:flex-start;font-size:.875rem;color:#d2d2d6} .drynet-consent__opt strong{color:#fff} .drynet-consent__opt input{margin-top:.25rem;width:1.1rem;height:1.1rem;accent-color:#c60047;flex:0 0 auto} .drynet-consent__actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center} .drynet-consent__btn{cursor:pointer;border:2px solid #fff;background:transparent;color:#fff;padding:.6rem 1rem;font:600 .8125rem/1.3 Lato,sans-serif;letter-spacing:1px;text-transform:uppercase;border-radius:0;transition:all .25s} .drynet-consent__btn:hover,.drynet-consent__btn:focus-visible{background:#fff;color:#0e0e24} .drynet-consent__btn--primary{background:#c60047;border-color:#c60047} .drynet-consent__btn--primary:hover,.drynet-consent__btn--primary:focus-visible{background:#fff;border-color:#fff;color:#0e0e24} .drynet-consent__btn--link{border-color:transparent;text-decoration:underline;padding-left:.25rem;padding-right:.25rem} .drynet-consent__btn--link:hover{background:transparent;color:#d2d2d6} @media (max-width:980px){.drynet-consent{left:.5rem;bottom:calc(56px + .5rem + env(safe-area-inset-bottom,0px));width:calc(100% - 1rem)}}