/*
	* Gridless version 2.0

	* Credit is left inline and big thanks to Nicolas Gallagher and Jonathan Neal

	* Across this document we use safe CSS hacks: http://mathiasbynens.be/notes/safe-css-hacks
	* Selectors beggining with an underscore (_selector: property) target only IE6
	* Selectors beggining with an asterisk (*selector: property) target only IE6 and IE7
*/

/* HTML5 display definitions
---------------------------------------- */

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, dialog {
	display: block;
}

/* Corrects inline-block not defined in IE6/7/8 and FF3 */
audio, canvas, video {
	display: inline-block;
	*display: inline;
	*zoom: 1;
}

audio:not([controls]) {
	display: none;
}

/* Ensures content is hidden from all presentations, including screenreaders */
[hidden] {
	display: none;
	visibility: hidden;
}

/* Base structure
---------------------------------------- */

/*
	* The body will work like a 'div#wrapper' (for this to work, the 'body' needs to have a set width)

	* To add a background to the PAGE, set it in the 'html' element
	* To add a background to the WRAPPER, set it in the 'body' element
*/
html {
	height: 100%;
	font-size: 100%;
	overflow-y: scroll; /* Force a scrollbar in non-IE */
	-webkit-text-size-adjust: 100%; /* Prevent iOS text size adjust on orientation change without disabling user zoom */
	-ms-text-size-adjust: 100%;
}

body {
	margin: 0 auto;
	height: 100%;
    min-width: 1100px; /* Für mobile wieder wegnehmen! */
}

/* Fonts settings based on the 100E2R standard: http://www.informationarchitects.jp/en/100e2r/ */
body, button, input, select, textarea {
	font: 1em/1.625 'Lato', sans-serif;
	color: #252525; /* Full black on white is too much contrast, #222 is a better default */
}

/* Add and/or remove tags as your baseline grid needs */
p, blockquote, q, pre, address, hr, code, samp, dl, ol, ul, form, table, fieldset, menu, h4, h5, h6, img, figure, figcaption, button, hr {
	margin: 0 0 1.625em;
}

/* Headings/small
---------------------------------------- */

/*
	* Font sizes are based on the golden ratio of 16
	* See this for the modular scale: ow.ly/5jGl6
	* Line-heights and margins are adjusted to keep a 26px (1.625em) vertical rhythm across elements 
*/

h1, h2, h3, h4, h5, h6 {
	font-family: 'Lato', sans-serif;
	font-size: 1 em;
	
}

h1 {
	font-size: 3em; /* 68px */
	line-height: 1.1471em;
	margin: 0 0 0.3824em;
    font-weight: 900;
    text-align:center;
    text-transform:uppercase;
    letter-spacing: 4px;
}

h2 {
	font-size: 2.625em; /* 42px */
	line-height: 1.2381em;
	margin: 0 0 0.619em;
    
}

h3 {
	font-size: 2em; /* 26px */
	line-height: 1em;
	margin: 0 0 1em;
    color: #d2232a;
    font-weight: 300;
    text-align:center;
    text-transform:uppercase;    
    letter-spacing: 2px;
}

h4 {
	font-size: 1.6em; /* 26px */
	line-height: 1em;
	margin: 0 0 2em;
    font-weight: 300;
    text-align:center;
    text-transform:uppercase;
    text-shadow:
    -2px -2px 0 white,
    2px -2px 0 white,
    -2px 2px 0 white,
    2px 2px 0 white;
    letter-spacing: 1px;
}

#sectionTitle span{
	font-size: 1.2em; /* 26px */
	line-height: 1em;
	margin: 0;
    padding: 5px 10px;
    background-color: white;
    font-weight: 700;
    text-align:center;
    text-transform:uppercase;
    letter-spacing: 1px;
}

small {
	font-size: 0.625em; /* 10px */
	margin: 0 0 2.6em;
}

/* Preformatted text and code
---------------------------------------- */

/* Allows line wrapping of 'pre' */
pre {
	white-space: pre;
	white-space: pre-wrap;
	word-wrap: break-word;
}

pre, code, kbd, samp {
	font: 1em/1.625em Menlo, Consolas, 'DejaVu Sans Mono', Monaco, 'Courier New', Courier, monospace;
}

/* Tables
---------------------------------------- */

table {
	border-collapse: collapse;
	border-spacing: 0;
}

th {
	text-align: left;
}

tr, th, td {
	padding-right: 1.625em;
}

/* Forms
---------------------------------------- */

form {
	margin: 0;
}

fieldset {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
	vertical-align: top;
}

legend {
	border: 0;
	*margin-left: -7px;
}

button, input, select, textarea {
	vertical-align: baseline;
	*vertical-align: middle;
}

button, input {
	line-height: normal;
	*overflow: visible;
}

button, input[type="button"], input[type="reset"], input[type="submit"] {
	cursor: pointer;
	-webkit-appearance: button;
}

input[type="checkbox"], input[type="radio"] {
	box-sizing: border-box;
}

input[type="search"] {
	-webkit-appearance: textfield;
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
}

input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

button::-moz-focus-inner, input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

/* Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7 */
table button, table input {
	*overflow: auto;
}

/* Quotes
---------------------------------------- */

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
}

blockquote, q, cite {
	font-style: italic;
}

blockquote {
	padding-left: 1.625em;
	border-left: 1px solid #ddd;
}

blockquote > p {
	padding: 0;
}

/* Lists
---------------------------------------- */

ul, ol {
	list-style-position: inside;
	padding: 0;
}

li ul, li ol {
    /*margin: 0 1.625em;*/
    margin: 0;
}

dl dd {
	margin-left: 1.625em;
}

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

a, a:visited {
	text-decoration: none;
	color: #d2232a;
    font-weight:600;
}

a:hover {
	color: #ed1c24;
}

a:focus {
	outline: thin dotted;
}

/* Better CSS outline suppression: people.opera.com/patrickl/experiments/keyboard/test */
a:hover, a:active {
	outline: none;
}

/* Figures
---------------------------------------- */

figure {
	margin: 0;
}

/* Embedded content
---------------------------------------- */

img, object, video {
	max-width: 100%; /* Automatically scales images larger than the container. Consider this first: http://unstoppablerobotninja.com/entry/fluid-images/ */
	/* _width: 100%; /* IE6 doesn't support max-width, so we just use width. If the image is larger than the container, just uncomment this. If it is smaller than the container, uncomment and change the 100% value to an absolute one */
}

img {
	border: 0;
	-ms-interpolation-mode: bicubic; /* Improve IE's resizing of images: css-tricks.com/ie-fix-bicubic-scaling-for-images */
}

/* Corrects overflow displayed oddly in IE9 */
svg:not(:root) {
	overflow: hidden;
}

/* Abbreviations
---------------------------------------- */

abbr[title], dfn[title] {
	border-bottom: 1px dotted;
	cursor: help;
}

/* Marked/inserted/deleted text
---------------------------------------- */

mark {
	background: #ff0;
}

ins {
	text-decoration: none;
	background: #ff9;
}

del {
	text-decoration: line-through;
}

/* Others
---------------------------------------- */

hr {
	display: block;
	height: 1px;
	border: 0;
	border-bottom: 1px solid #ddd;
}

strong, b, dt {
	font-weight: 700;
}

dfn {
	font-style: italic;
}

var, address {
	font-style: normal;
}

/* Position 'sub' and 'sup' without affecting line-height: gist.github.com/413930 */
sub, sup {
	font-size: 0.625em;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

/* Helper classes
---------------------------------------- */

/*
	* Micro clearfix hack, more semantically titled with 'group'
	* Source: nicolasgallagher.com/micro-clearfix-hack/
*/
.group:before, .group:after {
	content: "";
	display: table;
}

.group:after {
	clear: both;
}

.group {
	*zoom: 1;
}

/* Primary styles
---------------------------------------- */


/* Menu */

#header{
    background: #d2232a;
    
}

#logo{
    float:left;
    max-height: 49px;
    padding: 10px;
}

#menu {
	list-style: none;
}

#menu li{
    float: right;    
    position: relative;
    line-height: 69px;
}

#menu a{
	float: left;
	height: 69px;
	padding: 0 15px;
	color: white;
    font-size: 0.9em;
	text-transform: uppercase;
	text-decoration: none;
}

#menu li:hover > a{
	color: white;
    background: #ed1c24;
}

#menu li:hover > ul{
	display: block;
}

#menu img{
    position:relative;
    top: 20px;
}

.menuIcon{
    border-left: 1px solid #e78b8f;
}

/* Sub-menu */

#subMenu_top{
    line-height: 2 !important;
    padding: 0 10px;
    margin: 0;    
    text-transform: uppercase;
    color: #949494;
    border-top: 10px solid #d2232a;    
}

#subMenu_p{
    line-height: 2 !important;
    padding: 0 10px;
    margin: 0;    
    text-transform: uppercase;
    color: #949494;   
}

#subMenu_adr{
    padding: 0 10px;
    margin: 6px 0 0 0;    
    text-transform: uppercase;
    color: #d2232a;   
}

.adrMenu{
    margin: 5px 0;
    padding: 0px 50px 0px 10px;
    display: block;
    white-space: nowrap;
    float: none;
}

#menu ul{
    list-style: none;       
    display: none;
    position: absolute;
    top: 69px;
    left: -105px;
    z-index: 99999; 
    color: black;
    background: white;
    border: 1px solid #dfdfdf;
    box-shadow: 1px 1px 8px 0px #e7e7e7;
}

#menu ul ul
{
  top: -9px;
  left: 164px;
}

#menu ul li{
    float: none;
    line-height: 1;    
    display: block;  
}

#menu ul ul li:last-child a{   
    border: none;
}

#menu ul a, #menu ul p{    
    margin: 10px 0;
    padding: 5px 75px 5px 10px;
    height: auto;
    color: black;
    text-transform: uppercase;
    line-height: 1;
    display: block;
    white-space: nowrap;
    float: none;
    border-bottom: 1px solid #dfdfdf;
}

.sub{
    font-size: 0.8em;
    text-transform:none !important;
    border-bottom: none !important;
    padding: 2px 20px 2px 10px !important;
    margin: 3px 0 !important;
}

#menu ul a:hover{
    background: #d2232a;
}

#menu ul li:first-child a{

}

#subMenu_top:after{
    content: '';
    position: absolute;
    right: 15px;
    top: -18px;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 8px solid #d2232a;
}

#menu ul li:first-child a:hover:after{
    border-bottom-color: #d2232a; 
}

#menu ul li:last-child a{

}

#email{
    left: -237px !important;
}

#adresse{
    left: -284px !important;
}

/* Clear floated elements */
#menu:after{
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}


#content {
    max-width: 1100px;
    min-height: 100%;
	height: auto !important;
	height: 100%;
	margin: 0 auto -75px; /* the bottom margin is the negative value of the footer's height */
}

#mainTitle{
    max-width: 800px;
    margin: 50px auto 20px auto;
}

#sectionTitle{
    margin: 20px 0;
    cursor:pointer;
    outline: 0;
}

#sectionTitle hr{
    margin: 0;
    z-index: -1;
    position:relative;
    top: 16px;
}

.outer{
    display:inline-block;
    position:relative;
    left:50%;
}

.inner{
    position:relative;
    left:-50%;
    font-size: 1.2em; /* 26px */
	line-height: 1em;
    padding: 5px 10px;
    background-color: white;
    font-weight: 700;
    text-align:center;
    text-transform:uppercase;
    letter-spacing: 1px;
}

#newsletter_button {
    margin: 0;   
}

#accordion{
    padding-bottom: 15px;
}

#accordion .inner:hover{
    color: #d2232a;
}

#contentSystem{    
    margin: 0 25px;
}

#contentSystem p{
    font-size: 1.2em;
    text-align:justify;
    max-width: 60%;
    float:left;
}

#contentSystem img{    
    display:block;
    margin: 0 auto;
}

#map_thur{
    position:absolute;
    left:50%;
    margin-left:-89px;
    top: 95px;
    z-index: -5;
}

#map_reihn{
    position:absolute;
    left:50%;
    margin-left:-76px;
    top: 85px;
    z-index: -5;
}

#map_muenster{
    position:absolute;
    left:50%;
    margin-left:-118px;
    top: 80px;
    z-index: -5;
}

#map_sauer{
    position:absolute;
    left:50%;
    margin-left:-99px;
    top: 75px;
    z-index: -5;
}

#partnerWrapper{
    width: 70%;
    margin: 0 auto;
    padding-top: 20px;
}

#partnerName{
	font-size: 1.4em; /* 68px */
	line-height: 0.6em;
	margin: 0 0 0.3824em;
    font-weight: 700;    
    float:left;
}

#partnerEmail{
    float:right;
    text-align:right;
    font-size: 1.5em;    
}

#partnerAdresse{
    clear:both;
    padding-top:15px !important;
    font-size: 1.2em;
    line-height: 0;
    margin: 0;
    padding:0;
    float:left;
}

#partnerPhone{
    float:right;
    padding-top:15px !important;
    font-size: 1.2em;
    text-align:right;
    line-height: 0;
    margin: 0;
    padding:0;
}

.clear{
    clear:both;
}

#newsWrapper{
    margin: 10px;
}

#newsWrapper img{
    float:left;
    margin: 0 15px 0 0;
    max-height: 150px;
    padding: 5px;
    border-radius: 4px;
    box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1);
}

#newsHead {
    font-size: 1.6em; /* 26px */
	line-height: 1em;
    font-weight: 300;
    text-transform:uppercase;
}

#datum {
    text-align: right;
    font-weight: 300;
}

#news {
    margin: 0 10px 15px 10px;
}

#contactButton{
    max-width:350px;
    margin: 20px auto;
    background: #d2232a;
    color: white;
    font-size: 2em;
    text-align:center;
}

#contactButton a, #angebotButton a{
    color: white;
}

#contactButton:hover, #angebotButton:hover{
    background: #ed1c24;
}

#angebotButton{
    max-width:350px;
    margin: 30px auto 0 auto;
    background: #d2232a;
    color: white;
    font-size: 1.5em;
    text-align:center;
}

#infoWrapper {
    font-size: 1em;
    width: 100%; 
    margin: 0 auto;
    white-space: nowrap;
    overflow: visible;
}

#map-canvas {
    height: 500px;
    width: 80%;
    margin: 0 auto;
    margin-bottom: 25px;
    padding: 5px;
    border-radius: 4px;
    box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1);
}

#map-canvas img{max-width: inherit;}

#infowindow_content{
    white-space: normal;
    line-height:1.35;
    overflow:hidden;
}

.col {
    position: relative;
    display: inline-block;

    vertical-align: top;
}

.col-content {
    white-space: normal;
}

.col1 {
    box-sizing:border-box;
    width: 33%;
    padding: 20px;
}
.col2 {
    box-sizing:border-box;
    width: 33%;
    padding: 20px;
}
.col3 {
    box-sizing:border-box;
    width: 33%;
    padding: 20px;
}

#infoHeader{
    font-size: 1.2em;
    font-weight: 600;
    text-transform:uppercase;
    padding-bottom: 10px;
    
}

#infoHeader2{
    font-size: 1.2em;
    font-weight: 600;
    
}

#infoHeaderSmall{
    font-size: 0.9em;
    font-weight: 600;
    padding-top: 10px;
    padding-bottom: 0px;
}

#infoWrapper p{
    padding: 0;
    margin: 0;
}

.small {
    font-size: 0.7em;
}

#links{
    float:left;
    width: 30%;
    text-align:left;
}

#rechts{
    float:right;
    width: 65%;
    text-align:left;
}

#links_m{
    float:left;
    width: 45%;
    text-align:left;
}

#rechts_m{
    float:right;
    width: 45%;
    text-align:left;
}

.center{
    text-align:center;
}

#preis{
    text-align:right;
}

#sytemTop{
    margin: 10px 8%;
    font-size: 1.2em;
}

#sytemTop p{
    font-weight: 600;
    margin: 5px;
}

#sytemList{
    list-style-position:outside;
    list-style-image: url(../img/list.png);
    margin-left: 35px;
}

#sytemList li{
    margin-bottom: 10px;
}

#Partner{
    width: 95%;
    margin: 0 auto;
    text-align:center;
}

#Partner img{
    margin: 15px 20px;    
}

#impressumH1{
    font-size: 2em;
    font-weight:600;
    color: #d2232a;
    text-align:center;
}

#impressumH2{
    font-size: 1.5em;
    color: #d2232a;
    text-align:center;
}

#impressumH3{
    font-size: 1.2em;
    font-weight:600;
}

#impressumTop p {
    margin: 0;
    text-align:center;
    font-size: 1.2em;
}

#contentImpressum{
    margin: 20px;
    font-size: 0.9em;
}

#contentAbout{    
    width: 80%;
    margin: 0 auto;
}

#contentRegion{
    text-align:justify;
    letter-spacing: 0.5px;
    width: 80%;
    margin: 0 auto;
}

#contentAbout p{
    font-size: 1.2em;
}

#aboutTitle{
    width: 70%;
    margin: 0 auto;
    font-size: 2.5em;
    padding-top: 20px;
    
}

#aboutH1{
    font-size: 1.5em;
    color: #d2232a;
}

#timyList{
    width: 70%;
    list-style-position:outside;
    list-style-image: url(../img/list.png);
    margin-left: 35px;
    float:left;
}

#timyList li{
    margin-bottom: 10px;
}

#timyImg{
    float:right;
    padding: 5px;
    border-radius: 4px;
    box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1);
    position:relative;
    top: -40px;
}

#timyImg2{
    width: 950px;
    margin:45px auto 0;
    padding: 5px;
    border-radius: 4px;
    box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1);
}

#appstore {
    background:  url(../img/appstore.png);
    width: 351px;
    height: 75px;
    margin: 15px auto;
    cursor: pointer;
}
#appstore:hover {
    background:  url(../img/appstore_hover.png);
}

#googleplay {
    background:  url(../img/googleplay.png);
    width: 351px;
    height: 75px;
    margin: 15px auto;
    cursor: pointer;
}
#googleplay:hover {
    background:  url(../img/googleplay_hover.png);
}

#angebotForm, #standorteForm{
    display: none;
    width: 400px;
    margin: 0 25px;    
}

#wegbackImg{
    float:right;
    position:relative;
    top: -40px;
    padding: 5px;
    border-radius: 4px;
    box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1);
}

#findelux_logo{
    width: 403px;
    margin: 60px auto 10px auto;
}

#findefluxList{
    width: 52%;
    list-style-position:outside;
    list-style-image: url(../img/list.png);
    margin-left: 35px;
    float:left;
}

#findefluxList li{
    margin-bottom: 10px;
}

#findefluxImg{
    float:right;
    position:relative;
    left: 50px;
    top: 20px;
    padding: 5px;
    border-radius: 4px;
    box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1);
}

#galerie {
    margin-top: 20px;
    text-align:center;
}

#galerie img{
    display: inline-block;
    padding: 5px;
    border-radius: 4px;
    box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1);
    margin: 10px 9px;
}

#pre {
    padding: 5px;
    border-radius: 4px;
    box-shadow: 0px 0px 5px 2px rgba(0, 0, 0, 0.1);
}

#angebotForm p, #standorteForm p{
    font-size: 1.6em;
    margin:15px 0;
    color: #d2232a;
    text-transform:uppercase;
    font-weight: 600;
    text-align:center;
}

.formstatuserror {
    text-transform:none;
    color: #ed1c24;
    font-weight: 400;
    font-size: 0.8em;
    text-align:left;
}

.formstatusok {
    text-transform:none;
    color: #21902b;
    font-weight: 400;
    font-size: 0.8em;
    text-align:left;
}

#auswahl label{
    display:block;
    margin: 5px 0 0 0;
}

#auswahl input, #auswahl select{
    width: 66%;
}

#auswahl textarea{
    height: 125px;
    width: 100%;    
}

.button{
    background: #d2232a;
    color: white;
    font-size: 1.5em;
    border: none;
    padding: 7px;
}

.button:hover {
    background: #ed1c24;
}

#spacer{
    height: 50px;
}

#push{
    height: 75px;
}

#footer{
    margin-top: 75px;
    background: #d2232a;
    height: 75px;
}

#footerLogo{
    width: 136px;
    height: 49px;
    margin: 0 auto;
    position:relative;
    top: -24px;
}

#copyright{
    color: white;
    text-align:center;
    position:relative;
    top: -18px;

}

/* Media queries
---------------------------------------- */

/* The media queries included in here are only placeholder. Modify them as your content requires */

@media only screen and (min-width: 480px) {
	/* Wide mobile (480px+) styles go here */
}

@media only screen and (min-width: 768px) { 
	/* Tablets/netbooks (768px+) styles go here */
}

@media only screen and (min-width: 1024px) { 
	/* Desktops (1024px+) styles go here */
}

/* Print styles
---------------------------------------- */

/* Print styles inlined to avoid extra HTTP connection */

@media print {
	* {
		background: transparent !important;
		color: black !important; /* Black prints faster: sanbeiji.com/archives/953 */
		text-shadow: none !important;
		filter: none !important;
		-ms-filter: none !important;
	}

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

	a[href]:after {
		content: " (" attr(href) ")";
	}

	abbr[title]:after {
		content: " (" attr(title) ")";
	}

	/* Do not show javascript and internal links */
	a[href^="javascript:"]:after, a[href^="#"]:after {
		content: ""; 
	}

	/* Printing Tables: css-discuss.incutio.com/wiki/Printing_Tables */
	thead {
		display: table-header-group;
	}

	tr, img {
		page-break-inside: avoid;
	}

	@page {
		margin: 0.5cm;
	}

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

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