html {
	position: relative;
	min-height: 100%;
}

body {
    font-family: 'Arimo', sans-serif;
    line-height: 1.2;
	/* Padding top for navbar */
	padding-top: 26px;
	/* Margin bottom for footer height */
	margin-bottom: 30px;
    background: linear-gradient(rgba(15, 23, 43, .5), rgba(15, 23, 43, .1)), url(http://www.erlebnisgarten-augsburg.de/bl-themes/alternative/img/bg-hero.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;	color: #fff;
}



/* dm-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Arimo';
  font-style: normal;
  font-weight: 400;
  src: url('../../../webfonts/arimo-v35-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

.text-box {
  border: 2px solid #333; /* 2px dick, durchgezogen, dunkelgrau */
  padding: 18px;          /* 10px Abstand innen */
  margin: 20px;           /* Optional: 20px Abstand außen */
  background-color: #1e2212 !important; /* Optional: Hintergrundfarbe */
  border-radius: 10px;
}

.neue-klasse {
  border: 0px solid #333; /* 2px dick, durchgezogen, dunkelgrau */
  padding: 18px;          /* 10px Abstand innen */
  margin: 2px;           /* Optional: 20px Abstand außen */
  background: linear-gradient(rgba(15, 23, 43, .5), rgba(15, 23, 43, .1)), url(http://www.erlebnisgarten-augsburg.de/bl-themes/alternative/img/bg-hero.jpg);
  border-radius: 0px;
}

section {
	padding: 70px 0;
    background: linear-gradient(rgba(15, 23, 43, .1), rgba(15, 23, 43, .1));
    font-family: 'Arimo';
    color: #fff;
    font-weight: 100;
    line-height: 1.2;	display: list-item;
	list-style-type:none;  
}
a {
  color: yellow;
}
a:hover{text-decoration: none;color: red;}

img {
	max-width: 100%;
}

pre,
code {
	background: #f8f8f8;
	color: #333;
}

pre {
	border-left: 2px solid #ccc;
	padding: 10px;
}

code {
	display: inline-block;
	padding: 0 0.5em;
	line-height: 1.4em;
	border-radius: 3px;
}

div.tablecontainer {
  overflow-x: auto;
}

table {
  border-collapse: collapse;
  width: 100%;
}

table, th, td {
   padding: 8px;
   text-align: left;
}

thead {
	background-color: #e0e0e0;	
    margin-bottom: 1rem;
	color: #333;
	text-align: left;
	vertical-align: bottom;
}

tr {
	display: table-row;
	vertical-align: inherit;
	border-color: inherit;
}

th,
td {
	padding: 0.5em 1em;
}

h1.title,
{
    font-family: 'Arimo';
	font-size: 2.3rem;	color: #FEA116;
    font-weight: 900;
    line-height: 1.2;

}
h2.title {
    font-family: 'Arial';
	font-size: 2.3rem;	color: #e2bf25;
    font-weight: 900;
    line-height: 1.2;
}
h2 {
  color:transparent; // text shadow does all the work
  position:absolute;
  opacity:0;
  margin-top:-.5em;
  margin-left:-.5em;
  animation: cinematicInOut 20s ease-in-out 1s;
}
h2:nth-child(2) {
  animation-delay:12s;
}
h2:nth-child(3) {
  animation-delay:17s;
}

h5 {
  text-align: center;	
  color: #fff;
}





@keyframes cinematicInOut {
  0% {
    text-shadow:0 0 1em white;
    opacity:0;
    margin-left:-.5em;
  }
  25% {
    text-shadow:0 0 0 white;
    opacity:1;
    margin-left:0;
  }
  75% {
    text-shadow:0 0 0 white;
    opacity:1;
    margin-left:0;
  }
  100% {
    text-shadow:0 0 1em white;
    opacity:0;
    margin-left:0;
  }
}

blockquote {
	padding: 10px 20px;
	margin: 0 0 20px 20px;
	border-left: 5px solid #eee;
	font-style: italic;
}

.bi {
	margin-right: .5rem !important;
}


/* Paginator */
.paginator {
	margin-top: 20px;
	margin-bottom: 80px;
}

/* Navbar */
img.nav-svg-icon {
	width: 1rem;
	height: 1rem;
	padding-bottom: 2px;
}

.nav-link {
	font-size: 0.9em;
    font-family: 'Arimo';
    font-weight: 200;
    line-height: 1.5;
    text-transform: uppercase;
}

/* Footer */
footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 60px;
	line-height: 60px;
	font-size: 0.8em;
    background-color: #1e2212 !important; /* Optional: Hintergrundfarbe */
}

.mini-logo {
	height: 22px;
	padding-bottom: 5px;
}

/* Home - Header */
header.welcome {
	padding: 0px 0;
  	background: linear-gradient(rgba(15, 23, 43, .3), rgba(15, 23, 43, .3));
}

/* Home - Page */
section.home-page:nth-child(even) {
	/* Alternate the background color */
	background: linear-gradient(rgba(15, 23, 43, .3), rgba(15, 23, 43, .3));
}

.page-cover-image {
	background-size: cover;
	background-position: center;
}

.page-description {
	color: #fff;
	font-style: normal;
}

/* VIDEO EMBED RESPONSIVE */
.video-embed {
	overflow: hidden;
	padding-bottom: 56.25%;
	/* 16:9 */
	position: relative;
	height: 0;
}

.video-embed iframe {
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	position: absolute;
}
.bg-dark {
  background-color: #1e2212!important;
}.links {
 float: left;
 width: 300px;
}
.rechts { float: left; }
.btn-primary {
  color: #fff;
  background-color: #e2bf25;
  border-color: #FEA116;
  font-family: 'Arimo';
  font-weight: 500;
  text-transform: uppercase;
  text-decoration: none;
  transition: .5s;
  padding: 20px;
  float: left;
  border-radius: 5px;
}
.btn-primary:hover{color:#fff;background-color:#34590c;border-color:#34590c}
}
}

.navbar-nav {
  list-style: none;
} 
.navbar-dark .navbar-nav .nav-link {
  color: #fff;
}
.navbar-dark .navbar-nav .nav-link:hover {
  color: #e2bf25;
background: #000;

  border-radius: 3px;
}

.navbar-toggler-icon {
  color: #b8491e;
 }


.wrapper {
  margin: 0 auto;
  width: 90%;
}

.cards {
  list-style: none;
  margin: 0;
  padding: 10px;  text-align: left;
}

.cards li {

  border-radius:5px;
  color: #fff;
  flex: 1 1 200px;
}

.cards li:hover {

  border-radius:5px;
  background-color: #1e2212 ;
  color: #fff;
  flex: 1 1 200px;
  flex-grow: 1.0;  
  transition: .5s;
}

.cards h2 {
  background-color: transparent;
  margin: 0;
  padding: 10px;
}

.cards p {
  padding: 10px;
}

.flex {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -10px;
}

.flex li {
  flex: 1 1 200px;
  margin: 10px;
}

.grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  /*grid-template-columns: repeat(auto-fill, minmax(200px 1fr));*/
  grid-gap: 20px;
}
.text-black {
  color:#969692;
  margin-left: 1%;
}

.text-black:hover {
  color:#969692;
}
.text-white {
  color: #fff !important;
  text-transform: uppercase;
  margin-left: 5%;
}