/* cinzel-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cinzel';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/cinzel-v25-latin-regular.eot'); /* IE9 Compat Modes */
  src: url('../fonts/cinzel-v25-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/cinzel-v25-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/cinzel-v25-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/cinzel-v25-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/cinzel-v25-latin-regular.svg#Cinzel') format('svg'); /* Legacy iOS */
}

/* cinzel-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Cinzel';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/cinzel-v25-latin-600.eot'); /* IE9 Compat Modes */
  src: url('../fonts/cinzel-v25-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/cinzel-v25-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/cinzel-v25-latin-600.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('../fonts/cinzel-v25-latin-600.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('../fonts/cinzel-v25-latin-600.svg#Cinzel') format('svg'); /* Legacy iOS */
}


/* emilys-candy-regular - latin */
@font-face {
  font-family: 'Emilys Candy';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/emilys-candy-v11-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/emilys-candy-v11-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/emilys-candy-v11-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/emilys-candy-v11-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/emilys-candy-v11-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/emilys-candy-v11-latin-regular.svg#EmilysCandy') format('svg'); /* Legacy iOS */
}
/* lato-300 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/lato-v22-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/lato-v22-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lato-v22-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lato-v22-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lato-v22-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lato-v22-latin-300.svg#Lato') format('svg'); /* Legacy iOS */
}

/* lato-regular - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/lato-v22-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/lato-v22-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/lato-v22-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/lato-v22-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/lato-v22-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/lato-v22-latin-regular.svg#Lato') format('svg'); /* Legacy iOS */
}
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0;
    height: 0;
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


	.left    { text-align: left; }
    .right   { text-align: right; }
    .center  { text-align: center; }
	.hoch    { line-height: 2;
				text-align: center;}


body {
	display: flex;
	flex-direction: column;
	margin: 0;
	min-height: 100vh;
	font-family: Lato, Helvetica, Arial, Geneva, sans-serif;
	background: #f9f9f9;
}
		
main {
	min-height: 5em;
	flex: 1;
	padding: 0;
	padding-left: calc((100% - 60em) / 2);
	padding-right: calc((100% - 60em) / 2);
}


main article,
main section {
	border: none;
	margin: 1em;
}
		
		
main section {
	border-top: 1px solid #777777;
	margin: 1em 0 1em 0;
}

article a {
	border: 1px;
	border-radius: 0.2em;
	border-color: #000;
	background: rgb(119,119,119,1);
	background: linear-gradient(0deg, rgba(119,119,119,1) 0%, rgba(65,65,65,1) 100%);
	color: #f9f9f9;
	text-decoration: none;
	text-align: center;
	padding: 0.5em 2em 0.5em 2em;
}
article a:hover,
article a:focus {
	background: rgb(119,119,119,1);
	background: linear-gradient(0deg, rgba(65,65,65,1) 0%, rgba(119,119,119,1) 100%);
}

header article {
	margin: 2em;
}

header article a {
	background: #f9f9f9;
}
		
header article a:hover,
header article a:focus {
	background: #777777;
}


header,footer {
	background: #f9f9f9;
	padding: 0;
	padding-left: calc((100% - 60em) / 2);
	padding-right: calc((100% - 60em) / 2);
	border: none;
}

header img {
	margin: 0;
	padding: 0;
	border-radius: 10px
}

nav,
nav ul,
nav li {
	margin: 0;
	padding: 0;
	padding-bottom: 4px;
	border: none;
	font-size: 1.1em;
}

nav li {
	list-style-type: none;
	margin: 0;
}

nav a,
footer a		{
	display: inline-block;
	background-color: #f9f9f9;
	color: #777777;
	text-decoration: none;
	text-align: center;
	margin-left: 10px;
	padding: 1px;
}

nav a:hover,
nav a:focus {
	background-color: #ffffff;
	color: #414141;
}

.pur,
.email a,
.email a:hover,
.email a:focus {
	text-decoration: none;
	background: #f9f9f9;
	margin: 0;
	padding: 0;
	color: #414141;
}

		
/* Mobile first - alle Dokument-Blöcke bekommen 100% Breite */
nav ul {
	display: flex;
	flex-direction: column;
}
section {
	display: flex;
	flex-direction: column;
}

figure img {
	width: 90%;
	margin: 1em 5% 1em 5%;
	border-radius: 10px
}

header figure img {
	width: 30px;
	height: 30px;
	margin: 10px 15px 10px 15px;
	border-radius: 0px
}
		
header figure,
header article,
nav {	
	display: flex;
	flex-direction: row;
	flex: auto;
	justify-content: center;
}

h1 {
	font-family: Cinzel, arial, sans-serif;
	Font-weight: 600;
	font-size: 2em;
	color: #414141;
}
h2 {
	font-family: Cinzel, arial, sans-serif;
	Font-weight: 600;
	font-size: 2em;
	color: #777777;
}
h3 {
	font-family: Cinzel, arial, sans-serif;
	Font-weight: 400;
	font-size: 1.4em;
	color: #212121;
	margin: 0;
	padding: 0.2em 0 0 0;
}

		/* Large screens */

@media all and (min-width: 50em) {
nav ul {
	display: flex;
	flex-direction: row;
}
	main section {
	display: flex;
	flex-direction: row;
}
main article {
		/* Der Article wird 3x so breit wie die Cover! */

		flex: 4 1 0%;
}
	main figure {
		flex: 3 1 0%;
}

.blogbild {
		flex: 1 1 0%;
}
	
.blogtext {
	flex: 4 1 0%;
}

header article {	
	display: flex;
	flex-direction: row;
	flex: auto;
	justify-content: flex-start;
}
nav {	
	display: flex;
	flex-direction: row;
	flex: auto;
	justify-content: center;
}
header section {
	display: flex;
	flex-direction: row;
}
	
header figure {	
	margin: 0;
	height: 40px;
	display: flex;
	flex-direction: row;
	flex: auto;
	justify-content: flex-end;
}

header form {
	margin-top: 10px;
}
	
main figure img {
	width: 100%;
	margin: 1em 0 1em 0;

}


h1 {
	font-family: Cinzel, arial, sans-serif;
	Font-weight: 600;
	font-size: 2em;
	color: #414141;
}
h2 {
	font-family: Cinzel, arial, sans-serif;
	Font-weight: 600;
	font-size: 2em;
	color: #777777;
}
h3 {
	font-family: Cinzel, arial, sans-serif;
	Font-weight: 400;
	font-size: 1.4em;
	color: #212121;
	margin: 0;
	padding: 0.2em 0 0 0;
}
}
.some img,
.email img {
	width: 30px;
	height: 30px;
	margin: 10px 15px 10px 15px;
}
.blog img {
	width: 180px;
	height: auto;
}
.blog,
.some {	
	display: flex;
	flex-direction: row;
	flex: auto;
	justify-content: center;
}
.nl {
	text-decoration: none;
	background: #e6e6e6
}