/***** Background *****/

.bg-dunkelgrau {background-color: #333333; }
.bg-mittelgrau {background-color: #555454; }
.bg-hellgrau {background-color: #B7B3A7; }
.bg-hellgrau2 {background-color: #B3B1B2; }
.bg-lila {background-color: #4c4650; }
.bg-flieder {background-color: #8E8493; }
.bg-schrift {background-color: #ababab}



/***** Font *****/

.schrift1 {font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif"}
.schrift2 {font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif"}
.schrift3 {font-family: Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif"}

.schrift4 {font-family: baumans, "baumans"}

.h11 { 
   font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
   font-size: 1,3rem;
	font-weight: lighter;
	color: #B3B1B2}

.h11-light { 
   font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
   font-size: 1,3rem;
	font-weight: light;
	color: #B3B1B2}

.h15 { 
   	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
   	font-size: 3.3rem;
	font-weight: lighter;
	color: #B3B1B2}

.Navi {
	font-size: 1rem;
	font-weight: lighter;
	color: #8E8493}


.gross-2 {font-size: 0.6rem}
.gross-1 {font-size: 0.8rem}
.gross0 {font-size: 1rem}
.gross05 {font-size: 1.1rem}
.gross1 {font-size: 1.25rem}
.gross2 {font-size: 1.4rem}
.gross3 {font-size: 1.6rem}
.gross4 {font-size: 1.8rem}
.gross5 {font-size: 2rem}



.flieder {color: #8E8493}
.hellgrau2 {color: #B3B1B2}
.dunkelgrau {color: #333333}
.dunkelrot {color:#660834}


.Zeilenabstand {line-height: 120%}
.Zeilenabstand60 {line-height: 60%}
.Zeilenabstand80 {line-height: 80%}
.Zeilenabstand100 {line-height: 100%}
.Zeilenabstand110 {line-height: 110%}
.Zeilenabstand115 {line-height: 115%}
.Zeilenabstand120 {line-height: 120%}
.Zeilenabstand130 {line-height: 130%}
.Zeilenabstand140 {line-height: 140%}



/***** Typografie *****/

.section-padding {padding-top: 50px; padding-bottom: 50px;}
.section-padding2 {padding-top: 2px; padding-bottom: 2px;}
.section-padding3 {padding-top: 3px; padding-bottom: 3px;}
.section-padding5 {padding-top: 5px; padding-bottom: 5px;}
.section-padding10 {padding-top: 10px; padding-bottom: 10px;}
.section-padding20 {padding-top: 20px; padding-bottom: 20px;}
.section-padding30 {padding-top: 30px; padding-bottom: 30px;}
.section-paddingBB {padding-top: 65px; padding-bottom: 5px;}
.section-paddingL {padding-left: 60px;}
.section-paddingL40 {padding-left: 40px;}
.section-paddingL10 {padding-left: 10px;}
.section-paddingR {padding-right: 60px;}
.section-paddingR10 {padding-right: 10px;}
.section-paddingR30 {padding-right: 30px;}
.section-paddingLR20 {padding-left: 20px; padding-right: 20px;}
.section-paddingLR40 {padding-left: 40px; padding-right: 40px;}
.section-paddingLR60 {padding-left: 60px; padding-right: 60px;}
.section-paddingB20 {padding-bottom: 20px}
.section-paddingB40 {padding-bottom: 40px}
.section-paddingB60 {padding-bottom: 60px}
.section-paddingB80 {padding-bottom: 80px}
.section-paddingT20 {padding-top: 20px}
.section-paddingT40 {padding-top: 40px}
.section-paddingT60 {padding-top: 60px}
.section-paddingT80 {padding-top: 80px}
.section-paddingT100 {padding-top: 100px}
.section-paddingT110 {padding-top: 110px}
.section-paddingT120 {padding-top: 120px}


.margin-top100  {marin-top: 100px}
.margin-top50  {marin-top: 50px}
.margin-top25  {marin-top: 25px}
.margin-top10  {marin-top: 10px}
.margin-bottom10  {marin-bot: 10px}
.margin-bottom25  {marin-bot: 25px}
.margin-bottom50  {marin-bot: 50px}





section .title {	margin-bottom: 30px;
				 	font-size: 2.75rem;
					font-weight: lighter;
					color: #b3b1b2;
					text-align: center;
}


/***** box *****/

	.box 	{position: relative;
			margin-left: auto;
			margin-right: auto;
			padding: 15px;
			margin-top: 10px;
			transition:all .3s ease;
}

.box .title {padding-bottom: 10px;
			border-bottom: 1px solid #8e8493;
			font-size: 2rem;
}

.box:hover {
			-webkit-box-shadow: 0px 2px 5px 0px rgba(179,177,178,1.16);
			-moz-box-shadow: 0px 2px 5px 0px rgba(179,177,178,1.16);
			box-shadow: 0px 2px 5px 0px rgba(179,177,178,1.16);
			margin-top: 5px;
			margin-bottom: 5px;  
}




/***** Navbox *****/

	.navbox {position: relative;
			margin-left: auto;
			margin-right: auto;
			padding: 6px;
			margin-top: 4px;
			transition:all .3s ease;
}
.navbox .title {padding-bottom: 10px;
			border-bottom: 1px solid #8e8493;
			font-size: 2rem;
}



.navbox:hover {
			-webkit-box-shadow: 0px 2px 5px 0px rgba(179,177,178,1.16);
			-moz-box-shadow: 0px 2px 5px 0px rgba(179,177,178,1.16);
			box-shadow: 0px 2px 5px 0px rgba(179,177,178,1.16);
			margin-top: 5px;
			margin-bottom: 5px;

} 

/***** Navboxunten *****/

	.navboxunten {position:relative;
			margin-left: auto;
			margin-right: auto;
			padding: 6px;
			margin-top: 4px;
			transition:all .3s ease;
}
.navboxunten .title {padding-bottom: 10px;
			border-bottom: 1px solid #8e8493;
			font-size: 2rem;
}



.navboxunten:hover {
			-webkit-box-shadow: 0px 2px 5px 0px rgba(179,177,178,1.16);
			-moz-box-shadow: 0px 2px 5px 0px rgba(179,177,178,1.16);
			box-shadow: 0px 2px 5px 0px rgba(179,177,178,1.16);
			margin-top: 5px;
			margin-bottom: 5px;

} 





.form-control {
			background-image: linear-gradient(#00a9ff, #00a9fc), linear-gradient(rgb(210, 210, 210),rgb(211, 211, 211));
			background-size: 0 2px, 100% 1px;
			background-color: transparent;
			float: none;
			font-weight: 400;
			border-width: 0px;
			border-style: initial;
			border-color: initial;
			border-image: initial;
			background-repeat: no-repeat;
			background-position: left bottom, center calc(100% - 1px);
			transition: background 0.3s ease-out;
			border-radius: 0;
			font-size: 14px;
			line-height: 1.42;
			padding: 7px 0;		
}

.form-control:focus {
			background-image: linear-gradient(#00a9ff, #00a9fc), linear-gradient(rgb(210, 210, 210),rgb(211, 211, 211));
			background-size: 100% 2px, 100% 1px;
			background-color: transparent;
			box-shadow: none;
}
	
.textarea {
			color: crimson
				
				
}	


.img-thumbnail {
  padding: 0.25rem;
  background-color: #333333;
  border: 1px solid #4c4650;
  border-radius: 0.25rem;
  max-width: 110%;
  height: auto;
}



.modal-open {
  overflow: hidden;
}

.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
}

.modal {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1050;
  display: none;
  width: 100%;
  height: 100%;
  overflow: hidden;
  outline: 0;
}

.modal-dialog {
  position: relative;
  width: auto;
  margin: 0.5rem;
  pointer-events: none;
}

.modal.fade .modal-dialog {
  transition: -webkit-transform 0.3s ease-out;
  transition: transform 0.3s ease-out;
  transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
  -webkit-transform: translate(0, -50px);
          transform: translate(0, -50px);
}

@media (prefers-reduced-motion: reduce) {
  .modal.fade .modal-dialog {
    transition: none;
  }
}

.modal.show .modal-dialog {
  -webkit-transform: none;
          transform: none;
}

.modal.modal-static .modal-dialog {
  -webkit-transform: scale(1.02);
          transform: scale(1.02);
}

.modal-dialog-scrollable {
  display: -ms-flexbox;
  display: flex;
  max-height: calc(100% - 1rem);
}

.modal-dialog-scrollable .modal-content {
  max-height: calc(100vh - 1rem);
  overflow: hidden;
}

.modal-dialog-scrollable .modal-header,
.modal-dialog-scrollable .modal-footer {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}

.modal-dialog-scrollable .modal-body {
  overflow-y: auto;
}

.modal-dialog-centered {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  min-height: calc(100% - 1rem);
}

.modal-dialog-centered::before {
  display: block;
  height: calc(100vh - 1rem);
  content: "";
}

.modal-dialog-centered.modal-dialog-scrollable {
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-pack: center;
      justify-content: center;
  height: 100%;
}

.modal-dialog-centered.modal-dialog-scrollable .modal-content {
  max-height: none;
}

.modal-dialog-centered.modal-dialog-scrollable::before {
  content: none;
}

.modal-content {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  width: 100%;
  pointer-events: auto;
  background-color: #4c4650;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 0.3rem;
  outline: 0;
}

.modal-backdrop {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1040;
  width: 100vw;
  height: 100vh;
  background-color: #000;
}

.modal-backdrop.fade {
  opacity: 0;
}

.modal-backdrop.show {
  opacity: 0.5;
}

.modal-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: start;
      align-items: flex-start;
  -ms-flex-pack: justify;
      justify-content: space-between;
  padding: 1rem 1rem;
  border-bottom: 1px solid #4c4650;
		opacity: 0.5;
  border-top-left-radius: calc(0.3rem - 1px);
  border-top-right-radius: calc(0.3rem - 1px);
}

.modal-header .close {
  padding: 1rem 1rem;
  margin: -1rem -1rem -1rem auto;
}

.modal-title {
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
   font-size: 2,0rem;
	font-weight: lighter;
	color: #B3B1B2;	
  margin-bottom: 0;
  line-height: 1.5;
}

.modal-body {
  position: relative;
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  padding: 1rem;
}

.modal-footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: end;
      justify-content: flex-end;
  padding: 0.75rem;
  border-top: 1px solid #4c4650;

  border-bottom-right-radius: calc(0.3rem - 1px);
  border-bottom-left-radius: calc(0.3rem - 1px);
}

.modal-footer > * {
  margin: 0.1rem;
}

.modal-scrollbar-measure {
  position: absolute;
  top: -9999px;
  width: 50px;
  height: 50px;
  overflow: scroll;
}

@media (min-width: 576px) {
  .modal-dialog {
    max-width: 500px;
    margin: 1.75rem auto;
  }
  .modal-dialog-scrollable {
    max-height: calc(100% - 3.5rem);
  }
  .modal-dialog-scrollable .modal-content {
    max-height: calc(100vh - 3.5rem);
  }
  .modal-dialog-centered {
    min-height: calc(100% - 3.5rem);
  }
  .modal-dialog-centered::before {
    height: calc(100vh - 3.5rem);
  }
  .modal-sm {
    max-width: 300px;
  }
}

@media (min-width: 992px) {
  .modal-lg,
  .modal-xl {
    max-width: 800px;
  }
}

@media (min-width: 1200px) {
  .modal-xl {
    max-width: 1140px;
	  
  }
	
	
@media (min-width: 1200px) {
   .modal-xlg {
      width: 90%; 
   }
}
  }



      .jumbotron {
        text-align: center;
        padding: 20px;
        margin: 10px 0;
      }

      .gallery {
        padding: 40px;
      }

      .gallery img {
        width: 100%;
        border-radius: 0;
        position: relative;
      }


.unterstrich {
  text-decoration: underline 1px;
}






#diashow-wrapper{
   width: 100%;
   position:relative;
}

#diashow{
   position: relative;
}
   
.food-style{
   width: 100%;
  height: 100;
border:0.3px solid #555454;

}
.food{
    position: relative;
     z-index: 1;
}
#ds-description {
	font-size: 28px;
	font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";  	
	font-weight: lighter;
    opacity: 0;
	color: coral;
    left: 100px;
    position: absolute;
	text-shadow: 1px 1px 1px #333333;
    z-index: 3;
	
	
}
#arrow-wrapper > * {
    margin: 10px;
    color: rgba(0, 0, 0, 0.6);
    z-index: 5;
}
#arrow-wrapper{
   width: 100%;
	z-index: 5;
}

#arrow-right {
    width: 15px;
    height: 15px;
    border-right: 2px solid;
    border-bottom: 2px solid;
    transform: rotate(-45deg);
    float: right;
	color: #B7B3A7;
	z-index: 5;
	 
	
}
#arrow-left {
    width: 15px;
    height: 15px;
    border-left: 2px solid;
    border-bottom: 2px solid;
    transform: rotate(45deg);
    float: left;
	color: #B7B3A7;
	z-index: 5;
	 
}

#go-forward{
    float:right;
}

@keyframes anim{
    from{
        top:-20px; 
        left: -20px; 
        opacity: 0;
        filter:blur(20px);
    }
    to{top:0px; left:0px; opacity: 1;}
}
@keyframes opposite{
    from{ left: 40px; opacity: 0;}
    to{left: 0px; opacity: 1;}
}


.vertical-center {
  margin: 0;
  position: absolute;
  top: 50%;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}