@charset 'UTF-8';

/* open-sans-300 - latin-ext_latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: url('../webfonts/open-sans-v17-latin-ext_latin-300.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Light'), local('OpenSans-Light'),
       url('../webfonts/open-sans-v17-latin-ext_latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../webfonts/open-sans-v17-latin-ext_latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../webfonts/open-sans-v17-latin-ext_latin-300.woff') format('woff'), /* Modern Browsers */
       url('../webfonts/open-sans-v17-latin-ext_latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../webfonts/open-sans-v17-latin-ext_latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-regular - latin-ext_latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../webfonts/open-sans-v17-latin-ext_latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Regular'), local('OpenSans-Regular'),
       url('../webfonts/open-sans-v17-latin-ext_latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../webfonts/open-sans-v17-latin-ext_latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../webfonts/open-sans-v17-latin-ext_latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../webfonts/open-sans-v17-latin-ext_latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../webfonts/open-sans-v17-latin-ext_latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600 - latin-ext_latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../webfonts/open-sans-v17-latin-ext_latin-600.eot'); /* IE9 Compat Modes */
  src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
       url('../webfonts/open-sans-v17-latin-ext_latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../webfonts/open-sans-v17-latin-ext_latin-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('../webfonts/open-sans-v17-latin-ext_latin-600.woff') format('woff'), /* Modern Browsers */
       url('../webfonts/open-sans-v17-latin-ext_latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../webfonts/open-sans-v17-latin-ext_latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-700 - latin-ext_latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../webfonts/open-sans-v17-latin-ext_latin-700.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Bold'), local('OpenSans-Bold'),
       url('../webfonts/open-sans-v17-latin-ext_latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../webfonts/open-sans-v17-latin-ext_latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../webfonts/open-sans-v17-latin-ext_latin-700.woff') format('woff'), /* Modern Browsers */
       url('../webfonts/open-sans-v17-latin-ext_latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../webfonts/open-sans-v17-latin-ext_latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-800 - latin-ext_latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 800;
  src: url('../webfonts/open-sans-v17-latin-ext_latin-800.eot'); /* IE9 Compat Modes */
  src: local('Open Sans ExtraBold'), local('OpenSans-ExtraBold'),
       url('../webfonts/open-sans-v17-latin-ext_latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../webfonts/open-sans-v17-latin-ext_latin-800.woff2') format('woff2'), /* Super Modern Browsers */
       url('../webfonts/open-sans-v17-latin-ext_latin-800.woff') format('woff'), /* Modern Browsers */
       url('../webfonts/open-sans-v17-latin-ext_latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../webfonts/open-sans-v17-latin-ext_latin-800.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/*
	BBQ Bautechnik – Theme auf Basis von Bootstrap 5.3
	Nachbau des ursprünglichen Skel/Zenith-Layouts (Pixelarity).

	Breakpoints (entsprechen den früheren Skel-Breakpoints):
	  mobile   bis 767.98px   (Spalten untereinander, Titelleiste + Off-Canvas-Navigation)
	  1000px   768 – 1200px   (Container 1000px, Tablets werden auf 1080px Viewport skaliert)
	  desktop  ab 1201px      (Container 1200px)
*/

/*********************************************************************************/
/* Reset (gleicht Bootstrap-Reboot an den bisherigen Skel-Reset an)              */
/*********************************************************************************/

	h1, h2, h3, h4, h5, h6, p, ul, ol, dl, dd, blockquote, figure, pre, fieldset, legend
	{
		margin: 0;
		padding: 0;
	}

	h1, h2, h3, h4, h5, h6
	{
		font-size: 100%;
		font-weight: inherit;
		line-height: inherit;
		color: inherit;
	}

	ul, ol
	{
		list-style: none;
	}

	small
	{
		font-size: 100%;
	}

	img, svg
	{
		vertical-align: baseline;
	}

	blockquote, q
	{
		quotes: none;
	}

/*********************************************************************************/
/* Container & Grid                                                              */
/*********************************************************************************/

	.container
	{
		width: 100%;
		max-width: none;
		padding-left: 0;
		padding-right: 0;
	}

	.row
	{
		--bs-gutter-x: 15px;
		--bs-gutter-y: 15px;
	}

	/* ersetzt Skel "row 200%" */
	.row.row-wide
	{
		--bs-gutter-x: 30px;
		--bs-gutter-y: 30px;
	}

	@media (min-width: 768px)
	{
		.container
		{
			width: 1000px;
		}

		.row
		{
			--bs-gutter-x: 20px;
			--bs-gutter-y: 20px;
		}

		.row.row-wide
		{
			--bs-gutter-x: 40px;
			--bs-gutter-y: 40px;
		}

		.only-mobile
		{
			display: none !important;
		}
	}

	@media (min-width: 1201px)
	{
		.container
		{
			width: 1200px;
		}

		.row
		{
			--bs-gutter-x: 25px;
			--bs-gutter-y: 25px;
		}

		.row.row-wide
		{
			--bs-gutter-x: 50px;
			--bs-gutter-y: 50px;
		}
	}

	@media (max-width: 767.98px)
	{
		.only-desktop
		{
			display: none !important;
		}
	}

	/* Kompatibilität: alte Skel-Spaltenklassen (z. B. "6u") in CMS-Inhalten */
	@media (min-width: 768px)
	{
		.row > .\31 2u { flex: 0 0 auto; width: 100%; }
		.row > .\31 1u { flex: 0 0 auto; width: 91.6666666667%; }
		.row > .\31 0u { flex: 0 0 auto; width: 83.3333333333%; }
		.row > .\39 u  { flex: 0 0 auto; width: 75%; }
		.row > .\38 u  { flex: 0 0 auto; width: 66.6666666667%; }
		.row > .\37 u  { flex: 0 0 auto; width: 58.3333333333%; }
		.row > .\36 u  { flex: 0 0 auto; width: 50%; }
		.row > .\35 u  { flex: 0 0 auto; width: 41.6666666667%; }
		.row > .\34 u  { flex: 0 0 auto; width: 33.3333333333%; }
		.row > .\33 u  { flex: 0 0 auto; width: 25%; }
		.row > .\32 u  { flex: 0 0 auto; width: 16.6666666667%; }
		.row > .\31 u  { flex: 0 0 auto; width: 8.3333333333%; }
	}

/*********************************************************************************/
/* Basic                                                                         */
/*********************************************************************************/

	body
	{
		background: #fff;
		font-family: 'Open Sans', sans-serif;
		font-weight: 300;
		color: #25282c;
		font-size: 11pt;
		line-height: 1.75em;
	}

	input,
	textarea,
	select
	{
		font-size: 11pt;
		line-height: 1.75em;
	}

	form input,
	form select,
	form textarea
	{
		-webkit-appearance: none;
	}

	br.clear
	{
		clear: both;
	}

	p, ul, ol, dl, table
	{
		margin-bottom: 1em;
	}

	strong, b
	{
		color: #25282c;
		font-weight: 400;
	}

	a
	{
		color: #098139;
		text-decoration: underline;
	}

		a:hover
		{
			color: #098139;
			text-decoration: none;
		}

	section,
	article
	{
		margin-bottom: 3em;
	}

	section > :last-child,
	article > :last-child
	{
		margin-bottom: 0;
	}

	section:last-child,
	article:last-child
	{
		margin-bottom: 0;
	}

		header > p
		{
			margin-top: 0.75em;
		}

	.image
	{
		display: inline-block;
	}

		.image img
		{
			display: block;
			width: 100%;
			border: 10px solid #FFFFFF;
		}

		.image.full
		{
			display: block;
			width: 100%;
			margin: 0 0 2em 0;
		}

		.image.left
		{
			float: left;
			margin: 0 2em 2em 0;
		}

		.image.right
		{
			float: right;
			margin: 0 2em 2em 0;
		}

		.image.centered
		{
			display: block;
			margin: 0 0 2em 0;
		}

			.image.centered img
			{
				margin: 0 auto;
				width: auto;
			}

	.button
	{
		display: inline-block;
		background: #098139;
		border: 0;
		outline: 0;
		cursor: pointer;
		transition: background-color .25s ease-in-out;
		text-align: center;
		text-decoration: none;
		font-weight: 700;
		color: #FFF;
		white-space: nowrap;
	}

		.button:before
		{
			margin-right: 0.5em;
			font-size: 1em !important;
		}

		.button:hover
		{
			background-color: #a8d38c;
			color: #FFF;
		}

		.button:active
		{
			background-color: #88b36c;
		}

		.button.alt
		{
			background: #25282c;
		}

			.button.alt:hover
			{
				background-color: #535a63;
			}

			.button.alt:active
			{
				background-color: #3c4148;
			}

		ul.style1 li
		{
			padding: 1.30em 0em;
			border-top: 1px solid rgba(144,144,144,0.25);
		}

		ul.style1 a
		{
			color: #9b9fa5;
		}

			ul.style1 a:hover
			{
				text-decoration: none;
			}

		ul.style1 .first
		{
			padding-top: 0em;
			border-top: none;
		}

		ul.style2 li
		{
			padding: 2em 0 1em 0;
			border-top: 2px solid rgba(144,144,144,0.25);
		}

		ul.style2 h3
		{
			padding: 0 0 0.75em 0;
			font-size: 1.00em;
			font-weight: 600;
			color: #25282c;
		}

		ul.style2 .meta
		{
			font-size: 0.70em;
			color: #9b9b9b;
		}

			ul.style2 .meta a
			{
				color: #9b9b9b;
			}

			ul.style2 .date
			{
				padding: 0 1em 0 0;
				border-right: 1px solid #e5e5e5;
				font-size: 0.90em;
				color: #a2a2a2;
			}

			ul.style2 .comments
			{
				padding: 0 0 0 1em;
				font-size: 0.90em;
			}

				ul.style2 .comments a
				{
					color: #a2a2a2;
				}

					ul.style2 .comments a:hover
					{
						text-decoration: none;
					}

		ul.style2 .first
		{
			padding-top: 0;
			border-top: none;
		}

	ul.contact
	{
		padding-top: 2em;
	}

		ul.contact li
		{
			position: relative;
			padding: 2.2em 0em 2.2em 5em;
			border-top: 1px solid rgba(144,144,144,0.25);
			line-height: 2.2em;
		}

		ul.contact li:first-child
		{
			padding-top: 0;
			border-top: 0;
		}

		ul.contact a
		{
			color: #9b9fa5;
		}

			ul.contact a:hover
			{
				text-decoration: none;
			}

		ul.contact li span
		{
			position: absolute;
			left: 0;
			top: 1.6em;
			font-size: 1.1em;
		}

			ul.contact li span:before
			{
				display: inline-block;
				background: #098139;
				width: 43px;
				height: 43px;
				line-height: 43px;
				text-align: center;
				font-size: 20px;
				color: #FFFFFF;
			}

				ul.contact li:first-child span
				{
					top: 0;
				}

	.box
	{
		border-top: 2px solid rgba(144,144,144,0.25);
	}

		.box:first-child
		{
			border-top: 0 !important;
			margin-top: 0 !important;
			padding-top: 0 !important;
		}

		.box.post
		{
			overflow: hidden;
		}

			.box.post .image img
			{
				border: none;
			}

		.actions li
		{
			display: inline-block;
		}

	.pennant
	{
		position: relative;
		display: inline-block;
		width: 9em;
		margin: 3em 0em;
		cursor: default;
	}

		.pennant:before
		{
			content: '';
			position: absolute;
			top: -3em;
			left: 0;
			border-bottom: solid 7em #098139;
			border-left: solid 4.5em transparent;
			border-right: solid 4.5em transparent;
		}

		.pennant span
		{
			display: block;
			margin: 0 auto;
			text-align: center;
			font-size: 2.4em;
		}

		.pennant .icon
		{
			position: relative;
			z-index: 2;
			color: #FFF;
		}

/*********************************************************************************/
/* Icons                                                                         */
/*********************************************************************************/

	.icon
	{
		text-decoration: none;
	}

		/* Font Awesome 7: die Klasse fa-* setzt das Glyph über --fa */
		.icon:before
		{
			content: var(--fa);
			display: inline-block;
			font-family: 'Font Awesome 7 Free';
			font-size: 1.25em;
			text-decoration: none;
			font-style: normal;
			font-weight: 900;
			line-height: 1;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
		}

		/* Outline-Variante (entspricht den früheren "-o"-Icons) */
		.icon.icon-regular:before
		{
			font-weight: 400;
		}

		.icon .label
		{
			display: none;
		}

/*********************************************************************************/
/* Wrappers                                                                      */
/*********************************************************************************/

	#header-wrapper
	{
		position: relative;
		background: url('../images/banner.jpg') top center;
		background-size: cover;
	}

		#header-wrapper:before
		{
			content: '';
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: url('images/bg01.png');
		}

		#header-wrapper:after
		{
			content: '';
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background: linear-gradient(to bottom, rgba(25,28,30,0.75) 5%, rgba(0,0,0,0) 45%, rgba(0,0,0,0) 50%), rgba(29,32,38,0.75);
		}

	#main-wrapper
	{
		overflow: hidden;
	}

	#footer-wrapper
	{
		position: relative;
		background: #32373d;
	}

		#footer-wrapper:before
		{
			content: '';
			position: absolute;
			display: block;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background-image: url('images/bg01.png');
			opacity: 0.2;
		}

	.wrapper-style1
	{
		overflow: hidden;
		background: #f7f7f7 url('images/bg01.png');
		box-shadow: inset 0px 15px 8px -10px rgba(0,0,0,0.03), inset 0px -15px 8px -10px rgba(0,0,0,0.03);
	}

		.wrapper-style1 header
		{
			text-align: center;
		}

		.wrapper-style1 h3
		{
			font-weight: 700;
			color: #25282c;
		}

	.wrapper-style2
	{
		overflow: hidden;
	}

/*********************************************************************************/
/* Header                                                                        */
/*********************************************************************************/

	#header
	{
		position: relative;
		z-index: 2;
	}

/*********************************************************************************/
/* Banner                                                                        */
/*********************************************************************************/

	#banner
	{
		position: relative;
		overflow: hidden;
		text-align: center;
		color: #ffffff;
		z-index: 1;
	}

		#banner h2
		{
			font-weight: 700;
		}

		#banner p
		{
			font-weight: 300;
			color: #dadbdd;
		}

/*********************************************************************************/
/* Footer                                                                        */
/*********************************************************************************/

	#footer
	{
		position: relative;
		color: #9b9fa5;
	}

			#footer header h2
			{
				font-weight: 700;
				color: #FFFFFF;
			}

/*********************************************************************************/
/* Main                                                                          */
/*********************************************************************************/

			#main header h1
			{
				font-weight: 750;
				color: #25282c;
			}

			#main header h2
			{
				font-weight: 700;
				color: #25282c;
			}

			#main h1
			{
				font-weight: 750;
				color: #25282c;
			}

/*********************************************************************************/
/* Content                                                                       */
/*********************************************************************************/

	#content h1
	{
		font-weight: 750;
		color: #25282c;
	}

	#content h2
	{
		letter-spacing: -1px;
		font-weight: 700;
	}

/*********************************************************************************/
/* Intro                                                                         */
/*********************************************************************************/

	#intro
	{
		overflow: hidden;
		text-align: center;
	}

		#intro h3
		{
			letter-spacing: -1px;
			font-weight: 700;
			color: #25282c;
		}

		#intro .actions
		{
			overflow: hidden;
		}

		#intro .icon
		{
			color: #FFF;
		}

/*********************************************************************************/
/* Featured                                                                      */
/*********************************************************************************/

		#featured header h1
		{
			letter-spacing: -1px;
			font-weight: 750;
		}

		#featured header h2
		{
			letter-spacing: -1px;
			font-weight: 700;
		}

/*********************************************************************************/
/* Copyright                                                                     */
/*********************************************************************************/

	#copyright
	{
		text-align: center;
		color: #61666c;
		font-weight: 400;
	}

		#copyright span
		{
			position: relative;
			display: inline-block;
			background: rgba(255,255,255,0.03);
		}

/*********************************************************************************/
/* Formular                                                                      */
/*********************************************************************************/

		form input[type=text],
		form input[type=email],
		form input[type=password],
		form select,
		form textarea
		{
			border: 0;
			padding: 0.75em;
			font-size: 1em;
			border-radius: 8px;
			background: #eeeeee;
			color: #000;
			box-shadow: inset 0px 2px 5px 0px rgba(0,0,0,0.05), 0px 1px 0px 0px rgba(255,255,255,0.025);
			width: 100%;
			transition: background .2s ease-in-out, box-shadow .2s ease-in-out;
		}

		form input[type=text]:focus,
		form input[type=email]:focus,
		form input[type=password]:focus,
		form select:focus,
		form textarea:focus
		{
			outline: 0;
			background: #CCCCCC;
			box-shadow: inset 0px 2px 5px 0px rgba(0,0,0,0.05), 0px 1px 0px 0px rgba(255,255,255,0.025), inset 0px 0px 2px 1px #74CAEE;
		}

		form textarea
		{
			height: 15em;
		}

		form ::placeholder
		{
			color: #555 !important;
		}

		form ::-moz-focus-inner
		{
			border: 0;
		}

	.action
	{
		background: linear-gradient(to bottom, #dddddd, #bbbbbb);
	}

/*********************************************************************************/
/* Google Maps - Responsive iFrame                                               */
/*********************************************************************************/

	.google-maps
	{
		position: relative;
		padding-bottom: 75%; /* This is the aspect ratio */
		height: 0;
		overflow: hidden;
	}

		.google-maps iframe
		{
			position: absolute;
			top: 0;
			left: 0;
			width: 100% !important;
			height: 100% !important;
		}

	/* 2 factor iFrame */

	div.privacy-msg p
	{
		width: 200px;
		border: 1px solid #32373d;
		border-radius: 8px;
		padding: 5px;
		text-align: center;
		position: relative;
		top: 35%;
		left: 50%;
		transform: translate(-50%, -50%);
		box-shadow: 0 10px 6px -6px #777;
	}

/*********************************************************************************/
/* Nav (Desktop) – Dropdowns ersetzen jquery.dropotron                           */
/*********************************************************************************/

	#nav ul
	{
		margin: 0;
	}

		#nav > ul > li
		{
			position: relative;
		}

		#nav .dropotron
		{
			position: absolute;
			top: calc(100% - 17px);
			left: -1px;
			z-index: 1000;
			width: max-content;
			text-align: left;
			opacity: 0;
			visibility: hidden;
			transition: opacity .3s ease, visibility 0s linear .3s;
		}

		#nav > ul > li:hover > .dropotron,
		#nav > ul > li:focus-within > .dropotron
		{
			opacity: 1;
			visibility: visible;
			transition: opacity .3s ease;
		}

/*********************************************************************************/
/* Mobile UI – Titelleiste & Off-Canvas-Navigation                              */
/*********************************************************************************/

	#titleBar
	{
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 44px;
		z-index: 1030;
	}

	#navPanel
	{
		--bs-offcanvas-width: 80%;
		--bs-offcanvas-bg: #32373d;
		--bs-offcanvas-border-width: 0;
		--bs-offcanvas-transition: transform .5s ease;
		overflow-y: auto;
	}

	/* Skel: Klick neben das Panel schließt es, ohne die Seite abzudunkeln */
	.offcanvas-backdrop.show
	{
		opacity: 0;
	}

	@media (min-width: 768px)
	{
		#titleBar,
		#navPanel
		{
			display: none !important;
		}
	}

/*********************************************************************************/
/* Desktop (ab 768px)                                                            */
/*********************************************************************************/

@media (min-width: 768px)
{
	.button {
	  padding: 1em 2em 1em 2em;
	  font-size: 0.9em;
	}

	.button.big {
	  min-width: 14em;
	  padding: 1.2em 2em 1.2em 2em;
	  font-size: 1.4em;
	}

	.box.post {
	  margin-top: 5em;
	  padding-top: 4em;
	}

	.box.post .actions li {
	  margin-right: 0.2em !important;
	}

	.box.post .image.left {
	  margin-right: 3em;
	}

	.box.post .icon-comment-alt:before {
	  padding-right: 10px !important;
	}

	.box.featured-post {
	  padding: 0em 0.5em;
	}

	.box.featured-post .content {
	  padding: 0em 0.5em;
	}

	.actions {
	  margin: 3em 0 0 0;
	}

	.actions li {
	  display: inline-block;
	  margin: 0 0.75em 0 0.75em;
	}

	.actions li:first-child {
	  margin-left: 0;
	}

	.actions li:last-child {
	  margin-right: 0;
	}

	.actions-centered {
	  text-align: center;
	}

	.triangle {
	  margin: 0 auto 2em auto;
	  width: 9em;
	  padding: 0;
	  height: 0;
	}

	.triangleNest {
	  margin-left: -0.5em;
	  padding-top: 1.5em;
	  font-size: 2.3em;
	}

	/* Wrappers */

	#header-wrapper {
	  min-height: 10em;
	}

	#main-wrapper {
	  padding: 8em 0em;
	}

	#footer-wrapper {
	  padding: 8em 0em;
	}

	.wrapper-style1 {
	  padding: 8em 0em;
	}

	.wrapper-style1 h3 {
	  margin: 0 0 1em 0;
	  font-size: 1.3em;
	}

	.wrapper-style2 {
	  padding: 4em 0em;
	}

	/* Header */

	#header .inner {
	  position: relative;
	  height: 4.5em;
	  background: #474d55;
	}

	#header .inner:before {
	  content: "";
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  background-image: url("images/bg01.png");
	  opacity: 0.4;
	}

	#header h1 {
	  position: absolute;
	  display: block;
	  margin: 0;
	  padding: 1em 5em;
	  background: #ffffff;
	  font-size: 0.5em;
	  line-height: 1em;
	  color: #fff;
	}

	#header h1 a {
	  text-decoration: none;
	  font-weight: 700;
	  color: #fff;
	}

	/* Nav */

	#nav {
	  position: absolute;
	  right: 2em;
	  top: 0;
	  line-height: 4.5em;
	}

	#nav > ul > li {
	  float: left;
	  padding: 0 1.5em 0 1.5em;
	}

	#nav > ul > li > a,
	#nav > ul > li > span {
	  text-decoration: none;
	  font-size: 1em;
	  border-radius: 6px;
	  outline: 0;
	  color: #fff;
	}

	#nav > ul > li.section > a {
	  font-weight: 700;
	}

	#nav > ul > li:last-child {
	  padding-right: 0;
	}

	.dropotron {
	  line-height: 1em;
	  margin: 0;
	  background: rgba(73, 79, 88, 0.95);
	  padding: 1.25em 1.5em 1.25em 1.5em;
	  min-width: 16em;
	  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
	}

	.dropotron:after {
	  content: "";
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  background-image: url("images/bg01.png");
	  opacity: 0.4;
	}

	.dropotron a,
	.dropotron span {
	  color: rgba(255, 255, 255, 0.65);
	  position: relative;
	  display: block;
	  z-index: 20000;
	  text-decoration: none;
	  padding: 1em 0 1em 0;
	  transition: all 0.25s ease-in-out;
	}

	.dropotron li {
	  border-top: solid 2px rgba(144, 144, 144, 0.25);
	}

	.dropotron li:first-child {
	  border-top: 0;
	}

	.dropotron li:hover > a,
	.dropotron li:hover > span {
	  color: #fff;
	}

	/* Banner */

	#banner {
	  padding: 13em 0;
	}

	#banner h2 {
	  font-size: 2.5em;
	}

	#banner p {
	  padding-top: 1em;
	  font-size: 2em;
	}

	/* Footer */

	#footer header {
	  margin-bottom: 3em;
	}

	#footer header h2 {
	  font-size: 1.3em;
	}

	#footer .button {
	  margin-top: 2em;
	}

	#footer-links {
	  margin-top: 5em;
	}

	/* Main */

	#main header {
	  margin-bottom: 4em;
	}

	#main header h1 {
	  font-size: 1.4em;
	  font-weight: bold;
	}

	#main header h2 {
	  font-size: 1.3em;
	}

	#main .image.left {
	  margin-bottom: 1em !important;
	}

	/* Intro */

	#intro h3 {
	  padding-bottom: 1em;
	  font-size: 1.7em;
	}

	#intro p {
	  font-size: 1.25em;
	  line-height: 1.75em;
	}

	#intro .first {
	  padding: 2em 3em;
	}

	#intro .middle {
	  padding: 2em 3em;
	  border-left: 2px solid rgba(144, 144, 144, 0.25);
	  border-right: 2px solid rgba(144, 144, 144, 0.25);
	}

	#intro .last {
	  padding: 2em 3em;
	}

	#intro .actions {
	  margin-top: 5em;
	}

	/* Featured */

	#featured .row-padding {
	  margin-bottom: 4em;
	}

	#featured header {
	  margin-bottom: 4em;
	}

	#featured header h2 {
	  font-size: 2.5em;
	}

	#featured header p {
	  padding-top: 0.5em;
	  font-size: 1.8em;
	}

	#featured .button {
	  margin-top: 2em;
	}

	/* Copyright */

	#copyright span {
	  margin-top: 6em;
	  padding: 1.8em 7em;
	  font-size: 0.9em;
	}
}

/*********************************************************************************/
/* 1000px (768 – 1200px)                                                         */
/*********************************************************************************/

@media (min-width: 768px) and (max-width: 1200px)
{
	body {
	  min-width: 1000px;
	}

	.button {
	  padding: 1em 1.5em 1em 1.5em;
	}

	#main-wrapper {
	  padding: 3em 0em;
	}

	#footer-wrapper {
	  padding: 3em 0em;
	}

	.wrapper-style1 {
	  padding: 6em 0em;
	}

	.wrapper-style2 {
	  padding: 3em 0em;
	}

	#banner {
	  padding: 8em 0;
	}

	#nav {
	  right: 1.5em;
	}

	#nav > ul > li {
	  padding: 0 1em 0 1em;
	}

	#nav > ul > li:last-child {
	  padding-right: 0;
	}
}

/* iPad Portrait und Landscape */
@media only screen
  and (min-device-width: 768px)
  and (max-device-width: 1024px)
{
	body {
	  min-width: auto !important;
	}

	.container {
	  width: 100% !important;
	  max-width: 100% !important;
	  min-width: auto !important;
	}

	#footer-wrapper {
	  padding: 30px 30px !important;
	}

	#footer {
	  margin: 0 !important;
	}
}

/*********************************************************************************/
/* Mobile (bis 767.98px)                                                         */
/*********************************************************************************/

@media (max-width: 767.98px)
{
	body,
	input,
	textarea,
	select {
	  font-size: 12pt;
	  line-height: 1.75em;
	}

	h2,
	h3,
	h4,
	h5,
	h6 {
	  font-size: 1.5em;
	  margin: 0 0 0.75em 0;
	}

	section,
	article {
	  clear: both;
	}

	.button {
	  display: block;
	  padding: 1em 2em 1em 2em;
	  font-size: 1.1em;
	  margin: 2em 0 0 0;
	}

	.button.big {
	  padding: 1.2em 0.2em 1.2em 0.2em;
	  font-size: 1.4em;
	  margin-top: 1em;
	}

	.box.post {
	  margin-top: 3em;
	  padding-top: 2em;
	}

	.box.post .actions {
	  margin-top: 2em;
	}

	.actions li {
	  display: block;
	  margin-bottom: 0.5em;
	}

	.triangle {
	  margin: 0 auto 2em auto;
	  width: 9em;
	  padding: 0;
	  height: 0;
	}

	.triangleNest {
	  margin-left: -0.5em;
	  padding-top: 1.5em;
	  font-size: 2.3em;
	}

	/* Titelleiste */

	#page-wrapper {
	  padding-top: 44px;
	}

	#page-wrapper,
	#titleBar {
	  transition: transform .5s ease;
	}

	body.navPanel-visible #page-wrapper,
	body.navPanel-visible #titleBar {
	  transform: translateX(80%);
	}

	#titleBar {
	  background: #474d55;
	  text-align: center;
	}

	#titleBar:before {
	  content: "";
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  background-image: url("images/bg01.png");
	  opacity: 0.2;
	}

	#titleBar .title {
	  position: relative;
	  text-decoration: none;
	  font-size: 1.1em;
	  font-weight: 700;
	  color: #fff;
	  background: #fff;
	  text-align: center;
	  display: inline-block;
	  height: 30px;
	  line-height: 30px;
	  padding: 0 15px 0 15px;
	  margin: 7px 0 0 0;
	  z-index: 1;
	}

	#titleBar .toggle {
	  position: absolute;
	  left: 0;
	  top: 0;
	  width: 80px;
	  height: 60px;
	  padding: 0;
	  border: 0;
	  background: none;
	  z-index: 1;
	}

	#titleBar .toggle:before {
	  content: "";
	  display: block;
	  position: absolute;
	  left: 14px;
	  top: 16px;
	  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18px" height="12px" viewBox="0 0 18 12"><rect x="0" y="0" width="18" height="2" style="fill:rgb(255,255,255);" /><rect x="0" y="5" width="18" height="2" style="fill:rgb(255,255,255);" /><rect x="0" y="10" width="18" height="2" style="fill:rgb(255,255,255);" /></svg>') 0 0 no-repeat;
	  width: 18px;
	  height: 12px;
	  opacity: 0.35;
	}

	#titleBar .toggle:active:before {
	  opacity: 1;
	}

	/* Off-Canvas-Navigation */

	#navPanel {
	  background-image: linear-gradient(to right, rgba(0, 0, 0, 0) 95%, rgba(0, 0, 0, 0.075));
	  box-shadow: inset -1px 0px 0px rgba(0, 0, 0, 0.15);
	}

	#navPanel:before {
	  content: "";
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  background-image: url("images/bg01.png");
	  opacity: 0.2;
	  pointer-events: none;
	}

	#navPanel nav {
	  position: relative;
	  z-index: 1;
	}

	#navPanel .link {
	  display: block;
	  color: #999;
	  font-size: 1.1em;
	  text-decoration: none;
	  padding: 0 1.25em 0 1em;
	  line-height: 44px;
	  height: 44px;
	  border-top: solid 1px rgba(255, 255, 255, 0.075);
	  overflow: hidden;
	  text-overflow: ellipsis;
	  white-space: nowrap;
	  width: 100%;
	}

	#navPanel .link:first-child {
	  border-top: 0;
	}

	#navPanel .indent-1 {
	  display: inline-block;
	  width: 0.75em;
	}

	#navPanel .depth-0 {
	  color: #fff;
	  font-weight: 700;
	}

	/* Wrappers */

	#header-wrapper {
	  display: none;
	}

	.homepage #header-wrapper {
	  display: block;
	}

	#main-wrapper {
	  margin: 2em 0em 1em 0em !important;
	  padding: 15px 15px;
	}

	.homepage #main-wrapper {
	  margin-top: 3em !important;
	}

	#footer-wrapper {
	  overflow: hidden;
	  padding: 15px 15px;
	}

	#header,
	#nav {
	  display: none;
	}

	/* Banner */

	#banner {
	  margin: 0 auto;
	  padding: 4em 0;
	}

	#banner h2 {
	  line-height: 1.5em !important;
	  font-size: 2em;
	  margin: 0 0 0.25em 0;
	  padding: 0 50px 0 50px;
	}

	#banner p {
	  line-height: 1.75em !important;
	  font-size: 1.1em;
	  padding: 0 20px 0 20px;
	}

	/* Footer */

	#footer {
	  margin: 3em 0em !important;
	}

	#footer section {
	  margin-bottom: 3em !important;
	}

	#footer header {
	  margin-bottom: 2em;
	}

	#footer header h2 {
	  font-size: 1.3em;
	}

	#footer .button {
	  margin-top: 2em;
	}

	#footer-links {
	  margin-top: 3em;
	}

	/* Main */

	#main section {
	  margin-bottom: 3em !important;
	}

	#main header {
	  margin-bottom: 3em;
	}

	#main header h2 {
	  font-size: 1.3em;
	}

	#main .image.left {
	  float: none;
	  display: block;
	  width: 100%;
	}

	/* Intro */

	#intro {
	  margin: 1em 0em 0em 0em !important;
	  padding: 40px;
	}

	#intro h3 {
	  margin: 0 0 1em 0;
	}

	#intro section {
	  border-top: 2px solid rgba(144, 144, 144, 0.25);
	  margin-bottom: 3em !important;
	  padding-top: 3em;
	}

	#intro section.first {
	  border-top: 0;
	  padding-top: 0;
	}

	/* Featured */

	#featured {
	  margin: 3em 0em 1em 0em !important;
	  padding: 15px 15px;
	}

	#featured section {
	  margin-bottom: 3em !important;
	}

	#featured header {
	  margin-bottom: 2em;
	}

	#featured header h2 {
	  line-height: 1.75em;
	  font-size: 1.8em;
	}

	/* Copyright */

	#copyright {
	  overflow: hidden;
	  font-weight: 400;
	}

	#copyright span {
	  margin-top: 2em;
	  padding: 1.8em 2em;
	  line-height: 2em;
	  font-size: 0.9em;
	}
}
