html {
  /*     background-color: #2b230d; fast schwarz mit gold
         background-color: #827e74; fast grau mit gold           */
   
   
  font-family: sans-serif;
}

section {
  padding: 1px;
}



.lead {
  font-weight: 600;
  color: #777;
}

.gallery {
  display: flex;
  flex-wrap: wrap;
}



.willkommen
 {
 font-size: 1.5em;
 line-height: 1.1;
 text-align:center;
 color: white;
/* color: #cca43d;   gold  */
}

.willkommen_bold
 {
 font-weight:bold;
 font-style:italic;
 font-size:inherit;
 line-height:inherit;
}



.gallery-item {
  flex: 1 1 auto;
  flex-basis: 175px;
  margin: .5em;
  max-width: 530px;
  max-height: 300px;
  position: relative;
  cursor: pointer;
  overflow: hidden;
  border-radius: 18px;
  border: 0.2em solid #cca43d; /* gold  cca43d    */
}

.gallery-item.item-2x3 {
  flex-basis: calc(175px * 0.667); 
}
.gallery-item.item-3x4 {
  flex-basis: calc(175px * 0.75);
}
.gallery-item.item-1x1 {
  flex-basis: 175px;
  vertical-align:middle;
  width:100%;
  height:auto;
  
}
.gallery-item.item-4x3 {
  flex-basis: calc(175px * 1.333);
}
.gallery-item.item-3x2 {
  flex-basis: calc(175px * 1.5);
}
.gallery-item.item-8x5 {
  flex-basis: calc(175px * 1.6);
}
.gallery-item.item-2x1 {
  flex-basis: calc(175px * 2);
}
.gallery-item::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0;
  background-color: rgba(0, 0, 0, 0.4);
  background-image: url("data:image/svg+xml,%3Csvg width='36' height='36' viewBox='0 0 36 36' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4.5 13.75C4.5 8.64137 8.64137 4.5 13.75 4.5C18.8586 4.5 23 8.64137 23 13.75C23 18.8586 18.8586 23 13.75 23C8.64137 23 4.5 18.8586 4.5 13.75ZM13.75 0C6.15609 0 0 6.15609 0 13.75C0 21.3439 6.15609 27.5 13.75 27.5C16.3774 27.5 18.8327 26.7631 20.9205 25.4846L30.4906 35.0547C31.7509 36.3151 33.7944 36.3151 35.0547 35.0547C36.3151 33.7944 36.3151 31.7509 35.0547 30.4906L25.4846 20.9205C26.7631 18.8327 27.5 16.3774 27.5 13.75C27.5 6.15609 21.3439 0 13.75 0Z' fill='white'/%3E%3C/svg%3E");
  background-position: center;
  background-size: 1.85rem;
  background-repeat: no-repeat;
  transition: opacity 250ms;
  z-index: 10;
  border-radius: 0px;
}
.gallery-item .caption  {
  position: absolute;
  text-align: center;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 1em 0;
  line-height: 1em;
  color: #fff;
  background-color: rgba(204, 164, 61, 0.6);     /*  gold mit transparenz von 60%    */
  /*   background-color: rgba(0, 0, 0, 0.6);  */
  transform: translateY(4em);
  transition: transform 250ms;
  z-index: 20;
}
.gallery-item .caption span {
  display: inline-block;
  max-width: calc(100% - 2em);
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}
.gallery-item:hover .thumb {
  transform: scale(1.05); /*  1.05        */
}
@media (hover: hover) {
  .gallery-item:hover::after {
    opacity: 1;
  }
  .gallery-item:hover .caption {
    transform: translateY(1);
  }
  
}
.gallery-item .thumb  {
  display: inline-block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  min-height: unset;
  text-align: center;
  background-color: #333;
  transition: filter 500ms, transform 500ms;
}
.ie-fix .gallery-item .thumb {
  width: auto;
}
.gallery-item .placeholder {
  filter: blur(20px);/* 20px */
}

.lightbox-wrapper {
  display: none;
  background-color: #2e2e35;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 9999;
}

.lightbox {
  display: flex;
  flex-direction: column;
  height: 100%;
  color: white;
}
.lightbox .lightbox-header {
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.3);
  padding: 1em;
  font-weight: 600;
  text-align: center;
}
.lightbox .lightbox-header > * {
  opacity: .75;
}
.lightbox .lightbox-close {
  position: relative;
  height: 1.85rem;
  width: 1.85rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
  padding: 0;
  border: none;
}
.lightbox .lightbox-close::before, .lightbox .lightbox-close::after {
  position: absolute;
  content: "";
  height: 4px;
  width: 80%;
  background-color: #fff;
}
.lightbox .lightbox-close::before {
  transform: rotate(-45deg);
}
.lightbox .lightbox-close::after {
  transform: rotate(45deg);
}
.lightbox .lightbox-close:hover {
  opacity: 1;
}
.lightbox .lightbox-slides-wrapper {
  flex-grow: 1;
  display: flex;
  overflow: hidden;
  position: relative;
}
.lightbox .lightbox-arrow {
  position: absolute;
  top: 50%;
  width: 4rem;
  height: 4rem;
  padding: .5rem;
  background-repeat: no-repeat;
  background-position: center;
  background-size: 1.5em;
  opacity: .75;
  cursor: pointer;
  filter: drop-shadow(0 0 7px #000);
}
.lightbox .lightbox-arrow:hover {
  opacity: 1;
}
.lightbox .lightbox-arrow.arrow-left {
  left: 0;
  background-image: url("data:image/svg+xml,%3Csvg width='32' height='53' viewBox='0 0 32 53' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 26.5L27.3171 0L32 4.54286L9.36585 26.5L32 48.4571L27.3171 53L0 26.5Z' fill='white'/%3E%3C/svg%3E");
}
.lightbox .lightbox-arrow.arrow-right {
  right: 0;
  background-image: url("data:image/svg+xml,%3Csvg width='32' height='53' viewBox='0 0 32 53' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M32 26.5L4.68293 53L0 48.4571L22.6341 26.5L3.83911e-06 4.54286L4.68293 0L32 26.5Z' fill='white'/%3E%3C/svg%3E");
}
.lightbox .lightbox-slide {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-grow: 1;
  transition: all 0ms ease;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
.lightbox .lightbox-slide[data-state="prev"] {
  transform: translateX(-100%);
  opacity: 0;
}
.lightbox .lightbox-slide[data-state="next"] {
  transform: translateX(100%);
  opacity: 0;
}
.lightbox .lightbox-image {
  display: none;
  max-width: 100%;
  max-height: 100%;
  border-radius: 0px;
}
.lightbox .spinner {
  display: none;
}

img.img_border_radius {
  border-radius:18px;
}




.about_box {
            display: flex;
            justify-content: center;
            text-align:center;
            font-size: 1.5em;
            line-height:1.2;
            /* color: #cca43d;  gold */
            color: white;
          }
  
    
/* ******************************************************
	Thank you so much to codeconvey. This CSS is so beautiful !  I love it !!
    Author URI: https://codeconvey.com/
	font-family: "Raleway",sans-serif;
*********************************************************/

@import url('https://fonts.googleapis.com/css?family=Raleway:400,500,600,700,800,900');



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

article, header, section, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
    display: block;
}
body {
    background:#e0e7f0 none repeat scroll 0 0;
    color: #222;
    font-size: 100%;
    line-height: 24px;
    margin: 0;
	padding:0;
	font-family: "Raleway",sans-serif;
    
    
}
a{
	font-family: "Raleway",sans-serif;
	text-decoration: none;
	outline: none;
}
a:hover, a:focus {
	color: blue; text-decoration: underline;           /*#373e18;*/
}

.footer_sprache_aktiv {
	color: blue; text-decoration: underline;           /*#373e18;*/
}

.footer_sprache_aktiv:visited {
	color: blue; text-decoration: underline;           /*#373e18;*/
}






section {
    float: left;
    width: 100%;
	padding-bottom:0.5em;
}
h2 {
    color: #1a0e0e;
    font-size: 26px;
    font-weight: 700;
    margin: 0;
    line-height: normal;
	text-transform:uppercase;
}
h2 span {
    display: block;
    padding: 0;
    font-size: 18px;
    opacity: 0.7;
    margin-top: 5px;
	text-transform:uppercase;
}

#float-right{
	float:right;	
}

/* ******************************************************
	Script Top
*********************************************************/

.ScriptTop {
    background: #cca43d none repeat scroll 0 0;    /*    gold    cca43d        */ 
    float: left;
    font-size: 0.69em;
    font-weight: 600;
    line-height: 2.2;
    padding: 12px 0;
    text-transform: uppercase;
    width: 100%;
    }

/* To Navigation Style 1*/
.ScriptTop ul {
    margin: 24px 0;
    padding: 0;
    text-align: left;
}
.ScriptTop li{
	list-style:none;	
	display:inline-block;
}
.ScriptTop li a {
    background: none repeat scroll 0 0;          /*     #6a4aed       */
    color: #fff;
    display: inline-block;
    font-size: 14px;
    font-weight: 600;
    padding: 3px 10px;
    text-decoration: none;
    text-transform: capitalize;
    border-radius: 10px;
    margin: 0 3px;
    
}
.ScriptTop li a:hover{
	background:rgba(0, 0, 0, 0.6);
	color:#fff;
    
}

.ScriptTop li a.aktiv{
	background:rgba(0, 0, 0, 0.6);
	color:#fff;
    
}

.ScriptTop li a.kein-h:hover{

background-color: inherit;
    
}

.footer {

background-color: #cca43d; /*  cca43d   gold */
float: right;
width:100%;
height: 45px;
padding-top: 10px;
padding-bottom:10px;
padding-left:10px;
padding-right:10px;
text-align:center;
color: white;
    
}


/* ******************************************************
	Script Header
*********************************************************/

.ScriptHeader {
    float: left;
    width: 100%;
    padding: 1em 0em 0em 0em;
    
    background: #cca43d;
}
.rt-heading {
    margin: 0 auto;
    margin-bottom:12px;
	text-align:center;
    color:#282782; 
    background:#e6bc55; /* hell gold */
    
    padding: 5px;
    border-radius:18px;
    
}
.Scriptcontent{
	line-height:28px;	
    padding:2px;
    margin:2px;
}
.ScriptHeader h1{
	font-family: "brandon-grotesque", "Brandon Grotesque", "Source Sans Pro", "Segoe UI", Frutiger, "Frutiger Linotype", "Dejavu Sans", "Helvetica Neue", Arial, sans-serif;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
    color:#6a4aed;   /* violet dunkel gold  282782 --  hell violet    6a4aed     */
    font-size: 1.5em;
    font-weight: 700;
    margin: 0;
    line-height: normal;

}
.ScriptHeader h2 {
    color: #312c8f;
    font-size: 20px;
    font-weight: 400;
    margin: 5px 0 0;
    line-height: normal;

}
.ScriptHeader h1 span {
    display: block;
    padding: 0;
    font-size: 22px;
    opacity: 0.7;
    margin-top: 5px;

}
.ScriptHeader span {
    display: block;
    padding: 0;
    font-size: 22px;
    opacity: 0.7;
    margin-top: 5px;
}




/* ******************************************************
	Live Demo
*********************************************************/





/* ******************************************************
	Responsive Grids
*********************************************************/

.rt-container {
	margin: 0 auto;
	padding-left:12px;
	padding-right:12px;
    vertical-align:middle;
    
}
.rt-row:before, .rt-row:after {
  display: table;
  line-height: 0;
  content: "";
}

.rt-row:after {
  clear: both;
}
[class^="col-rt-"] {
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  padding: 0 15px;
  min-height: 1px;
  position: relative;
  
}


@media (min-width: 768px) {
  .rt-container {
    width: 750px;
  }
  [class^="col-rt-"] {
    float: left;
    width: 49.9999999999%;
  }
  .col-rt-6, .col-rt-12 {
    width: 100%;
    vertical-align:middle;
    text-align:center;
    padding: 2px;
    marging: 2px;
    
    
  }
  
}

@media (min-width: 1200px) {
	.rt-container {
		width: 1170px;
	}
	.col-rt-1 {
		width:16.6%;
	}
	.col-rt-2 {
		width:60.33%;
	}
	.col-rt-3 {
		width:50%;
	}
	.col-rt-4 {
		width: 67.664%;
	}
	.col-rt-5 {
		width: 83.33%;
	}
	

}

@media only screen and (min-width:240px) and (max-width: 768px){
	 .ScriptTop h1, .ScriptTop ul {
		text-align: center;
	}
	.ScriptTop h1{
		margin-top:0;
		margin-bottom:15px;
	}
	.ScriptTop ul{
		 margin-top:12px;
         margin-bottom: 15px;		
	}
	
	.ScriptHeader h1,
	.ScriptHeader h2, 
	.scriptnav ul{
		text-align:center;	
	}
	.scriptnav ul{
		 margin-top:12px;		
	}
	#float-right{
		float:none;	
	}
	
}

.pano_mittig {
 
             max-width:1000px;
             /*    background: blue;   */
             /*     padding:10px;  */
             border-radius:18px; 
             border: solid 0.2em;
             border-color: #cca43d;   /*  gold  */
         

 }
 
 body {
 
             background:#cca43d;   /*  gold  */
         

 }



