@media screen 
{
	body
	{
		font:400 10px/18px Arial, sans-serif;
		background:#242424 url(../images/bg-body.jpg) center 84px no-repeat;
	}

	::selection {background: #ccc;}
	::-moz-selection {background: #ccc;}
.image {margin:0px 0 15px 0; }
	.imageRight { float:right; margin:5px 0 15px 15px; }
.imageLeft { float:left; margin:5px 15px 15px 0; border:5px solid #2b292d}
	.last {margin-right:0px;}
	.highlight {font-size:1.077em; font-weight: bold;}
	.green {color:#6abe28}

.pdf									{ padding:0 0 10px 26px; background:url(../images/icon-pdf.gif) no-repeat;}

#content div.border:last-child {display:none;}


	.container
	{
		width:960px;
		margin:0 auto;
		position: relative;
	}
	h1, h2, h3, h4, h5, h6
	{
		margin-bottom: 1em;
		text-rendering: optimizeLegibility;/* optimize text kerning */
	}

	h1 {font-size:3em; text-transform: uppercase; font-weight: bold; line-height: 100%;}
	h1 span {font-size:0.467em; display: block; font-weight: normal;}
	h2 {font-size:1.8em; color:#6abe28}
	h3 {font-size:1.5em}
	h4 {font-size:1.5em}
	h4#datenschutzbestimmungen {margin-top: 2em}
	h5 {font-size:1.2em}
	h6 {font-size:1em}
	
	

	/* ALL NAVIGATIONS */
	nav ul,	.navi
	{
		list-style:none;
	}
	.navi a
	{
		display:block;
	}


	/*=HEADER */	

	header {width: 932px; margin: 0 auto; background:url(../images/bg-nav.jpg) top left repeat-x; height:87px; width:100%;}
	header a.kawasakiLogo {float: left; margin: 1.8em 0 0 0;}
	header a.facebookLogo {float: right; margin:2.1em 0 0 0;}
	section.headerSubNav {background:white; width: 100%}/*=for subpages - not index.php */

	/*=NAVIGATION MAIN */

	#navi {position: relative; margin: 2.1em 0 0 0; float: right;}
	#navi:after {background:#3f3e3e; height: 7px; width: 1px; content: ''; position: absolute; right:11px; top:5px;}
		#navi > li {float:left; margin-right: 2.2em}
			#navi > li > a {color: white; text-decoration: none; font-size:1.5em;}
			#navi > li > a:hover, 
			#navi > li > a.active {color: #53b000; -webkit-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -moz-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -ms-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -o-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1)}

	/*=Tel Number and Branding for index.php*/

	.telNumberAndBranding {font-family:'arialblack'; background-color: rgba(0,0,0,0.59); padding:1em 0.8em; font-size: 2.4em; color:white; margin-top:2.4em; margin-bottom: 1px}
	.telNumberAndBranding span.tel {
    background-color: rgba(0, 0, 0, 0.5);
    display: block;
    float: left;
    padding: 1%;
    position: absolute;
    right: 0;
    top: 400px;
    z-index: 100;
}


	/*=Tel Number and Branding for subpages*/
	section.headerSubNav .telNumberAndBranding {font-family:'arialblack'; background-color:white; padding:1em 0; font-size:1.5em; color:black; margin-top:0; margin-bottom: 1px}
	section.headerSubNav .telNumberAndBranding span.tel {display: block; float: right; position:relative; padding:0%; background-color: transparent; top:0}


	/*=TEASER */

	#teaser {margin-top: 2.5em}
	#teaser .box a {text-decoration: none; text-transform: uppercase; font-size:1.6em; font-weight:bold; position: relative; color:black; text-align: center; display: block;}
	#teaser .box a img {display: block;}
	#teaser .box a span.text {padding: 1.5em 0 1.3em 0; background-color: white; display: block; position:relative;}
	#teaser .box a span.text:after {content:''; position:absolute; bottom:-7px; left:5px;border-style: solid; border-width: 7px 7.5px 0 7.5px; border-color: #fff transparent transparent transparent;}
	#teaser .box a span.plusIcon {bottom: 52px; padding: 0.4em 0 0 0; width:38px; height:38px; -webkit-border-radius: 19px; -moz-border-radius: 19px; border-radius: 19px; background-color:black; font-size: 1.500em; position: absolute; margin-left: -19px; left:50%; color:white;}
	#teaser .box a:hover span.text {background-color:black; color:white; -webkit-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -moz-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -ms-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -o-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1)}
	#teaser .box a:hover span.text:after {border-color: #000 transparent transparent transparent;-webkit-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -moz-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -ms-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -o-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1)}
	#teaser .box a:hover span.plusIcon {background-color:white; color:#6abe28;-webkit-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -moz-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -ms-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -o-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1) }

	/*=CONTENT */

	#main p, #main ul, #main ol, #main dl, #main table, .floatList
	{
		margin-bottom:2em;
		font-size:1.3em;
	}
	
	#main {color:white; width: 828px; margin:5.5em auto 0 auto;}
	body.index #main {color:white; width: 828px; margin:9.5em auto 0 auto;}
	#content {width: 508px}
	#content a {color:#6abe28;}
	#content a:hover {text-decoration: none;}
	#content ul li {list-style: none; position: relative; font-style: italic; padding: 0 0 0 1em; margin:0 0 1em 0}
	#content ul li:before {content:'»'; position:absolute; left:0}
	#content .border {background:url(../images/content-border.jpg); margin:3em auto 3em auto; height: 2px; width: 32px}

	/*=SIDEBAR */

	#sidebar {float: right; position: relative;margin: 3.8em 0 0 0;}
	#sidebar:before,
	#sidebar:after {content: ''; position: absolute; width:1px; height: 286px; left: -36px; top: 65px; background:#5b5b5b;}
	#sidebar:after {left: -31px}
	#sidebar .border {height: 1px; width:33px; background:#5b5b5b; display: block; margin: 0 auto 2.5em auto;}
	#sidebar span.headline {text-transform: uppercase; font-size: 1.8em; font-weight: bold; margin: 0 0 0.8em 0; display: block;}
	#sidebar p, #sidebar table {font-size: 1.3em; line-height: 175%; margin-bottom: 1.6em}
	#sidebar a {color:white}
	#sidebar a:hover {text-decoration: none;}
	#sidebar table caption {font-size: 1.077em; font-weight: bold; text-align: left;}

	/*=FOOTER */

	footer {position: relative; margin-top: 10em}
	footer a {color:white;text-decoration: none;}
	footer section {background-color:black; border-top:4px solid #6abe28; }
	footer section.infos {padding: 7.9em 0 0 0; height:228px; }
	footer section.infos a:hover {color:#6abe28; -webkit-transition: color 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -moz-transition: color 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -ms-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -o-transition: color 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); transition: color 0.3s cubic-bezier(0.5, 0.0, 0.2, 1) ;text-decoration: none;}
	footer section.infos .container img {float: left; display: block; margin-top: 0.5em;}
	footer section.infos .container p {line-height: 185%; font-family:'arialblack'; font-size:1.6em; color:white; display: block; float: left; position: relative; margin: 0 0 0 4em;}
	footer section.infos .container p.borderLeft:before {position: absolute; border-left: 4px double #5b5b5b; content:''; height:13px; left: -36px; top: 26px;}
	footer section.infos .container p span {font-size:1.875em; display: block;}
	
	footer iframe#googleMaps {width: 100%; height:357px; margin:0 auto; border:none; display: block;}
	footer a.googleMapsLink {top: 116px; text-align:center; width:212px; height:54px; position: absolute; text-transform: uppercase; background:#6abe28; border-bottom: 3px solid black; padding:1.25em 0 0 0; font-weight: bold; font-size: 1.4em; position: absolute; left: 50%; margin-left:-106px;}
	footer a.googleMapsLink:hover {color:black;background:white;-webkit-transition: color 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -moz-transition: color 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -ms-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -o-transition: color 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); transition: color 0.3s cubic-bezier(0.5, 0.0, 0.2, 1) ; text-decoration: none;}
	footer .container {}

	/*=NAVIGATION ADDITIONAL */
	#naviAdd {padding: 1.5em 0; display: block; width: 174px; margin:0 auto;}
		#naviAdd > li {float: left;}
			#naviAdd > li > a {font-size: 1.4em; text-transform: uppercase; font-weight: bold;}
			#naviAdd > li > a:after {content: '.'; padding:0 0.5em; color: white}
			#naviAdd > li:last-child > a:after {content: ''; padding:0}
			#naviAdd > li > a:hover,
			#naviAdd > li > a.active {color:#6abe28; -webkit-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -moz-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -ms-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); -o-transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1); transition: all 0.3s cubic-bezier(0.5, 0.0, 0.2, 1)}

}