@font-face{
	font-family: 'Slabo27px';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/Slabo-27px-regular/Slabo-27px-regular.eot');
	src: url('../fonts/Slabo-27px-regular/Slabo-27px-regular.eot?iefix') format('embedded-opentype'),
		local('Slabo 27px'),
		local('Slabo-27px-regular'),
		url('../fonts/Slabo-27px-regular/Slabo-27px-regular.woff2') format('woff2'),
		url('../fonts/Slabo-27px-regular/Slabo-27px-regular.woff') format('woff'),
		url('../fonts/Slabo-27px-regular/Slabo-27px-regular.ttf') format('truetype'),
		url('../fonts/Slabo-27px-regular/Slabo-27px-regular.svg#Slabo27px') format('svg');
}
@font-face{
	font-family: 'Hind';
	font-style: normal;
	font-weight: 400;
	src: url('../fonts/Hind-regular/Hind-regular.eot');
	src: url('../fonts/Hind-regular/Hind-regular.eot?iefix') format('embedded-opentype'),
		local('Hind'),
		local('Hind regular'),
		local('Hind-regular'),
		url('../fonts/Hind-regular/Hind-regular.woff2') format('woff2'),
		url('../fonts/Hind-regular/Hind-regular.woff') format('woff'),
		url('../fonts/Hind-regular/Hind-regular.ttf') format('truetype'),
		url('../fonts/Hind-regular/Hind-regular.svg#Hind') format('svg');
}

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
body {line-height: 1;}
ol, ul {list-style: none;}
blockquote, q {
	quotes: none;
}
a {
	text-decoration:none;
	color: #000000;
	font-size: 16;
	font-family: 'Hind', sans-serif;
	-webkit-transition: background-color 0.2s ease-out;
	-moz-transition: background-color 0.2s ease-out;
	-o-transition: background-color 0.2s ease-out;
	-ms-transition: background-color 0.2s ease-out;
	transition: background-color 0.2s ease-out;
}

blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none;}
table {border-collapse: collapse;	border-spacing: 0;}

/* -          - -.- -          - */
body {
	font-family: 'Slabo27px', serif;
	font-size: 16px;
}
h1, h2 {
	font-family: 'Hind', sans-serif;
	font-size: 18px;
}

#header {
	background-color: #ededed;
	font-size:0;
}

#header > div {
	max-width: 1000px;
	min-width:  550px;
	margin: 0px auto;
	vertical-align: middle;
	font-size: 16px;
}
#header > div > div{
	display: inline-block;
	max-height: 148px;
	vertical-align: middle;
}

#header #logo > a {
	display: block;
}



#nav{
	width: 450px;
}
#lang{
	width: 44px;
}

#nav ul{
	margin-left: 3px;
	max-width: 450px;
	min-width: 375px;
}
#nav li {
	display: inline-block;
	margin: 6px;
}
#lang li {
	display: inline-block;
	margin: 6px;
}
#nav a, 
#lang a {
	display: block;
	text-align: center;
	padding: 6px;
	border-radius:9px;
	background-color: #ffffff;
}
#nav a {
	width: 120px;
}

header {
	background-color: #ededed;
	display:none;
}

#header li > a:hover{
	background-color: #dcf3ff;}
#header li > a:active{
	background-color: #aaaaaa;
}

#content {text-align: center;}

/* Home       - -.- -          - */

.topicgal {
	margin: 20px 0px;
}
.topicgal > ul > li {
	display: inline;
}
.topicgal > ul > li:nth-child(2n+3):before {
	content:"\A"; white-space:pre;
}
.topicgal > ul > li > a {
	display: inline-block;
	border-radius: 1.5em;
	margin: 8px 12px;
	padding: 1.5em 1.5em 0.5em;
	background-color: #ededed;
}.topicgal > ul > li > a:hover {
	background-color: #dcf3ff;}
.topicgal > ul > li > a:active {
	background-color: #babace;
}
.topicgal > ul > li > a > img {
	border-radius: 0.5em;
}

#content h2 {
	text-align: center;
	margin: 3em 0 2em;
}

#content > article {
	max-width: 1000px;
	display: inline-block;
	text-align: left;
}

#content > article > p {
	padding: 30px;
	background-color: #ededed;
	border-radius: 1.5em;
}
#content > article > aside{
	margin-top: 30px;
	display: inline-block;
	background-color: #ededed;
	border-radius: 1.5em;
}

#content > article > aside > * {
	float: left;
}


#content > article > aside > p {
	padding: 30px;
	width: 240px;
}

.white {
	background-color: white;
}
.black{
	background-color: black;
}
.grey{
	background-color: #ededed;
}




/* Ein Bergschaf mit Character - */
/* A mountainsheep with charm  - */