
/* -------------------------------------------------------------------- */

/*html {
	box-sizing: border-box;
}*/

* {
  -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;
}

*, *:before, *:after {
	box-sizing: inherit;
}

html, body {
	display: block;
	position: relative;
	margin: 0px;
	padding: 0px;
	/*width: 100vw;  avoid changing page width if magnific-popup makes v-scrollbar disappear */
	height: 100%;
	/*height: auto;*/
	/*overflow-x: hidden;*/
	/*overflow-y: scroll;*/
	/*overflow: scroll;*/
}
body {
	/*min-height: 100%;*/
}

/* -------------------------------------------------------------------- */

/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on October 25, 2017 */
@font-face {
	font-family: 'strandgutkeramikregular';
	src: url('/typo3conf/ext/sgk/Resources/Public/Fonts/strandgut_3-webfont.woff2') format('woff2'),
		 url('/typo3conf/ext/sgk/Resources/Public/Fonts/strandgut_3-webfont.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

body {
	font-family: 'strandgutkeramikregular';
	/*color: #473323;*/
	color: #201710;
}

.content_main_formal,
.content_bottom
{
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.content_main_formal
{
	font-size: 16px;
	line-height: 1.2em;
}

/* LARGE / DESKTOP SIZE */
@media only screen and (min-width : 900px) {
	
	/* debug info */
	/*.content_main::before { content: "[min-width : 900]"; }*/
	
	body {
		line-height: 1.5em;
		font-size: 1.5em;
	}
}

/* -------------------------------------------------------------------- */

.content_main:not(.content_main_formal) h1,
.content_main:not(.content_main_formal) h2,
.content_main:not(.content_main_formal) h3,
.content_main:not(.content_main_formal) h4
{
	font-weight: normal;
}

.content_main_formal h1, h2, h3, h4 {
	font-weight: bold;
}

.content_main_formal h1 {
	margin: 40px 0px;
}

a {
	color: inherit;
	outline: none;
}

/* -------------------------------------------------------------------- */

.bg1 {
    display: block;
    position: relative;
    width: auto;
    /*height: auto;*/
    height: 100%;
    min-height: 100%;
	overflow: auto;
	
    /*background: #dd9d3d;*/
    background: #d38f36;
    /*background: #eaae45;*/
	
/*	
    background: #dd9d3d;
    background: -webkit-linear-gradient(left top, #d38f36, #eaae45);
    background: -o-linear-gradient(bottom right, #d38f36, #eaae45);
    background: -moz-linear-gradient(bottom right, #d38f36, #eaae45);
    background: linear-gradient(to bottom right, #d38f36, #eaae45);
	*/
}

/* -------------------------------------------------------------------- */

/* debug */
/*.content_all  { border: 1px solid red;   }
.content_top  { border: 1px solid blue;  }
.content_main { border: 1px solid green; }*/

/* -------------------------------------------------------------------- */

/* CONTENT MAIN */

.content_main {
    text-align: left;
	padding: 10px;
}

.content_main:not(.content_main_formal) h2,
.content_main_centered,
.content_main_gallery
{
    text-align: center;
}

.content_main.content_main_rakuinfo div.frame:nth-child(1)
{
    text-align: left;
}

.content_main img {
    /*border: 6px solid #d38f36;*/
    /*border: 6px solid #c08334;*/
    /*border: 6px solid #c08334;*/
    border: 6px solid #b47a2e;
	
}

.content_main .google_maps_iframe {
    width: 500px;
    height: 300px;
    /*border: 6px solid #d38f36;*/
    border: 6px solid #b47a2e;
}
.content_main .open_street_map_iframe {
    border: 6px solid #b47a2e;
}

.content_main_kontakt p {
    /*margin: 10px;*/
}

/*
.content_main .ce-bodytext a
{
    text-decoration: none;
    //color: #9d5030;
    color: #6b351f;
    background-color: rgba(252, 201, 13, 0.05);
    border: 1px solid rgba(252, 201, 13, 0.3);
    border-left: 0px;
    border-right: 0px;
    padding: 0px 6px;
	
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

// links, i.e. on Märkte //
.content_main .ce-bodytext a:hover
{
    background-color: rgba(252, 201, 13, 0.1);
    border-color: rgba(252, 201, 13, 0.5);
}
*/

.content_main .ce-bodytext a
{
	/* rgb(255, 239, 183); */
	/*color: #f6c563;*/
	/*color: #473a1e;*/
	color: #473323;
    /*background-color: rgba(252, 211, 23, 0.1);*/
	
    padding: 0px 2px;
	
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}
.content_main .ce-bodytext a:hover
{
	color: #715239;
    background-color: rgba(252, 211, 23, 0.1);
}


/* images (non-gallery) */

/*.content_main:not(.content_main_gallery):not(.content_main_home) .ce-gallery {
	text-align: center;
}

.content_main:not(.content_main_gallery):not(.content_main_home) .ce-row {
	display: inline;
	padding-right: 10px;
}

.content_main:not(.content_main_gallery):not(.content_main_home) .ce-column {
    float: none;
	display: inline-block;
}*/

/* images (non-gallery, home) */



.content_main_home .ce-gallery .ce-outer,
.content_main_home .ce-gallery .ce-outer .ce-inner
.content_main_home .ce-gallery .ce-row,
.content_main_home .ce-gallery .ce-row .ce-column,
.content_main_home .ce-gallery .ce-row .ce-column figure,
.content_main_home .ce-gallery .ce-row .ce-column figure a,
.content_main_home .ce-gallery .ce-row .ce-column figure img
{
	/*padding: 0px;*/
	/*margin: 0px;*/
}



.content_main_home .ce-gallery .ce-outer,
.content_main_home .ce-gallery .ce-outer .ce-inner
{
	width: 100%;
	/*height: auto;*/
	text-align: center;
	/*padding: 0px;*/
	/*margin: 0px;*/
}

.content_main_home .ce-gallery .ce-outer .ce-inner
{
	/*border: 2px solid green;*/
}

.content_main_home .ce-gallery .ce-row,
.content_main_home .ce-gallery .ce-row .ce-column,
.content_main_home .ce-gallery .ce-row .ce-column figure,
.content_main_home .ce-gallery .ce-row .ce-column figure a
{
	display: block;
	position: relative;
	width : 100%;
	height: auto;
	padding: 0px;
	margin: 0px;
	vertical-align: bottom;
}

.content_main_home .ce-gallery .ce-row:nth-child(1),
.content_main_home .ce-gallery .ce-row:nth-child(2),
.content_main_home .ce-gallery .ce-row:nth-child(3),
.content_main_home .ce-gallery .ce-row:nth-child(4)
{
	width: 30%;
}

.content_main_home .ce-gallery .ce-row:nth-child(5)
{
	width: 35%;
	display: inline-block;
}

.content_main_home .ce-gallery .ce-row:nth-child(5) img
{
	background-color: #dd9d3d;
	/*border-color: #333;*/
	/*border-color: #0b0b0b;*/
	/*border-width: 3px;*/
}

.content_main_home .ce-gallery img
{
	width: 100%;
	height: auto;
	box-sizing: border-box;
}

.content_main_home .ce-gallery .ce-row:nth-child(1)
{
	float: left;
}

.content_main_home .ce-gallery .ce-row:nth-child(2)
{
	float: right;
}

.content_main_home .ce-gallery .ce-row:nth-child(3)
{
	float: right;
	clear: right;
	position: absolute;
	right: 0px;
	bottom: 0px;
}

.content_main_home .ce-gallery .ce-row:nth-child(4)
{
	float: left;
	clear: left;
	position: absolute;
	left: 0px;
	bottom: 0px;
}

/* deactivate link/image visitenkarte on home; see also js */
.content_main_home .ce-gallery .ce-row:nth-child(5) a
{
	pointer-events: none;
	cursor: default;
	text-decoration: none;
	color: black;
	
  -webkit-touch-callout: none;
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
}


/*.content_main_home .ce-gallery .ce-inner
{
	height: 630px;
	display: grid;
	grid-template-columns: 31% auto 31%;
	grid-template-rows: auto auto auto;      middle row auto refers to 'height:' above 
	grid-template-rows: 10% auto 10%;
	grid-column-gap: 0px;
	grid-row-gap: 0px;
}

.content_main_home .ce-gallery .ce-row:nth-child(1)
{
	grid-column: 1;
	grid-row: 1 / 3;
}

.content_main_home .ce-gallery .ce-row:nth-child(2)
{
	grid-column: 1;
	grid-row: 3 / 4;
}

.content_main_home .ce-gallery .ce-row:nth-child(3)
{
	grid-column: 2;
	grid-row: 1 / 4;
}

.content_main_home .ce-gallery .ce-row:nth-child(4)
{
	grid-column: 3;
	grid-row: 1 / 2;
}

.content_main_home .ce-gallery .ce-row:nth-child(5)
{
	grid-column: 3;
	grid-row: 2 / 4;
}*/

/*.content_main_home .ce-gallery .ce-row,
.content_main_home .ce-gallery .ce-row .ce-column,
.content_main_home .ce-gallery .ce-row .ce-column figure,
.content_main_home .ce-gallery .ce-row .ce-column figure a
{
	display: block;
	position: relative;
	width : 100%;
	height: 100%;
	padding: 0px;
	margin: 0px;
}*/

/*.content_main_home .ce-gallery .ce-row .ce-column figure
{
	border: 1px solid black;
}*/

/*.content_main_home .ce-gallery .ce-row .ce-column figure img
{
	display: block;
	position: absolute;
	width : 96%;
	height: auto;
	
	left: 0; 
	right: 0;
	margin-left: auto;
	margin-right: auto; 
}

.content_main_home .ce-gallery .ce-row:nth-child(2) .ce-column figure img,
.content_main_home .ce-gallery .ce-row:nth-child(5) .ce-column figure img
{
	bottom: 1px;
}

.content_main_home .ce-gallery .ce-row:nth-child(1) .ce-column figure img,
.content_main_home .ce-gallery .ce-row:nth-child(2) .ce-column figure img
{
	left: 0px;
	right: auto;
}

.content_main_home .ce-gallery .ce-row:nth-child(4) .ce-column figure img,
.content_main_home .ce-gallery .ce-row:nth-child(5) .ce-column figure img
{
	left: auto;
	right: 0px;
}*/

/*.content_main_home .ce-gallery .ce-row:nth-child(3) .ce-column figure img
{
	width: auto;
	height: 98%;
}*/



/* images (non-gallery, werkstatt) */

.content_main_werkstatt .ce-gallery,
.content_main_werkstatt .ce-gallery .ce-row,
.content_main_werkstatt .ce-gallery .ce-row .ce-column,
.content_main_werkstatt .ce-gallery .ce-row .ce-column figure,
.content_main_werkstatt .ce-gallery .ce-row .ce-column figure a,
.content_main_werkstatt .ce-gallery .ce-row .ce-column figure a img
{
	/*margin: 0px !important;*/
	padding: 0px;
}

.content_main_werkstatt .ce-bodytext p
{
	margin-top: 0px;
	text-align: left;
}

.content_main:not(.content_main_gallery) .ce-gallery
{
	margin: 0px;
}

/* normal images left,right,left,right */
.content_main:not(.content_main_gallery):not(.content_main_home):not(.content_main_maerkte) .ce-gallery .ce-row:nth-child(odd)
{
	float: left;
	clear: both;
	margin-right: 10px;
}

.content_main:not(.content_main_gallery):not(.content_main_home):not(.content_main_maerkte) .ce-gallery .ce-row:nth-child(even)
{
	float: right;
	clear: both;
	margin-left: 10px;
}

.content_main:not(.content_main_gallery):not(.content_main_home):not(.content_main_maerkte) .ce-gallery .ce-row:nth-child(n+2)
{
	margin-top: 10px;
	/*position: relative;*/
	/*top: 80px;*/
}

/* .content_main.content_main_werkstatt .ce-gallery .ce-row:nth-child(n+4) */
/*.content_main:not(.content_main_gallery):not(.content_main_home):not(.content_main_maerkte) .ce-gallery .ce-row:nth-child(n+4)*/
/*{*/
	/*border: 2px solid red !important;*/
/*	float: none;
	clear: both;*/
/*}*/

/* hier */

/* .content_main.content_main_werkstatt div.frame:nth-child(n+2) .ce-gallery .ce-row */
.content_main:not(.content_main_gallery):not(.content_main_home):not(.content_main_maerkte) div.frame:nth-child(n+2) .ce-gallery .ce-row
{
	float: none;
	display: inline-block;
	margin: 18px;
}
.content_main:not(.content_main_gallery):not(.content_main_home):not(.content_main_maerkte) div.frame:nth-child(n+2) .ce-gallery .ce-row:nth-child(1)
{
	margin-left: 0px;
}
.content_main:not(.content_main_gallery):not(.content_main_home):not(.content_main_maerkte) div.frame:nth-child(n+2) .ce-gallery .ce-row:nth-child(3)
{
	margin-right: 0px;
}

.content_main.content_main_werkstatt div.frame:nth-child(n+2) .ce-gallery .ce-row img
{
	width: 250px;
	height: auto;
}

/* on maerkte all images right */
.content_main.content_main_maerkte .ce-gallery .ce-row
{
	float: right;
	clear: both;
	margin-left: 10px;
	margin-right: 0px;
}

.content_main:not(.content_main_gallery) .ce-gallery
{
	float: none;
	overflow: visible;
}




/* images (gallery) */

.content_main_gallery {
	text-align: center;
}

.content_main_gallery .ce-gallery {
	display: inline-block;
	width: 860px;               /* 4 images + buffer */
	margin: 0px;
	margin-left: 12px;          /* adjust for buffer */
	padding: 0px;
	text-align: left;
	/*height: 800px;*/
	/*border: 1px solid green;*/
}

.content_main_gallery .ce-gallery a {
/*    padding: 20px;
	text-decoration: none;*/
	/*display: block;*/
/*	width: 800px;
	height: 800px;*/
}

/*.content_main_gallery .ce-gallery img {
	width: 97%;
	height: auto;
}*/

.content_main_gallery .ce-gallery .ce-row,
.content_main_gallery .ce-gallery .ce-row .ce-column,
.content_main_gallery .ce-gallery .ce-row .ce-column figure,
.content_main_gallery .ce-gallery .ce-row .ce-column figure a,
.content_main_gallery .ce-gallery .ce-row .ce-column figure a img
{
	display: inline;
	margin: 0px;
	padding: 0px;
	float: none;
	/*border: 0px;*/
	/*border: 1px solid black;*/
}

.content_main_gallery .ce-gallery .ce-row {
	display: inline-block;
	width: 175px;
	height: 137px;
	padding: 10px;
	text-align: center;
	font-size: 0.7em;
	line-height: 1.1em;
	/*background-color: #dd9d3d;*/
	/*background-color: #d38f36;*/
	margin: 4px;
	/*border: 4px solid rgba(180, 130, 50, 0.05);*/
	border: 4px solid rgba(180, 130, 50, 0.1);
	/*background-color: rgba(180, 130, 50, 0.08);*/
	background-color: #dd9d3d;
	/*background-color: #c08834;*/
	
}

.content_main_gallery .ce-gallery .ce-row {
	transition: background 0.1s ease-in;
}

.content_main_gallery .ce-gallery .ce-row:hover {
	border: 4px solid rgba(200, 130, 50, 0.05);
	background-color: rgba(234, 174, 69, 0.4);
}

.content_main_gallery .ce-gallery .ce-row .ce-column {
	display: inline-block;
	/*width: inherit;*/
	/*height: inherit;*/
}

.content_main_gallery .ce-gallery .ce-row .ce-column figure {
	display: inline-block;
}

.content_main_gallery .ce-gallery .ce-row .ce-column figure a {
	text-align: center;
}

.content_main_gallery .ce-gallery .ce-row .ce-column figure a,
.content_main_gallery .ce-gallery .ce-row .ce-column figure figcaption {
	/*display: inline-block;*/
	display: block;
}

.content_main_uebermich .ce-gallery .ce-row .ce-column figure figcaption {
	display: block;
	font-size: 0.7em;
	text-align: center;
}

.content_main_gallery .ce-gallery .ce-row .ce-column figure a img {
	display: inline-block;
}

.content_main_gallery .ce-gallery .ce-row .ce-column figure figcaption {
	/* also see in main.js 'trim gallery image descriptions' */
	white-space: pre-line;
}

.content_main_gallery .ce-gallery .ce-row .ce-column figure a img {
	height: 100px;
	width: auto;
	border-width: 2px;
}



.mfp-bg {
	/*background: #bb8844;*/
	/*background: #996633;*/
	background: #000000;
	opacity: 0.6;
}

.mfp-bottom-bar .mfp-title {
	line-height: 1.2em;
	white-space: pre-line;
}

button.mfp-arrow:hover,
button.mfp-arrow:active,
button.mfp-arrow:focus {
	outline: 0;
}

/*.mfp-arrow-left::before  { border-right-color: #473323; }
.mfp-arrow-right::before { border-left-color:  #473323; }
.mfp-arrow-left::after   { border-right-color: #dd9d3d; }
.mfp-arrow-right::after  { border-left-color:  #dd9d3d; }*/

.mfp-arrow-left::before  { border-right-color: #616161; }
.mfp-arrow-right::before { border-left-color:  #616161; }
.mfp-arrow-left::after   { border-right-color: #bbbbbb; }
.mfp-arrow-right::after  { border-left-color:  #bbbbbb; }

/* playing with firefox border artefact; not consistent, zooming affects it too. seems to be affected by transform/scale on button. */
/*.mfp-arrow-right::after {
	height: 2px;
	width: 2px;
	border-left-style: solid;
	top: 0px;
}*/
.mfp-arrow {
	-webkit-transform: none;
	transform: none;
}

/*.mfp-arrow-right::after {
	border-left-width: 19px;
	border-top-width: 15px;
	border-bottom-width: 15px;
	top: 6px;
	margin-left: 38px;
}*/

/* magnific-popup close/x */

.mfp-image-holder .mfp-close,
.mfp-iframe-holder .mfp-close {
	/*position: relative;*/
	/*display: inline-block;*/
	/*float: right;*/
	/*background: #bb8844;*/
	width: auto;
	height: auto;
	/*height: 40px;*/
	padding: 4px 6px 0px 6px;
	/*margin: 10px;*/
	/*margin-top: -10px;*/
	line-height: 0.7em;
	font-size: 2em;
	/*bottom: 0px;*/
	/*border: 1px solid gray;*/
}



/* magnific-popup fade in/out */

/*.mfp-with-fade .mfp-content,
.mfp-with-fade .mfp-arrow, .mfp-with-fade.mfp-bg {
  opacity: 0;
  -webkit-backface-visibility: hidden;
  -webkit-transition: opacity 0.3s ease-out;
  -moz-transition: opacity 0.3s ease-out;
  -o-transition: opacity 0.3s ease-out;
  transition: opacity 0.3s ease-out;
}
.mfp-with-fade.mfp-ready .mfp-content,
.mfp-with-fade.mfp-ready .mfp-arrow {
  opacity: 1;
}
.mfp-with-fade.mfp-ready.mfp-bg {
  opacity: 0.8;
}
.mfp-with-fade.mfp-removing .mfp-content,
.mfp-with-fade.mfp-removing .mfp-arrow, .mfp-with-fade.mfp-removing.mfp-bg {
  opacity: 0;
}*/


/* overlay at start */
/*.mfp-with-fade.mfp-bg {
  opacity: 0;

  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
 overlay animate in 
.mfp-with-fade.mfp-bg.mfp-ready {
  opacity: 0.8;
}
 overlay animate out 
.mfp-with-fade.mfp-bg.mfp-removing {
  opacity: 0;
}

 content at start 
.mfp-with-fade.mfp-wrap .mfp-content {
  opacity: 0;

  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
 content animate it 
.mfp-with-fade.mfp-wrap.mfp-ready .mfp-content {
  opacity: 1;
}
 content animate out 
.mfp-with-fade.mfp-wrap.mfp-removing .mfp-content {
  opacity: 0;
}*/





/* =transition */

.mfp-ready .mfp-figure {
  opacity: 0;
}

.mfp-with-fade {
  /* start state */
  /* animate in */
  /* animate out */
}
.mfp-with-fade .mfp-figure, .mfp-with-fade .mfp-iframe-holder .mfp-iframe-scaler{
    opacity: 0;
    -webkit-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    -webkit-transform: scale(0.95);
    -ms-transform: scale(0.95);
    transform: scale(0.95);
}
.mfp-with-fade.mfp-bg,
.mfp-with-fade .mfp-preloader {
  opacity: 0;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
}
.mfp-with-fade.mfp-image-loaded .mfp-figure, .mfp-with-fade.mfp-ready .mfp-iframe-holder .mfp-iframe-scaler{
    opacity: 1;
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
}
.mfp-with-fade.mfp-ready.mfp-bg,
.mfp-with-fade.mfp-ready .mfp-preloader {
    opacity: 0.8;
}
.mfp-with-fade.mfp-removing .mfp-figure, .mfp-with-fade.mfp-removing .mfp-iframe-holder .mfp-iframe-scaler{
    -webkit-transform: scale(0.95);
    -ms-transform: scale(0.95);
    transform: scale(0.95);
    opacity: 0;
}
.mfp-with-fade.mfp-removing.mfp-bg,
.mfp-with-fade.mfp-removing .mfp-preloader {
    opacity: 0;
}
.mfp-iframe-scaler{ overflow: visible; /*so the close button is shown*/}
.mfp-zoom-out-cur { cursor: auto; }
.mfp-zoom-out-cur .mfp-image-holder .mfp-close { cursor: pointer; }








/* -------------------------------------------------------------------- */

/* CONTENT TOP/MAIN/BOTTOM */

.content_top,
.content_main,
.content_bottom
{
	display: block;
	max-width: 900px;
	margin: auto;
}

.content_bottom .shell
{
	text-align: center;
}

.content_bottom .shell img
{
	width: 30px;
	height: auto;
	margin: 30px;
	opacity: 0.2;
	vertical-align: bottom;
}

.content_bottom .links
{
	text-align: center;
	font-size: 12px;
	margin: 30px;
}
.content_bottom .links a
{
	/*float: right;*/
	margin: 2px;
}

/* -------------------------------------------------------------------- */

/* CONTENT TOP */

.content_top {
	position: relative; /* for abs pos of title and nav */
	z-index: 999; /* bring navi dropdown above ce-gallery, i.e. 'visiting card' image on page home */
}

.content_top_title {
	/*position: absolute;*/
	top: 0px;
	z-index: 999;
	
	display: block;
	width: 100%;
}

.content_top_banner {
	position: relative;
	display: block;
	width: 100%;
	/*height: 435px;*/
	height: fit-content;
}

.content_top_banner .banner1,
.content_top_banner .banner2,
.content_top_banner .banner3,
.content_top_banner .banner4
{
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: auto;
	opacity: 0.0;
}

.content_top_banner .banner1
{
	position: relative;
	opacity: 1.0;
}

.content_top_banner .banner1
{
	animation: banner1 16s infinite;
	-webkit-animation: banner1 16s infinite;
}

.content_top_banner .banner2
{
	animation: banner2 16s infinite;
	-webkit-animation: banner2 16s infinite;
}

.content_top_banner .banner3
{
	animation: banner3 16s infinite;
	-webkit-animation: banner3 16s infinite;
}

.content_top_banner .banner4
{
	animation: banner4 16s infinite;
	-webkit-animation: banner4 16s infinite;
}

@keyframes banner1 {
	  0% { opacity: 1.0; }
	 12% { opacity: 1.0; }
	 25% { opacity: 0.0; }
	 37% { opacity: 0.0; }
	 50% { opacity: 0.0; }
	 62% { opacity: 0.0; }
	 75% { opacity: 0.0; }
	 87% { opacity: 0.0; }
	100% { opacity: 1.0; }
}

@keyframes banner2 {
	  0% { opacity: 0.0; }
	 12% { opacity: 0.0; }
	 25% { opacity: 1.0; }
	 37% { opacity: 1.0; }
	 50% { opacity: 0.0; }
	 62% { opacity: 0.0; }
	 75% { opacity: 0.0; }
	 87% { opacity: 0.0; }
	100% { opacity: 0.0; }
}

@keyframes banner3 {
	  0% { opacity: 0.0; }
	 12% { opacity: 0.0; }
	 25% { opacity: 0.0; }
	 37% { opacity: 0.0; }
	 50% { opacity: 1.0; }
	 62% { opacity: 1.0; }
	 75% { opacity: 0.0; }
	 87% { opacity: 0.0; }
	100% { opacity: 0.0; }
}

@keyframes banner4 {
	  0% { opacity: 0.0; }
	 12% { opacity: 0.0; }
	 25% { opacity: 0.0; }
	 37% { opacity: 0.0; }
	 50% { opacity: 0.0; }
	 62% { opacity: 0.0; }
	 75% { opacity: 1.0; }
	 87% { opacity: 1.0; }
	100% { opacity: 0.0; }
}


.content_top_nav {
	/*position: absolute;*/
	bottom: 0px; /* align nav bottom with banner bottom */
	z-index: 999;
	
	display: block;
	width: 100%;
	height: 60px;
}

/* -------------------------------------------------------------------- */

/* COMMON */

.noBorderTopRadius {
	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
}






/* -------------------------------------------------------------------- */

/* NAVIGATION */

/* ------------------------------------ */

/* all levels */

.content_top_nav ul {
	display: block;
	list-style: none;
	margin: 0px;
	padding: 0px;
	display: block;
	background-color: rgba(247, 206, 94, 1.0);
}

.content_top_nav ul li.hasSubitems > a {
	pointer-events: none;
	cursor: default;
}

/* ------------------------------------ */

/* 1. level */

.content_top_nav > ul {
	float: left;
	width: 100%;
}


.content_top_nav > ul > li {
	display: block;
	float: left;
	width: 16.5%;
	text-align: center;
}

.content_top_nav > ul > li:nth-child(1) {
	width: 11.0%;
}

.content_top_nav > ul > li:nth-child(4) {
	width: 11.0%;
}

.content_top_nav > ul > li:nth-child(5) {
	width: 14.0%;
}

/* expand last nav item to available space/width */
.content_top_nav > ul > li:last-child {
	float: none;
	width: auto;
	overflow: hidden;
}

/* ------------------------------------ */

/* 2. level */

.content_top_nav > ul > li > ul {
	position: absolute;
	width: 16.5%;
	visibility: hidden;
	transition: opacity 0.2s ease-in, visibility 0.2s ease-in;
	opacity: 0;
}

.content_top_nav > ul > li:hover > ul {
	visibility: visible;
	opacity: 1;
}

.content_top_nav > ul > li > ul > li {
	position: relative;
	/*width: 147px;*/
	width: 100%;
	text-align: center;
	border-top: 1px solid rgba(257, 216, 104, 1);
}

/* ------------------------------------ */

/* 3. level */

.content_top_nav > ul > li > ul > li > ul {
	position: absolute;
	left: 100%;
	top: -1px;
	border-left: 1px solid rgba(257, 216, 104, 1);
	
	visibility: hidden;
	transition: opacity 0.2s ease-in, visibility 0.2s ease-in;
	opacity: 0;
}

.content_top_nav > ul > li > ul > li:hover > ul {
	visibility: visible;
	opacity: 1;
}

.content_top_nav > ul > li > ul > li > ul > li {
	text-align: left;
	border-top: 1px solid rgba(257, 216, 104, 1);
}

/* ------------------------------------ */

/* TITLE / NAV / NAVITEM */

.content_top_title .navItem { /* title */
	display: block;
    transition: all 0.2s ease-in;
	text-decoration: none;
	white-space: nowrap;
    font-size: 1.6em;
}

.content_top_nav .navItem { /* nav */
	display: block;
    transition: all 0.2s ease-in;
	text-decoration: none;
	white-space: nowrap;
    font-size: 1.1em;
	padding: 12px 0px;
}

.content_top_nav .homeLink {
	/*float: left;*/
	/*padding: 2px;*/
}

.content_top_title .navItem.active,
.content_top_nav .navItem.active
{
    background-color: rgba(255, 234, 150, 0.31);
}

.content_top_title .navItem.current,
.content_top_nav .navItem.current
{
	background-color: rgba(255, 234, 150, 0.41);
}

.content_top_title .navItem:hover,
.content_top_nav .navItem:hover
{
    transition: all 0.2s ease-in;
    background-color: rgba(235, 160, 41, 0.4);
    color: rgb(255, 239, 183); /* !important; */
}

.content_top_title .navItem .logo.logo_normal {
	transition: all 0.2s ease-in;
	opacity: 1;
}

.content_top_title .navItem .logo.logo_inverted {
	transition: all 0.2s ease-in;
	opacity: 0;
}

.content_top_title .navItem:hover .logo.logo_normal {
	transition: all 0.2s ease-in;
	opacity: 0;
}

.content_top_title .navItem:hover .logo.logo_inverted {
	transition: all 0.2s ease-in;
	opacity: 1;
}

.content_top_title {
	text-align: center;
	background-color: rgba(247, 206, 94, 1.0);
}

.content_top_title .navItem {
	padding: 4px;
}

.content_top_title .navItem .titleColumn {
	display: inline-block;
	vertical-align: middle;
	height: 80px;
}

.content_top_title .navItem .titleColumn:nth-child(1) {
	width: 200px;
	text-align: right;
	line-height: 2em;
}
.content_top_title .navItem .titleColumn:nth-child(2) {
	width: 84px;
	text-align: center;
	position: relative;
}
.content_top_title .navItem .titleColumn:nth-child(3) {
	width: 200px;
	text-align: left;
	letter-spacing: 0.03em;
	line-height: 2em;
}

.content_top_title .navItem .titleColumn .logo {
	position: absolute;
	left: 0px;
	top: 0px;
	height: 80px;
	width: auto;
}

/* ------------------------------------ */








/* -------------------------------------------------------------------- */

/* MEDIUM / TABLET SIZE (general) */
@media only screen and (min-width : 600px) and (max-width : 899px) {
	
	/* debug info */
	/*.content_main::before { content: "[max-width : 899px]"; }*/
	
	/* common */
	
	body, h1, h2, h3, h4 {
	    line-height: 1.5em;
		font-size: 1.0em;
	}
	
	h1, h2, h3, h4 {
	    line-height: 1.5em;
		font-size: 1.4em;
	}
	
	.content_main {
	    line-height: 1.4em;
		font-size: 1.4em;
	}
	
	/* main */
	
	/* scale images (gallery) proportionally on märkte ect., but not on actual gallery and not on home either */
	.content_main:not(.content_main_gallery):not(.content_main_home) .ce-gallery .ce-row {
		max-width: 40%;
		/*max-width: 30%;*/
	}
	
	/* hier */
	/* wertkstatt bottom images */
	.content_main:not(.content_main_gallery):not(.content_main_home).content_main_werkstatt div.frame:nth-child(n+2) .ce-gallery .ce-row:nth-child(1),
	.content_main:not(.content_main_gallery):not(.content_main_home).content_main_werkstatt div.frame:nth-child(n+2) .ce-gallery .ce-row:nth-child(2),
	.content_main:not(.content_main_gallery):not(.content_main_home).content_main_werkstatt div.frame:nth-child(n+2) .ce-gallery .ce-row:nth-child(3)
	{
		max-width: 29%;
		margin: 2%;
	}
	.content_main.content_main_werkstatt div.frame:nth-child(n+2) .ce-gallery .ce-row img
	{
		width: 99%;
		height: auto;
		box-sizing: border-box;
	}
	
	.content_main:not(.content_main_gallery):not(.content_main_home) .ce-gallery img {
		width: 95%;
		height: auto;
	}
	
	.content_main:not(.content_main_gallery):not(.content_main_home) div.frame:nth-child(n+2) {
		padding-top: 50px;
	}
	
	
	.content_main_gallery .ce-gallery {
		width: 660px;               /* 3 images + buffer */
		margin-left: 10px;          /* adjust for buffer */
		/*border: 1px solid green;*/
	}
	
	.content_main_gallery .ce-gallery .ce-row
	{
/*		font-size: 1.0em;
		line-height: 1.1em;*/
	}
	
	
	
	/* (home) */
/*	.content_main_home .ce-gallery .ce-inner {
		height: auto;
		height: 100%;
		grid-template-columns: 31% auto 31%;
		grid-template-rows: 40% auto auto;
	}	
	
	.content_main_home .ce-gallery .ce-row .ce-column figure img {
		width: 94%;
		position: relative;
	}
	
	.content_main_home .ce-gallery .ce-row:nth-child(3) .ce-column figure img {
		width: 90%;
		height: auto;
	}	
	
	.content_main_home .ce-gallery .ce-row:nth-child(4) .ce-column figure img {
		height: 50px;
		margin-bottom: 29px;
	}	*/
	
	
	
	/* title */
	
	.content_top_title .navItem .titleColumn .logo {
		height: 52px;
	}
	
	.content_top_title .navItem .titleColumn:nth-child(1) {
		width: 150px;
	}
	
	.content_top_title .navItem .titleColumn:nth-child(2) {
		width: 54px;
	}
	
	.content_top_title .navItem .titleColumn:nth-child(3) {
		width: 150px;
	}
	
	.content_top_title .navItem .titleColumn {
		height: 52px;
	}
	
	/* nav */
	
	.content_top_nav > ul > li {
		width: 16.6%;
	}
	
	.content_top_nav > ul > li > ul {
		width: 16.6%;
	}
	
	.content_top_nav > ul > li > ul > li {
		width: 100%;
		text-align: center;
	}
}

/* MEDIUM / TABLET SIZE (lower bound) */
@media only screen and (min-width : 600px) and (max-width : 699px) {
	
	/* still in tablet size, just changing gallery columns from 3 to 2 */
	
	.content_main_gallery .ce-gallery {
		width: 450px;               /* 2 images + buffer */
		margin-left: 17px;          /* adjust for buffer */
		/*border: 1px solid green;*/
	}
	
	.content_main.content_main_werkstatt div.frame:nth-child(n+2) .ce-gallery .ce-row img
	{
/*		width: 100px;
		height: auto;*/
	}
}

/* -------------------------------------------------------------------- */

/* SMALL / MOBILE SIZE (general) */
@media only screen and (min-width : 0px) and (max-width : 599px) {
	
	/* debug info */
	/*.content_main::before { content: "[max-width : 599px]"; }*/
	
	/* common */
	
	body, h1, h2, h3, h4 {
	    line-height: 1.5em;
		font-size: 0.8em;
	}
	
	h1, h2, h3, h4 {
		font-size: 1.4em;
	}
	
	.content_main {
	    line-height: 1.3em;
		font-size: 1.3em;
	}
	
	.content_main:not(.content_main_gallery):not(.content_main_home) .ce-gallery {
		display: block;
		float: none;
		margin: 0px !important;
	}
	
	/* hier */
	/* wertkstatt bottom images */
	.content_main:not(.content_main_gallery):not(.content_main_home).content_main_werkstatt div.frame:nth-child(n+2) .ce-gallery .ce-row:nth-child(1),
	.content_main:not(.content_main_gallery):not(.content_main_home).content_main_werkstatt div.frame:nth-child(n+2) .ce-gallery .ce-row:nth-child(2),
	.content_main:not(.content_main_gallery):not(.content_main_home).content_main_werkstatt div.frame:nth-child(n+2) .ce-gallery .ce-row:nth-child(3)
	{
		max-width: 29%;
		margin: 2%;
	}
	.content_main.content_main_werkstatt div.frame:nth-child(n+2) .ce-gallery .ce-row img
	{
		width: 99%;
		height: auto;
		box-sizing: border-box;
	}	
	
	/* scale images (gallery) proportionally on märkte ect., but not on actual gallery and not on home either */
	.content_main:not(.content_main_gallery):not(.content_main_home) .ce-gallery .ce-row {
		max-width: 40%;
	}
	
	.content_main:not(.content_main_gallery):not(.content_main_home) .ce-column,
	.content_main:not(.content_main_gallery):not(.content_main_home) .ce-column figure {
		display: inline-block;
		float: none;
		text-align: center;
		width: 100%;
	}
	
	.content_main:not(.content_main_gallery):not(.content_main_home) .ce-gallery img {
		max-width: 90%;
		height: auto;
		display: inline-block;
	}
	
	.content_main_uebermich .ce-gallery .ce-row .ce-column figure figcaption {
		line-height: 1.0em;
	}
	
	.content_main:not(.content_main_gallery):not(.content_main_home) .google_maps_iframe {
		max-width: 95%;
	}
	
	.content_main:not(.content_main_gallery):not(.content_main_home) .open_street_map_iframe {
		max-width: 95%;
	}
	
	
	.content_main_gallery .ce-gallery {
		width: 450px;               /* 2 images + buffer */
		margin-left: 17px;          /* adjust for buffer */
		/*border: 1px solid green;*/
	}
	
	.content_main_gallery .ce-gallery .ce-row,
	.content_main_gallery .ce-gallery .ce-row .ce-column,
	.content_main_gallery .ce-gallery .ce-row .ce-column figure,
	.content_main_gallery .ce-gallery .ce-row .ce-column figure a,
	.content_main_gallery .ce-gallery .ce-row .ce-column figure a img,
	.content_main_gallery .ce-gallery .ce-row .ce-column figure figcaption
	{
/*		width: 100%;
		height: auto;*/
	}
	
	.content_main_gallery .ce-gallery .ce-row
	{
		font-size: 1.0em;
		line-height: 1.1em;
	}
	
	
	
	
	/* (home) */
/*	.content_main_home .ce-gallery .ce-inner {
		height: auto;
		height: 100%;
		grid-template-columns: 32% auto 32%;
		grid-template-rows: 40% auto auto;
	}	
	
	.content_main_home .ce-gallery .ce-row .ce-column figure img {
		width: 86%;
		position: relative;
	}
	
	.content_main_home .ce-gallery .ce-row:nth-child(3) .ce-column figure img {
		width: 94%;
		height: auto;
	}	
	
	.content_main_home .ce-gallery .ce-row:nth-child(4) .ce-column figure img {
		height: 50px;
		margin-bottom: 20px;
	}	
	
	.content_main_home .ce-gallery .ce-row .ce-column figure img {
		border-width: 3px;
	}	*/
	
	
	
	.content_main:not(.content_main_gallery) .ce-gallery .ce-row .ce-column figure img {
		border-width: 3px;
	}	
	
	
	
	/* title */
	
	.content_top_title .navItem .titleColumn .logo {
		height: 42px;
	}
	
	.content_top_title .navItem .titleColumn:nth-child(1) {
		width: 100px;
	}
	
	.content_top_title .navItem .titleColumn:nth-child(2) {
		width: 42px;
	}
	
	.content_top_title .navItem .titleColumn:nth-child(3) {
		width: 100px;
	}
	
	.content_top_title .navItem .titleColumn {
		height: 42px;
	}
	
	/* nav */
	
	.content_top_nav::before {        /* Menü background bar (full width) */
		content: "Menü-BG";
		display: block;
		background-color: rgba(247, 206, 94, 1);
		
		padding: 12px 16px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		
		position: absolute;
		width: 100%;
		z-index: -99;
	}
	
	.content_top_nav > ul {
		width: 240px; /* menu width */
	}
	
	.content_top_nav > ul > li {
		width: 100% !important;
	}
	
	.content_top_nav > ul::before {   /* Menü bar (menu width) */
		content: "Menü";
		display: block;
		background-color: rgba(247, 206, 94, 1);
		padding: 12px 16px;
	}
	
	.content_top_nav > ul > li {       /* menu closed */
		/*transition: all 0.2s ease-in;*/
		display: none;
	}

	.content_top_nav > ul:hover li {   /* menu opened */
		/* display: block; */          /* (done in js, cause ios/iphone) */
	}
	
	.content_top_nav ul li.hasSubitems > a {
		opacity: 0.7;
	}
	
	.content_top_nav > ul,
	.content_top_nav > ul > li
	{
		float: none;
	}

	.content_top_nav > ul > li > ul,
	.content_top_nav > ul > li > ul > li > ul
	{
		display: block;
		position: relative;
		left: 0px;
		width: 100%;
		visibility: visible;
		opacity: 1;
	}
	
	.content_top_nav > ul > li,
	.content_top_nav > ul > li > ul > li,
	.content_top_nav > ul > li > ul > li > ul > li
	{
		text-align: left;
		border-top: 1px solid rgba(257, 216, 104, 1);
		width: 100%;
	}
	
	.content_top_nav .navItem {
		padding-left: 20px;
	}
	
	.content_top_nav > ul > li > ul > li > a.navItem
	{
		padding-left: 40px;
	}
	
	.content_top_nav > ul > li > ul > li > ul > li > a.navItem
	{
		padding-left: 70px;
	}
	
	.content_top_title .navItem:hover,
	.content_top_nav .navItem:hover
	{
		background-color: rgba(235, 160, 41, 0.4);
		color: rgb(255, 239, 183); /* !important; */
	}
	
	.content_top_title .navItem.active,
	.content_top_nav .navItem.active
	{
		background-color: inherit;
	}
	
}

/* SMALL / MOBILE SIZE (lower bound) */
@media only screen and (min-width : 0px) and (max-width : 499px) {
	
	.content_main_gallery .ce-gallery {
		width: auto;               /* 1 image + buffer */
		margin-left: 0px;          /* adjust for buffer */
		/*border: 1px solid orange;*/
	}
	
	.content_main_gallery .ce-gallery .ce-row {
		display: block;
		width: auto;
		height: auto;
	}
	
	.content_main_gallery .ce-gallery .ce-row .ce-column figure a img {
		width: 90%;
		height: auto;
		/*height: 200px;*/
		/*width: auto;*/
		border-width: 2px;
		/*float: left;*/
	}
	
	.mfp-arrow {
		/*-webkit-transform: scale(0.70);*/
		/*transform: scale(0.70);*/
	}
	
	/*.mfp-arrow-left::before { border-width: 21px 27px 21px medium;  top: 0px;  margin-left: 25px; }*/
	.mfp-arrow-left::before   { border-width: 19px 20px 19px medium;  top: 2px;  margin-left: 11px; }
	/*.mfp-arrow-left::after  { border-width: 13px 17px 13px medium;  top: 8px;  margin-left: 31px; }*/
	.mfp-arrow-left::after    { border-width: 12px 13px 12px medium;  top: 9px;  margin-left: 15px; }
	
	/*.mfp-arrow-right::before { border-width: 21px medium 21px 27px;  top: 0px;  margin-left: 35px; }*/
	.mfp-arrow-right::before   { border-width: 19px medium 19px 20px ; top: 2px;  margin-left: 25px; }
	/*.mfp-arrow-right::after  { border-width: 13px medium 13px 17px;  top: 8px;  margin-left: 39px; }*/
	.mfp-arrow-right::after    { border-width: 12px medium 12px 13px;  top: 9px; margin-left: 28px; }
	
	button.mfp-arrow { width: 60px; }

}

/* -------------------------------------------------------------------- */



