@charset "utf-8";
/* CSS Document */
/*
Theme Name: Mohr Siebeck
Author: networkerz gmbh
Author URI: http://networkerz.de/
Description: main css
Version: 1.0
License: private
License URI: https://www.networkerz.de
*/
/*  critical css   */
/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('fonts/open-sans-v27-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
* {
	 margin: 0; padding: 0;
	 box-sizing: border-box;
	 }
html, body {
	position:relative;
    font-family:'Open Sans', sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size:16px;
	text-align: left;
	line-height: 1.3;
	margin:0px;
	padding:0px;
	height:100%;
	hyphens: auto;
}
/* critical css end  */
h1, h2 {font-weight:400}
h1, .booktitle {
  font-family: Droid, serif;
  font-size:30px;
  color:var(--blue)
}
h2 {
	font-size:24px;
}
h3 {
	font-size:16px;
  font-weight:700;
}
a {
  color:var(--blue);
  text-decoration:none;
  -webkit-transition: color 0.4s ease;
	-moz-transition: color 0.4s ease;
	transition: color 0.4s ease;
}
footer a {
  color:var(--white);
}
a:visited, a:focus {
  	}
a:focus { outline: none; }
a:hover,
a:focus {
  text-decoration:underline;
	}
.subnav a:after {
  content:'|';
}
.subnav a:last-child:after {
  content:'';
}
ul, li {
		margin: 0;
    padding: 0;
		list-style:none;
	}
img {
	border:none;
	display:block;
	}
p {
}
strong {
	font-weight:700;
}
/*  Farben   */
:root {
  --black:#373737;
  --lightblue:#F2F3F7;
  --white:#FFF;
  --blue:#25408F;
  --yellow:#FDDB2F;
}
.bg-lightblue {
  background-color: var(--lightblue);
}
.bg-blue {
  background-color: var(--blue);
	color:#fff;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('fonts/open-sans-v27-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
}

/* open-sans-600 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       url('fonts/open-sans-v27-latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('fonts/open-sans-v27-latin-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/*  Navigation  */
header .container {
  padding: 10px;
  background-color: var(--blue);
}
.nav-brand {
	position:relative;
	width:100%;
	max-width: 320px;
}
.nav-brand a {
	position:absolute;
	width:100%;
	height:100%
}
/*  content  */
section, header, footer {
	width:100%;
	}
main {
  color:var(--black);
}
section {
	margin:20px 0;
}
article {
	padding:0 20px;
}
article.bg-lightblue {
	padding:20px;
}
.booktitle {
	text-align:center;
	margin: 40px auto;
}
.hero-image img {
    display:none;
  }
.hero-image article {
	padding:20px;
}
.blockquote article {
	border-top: solid 1px var(--blue);
	border-bottom: solid 1px var(--blue);
}
.blockquote p {
	font-family: Droid, serif;
	font-size: 20px;
	color: var(--blue);
	margin:20px auto;
	text-align:center;
}
footer {
  color:var(--white);
}
.container {
	width:100%;
    max-width:1200px;
	padding-right: 0;
	padding-left: 0;
	margin:0 auto;
	}
	/* back to Top - Button  */
  #scrollup {
    position: fixed;
    width: 100%;
    max-width: 1200px;
    margin:0 auto;
    right:10px;
    bottom: 140px;
    width: 42px;
    height: 42px;
    transition: all 1s ease;
    opacity: 0;
  }
  footer {
    background-color:var(--blue);
  }
footer .container {
  text-align: center;
  padding: 20px;
}
footer ul {
  display: inline-flex;
  margin-top: 5px;
}
footer li:first-child:after {
	content:'|';
	padding: 0 10px;
}
footer li:last-child {
  padding: 0 20px 0 0;
}
@media(min-width:768px) {
 article {
		max-width: 1200px;
		margin: 0 auto;
	}
  .hero-image h1 {
    margin-top: 20px;
  }
  .hero-image article {
    display:flex;
    justify-content:space-between;
  }
  .hero-image .col-2:first-child {
    padding:20px;
  }
 .hero-image img {
		display:block;
	}
  #scrollup {
	  bottom: 100px;
	  right:20px;
	}
  #scrollup:hover #link_kreis {
    fill:#F2F3F7;
  }
  #scrollup:hover #Group-2 {
    stroke:#25408F;
  }
}
@media (min-width:1200px) {
  #scrollUp {
    left: auto;
    right: 0;
    margin-right: calc(50% - 600px);
  }
}
