/* Wolff Dental Brand Color: #f29200 */
.header_s a.navbar-brand > i,
.header_s .ownavigation .navbar-nav > li > a::before,
.header_s .top-header,
.footer-main,
.footer-main .contact-info p > i,
.widget_workinghours > span,
.wolff-drflex-footer,
#slideit,
#closeit {
  background-color: #f29200 !important;
}

.header_s a.phone-call,
.wolff-drflex-footer,
.header_s .ownavigation.navbar-fixed-top,
.footer-main {
  border-color: #f29200 !important;
}

.header_s a.phone-call i,
.header_s .ownavigation .navbar-nav > .active > a,
.header_s .ownavigation .navbar-nav > li:hover > a,
.header_s .ownavigation .navbar-nav > li > a:hover,
.header_s .top-header .call-info p > a:hover,
.footer-main .widget-title,
.footer-main a:hover,
.wolff-drflex-footer:hover {
  color: #f29200 !important;
}

.header_s .top-header .call-info p > a::before {
  color: #cc7700 !important;
}

.wolff-drflex-footer {
  display: inline-block;
  color: #fff !important;
  border: 2px solid #f29200;
  border-radius: 6px;
  padding: 10px 16px;
  text-decoration: none;
  font-weight: 600;
}

.wolff-drflex-footer:hover {
  background: #fff !important;
}

/* Logo */
.wolff-brand {
  display: inline-flex;
  align-items: center;
  padding-top: 18px;
  padding-bottom: 18px;
  max-width: min(42vw, 320px);
}

.wolff-logo {
  display: block;
  width: 100%;
  max-width: 220px;
  height: auto;
}

/* Utility: normal content with noticeable side spacing */
.content-narrow,
.page-wolff-dental .main-container .mod_article > *:not(.article-hero) {
  width: min(1200px, calc(100% - 72px));
  margin-left: auto;
  margin-right: auto;
}

/* Utility: full-bleed sections/images */
.content-full,
.content-full-image {
  width: 100vw;
  max-width: none;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  padding-left: 0;
  padding-right: 0;
}

.content-full-image img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
}

/* Hero image per page/article with orange headline box */
.article-hero {
  position: relative;
  width: 100vw;
  max-width: none;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  margin-bottom: 36px;
  overflow: hidden;
}

.article-hero .article-hero__image,
.article-hero > figure,
.article-hero > .image_container,
.article-hero > .ce_image {
  margin: 0;
}

.article-hero .article-hero__image img,
.article-hero > img,
.article-hero > figure img,
.article-hero > .image_container img,
.article-hero > .ce_image img {
  display: block;
  width: 100%;
  max-width: none;
  height: min(50vw, 600px);
  min-height: 260px;
  object-fit: cover;
  object-position: center;
}

.article-hero__caption,
.article-hero__title {
  position: absolute;
  left: 28px;
  bottom: 28px;
  margin: 0;
  background: #f29200;
  color: #fff;
  padding: 14px 18px;
  max-width: min(90%, 760px);
  line-height: 1.2;
  font-size: clamp(22px, 2.4vw, 42px);
  font-weight: 700;
  z-index: 3;
}

/* Contao CE image fallback: class only on element, H1 from headline field */
.article-hero {
  position: relative !important;
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  margin-bottom: 36px !important;
  overflow: hidden !important;
}

.article-hero figure,
.article-hero .image_container,
.article-hero .ce_image,
.article-hero .image_container a {
  margin: 0 !important;
  display: block !important;
}

.article-hero img {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: min(50vw, 600px) !important;
  min-height: 260px !important;
  object-fit: cover !important;
  object-position: center !important;
}

.article-hero > h1,
.article-hero > .headline,
.article-hero > .ce_headline,
.article-hero .article-hero__title,
.article-hero .article-hero__caption {
  position: absolute !important;
  left: 28px !important;
  bottom: 28px !important;
  z-index: 5 !important;
  margin: 0 !important;
  background: #f29200 !important;
  color: #fff !important;
  padding: 14px 18px !important;
  max-width: min(90%, 760px) !important;
  line-height: 1.2 !important;
  font-size: clamp(22px, 2.4vw, 42px) !important;
  font-weight: 700 !important;
}

/* Robust fallback for Contao wrappers: class on article OR on image element */
.mod_article.article-hero,
.mod_article.article-hero .ce_image,
.ce_image.article-hero,
.ce_image.article-hero .image_container,
.ce_image.article-hero figure {
  position: relative !important;
}

.mod_article.article-hero,
.ce_image.article-hero {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  overflow: hidden !important;
}

.mod_article.article-hero .ce_image img,
.mod_article.article-hero img,
.ce_image.article-hero img {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: min(50vw, 600px) !important;
  min-height: 260px !important;
  object-fit: cover !important;
  object-position: center !important;
}

.mod_article.article-hero > .ce_headline,
.mod_article.article-hero > h1,
.ce_image.article-hero > .ce_headline,
.ce_image.article-hero > h1,
.ce_image.article-hero .headline,
.ce_image.article-hero .ce_headline {
  position: absolute !important;
  left: 28px !important;
  bottom: 28px !important;
  z-index: 7 !important;
  margin: 0 !important;
  background: #f29200 !important;
  color: #fff !important;
  padding: 14px 18px !important;
  max-width: min(90%, 760px) !important;
  line-height: 1.2 !important;
}

/* Exact match for current Contao markup */
.mod_article .mod_article__inner > .article-hero {
  position: relative !important;
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  margin-bottom: 36px !important;
  overflow: hidden !important;
}

.mod_article .mod_article__inner > .article-hero > figure {
  margin: 0 !important;
}

.mod_article .mod_article__inner > .article-hero > figure > img {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: min(50vw, 600px) !important;
  min-height: 260px !important;
  object-fit: cover !important;
  object-position: center !important;
}

.mod_article .mod_article__inner > .article-hero > h1 {
  position: absolute !important;
  left: 28px !important;
  bottom: 28px !important;
  z-index: 5 !important;
  margin: 0 !important;
  background: #f29200 !important;
  color: #fff !important;
  padding: 14px 18px !important;
  max-width: min(90%, 760px) !important;
  line-height: 1.2 !important;
}

.article-hero.content-image{
  position:relative!important;
  width:100vw!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
  overflow:hidden!important;
}
.article-hero.content-image>figure{margin:0!important;}
.article-hero.content-image>figure>img{
  display:block!important;
  width:100%!important;
  height:min(50vw,600px)!important;
  min-height:260px!important;
  object-fit:cover!important;
}
.article-hero.content-image>h1{
  position:absolute!important;
  left:28px!important;
  bottom:28px!important;
  margin:0!important;
  background:#f29200!important;
  color:#fff!important;
  padding:14px 18px!important;
  z-index:10!important;
}

/* Slider headline box: white -> brand orange (#f29200) */
#home-slider1 .tp-caption.background-block,
#home-slider1 .tp-caption#slide-layer-1,
#home-slider1 .tp-caption#slide-layer-3,
#home-slider1 .tp-caption#slide-layer-5 {
  background: rgba(242, 146, 0, 0.94) !important;
  color: #ffffff !important;
  border-left: 6px solid #ffffff;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.16);
}

#home-slider1 .tp-caption.background-block .title-txt,
#home-slider1 .tp-caption.background-block span,
#home-slider1 .tp-caption.background-block br,
#home-slider1 .tp-caption#slide-layer-1,
#home-slider1 .tp-caption#slide-layer-3,
#home-slider1 .tp-caption#slide-layer-5,
#home-slider1 .tp-caption#slide-layer-1 *,
#home-slider1 .tp-caption#slide-layer-3 *,
#home-slider1 .tp-caption#slide-layer-5 * {
  color: #ffffff !important;
}

/* CTA button under the headline to match orange theme */
#home-slider1 .tp-caption.learn-btn {
  background: #f29200 !important;
  border-color: #f29200 !important;
  color: #ffffff !important;
}

#home-slider1 .tp-caption.learn-btn .button-txt,
#home-slider1 .tp-caption.learn-btn i {
  color: #f29200 !important;
}

#home-slider1 .tp-caption.learn-btn .button-txt i {
  background: #ffffff !important;
}

@media (max-width: 767px) {
  #home-slider1 .tp-caption.background-block,
  #home-slider1 .tp-caption#slide-layer-1,
  #home-slider1 .tp-caption#slide-layer-3,
  #home-slider1 .tp-caption#slide-layer-5 {
    border-left-width: 4px;
  }
}

/* Global heading color (requested): all headings in brand orange */
h1,
h2,
h3,
h4,
h5,
h6,
.section-header h3,
.entry-title,
.widget-title,
.department-header h5,
.welcome-section h5,
.offer-box h5,
.latest-news .entry-title a,
.page-banner .page-banner-content h3 {
  color: #f29200 !important;
}

/* FINAL override: Terminbutton Position */
.header_s a.phone-call {
  margin-top: 0 !important;
}

@media (max-width: 991px) {
  .header_s8 a.phone-call,
  .header_default a.phone-call {
    position: absolute !important;
    right: 52px !important;
    top: 30px !important;
    margin: 0 !important;
    padding: 6px 10px !important;
    border-bottom: 2px solid #f29200 !important;
    border-radius: 10px !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px;
    z-index: 30 !important;
  }
}

/* FINAL override: Hero heading in image */
.article-hero {
  position: relative !important;
  overflow: hidden !important;
}

.article-hero > figure {
  margin: 0 !important;
}

.article-hero > figure > img {
  display: block !important;
  width: 100% !important;
  height: min(50vw, 600px) !important;
  min-height: 260px !important;
  object-fit: cover !important;
}

.article-hero > h1 {
  position: absolute !important;
  left: 24px !important;
  bottom: 24px !important;
  margin: 0 !important;
  padding: 12px 16px !important;
  background: #f29200 !important;
  color: #fff !important;
  z-index: 20 !important;
  line-height: 1.2 !important;
}

/* HARD FIX: keep appointment button attached to menu line */
.header_default .default-top {
  position: relative;
}

.header_default .default-top > a.phone-call,
.header_s8 a.phone-call {
  position: absolute !important;
  top: auto !important;
  bottom: -14px !important;
  right: 0 !important;
  z-index: 40 !important;
}

@media (max-width: 991px) {
  .header_default .ownavigation > .container,
  .header_s8 .ownavigation > .container {
    position: relative;
  }

  .header_default a.phone-call,
  .header_s8 a.phone-call {
    top: auto !important;
    bottom: 8px !important;
    right: 56px !important;
    left: auto !important;
    transform: none !important;
    margin: 0 !important;
    z-index: 50 !important;
  }
}

@media (max-width: 639px) {
  .header_default a.phone-call,
  .header_s8 a.phone-call {
    bottom: 10px !important;
    right: 52px !important;
  }
}

/* HARD FIX: hero heading box for article-hero (including content-image combo) */
.article-hero,
.article-hero.content-image {
  position: relative !important;
  overflow: hidden !important;
}

.article-hero figure,
.article-hero.content-image figure {
  margin: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

.article-hero img,
.article-hero.content-image img {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: min(50vw, 600px) !important;
  min-height: 260px !important;
  object-fit: cover !important;
  object-position: center !important;
}

.article-hero h1,
.article-hero.content-image h1,
.mod_article .article-hero h1,
.mod_article .article-hero.content-image h1 {
  position: absolute !important;
  left: 24px !important;
  bottom: 24px !important;
  z-index: 25 !important;
  margin: 0 !important;
  display: inline-block !important;
  background: #f29200 !important;
  color: #fff !important;
  padding: 12px 16px !important;
  max-width: min(90%, 760px) !important;
  line-height: 1.2 !important;
}

/* FINAL TUNE: appointment button higher (no overlap with bar) */
.header_default .default-top > a.phone-call,
.header_s8 a.phone-call {
  bottom: -2px !important;
}

/* FINAL micro-adjust: appointment button 2px higher */
.header_default .default-top > a.phone-call,
.header_s8 a.phone-call {
  bottom: 0 !important;
}

/* ===== MASTER OVERRIDE (final) ===== */

/* Appointment button: no blue; orange hover with white text+icon */
.header_s a.phone-call,
.header_default a.phone-call,
.header_s8 a.phone-call {
  background: #ffffff !important;
  color: #3a3a3a !important;
  border-color: #f29200 !important;
}

.header_s a.phone-call i,
.header_default a.phone-call i,
.header_s8 a.phone-call i {
  color: #f29200 !important;
}

.header_s a.phone-call:hover,
.header_default a.phone-call:hover,
.header_s8 a.phone-call:hover,
.header_s a.phone-call:focus,
.header_default a.phone-call:focus,
.header_s8 a.phone-call:focus {
  background: #f29200 !important;
  color: #ffffff !important;
  border-color: #f29200 !important;
}

.header_s a.phone-call:hover i,
.header_default a.phone-call:hover i,
.header_s8 a.phone-call:hover i,
.header_s a.phone-call:focus i,
.header_default a.phone-call:focus i,
.header_s8 a.phone-call:focus i {
  color: #ffffff !important;
}

/* Hero title box: keep bottom-left style, move a bit to the right */
.article-hero h1,
.article-hero.content-image h1,
.mod_article .article-hero h1,
.mod_article .article-hero.content-image h1 {
  left: 40px !important;
  bottom: 24px !important;
}

/* Opening hours block + footer bottom bar in orange */
.footer-main .widget_workinghours,
.footer-main .widget_workinghours > span,
.footer-bottom {
  background: #f29200 !important;
}

.footer-bottom p,
.footer-main .widget_workinghours,
.footer-main .widget_workinghours * {
  color: #ffffff !important;
}

/* ===== Oswald Font Integration ===== */
@font-face {
  font-family: "Oswald";
  src: url("/files/doctor-demo/custom/fonts/oswald/static/Oswald-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Oswald";
  src: url("/files/doctor-demo/custom/fonts/oswald/static/Oswald-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Oswald";
  src: url("/files/doctor-demo/custom/fonts/oswald/static/Oswald-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Oswald";
  src: url("/files/doctor-demo/custom/fonts/oswald/static/Oswald-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

body,
h1,h2,h3,h4,h5,h6,
p,a,li,span,small,strong,em,
button,input,select,textarea,
.navbar-nav > li > a,
.tp-caption,
.tp-caption * {
  font-family: "Oswald", sans-serif !important;
}

/* Keep icon fonts intact */
.fa,
.fa::before,
.glyphicon,
.glyphicon::before,
.revicon,
.revicon::before {
  font-family: FontAwesome !important;
}

/* Contact strip cleanup: no separator bars, add spacing for address */
.page-wolff-dental .top-header .call-info p > a::before {
  content: none !important;
  display: none !important;
}

.page-wolff-dental .top-header .call-info p > a {
  padding-right: 0 !important;
}

.page-wolff-dental .top-header .call-info p {
  margin-right: 14px;
}

.page-wolff-dental .top-header .call-info p.contact-address {
  color: #ffffff;
  font-size: 13px;
  margin-right: 0;
}

.page-wolff-dental .top-header .call-info p.contact-address i {
  margin-right: 8px;
}

/* Contact strip cleanup: no separator bars, address styling */
.page-wolff-dental .top-header .call-info p > a::before {
  content: none !important;
  display: none !important;
}

.page-wolff-dental .top-header .call-info p > a {
  padding-right: 0 !important;
}

.page-wolff-dental .top-header .call-info p {
  margin-right: 14px;
}

.page-wolff-dental .top-header .call-info p.contact-address {
  color: #ffffff;
  font-size: 13px;
  margin-right: 0;
}

.page-wolff-dental .top-header .call-info p.contact-address i {
  margin-right: 8px;
}

/* ===== FINAL FIX: Oswald everywhere + slanted appointment button ===== */
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@300;400;500;600;700&display=swap');

/* Force Oswald globally (except icon fonts below) */
html, body,
.page-wolff-dental,
.page-wolff-dental * {
  font-family: "Oswald", sans-serif !important;
}

/* Keep icon fonts intact */
i.fa,
i.fa::before,
.fa,
.fa::before,
.glyphicon,
.glyphicon::before,
[class*="revicon-"]::before,
.tp-caption .fa,
.tp-caption .fa::before {
  font-family: FontAwesome !important;
}

/* Appointment button geometry: NOT rounded, clearly slanted */
.header_s a.phone-call,
.header_default a.phone-call,
.header_s8 a.phone-call {
  border-radius: 0 !important;
  -webkit-clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%);
  clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%);
  padding-left: 16px !important;
  padding-right: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px;
}

/* Make sure hover keeps same slanted shape */
.header_s a.phone-call:hover,
.header_default a.phone-call:hover,
.header_s8 a.phone-call:hover,
.header_s a.phone-call:focus,
.header_default a.phone-call:focus,
.header_s8 a.phone-call:focus {
  border-radius: 0 !important;
  -webkit-clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%);
  clip-path: polygon(8% 0, 100% 0, 92% 100%, 0 100%);
}

/* Revert appointment button shape to normal */
.header_s a.phone-call,
.header_default a.phone-call,
.header_s8 a.phone-call,
.header_s a.phone-call:hover,
.header_default a.phone-call:hover,
.header_s8 a.phone-call:hover,
.header_s a.phone-call:focus,
.header_default a.phone-call:focus,
.header_s8 a.phone-call:focus {
  -webkit-clip-path: none !important;
  clip-path: none !important;
  border-radius: 10px !important;
  padding-left: 12px !important;
  padding-right: 12px !important;
}

/* Restore original button shape: top rounded, bottom straight */
.header_s a.phone-call,
.header_default a.phone-call,
.header_s8 a.phone-call,
.header_s a.phone-call:hover,
.header_default a.phone-call:hover,
.header_s8 a.phone-call:hover,
.header_s a.phone-call:focus,
.header_default a.phone-call:focus,
.header_s8 a.phone-call:focus {
  border-radius: 10px 10px 0 0 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  border-bottom-width: 0 !important;
  -webkit-clip-path: none !important;
  clip-path: none !important;
}

/* Remove black line in mobile open menu */
@media (max-width: 991px) {
  .header_s8 .ownavigation .navbar-collapse,
  .header_default .ownavigation .navbar-collapse,
  .header_s8 .ownavigation .navbar-collapse.collapse,
  .header_default .ownavigation .navbar-collapse.collapse {
    border-top: 2px solid #f29200 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
  }

  .header_s8 .ownavigation,
  .header_default .ownavigation {
    border-bottom: 1px solid #f29200 !important;
  }
}

/* ===== About split section (2 images + text) ===== */
.about-split {
  padding: 60px 0;
}

.about-split .left-col img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;
}

.about-split .left-col .is-second {
  margin-top: 48px;
}

.about-split .right-col h2 {
  margin: 10px 0 16px;
}

.about-split .right-col ul {
  columns: 2;
  -webkit-columns: 2;
  -moz-columns: 2;
  gap: 24px;
  padding-left: 18px;
}

.about-split .right-col ul li {
  margin-bottom: 10px;
  break-inside: avoid;
}

@media (max-width: 991px) {
  .about-split .left-col .is-second {
    margin-top: 20px;
  }

  .about-split .right-col ul {
    columns: 1;
    -webkit-columns: 1;
    -moz-columns: 1;
  }
}

/* ===== About split hard override for Contao image elements ===== */
.about-split .left-col {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 24px !important;
  align-items: start !important;
}

/* support typical Contao wrappers */
.about-split .left-col > .ce_image,
.about-split .left-col > .image_container,
.about-split .left-col > figure,
.about-split .left-col > .block,
.about-split .left-col > .mod_article,
.about-split .left-col > * {
  width: 100%;
  min-width: 0;
}

.about-split .left-col > :nth-child(2),
.about-split .left-col .is-second {
  margin-top: 48px !important;
}

.about-split .left-col img,
.about-split .left-col .image_container img,
.about-split .left-col figure img,
.about-split .left-col .ce_image img {
  width: 100% !important;
  display: block !important;
  border-radius: 10px !important;
  overflow: hidden !important;
}

.about-split .left-col .image_container,
.about-split .left-col figure,
.about-split .left-col .ce_image {
  border-radius: 10px !important;
  overflow: hidden !important;
  margin: 0 !important;
}

@media (max-width: 991px) {
  .about-split .left-col {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .about-split .left-col > :nth-child(2),
  .about-split .left-col .is-second {
    margin-top: 0 !important;
  }
}

/* ===== About auto-layout fallback (2 images left, text right) ===== */
.about-split .mod_article__inner {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  column-gap: 36px !important;
  row-gap: 20px !important;
  align-items: start !important;
}

/* left column: first two image elements */
.about-split .mod_article__inner > .ce_image:nth-of-type(1),
.about-split .mod_article__inner > .ce_image:nth-of-type(2),
.about-split .mod_article__inner > .about-photo:nth-of-type(1),
.about-split .mod_article__inner > .about-photo:nth-of-type(2) {
  grid-column: 1 !important;
}

.about-split .mod_article__inner > .ce_image:nth-of-type(2),
.about-split .mod_article__inner > .about-photo.is-second,
.about-split .mod_article__inner > .about-photo:nth-of-type(2) {
  margin-top: 48px !important;
}

/* right column: text-like elements */
.about-split .mod_article__inner > .ce_headline,
.about-split .mod_article__inner > .ce_text,
.about-split .mod_article__inner > .ce_list,
.about-split .mod_article__inner > .ce_hyperlink,
.about-split .mod_article__inner > .about-copy {
  grid-column: 2 !important;
}

.about-split .mod_article__inner > .ce_image img,
.about-split .mod_article__inner > .about-photo img,
.about-split .mod_article__inner > .ce_image figure,
.about-split .mod_article__inner > .about-photo figure,
.about-split .mod_article__inner > .ce_image .image_container,
.about-split .mod_article__inner > .about-photo .image_container {
  border-radius: 10px !important;
  overflow: hidden !important;
}

.about-split .mod_article__inner > .ce_image img,
.about-split .mod_article__inner > .about-photo img {
  width: 100% !important;
  display: block !important;
}

.about-split .mod_article__inner > .ce_list ul,
.about-split .mod_article__inner > .about-copy ul {
  columns: 2;
  gap: 20px;
}

@media (max-width: 991px) {
  .about-split .mod_article__inner {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .about-split .mod_article__inner > * {
    grid-column: 1 !important;
    margin-top: 0 !important;
  }

  .about-split .mod_article__inner > .ce_list ul,
  .about-split .mod_article__inner > .about-copy ul {
    columns: 1;
  }
}

/* Mobile order: text first, images after (about-split) */
@media (max-width: 991px) {
  .about-split .mod_article__inner {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }

  .about-split .mod_article__inner > .ce_headline,
  .about-split .mod_article__inner > .ce_text,
  .about-split .mod_article__inner > .ce_list,
  .about-split .mod_article__inner > .ce_hyperlink,
  .about-split .mod_article__inner > .about-copy {
    order: 1;
  }

  .about-split .mod_article__inner > .ce_image,
  .about-split .mod_article__inner > .about-photo {
    order: 2;
  }

  .about-split .mod_article__inner > .ce_image:nth-of-type(2),
  .about-split .mod_article__inner > .about-photo.is-second,
  .about-split .mod_article__inner > .about-photo:nth-of-type(2) {
    margin-top: 0 !important;
  }
}

/* ===== About section (custom HTML block from Dentia) ===== */
/* Add class "about-wolff" to the <section> wrapper */
.about-wolff {
  padding: 60px 0;
}

.about-wolff .row.g-4.gx-5.align-items-center {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 {
  display: flex;
  flex-wrap: wrap;
  margin-left: -10px;
  margin-right: -10px;
}

.about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6 {
  width: 50%;
  padding-left: 10px;
  padding-right: 10px;
}

.about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6:nth-child(2) {
  margin-top: 48px;
}

.about-wolff img[src*="wartezimmer_"] {
  width: 100% !important;
  display: block !important;
  border-radius: 12px !important;
}

.about-wolff .ul-check {
  columns: 2;
  gap: 24px;
}

@media (max-width: 991px) {
  /* Mobile: text first */
  .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:last-child {
    order: 1;
  }

  .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child {
    order: 2;
  }

  /* Mobile: keep both images side-by-side */
  .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 {
    display: flex;
    flex-wrap: nowrap;
    gap: 12px;
  }

  .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6 {
    width: 50%;
    flex: 0 0 50%;
    padding-left: 0;
    padding-right: 0;
  }

  .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6:nth-child(2) {
    margin-top: 0;
  }

  .about-wolff .ul-check {
    columns: 1;
  }
}

/* ===== FINAL: about-wolff image pair layout ===== */
.about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 14px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6 {
  width: calc(50% - 7px) !important;
  flex: 0 0 calc(50% - 7px) !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* equal image treatment */
.about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6 img {
  width: 100% !important;
  height: 340px !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  border-radius: 12px !important;
}

/* only second image slightly lower on desktop */
.about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6:nth-child(2) {
  margin-top: 30px !important;
}

@media (max-width: 991px) {
  .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
  }

  .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6 {
    width: calc(50% - 5px) !important;
    flex: 0 0 calc(50% - 5px) !important;
    margin-top: 0 !important;
  }

  .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6:nth-child(2) {
    margin-top: 0 !important;
  }

  /* same height on mobile while filling row */
  .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6 img {
    height: 220px !important;
  }
}

/* ===== FINAL color/spacing adjustments ===== */
/* Header contact links: hover in menu gray, not orange */
.page-wolff-dental .top-header .call-info a,
.page-wolff-dental .top-header .call-info a i,
.page-wolff-dental .top-header .call-info .obf-text {
  color: #7d7d7d !important;
}

.page-wolff-dental .top-header .call-info a:hover,
.page-wolff-dental .top-header .call-info a:hover i,
.page-wolff-dental .top-header .call-info a:hover .obf-text,
.page-wolff-dental .top-header .call-info a:focus,
.page-wolff-dental .top-header .call-info a:focus i,
.page-wolff-dental .top-header .call-info a:focus .obf-text {
  color: #7d7d7d !important;
}

/* Appointment button in menu gray */
.header_s a.phone-call,
.header_default a.phone-call,
.header_s8 a.phone-call {
  color: #7d7d7d !important;
  border-color: #b8b8b8 !important;
  background: #ffffff !important;
}

.header_s a.phone-call i,
.header_default a.phone-call i,
.header_s8 a.phone-call i {
  color: #7d7d7d !important;
}

.header_s a.phone-call:hover,
.header_default a.phone-call:hover,
.header_s8 a.phone-call:hover,
.header_s a.phone-call:focus,
.header_default a.phone-call:focus,
.header_s8 a.phone-call:focus {
  background: #f4f4f4 !important;
  color: #7d7d7d !important;
  border-color: #a9a9a9 !important;
}

.header_s a.phone-call:hover i,
.header_default a.phone-call:hover i,
.header_s8 a.phone-call:hover i,
.header_s a.phone-call:focus i,
.header_default a.phone-call:focus i,
.header_s8 a.phone-call:focus i {
  color: #7d7d7d !important;
}

/* Move image text box further from left edge */
.article-hero h1,
.article-hero.content-image h1,
.mod_article .article-hero h1,
.mod_article .article-hero.content-image h1 {
  left: 56px !important;
}

@media (max-width: 991px) {
  .article-hero h1,
  .article-hero.content-image h1,
  .mod_article .article-hero h1,
  .mod_article .article-hero.content-image h1 {
    left: 28px !important;
  }
}

/* ===== FINAL: about-wolff images same height, variable width ===== */
.about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 14px !important;
  align-items: flex-start !important;
}

.about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6 {
  width: auto !important;
  flex: 0 0 auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6 img {
  height: 340px !important;
  width: auto !important;
  max-width: none !important;
  object-fit: cover !important;
  border-radius: 12px !important;
}

@media (max-width: 991px) {
  .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 {
    gap: 10px !important;
    justify-content: center !important;
  }

  .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6 {
    width: auto !important;
    flex: 0 0 auto !important;
  }

  .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6 img {
    height: 220px !important;
    width: auto !important;
    max-width: 45vw !important;
  }
}

/* ===== FINAL HOTFIX: CTA + About images ===== */
/* CTA border must be orange */
.header_s a.phone-call,
.header_default a.phone-call,
.header_s8 a.phone-call {
  border-color: #f29200 !important;
  border-left-color: #f29200 !important;
  border-right-color: #f29200 !important;
  border-top-color: #f29200 !important;
}

/* About images: half gap + half left offset, prevent overlap into text */
.about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child {
  overflow: hidden;
}

.about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 {
  gap: 7px !important;
  margin-left: -10px !important;
  margin-right: 0 !important;
}

.about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6 img {
  max-width: calc((100% - 7px) / 2) !important;
  width: auto !important;
}

/* ===== LATEST USER FIX: enforce orange CTA border and tighter left image group ===== */
.page-wolff-dental .header_s a.phone-call,
.page-wolff-dental .header_default a.phone-call,
.page-wolff-dental .header_s8 a.phone-call,
.page-wolff-dental .header_s a.phone-call:hover,
.page-wolff-dental .header_default a.phone-call:hover,
.page-wolff-dental .header_s8 a.phone-call:hover,
.page-wolff-dental .header_s a.phone-call:focus,
.page-wolff-dental .header_default a.phone-call:focus,
.page-wolff-dental .header_s8 a.phone-call:focus {
  border-color: #f29200 !important;
  border-left-color: #f29200 !important;
  border-right-color: #f29200 !important;
  border-top-color: #f29200 !important;
}

.page-wolff-dental .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child {
  overflow: hidden !important;
}

.page-wolff-dental .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 {
  gap: 6px !important;
  margin-left: -12px !important;
  margin-right: 0 !important;
}

/* ===== LATEST USER FIX: reduce About text/image column gap by 75% ===== */
.page-wolff-dental .about-wolff .row.g-4.gx-5.align-items-center {
  --bs-gutter-x: 0.75rem !important;
}

/* ===== LATEST USER FIX: images not equally narrow (same height, adaptive different widths) ===== */
.page-wolff-dental .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  gap: 6px !important;
  margin-left: -12px !important;
}

.page-wolff-dental .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.page-wolff-dental .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6:first-child {
  flex: 0 1 42% !important;
  width: 42% !important;
}

.page-wolff-dental .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6:nth-child(2) {
  flex: 0 1 58% !important;
  width: 58% !important;
}

.page-wolff-dental .about-wolff .row.g-4.gx-5.align-items-center > .col-lg-6:first-child .row.g-4 > .col-6 img {
  width: 100% !important;
  max-width: 100% !important;
  height: 340px !important;
  object-fit: cover !important;
}

/* ===== LATEST USER FIX: reduce desktop gap under hero image ===== */
@media (min-width: 992px) {
  .page-wolff-dental .article-hero,
  .page-wolff-dental .mod_article .mod_article__inner > .article-hero {
    margin-bottom: 12px !important;
  }

  .page-wolff-dental .about-wolff {
    padding-top: 14px !important;
  }

  .page-wolff-dental .main-container .mod_article > *:not(.article-hero):first-child {
    margin-top: 0 !important;
  }
}

/* ===== LATEST USER FIX: header height -15% desktop ===== */
.page-wolff-dental .wolff-brand {
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}

.page-wolff-dental .wolff-logo {
  max-width: 187px !important;
}

/* ===== LATEST USER FIX: desktop logo +20% ===== */
@media (min-width: 992px) {
  .page-wolff-dental .wolff-logo {
    max-width: 224px !important;
  }
}

/* ===== LATEST USER FIX: Contao standard for text + image (rounded, ~1/4 width) ===== */
.page-wolff-dental .ce_text {
  position: relative;
}

.page-wolff-dental .ce_text .image_container,
.page-wolff-dental .ce_text figure.image_container,
.page-wolff-dental .ce_text figure.float_left,
.page-wolff-dental .ce_text figure.float_right {
  width: 25% !important;
  max-width: 25% !important;
  min-width: 170px;
  border-radius: 14px;
  overflow: hidden;
  margin-bottom: 12px !important;
}

.page-wolff-dental .ce_text .image_container img,
.page-wolff-dental .ce_text figure img {
  display: block;
  width: 100% !important;
  height: auto !important;
  border-radius: 14px;
}

.page-wolff-dental .ce_text .image_container.float_left,
.page-wolff-dental .ce_text figure.float_left {
  float: left !important;
  margin: 0 18px 12px 0 !important;
}

.page-wolff-dental .ce_text .image_container.float_right,
.page-wolff-dental .ce_text figure.float_right {
  float: right !important;
  margin: 0 0 12px 18px !important;
}

.page-wolff-dental .ce_text::after {
  content: "";
  display: block;
  clear: both;
}

@media (max-width: 991px) {
  .page-wolff-dental .ce_text .image_container,
  .page-wolff-dental .ce_text figure.image_container,
  .page-wolff-dental .ce_text figure.float_left,
  .page-wolff-dental .ce_text figure.float_right {
    width: 38% !important;
    max-width: 38% !important;
    min-width: 0;
    border-radius: 12px;
  }

  .page-wolff-dental .ce_text .image_container.float_left,
  .page-wolff-dental .ce_text figure.float_left {
    margin: 0 12px 8px 0 !important;
  }

  .page-wolff-dental .ce_text .image_container.float_right,
  .page-wolff-dental .ce_text figure.float_right {
    margin: 0 0 8px 12px !important;
  }
}

/* ===== LATEST USER FIX: robust Contao alignment for text element with image right/left ===== */
.page-wolff-dental .ce_text.image_right .image_container,
.page-wolff-dental .ce_text.float_right .image_container,
.page-wolff-dental .ce_text.image_right figure,
.page-wolff-dental .ce_text.float_right figure {
  float: right !important;
  width: 25% !important;
  max-width: 25% !important;
  margin: 0 0 12px 18px !important;
}

.page-wolff-dental .ce_text.image_left .image_container,
.page-wolff-dental .ce_text.float_left .image_container,
.page-wolff-dental .ce_text.image_left figure,
.page-wolff-dental .ce_text.float_left figure {
  float: left !important;
  width: 25% !important;
  max-width: 25% !important;
  margin: 0 18px 12px 0 !important;
}

.page-wolff-dental .ce_text.image_right .image_container img,
.page-wolff-dental .ce_text.float_right .image_container img,
.page-wolff-dental .ce_text.image_left .image_container img,
.page-wolff-dental .ce_text.float_left .image_container img {
  width: 100% !important;
  height: auto !important;
  border-radius: 14px !important;
  display: block !important;
}

@media (max-width: 991px) {
  .page-wolff-dental .ce_text.image_right .image_container,
  .page-wolff-dental .ce_text.float_right .image_container,
  .page-wolff-dental .ce_text.image_right figure,
  .page-wolff-dental .ce_text.float_right figure {
    width: 38% !important;
    max-width: 38% !important;
    margin: 0 0 8px 12px !important;
  }

  .page-wolff-dental .ce_text.image_left .image_container,
  .page-wolff-dental .ce_text.float_left .image_container,
  .page-wolff-dental .ce_text.image_left figure,
  .page-wolff-dental .ce_text.float_left figure {
    width: 38% !important;
    max-width: 38% !important;
    margin: 0 12px 8px 0 !important;
  }
}

/* ===== LATEST USER FIX: force right image in text element (reliable fallback) ===== */
.page-wolff-dental .force-image-right .image_container,
.page-wolff-dental .force-image-right figure,
.page-wolff-dental .force-image-right .ce_image {
  float: right !important;
  width: 25% !important;
  max-width: 25% !important;
  min-width: 170px;
  margin: 0 0 12px 18px !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  display: block !important;
}

.page-wolff-dental .force-image-right .image_container img,
.page-wolff-dental .force-image-right figure img,
.page-wolff-dental .force-image-right .ce_image img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 14px !important;
}

.page-wolff-dental .force-image-right::after {
  content: "";
  display: block;
  clear: both;
}

@media (max-width: 991px) {
  .page-wolff-dental .force-image-right .image_container,
  .page-wolff-dental .force-image-right figure,
  .page-wolff-dental .force-image-right .ce_image {
    width: 38% !important;
    max-width: 38% !important;
    min-width: 0;
    margin: 0 0 8px 12px !important;
  }
}

/* ===== LATEST USER FIX: hero image width equals normal content width ===== */
.page-wolff-dental .article-hero,
.page-wolff-dental .mod_article.article-hero,
.page-wolff-dental .ce_image.article-hero,
.page-wolff-dental .mod_article .mod_article__inner > .article-hero {
  width: min(1200px, calc(100% - 72px)) !important;
  max-width: min(1200px, calc(100% - 72px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.page-wolff-dental .article-hero img,
.page-wolff-dental .mod_article.article-hero img,
.page-wolff-dental .ce_image.article-hero img,
.page-wolff-dental .mod_article .mod_article__inner > .article-hero > figure > img {
  width: 100% !important;
  max-width: 100% !important;
}

@media (max-width: 991px) {
  .page-wolff-dental .article-hero,
  .page-wolff-dental .mod_article.article-hero,
  .page-wolff-dental .ce_image.article-hero,
  .page-wolff-dental .mod_article .mod_article__inner > .article-hero {
    width: min(1200px, calc(100% - 40px)) !important;
    max-width: min(1200px, calc(100% - 40px)) !important;
  }
}

/* ===== LATEST USER FIX: mobile hero stays full width ===== */
@media (max-width: 991px) {
  .page-wolff-dental .article-hero,
  .page-wolff-dental .mod_article.article-hero,
  .page-wolff-dental .ce_image.article-hero,
  .page-wolff-dental .mod_article .mod_article__inner > .article-hero {
    width: 100vw !important;
    max-width: none !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
  }
}

/* ===== LATEST USER FIX: revert hero width changes, keep full width ===== */
.page-wolff-dental .article-hero,
.page-wolff-dental .mod_article.article-hero,
.page-wolff-dental .ce_image.article-hero,
.page-wolff-dental .mod_article .mod_article__inner > .article-hero {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}

/* ===== LATEST USER FIX: hero height to about 2/3 ===== */
.page-wolff-dental .article-hero img,
.page-wolff-dental .mod_article.article-hero img,
.page-wolff-dental .ce_image.article-hero img,
.page-wolff-dental .mod_article .mod_article__inner > .article-hero > figure > img {
  height: min(33vw, 400px) !important;
  min-height: 175px !important;
  object-fit: cover !important;
}

/* ===== LATEST USER FIX: reduce large gap before footer on start/about image block ===== */
.page-wolff-dental .about-wolff {
  padding-bottom: 18px !important;
}

.page-wolff-dental .main-container .mod_article:last-child,
.page-wolff-dental .main-container .mod_article:last-of-type {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

.page-wolff-dental .main-container > main > :last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* ===== LATEST USER FIX: force left image in text element (reliable fallback) ===== */
.page-wolff-dental .force-image-left .image_container,
.page-wolff-dental .force-image-left figure,
.page-wolff-dental .force-image-left .ce_image {
  float: left !important;
  width: 25% !important;
  max-width: 25% !important;
  min-width: 170px;
  margin: 0 18px 12px 0 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  display: block !important;
}

.page-wolff-dental .force-image-left .image_container img,
.page-wolff-dental .force-image-left figure img,
.page-wolff-dental .force-image-left .ce_image img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  border-radius: 14px !important;
}

.page-wolff-dental .force-image-left::after {
  content: "";
  display: block;
  clear: both;
}

@media (max-width: 991px) {
  .page-wolff-dental .force-image-left .image_container,
  .page-wolff-dental .force-image-left figure,
  .page-wolff-dental .force-image-left .ce_image {
    width: 38% !important;
    max-width: 38% !important;
    min-width: 0;
    margin: 0 12px 8px 0 !important;
  }
}

/* ===== LATEST USER FIX: force-image-left for direct inline images ===== */
.page-wolff-dental .force-image-left > img,
.page-wolff-dental .force-image-left p > img:first-child,
.page-wolff-dental .ce_text.force-image-left > img,
.page-wolff-dental .ce_text.force-image-left p > img:first-child {
  float: left !important;
  width: 25% !important;
  max-width: 25% !important;
  min-width: 170px;
  margin: 0 18px 12px 0 !important;
  border-radius: 14px !important;
  display: block !important;
  height: auto !important;
}

.page-wolff-dental .force-image-left::after,
.page-wolff-dental .ce_text.force-image-left::after {
  content: "";
  display: block;
  clear: both;
}

@media (max-width: 991px) {
  .page-wolff-dental .force-image-left > img,
  .page-wolff-dental .force-image-left p > img:first-child,
  .page-wolff-dental .ce_text.force-image-left > img,
  .page-wolff-dental .ce_text.force-image-left p > img:first-child {
    width: 38% !important;
    max-width: 38% !important;
    min-width: 0;
    margin: 0 12px 8px 0 !important;
  }
}

/* ===== LATEST USER FIX: footer legal links white + gray hover ===== */
.page-wolff-dental .footer-bottom a,
.page-wolff-dental .footer-bottom a:visited {
  color: #ffffff !important;
  text-decoration: none;
}

.page-wolff-dental .footer-bottom a:hover,
.page-wolff-dental .footer-bottom a:focus {
  color: #7d7d7d !important;
}

#wolffLinkOverlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;

    width: 100vw !important;
    height: 100vh !important;

    z-index: 2147483647 !important;

    background: rgba(255,255,255,0.82);
    backdrop-filter: blur(8px);

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 20px;
    box-sizing: border-box;
}

#wolffLinkOverlay[hidden] {
    display: none !important;
}

.wolff-overlay-box {
    width: 100%;
    max-width: 460px;

    background: #fff;
    border-radius: 22px;

    padding: 34px 30px;

    box-shadow: 0 20px 60px rgba(0,0,0,.18);

    text-align: center;

    display: flex;
    flex-direction: column;
    align-items: center;
}

.wolff-overlay-box h3 {
    margin: 0 0 14px;

    font-size: 26px;

    color: #2f5d50;

    text-align: center;
}

.wolff-overlay-box p {
    margin: 0 0 28px;

    line-height: 1.7;

    color: #555;

    text-align: center;

    max-width: 360px;
}

.wolff-overlay-buttons {
    display: flex;

    justify-content: center;

    align-items: center;

    gap: 14px;

    width: 100%;
}

#wolffOverlayCancel,
#wolffOverlayConfirm {
    border: 0;

    border-radius: 999px;

    padding: 13px 28px;

    cursor: pointer;

    font-size: 15px;

    text-decoration: none;

    transition: all .25s ease;
}

#wolffOverlayCancel {
    background: #eef3f1;

    color: #2f5d50;
}

#wolffOverlayCancel:hover {
    transform: translateY(-1px);
}

#wolffOverlayConfirm {
    background: #2f5d50;

    color: #fff;
}

#wolffOverlayConfirm:hover {
    transform: translateY(-1px);
    opacity: .92;
}