/*******************************************************************************/
/* BASIS LAYOUT   */
/******************************************************************************/
:root {
	--container:1400px;
  --container-big:1980px;
  --bs-gutter-x:12px;
  --bs-gutter-y:0px;
}


.container,
.container-big {
    overflow:hidden; 
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
    scrollbar-width: none;  /* Firefox */
}

.no-container {
    overflow:hidden; 
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
    scrollbar-width: none;  /* Firefox */
}

.container::-webkit-scrollbar,
.container-big::-webkit-scrollbar,
.no-container::-webkit-scrollbar { 
    display: none;  /* Safari and Chrome */
}

.overflow,
.overflow .container,
.overflow .no-container,
.overflow .row  {
    overflow:visible !important;
}

*, html {
  scroll-padding: 110px; 
}


html {
  height: 100.1%;
}

body {
	display: flex;
  flex-direction: column;
	overflow-x:hidden; 
	height: 100.1%;
	width: 100%;
	margin: 0px;
	padding: 0px;
	background-color:#ffffff !important;
	position:relative; 
}

header, nav, section, article, aside, footer {
  display: block;
}

#wrapper {
	flex: 1 0 auto;
	position: relative;
	width: 100%;
	margin: 0 auto 0 auto;
	height: auto !important;
	background-color:#fff; 
}

#wrap-header {
	width:100%;
	height:90px;
	position:fixed;
  background-color:#fff; 
	z-index:90;
	box-shadow: 0 10px 20px -5px rgba(115,115,115,0.25);
}

#header {
	height:100%;
}

#logo {
	z-index:1500 !important;
	width:280px;
	position:absolute;
  left:15px;
	top:50%;
  transform:translateY(-50%);
}

#logo a, #logo img {
  display:block;
  width:100%;
  height:auto; 
}

#wrap-topbild {
	width:100%;
	height:auto;
	overflow:hidden !important;
	position:relative;
	height:32vw;
	margin-top:90px; 
}

.home #wrap-topbild {
  height:calc(100vh - 90px) !important;
}

#topbild {
	width:100%;
	height:100%;
	position:relative; 
  overflow:hidden;
}
#topbild div,
#topbild figure,
#topbild picture {
  height:100%; 
}

#topbild img {
 /* 	position:fixed;  */
  z-index:0;
}

#topbild img#myimg {
	position:relative;
	top:0 !important;
}

#topbild .ce-gallery, .bg-fullscreen .ce-gallery {
	float: none !important;
}

#topbild .ce-image img, #topbild img, 
.bg-fullscreen .ce-image img, .bg-fullscreen img {
	width:100% !important;
	height:auto;
}

#topbild .ce-center .ce-outer, #topbild .ce-center .ce-inner, 
.bg-fullscreen .ce-center .ce-outer, .bg-fullscreen .ce-center .ce-inner  {
	position: relative;
	float: none !important;
	right: 0% !important;
}

#topbild .ce-column, #topbild .ce-gallery figure,
.bg-fullscreen .ce-column, .bg-fullscreen .ce-gallery figure  {
	width: 100% !important;
}

#topbild .ce-gallery, .bg-fullscreen .ce-gallery {
	margin-right: 0px !important;
	margin-bottom:0px !important; 
}

#topbild .ce-gallery .ce-column, 
.bg-fullscreen .ce-gallery .ce-column {
	margin-right: 0px !important;
	margin-bottom: 0px !important;
}



#wrap-inhalt {
  z-index:1;
}

main,
#inhalt {
  min-height: 400px;
  padding-top: 0px;
  height: auto;
  padding: 0px 0px 90px 0px;
  background-color:#fff;  
  position:relative;
}

.notb {
  margin-top:90px; 
}

.kontakt .notb {
  margin-top:90px; 
}



/* Section Background */
.bg-0 {
  background-color:none !important; 
}

.bg-1 {
  background-color:#F5F5F5;
}

.bg-2 {
	background-color:#F5E513;
}

.bg-3 {
	background-color:#fefee7;
}

.bg-4 {
	background-color:#20683D;
}

/*
.maurer .bg-1 {
  background-color:#fcfce9;
}
*/


/* Fuzsszeile */
#map {
  width: 100%;
}

#wrap-footer {
  flex-shrink: 0;
  width: 100%;
  clear: both;
  background-color:#20683D;
  position: relative;
  z-index: 5;
}

#footer-map {
  height: 460px;
  width: 100%;
  height:0px; 
}

footer {
  position: relative;
  padding-top: 40px;
  padding-bottom: 30px;
  margin-right: auto;
  margin-left: auto;
  min-height: 180px;
}

footer p {
  margin-bottom: 0px;
}

footer ul {
  list-style-type: none;
  margin-left: -30px;
}

#meguralink {
  text-align: right;
  margin: 0 auto;
  margin-top: 10px;
}

#wrap-footer span.oeffnungszeiten {
  font-size: 14px;
}



/* social media icons */
#wrap-social {
	width:100%;
	margin-bottom:40px; 
	margin-top:15px; 
}
.social-link {
	width:35px;
	float:left;
	margin-left:15px; 
}

.social-link:first-child {
	margin-left:0px; 
}

.social-link img {
	width:100%;
	height:auto; 
}

.social-link a { margin-right:12px; }
.social-link .fab { font-size:28px; }
.social-link .fa-facebook-f { font-size:24px;}



/* Megura Swissness Logo */
#megura-programmierung {
  position: relative;
}

#megura-swissness {
  width: 100px;
  height: 100px;
  position: absolute;
  bottom: 15px;
  right: 15%;
  /*transform: translateY(-70%);*/
}

#megura-swissness svg {
  width: 100%;
  height: 100%;
}

.ms-svg-inner {
  fill: #20683D;
}

#megura-swissness svg:hover .ms-svg-inner {
  fill: #8d1d25;
}


/* Helper classes  */
.container {
  position: relative !important;
  max-width: var(--container);
}

.container-big {
  position: relative !important;
  max-width: var(--container-big);
  margin:0 auto; 
}

#inhalt.subpage .sec .container {
  padding-left: 300px;
}

.center-text {
  text-align: center;
  margin: 0 auto !important;
}
.center-element {
  margin: 0 auto !important;
}

img {
  outline: none !important;
}

main .row img {
  max-width: 100% !important;
  height: auto;
}

/* IE 10+ only */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  main .row img {
    width: 100% !important;
    height: auto;
  }
}

.frame-image-rounded img {
  max-width: 100% !important;
	height: auto;
	clip-path: circle();
}



/* Google Maps */
.tx-go-maps-ext {
  height: 45vh;
  width: 100%;
}

.js-gme-container {
  height: 100%;
  width: 100%;
}

.gm-style {
  font-family: "Jost", sans-serif;
  font-size: 14px !important;
  line-height: 120%;
}

.gme-info-window,
.gme-info-window p,
.gme-info-window a {
  color: #000 !important;
  line-height: 140%;
  font-family: "Jost", sans-serif;
  font-size: 14px !important;
}

.gme-info-window p strong {
  font-weight: 700 !important;
}

.gme-info-window p {
  margin-bottom: 5px !important;
}

.gm-style .gm-style-iw-c {
  border-radius: 20px !important;
  padding: 20px !important;
  color: #000;
  background-color: #fff;
  border: 2px solid #8d1d25;
}

.gm-style-iw-d {
  overflow: auto !important;
}

.gm-ui-hover-effect {
  color: #000 !important;
  top: 0px !important;
  right: 2px !important;
}

main .row .js-gme-container img {
  max-width: initial !important;
  width: auto !important;
  height: auto;
}

.js-map p {
  margin-bottom: 0px;
}

.gm-style .gm-style-iw-t::after {
  border-left: 2px solid #8d1d25;
  border-bottom: 2px solid #8d1d25;
}

.gme-info-window a:hover {
  color: #8d1d25 !important;
}





/* Slick Slider */
.slick-slider {
  width: 100%;
}

.slick-prev,
.slick-next {
  width: 45px !important;
	height: 72px !important;
}

.slick-prev::before,
.slick-next::before {
  color: transparent !important;
  width: 45px;
	height: 72px;
  background-size:contain;
  background-repeat: no-repeat;
  background-position:0 0;
  font-family:initial !important;
	font-size: 0px;
	opacity: .75;
	color: transparent;
}

.slick-prev,
[dir='rtl'] .slick-prev {
  left:10px !important;
  z-index: 5;
}
.slick-prev:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1em' viewBox='0 0 320 512'%3E%3Cpath d='M52.7 267.3c-6.2-6.2-6.2-16.4 0-22.6l160-160c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6L86.6 256 235.3 404.7c6.2 6.2 6.2 16.4 0 22.6s-16.4 6.2-22.6 0l-160-160z' fill='%23ffffff' /%3E%3C/svg%3E");
  position:absolute; 
  top:0;
  left:0;
}

[dir='rtl'] .slick-prev:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1em' viewBox='0 0 320 512'%3E%3Cpath d='M52.7 267.3c-6.2-6.2-6.2-16.4 0-22.6l160-160c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6L86.6 256 235.3 404.7c6.2 6.2 6.2 16.4 0 22.6s-16.4 6.2-22.6 0l-160-160z' fill='%23ffffff' /%3E%3C/svg%3E");
  position:absolute; 
  top:0;
  left:0;
}

.slick-next,
[dir='rtl'] .slick-next {
  right:10px !important;
}
.slick-next:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1em' viewBox='0 0 320 512'%3E%3Cpath d='M267.3 244.7c6.2 6.2 6.2 16.4 0 22.6l-160 160c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6L233.4 256 84.7 107.3c-6.2-6.2-6.2-16.4 0-22.6s16.4-6.2 22.6 0l160 160z' fill='%23ffffff' /%3E%3C/svg%3E");
  position:absolute; 
  top:0;
  left:0;
}

[dir='rtl'] .slick-next:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='1em' viewBox='0 0 320 512'%3E%3Cpath d='M267.3 244.7c6.2 6.2 6.2 16.4 0 22.6l-160 160c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6L233.4 256 84.7 107.3c-6.2-6.2-6.2-16.4 0-22.6s16.4-6.2 22.6 0l160 160z' fill='%23ffffff' /%3E%3C/svg%3E");
  position:absolute; 
  top:0;
  left:0;
}


/* Bildergalerie */
.frame-gallery .ce-gallery .ce-row {
  display:none !important;
}

.frame-gallery .ce-gallery .ce-row:nth-of-type(1) {
  display:block !important;
}


.sticky {
  /*
  display:flex;
  align-items: center;
  */
}

.sticky > div {
  position: sticky;
   top: 280px; 
}


/* Vimeo Video */
.vimeovideo + .space {
  display:none; 
}

.vimeovideo > .videoWrapper > .coverimage-click {
	border: 2px transparent !important;
}




/*******************************************************************************/
/* INHALTSSEITEN & KOMPONENTE   */
/******************************************************************************/

/* Home Berufe Boxen */
#stage-claim {
  position:fixed;
  z-index: 0;
  bottom:210px;
  left:50%;
  transform:translateX(-50%);
  height:150px !important; 
}

#stage-claim h1 {
  color:#fff !important; 
  font-size:82px;
  text-shadow: 2px 2px 5px #333;
  margin-bottom:0px !important
}


.berufe a {
	display:block;
	width:100%;
	height:100%;
	position:relative;
	overflow:hidden; 
}

.berufe .ce-bodytext {
	position:absolute;
	bottom:0px;
	left:0;
	z-index:10;
	width:100%;
	height:20%;
  height:140px;
	background-color:transparent;
	transition: all .35s ease-out;

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

.berufe .ce-above .ce-gallery,
.berufe .ce-gallery .ce-column  {
	 margin-bottom: 0px !important; 
	 margin-right: 0px !important;
}

.berufe .ce-bodytext h2 {
	font-size:46px;
	font-weight:700;
	color:#fff;
	letter-spacing:1px; 
	text-transform: uppercase;
	text-align:center;
	text-shadow: 1px 1px 1px rgb(88, 88, 88);
  padding: 0px 20px;
  line-height:110%;
  max-width: 100%;
  display: inline-block;
  -moz-hyphens: auto;
  hyphens: auto;
}

.berufe .ce-bodytext p {
	font-size:21px; 
	color:#fff;
	margin-bottom:0px !important; 
	text-align:center;
}

.berufe a:hover .ce-bodytext {
	height:100%;
	padding-top:15%; 
}

.berufe a:hover .ce-bodytext {
	background-color: rgba(32, 104, 61,0.75);
}



/* Seite Berufe - Berufe Boxen */
#uid-492 .berufe .ce-bodytext h2 {
	font-size:30px;
}

#uid-492 .berufe .ce-bodytext {
	height:25%;
}

#uid-492 .berufe a:hover .ce-bodytext {
	height:100%;
}



/* Team Mitarbeiter */
.frame-team .ce-gallery .ce-column {
		margin-bottom: 0px !important;
  }

.frame-team .ce-bodytext p::first-line {
  text-transform:uppercase;
  font-size:16px; 
}

.frame-team a {
  text-decoration:none !important; 
}

.frame-team a:before  {
	position: relative;
	top: 4px;
	display: inline-block;
	content: "";
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M48 150.8l208 143 208-143V112H48v38.8zM464 209L256 352 48 209V400H464V209zM0 400V176 112 64H48 464h48v48 64V400v48H464 48 0V400z' fill='%23000000' /%3E%3C/svg%3E");
	background-repeat: no-repeat;
	width: 20px;
	height: 20px;
	margin-right: 6px;
}




/* Stories */
.boxcontent-grey {
  background-color:#F2F2F2;
}

.boxcontent-grey > div {
  padding-left: calc(var(--bs-gutter-x)/ 2);
}

.boxcontent-green {
  background-color:#20683D
}

.boxcontent-green > div {
  padding-left: calc(var(--bs-gutter-x)/ 2);
}

.boxcontent-green p,
.boxcontent-green h1,
.boxcontent-green h2,
.boxcontent-green h3,
.boxcontent-green a {
  color:#fff; 
}

.boxcontent-green + div .slick-dotted.slick-slider,
.boxcontent-grey + div .slick-dotted.slick-slider {
	margin-bottom: 0px !important;
}

.boxcontent-green + div .slick-list,
.boxcontent-grey + div .slick-list {
	aspect-ratio: 3/2;
}


/* Counter */
h1.count {
	color: #20683D;
	font-size: 106px;
	font-weight: 600;
	margin-bottom: 10px !important;
}

/* Ausbildungswege */
.ab-card {
  position:relative;
  background-color:transparent; 
  border-radius:18px; 
  overflow:hidden;
  border:1px solid #fff; 
  aspect-ratio:1/1;
  cursor:pointer;
  max-width:500px; 
  margin:0 auto; 
}

.ab-card header {
  position:absolute;
  z-index:5;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
  margin-top:0;
  transition: all .5s ease;
  width:100%;
}

.ab-card header h2 {
  color:#fff; 
   width:100%;
   text-align:left; 
   padding-left:20px; 
   text-shadow: 2px 2px 5px #333;
}

.ab-card .ce-gallery {
  position:relative;
  transition: all .5s ease;
  border-radius:18px; 
  border:0;
}

.ab-card .ce-bodytext {
  position:absolute;
  top:100%;
  padding:8px 20px;
  transition: all .5s ease;
  color:#fff; 
}

.ab-card .ce-bodytext p {
  font-size:17px !important;
  line-height:140% !important;
  margin-bottom:0px !important
}


.ab-card:hover {
  background-color:#20683D;
}

.ab-card:hover  header {
 margin-top:-35%; 
}

.ab-card:hover  .ce-bodytext {
 top:22%;  
}

.ab-card:hover header h2 {
   text-shadow:none;
}

.ab-card:hover .ce-gallery {
  opacity:0; 
  border:0;
}



/* Benefits */
.benefits .frame-default {
  max-width:330px; 
  margin:0 auto; 
}

.benefits p {
 
}
