@charset "utf-8";
/* CSS Document */

:root {
  --ocker: rgba(212, 181, 7, 1);
  --darkbrown: rgba(100, 100, 100, 0.9);
  --steelblue: rgba(70, 130, 180, 1);
  --menu-speed: 0.75s;
}

/* Bildzentrierung für Einzelbildseiten */

#bild_zentriert {
  display: flex;
  align-items: center;
  justify-content: center;
	margin-top: 3rem;
	margin-bottom: 3rem;
	width: 100%;
	height: auto;
}


}

.card , .card-footer , .card-body {
  background-color: #e3e3e3;
}


#navbar {
	border-bottom: solid 3px #ccc;
}

a, p, span {
  font-family: 'Open Sans', sans-serif;
  font-size: 1rem;
}
h1 {
  font-family: 'Berkshire Swash', cursive;
  font-size: 2rem;
}
h4 {
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  font-size: 1.5rem;
  padding-top: 2rem;
  padding-bottom: 0.5rem;
}
h5 {
  font-family: 'Open Sans', sans-serif;
  font-weight: 700;
  font-size: 1.2rem;
  padding-top: 1rem;
  padding-bottom: 0.3rem;
}
#wappen {
  max-height: 60px;
}
#wappentext {
  font-family: 'Berkshire Swash', cursive;
  font-size: 2.5rem;
  padding-left: 1rem;
  vertical-align: sub;
	color: #777;
}
#randtext {
  font-size: 1rem;
  text-align: left;
}

@media screen and (min-width: 992px) {
	#randtext {
  	column-count: 2;
	}
}
@media screen and (max-width: 576px) {
  a, p {
    font-size: 0.8rem;
  }
  h1 {
    font-size: 1.7rem;
  }
  h4 {
    font-size: 1.2rem;
  }
  #randtext {
    font-size: 0.8rem;
  }

  #wappentext {
    font-family: 'Berkshire Swash', cursive;
    font-size: 1.7rem;
    padding-left: 0.8rem;
  }
}

footer {
	position: fixed;
	height: 60px;
	width: 100%;
	bottom: 0px;
	/* background-color: var(--ocker); */
	border-top: solid 3px #ccc;
}

.abstand_zum_footer {
	margin-bottom: 5rem;
	padding-top: 1rem;
}

.header-down-arrow {
	animation:  pulse 2s 3s ease-out 3;
	position: absolute;
	bottom: 3vh;
	left: 0;
	right: 0;
	text-align: center;
	z-index: 10;
}

.header-down-arrow img {
	animation: fade-slide-up 1s 1s ease-out forwards;
		opacity: 0;
}

.header-right-arrow {
	animation:  pulse 2s 3s ease-out 3;
	position: absolute;
	bottom: 45%;
	right: 10px;
	text-align: center;
	z-index: 10;
}

.header-right-arrow img {
	animation: fade-slide-right 1s 1s ease-out forwards;
		opacity: 0;
		height: 4vw;
}

.header-left-arrow {
	animation:  pulse 2s 3s ease-out 3;
	position: absolute;
	bottom: 45%;
	left: 10px;
	text-align: center;
	z-index: 10;
}

.header-left-arrow img {
	animation: fade-slide-left 1s 1s ease-out forwards;
		opacity: 0;
		height: 4vw;
}

.facebook-hint img {
	animation:  pulse 2s 1s ease-out 5;
	position: inherit;

	z-index: 10;
}

@keyframes fade-slide-up {
	0% {
	opacity: 0;
		transform: translateY(4rem);
	}

	100% {
	opacity: 1;
		transform: none;
	}
}

@keyframes fade-slide-right {
	0% {
	opacity: 0;
		transform: translateX(4rem);
	}

	100% {
	opacity: 1;
		transform: none;
	}
}

@keyframes fade-slide-left {
	0% {
	opacity: 0;
		transform: translateX(-4rem);
	}

	100% {
	opacity: 1;
		transform: none;
	}
}

@keyframes pulse {
	0% {
		opacity: 1;
		transform: none;
	}
	50% {
		opacity: .8;
		transform: scale(.8);
	}
	100% {
		opacity: 1;
		transform: none;
	}
}