/*
Theme Name: BackaufTheme-Child
Theme URI: http://www.backauf.de/internetauftritt/
Description: Responsives HTML5 & CSS3 Theme mit SEO-Optimiertem HTML-Code
Version: 2.0 ALPHA
Author: Nico Gutmann
Author URI: http://www.backauf.de/internetauftritt/
Template: BackaufTheme
*/

/***********************************
*** YOUR CODE HERE
***********************************/
/**************************
*** CSS Werte
**************************/

::selection {
  background: #0556a5 !important;
  color: white !important; /* WebKit/Blink Browsers */
}
::-moz-selection {
  background: #0556a5 !important;
  color: white !important; /* Gecko Browsers */
}

main{min-width:320px;overflow:hidden;}
#page a{color:#0556a5}
#page ul li a{color:#0556a5 !important;}
#page{margin: 0 auto!important;}
#page > section > article > .panel-layout > .panel-grid > div{padding: 50px 0!important;}
#page > section > article > .panel-layout > .panel-grid > div#pgc-3934-0-0,#page > section > article > .panel-layout > .panel-grid > div#pgc-4002-0-0,#page > section > article > .panel-layout > .panel-grid > div#pgc-7423-0-0,#page > section > article > .panel-layout > .panel-grid > div#pgc-7435-0-0{padding:0!important;}
#page > section > article > .panel-layout > .panel-grid:last-child > div{padding-bottom: 100px!important;}
.panel-layout > .panel-grid{margin-bottom: 0!important;}
#fernwartungstool a{position:absolute;top:-60px;}
.div_block{border:1px solid #ebedee;padding:20px;min-height:310px;box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);}
.div_block_ausbildung{border:1px solid #ebedee;padding:20px;min-height:320px;box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);}
.div_block ul{padding-left:17px;}
.div_block_ausbildung ul{padding-left:17px;}
#page .div_block h2{font-size:18px;}
#page .div_block_ausbildung h2{font-size:18px;}
#page.div_block * img{height:32px;}
#page.div_block_ausbildung * img{height:32px;}
#page.div_block_themen{border:1px solid #ebedee;padding:30px 20px;min-height:120px;box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);text-align:center;}
#page.div_block_themen h4{margin-bottom:0px;font-size:18px;}
#page.div_block_themen h3{margin-bottom:0px;font-size:18px;}
#page.div_block_themen a{color:#000 !important;}
.block_img > div > div > img{height:50px !important;width:auto;margin-bottom:-15px;}
/***
Teaser
***/
.mehrwerte > div > div{border:1px solid #ebedee;padding:20px;box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);}
.mehrwerte *.sow-headline{font-size:20px!important;}
.mehrwerteNoBox *.sow-headline{font-size:20px!important;}
.mehrwerte .sow-headline-container{margin-bottom:10px!important;}
.mehrwerteNoBox .sow-headline-container{margin-bottom:0px!important;}
.mehrwerte ul{margin-top:0!important;margin-bottom:0!important;}
.mehrwerte .sow-image-container{margin-bottom:0!important;}
.mitarbeiter_bc .sow-image-container{margin-bottom:0px !important;}
img *{image-rendering: pixelated;}
h1.timeline-main-title{display:none;}
.meta-details{display:none;}
#counterKunden, #counterMitarbeiter, #counterJahren{font-size:70px;}
.counterStartseite p{font-size:18px;text-align:center;}
#page .div_block_ausbildung > div > div > div{padding-bottom:0 !important;}

html{scroll-behavior: smooth;  overflow-y: scroll;}
body{background-color:white;position:relative;}
header{background-color:white !important;border-top:0px !important;position:fixed !important;top:0;z-index:100;box-shadow: 0 3px 3px rgba(0,0,0,0.2);}
main header{position:fixed !important;background-color:transparent !important;box-shadow:0px 0px 0px;z-index:99;}
.tribe-events-header{position:relative !important;background-color:transparent !important;box-shadow:0px 0px 0px;z-index:99;}
.tribe-events-calendar-list__event-header{position:relative !important;background-color:transparent !important;box-shadow:0px 0px 0px;z-index:99;}
.tribe-common-l-container{padding-top:160px !important;}
#header_infos{display:none;}
header #kontakt{margin-top:15px;margin-right:18%;}
header #kontakt p{margin-bottom:0px;font-size:12px;line-height:1.4;}
header nav{margin-top:5px;background-color:#f4f7fa !important;width:100%;margin-left:0%;}
header nav, header nav ul ul li {background-color:#fff;color:#fff;}
header nav ul li:first-child{background-image:url("/wp-content/uploads/2023/08/Backauf-B-mit-Rahmen-weiss.webp");padding-right:10px;margin-right:-10px;background-repeat:no-repeat;height:40px;background-size:24px;margin-top:0px;top:5px;background-position-y:3px;background-position-x:center;padding-left:0px !important;}
/*#mobmenuleft > li:first-child{background-image:url("/wp-content/uploads/2023/08/Backauf-B-mit-Rahmen-weiss.webp");padding-right:10px;margin-right:-10px;margin-left:15px;background-repeat:no-repeat;height:40px;background-size:24px;margin-top:0px;top:5px;background-position-y:3px;padding-left:0px !important;}*/
header nav ul ul li:first-child{background-image:none;padding-right:0px;margin-right:0px;height:unset;background-size:unset;margin-top:unset;top:unset;background-position-y:unset;background-position-x:unset;padding-left:unset !important;}
header nav ul li a{color:#0556a5 !important;text-transform:uppercase;font-weight:bold;border-top:0px solid black;}
header nav ul li > a::after {content:' ' !important;}
header nav ul li a:hover, header nav ul li.current_page_ancestor a{text-decoration:none;}

.menu-hauptmenue-container{max-width:1050px;margin:0 auto;}
.menu-item-5035 a{font-size:0px;}
.benefits-main  div.panel-grid:nth-child(odd) div.middle > div.panel-grid-cell:nth-child(even){background-color: #f4f7fa;}
.benefits-main  div.panel-grid:nth-child(even) div.middle > div.panel-grid-cell:nth-child(odd){background-color: #f4f7fa;}
.benefits-main div.panel-grid div.middle > div{padding: 20px;}
.benefits-main div.panel-grid div.middle > div.panel-grid-cell{width: 50%!important}
.grey-BG{background-color:#f4f7fa;}
.blue-BG{background-color:#0556a5;}
.blue-BG h1,.blue-BG h2,.blue-BG h3,.blue-BG h4,.blue-BG h5,.blue-BG h6,.blue-BG p,.blue-BG a{color:#fff!important;}
.anc-6310-counter-3-paralax{background-image:none!important;background-color:#f4f7fa;}
.anc-6310-counter-3-common-overlay{background-color:#0556a5!important;}
.nav-small nav ul ul{top:35px !important;}
header nav ul ul{padding-top:0px;background-color:#f4f7fa;box-shadow:0 1px 1px rgba(0,0,0,0.12),
                                                                     0 2px 2px rgba(0,0,0,0.12),
                                                                     0 4px 4px rgba(0,0,0,0.12),
                                                                     0 8px 8px rgba(0,0,0,0.12),
                                                                     0 16px 16px rgba(0,0,0,0.12);
}
header nav ul ul li{background-color:#f4f7fa !important;color:#fff !important;}
header nav ul ul li a{background-color:transparent;font-weight:normal;transition:all .5s;}
header nav ul ul li a:hover{background-color:#0556a5;color:#fff !important;transition:all 0s;}
header nav ul ul li.current-menu-item a, header nav ul ul li.current-menu-ancestor a{background-color:#d7edfc;color:#000 !important;}
/*header nav ul li ul ul{display:block !important;}*/
header nav ul ul ul{left:0;box-shadow:0px 0px;}
header nav ul ul ul li{display:list-item;}
.nav-small #logo{width:150px !important;height:auto !important;}

/***
* Überschriften
***/
*.sow-sub-headline, .panel-grid h2.web-small-headline, .panel-grid *.sow-sub-headline  {color: #0556a5;font-size: 22px;font-weight: 100;margin-bottom: 0!important;margin-top:-10px;}

#page .ctl-title a{color: white;}
/***
* HOME Teaser
***/

  /* ============================================================
   BACKAUF – CSS v9 – für SiteOrigin Page Builder
   Equal-Height Fix basierend auf tatsächlicher DOM-Struktur
   ============================================================ */

.lightBlue {
  background-color: #f4f7fa !important;
}

/* ── FULL-BLEED HINTERGRUND ── */
.panel-grid.ba-dl-section,
.panel-grid .panel-row-style.ba-dl-section {
  position: relative;
}

.panel-grid.ba-dl-section .panel-row-style,
.panel-row-style.ba-dl-section {
  padding: 40px 20px !important;
}

.panel-grid.ba-dl-section--white .panel-row-style,
.panel-row-style.ba-dl-section--white {
  background-color: #ffffff !important;
  padding: 40px 20px !important;
}

div[class*="ba-dl-section"] {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  line-height: 1.6;
}

/* ── Inhaltsbreite begrenzen ── */
#pl-test-start .panel-grid .panel-row-style .panel-grid-cell-container,
.entry-content .panel-grid .panel-row-style .panel-grid-cell-container {
  max-width: 1440px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ── SVG Icons ── */
.ba-dl-ico svg,
div[class*="ba-dl-section"] .ba-dl-ico svg {
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  min-height: 26px !important;
  max-width: 26px !important;
  max-height: 26px !important;
  display: block !important;
  fill: none !important;
  overflow: visible !important;
}

.ba-dl-cta-btn svg {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px !important;
  max-width: 16px !important;
  display: inline-block !important;
  fill: none !important;
  vertical-align: middle !important;
}

/* ── Header ── */
.ba-dl-top {
  text-align: center;
  margin-bottom: 20px;
}

.ba-dl-tag {
  display: inline-block;
  font-size: 14px;
  font-weight: 600;
  color: #2e86c1;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin-bottom: 12px;
}

.ba-dl-top h2,
.panel-grid h2 {
  font-size: 28px;
  font-weight: 700;
  color: #1a3a5c;
  margin: 0 0 8px 0;
  line-height: 1.3;
}

/* ── Einleitungstext ── */
.ba-dl-desc {
  max-width: 820px;
  margin: 0 auto 48px;
  text-align: center;
  font-size: 16px;
  color: #4a5568;
  line-height: 1.75;
}

/* ══════════════════════════════════════════════════════
   GLEICHE KARTENHÖHE

   :has(.panel-grid-cell + .panel-grid-cell) sorgt dafür,
   dass NUR Rows mit 2+ Spalten betroffen sind.
   Einspaltige Header-Rows bleiben unberührt.
   ══════════════════════════════════════════════════════ */

/* 1) Mehrspaltige Rows → Flex-Container */
div.panel-row-style.ba-dl-section:has(.panel-grid-cell + .panel-grid-cell) {
  display: flex !important;
  flex-wrap: wrap !important;
  overflow: visible !important;
}

/* 2) Zellen: Float weg, Flex an */
div.panel-row-style.ba-dl-section:has(.panel-grid-cell + .panel-grid-cell) > .panel-grid-cell {
  display: flex !important;
  flex-direction: column !important;
  float: none !important;
}

/* 3) Wrapper-Kette: so-panel → sow-editor-base → textwidget */
div.panel-row-style.ba-dl-section:has(.panel-grid-cell + .panel-grid-cell) > .panel-grid-cell > .so-panel {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
}

div.panel-row-style.ba-dl-section:has(.panel-grid-cell + .panel-grid-cell) .so-widget-sow-editor-base {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
}

div.panel-row-style.ba-dl-section:has(.panel-grid-cell + .panel-grid-cell) .siteorigin-widget-tinymce.textwidget {
  flex: 1 1 auto !important;
  display: flex !important;
  flex-direction: column !important;
}

/* 4) Karte füllt den gesamten verfügbaren Platz */
.ba-dl-item {
  flex: 1 1 auto !important;
}

/* 5) Mobil: Spalten untereinander */
@media (max-width: 780px) {
  div.panel-row-style.ba-dl-section:has(.panel-grid-cell + .panel-grid-cell) {
    flex-direction: column !important;
  }
  div.panel-row-style.ba-dl-section:has(.panel-grid-cell + .panel-grid-cell) > .panel-grid-cell {
    width: 100% !important;
  }
}

/* ── Karte ── */
.ba-dl-item {
  background: #ffffff;
  border-radius: 8px;
  padding: 32px 28px 28px;
  box-shadow: 0 2px 12px rgba(26, 58, 92, 0.08);
  border: 1px solid #e2e8f0;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  position: relative;
  overflow: hidden;
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}

.ba-dl-item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: #2e86c1;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease;
}

.ba-dl-item:hover {
  box-shadow: 0 8px 30px rgba(26, 58, 92, 0.15);
  transform: translateY(-4px);
}

.ba-dl-item:hover::before {
  transform: scaleX(1);
}

/* ── Icon-Box ── */
.ba-dl-ico {
  width: 52px;
  height: 52px;
  border-radius: 10px;
  background: #f4f7fa;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
  flex-shrink: 0;
  transition: background 0.3s ease;
}

.ba-dl-item:hover .ba-dl-ico {
  background: rgba(46, 134, 193, 0.1);
}

/* ── Titel ── */
.ba-dl-item h3 {
  font-size: 18px;
  font-weight: 700;
  color: #1a3a5c;
  margin: 0 0 10px 0;
  line-height: 1.3;
  flex-shrink: 0;
}

/* ── Text ── */
.ba-dl-item .ba-dl-txt {
  font-size: 14.5px;
  color: #4a5568;
  margin: 0 0 18px 0;
  line-height: 1.65;
  flex: 1 1 auto !important;
}

/* ── Link ── */
.ba-dl-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 600;
  color: #2e86c1;
  text-decoration: none;
  transition: color 0.3s ease, gap 0.3s ease;
  margin-top: auto !important;
  flex-shrink: 0;
}

.ba-dl-link:hover {
  color: #2174a8;
  gap: 10px;
}

.ba-dl-link .ba-arrow,
.ba-dl-cta-btn .ba-arrow {
  display: inline-block;
  line-height: 1;
  transition: transform 0.3s ease;
}

.ba-dl-link .ba-arrow {
  font-size: 16px;
}

.ba-dl-cta-btn .ba-arrow {
  font-size: 18px;
}

.ba-dl-link:hover .ba-arrow,
.ba-dl-cta-btn:hover .ba-arrow {
  transform: translateX(4px);
}

/* ── CTA ── */
.ba-dl-cta {
  background: #1a3a5c;
  color: white;
  border-radius: 8px;
  padding: 40px 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  max-width: 1366px;
  margin: 0 auto;
}

.ba-dl-cta-left {
  flex: 1;
  min-width: 280px;
}

.ba-dl-cta-left h3 {
  font-size: 20px;
  font-weight: 700;
  color: #ffffff;
  margin: 0 0 8px 0;
}

.ba-dl-cta-left p a,
.ba-dl-cta p a {
  color: white !important;
  text-decoration: underline;
}

.ba-dl-cta-left p {
  font-size: 15px;
  color: rgba(255, 255, 255, 0.8);
  margin: 0;
  line-height: 1.6;
}

.ba-dl-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #ffffff;
  color: #1a3a5c;
  font-size: 15px;
  font-weight: 700;
  padding: 14px 28px;
  border-radius: 6px;
  text-decoration: none;
  transition: background 0.3s ease, transform 0.3s ease;
  white-space: nowrap;
}

.ba-dl-cta-btn:hover {
  background: #e8f0f8;
  transform: translateY(-2px);
}

/* ── Responsive ── */
@media (max-width: 1400px) {
  .panel-grid.panel-has-style.ba-dl-section > .panel-row-style {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}

@media (max-width: 600px) {
  .ba-dl-top h2 {
    font-size: 22px;
  }
  .ba-dl-cta {
    padding: 28px 24px;
    flex-direction: column;
    text-align: center;
  }
  .ba-dl-cta-left {
    min-width: unset;
  }
}
    /* SiteOrigin align-items:flex-start überschreiben */
div.panel-row-style.ba-dl-section:has(.panel-grid-cell + .panel-grid-cell) {
  align-items: stretch !important;
}
#pg-w69aff19bc5ae9-1.panel-has-style > .panel-row-style {
  align-items: flex-start;
}



.ba-dl-item {
  padding: 28px 28px 24px !important;
}

/* Wrapper um Icon + Titel: wird per CSS-Grid simuliert,
   da Icon und h3 direkte Kinder von .ba-dl-item sind */
.ba-dl-item {
  display: grid !important;
  grid-template-columns: 48px 1fr;
  grid-template-rows: auto auto auto auto;
  column-gap: 14px;
  row-gap: 0;
  align-items: start;
}

/* ── 2) Icon: links positioniert, erste Spalte, erste Zeile ── */

.ba-dl-ico {
  grid-column: 1;
  grid-row: 1;                    /* Nur Zeile 1, gleiche Zeile wie Titel */
  width: 48px !important;
  height: 48px !important;
  min-width: 48px;
  border-radius: 10px;
  background: rgba(46, 134, 193, 0.08) !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  margin-bottom: 0 !important;
  flex-shrink: 0;
  align-self: center;             /* Vertikal zentriert zur Titel-Zeile */
  margin-top: 0;
}

/* ── 3) Titel: rechts neben dem Icon, vertikal zentriert ── */

.ba-dl-item h3 {
  grid-column: 2;
  grid-row: 1;
  margin: 0 !important;
  align-self: center;             /* Vertikal zentriert zum Icon */
  line-height: 1.35;
}

/* ── 4) Beschreibungstext: volle Breite unter Icon+Titel ── */

.ba-dl-item .ba-dl-txt {
  grid-column: 1 / -1;            /* Volle Breite */
  grid-row: 2;
  margin: 14px 0 16px 0 !important;
}

/* ── 5) Link: volle Breite unten ── */

.ba-dl-item .ba-dl-link {
  grid-column: 1 / -1;
  grid-row: 3;
  margin-top: auto !important;
}

/* ── 6) Hover: Icon-Hintergrund etwas kräftiger ── */

.ba-dl-item:hover .ba-dl-ico {
  background: rgba(46, 134, 193, 0.14) !important;
}


/* ── 7) Responsive: Mobil bleibt Icon inline, aber kleiner ── */

@media (max-width: 780px) {
  .ba-dl-item {
    grid-template-columns: 42px 1fr;
    column-gap: 12px;
    padding: 24px 20px 20px !important;
  }

  .ba-dl-ico {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px;
  }

  .ba-dl-ico svg {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
    min-height: 22px !important;
    max-width: 22px !important;
    max-height: 22px !important;
  }
}


/* ── 8) Leere Icons (Webhosting, Webdesign): Karten ohne SVG ──
   Einige Karten haben ein leeres .ba-dl-ico div ohne SVG.
   Damit die nicht als leerer Kasten angezeigt werden: */

.ba-dl-ico:empty {
  display: none !important;
}

.ba-dl-ico:empty + h3 {
  grid-column: 1 / -1;
}
.ba-dl-tag {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  font-weight: 700;
  color: #2e86c1;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-bottom: 20px;
  background: none;
  border: none;
  padding: 0;
  border-radius: 0;
}

.ba-dl-tag::before {
  content: "";
  display: inline-block;
  width: 3px;
  height: 20px;
  background: #2e86c1;
  border-radius: 2px;
  flex-shrink: 0;
}


/*
Webdesign Neu
*/
.bigNumbers{font-size: 52px;font-weight: 700;color: #fff;line-height: 1;margin-bottom: 12px;opacity: 1;}
.roundImage img{border-radius:1000px; border: 2px #0556a6 solid}
.roundImage .sow-image-container{margin-bottom:0!important}
.blueBorderLeft{background:#f5f5f5;border: 1px solid #f4f7fa !important; border-left: 4px solid #0556a5!important;padding: 32px 36px;display: grid;grid-template-columns: 130px 1fr; gap: 32px;align-items: center; border-radius: 2px;}
.webSmallHeadline{font-size: 12.5px!important;font-weight: 700!important;color: #f4f7fa!important;letter-spacing: 0.08em;text-transform: uppercase;margin-bottom: 8px;}
.webBigHeadline{font-size: 24px;font-weight: 700;color: #f4f7fa;margin-bottom: 14px;line-height: 1.3;}
.webNumbers > div{flex: 1;padding: 28px 28px;border-right: 1px solid rgba(255, 255, 255, 0.25);}
.webNumbers > div:last-child{border-right:none;}
.webNumbers h4{font-size: 15px;font-weight: 700;color: #fff;margin-bottom: 7px;}
.darkHeadWeb{color:#0556a5!important}
.contactName{font-size: 18px;font-weight: 700;color:#0556a5;margin-bottom: 3px;}
.role {font-size: 13px;color:#555555;margin-bottom: 14px;}
.contact-box .contact-links a {display: block; font-size: 14.5px;color:#0556a5;margin-bottom: 5px;font-weight: 600;  }
.web-btn-white {display:inline-block;background: #fff;color: #0556a5 !important;font-weight: 700;font-size: 14px;padding: 11px 28px;border-radius: 3px;white-space: nowrap;text-decoration: none}
  .web-btn-white:hover{text-decoration:underline;}
 .web-cta-box{    background: #0556a5;padding: 36px 40px;border-radius: 3px;display: flex;align-items: center;justify-content: space-between;flex-wrap: wrap;gap: 20px;margin-top: 48px;}
  .web-cta-box p{color:#fff;font-size: 16px;font-weight: 600;max-width: 620px;line-height: 1.5;}
.web-cta-box div span a{color:rgba(255,255,255,0.75)!important;text-decoration:underline;}
  .web-cta-box span{color:rgba(255,255,255,0.75);font-size: 13.5px;font-weight: 300;display: block;margin-top: 4px;margin-bottom: 20px;}
 ul.WebVorteile{margin: 30px 0 28px;list-style: none;padding-left:0;}
 ul.WebVorteile li{padding: 7px 0 7px 25px!important;position: relative;border-bottom: 1px solid #dddddd;font-size: 14.5px;}
 ul.WebVorteile li::before {content: '✓';position: absolute;left: 20px!important;color: #0556a5;font-weight: 700;}
.faq-question{font-size: 14px;font-weight: 600;color: #0556a5;text-align: left;padding: 16px 20px;display: flex;justify-content: space-between;align-items: center;background-color:#f4f7fa}
.faq-answer{padding: 0 20px 18px;}
.faq-border{border:1px solid #b8d4f0;margin-bottom: 50px;}
.usp-pill {display: inline-block;background: #e8f2ff; border: 1px solid #c8ddf5;color: #0556a5;font-size: 11px; font-weight: 700;padding: 2px 9px; border-radius: 2px; margin: 2px 3px 2px 0;}

.home-details{border: 1px solid #0556a5;padding: 15px 20px;margin-bottom: 50px;height: 110px;background-color: rgba(255,255,255,0.25);box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.2);}
.home-details p{color:#0556a5; font-size: 14px; line-height: 1.2;font-weight: normal!important;font-style: italic;}
.home-details .sow-headline-container, .home-details .sow-image-container{margin-bottom: 15px;}
.home-details-photo ul.sow-slider-images li.sow-slider-image{height: 400px!important;padding-top: 50px;}
.home-details-photo ul.sow-slider-images li.sow-slider-image div.sow-slider-image-container .sow-slider-image-wrapper{padding: 60px 20px!important;}
.home-details-photo ul.sow-slider-images li.sow-slider-image div.sow-slider-image-container{background-color: transparent!important;}
nav ul ul li > ul{display:block}
/***** Suche *****/
header{position:fixed !important;z-index: 101}
header #toggleSearch{background-color:transparent;border:none;border-radius:none;margin-top:-32px;z-index:2;margin-left:0px;display:unset;float:left;margin-top:8px;margin-left:0px;}
header #toggleSearch:hover{cursor: pointer;}
#search{margin:0px;}
#searchForm{position:absolute;opacity:1;transition:top 0.75s ease-in-out;width:196px;right:10.5%;padding:7px;top:60px;background-color:#0556a5;z-index:100;box-shadow: 0px 1px 5px 0px #676767;}
#searchForm.displaySearch {opacity:1 !important;z-index:100;width:196px;background-color:#0556a5;right:10.5%;padding:7px;top:112px !important;box-shadow: 0px 1px 5px 0px #676767;}
#searchForm input.search-field{font-size:15px;color:#000;background-color:#fff;border:0px;padding:5px;padding-top:10px;    z-index: -1;
    position: relative;
}
header .fa-search{font-size:20px;color:#fff;}
header .fa-search:hover{cursor: pointer;}

.newmenu ul{margin-left:-355px;height:500px;}
.newmenu ul li ul{margin-left:0;height:auto;border:0;}
.newmenu ul li:nth-child(1){width:200px;}
.newmenu ul li:nth-child(2){width:200px;}
.newmenu ul li:nth-child(3){width:200px;}
.newmenu ul li:nth-child(4){width:200px;}
.newmenu ul li:nth-child(5){width:200px;}
.newmenu ul li{display:inline-block;}
.newmenu ul ul{height:460px !important;}
.newmenu ul ul:after{content:'';height:105%;width:1px;position:absolute;right:0;top:-35px;background-color:#333;}
.newmenu ul ul li{display:list-item !important;font-size:12px;}
.newmenu ul ul li:first-child{margin-top:35px;}

.sub-menu:nth-child(2){margin-top:5px;}
.middle{max-width:1200px;margin:0 auto;}

#logo{width:217px !important;height:auto !important;}
#kontakt{float:right;margin-top:10px;text-align:right;}
.clear{clear:both;}
footer{margin-bottom:0!important;}

header #kontakt p {line-height: 1.75;}
*.sow-headline{font-size:25px!important; font-weight:bold;line-height: 1!important;}
*.sow-headline-container,.sow-image-container{margin-bottom: 30px}

/***
Counter
***/
.counter:after{content:url(/wp-content/uploads/2021/05/schatten_startseite.png);position:absolute;top: 300px;}
.counter{position:relative;}
.headline-Zahlen{border-left: 1px solid #0556a5;padding-top:50px;margin-bottom:100px;}
.headline-Zahlen .sow-headline{font-weight:100!important}
.headline-Zahlen .sow-sub-headline{background-color:#0556a5;display:inline;color:#fff; padding:5px 10px;}

/***
Anker
***/
.ankerlinks{position:absolute;margin-top:-168px;}
/***
LISTEN
***/
ul.home-list li{list-style-type: disclosure-closed!important;line-height:1.4!important;padding-left:0 !important;}
ul.home-list li:before,ul.sow-slider-images li:before{content:" "!important;}
ul.sow-slider-images li.sow-slider-image div.sow-slider-image-container{background-color: rgba(255,255,255,0.75);height:120px;transition:background-color .75s ease-out}
ul.sow-slider-images li.sow-slider-image div.sow-slider-image-container:hover{background-color: rgba(255,255,255,0.6); }
ul.sow-slider-images li.sow-slider-image {height:120px!important;padding-left:0!important;}
ul.sow-slider-images li.sow-slider-image div.sow-slider-image-container p{color:#000!important;text-shadow:unset!important;font-weight:bold;}
ul.sow-slider-images li.sow-slider-image div.sow-slider-image-container a{font-weight:bold;line-height:1.25; }
ul.sow-slider-images li.sow-slider-image div.sow-slider-image-container{text-align: center;}
ul.sow-slider-images li.sow-slider-image div.sow-slider-image-container .sow-slider-image-wrapper{padding:32px 20px !important;}
ul.home-list{padding-left:20px!important;}
#page ul{padding-left:0;}

#page ul li{list-style-type:none;line-height:1.75;padding-left:15px;text-align:left;}
#page ul li:before{content:"✓ " !important;color:#0556a5;margin-left:-15px;}
ul {margin-top:-15px;}
ul.margin-top-ul{margin:15px 0;}
/***
Mitarbeiter
***/
.mitarbeiter_bc img{border-radius: 20px;max-width: 245px!important; height: auto;}
.mitarbeiter_bc > div:first-child{margin-bottom: .4em!important;}
.mitarbeiter_Abstand{margin-bottom:30px;}

/***
Hosting
***/
.blue_checkmark{font-size:24px;color:#0556a5;}
#hosting li{padding:5px 0;}

/***
Partner-Hersteller
***/
.partner_logo div > div > a > img{height:75px !important;width:auto !important;}
.partner_logo div > h3{font-size:14px !important;}
.partner_logo_small div > div > a > img{height:50px !important;width:auto !important;margin-bottom:-15px !important;margin-top:13px;}
.partner_logo_small div > h3{font-size:14px !important;padding-top:28px;}
.veeam_logo div > h3{font-size:14px !important;}
.veeam_logo div > div > a > img{height:25px !important;width:auto !important;padding-top:25px;margin-bottom:25px;}

/***
Newsletter
***/
.cr-mail-responsive, .cr-mail-responsive * {box-sizing: unset;}
.cr_site{margin:0;padding:75px 0 0 0;text-align:center;background-color:#eeeeee;}
.cr_font{font-size: 14px;font-family: Arial;}
.cr_page{width: 100% !important;}
.cr_body{line-height:150%;font-family:Helvetica;font-size:12px;color:#333333;}
.cr_body h2, .cr_header h2{font-size:22px;line-height:28px;margin:0 0 10px 0;}
.cr_body h1, .cr_header h2{font-size:28px;margin-bottom:15px;padding:0;margin-top:0;}
.wrapper, .cr_page{margin:0 auto 10px auto;text-align:left;}
.cr_header{text-align:center;background: transparent !important;}
.cr_body label, .cr_body .label{float:none;clear:both;display:inline-block;width:auto;margin-top:8px;text-align:left;font-weight:bold;position:relative;}
.cr_body .no-label{font-weight: normal;}
.cr_body #editable_content{padding:20px;}
.editable-content {padding:20px}
.cr_button{float:left;display:inline-block;font-family:'Helvetica', Arial, sans-serif;width:auto;white-space:nowrap;height:32px;margin:5px 5px 0 0;padding:0 22px;text-decoration:none;text-align:center;font-weight:bold;font-style:normal;font-size:15px;line-height:32px;cursor:pointer;border:0;-moz-border-radius:4px;border-radius:4px;-webkit-border-radius:4px;vertical-align:top;}
.cr_button{background-color:#333;color:#ffffff;}
.cr_button:hover,.cr_button-small:hover{opacity:0.7;filter:alpha(opacity=70);}
.powered{padding:20px 0;width:560px;margin:0 auto;}
.cr_ipe_item label{line-height:150%;font-size:14px;}
.cr_ipe_item textarea{background: none repeat scroll 0 0 #ffffff;border-radius:3px;border: 1px solid #ccc;font-family:Helvetica;font-size: 16px;width:500px;}
.cr_ipe_item input{background: none repeat scroll 0 0 #ffffff;border-radius:3px;border: 1px solid #ccc;padding: 12px;font-family: Helvetica;font-size: 16px;width:500px;}
.cr_ipe_item select{background: none repeat scroll 0 0 #ffffff;border-radius:3px;border: 1px solid #ccc;padding: 12px !important;display: block;margin: 0;padding: 5px;width: 100%;font-family: Helvetica;font-size: 16px;width:525px;}
.cr_ipe_item input.cr_ipe_radio, input.cr_ipe_checkbox{-moz-binding: none;-moz-box-sizing: border-box;background-color: -moz-field !important;border: 2px inset ThreeDFace !important;color: -moz-fieldtext !important;cursor: default;height: 13px;padding: 0 !important;width: 13px;}
.cr_ipe_item input.cr_ipe_radio{-moz-appearance: radio;border-radius: 100% 100% 100% 100% !important;margin: 3px 3px 0 5px;}
.cr_ipe_item{margin: 0px 10px; padding: 0px 10px;}
.submit_container{text-align:center}
.cr_ipe_item.inactive{display:none;}
.imprint{font-size:0.8em;}
.cr_captcha{padding-left:130px;}
.cr_error{font-size:1.1em;padding:10px;}
.clever_form_error{background-color:#f99; color:#000; border:1px solid #f22 !important}
.clever_form_note {margin:26px 0 0 3px;position:absolute;display:inline; padding: 2px 4px; font-weight:bold;background-color:#f2ecb5; color:#000; font-size:12px !important;  }
.cr_form-flex{display: flex;}
.cr_form-flex>.cr_form-inputgroup{flex-grow:1;margin-right: 5px;}
.cr_form-flex>.cr_form-inputgroup:last-child{margin-right: 0px;}
.cr_form-flex input{width:100%;}

.cr_site {background-color:#eee;}
.cr_header {color:#000000;}
.cr_body {background-color:#efefef;font-size:12px;color:#000000;padding-bottom: 50px;margin-bottom: 50px;}
.cr_hr {background-color:#ccc;}
.cr_site a {color:#0084ff;}
.imprint {color:#000;}
.mce_text{padding-top: 30px;}
.crArchive {border:1px solid #888;background-color: #eeeeee;}
.crArchiveItem {background-color: #ffffff;padding:2px;text-align:left;}
.crArchiveItem.CREven {background-color: #eeeeee;}
.crArchiveItemDate {display:block;float:left; min-width:85px;text-align:left;}
.crArchiveItemName {display:inline;font-weight:bold;}
.crArchiveItemImage, .crArchiveItemDescription {display:none;}
table#newsletter-themen tbody tr th,table#newsletter-themen tbody tr td{padding: 3px;}
table#newsletter-themen {margin: 20px 0;}
.onlyOnMobile{display: none;}
/****
BLOG
***/
#blog{max-width: 75%; float:left;padding-right:30px;margin-top:25px;}
#blog h2 a{color:#0556a5;}
#blog p a{color:#0556a5;}
#blog section > article{border-bottom: 1px solid #000;}
.category section article:nth-child(even){background-color: #eee;}
.category section article {padding: 50px 20px;}
.category-title{border-bottom: 1px solid #000;}
.category{border-bottom: 0 !important;}
#sidebar .widget h6{padding:0 10px;}
#sidebar .widget ul{list-style-type:none;padding-left:0;padding-top: 20px;}
#sidebar .widget ul li{padding:10px;}
#sidebar .widget ul li a{color:#0556a5;text-decoration:none;}
#sidebar .widget ul li:nth-child(odd){background-color:#eee}
#sidebar .widget ul li:hover{background-color:#0556a5;}
#sidebar .widget ul li:hover a{color:#fff;}
#sidebar{margin-top:50px;}
/***
* SUCHE
***/
div#searchinfo{border-bottom:1px dashed #000;padding:30px 20px;}
#page .search:nth-child(even){background-color: #eee;}
#page .search{padding:30px;border-bottom:1px dashed #000;}
#nav_search{margin-bottom:100px;}
#cmplz-document{max-width:1200px !important;}


#mobileKontakt{display:none;}

.headline-Zahlen .sow-sub-headline{margin-left:-1px !important;}
.menu-hauptmenue-container{float:left;width:1140px;text-align:center;max-width:unset;}
#menu-hauptmenue{max-width: 100%;}

.onlyOnIPad{display:none;}

.home-details-photo .onlyOnIPad{border:1px solid #0556a5;background-color:rgba(255,255,255,0.25);padding:25px}
.home-details-photo .onlyOnIPad ul{margin-top:0px;}
.home-list{margin-top:0px;}
html ul.home-list li:before{display:none !important;}

.ansprechpartnerIMG > div > div > img{max-width:200px !important;height:auto;}

.home-details-photo .sow-slider-image{background-position: center left !important;}

/***
* Impressum / Datenschutz
***/

#Daten_oben{margin-top: 60px;}
#Daten_unten{margin-top: 45px;}

.center *{text-align:center;}

.twocollums{}
.twocollums input {width:97%;}
.twocollums p{width:50%;float:left;}
.wpcf7-form-control{width:450px;height:40px;margin-bottom:25px;font-family: arial, helvetica, sans-serif;}
.wpcf7-submit{width:unset !important;height:unset !important;font-family: arial, helvetica, sans-serif;}
.wpcf7-textarea{height:120px;font-family: arial, helvetica, sans-serif;margin-top: 0px !important;width: 99%;}
.wpcf7-select{width:458px !important;font-family: arial, helvetica, sans-serif;}
.blueButton{padding:15px 30px;background-color:#0556a5;color:white;border:0px;box-shadow:
  0 2.8px 2.2px rgba(0, 0, 0, 0.034),
  0 6.7px 5.3px rgba(0, 0, 0, 0.048),
  0 12.5px 10px rgba(0, 0, 0, 0.06),
  0 22.3px 17.9px rgba(0, 0, 0, 0.072),
  0 41.8px 33.4px rgba(0, 0, 0, 0.086),
  0 100px 80px rgba(0, 0, 0, 0.12)
;}
.whiteButton{padding:15px 30px;background-color:white;font-weight:bold;color:#0556a5;border:0px;box-shadow:
  0 2.8px 2.2px rgba(0, 0, 0, 0.034),
  0 6.7px 5.3px rgba(0, 0, 0, 0.048),
  0 12.5px 10px rgba(0, 0, 0, 0.06),
  0 22.3px 17.9px rgba(0, 0, 0, 0.072),
  0 41.8px 33.4px rgba(0, 0, 0, 0.086),
  0 100px 80px rgba(0, 0, 0, 0.12)
;}
.smallBlueFont{font-size:14px;color:black;}
#page > section > article > .panel-layout > .panel-grid > .noMarginTop{padding-top:0px !important;}
#page > section > article > .panel-layout > .panel-grid:last-child > .noMarginTop{padding-bottom:0px !important;}
.noMarginTop > div > div {margin-top:-15px !important;margin-bottom:-20px !important;}
.hugeKontakt{text-align:center;font-size:48px;text-transform:uppercase;margin-bottom:80px;}
.notSoHugeKontakt{text-align:center;font-size:28px;text-transform:uppercase;margin-bottom:60px;margin-top:100px;}
.blueP{color:#0556a5;font-weight:bold;}
.kontaktP{text-align:center;text-transform:uppercase;font-size:22px;line-height:1.6;margin-bottom:40px;}
.kontaktP a{color:black !important;}
.Kontaktbuilder{max-width:200px;margin:0 auto;margin-bottom:100px;}
.headerButton{background-color:#0556a5;padding:20px;color:white;font-weight:bold;}
.headerButton:hover{color:white;}
#anfrageButtonDiv{position:absolute;top:35px;right:20%;}

#facebookBubble{position:fixed;width:72px;height:72px;right:0;border-radius:45px;background-color:#0556a5;margin-top:194px;transition-duration:.4s;margin-right:15px;z-index:9999;}
#facebookBubble img{margin-left:20px;margin-top:20px;}
#linkedinBubble{position:fixed;width:72px;height:72px;right:0;border-radius:45px;background-color:#0556a5;margin-top:102px;transition-duration:.4s;margin-right:15px;z-index:9999;}
#linkedinBubble img{margin-left:20px;margin-top:20px;}
#instaBubble{position:fixed;width:72px;height:72px;right:0;border-radius:45px;background-color:#0556a5;margin-top:10px;transition-duration:.4s;margin-right:15px;z-index:9999;}
#instaBubble img{margin-left:20px;margin-top:20px;}
#divRightside {position:absolute;z-index:99999999;right:0px;top:235px;}
     footer .footer-menu{padding-left:0;margin-top:0;list-style-type:none;}
     footer .footer-menu li{line-height:1.75}
  footer a{text-decoration:underline}
/****** RESPONSIVE *******/
@media only screen and (max-width: 852px) {
footer .panel-grid  .panel-row-style  {padding-top:0!important}
#divRightside {top:105px;}
.wpcf7-textarea{width: 97%;}
  .wpcf7-select option{font-size:10px;}
  .wpcf7-select{width:99% !important;}
  .twocollums p{width:unset;float:unset;}
  .partner_logo div > h3{margin-bottom: 50px;}
  .mitarbeiter_bc img{margin: 0!important; }
  .mitarbeiter_bc {margin-bottom: 20px!important; }
  #page > section > article > .panel-layout > .panel-grid > div.blue-BG{padding:20px 10px !important;margin-left:-10px;margin-right:-10px;margin-bottom:-10px;}
  #Daten_oben{margin-top: 50px;margin-left: 20px;}
  #Daten_unten{margin-top: 30px;margin-left: 20px;}
  *.sow-headline,h3.widget-title{font-size:20px!important;}
  *.sow-sub-headline{font-size: 18px;}
  #zeiten {display:none;}
  #telefon {display:none;}
  html #anfrageButtonDiv {
  top: 30px;
  right: 5% !important;
}
.hugeKontakt{line-height:1.5;}
.headerButton{padding:10px !important;}
header{z-index:99999;box-shadow:unset;width:40% !important;right:0;height:4px !important}
.hugeKontakt{padding-top:25px !important;}
.notSoHugeKontakt{line-height:2;}
.Kontaktbuilder img{}
.grey-BG{margin-left:-10px;margin-right:-10px;}
.mob-menu-logo-holder{height:81px !important;background-color:white;}
  #logo{display:none !important;}
  body header{padding-top:76px !important;}
  .notOnMobile{display:none !important;}
  .counterStartseite{display:none;}
  #fernwartungstool{margin-top:50px !important;}
  .onlyOnMobile{display:block;}
  #panel-3934-0-0-2 .onlyOnMobile {display:none;}
  .onlyOnMobile ul{margin-top:15px;}
  header #kontakt{margin-top:15px;margin-right:unset !important;width:auto !important;}
  .cr_form-input {width:92% !important;}
  .cr_form-select{width:92% !important;}
  #withsidebar{padding-top:70px !important;}
  #mobileKontakt{display:block;margin-top:10px;margin-bottom:10px;}
  footer{padding-top:30px !important;padding-bottom: 10px !important;margin-top: 115px !important;}
  footer p{margin-bottom:0px !important;}

  .mob-icon-menu{margin-top:-80px !important;}
  html .mob-standard-logo{height:40px !important;float:left;margin-top:20px;}
  main{padding-top:65px !important;}
  #page > section > article > .panel-layout > .panel-grid > div:first-child {padding-top:10px !important}
  #page > section > article > .panel-layout > .panel-grid > div:first-child img {margin-top:-10px;margin-left:-10px;margin-right:-10px;margin-bottom:-25px;max-width:calc(100% + 20px);width:unset;}
  #pl-3934{margin-top:-10px;}
  .ankerlinks{position:absolute;margin-top:-84px;}
  .imgText{position:absolute;margin-top:-65px;z-index:99999;margin-left:30px;color:white;}
  .imgText p{font-size:12px;}
  #smallFontIMG{font-size:10px;position:absolute;margin-top:-5px;z-index:99999;color:white;width:200px;}
  .mob-standard-logo{margin-right:20px;}
  #page > section > article > .panel-layout > .panel-grid > div{padding: 50px 0 10px 0!important;}
  #page > section > article > .panel-layout > .panel-grid:last-child > div{padding-bottom: 50px!important;}
  header.newstitle{display: none;}
  div.category-title{padding:0;margin: 0 20px;width: calc(100% - 40px);}
  .category h1{padding: 0 20px;}
  .category > p{padding: 0 20px;}
  #blog{max-width: 100%;}
  .entry{margin: 0 auto;padding: 0 20px;}
  aside#sidebar{max-width: 100%;margin-top: 0; border-top:1px dashed #000;padding-top: 20px;}
  div.category{margin-bottom: 0;}
  aside#sidebar .widget ul li {padding: 20px;}
  aside#sidebar .widget ul li a{font-size:18px;}
  aside#sidebar .widget h6{font-size:18px;padding: 0 20px;}
  .blue-BG * img{margin-left:0px !important;}
  .blue-BG .divSwap p{margin-left:-4px;}
  #page > section > article > .panel-layout > .panel-grid:last-child > .blue-BG{padding-bottom:0px !important;}
}

@media only screen and (min-width: 600px) and (max-width: 851px) {
  html .onlyOnIPad{display:block !important;}
  #panel-3934-0-0-2 .onlyOnMobile {display:none;}
}

@media only screen and (min-width: 781px) and (max-width: 852px) {
  .mitarbeiter_bc img{max-width:150px !important;}
}

@media only screen and (min-width: 450px) and (max-width: 780px) {
  .home-details-photo .onlyOnIPad{padding: 15px;}
  #Daten_Icon_Main div.middle div.panel-grid-cell {float: left;width: 25%!important;}
  #Daten_Icon_Main div.panel-row-style {display: block;}
  #Daten_Icon_Main div.panel-grid::after {clear:both;display: block;content: "";}
  #Daten_Icon_Main div.middle div.panel-grid-cell:nth-child(2n+0) {float: left;width: 75%!important;}
  #Daten_oben{margin-top:50px;margin-left:0;}
  #Daten_unten{margin-top:25px;margin-left:0;}
  .partner_logo_small div > h3{padding-top: 0;margin-bottom: 50px;}
  .MobileAlignLeft p,.MobileAlignLeft h6,.MobileAlignLeft #mobileZeiten, .MobileAlignLeft #mobileTelefon{text-align:left!important;}
  footer .middle .panel-grid-cell{margin-bottom:50px!important;}

}
@media only screen and (min-width: 320px) and (max-width: 449px) {
    .partner_logo_small div > h3{padding-top: 0;margin-bottom: 50px;}
    #Daten_Icon_Main div.panel-row-style {display: block;}
  #Daten_Icon_Main div.middle div.panel-grid-cell {float: left;width: 39%!important;}
    #Daten_Icon_Main div.panel-grid::after {clear:both;display: block;content: "";}
  #Daten_Icon_Main div.middle div.panel-grid-cell:nth-child(2n+0) {float: left;width: 61%!important;}
  #Daten_oben{margin-top:20px;margin-left:0;}
  #Daten_unten{margin-top:0px;margin-left:0;}
  .MobileAlignLeft p,.MobileAlignLeft h6,.MobileAlignLeft #mobileZeiten, .MobileAlignLeft #mobileTelefon{text-align:left!important;}
  footer .middle .panel-grid-cell{margin-bottom:50px!important;}

}

@media only screen and (min-width: 600px) and (max-width: 780px) {
  .home-details-photo .panel-grid-cell{width:50% !important;margin-left:46%;}
  html main .home-details-photo .sow-slider-image{background-position: -100px center!important;}
}

@media only screen and (min-width: 600px) and (max-width: 700px) {
  .onlyOnIPad ul li{font-size: 12px; line-height: 18px;}
}
@media only screen and (min-width: 701px) and (max-width: 800px) {
  .onlyOnIPad ul li{font-size: 14px; line-height: 20px;}
}


@media only screen and (max-width:1024px){
.onlyOnIPad{display:block;}
html .notOnIPad{display: none !important;}
.home-details-photo ul.sow-slider-images li.sow-slider-image{height: 305px!important;padding-top: 30px;}
  html .home-details-photo .sow-slider-image{background-position: center center !important;}
  .home-details-photo ul.sow-slider-images li.sow-slider-image div.sow-slider-image-container .sow-slider-image-wrapper{padding: 35px!important;}
}

@media only screen and (min-width: 1368px){
    main{padding-top:133px !important;}
    html #withsidebar{padding-top:133px !important;}
}

@media only screen and (max-width: 1367px) and (min-width: 1301px){
    main{padding-top:133px !important;}
}

@media only screen and (min-width: 853px) and (max-width: 1300px)  {
html main{padding-top: 69px !important;}
html #withsidebar{padding-top: 69px !important;}
}



@media only screen and (max-width: 1200px) {
  .iPadHomeDetails p{font-size:13px;}
  header #kontakt{margin-top:15px;margin-right:160px;width:450px !important;}
  #anfrageButtonDiv{right:1% !important;}
  .headerButton{padding:12px;}
}

@media only screen and (max-width: 1300px){
  .menu-hauptmenue-container{float:left;width:100%;text-align:left;max-width:unset;}
  #page{padding:10px;width:unset !important;padding-top: 16px;}
  .div_block{min-height:350px;}
  nav {display:none !important;}
  #searchForm{display:none !important;}
  .mobmenul-container{top:100px !important;}
  #logo{margin-left:35px !important;}
  .mob-icon-menu{margin-top:-70px;}
  .mob-standard-logo{float:left;margin-left:55px;}
   #anfrageButtonDiv{right:5%;} 
  .home-details-photo{margin-left:-10px;margin-right:-10px;}
  #logo{display:none !important;}
}
@media only screen and (max-width: 1860px){
  .home-details-photo .sow-slider-image{background-position: -145px center !important;}
  .iPadHomeDetails{margin-left:40%;display:block !important;}
  .iPadHomeDetails > div:first-child{display: none;}
  .iPadHomeDetails > div:nth-child(odd){padding:0 5px;}
  .iPadHomeDetails .so-widget-image{width:30px;height:30px;}
  .iPadHomeDetails p{font-size:14px;}
  .iPadHomeDetails > div {width:calc(33% - 10px)!important;float:left;}
  .iPadHomeDetails .home-details{margin:10px;margin-bottom:15px;padding:10px !important;}
  #anfrageButtonDiv{right:12%;}
}

@media only screen and (max-width: 1430px){
  #anfrageButtonDiv{right:5%;}
}

@media only screen and (min-width: 1860px){
.home-details-photo .sow-slider-image-wrapper{max-width: 1700px!important;margin-left: 100px;}
html .home-details-photo ul.sow-slider-images li.sow-slider-image div.sow-slider-image-container .sow-slider-image-wrapper{padding:60px 50px 60px 400px !important}
}
@media only screen and (min-width: 1300px) {
.imgText{position:absolute;margin-top:-40px;z-index:99999;margin-left:30px;color:white;}
.imgText p{font-size:16px;}
#smallFontIMG{font-size:12px;}
}

@media only screen and (min-width: 600px) and (max-width: 1024px)
{
  .home-details-photo .sow-slider-image{background-image:url("/wp-content/uploads/2021/11/Stefan_Backauf_mit_Namen_iPhone_Quer.jpg") !important;}
}

@media only screen and (min-width: 1025px) and (max-width: 1221px)
{
  .home-details-photo .sow-slider-image{background-image:url("/wp-content/uploads/2021/11/Stefan_Backauf_mit_Namen_iPad_Pro.jpg") !important;}
}
@media only screen and (max-width: 780px){
  .benefits-main div.panel-grid div.middle > div.panel-grid-cell{width: 100%!important;}
  .benefits-main > div > div > div > div > div{padding:20px;}
  .benefits-main  div.panel-grid:nth-child(odd) div.middle > div.panel-grid-cell:nth-child(even){background-color: #f4f7fa;}
  .benefits-main  div.panel-grid:nth-child(even) div.middle > div.panel-grid-cell:nth-child(odd){background-color: white;}
  .benefits-main  div.panel-grid:nth-child(even) div.middle > div.panel-grid-cell:nth-child(even){background-color: #f4f7fa;}
}
@media only screen and (min-width: 430px) and (max-width: 599px)
{.home-details-photo ul.sow-slider-images li.sow-slider-image{height: 450px!important} }
@media only screen and (max-width: 599px)
{
  html .onlyOnIPad{display:none !important;}
  #panel-3934-0-0-2 .onlyOnMobile {display:block;}
  html .home-details-photo .sow-slider-image{background-image:url("/wp-content/uploads/2021/11/Stefan_Backauf_mit_Namen_iPhone.jpg") !important;background-repeat: no-repeat !important;}
}

.wpcf7-not-valid-tip{color:black;font-size:1em;font-weight:normal;display:block;position:absolute;top:32px;background-color:white;padding:10px;border-radius:5px;}

/* CF7-Fehlerhinweise standardmaessig verstecken */
.wpcf7 .wpcf7-not-valid-tip { display: none; }
.wpcf7 .wpcf7-form-control[aria-invalid="true"] { outline: none; }

/* Nach erstem, gescheitertem Submit anzeigen */
.cf7-show-errors .wpcf7-not-valid-tip { display: block; }

/* Optional kleine Button-Optik, wenn wir clientseitig blocken */
button.cf7-blocked, input[type="submit"].cf7-blocked {
  opacity: 0.7;
  cursor: not-allowed;
}

.wpcf7-list-item {margin:0px !important}




/* ============================================================
   BACKAUF FOOTER – Dark Design
   ============================================================ */

/* Reset: Footer-spezifisches Styling überschreibt Theme */
.ba-footer-row,
footer .ba-footer-row {
  background: #0c1e33 !important;
  padding: 0 !important;
  margin-bottom: 0 !important;
}

.ba-footer {
  position: relative;
  overflow: hidden;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  line-height: 1.6;
}

.ba-footer::before {
  content: '';
  position: absolute;
  top: -120px;
  right: -80px;
  width: 400px;
  height: 400px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(46,134,193,0.08) 0%, transparent 70%);
  pointer-events: none;
}

.ba-footer::after {
  content: '';
  position: absolute;
  bottom: -60px;
  left: -40px;
  width: 250px;
  height: 250px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(5,86,165,0.06) 0%, transparent 70%);
  pointer-events: none;
}

/* ── Accent Line ── */
.ba-footer-accent {
  height: 3px;
  background: linear-gradient(90deg, #2e86c1 0%, #0556a5 40%, #1a3a5c 100%);
}

/* ── Main Grid ── */
.ba-footer-main {
  max-width: 1200px;
  margin: 0 auto;
  padding: 64px 40px 48px;
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1.2fr;
  gap: 48px;
  position: relative;
  z-index: 1;
}

/* ── Brand Column ── */
.ba-footer-logo {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}

.ba-footer-logo-icon {
  width: 38px;
  height: 38px;
  background: #2e86c1;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  color: white;
  font-size: 18px;
  line-height: 1;
}

.ba-footer-logo-text {
  font-size: 20px;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
}

.ba-footer-logo-text span {
  display: block;
  font-size: 11px;
  font-weight: 400;
  color: #64809a;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  margin-top: 0;
}

.ba-footer-desc {
  font-size: 14px;
  line-height: 1.7;
  color: #7a93a9;
  margin-bottom: 28px;
  max-width: 300px;
}

/* ── Contact Items ── */
.ba-footer-contact {
  margin-bottom: 0;
}

.ba-footer-contact-item {
  display: flex !important;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
  font-size: 14px;
  color: #94adc0 !important;
  text-decoration: none !important;
  transition: color 0.2s;
}

.ba-footer-contact-item:hover {
  color: #ffffff !important;
}

.ba-footer-contact-item svg {
  stroke: #2e86c1;
  flex-shrink: 0;
}

a.ba-footer-contact-item {
  color: #94adc0 !important;
}

a.ba-footer-contact-item:hover {
  color: #ffffff !important;
}

/* ── Zeiten Badge ── */
.ba-footer-zeiten {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(46, 134, 193, 0.08);
  border-radius: 6px;
  padding: 8px 14px;
  margin-top: 20px;
  font-size: 12px;
  color: #64809a;
}

.ba-footer-zeiten svg {
  stroke: #2e86c1;
  flex-shrink: 0;
}

/* ── Link Columns ── */
.ba-footer-col h4 {
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #2e86c1 !important;
  margin-bottom: 24px !important;
  position: relative;
  padding-bottom: 12px;
  line-height: 1.3 !important;
}

.ba-footer-col h4::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 24px;
  height: 2px;
  background: #2e86c1;
  border-radius: 1px;
}

.ba-footer-col ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.ba-footer-col ul li {
  margin-bottom: 10px;
  padding-left: 0 !important;
  list-style: none !important;
}

.ba-footer-col ul li::before {
  display: none !important;
  content: '' !important;
}

.ba-footer-col ul li a {
  color: #7a93a9 !important;
  text-decoration: none !important;
  font-size: 14px;
  transition: color 0.2s, padding-left 0.2s;
  display: inline-block;
  position: relative;
  font-weight: normal !important;
}

.ba-footer-col ul li a:hover {
  color: #ffffff !important;
  padding-left: 6px;
}

.ba-footer-col ul li a::before {
  content: '' !important;
  position: absolute;
  left: -12px;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #2e86c1;
  opacity: 0;
  transition: opacity 0.2s;
  margin-left: 0 !important;
}

.ba-footer-col ul li a:hover::before {
  opacity: 1;
}

/* ── CTA Box ── */
.ba-footer-cta-box {
  background: rgba(46, 134, 193, 0.08);
  border: 1px solid rgba(46, 134, 193, 0.15);
  border-radius: 10px;
  padding: 24px;
  margin-bottom: 20px;
}

.ba-footer-cta-box h5 {
  font-size: 14px;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 8px;
}

.ba-footer-cta-box p {
  font-size: 13px;
  color: #7a93a9;
  line-height: 1.6;
  margin-bottom: 14px;
}

.ba-footer-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #2e86c1;
  color: #ffffff !important;
  font-size: 13px;
  font-weight: 600;
  padding: 10px 20px;
  border-radius: 6px;
  text-decoration: none !important;
  transition: background 0.2s, transform 0.2s;
}

.ba-footer-cta-btn:hover {
  background: #3498db;
  transform: translateY(-1px);
  color: #ffffff !important;
}

.ba-footer-cta-btn .ba-arrow {
  font-size: 16px;
  transition: transform 0.3s;
}

.ba-footer-cta-btn:hover .ba-arrow {
  transform: translateX(4px);
}

/* ── Fernwartung ── */
.ba-footer-fernwartung {
  display: flex !important;
  align-items: center;
  gap: 12px;
  padding: 14px 18px;
  background: rgba(255,255,255,0.04);
  border-radius: 8px;
  text-decoration: none !important;
  transition: background 0.2s;
  color: inherit !important;
}

.ba-footer-fernwartung:hover {
  background: rgba(255,255,255,0.08);
}

.ba-footer-fernwartung-icon {
  width: 36px;
  height: 36px;
  min-width: 36px;
  background: rgba(46, 134, 193, 0.15);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.ba-footer-fernwartung-icon svg {
  stroke: #2e86c1;
}

.ba-footer-fernwartung-text {
  font-size: 13px;
  color: #7a93a9;
  line-height: 1.4;
}

.ba-footer-fernwartung-text strong {
  display: block;
  color: #c8d6e5;
  font-weight: 600;
  font-size: 14px;
}

/* ── Divider ── */
.ba-footer-divider {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 40px;
  position: relative;
  z-index: 1;
}

.ba-footer-divider hr {
  border: none;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(46,134,193,0.2) 20%, rgba(46,134,193,0.2) 80%, transparent);
}

/* ── Bottom Bar ── */
.ba-footer-bottom {
  max-width: 1200px;
  margin: 0 auto;
  padding: 24px 40px 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 1;
}

.ba-footer-bottom-left {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.ba-footer-bottom-left a {
  color: #536b80 !important;
  text-decoration: none !important;
  font-size: 13px;
  transition: color 0.2s;
}

.ba-footer-bottom-left a:hover {
  color: #ffffff !important;
}

.ba-footer-bottom-left span {
  color: #2a3f52;
  font-size: 13px;
}

/* ── Social Icons ── */
.ba-footer-social {
  display: flex;
  gap: 8px;
}

.ba-footer-social a {
  width: 38px;
  height: 38px;
  display: flex !important;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition: all 0.25s;
  text-decoration: none !important;
  color: #7a93a9 !important;
}

.ba-footer-social a:hover {
  background: #2e86c1;
  border-color: #2e86c1;
  transform: translateY(-2px);
  color: #ffffff !important;
}

.ba-footer-social a svg {
  width: 16px;
  height: 16px;
}

/* ── Responsive ── */
@media (max-width: 900px) {
  .ba-footer-main {
    grid-template-columns: 1fr 1fr;
    gap: 40px 32px;
    padding: 48px 24px 36px;
  }
}

@media (max-width: 600px) {
  .ba-footer-main {
    grid-template-columns: 1fr;
    gap: 36px;
    padding: 40px 20px 32px;
  }
  .ba-footer-bottom {
    flex-direction: column;
    gap: 20px;
    text-align: center;
    padding: 20px;
  }
  .ba-footer-bottom-left {
    justify-content: center;
  }
  .ba-footer-social {
    justify-content: center;
  }
}


/* ── Theme-Footer-Reset ── */
footer {
  background-color: #162944 !important;
  margin-top:0!important;

}
footer p {
  text-align: left;
}

/* ── Row 1: Oberer Bereich ── */
.ba-footer-v3-upper {
  max-width: 1200px;
  padding-left: max(40px, calc((100% - 1200px) / 2 + 40px)) !important;
  padding-right: max(40px, calc((100% - 1200px) / 2 + 40px)) !important;
  padding-top: 75px !important;
  padding-bottom: 36px !important;
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
  gap: 28px;
}

.panel-row-style-for-w69b40ede7c7a8-2 {
  background: #162944 !important;
}

/* ── Brand / Logo ── */
.ba-footer-v3-brand {
  font-size: 20px !important;
  font-weight: 700 !important;
  color: #fff !important;
  margin-bottom: 4px !important;
  text-align: left !important;
}

.ba-footer-v3-tagline {
  font-size: 12px !important;
  color: #6a90bb !important;
  margin-bottom: 16px !important;
  text-align: left !important;
}

/* ── Social Icons ── */
.ba-footer-v3-social {
  display: flex;
  gap: 8px;
  margin-top: 4px;
}

.ba-footer-v3-soc {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  display: flex !important;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  color: #6a90bb !important;
  text-decoration: none !important;
  transition: background 0.2s, color 0.2s;
  line-height: 30px;
  text-align: center;
}

.ba-footer-v3-soc:hover {
  background: #1a3e6e;
  color: #fff !important;
}

/* ── Spalten-Titel ── */
.ba-footer-v3-col-title {
  font-size: 11px !important;
  font-weight: 600 !important;
  color: #4a8fd4 !important;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin-bottom: 12px !important;
  display: block;
}

/* ── Links in den Spalten ── */
.ba-footer-v3-upper a {
  color: #6a90bb !important;
  text-decoration: none !important;
  font-size: 13px;
  display: block;
  margin-bottom: 6px;
  transition: color 0.2s;
  font-weight: normal !important;
}

.ba-footer-v3-upper a:hover {
  color: #fff !important;
}

/* Checkmark aus Theme-CSS deaktivieren */
.ba-footer-v3-upper ul li::before {
  display: none !important;
  content: '' !important;
}

.ba-footer-v3-upper ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.ba-footer-v3-upper ul li {
  padding-left: 0 !important;
}

/* ── Kontakt-Karte ── */
.ba-footer-v3-contact-card {
  background: rgba(255, 255, 255, 0.05);
  border-radius: 8px;
  padding: 14px;
  border: 1px solid rgba(255, 255, 255, 0.07);
}

.ba-footer-v3-contact-card .ba-row {
  font-size: 12px;
  color: #6a90bb;
  margin-bottom: 8px;
  line-height: 1.5;
}

.ba-footer-v3-contact-card .ba-row strong {
  display: block;
  font-size: 13px;
  color: #fff;
  font-weight: 600;
}

/* ── Row 2: Untere Leiste ── */
.ba-footer-v3-lower {
  background: #0d1929 !important;
  padding: 14px max(40px, calc((100% - 1200px) / 2 + 40px)) !important;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%!important;
  box-sizing: border-box;
}
#pg-w69b40ede7c7a8-3 {
  background: #0d1929 !important;
}
.ba-footer-v3-copy {
  font-size: 12px;
  color: #6a90bb;
  text-align: left !important;
}

.ba-footer-v3-legal {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}

.ba-footer-v3-legal a {
  font-size: 12px !important;
  color: #6a90bb !important;
  text-decoration: none !important;
  transition: color 0.2s;
}

.ba-footer-v3-legal a:hover {
  color: #6a90bb !important;
}

/* ── Schema.org Container (versteckt) ── */
.ba-schema-hidden {
  display: none !important;
  visibility: hidden;
  height: 0;
  overflow: hidden;
}

/* ── Responsive: Tablet ── */
@media (max-width: 900px) {
  .ba-footer-v3-upper {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    padding: 28px 24px;
  }
}

/* ── Responsive: Mobil ── */
@media (max-width: 600px) {
  .ba-footer-v3-upper {
    grid-template-columns: 1fr;
    padding: 24px 20px;
  }

  .ba-footer-v3-lower {
    flex-direction: column !important;
    gap: 10px;
    padding: 14px 20px !important;
    text-align: center;
  }

  .ba-footer-v3-legal {
    justify-content: center;
  }

  .ba-footer-v3-copy {
    text-align: center !important;
  }
}
.ba-footer-teamviewer {
  margin-top: 25px;
  position: relative;
  display: inline-block;
}
.ba-footer-teamviewer img{
 opacity:0.75;
 cursor:pointer
}

.ba-footer-teamviewer img:hover{
 opacity:1
}
.ba-footer-teamviewer h6 {
  position: absolute;
  bottom: 20px;
  left: 0;
  right: 0;
  text-align: center;
  margin: 0 !important;
  z-index: 1;
  font-size: 14px !important;
  color: #fff !important;
}

  .wh-wrap {
      font-family: 'DM Sans', sans-serif;
      padding: 2.5rem 1rem 2rem;
      color: #1a1a1a;
    }

    .wh-label {
      font-family: 'DM Mono', monospace;
      font-size: 11px;
      letter-spacing: .12em;
      color: #888;
      text-transform: uppercase;
      text-align: center;
      margin-bottom: .5rem;
    }

    .wh-headline {
      font-size: 26px;
      font-weight: 600;
      text-align: center;
      color: #1a1a1a;
      margin-bottom: .35rem;
    }

    .wh-sub {
      font-size: 14px;
      color: #666;
      text-align: center;
      margin-bottom: 2.5rem;
    }

    .wh-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 1rem;
      max-width: 860px;
      margin: 0 auto;
    }

    .wh-card {
      border: 1px solid #e5e5e5;
      border-radius: 16px;
      padding: 1.5rem 1.25rem 1.25rem;
      position: relative;
      background: #fff;
      transition: border-color .2s;
    }

    .wh-card:hover {
      border-color: #bbb;
    }

    .wh-card.featured {
      border: 2px solid #1a6ef5;
      background: #fff;
    }

    .wh-badge {
      position: absolute;
      top: -11px;
      left: 50%;
      transform: translateX(-50%);
      background: #1a6ef5;
      color: #fff;
      font-size: 11px;
      font-weight: 500;
      letter-spacing: .04em;
      padding: 3px 12px;
      border-radius: 20px;
      white-space: nowrap;
    }

    .wh-tier {
      font-family: 'DM Mono', monospace;
      font-size: 11px;
      letter-spacing: .1em;
      color: #aaa;
      text-transform: uppercase;
      margin-bottom: .4rem;
    }

    .wh-name {
      font-size: 18px;
      font-weight: 600;
      color: #1a1a1a;
      margin-bottom: .15rem;
    }

    .wh-desc {
      font-size: 12px;
      color: #777;
      margin-bottom: 1.1rem;
      line-height: 1.5;
    }

    .wh-price-row {
      display: flex;
      align-items: baseline;
      gap: .3rem;
      margin-bottom: .2rem;
    }

    .wh-price {
      font-size: 28px;
      font-weight: 600;
      color: #1a1a1a;
      letter-spacing: -.02em;
    }

    .wh-price-unit {
      font-size: 13px;
      color: #888;
    }

    .wh-vat {
      font-size: 11px;
      color: #aaa;
      margin-bottom: 1.2rem;
    }

    .wh-divider {
      height: 1px;
      background: #f0f0f0;
      margin: 1rem 0;
    }

    .wh-features {
      list-style: none;
      padding: 0;
      margin: 0 0 1.4rem;
    }

    .wh-features li {
      font-size: 13px;
      color: #555;
      padding: .3rem 0;
      display: flex;
      align-items: flex-start;
      gap: .5rem;
      line-height: 1.4;
    }

    .wh-features li .icon {
      color: #1a6ef5;
      font-size: 14px;
      flex-shrink: 0;
      margin-top: 1px;
    }

    .wh-features li strong {
      color: #1a1a1a;
      font-weight: 500;
    }

    .wh-cta {
      display: block;
      width: 100%;
      padding: .65rem 1rem;
      border-radius: 8px;
      font-size: 13px;
      font-weight: 500;
      text-align: center;
      cursor: pointer;
      border: 1px solid #ddd;
      background: transparent;
      color: #1a1a1a;
      transition: background .15s, border-color .15s;
      text-decoration: none;
      box-sizing: border-box;
    }

    .wh-cta:hover {
      background: #f5f5f5;
    }

    .wh-card.featured .wh-cta {
      background: #1a6ef5;
      border-color: #1a6ef5;
      color: #fff;
    }

    .wh-card.featured .wh-cta:hover {
      background: #1560d8;
      border-color: #1560d8;
    }

    .wh-domain {
      max-width: 860px;
      margin: 1.5rem auto 0;
      border: 1px solid #e5e5e5;
      border-radius: 12px;
      padding: 1rem 1.25rem;
      background: #fff;
    }

    .wh-domain-title {
      font-size: 13px;
      font-weight: 500;
      color: #1a1a1a;
      margin-bottom: .6rem;
    }

    .wh-domain-grid {
      display: flex;
      gap: 1.5rem;
      flex-wrap: wrap;
    }

    .wh-domain-item {
      font-size: 13px;
      color: #666;
    }

    .wh-domain-item strong {
      color: #1a1a1a;
      font-weight: 500;
    }

    .wh-note {
      font-size: 11px;
      color: #aaa;
      text-align: center;
      margin-top: 1rem;
    }

    @media (max-width: 680px) {
      .wh-grid { grid-template-columns: 1fr; }
      .wh-headline { font-size: 20px; }
    }
    #page ul.wh-features li:before   {content:unset!important;}
#page .featured a{color:#fff;}
.web-warum-box{ border-left: 4px solid #0556a5;
    background: #f7f7f7;
    border-radius: 0 12px 12px 0;
    padding: 1.5rem 1.5rem 1.5rem 1.75rem;
    margin: 2rem 0;}