body {
	 margin: 0;
     font-family: 'Nunito Sans', sans-serif;
     font-size: 16;
	 color: white;
}
h1 {
    color: #ccc6b9;
}
p {
    color: #a3905d;
}
a { color: #6e7eac;
}
.dropshadow {
    box-shadow: 5px 10px 18px #111111;
} 
/* main container for header, footer, content */   
.container {
    display: flex;
    flex-direction: column;
    background-image:  url('assets/bg.png');
    color: #fff;
	height: 100vh;
}


/* header with the navigation menu */
.header {
	 /* border:  1px solid red; */
	 /* background:  orange; */
     padding:  1rem;
     display:  flex;
     flex-direction:  row;
     justify-content:  space-between;
     align-items:  baseline;
     background: #11111130;
}
.logo {
     /* border: 1px solid blue; */
}
.navi {
     /* border: 1px solid white; */
}
.navi > a {
    float: left;
    display: block;
    color: #a3905d;
    text-align: center;
    padding: 4px 10px;
    text-decoration: none;
    font-size: 1em;
  }
.navi > a:hover, a:visited {
    color: #aaa79f;
  }

/* splash page only */
.splash {
    background-color:  #999999;
    background-image:  url('img/home.jpg');
    background-position:  center;
    background-repeat:  no-repeat; 
    background-size:  cover;
}  
.centerbottom {
    color: #f0eeea;
    text-align: center;
    font-size: 1.5em;
}
.mainsplash{
    display: flex;
    flex-direction: column;
    justify-content:  flex-end;
    padding: 1rem;
    flex-grow: 1;
}
.homeimage {
    max-width: 100%;
    height: auto;
}

/* main content on each page */
.main {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
    padding: 2rem;
    justify-content:  flex-start;
    color: #ffffff;
    overflow: auto;
}

/* title of each page */
.title {
}
.content {
    display: flex;
    flex-direction: row;
    flex-wrap:  wrap;
}

.splashimage {
    display: flex;
    margin-right: 4rem;
    margin-bottom: 2rem;
}

/* listen page only */
.audiobox {
    margin-top: 1rem;
    padding-bottom: 1rem;
    border-bottom: 1px solid #a3905d;
    flex-grow: 1;
}
.audio {
    margin:  1rem;
}
.videobox {
    display: flex;
    justify-content:  center;
    flex-direction:  row;
    flex-wrap:  wrap;
}
.video {
    margin: 1rem;
    width:  min-content;
}
.eventlist {
    white-space: nowrap;
    background: #d3cdbd0a;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-bottom: 2rem;
}
.eventlist > a {
    border: 1px solid red;
    margin-bottom: 5rem;
}
.futureevent {
    color: hsl(40, 6%, 79%);
}
.pastevent {
    color: #a3905d;
}

/* about page */
.abouttext {
    white-space: normal;
    padding-bottom: 1rem;
}
.about {
    white-space: nowrap;
    background: #d3cdbd0a;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-bottom: 2rem;
}
.deutsch {
    color: #f0eeea;
}
.deutschlink {
 }
.english {
    color: #a3905d;
    border-bottom: 1px solid #a3905d;
    padding-bottom: 1rem;
    margin-bottom: 4rem;
}

/* gallery images */
.gallerythumb {
    box-shadow: 5px 10px 18px #111111;
}
.gallery {
    margin-right: 2rem;
    margin-bottom: 1rem;
    /* border: 1px solid #ccc; */
    float: left;
    width:  240px;
  }
  
.gallery:hover {
    /* border: 1px solid #777; */
    opacity: 0.5;
  }
  
.gallery img {
    width: 100%;
    height: auto;
    box-shadow: 5px 10px 18px #111111;
}


/* contact page */
.address {
    padding-top: 2em;
    color: #a3905d;
}
.address a {
    color: #a3905d;
}

/* footer bar. keep it simple for now */
.footer {
    border-top: 1px solid #a3905d;
    margin-top: 1rem;
    padding: 1rem;
    font-size: 0.8em;
    color: #a3905d;
}