@import url("typografie.css?v=1.7");


/*


fond_warmgrau.2- 80%_rgb 221/219/214

rgb 182/177/171

*/

html {
  font-family: 'Rokkitt', Arial, sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; 

 }
 
 
body {
 	margin:0;
 	xbackground: rgb(221,219,214);
 	background-color: #dddbd6;
}
 
img {
	width:100%;
	height:auto;	
}
 
 #mainpage {
	width:100%;	
	position: relative;
	margin-left:auto;
	margin-right:auto;
}


.titelname {
		
}

a {
	color:#fff;
	text-decoration:none;	
}




.bildmotiv-mitte {
	width:710px;
	float:left;
	height:auto;
	margin-left:auto;
	margin-right:auto;	
	background-color:#fff;
}

.main-inner {
	margin-left:auto;
	margin-right:auto;	
	max-width:2130px;
}

@media only screen and (max-width: 768px) {
	.main-inner {
		margin-left:20px;
		margin-right:20px;
	}
	
}


.main-center {
	width:710px;
	height:auto;
	float:left;
	height:100%;
}

.main-left {
	float:left;
	width:710px;
	text-align:center;
	height:100%;
}

.main-right {
	float:left;
	width:710px;
	height:100%;
	position:relative;
}

@media only screen and (max-width: 2240px) {
	.main-inner {
		max-width:2130px;
	}
	.main-center {
		width:28%;	
	}
	.main-left {
		width:36%;	
		
	}
	.main-right {
		width:36%;	
	}
}


@media only screen and (max-width: 1440px) {
	.main-inner {
		max-width:2130px;
	}
	.main-center {
		width:24%;	
		xbackground-color:red;
	}
	.main-left {
		width:37%;	
		xbackground-color:yellow;
		
	}
	.main-right {
		width:37%;	
		xbackground-color:blue;
	}
}


@media only screen and (max-width: 1024px) {

	.main-left {
		xpadding-left:20px;
		
	}
	
	.main-center {
		xheight:auto;
	}
	
	.main-right {
		xheight:auto;
		
	}
	
}


@media only screen and (max-width: 768px) {
	.main-inner {
		max-width:2130px;
	}
	.main-center {
		width:60%;	
		height:auto;
		margin-left:20%;
	}
	.main-left {
		width:100%;	
		height:80px;
		padding-top:20px;
		padding-left:0;
		
	}
	.main-right {
		width:100%;	
		height:auto;
		
	}
}


@media only screen and (max-width: 616px) {
	.main-left {
		width:100%;	
		height:80px;
		padding-top:20px;
		padding-left:20px;
		text-align:left;
	}
	
	
	.main-center {
		width:50%;	
		height:auto;
		margin-left:25%;
	}
	
	
	.page-uebermich .main-center {
		width:80%;
		margin-left:20px;
	}
	
	.page-datenschutz .main-center {
		width:80%;
		margin-left:20px;
	}
	
	.page-impressum .main-center {
		width:80%;
		margin-left:20px;
	}
	
	.page-kontakt .main-center {
		width:80%;
		margin-left:20px;
	}

	
	
}

	.main-inner.start {
		width:90%;
		margin-left:5%;	
	}
	.main-center.start {
		width:100%;	
		height:auto;
		margin-left:0;	

	}



@media only screen and (max-width: 616px) {
	.main-inner.start {
		width:90%;
		margin-left:5%;	
	}
	.main-center.start {
		width:100%;	
		height:auto;
		margin-left:0;	

	}
	
	.main-left.start {
		display:none;
	}
	.main-right.start {
		display:none;
	}
	
	.main-center.start .titelname-start {
		height:auto;
	}

}

@media only screen and (max-width: 1200px) {
	.navi-right {
		display:none;
	}
	
}


.inner-content.ist-top {
	margin-top:108px;	
}

.titel-left.titel-top{
	margin-top:108px;	
}

@media only screen and (max-width: 768px) {
	.titel-left.titel-top{
			margin-top:unset;	
	}
	
	.inner-content.ist-top {
		margin-top:unset;	
	}
}

.kunst-item {
	xborder:6px solid #fff;	
}

.kunst-item img {
	border:6px solid #fff;	
	width:calc(100% - 12px);
}

.kunst-slider .slick-item img {
	xborder:6x solid #fff;	
}

.kunst-titel-wrapper {
	text-align:left;
	position:relative;
}

.kunst-titel {
	left:13px;
	text-align:left;
	width:300px;
	width:180px;
	position:absolute;
}

@media only screen and (max-width: 616px) {
	.kunst-titel {
		width:280px;
	}
}

.navi-right {
	position:absolute;
	left:227px;
	left:190px;
	margin-top:88px;	
	xmargin-top:60px;	
}

@media only screen and (max-width: 1440px) {
	.navi-right {
		position:absolute;
		left:227px;
		left:210px;
		left:190px;
		margin-top:108px;	
		margin-top:60px;

	}
	
}


@media only screen and (max-width: 1200px) {
	.navi-right {
		left:20px;
	}
}

@media only screen and (max-width: 616px) {
	
}



.kunst-item a.galerie-image-link  {
	cursor: -moz-zoom-in; 
    cursor: -webkit-zoom-in; 
    cursor: zoom-in;
	/*icon_suche.png*/
}

@media only screen and (min-width: 1280px) {
.lb-closeContainer {
	position:absolute;
	right:40px;
	top:40px;	
}
}
.lb-closeContainer {

	margin-top:20px;	
}
.lb-data .lb-number {
  display: none !important;
  clear: left;
  padding-bottom: 1em;
  font-size: 0px;
  color: #999;
  height:20px;
}

.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  max-height: none;
  border-radius: 0 !important;
  border: 6px solid #fff !important;
}

.lb-nav a.lb-prev {

  filter: alpha(Opacity=1);
  opacity: 1 !important;
  display:block !important;

}
.lb-nav a.lb-next {

  filter: alpha(Opacity=1);
  opacity: 1 !important;
display:block !important;
}

img.img-portrait {
	width:50%;
	height:auto;	
	border:6px solid #fff;
}


@media only screen and (max-width: 616px) {
	img.img-portrait {
		width:calc(100% - 12px);
	}
}


.mob-burger  {
	position:absolute;
	right:20px;
	top:20px;
	width:35px;
	height:35px;
	display:none;	
	cursor:pointer;
	z-index:999999;
}

@media only screen and (max-width: 1200px) {
	.mob-burger  {
		display:block;	
	}
	
	.navi-stern {
		display:none;	
	}
}

/* neue */
.navi-stern {
		display:none;	
}


.mob-burger-close  {
	position:absolute;
	right:20px;
	top:20px;
	width:30px;
	height:30px;
	cursor:pointer;
	z-index:999999;
}

.mob-menu {
		
}


#mobile-menue {
  padding-top: 100px;
  padding-top: 60px;
  position: fixed;
  top: 0;
  bottom: 0px;
  left: 0px;
  width: 100%;
  background: #dddbd6;
  opacity: 0.3;
  visibility: hidden;
  transform: translate3d(-80%, 0px, 0px) scale(0.99);
  transition: all 250ms ease-out 0s;
  overflow-x: hidden;
  height: 100vH;
  height: 100%;
  z-index: 9999999999;
  display: none;
}

#mobile-menue.open {
  transform: translate3d(0px, 0px, 0px) scale(1);
  opacity: 1;
  visibility: visible;
}



.mobile-navigation-inner {
  height: 85%;
  z-index: 100000;
  margin-bottom: 20px;
  margin-left: 30px;
  overflow-y:scroll;
}


.page-dont-scroll {
  overflow: hidden !important;
}




/*lightbox */
/*

.lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 100000;
  font-weight: 400;
  xmargin-top:70px;
}

.lb-outerContainer {
  position: relative;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  border-radius: 4px;
  background-color: #fff;
  margin-top:50px;
}

.lb-closeContainer {
  position: absolute;
  right: 20px;
  top: 20px;
}
*/