* {
  box-sizing: border-box;
}


body {
	padding: auto;
	margin: auto;
	font-family:Arial, Helvetica, sans-serif;
	line-height: 1.4;
	max-width: 46rem;
	background-color: #EBEBEB;

	}
	
	h1, h2 {
	color: #261;
	font-weight: normal;
	letter-spacing: 1px;
	text-transform: uppercase;
	font-family: 'Philosopher', serif;
	text-shadow: 3px 3px 5px #aaa;}
	
h1 {
		font-size: x-large;
}

h2 {
	font-size: large;
	margin-top: 40px;
}

h3, h4 {
	font-family: 'Philosopher', serif;
	text-shadow: 3px 3px 5px #aaa;
	color: #261;
	font-weight: normal;
}
	
.klein {
	font-size:90%;
}

blockquote {
	font-size: 95%;
}

ul {
  list-style-type: circle;
  padding:0;
  margin: 5px;
}

li {
	margin: 5px 0;
}

a:link {
  text-decoration: none;
  color: #808080;
}

a:visited {
  text-decoration: none;
  color: black;
}

a:hover {
  text-decoration: underline;
  color: #261;

  
}

a:active {
  text-decoration: underline;
}


header {
	width: 100%; padding: 5px 0;
	letter-spacing: 1px;
	background-color:#FAFAFA;
	text-align: center; 	
  }
	

nav {
   
    margin: 1rem 0;
    padding: 1rem 1rem;
    width: 100%;
   	background-color:#FAFAFA;
 }

.column  { float:left; }

.column.main {
	width: 100%;
	padding: 1rem 2rem;
	background-color: white;
}
	
	
/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
 	.column.main, .column.side {
    width: 100%;
  }
}

/* Gallerie */
div.gallery {
  float: right;
}

div.gallery-item {
  border: 1px solid #ccc;
  width: 180px;
}

div.gallery-item:hover {
  border: 1px solid #777;
}

div.gallery-item img {
  width: 100%;
  height: auto;
  
}

div.gallery-item div.desc {
  padding: 10px;
  
}