/*
* Prefixed by:
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

/* FONTS ---------------------------------------------------------------------> */
/* @font-face {
    font-family: 'montserrat';
    src: url('fonts/montserrat-black-webfont.woff2') format('woff2'),
         url('fonts/montserrat-black-webfont.woff') format('woff');
    font-weight: 900;
    font-style: normal;
}
@font-face {
    font-family: 'montserrat';
    src: url('fonts/montserrat-extrabold-webfont.woff2') format('woff2'),
         url('fonts/montserrat-extrabold-webfont.woff') format('woff');
    font-weight: 800;
    font-style: normal;
}
@font-face {
    font-family: 'montserrat';
    src: url('fonts/montserrat-bold-webfont.woff2') format('woff2'),
         url('fonts/montserrat-bold-webfont.woff') format('woff');
    font-weight: 700;
    font-style: normal;
}
@font-face {
    font-family: 'montserrat';
    src: url('fonts/montserrat-regular-webfont.woff2') format('woff2'),
         url('fonts/montserrat-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'montserrat';
    src: url('fonts/montserrat-medium-webfont.woff2') format('woff2'),
         url('fonts/montserrat-medium-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'montserrat';
    src: url('fonts/montserrat-light-webfont.woff2') format('woff2'),
         url('fonts/montserrat-light-webfont.woff') format('woff');
    font-weight: 300;
    font-style: normal;
}
@font-face {
    font-family: 'montserrat';
    src: url('fonts/montserrat-extralight-webfont.woff2') format('woff2'),
         url('fonts/montserrat-extralight-webfont.woff') format('woff');
    font-weight: 200;
    font-style: normal;
}
@font-face {
    font-family: 'montserrat';
    src: url('fonts/montserrat-thin-webfont.woff2') format('woff2'),
         url('fonts/montserrat-thin-webfont.woff') format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-Thin.woff2') format('woff2'),
        url('fonts/Poppins-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-ExtraLight.woff2') format('woff2'),
        url('fonts/Poppins-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-Light.woff2') format('woff2'),
        url('fonts/Poppins-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-Regular.woff2') format('woff2'),
        url('fonts/Poppins-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-Medium.woff2') format('woff2'),
        url('fonts/Poppins-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-SemiBold.woff2') format('woff2'),
        url('fonts/Poppins-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-Bold.woff2') format('woff2'),
        url('fonts/Poppins-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Poppins';
    src: url('fonts/Poppins-Black.woff2') format('woff2'),
        url('fonts/Poppins-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
*/
@charset "utf-8";

@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-Bold.woff2') format('woff2'),
        url('fonts/OpenSans-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-SemiBoldItalic.woff2') format('woff2'),
        url('fonts/OpenSans-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-Italic.woff2') format('woff2'),
        url('fonts/OpenSans-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-Light.woff2') format('woff2'),
        url('fonts/OpenSans-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-BoldItalic.woff2') format('woff2'),
        url('fonts/OpenSans-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-LightItalic.woff2') format('woff2'),
        url('fonts/OpenSans-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-ExtraBold.woff2') format('woff2'),
        url('fonts/OpenSans-ExtraBold.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-ExtraBoldItalic.woff2') format('woff2'),
        url('fonts/OpenSans-ExtraBoldItalic.woff') format('woff');
    font-weight: 800;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-SemiBold.woff2') format('woff2'),
        url('fonts/OpenSans-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-Regular.woff2') format('woff2'),
        url('fonts/OpenSans-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
body {
	font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica';
  color: #1f2d1f;
}
#mainmenu {
	font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica';
}
section {
	font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica';
}
#footer {
  background: transparent;
  text-transform: uppercase;
	font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica';
}
/* <-------------------------------------------------------------------------*/
#header .logo img {
  max-height: 2em;
  -webkit-transition: all ease 0.25s 0.2s;
  -o-transition: all ease 0.25s 0.2s;
  transition: all ease 0.25s 0.2s;
}
/* MENU TOP ------------------------------------------------------------------> */
#logoAndMenuContainer {
  /* BOX SHADOW ? */
  -webkit-box-shadow: 0px 11px 17px 0px rgba(50, 50, 50, 0.22);
  box-shadow: 0px 11px 17px 0px rgba(50, 50, 50, 0.22);
}
 #logoAndMenuContainer #logo,
 #logoAndMenuContainer.scrolledActive #logo {
  padding-right: 0;
}
@media (min-width: 60rem) {
  #logoAndMenuContainer.scrolledActive #logo {
    -webkit-transition: all ease 0.25s 0.2s;
    -o-transition: all ease 0.25s 0.2s;
    transition: all ease 0.25s 0.2s;
    padding-top: 0.5em;
    padding-bottom: 0.5em;
  }
}
#logoAndMenuContainer.scrolledActive .logo img {
  max-height: 2em; /* = no change */
}
#logoAndMenuContainer.scrolledActive .svgSocials {
  font-size: 1em; /* = no change */
}
#logoAndMenuContainer.scrolledActive #mainmenu {
  padding: 0; /* = no change */
}

/* MobileMenu Absolute ? */
@media (max-width: 59.99rem) {
  #mainmenu {
    min-width: 10rem;
  }
  #mainmenu.jsActivated > ul {
    position: absolute;
    left: -1px;
    background: #fff;
    border-right: solid 1px #282828;
    border-left: solid 1px #282828;
    border-bottom: solid 1px transparent;
    right: -1px;
    padding-left: 0.5em;
    -webkit-transition: all ease 1s;
    -o-transition: all ease 1s;
    transition: all ease 1s;
  }
  #mainmenu > ul {
    border-bottom: solid 1px transparent;
  }
}
/* <--------------------------------------------------------------------------/*

/* COLORS ----------------------------------------------------------------------*/

table.alt tbody tr td,
table.ce-table-allBorders tbody tr td  {
	border: solid 1px rgba(160, 160, 160, 0.3);
}
.modern-table thead {
    background-color: #669933;
    color: #fff;
}
.modern-table tbody tr {
    border-bottom: 1px solid #f2f2f2;
}
.modern-table tbody tr:hover {
    background-color: #f1f1f1;
}
.modern-table tbody tr:nth-child(even) {
    background-color: #fafafa;
}
.modern-table td, .modern-table th {
    border: 1px solid #e0e0e0;
}
.modern-table {
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
.bgGrad1 {
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#0089e7+0,00b6c4+100 */
  background: #0089e7; /* Old browsers */ /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */
  background: -webkit-gradient(linear, left top, right top, from(#0089e7),to(#00b6c4));
  background: -o-linear-gradient(left, #0089e7 0%,#00b6c4 100%);
  background: linear-gradient(to right, #0089e7 0%,#00b6c4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0089e7', endColorstr='#00b6c4',GradientType=1 ); /* IE6-9 */
  background-attachment: fixed;
  color: #fff;
}
.bgGrey {
	background: #e8e8e8;
}
.colWhite {
  color: white;
}
.col1 {
  color: #669933;
}
.bgCol1,
#header1,
#slider,
.svgSocials.circles > div > a,
footer,
#gmaps p a,
#component .dsgvoShowcase p a,
.dsgvoShowcase p a,
.nkSliderSetActiveButtons.multiStepNumbers a.jsActive,
.nkSliderSetActiveButtons.multiStepNumbers a:hover,
.eventItem a {
  background-color: #669933;
  color: #fff;
}

/* Site colour for the one central button system from template6.0.css. */
p.big > a,
button,
button[type="submit"],
button.btn,
input[type="submit"],
input[type="button"],
input[type="reset"],
a.button,
a.transbutton {
  background-color: #669933;
  color: #fff;
}
.eventItemBig a:visited {
  color: #fff;
}
.bgCol1Trans60 {
    background-color: rgba(102, 153, 51, 0.6);
}
.bgColDarkTrans60 {
    background-color: rgba(31, 45, 31, 0.6);
}
h2 > span.col1 {
  color: #669933;
}

/* section seperators */
body.sliderSepBottom #slider:after,
.sepBottom:after {
  border-width: 0 0 3em 100vw;
}
.sepTop:before {
	border-width: 3em 100vw 0 0;
}
.sepTop.sepCol2::before {
  border-color: #669933 transparent transparent transparent;
}
body.sliderSepBottom #slider:after {
  border-color: transparent transparent #fff transparent;
}
body.footerSep #superwrapper:after,
.sepBottom.sepCol1:after {
  border-color: transparent transparent #669933 transparent;
}
.sepBottom.sepCol2:after {
  border-color: transparent transparent #f9f9fb transparent;
}
.sepBottom.sepCol3:after {
  border-color: transparent transparent #fff transparent;
}
body {
  /* Permalink  use to edit and share this gradient:
   https://colorzilla.com/gradient-editor/#0089e7+0,00b6c4+100 */
  background: #fff;
  color: #121127;
}
main p > a.underline,
main p > b > a.underline,
main p > a.underline:visited,
main p > b > a.underline:visited,
main p > a.underline:focus,
main p > b > a.underline:focus,
main p > a.underline:active,
main p > b > a.underline:active {
	color: #121127;
  transition: color ease 0.25s;
}
.bgWhite p a.underline,
.bgBrightGrey p a.underline {
	color: #121127;
}
.bgWhite p a.underline:hover,
.bgBrightGrey p a.underline:hover {
	color: #669933;
}
.bgCol1 p a.underline {
	color: #fff;
}
.bgWhite p a.underline:hover {
	color: #121127;
}
main .colWhite p > a.underline,
main .colWhite p > b > a.underline,
main .colWhite p > a.underline:visited,
main .colWhite p > b > a.underline:visited,
main .colWhite p > a.underline:focus,
main .colWhite p > b > a.underline:focus,
main .colWhite p > a.underline:active,
main .colWhite p > b > a.underline:active {
	color: #fff;
}
#logoAndMenuContainer {
  background: #fff;
  color: #121127;
}
/* SOCIALS -- */
.svgSocials a svg path:nth-child(even),
.svgSocials.circles > div > a {
  -webkit-transition: all ease 0.5s;
  -o-transition: all ease 0.5s;
  transition: all ease 0.5s;
}
/* rounded by filled circle style */
.svgSocials.circles.bgCol1 a svg path:nth-child(even),
.svgSocials.circles svg {
  fill: #fff;
}
.svgSocials.circles > div > a:hover {
  background: #1f2d1f;
}
.svgSocials a svg path:nth-child(even),
.svgSocials.circles svg {
  fill: #669933; /* Special Case */
}
.svgSocials a:hover svg path:nth-child(even) {
  fill: #1f2d1f; /* Special Case */
}
.svgSocials.circles.bgCol1 > div > a {
  background: #fff; /* reverse */
}
.svgSocials.circles.bgCol1 a:hover svg path:nth-child(even) {
  fill: #1f2d1f; /* Special Case reverse */
}
.svgSocials.circles.bgCol1 > div > a:hover {
  background: #1f2d1f;
}
.svgSocials.circles svg {
  fill: #669933;
  -webkit-transition: all ease 0.5s;
  -o-transition: all ease 0.5s;
  transition: all ease 0.5s;
}
/*Socials  Animation Hover */
.svgSocials.circles a:hover svg {
  -webkit-transition: all ease 0.5s;
  -o-transition: all ease 0.5s;
  transition: all ease 0.5s;
}
.svgSocials.circles a:hover svg {
  -webkit-transform: rotate(360deg) scale(1.3);
      -ms-transform: rotate(360deg) scale(1.3);
          transform: rotate(360deg) scale(1.3);
}
@media (max-width: 90rem) {
  .svgSocials a,
  .svgSocials svg {
    width: 1.5em;
    height: 1.5em;
  }
  .svgSocials.circles svg {
    width: 1.5em;
    height: 1.5em;
  }
  .svgSocials > div {
    margin-right: 0.25em;
  }
}
#mainmenu > ul > li {
    padding: 0 0.25em;
  }
@media (min-width: 60rem) {
  #mainmenu > ul > li {
    padding: 0 0.5em;
  }
  #mainmenu > ul > li > a {
      color: #1f2d1f;
  	}
  #mainmenu > ul li a:hover,
	#mainmenu > ul li.active a,
	#mainmenu > ul li.current a,
  #mainmenu > ul li a.jsActive  {
    color: #669933;
	}
	#mainmenu > ul li.active a,
	#mainmenu > ul li.current a {
    font-weight: inherit;
	}
}
@media (min-width: 90rem) {
  #mainmenu > ul > li {
    padding: 0 1em;
  }
}
/* Button ON NORMAL */
p.big > a,
#gmaps p a,
#component .dsgvoShowcase p a,
.dsgvoShowcase p a,
.eventItem a {
  border-radius: 0.5em;
}

.nkForm input[type="text"],
.nkForm input[type="email"],
.nkForm input[type="tel"],
.nkForm textarea,
.nkForm select {
  border-radius: 0.5em;
  /* Button Shadow
  -webkit-box-shadow: 10px 10px 28px 0px rgba(50, 50, 50, 0.48);
  -moz-box-shadow:    10px 10px 28px 0px rgba(50, 50, 50, 0.48);
  box-shadow:         10px 10px 28px 0px rgba(50, 50, 50, 0.48);
  */
}
a.rounded {
	background: #575656;
	color: #fff;
	border-radius: 0.25em;
}
/* Button ON DARK BACKGROUND */
.bgCol1 p.big > a,
.bgCol1 button,
.bgCol1 input[type="submit"],
.bgCol1 input[type="button"],
.bgCol1 input[type="reset"],
.bgCol1 a.button,
.bgCol1 a.transbutton {
  background: #fff;
  color: #669933;
  -webkit-transition: all ease 0.5s;
  -o-transition: all ease 0.5s;
  transition: all ease 0.5s;
}
p.big > a:hover,
#gmaps p a:hover,
#component .dsgvoShowcase p a:hover,
.dsgvoShowcase p a:hover,
button:hover,
button[type="submit"]:hover,
button.btn:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
a.button:hover,
a.transbutton:hover,
.eventItem a:hover {
    background: #1f2d1f;
		cursor: pointer;
		color: #fff;
}
p.bluegrad > a {
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#0089e7+0,00b6c4+100 */
  background: #0089e7; /* Old browsers */ /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */
  background: -webkit-gradient(linear, left top, right top, from(#0089e7),to(#00b6c4));
  background: -o-linear-gradient(left, #0089e7 0%,#00b6c4 100%);
  background: linear-gradient(to right, #0089e7 0%,#00b6c4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0089e7', endColorstr='#00b6c4',GradientType=1 ); /* IE6-9 */
  background: #669933;
  color: #fff;
}
#footer {

}
#copyright,
#slider{
  color: #fff;
}
#component {
  background: #fff;
}
#footer {
  background: transparent;
  color: #fff;
}
#footer .bgWhite,
footer .bgWhite a {
  color: #3c3c3c;
}
footer a:hover {
  color: #1f2d1f;
}
/* MellowSlides */
.nkSliderSetActiveButtons.bottomCenter {
  transform: translate(-50%, -100%);
  bottom: 0;
}
.nkSliderSetActiveButtons a {
  border: solid 2px #669933;
  font-size: 1.3em;
}
.nkSliderSetActiveButtons a.jsActive {
  border: solid 2px #fff;
}
.nkSliderSetActiveButtons a.jsActive,
.nkSliderSetActiveButtons a:hover,
.nkSliderSetActiveButtons.multiStepNumbers:before {
	background: #669933;
}
/*
@media (max-width: 959px) {
  .sliderBox > div > div > div:last-child {
    padding-left: 1em;
    padding-right: 1em;
  }
  .sliderBox > div > div > div:first-child.bg2 {
    background-position: top left;
  }
}
@media (min-width: 960px) {
  .sliderBox > div > div > div:first-child {
    background-size: cover;
    background-position: top center;
  }

  .inActiveSlide > div:first-child {
    -webkit-transition: all ease 1.5s;
    -o-transition: all ease 1.5s;
    transition: all ease 1.5s;
  }
}
*/
/* NKSimple COntact */
.nkSliderSetActiveButtons.multiStepNumbers a {
  border: solid 0.15em #669933;
  background: #fff;
  color: #669933;
}
#nkjsimplecontact.nkForm input[type="text"],
#nkjsimplecontact.nkForm input[type="email"],
#nkjsimplecontact.nkForm textarea {
  color: #669933;
}
/* NForm */
.nkForm .jsDdOpened [id^="jsAltDd-"][id$="-Current"]::before,
.nkForm .jsDdOption:hover {
  background: #669933 !important;
}
[id^="nkmsq-c"][id*="-opt"].isSelected {
  border-color: #669933;
}
/* NKB */
.appInfo svg,
.appInfo {
  color: #669933;
  fill: #669933;
}
.editBox h2 {
  text-align: left;
}
.nkbEventAndFormBox h3 > span {
  font-size: 1.2rem;
  line-height: inherit;
  vertical-align: top;
}
#nkbAdminBox .editBox h2 > a:hover,
#nkbAdminBox .editBox h2 > a.activated {
  background: url('images/closed.png') no-repeat center right / 1em #669933;
  color: #fff;
  border-right: solid 0.5em #669933;
}
#nkbAdminBox a.addEventLink:hover,
#nkbAdminBox a.addEventLink.activated {
  color: #669933;
}
#nkbActualCalendarMonthBox caption {
  border-bottom: solid 0.25em #669933;
}
.eventExtraInfo {
  padding-top: 1em;
  font-size: 1.1rem;
  font-weight: 500;
}
.nkbEventInfoBox h2 {
  text-align: left;
    font-size: 1.5em;
    padding-bottom: 0.25em;
}
.nkbEventInfoBox h2 > span {
  font-size: 0.7em;
}
.serviceInfoWithoutImg .nkbEventInfoBox .nkbServiceShortInfo img {
  display: none;
}
.signUpFeedback .serviceInfoContainer {
  display: none;
}
div.nkbCalenderBox table td.hasBookables,
.nkBookingContainer a.button {
  background: #669933;
}
.circleImgAndH3 .nkFlexBox h3 {
  color: #669933;
}
.threeIconLinkBoxes a svg,
.threeIconLinkBoxes .nkFlexBox > * svg {
	fill: #669933;
}
.threeIconLinkBoxes a:hover svg {
	fill: #3ea9e0;
}
.threeIconLinkBoxes a:hover svg {
	fill: #3ea9e0;
}
.threeIconLinkBoxes a:hover span {
	color: #3ea9e0;
}
.threeIconLinkBoxes.borders .nkFlexBox > * {
	border-color: #669933;
}
.threeIconLinkBoxes.rounded .nkFlexBox > *.bgCol1,
.threeIconLinkBoxes.style2 .bgCol1 span.likeh3 + span,
.threeIconLinkBoxes .bgCol1 ul li,
.threeIconLinkBoxes .bgCol1 td,
.threeIconLinkBoxes.iconCircleOverflowTop .nkFlexBox > div::before {
  background: #669933;
  color: #fff;
}
.threeIconLinkBoxes.rounded .nkFlexBox > *.bgCol1  svg {
  fill: #fff;
}
.threeIconLinkBoxes.borders .nkFlexBox > *:hover {
  -webkit-transform: scale(1.05);
      -ms-transform: scale(1.05);
          transform: scale(1.05);
}
#component .threeIconLinkBoxes.style2 a.button, 
.threeIconLinkBoxes.style2 a.button {
  font-size: 0.9em;
  padding: 0.6em 2em;
  display:inline-block
}
/* COLORS <---------------------------------------------------------------------*/


/* VIEWPORT SIZES --------------------------------------------------------------> */

@media (min-width: 60rem) {
  #header1 > div,
  #logoAndMenu,
  .wrapperWidth,
  .nkFlexBox.wrapperWidth,
  section > *,
  #component  {
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
  }
  .wrapperPaddingLeft,
  .nkSliderSetActiveButtons.bottomLeft {
    padding-left: 5%;
  }
  .wrapperPaddingRight,
  .nkSliderSetActiveButtons.bottomRight {
    padding-right: 5%;
  }
}
@media (min-width: 75rem) {
  #header1 > div,
  #logoAndMenu,
  .wrapperWidth,
  .nkFlexBox.wrapperWidth,
  section > *,
  #component  {
    max-width: 80%;
  }
  .wrapperPaddingLeft,
  .nkSliderSetActiveButtons.bottomLeft {
    padding-left: 10%;
  }
  .wrapperPaddingRight,
  .nkSliderSetActiveButtons.bottomRight {
    padding-right: 10%;
  }
  .wrapperWidth.narrow60r {
    max-width: 60rem;
  }
  .wrapperWidth.narrow70r {
    max-width: 70rem;
  }
}
@media (min-width: 105rem) {
  #header1 > div,
  #logoAndMenu,
  .wrapperWidth,
  .nkFlexBox.wrapperWidth,
  section > *,
  #component  {
    max-width: 70%;
  }
  .wrapperPaddingLeft,
  .nkSliderSetActiveButtons.bottomLeft {
    padding-left: 15%;
  }
  .wrapperPaddingRight,
  .nkSliderSetActiveButtons.bottomRight {
    padding-right: 15%;
  }
}
.fullWidthComponent #component {
  max-width: 100%;
  padding-left: 0;
  padding-right: 0;
}
/* VIEWPORT SIZES <-------------------------------------------------------------- */
#component section.jsInactive .secOpacity {
	opacity: 0;
}
#component section.jsActive .secOpacity {
	opacity: 1;
}
/* JOOMLA EDIT FUNCTIONS FOR LOGGED IN USERS */
.jmodedit {
  display: none;
}
[id^="tip-"][role^="tooltip"] {
  display: none;
}
/* TYPOGRAPHY ----------------------------------------------------------------> */
#slider {
	min-height: 0;
}
@media (min-width: 90rem) {
  .sliderMinH {
    min-height: 70vh;
  }
}
body  {
  font-weight: normal;
}
@media (max-width: 40rem) {
  body {
    padding-top: 0;
  }
}
#header1 {
  overflow: hidden;
  padding: 0.5em 0;
}
section {
  padding-top: 5em;
  padding-bottom: 5em;
}
#slider h1, #slider h2 {
  font-size: 1.5em;
}
h1, h2 {
  text-align: center;
  font-size: 1.4em;
  line-height: 1.3em;
  font-weight: 300;
  padding-bottom: 1.2em;
}
#header1 .nkBookingContainer {
  font-size: 0.9em;
}
@media (max-width: 59.99rem) {
  .narrow {
    margin-right: 1em;
  }
}
@media (min-width: 60rem) {
  .narrow {
    max-width: 90%;
    margin-right: 0;
    margin-left: auto;
  }
  #header1 .nkBookingContainer {
    font-size: 1em;
  }
}
@media (min-width: 90rem) {
  .narrow {
    max-width: 80%;
    margin-right: 0;
    margin-left: auto;
  }
}
.narrow > h1,
.narrow > h2 {
  display: inline-block;
}
section > h2 {
  text-align: center;
}
h1 > b,
h2 > b {
  font-weight: bold;
}
h2 > strong {
  font-weight: 350;
}
h2.color1 {
  color: #00b6c4;
}
.colGrey  {
  color: rgba(18, 17, 39,0.55)
}
h2 + p.big,
h2 + p.fontS  {
  padding-top: 1.15em;
  padding-bottom: 0.5em;
}
section > h2 + p {
  font-size: 1.05em;
}
h3,
.likeh3,
.threeIconLinkBoxes.style2 span.likeh3, 
.threeIconLinkBoxes.style3 span.likeh3 {
  color: #1f2d1f;
}
h3,
.likeh3 {
  font-size: 1.25em;
  font-weight: normal;
  padding-bottom: 0.75em;
  text-align: inherit;
}
h3 + p,
.likeh3 + p {
  line-height: 1.8em;
}
img + h3 {
  padding-top: 1.2em;
}
main ul li {
  position: relative;
}
main ul li:before {
  content: " \00B7"; /* thin dot */
  content: " \25CF"; /* black bullet */
}
p, main li {
  font-size: 0.9375em;
  font-weight: 300;
  line-height: 2em;
}
p > b {
  font-weight: 600;
}
p.moreLineHeight {
  line-height: 1.9em;
}
.fontXXL {
  font-size: 1.5em;
  font-weight: normal;
}
img + h3 + p {
  padding: 0 1em;
}
#slider p.big,
.bgGrad1 p.big {
  font-size: 0.8em;
}
p.big {
  font-size: 1.1em;
  padding-bottom: 0;
}
p.big:last-child {
  padding-top: 2em;
  padding-bottom: 2em;
}
@media (max-width: 59.9rem) {
  p.big {
    text-align: center;
  }
}

p.big > a,
p.big > a {
  display: block;
  padding: 0.75em 1.5em;
  overflow: hidden;
  font-weight: 500;
  font-size: 1em;
  text-align: center;
}
p.big.inlineBlock > a {
  display: inline-block;
}
p.bluegrad > a {
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#0089e7+0,00b6c4+100 */
  display: inline-block;
}
p.big > a:hover {
  cursor: pointer;
}
@media (min-width: 60rem) {
  #slider h1, #slider h2 {
    font-size: 2em;
  }
	h1, h2 {
    font-size: 1.8em;
    padding-bottom: 1.75em;
	}
  h3,
  .likeh3 {
    font-size: 1.5em;
	}
  h2 + h3 {
    font-size: 1em;
    line-height: 1.2em;
  }
  p, label, main li {
    font-size: 0.8em;
  }
}

#logo {
	text-align: center;
  margin-right: 1em;
  padding-right: 0;
}
#mainmenu {
	font-weight: 500;
	font-size: 0.9em;
}
.logo p {
	font-size: 1.75em;
	color: #fff;
	letter-spacing: 0.07em;
	font-weight: 300;
  line-height: 1em;
}
.logo p > a {
	color: #fff;
  line-height: 1em;
  display: block;
}
section {
  padding-top: 3em;
  padding-bottom: 3em;
}
@media (max-width: 59.9rem) {
  #slider .alignRight {
    text-align: center;
  }
  .maxW15rTil60r {
    max-width: 15rem;
  }
  .allImgMaxW15rTil60r img {
    max-width: 15rem;
  }
}
/* UNDERLINE EFFECT */
ul.underlineEffect > li > a {
	color: #58585A;
	padding: 0.125em 0.25em;
	border-radius: 0.25em;
	display: block;
  position: relative;
}
ul.underlineEffect > li > a:after {
    content: "";
    display: block;
    position: relative;
    top: 0.25em;
    height: 2px;
    background: #669933;
    width: 0;
    margin: auto;
    transition: all ease 1s;
}
/* when section reached */
ul.underlineEffect > li > a.jsActive:after  {
	width: 100%;
}
/* when current item */
ul.underlineEffect > li.current > a:after  {
	width: 100%;
}
/* on Hover */
ul.underlineEffect > li > a:hover:after {
	/* width: 0;  OPTIONAL */
}
@media (min-width: 60rem) {
  #header1 > div,
  #logoAndMenu,
  .wrapperWidth,
  .nkFlexBox.wrapperWidth,
  section > * {
    margin-right: auto;
    margin-left: auto;
  }
  #logoAndMenu {
    font-size: 1em;
  }
	#logo {
		-webkit-box-flex: 0;
		    -ms-flex: 0 0 auto;
		        flex: 0 0 auto;
	}
  .logo p {
  	font-size: 1em;
  }
	#mainmenu {
		font-weight: normal;
		font-size: 1em;
	}
  #mainmenu > ul > li {

	}
  #mainmenu > ul > li > a {
    padding: 0.5em 0.5em 0.5em 0.5em;
    display: block;
    -webkit-transition: all ease-in-out 0.5s;
    -o-transition: all ease-in-out 0.5s;
    transition: all ease-in-out 0.5s;
	}
	#mainmenu > ul li a:hover,
	#mainmenu > ul li.active a,
	#mainmenu > ul li.current a {
		cursor: pointer;
	}
	#mainmenu ul.nav-child {
		display: none;
	}
	.custom.logo {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		    -ms-flex-direction: row;
		        flex-direction: row;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;
	}
	.logo p > a {
		font-size: 1.2em;
    line-height: 1.66em;
	}
  .logo a > span {
		font-weight: normal;
	}
  #slider {

  }
	section {
    padding-top: 5em;
    padding-bottom: 5em;
	}
}
@media (min-width: 75rem) {
	#logo {
		-webkit-box-flex: 0;
		    -ms-flex: 0 0 auto;
		        flex: 0 0 auto;
	}
}
@media (min-width: 90rem) {


}
@media (min-width: 105rem) {
	#logo {
		-webkit-box-flex: 0;
		    -ms-flex: 0 0 auto;
		        flex: 0 0 auto;
	}
	.logo p > a {
		font-size: 1.5em;
    line-height: 1.33em;

	}
}

#footer {
	background: transparent;
	text-transform: uppercase;
}
#footer p {
	font-size: 1em;
  padding-top: 0.5em;
}
#footer .logo a {
  max-width: 14em;
  display: block;
  margin: auto;
}
#copyright {
  text-align: center;
  font-size: 0.6rem;
}
#superwrapper {
    height: auto !important;
    min-height: 100%;
    margin-bottom: 0;
}

.mw10 {
  max-width: 10em;
}
.allLeft h1,
.allLeft h2,
.allLeft h3,
.allLeft h4,
.allLeft h5,
.allLeft h6 {
  text-align: left;
}

#slider h1 {
	font-size: 2em;
	text-align: center;
	line-height: 1.2em;
  font-weight: 300;
  margin-bottom: 0.7em;
}

#slider h1.small {
  padding-bottom: 0;
  font-size: 1.5em;
  margin-bottom: 0;
}
#slider h1.small > b {
  font-weight: normal;
}
#slider h1.small ~ p {
  font-size: 0.8em;

}
@media (min-width: 60rem) {
  #slider h1 {
  	font-size: 2.75em;
  }
  #slider h1.alignCenter {
  	text-align: center;
  }
}

#sliderBox > div > div {
	width: 100%;
}
/* TYPOGRAPHY <---------------------------------------------------------------- */





/* NKSimpleContact */
h2.introtitle {
  text-align: center;
  padding-bottom: 0.75em;
}
#nkjsimplecontact fieldset {
  padding-bottom: 1em;
}
#nkjsimplecontact .inlineInsides > div {
  display: block;
}
#nkjsimplecontact fieldset.inlineInsides > div > * {
  padding-right: 0;
}
#nkjsimplecontact fieldset:last-child {
  padding-top: 1em;
}
.nkForm textarea {
    margin-bottom: 0em;
}



/* ------------------ Inividual Content Styles -------------------------------*/
.circleImgAndH3 .nkFlexBox {
  padding-bottom: 2em;
}
.circleImgAndH3 .nkFlexBox > div:first-child {
  text-align: center;
  padding: 2em;
}
.circleImgAndH3 .nkFlexBox > div:last-child {
  -webkit-box-flex: 0;
      -ms-flex: 0 1 60%;
          flex: 0 1 60%;
}
.circleImgAndH3 .nkFlexBox > div:first-child img {
  max-width: 10em;
}


@media(min-width: 60rem) {
  .circleImgAndH3 .nkFlexBox > div:first-child {
    text-align: right;
    padding: 0 2em;
  }
  .circleImgAndH3 .nkFlexBox > div:last-child {
    padding-left: 1.5em;
  }
  .circleImgAndH3.smallWidth .nkFlexBox h3 + p {
    max-width: 25em;
  }
}
.smallHeading h2 {
  font-size: 1.4em;
  font-weight: 500;
  padding-bottom: 0.7em;
}
@media(min-width: 60rem) {
  .smallHeading p {
    font-size: 0.75em;
    max-width: 30em;
    margin-right: auto;
    margin-left: auto;
  }
}


[id^="toAnimate-"].nkjsObjOldClass {
  opacity: 0;
  -webkit-transition: all ease-out 1s;
  -o-transition: all ease-out 1s;
  transition: all ease-out 1s;
}
[id^="toAnimate-"].nkjsObjNewClass {
  opacity: 1;
  -webkit-transition: all ease-out 1s;
  -o-transition: all ease-out 1s;
  transition: all ease-out 1s;
}
/* ----------------------------- DEAKTIVIERT -------------------->
#nkmsq-c90-qs1-q1-opt1:before {
  content: "";
  display: block;
  margin: 0 auto 1em auto;
  width: 10em;
  height: 10em;
  background: url('/images/online2.png') no-repeat center center;
  background-size: contain;
}
#nkmsq-c90-qs1-q1-opt2:before {
  content: "";
  display: block;
  margin: 0 auto 1em auto;
  width: 10em;
  height: 10em;
  background: url('/images/online1.png') no-repeat center center;
  background-size: contain;
}
#nkmsq-c102 > div  {
  align-items: flex-start;
}
*/
.submitPositive {
  text-align: center;
}

#nkbsignup textarea {
    margin-bottom: 1em;
}
.nkbServiceShortInfo > img {
  max-height: none;
  display: block;
  margin: 0 auto 1em auto;
}
@media (max-width: 40rem) {
  .nkbServiceShortInfo > img {
    max-height: 15rem;
    width: auto;
    float: none;
    margin: 0 1em 1em auto;
  }
}
@media (min-width: 40rem) and (max-width: 90rem) {
  .nkbServiceShortInfo > img {
    max-height: 15rem;
    width: auto;
    float: right;
    margin: 0 1em 1em auto;
  }
}
.nkBookingContainer {
  font-size: 1em;
}
.nkBookingContainer h3,
.nkbSignupForm h2 {
  margin-bottom: 0;
  padding-bottom: 0;
}
.serviceInfoContainer h3 {
  margin-bottom: 1em;
}
.serviceInfoContainer h2,
.nkbServiceShortInfo h2 {
  padding-bottom: 0;
  text-align: left;
}
div.nkbCalenderBox table td.hasBookables a:hover {
    cursor: pointer;
}

.serviceInfoContainer img {
  float: none;
  max-width: 25rem;
  margin: 0 auto 2em auto;
}
.serviceInfoContainer ul {
  float: none;
  clear: both;
}
.login {
  text-align: center;
  margin: 1.5em auto;
  padding: 1.5em;
}
.login > form {
  display: inline-block;
}

/* NKSimpleContact */
h2.introtitle {
  text-align: center;
  padding-bottom: 0.75em;
}
.nkForm textarea {
    margin-bottom: 0em;
}
.nkbSignupForm h2 {
  text-align: left;
  font-weight: bold;
}

.nkForm input[type="text"],
.nkForm input[type="email"],
.nkForm input[type="tel"],
.nkForm textarea {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  padding: 0.5em 1em;
}

p.big > a:hover {
  cursor: pointer;
  color: #fff;
}
.nkForm fieldset.labelsBottom label {
  -webkit-box-ordinal-group: 3;
      -ms-flex-order: 2;
          order: 2;
  position: relative;
  top: -0.5em;
}
.nkForm label {
  display: block;
  padding: 0.5em 0;
  color: #669933;
  text-transform: uppercase;
}
.nkForm .nkfCheckbox label {
  text-transform: none;
  padding: 0 0 0 1em;
}
.nkForm fieldset > div > :last-child {
  margin-right: auto;
}


[for*="nkjsimplecontact-privacyagreement"] {
  font-size: 0.8em;
}
#nkmsq-c90-qs1-q1-opt1:before {
  content: "";
  display: block;
  margin: 0 auto 1em auto;
  width: 10em;
  height: 10em;
  background: url('/images/online2.png') no-repeat center center;
  background-size: contain;
}
#nkmsq-c90-qs1-q1-opt2:before {
  content: "";
  display: block;
  margin: 0 auto 1em auto;
  width: 10em;
  height: 10em;
  background: url('/images/online1.png') no-repeat center center;
  background-size: contain;
}
#nkmsq-c102 > div  {
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.submitPositive {
  padding-top: 6em;
  text-align: left;
}
[id^="nkmsq-c"][id*="-opt"].isSelected {
	border-color: #00b6c4;
}


/* NK SimpleContact */
.nkForm input[type="text"],
.nkForm input[type="email"],
.nkForm input[type="tel"],
.nkForm textarea {
  color: #121127;
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
}
.nkfCheckbox label {
  padding-top: 0.35em;
}
.nkForm [id^="jsAltDd-"][id$="-Current"] {
  background: #f7f7f7;
  border-radius: 0.5em;
  color: #669933;
}

/* SPecial */

#uebermich .posRel {
  overflow: hidden;
}
.posRel > .bg4 {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 0;
  -webkit-transition: all ease 7s;
  -o-transition: all ease 7s;
  transition: all ease 7s;
}
.jsActive .posRel > .bg4 {
  background-size: auto 104vh;
}
@media (min-width: 960px) {
  .posRel > .bg4  {
    background-position: right center;
    background-attachment: fixed;
    background-size: auto 100vh;
  }
}
@media (max-width: 959px) {
  .bg1, .bg4,
  .jsActive .posRel > .bg4  {
    min-height: 10em;
    background-position: top center;
    background-size: cover;
  }
}
.bg14 {
    background-position: top center;
}
#bottomRightWhenScrolled > * {
  font-size: 0.9em;
  line-height: 1.1em;
  background: #333;
  color: #fff;
  padding: 0.5em 0;
  border: solid 0.25em transparent;
  border-right: none;
  -webkit-transition: all ease 1s;
  -o-transition: all ease 1s;
  transition: all ease 1s;
}
#bottomRightWhenScrolled > *:hover {
  background: #669933;
}
/* Joomla Edit Buttons */
div.icons {
  display: none;
}

/* TOGGLE BOXES */
/* Toggle-Boxes */
.toggleBox {

}
.toggleBox > div {
	padding: 1.5em 0;
  border: none;
	border-bottom: solid 2px #c8c8c8;
	margin-bottom: 0;
}
h2 + .toggleBox > div:first-child {
	padding-top: 0.5em;
}
.toggleBox > div > a {
	display: block;
	text-transform: uppercase;
	font-size: 0.9em;
	padding-bottom: 0;
	line-height: 1.5em;
	position: relative;
}
@media (min-width: 60rem) {
	.toggleBox > div > a {
		font-size: 0.8em;
	}
}
.toggleBox > div >  div p {
	padding-top: 0.75em;
}
.toggleBox > div > a {
	color: #1f2d1f;
	padding-left: 2em;
}
.toggleBox > div > a:hover {
	cursor: pointer;
}
.toggleBox > div > a:hover,
.toggleBox.jsInitiated > div.jsActive > a {
  color: #669933;
}
.toggleBox > div > a:before {
	content: "-";
	position: absolute;
	left: 0;
	top: 0.1em;
	font-size: 1em;
	display: inline-block;
	width: 0.8em;
	height: 0.8em;
	margin-right: 1em;
}
.toggleBox.jsInitiated > div.jsInactive > a:before{
	content: "+";
	content: url("data:image/svg+xml; utf8, <svg version='1.1' id='Ebene_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 24 24' style='enable-background:new 0 0 24 14.1;' xml:space='preserve'> <path fill='%23393938' class='st0' d='M24 10h-10v-10h-4v10h-10v4h10v10h4v-10h10z'/></svg>");
}
.toggleBox.jsInitiated > div.jsActive > a:before{
	content: "-";
	content: url("data:image/svg+xml; utf8, <svg version='1.1' id='Ebene_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 24 24' style='enable-background:new 0 0 24 14.1;' xml:space='preserve'> <path fill='%23393938' class='st0' d='M0 10h24v4h-24z'/></svg>");
}
.toggleBox > div.jsInactive > a:hover:before {
	content: url("data:image/svg+xml; utf8, <svg version='1.1' id='Ebene_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 24 24' style='enable-background:new 0 0 24 14.1;' xml:space='preserve'> <path fill='%231d7d81' class='st0' d='M24 10h-10v-10h-4v10h-10v4h10v10h4v-10h10z'/></svg>");
}
.toggleBox.jsInitiated > div.jsActive > a:before {
	content: url("data:image/svg+xml; utf8, <svg version='1.1' id='Ebene_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 24 24' style='enable-background:new 0 0 24 14.1;' xml:space='preserve'> <path fill='%231d7d81' class='st0' d='M0 10h24v4h-24z'/></svg>");
}
.toggleBox > div > div {
	padding-left: 1.5em;
}
.toggleBox > div > div > *:first-child {
	padding-top: 1em;
}
.toggleBox.jsInitiated > div > div {
	overflow: hidden;
	-webkit-transition: max-height ease-in-out 0.2s;
	-o-transition: max-height ease-in-out 0.2s;
	transition: max-height ease-in-out 0.2s;
}
.toggleBox > div.jsInactive > div {
	max-height: 0;
}
.toggleBox > div.jsActive > div {
	max-height: 100em;
}
#component .toggleBox ul {
	list-style: square outside none;
	padding-left: 1em;
}

#component ol {
  font-size: 1em;
  list-style-type: upper-roman;
  list-style-position: outside;
}


/* Bordered P */
.borderedP p {
  padding: 0.5em 1em;
  border: solid 1px #99cc66;
  border-radius: 0.5em;
  background-color: #4d7326;
  margin-bottom: 0.5em;
}

.nkFlexBox > div.rounded {
  border-radius: 1.5em;
  overflow: hidden;
}
@media(max-width: 39.99rem) {
  .nkFlexBox.rowAt40r > div {
    margin-top: 1em;
  }
  .nkFlexBox.rowAt40r > div:first-child,
  .nkFlexBox.rowAt40r > div[class*="bg"],
  .nkFlexBox.rowAt40r > div.posRel {
    margin-top: 0;
  }
}
@media(max-width: 59.99rem) {
  .nkFlexBox.rowAt60r > div {
    margin-top: 1em;
  }
  .nkFlexBox.rowAt60r > div:first-child,
  .nkFlexBox.rowAt60r > div[class*="bg"],
  .nkFlexBox.rowAt60r > div.posRel {
    margin-top: 0;
  }
}

/* header1 */
#header1 > div {
  justify-content: center;
}


.uline {
  text-decoration: underline;
}
.noItalic {
  font-style: normal;
}

/* MELLOWSLIDES OVERRIDE */
.nkMellowSlides > .sliderBox > .nkSliderPrevNextButtons a svg {
  background: #5e371b;
  fill: #fff;
  border-radius: 0.5em;
  padding: 0.75em;
  width: 1.25em;
  height: 1.25em;
}
.nkMellowSlides > .sliderBox > .nkSliderPrevNextButtons a {
  opacity: 0.8;
  transition: opacity ease-in-out 0.25s;
}
.nkMellowSlides > .sliderBox > .nkSliderPrevNextButtons a:hover {
  opacity: 1;
}
@media(min-width: 90rem) {
  .nkMellowSlides > .sliderBox > .nkSliderPrevNextButtons.slideBefore a {
    transform: translateX(1em);
  }
  .nkMellowSlides > .sliderBox > .nkSliderPrevNextButtons.slideNext a {
    transform: translateX(-1em);
  }
}



.nkFlexBox.logos img {
  height: 3.5em;
}
.padL2 {
  padding-left: 2em;
}

@media (max-width: 60rem) {
  .padRL6-til60r {
    padding-left: 6em;
    padding-right: 6em;
  }
}


body.fallback .bg14 {
  background-position: top center;
}

/* NK Ultimate migration --------------------------------------------------- */
/* Header and footer intentionally keep the compact type scale of the live
   site while the content continues to use NK Ultimate's responsive scale. */
#header1,
footer {
  font-size: 1rem;
}

#header1 > div {
  padding-top: 0;
  padding-bottom: 0;
  font-size: 1em;
}

#header1 a.button {
  padding: 0.5em 2em;
  font-size: 0.9rem;
  font-weight: 400;
}

@media (min-width: 60rem) {
  #mainmenu {
    font-size: 0.8em;
  }

  #mainmenu > ul > li,
  #mainmenu > ul > li > a {
    white-space: nowrap;
  }
}

/* NK Ultimate renders the slider position as a semantic section. The hero
   itself remains a full-width, unpadded area. */
#slider {
  padding-top: 0;
  padding-bottom: 0;
}

#slider > .nkMellowSlidesBox,
#slider > .moduletable {
  width: 100%;
  max-width: none;
  margin-right: 0;
  margin-left: 0;
}

/* NK Mellow Slides 2 uses buttons instead of linked SVG controls. */
#nkMellowSlidesBox-130 .slider-arrow {
  width: 2.75rem;
  height: 2.75rem;
  border: 0;
  border-radius: 0.5em;
  background: rgba(94, 55, 27, 0.8);
  color: #fff;
}

#nkMellowSlidesBox-130 .slider-arrow:hover,
#nkMellowSlidesBox-130 .slider-arrow:focus-visible {
  background: #5e371b;
  color: #fff;
}

/* Full-width content areas opt out of the site's usual 80% section width. */
.fullWidthComponent #component section > .w100p {
  width: 100%;
  max-width: none;
  margin-right: 0;
  margin-left: 0;
}

@media (min-width: 60rem) {
  /* The legacy layout calculated the padded 60/40 columns in the content-box
     model. These effective proportions preserve that visual balance. */
  #uebermich .basis60p,
  .fullWidthComponent #component section > .w100p .basis60p {
    flex-basis: 68%;
  }

  #uebermich .basis40p,
  .fullWidthComponent #component section > .w100p .basis40p {
    flex-basis: 32%;
  }
}

/* The values section uses unadorned text rows; only its dedicated numbered
   SVG list keeps visual markers. */
#Grundwerte ul:not(.hasSvgs) {
  padding-left: 0;
}

#Grundwerte ul:not(.hasSvgs) > li::before {
  display: none;
  content: none;
}

footer .fontS {
  font-size: 0.9em;
}

/* Match the open, compact footer grouping of the original site. */
#footer .moduletable:first-child p.logo {
  padding-bottom: 0.75rem;
}

#footer .moduletable:first-child p.fontXXS {
  padding-top: 0;
}

body.footerSep #superwrapper::after {
  border-width: 0 0 4.5em 100vw;
}

body.footerSep footer {
  padding-bottom: 0.5rem;
}

/* Follow-up layout refinements ------------------------------------------- */
/* The padded circle defines the icon's box; centering must account for the
   global border-box model used by NK Ultimate. */
.svgSocials.circles > div > a {
  display: flex;
  align-items: center;
  justify-content: center;
}

.svgSocials.circles > div > a > svg {
  width: 100%;
  height: 100%;
}

#ankommen {
  padding-bottom: clamp(64px, 8vw, 100px) !important;
}

/* Keep the testimonial controls clear of the lower angled transition. */
.fullWidthComponent #component section.bg6.sepBottom {
  padding-bottom: clamp(7rem, 10vw, 9.5rem) !important;
}

/* Keep the legacy image at its final crop from the outset so entering the
   viewport cannot change its size. */
#uebermich .posRel > .bg4 {
  transition: none;
}

@media (min-width: 60rem) {
  #uebermich .posRel > .bg4,
  #uebermich.jsActive .posRel > .bg4 {
    background-size: auto 104vh;
  }
}

#footer #mod-custom93,
#footer #mod-custom93 p {
  text-align: center;
}

/* Compact, typographically consistent contact details. */
#mod-custom203 .contactDetailsTable {
  width: 100%;
  margin-bottom: 2.75rem;
  overflow: hidden;
  border: 1px solid rgba(102, 153, 51, 0.2);
  border-top: 3px solid #669933;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 0.45rem;
  box-shadow: 0 0.4rem 1.1rem rgba(31, 45, 31, 0.06);
  font-size: 1rem;
  line-height: 1.6;
}

#mod-custom203 .contactDetailsTable td {
  padding: 0.75rem 0.65rem;
  border-bottom: 1px solid rgba(31, 45, 31, 0.09);
  vertical-align: top;
  background: #fff;
}

#mod-custom203 .contactDetailsTable tr:nth-child(odd) td {
  background: rgba(102, 153, 51, 0.045);
}

#mod-custom203 .contactDetailsTable tr:last-child td {
  border-bottom: 0;
}

#mod-custom203 .contactDetailsTable td:first-child {
  width: 4rem;
  padding-right: 0.75rem;
  padding-left: 1rem;
}

#mod-custom203 .contactDetailsTable td:nth-child(2) {
  width: 5.75rem;
  padding-right: 0.9rem;
}

#mod-custom203 .contactLegalHeading {
  margin-top: 0;
  padding-top: 0;
  padding-bottom: 0.35rem;
}

#mod-custom203 .contactLegalIntro {
  margin-bottom: 0;
  font-size: 0.9em;
  line-height: 1.65;
}

#mod-custom203 .contactLegalList {
  margin-top: 0 !important;
  padding-top: 0 !important;
  padding-left: 0;
  list-style: none;
  font-size: 0.9em;
  line-height: 1.65;
}

#mod-custom203 .contactLegalList > li {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.35rem;
  padding-left: 0;
  font-size: inherit;
  line-height: 1.65;
}

#mod-custom203 .contactLegalList > li::before {
  display: block;
  flex: 0 0 0.48rem;
  width: 0.48rem;
  height: 0.48rem;
  border-radius: 50%;
  background: #669933;
  content: '';
}

/* Match the site's rounded content imagery. */
#mod-custom158 img {
  border-radius: 1.5rem;
}

/* One shared stroke-icon system keeps all contact icons optically equal. */
#mod-custom203 .contactDetailsIcon {
  display: block;
  width: 1.6rem;
  height: 1.6rem;
  margin-right: 0;
  margin-left: 0;
  margin-top: 0.05rem;
  color: #669933;
}

/* Workshop table headings should use the same vertical rhythm as their data
   cells, including when a heading wraps on narrow screens. */
.modern-table th {
  padding-top: 0.75em;
  padding-bottom: 0.75em;
  vertical-align: middle;
}

@media (max-width: 59.99rem) {
  /* With the auxiliary header module hidden, keep the menu toggle flush right. */
  #mainmenuContainer {
    flex: 0 0 auto;
    margin-left: auto;
  }

  #mainmenu {
    width: auto;
    margin-right: 0;
    margin-left: auto;
  }

  #mainmenu > a {
    margin-left: auto;
  }

  /* Let the expanded menu span the viewport without dark side gutters. */
  #logoAndMenuContainer #mainmenu > ul {
    right: -2vw;
    left: -2vw;
    width: auto;
    padding-left: 0;
    transform: none;
  }

  #mainmenu > ul > li {
    padding-right: 0;
    padding-left: 0;
  }

  #mainmenu li > a,
  #mainmenu li > span {
    border-right: 0;
    border-left: 0;
  }
}

/* End follow-up layout refinements. */

/* Practice photography --------------------------------------------------- */
/* Site-specific image classes use dedicated filenames so existing numbered
   backgrounds remain available and browser caches never need to be purged. */
.bgPraxisSystemisch {
  background: url('/images/backgrounds/bg-praxis-systemisch.jpg') no-repeat center center transparent;
  background-size: cover;
}

.bgPraxisBeratung {
  background: url('/images/backgrounds/bg-praxis-beratung.jpg') no-repeat center center transparent;
  background-size: cover;
}

.bgPraxisKontakt {
  overflow: hidden;
  background-image:
    linear-gradient(rgba(20, 48, 24, 0.56), rgba(20, 48, 24, 0.56)),
    url('/images/backgrounds/bg-praxis-kontakt.jpg');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

.contactTestimonials.sepTop::before {
  border-color: #fff transparent transparent transparent;
}

@media (min-width: 60.0625rem) {
  .bgPraxisSystemisch {
    background-image: url('/images/backgrounds/bg-praxis-systemisch_xxl.jpg');
  }

  .bgPraxisBeratung {
    background-image: url('/images/backgrounds/bg-praxis-beratung_xxl.jpg');
  }

  .bgPraxisKontakt {
    background-image:
      linear-gradient(rgba(20, 48, 24, 0.56), rgba(20, 48, 24, 0.56)),
      url('/images/backgrounds/bg-praxis-kontakt_xxl.jpg');
  }
}


/* Workshop page layout -------------------------------------------------- */
#mod-custom206 .workshopIntro {
  align-items: stretch;
}

#mod-custom206 .workshopIntroText h3 {
  margin-top: 0;
}

#mod-custom206 .workshopIntroImage {
  display: flex;
}

#mod-custom206 .workshopIntroImage .nkbServiceImage {
  width: 100%;
  height: 100%;
  min-height: 18rem;
  object-fit: cover;
  border-radius: 0.4rem;
}

#mod-custom206 .workshopSchedule {
  margin-top: 2.75rem;
}

#mod-custom206 .workshopAutumn {
  margin-top: 4rem;
  padding-top: 3rem;
  border-top: 1px solid rgba(102, 153, 51, 0.25);
}

#mod-custom206 .workshopAutumn > h3 {
  margin-top: 0;
  margin-bottom: 1.35rem;
}

#mod-custom206 .workshopAutumnColumns {
  align-items: flex-start;
}

#mod-custom206 .workshopGreenList {
  padding: 0 0 1.25rem 0;
  list-style: none;
}

#mod-custom206 .workshopGreenList li {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-bottom: 0.7rem;
  padding-left: 0;
}

#mod-custom206 .workshopGreenList li::before {
  display: block;
  flex: 0 0 0.5rem;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: #669933;
  content: '';
}

#mod-custom206 .workshopTableCompact {
  width: 100%;
  border-collapse: collapse;
}

#mod-custom206 .workshopTableCompact th,
#mod-custom206 .workshopTableCompact td {
  padding: 0.65rem 0.8rem;
  font-size: 0.76em;
  line-height: 1.45;
}

#mod-custom206 .workshopTableCompact th {
  letter-spacing: 0.02em;
}

#mod-custom206 .workshopAction {
  margin-bottom: 0;
  padding-top: 1rem;
}

/* Contact form: one type scale, neutral labels and compact vertical rhythm. */
.contactFormHeading {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

#nkjsimplecontactBox-144,
#nkjsimplecontactBox-144 input,
#nkjsimplecontactBox-144 textarea,
#nkjsimplecontactBox-144 button,
#nkjsimplecontactBox-144 label {
  font-family: inherit;
}

#nkjsimplecontactBox-144 .nkjscRequiredNote {
  margin: 0 0 0.9rem;
  padding: 0;
  font-size: 0.9em;
  line-height: 1.4;
}

#nkjsimplecontactBox-144 .nkForm label {
  color: #1f2d1f;
  font-size: 1rem;
  line-height: 1.45;
}

#nkjsimplecontactBox-144 .nkForm .nkfCheckbox {
  align-items: flex-start;
}

#nkjsimplecontactBox-144 .nkForm .nkfCheckbox input[type="checkbox"] {
  flex: 0 0 auto;
  margin-top: 0.38em;
}

#nkjsimplecontactBox-144 .nkForm .nkfCheckbox label {
  padding-top: 0;
}

@media (max-width: 59.99rem) {
  #mod-custom203 .contactLegalIntro,
  #mod-custom203 .contactLegalList,
  #nkjsimplecontactBox-144 .nkjscRequiredNote {
    font-size: 1em;
  }

  #mod-custom206 .workshopIntroImage,
  #mod-custom206 .workshopAutumnDates {
    margin-top: 1.5rem;
  }

  #mod-custom206 .workshopIntroImage .nkbServiceImage {
    min-height: 14rem;
    max-height: 26rem;
  }

  #mod-custom206 .workshopSchedule {
    margin-top: 2rem;
  }

  #mod-custom206 .workshopAutumn {
    margin-top: 3rem;
    padding-top: 2.25rem;
  }

  #mod-custom206 .workshopAutumnDates {
    margin-top: 1rem;
  }
}

/* Workshop mobile columns */
@media (max-width: 59.99rem) {
  #mod-custom206 .workshopIntroText,
  #mod-custom206 .workshopIntroImage,
  #mod-custom206 .workshopAutumnText,
  #mod-custom206 .workshopAutumnDates {
    flex: 0 0 100%;
    width: 100%;
  }
}
