/* raleway-regular - latin-ext_latin */
	@font-face {
	  font-family: 'Raleway';
	  font-style: normal;
	  font-weight: 300;
	  src: url('../design/raleway-v28-latin-ext_latin-regular.eot'); /* IE9 Compat Modes */
	  src: local(''),
       url('../design/raleway-v28-latin-ext_latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../design/raleway-v28-latin-ext_latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../design/raleway-v28-latin-ext_latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../design/raleway-v28-latin-ext_latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../design/raleway-v28-latin-ext_latin-regular.svg#Raleway') format('svg'); /* Legacy iOS */
	}

	/* raleway-italic - latin-ext_latin */
	@font-face {
	  font-family: 'Raleway';
	  font-style: italic;
	  font-weight: 300;
	  src: url('../design/raleway-v28-latin-ext_latin-italic.eot'); /* IE9 Compat Modes */
	  src: local(''),
       url('../design/raleway-v28-latin-ext_latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../design/raleway-v28-latin-ext_latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('../design/raleway-v28-latin-ext_latin-italic.woff') format('woff'), /* Modern Browsers */
       url('../design/raleway-v28-latin-ext_latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../design/raleway-v28-latin-ext_latin-italic.svg#Raleway') format('svg'); /* Legacy iOS */
	}

.amenu {padding:.2em; white-space:nowrap; line-height:2em !important;  }
.activelink {font-weight:bold;}
body, input, textarea, select {font-family: 'Raleway', sans-serif; margin:0;}
body {overflow-x:hidden; background-color:#fff; color:#000;}

a { text-decoration:none; color: #099; transition: color ease .5s;}
a:hover { color: #005d5d;}
p {margin:0;padding:0;}

#swipemenu { box-sizing:border-box; width:22em; height:100vh; padding:0; top:0; margin:0 0 0 -22em; text-align:right; background:#fff; line-height:2em !important; position:fixed; transition: all ease .5s; overflow-x:auto; z-index:15;}
#swipemenu.swipemenuexpand {margin-left:0; }


#canvas {	box-sizing: border-box; margin:0; top:0; width:100%; text-align:center; position:absolute; display:block; z-index:10; transition: all ease .5s; }
#canvas.canvasexpand {margin-left:22em;}

#imglayer{ position:fixed; top:20em; left:0; transition: all ease 1s; height:100vh; width:100vw; z-index:99; background-color:#fff; opacity:0; display:none;
    -webkit-animation: fadeInFromNone 0.35s ease reverse;
    -moz-animation: fadeInFromNone 0.35s ease reverse;
    -o-animation: fadeInFromNone 0.35s ease reverse;
    animation: fadeInFromNone 0.35s ease reverse;
}
#imglayer.imglayerexpand {top:0em; cursor:pointer; display:block; opacity: 1;
    -webkit-animation: fadeInFromNone 0.35s ease;
    -moz-animation: fadeInFromNone 0.35s ease;
    -o-animation: fadeInFromNone 0.35s ease;
    animation: fadeInFromNone 0.35s ease;
}
#imglayer.imglayerexpand::after {content:'schließen';  font-size:1.5em; color:#f00; position:fixed; top:0.2em; right:0.2em;}

@-webkit-keyframes fadeInFromNone { 0% {display: none; opacity: 0; top:20em;} 1% {display: block; opacity: 0; top:20em;} 100% {display: block; opacity: 1; top:0em;} }
@-moz-keyframes fadeInFromNone { 0% {display: none; opacity: 0; top:20em;} 1% {display: block; opacity: 0; top:20em;} 100% {display: block; opacity: 1; top:0em;} }
@-o-keyframes fadeInFromNone { 0% {display: none; opacity: 0; top:20em;} 1% {display: block; opacity: 0; top:20em;} 100% {display: block; opacity: 1; top:0em;} }
@keyframes fadeInFromNone { 0% {display: none; opacity: 0; top:20em;} 1% {display: block; opacity: 0; top:20em;} 100% {display: block; opacity: 1; top:0em;} }
@-webkit-keyframes fadeOutToNone { 0% {display: block; opacity: 1; top:0em;} 99% {display: block; opacity: 0; top:20em;} 100% {display: none; opacity: 0; top:20em;} }
@-moz-keyframes fadeOutToNone { 0% {display: block; opacity: 1; top:0em;} 99% {display: block; opacity: 0; top:20em;} 100% {display: none; opacity: 0; top:20em;} }
@-o-keyframes fadeOutToNone { 0% {display: block; opacity: 1; top:0em;} 99% {display: block; opacity: 0; top:20em;} 100% {display: none; opacity: 0; top:20em;} }
@keyframes fadeOutToNone { 0% {display: block; opacity: 1; top:0em;} 99% {display: block; opacity: 0; top:20em;} 100% {display: none; opacity: 0; top:20em;} }

#menu,#devmenu { position:fixed; z-index:10; background-color:#fff; margin:0 auto; padding-top:.5em; width:100vw; text-align:center; vertical-align:middle; display:block; text-decoration:none; overflow: hidden; transition: height ease .5s; -webkit-box-shadow: 0 .2em .4em -.05em #ccc; box-shadow: 0 .2em .4em -.05em #ccc;}
#menu {		top:0em;
							height:0; }
#devmenu {	 font-size:1.6em; cursor:pointer;
							height:0; top:-2em; }

.subcat{	margin:.5em auto; display:inline-block; text-decoration:none; width:100%; text-align:center;}

#main,#bottom {	z-index:5; text-align:justify; background:#fff; position:relative; box-sizing:border-box;  transition: all ease .5s;}
#main {				margin:6em auto 0 auto; z-index:0; max-width:800px;}
#bottom {		box-sizing:border-box; text-align:right; z-index:20; padding: 1em 2em ; width:100vw;}

.box {	margin:0; padding:0 1em; display:inline-block; width:100%; line-height:1.7em; box-sizing:border-box;}

h1 {color: #aaa; font-size:1.7em;}
h2 {color: #aaa; font-size:1.7em; font-weight:lighter; text-align:left; padding-top:4em;}

#suche {width:0; overflow:hidden; display:inline-block; transition: width ease .5s;}
.tldrswitch {float:right; display:inline-block; padding:1em; fill:#099;}
.tldr{	position:relative; box-sizing:border-box; width:100%; height:0; margin:1em 0; padding:0 1em; display:block; overflow:hidden; transition: all ease .5s; background-color:#099; color:#fff;}

.bildbox { position:relative; box-sizing: border-box; margin:1em; font-size:60%; float:left; min-width:10em !important; background-size:100%; background-repeat:no-repeat; width:20%}
.bildboximgb {left:0; top:0; opacity:1; box-sizing: border-box; width:100%; border:0; transition: opacity ease .5s;}
.bildboximgb:hover {opacity:0;}

#modtools {height:0; padding: 0 1em; margin-top:0 !important; overflow:hidden; transition: height ease .5s ;}
#modtools.modtoolsexpand {height: 6em;}
.forumname {vertical-align:top; display:inline-block; width:30%; background-color:#f9f9f9; margin-right:2%; -webkit-box-shadow: 0 .1em .2em 0em #aaa; box-shadow: 0 .1em .2em 0em #aaa;}
.forumtext {vertical-align:top; display:inline-block; }

.msg {overflow:hidden; transition: max-height ease 1s ;}

#reghide {height:0; padding:0 1em; overflow:hidden; transition: height ease .5s;}
#reghide.reghideexpand {height:  4em; }

.socialicon { padding:.5em .3em; width:1em; height:1em; cursor:pointer; color:#fff; transition: all ease .1s;}
.sharer {width:1.9em; white-space:nowrap; overflow:hidden; float:right; text-align:right; transition:all ease .5s;}
.socialdiv {color:#fff !important; width:30em; max-width:93%; padding:1em; margin:1em 0; display:inline-block; vertical-align:middle;}
.imgsocialdiv {margin:0; padding:0; width:50px; height:50px; display:inline-block; vertical-align:middle;}

svg {transition: ease .5s;}
.svg-icon { display: inline-flex; align-self: center;  width:1em; height:1em;  padding:0 .3em; position:relative; bottom:-.125em; cursor:pointer; transition: linear .1s;}

.inputs {width:99%; margin:0;}
input[type=checkbox] {width:auto !important;}
input[type=submit], input[type=button], .asbutton { -webkit-box-shadow: 0 .1em .2em 0em #aaa; box-shadow: 0 .1em .2em 0em #aaa; transition: all ease .1s;}
input[type=submit]:hover, input[type=button]:hover, .asbutton:hover { transform: scale(1.02);}
.asbutton {margin-left:.6em; padding:.5em; }
input:focus, textarea:focus { -webkit-box-shadow: 0 .1em .2em 0em #aaa; box-shadow: 0 .1em .2em 0em #aaa;}

.table{ 						display: block; }
.table-row {					display:block;}
.table-cell { 					display:block; width:95%; }

.mobilefirst {  display:none;}

.journal-window{}
.journal-link{display:flex; flex-flow:row wrap;
box-sizing:border-box; width:100%; border-left:1px solid #099; border-right:1px solid #099; border-radius: .2em; margin:1em 0; padding:1em; }
.journal-link-image{ max-width:100%; max-height:200px; margin-right:1em; border:0;}
.journal-link-text{flex:1; max-width:100%;}
.journal-link-title{font-family:'Raleway', sans-serif; font-size:1.2em;}
.journal-editor{transition: ease .2s; overflow:hidden;}