/*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */button,hr,input{overflow:visible}progress,sub,sup{vertical-align:baseline}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{padding:.35em .75em .625em}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}[hidden],template{display:none}

/*! colorbox */
#colorbox,#cboxOverlay,#cboxWrapper{position:absolute;top:0;left:0;z-index:9999;overflow:hidden;-webkit-transform:translate3d(0,0,0)}#cboxWrapper{max-width:none}#cboxOverlay{position:fixed;width:100%;height:100%}#cboxMiddleLeft,#cboxBottomLeft{clear:left}#cboxContent{position:relative}#cboxLoadedContent{overflow:auto;-webkit-overflow-scrolling:touch}#cboxTitle{margin:0}#cboxLoadingOverlay,#cboxLoadingGraphic{position:absolute;top:0;left:0;width:100%;height:100%}#cboxPrevious,#cboxNext,#cboxClose,#cboxSlideshow{cursor:pointer}.cboxPhoto{float:left;margin:auto;border:0;display:block;max-width:none;-ms-interpolation-mode:bicubic}.cboxIframe{width:100%;height:100%;display:block;border:0;padding:0;margin:0}#colorbox,#cboxContent,#cboxLoadedContent{box-sizing:content-box;-moz-box-sizing:content-box;-webkit-box-sizing:content-box}#cboxOverlay{background:#000;opacity:.9;filter:alpha(opacity = 90)}#colorbox{outline:0}#cboxContent{margin-top:20px;background:#000}.cboxIframe{background:#fff}#cboxError{padding:50px;border:1px solid #ccc}#cboxLoadedContent{border:5px solid #000;background:#fff}#cboxTitle{position:absolute;top:-20px;left:0;color:#ccc}#cboxCurrent{position:absolute;top:-20px;right:0;color:#ccc}#cboxLoadingGraphic{background:url(images-colorbox/loading.gif) no-repeat center center}#cboxPrevious,#cboxNext,#cboxSlideshow,#cboxClose{border:0;padding:0;margin:0;overflow:visible;width:auto;background:none}#cboxPrevious:active,#cboxNext:active,#cboxSlideshow:active,#cboxClose:active{outline:0}#cboxSlideshow{position:absolute;top:-20px;right:90px;color:#fff}#cboxPrevious{position:absolute;top:50%;left:5px;margin-top:-32px;background:url(images-colorbox/controls.png) no-repeat top left;width:28px;height:65px;text-indent:-9999px}#cboxPrevious:hover{background-position:bottom left}#cboxNext{position:absolute;top:50%;right:5px;margin-top:-32px;background:url(images-colorbox/controls.png) no-repeat top right;width:28px;height:65px;text-indent:-9999px}#cboxNext:hover{background-position:bottom right}#cboxClose{position:absolute;top:5px;right:5px;display:block;background:url(images-colorbox/controls.png) no-repeat top center;width:38px;height:19px;text-indent:-9999px}#cboxClose:hover{background-position:bottom center}


/*! HTML5 Boilerplate v5.0 | MIT License | http://h5bp.com/ */
html
{
	box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
   
/* Grid12
--------------------------------------------------------------------------- */

.grid-container
{
	width: 100%;
	margin-top: 1em;
}

.row:before, 
.row:after
{
	clear: both;
	content: "";
	display: table;
}

[class*='col-']
{
	float: left;
	min-height: 1px;
	width: 8.33333333333%;
	padding: 15px;
}

.col-1 { width: 8.33333333333%; }
.col-2 { width: 16.6666666667%; }
.col-3 { width: 25%; }
.col-4 { width: 33.3333333333%; }
.col-5 { width: 41.6666666667%; }
.col-6 { width: 50%; }
.col-7 { width: 58.3333333333%; }
.col-8 { width: 66.6666666667%; }
.col-9 { width: 75%; }
.col-10 { width: 83.3333333333%; }
.col-11 { width: 91.6666666667%; }
.col-12 { width: 100%; }

.right
{
	float: right;
	margin-left: 10px;
}

.center
{
	float: none;
	margin-left: auto;
	margin-right: auto;
}

.gap
{
	margin-right: 10px;
}

.grid-container .test
{
	background-color: #FFDCBB;
	color: #fff;
	height: 100px;
}

/* Links
------------------------------------------------------------------------------------------------- */

a,
a:visited
{
	text-decoration: none;
}

a:hover,
a:focus,
a:active { text-decoration: none; opacity: 0.5; }

/* Silbentrennung
-------------------------------------------------- */
main
{
	-moz-hyphens: auto;
	-o-hyphens: auto;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}

/* Fonts
-------------------------------------------------- */


/* Schriftarten
------------------------------------------------------------------------------------------------- */
body
{
	font-family: "ff-din-web-1", "ff-din-web-2", Verdana, Geneva, Helvetica, Arial, sans-serif;
}

/* Schriftgrößen
-------------------------------------------------- */

html
{ 
	font-size: 1.2rem;
	line-height: 1.5;
	-webkit-text-size-adjust: 100%;
}

/* Farben
------------------------------------------------------------------------------------------------- */
/* Magenta: #EC008C */

.color
{
	color:  #EC008C;
}


body
{
	background-color: #fff;
}

a,
a:visited
{
	color: #EC008C;
	text-decoration: none;
}

nav
{
	background-color: #EC008C;
}

nav a,
nav a:visited
{
	color: #fff;
} 

#streng-dich-an nav .streng-dich-an,
#beeil-dich nav .beeil-dich,
#sei-perfekt nav .sei-perfekt,
#sei-stark nav .sei-stark,
#machs-recht nav .machs-recht,
#datenschutzerklaerung nav .datenschutzerklaerung
nav a:hover,
nav a:focus,
nav a:active 
{ 
	color: #000;
	opacity: 1;
}

.nav-service .antreiber
{
	color: #EC008C;
}

#antreiber .nav-service .antreiber
{
	color: #B40767;
	opacity: 1;
}

#impressum .nav-service .impressum,
#datenschutzerklaerung .nav-service .datenschutzerklaerung
{
	color: #000;
	opacity: 1;
}

/* Layout
------------------------------------------------------------------------------------------------- */

body
{
	padding: 0 0 50px 0;
	margin: 0;
}

.wrapper
{
	background: #fff;
	margin: 0 auto;
	max-width: 1200px;
	padding-right: 10px;
	padding-left: 10px;
	padding-bottom: 2em;
}

/* Pentagon
--------------------------------------------------------------------------- */

.pentagon
{
	background-color: #fff;
	margin: 0 auto;	
	width: 1000px;
	height: 1000px;
  	justify-content: center; // horizontal zentriert
   	align-items: center;     // vertikal zentriert
   	outline: 1px solid #fff;
  	overflow: hidden;
}

.pentagon svg
{
	position: relative;
}

#streng-dich-an .pentagon svg
{
	transform:rotate(72deg);
	margin-top: 3.5%;
	left: 5%;
}

#beeil-dich .pentagon svg
{
	transform:rotate(-216deg);
	margin-top: 9%;
	left: 3%;
}

#sei-perfekt .pentagon svg
{
	transform:rotate(216deg);
	margin-top: 9%;
	left: -2.6%;
}

#sei-stark .pentagon svg
{
	transform:rotate(288deg);
	margin-top: 3.4%;
	left: -4.3%;
}

#machs-recht .pentagon svg
{
	transform:rotate(0deg);
	left: .5%;
}


/* Headlines
--------------------------------------------------------------------------- */

h1 
{ 
	font-size: 1.8em; 
	margin-top: 2em;
}

h2
{
	font-size: 1.4em;
	margin: 0 0 0.5em 0;
}

h3
{
	font-size: 1.2em;
	margin: 2em 0 0 0;
}

/* Bilder
--------------------------------------------------------------------------- */
img
{
	max-width: 100%;
	height: auto;
}

figure
{
	margin: 0;
}

figcaption
{
	font-size: .8em;
}

figure img
{
	width: 100%
}

figure.border img
{
	border: 1px solid #ccc;
}

/* Navigation
--------------------------------------------------------------------------- */

nav
{
	text-align: center;
	padding: 0 50px;
	width: 100%;
	left: calc(50%;)
}

nav ul
{
	margin: 0 auto;
	padding: .4em 0 0.3em 0; 
}

nav li
{
	display: inline;
}

nav a,
nav a:visited
{
	font-weight:700; 
	text-decoration: none;
	padding: 0 1em 0 0;
}


/* Main
--------------------------------------------------------------------------- */

main ul
{
	padding-left: 0;
	list-style: none;
}

main li
{
	margin-bottom: .5em;
}

.liste-mit-bullets
{
	list-style-type: disc;
}

.liste-mit-bullets li
{
	margin-left: 1em;
}

.antreiberliste li
{
	margin-bottom: 1em;
}

table.preise

{
	max-width: 90%;
}

table.preise td
{
	vertical-align: top;
}

table.preise thead
{
	display: none;
}

table.preise tr.abstand td
{
	padding-top: 1em;
}

/* Webdesigner
-------------------------------------------------- */

#webdesigner
{
	font-size: 12px;
	margin-top: 5em;
	margin-bottom: 3em;
}

#webdesigner .logo { float: left; }

#webdesigner .logo img
{
	width: 60px;
	height: auto;
	margin-right: 5px;
}

#webdesigner a,
#webdesigner a:visited
{
	color: #444;
	text-decoration: none;
	display: inline !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* Footer
--------------------------------------------------------------------------- */

footer a,
footer a:visited
{
	color: #666;
	padding: 6px 0 6px 0;
	text-decoration: none;
}

footer a:hover,
footer a:focus,
footer a:active { color: #222; }

footer a[href^="tel"]:link,
footer a[href^="tel"]:visited
{
    color: #999 !important;
}


/* up
-------------------------------------------------- */

.up { margin: 2em 15px; }

/* Servicemenü
-------------------------------------------------- */

.nav-service
{
	clear: both;
	text-align: right;
}

.nav-service ul { padding: 0; }
.nav-service li { display: inline; }

.nav-service a,
.nav-service a:visited
{
	padding: 6px 1em 6px 0;
	text-decoration: none;
}

/* 1200px
--------------------------------------------------------------------------- */

@media only screen and (max-width: 1200px)
{
	.pentagon
	{
		max-width: 600px;
		max-height: 600px;
	}
}

/* 650px
--------------------------------------------------------------------------- */

@media only screen and (max-width: 650px)
{

	.col-1 { width: 33.33%; }
	.col-2 { width: 50%; }
	.col-3 { width: 50%; }
	.col-4 { width: 100%; }
	.col-5 { width: 100%; }
	.col-6 { width: 100%; }
	.col-7 { width: 100%; }
	.col-8 { width: 100%; }
	.col-9 { width: 100%; }
	.col-10 { width: 100%; }
	.col-11 { width: 100%; }
	.col-12 { width: 100%; }
	
	nav a,
	nav a:visited { padding: 0.5em 0.5em; }
		
	nav.hideit { display: none; }
	nav { width: 100% !important; }
	
	nav ul { width: 100% !important; }
	
	nav li
	{
		float: none !important;
		display: block !important;
		width: 100% !important;
		padding: 0;
		margin: 0;
	}
		
	.pentagon
	{
		max-width: 400px;
		max-height: 400px;
	}
	
	table.preise
	{
		max-width: 100%;
	}

}

/* 600
--------------------------------------------------------------------------- */
@media only screen and (max-width: 600px)
{
	.col-1 { width: 50%; }
	.col-2 { width: 100%; }
	.col-3 { width: 100%; }
	.col-4 { width: 100%; }
	.col-5 { width: 100%; }
	.col-6 { width: 100%; }
	
	.pentagon
	{
		max-width: 300px;
		max-height: 300px;
	}
	
	.wrapper
{
	padding-right: 5px;
	padding-left: 5px;
}

.nav-service li
	{
		float: none;
		display: block;
		width: 100% !important;
		padding: 0;
		margin: 0;
		text-align: center;
	}

}
/* 480px
--------------------------------------------------------------------------- */

@media only screen and (max-width: 480px)
{
	main { margin: 40px 5px 20px 5px; }
	
	.pentagon
	{
		max-width: 300px;
		max-height: 300px;
	}
}

/* 320px
--------------------------------------------------------------------------- */

@media only screen and (max-width: 320px)
{
	nav
	{
		font-size: 18px;
		line-height: 2em;
	}
	
	nav li { display: block; }
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

.hidden
{
	display: none !important;
	visibility: hidden;
}

.visuallyhidden
{
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus
{
	clip: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	position: static;
	width: auto;
}

.invisible { visibility: hidden; }

.clearfix:before,
.clearfix:after
{
	content: " ";
	display: table;
}

.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }

.nowrap { white-space: nowrap; }

/* ==========================================================================
   Print styles
   ========================================================================== */

@media print
{
	*,
	*:before,
	*:after
	{
		background: transparent !important;
		color: #000 !important;
		box-shadow: none !important;
		text-shadow: none !important;
	}
	
	a,
	a:visited { text-decoration: underline; }
	a[href]:after { content: " (" attr(href) ")"; }
	abbr[title]:after { content: " (" attr(title) ")"; }
	a[href^="#"]:after,
	a[href^="javascript:"]:after { content: ""; }

	pre,
	blockquote
	{
		border: 1px solid #999;
		page-break-inside: avoid;
	}

	thead { display: table-header-group; }
	tr,
	img { page-break-inside: avoid; }
	img { max-width: 100% !important; }

	p,
	h2,
	h3
	{
		orphans: 3;
		widows: 3;
	}

	h2,
	h3 { page-break-after: avoid; }
}