/*----------------------------------------------------------------------------
RESET CSS
------------------------------------------------------------------------------*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, figure, footer, header, hgroup, menu, nav, section, menu,
time, mark, audio, video {
margin:0;
padding:0;
border:0;
outline:0;
font-size:100%;
vertical-align:baseline;
background:transparent;
list-style:none;
}
article, aside, figure, footer, header,
hgroup, nav, section { display:block; }
nav ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
ins { background-color:#ff9; color:#000; text-decoration:none; }
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted #000; cursor:help; }
/* tables still need cellspacing="0" in the markup */
table { border-collapse:collapse; border-spacing:0; }
hr { display:block; height:1px; border:0; border-top:1px solid #ccc; margin:1em 0; padding:0; }
input, select { vertical-align:middle; }

/*----------------------------------------------------------------------------
END RESET CSS
------------------------------------------------------------------------------*/


/*----------------------------------------------------------------------------
Allgemein
------------------------------------------------------------------------------*/

/* open-sans-regular - latin */
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	src: url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-regular.eot'); /* IE9 Compat Modes */
	src: local('Open Sans Regular'), local('OpenSans-Regular'),
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
  }
  
  /* open-sans-italic - latin */
  @font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 400;
	src: url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-italic.eot'); /* IE9 Compat Modes */
	src: local('Open Sans Italic'), local('OpenSans-Italic'),
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-italic.woff') format('woff'), /* Modern Browsers */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-italic.svg#OpenSans') format('svg'); /* Legacy iOS */
  }
  
  /* open-sans-700 - latin */
  @font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 700;
	src: url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-700.eot'); /* IE9 Compat Modes */
	src: local('Open Sans Bold'), local('OpenSans-Bold'),
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-700.woff') format('woff'), /* Modern Browsers */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-700.svg#OpenSans') format('svg'); /* Legacy iOS */
  }
  
  /* open-sans-700italic - latin */
  @font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 700;
	src: url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-700italic.eot'); /* IE9 Compat Modes */
	src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'),
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-700italic.woff') format('woff'), /* Modern Browsers */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
		 url('https://profoto-krefeld.de/css/fonts/open-sans-v15-latin-700italic.svg#OpenSans') format('svg'); /* Legacy iOS */
  }
  
a:hover, a:active { outline: none; }
a, a:active, a:visited { color:#FB0707; text-decoration: none;}
a:hover { text-decoration: underline; }


/* IE7 image resizing
code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */
.ie7 img { -ms-interpolation-mode: bicubic; }


/* Labels ausrichten */
input[type="radio"] { vertical-align: text-bottom; }
input[type="checkbox"] { vertical-align: bottom; *vertical-align: baseline; }
.ie6 input { vertical-align: text-bottom; }

/* Input-Felder zum anklicken */
label, input[type=button], input[type=submit], button { cursor: pointer; }


p {
	padding-bottom:15px;
}

.clear 	{
	clear:both;
	line-height:0;
	font-size:0;
	height:0;
}

.center {text-align:center;}
.right {text-align:right;}

h1 {
	color:#fff;
	font-size:40px;
	line-height:70px;
	font-weight:normal;
	font-family:'Open Sans',Tahoma, Geneva, sans-serif;
	background-color:#000;
	text-align:center;
	}


h5, h6 {font-size:30px; padding:15px; font-weight:normal;}

.w24 {width:24%; float:left;}
.w34 {width:34%; float:left;}
.w49 {width:49%; float:left;}
.w50 {width:50%; float:left;}
.w65 {width:65%; float:left;}



.abstand1 {margin-right:1%}
.abstand2 {margin-right:2%}
.abstandLinks1 {margin-left:1%}

.grau { background-color:#d9d9d9; cursor:pointer; }
.grau p {padding:15px;}
.blackbox_ueberschrift {background-color:#000; color:#FFF; line-height:35px; padding:9px 15px 9px 15px; font-weight:normal; border-bottom-right-radius: 15px;}

.grau:hover {
	background-color:#000; 
    -webkit-transition: background-color linear .3s;
    -moz-transition: background-color linear .3s;
    -o-transition: background-color linear .3s;
    -ms-transition: background-color linear .3s;
    transition: background-color linear .3s;
	color:#FFF;}
.grau:hover .blackbox_ueberschrift {background-color:#FB0707; color:#fff;}

#unterseite .grau:hover { background-color:#d9d9d9; color:#000; cursor:auto;}
#unterseite .grau:hover .blackbox_ueberschrift {background-color:#000; color:#fff;}


.schwarz { background-color:#222222; color:#FFF;}
.schwarz p {padding:7px;}

.grau ul { padding-left:40px;} 
.grau li { list-style-type:circle;} 


/*----------------------------------------------------------------------------
Content
------------------------------------------------------------------------------*/

body {
	font-family:'Open Sans',Tahoma, Geneva, sans-serif;
	font-size:14px;
	line-height:22px;
	color:#000;
	background-color:#eaeaea;
	background-image:url(../images/bg.jpg);
}


.rahmen {
	width:96%;
	height:auto;
	text-align:left;
	margin:30px auto;
}


/*.rahmen img {width:100%; height:auto; line-height:0; vertical-align:bottom;}*/

#oben {
	background-color:#000;
}

#logo {
	width:30%;
	background-color:#000;
	float:left;
	min-width:300px;
	text-align:center;
	height:81px;
}


.aktion li {
	width: 60%;
	margin:0 auto;
	height:auto;
	padding:1%;
	border:solid 1px #CCC;
	background-color:#d9d9d9;
}

 /*----------------------------------------------------------------------------
Kontakt
------------------------------------------------------------------------------*/

	form {
	display:inline;
	}	
	
	.unsichtbar { display:none; }
	
	.wichtig {color:#ff0000;}
	.erfolgreich {color:#fff;}

	
	form label { margin:5px 0 0 15px; width:140px; display:block; float:left; }
	form select, form input, form textarea  {  
	margin-top:5px; 
	border:1px #d9d9d9 solid;
	background-color:#e1e1e1; 
	color:#4a4a4a; 
	float:left;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	padding:5px;
	font-weight:normal;
	font-family:'Open Sans',Arial, Helvetica, sans-serif;
	}
	
	.kurz {width:auto; padding:0 10px 0 10px;}
	a.tel {text-decoration:none; color:#000;}
	.impressum {text-align:right; color:#fff;}
	
	
	form textarea  { width:74%; font-size:14px; margin-left:15px;}
	
	form .checkbox { margin-top:5px; float:left; }
	form br { clear:both; }
	
	form input[type="submit"] { 
	 padding: 5px 20px 5px 20px;
	 width:210px;
	 margin-bottom:20px;
	 margin-left:15px;

	 color:#FFF;
background: #f85032; /* Old browsers */
background: -moz-linear-gradient(top,  #f85032 0%, #f16f5c 50%, #f6290c 51%, #f02f17 71%, #e73827 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f85032), color-stop(50%,#f16f5c), color-stop(51%,#f6290c), color-stop(71%,#f02f17), color-stop(100%,#e73827)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* IE10+ */
background: linear-gradient(to bottom,  #f85032 0%,#f16f5c 50%,#f6290c 51%,#f02f17 71%,#e73827 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f85032', endColorstr='#e73827',GradientType=0 ); /* IE6-9 */
	}





#footerHg {background-color:#000; padding:20px 0;}
#footerHg a {color:#FFF; text-decoration:none;}


#footerMobile {
background-color:#151515;
	text-align:center;
	padding:10px 0 10px 0;}
	
#footerMobile a {
	color:#dbdbdb; text-decoration:none;}



#footerMobile {display:none;}


.slides h1 {
	display: block; 
	position: absolute; 
	font-size: 50px; 
	line-height: 70px; 
	padding: 8.36491px 16.7298px; 
	border-width: 0px; 
	border-style: none; 
	border-color: rgb(255, 255, 255); 
	color: #FB0707; 
	text-shadow: 1px 1px #fff; 
	background-color: rgba(0, 0, 0, 0.5);
	transition: all 600ms cubic-bezier(0.6, -0.28, 0.735, 0.045) 0s;
}

.slides h2 {
	display: block; 
	position: absolute; 
	font-size: 30px; 
	line-height: 52px; 
	padding: 4.18246px 8.36491px; 
	border-width: 0px; 
	border-style: none; 
	border-color: rgb(255, 255, 255); 
	background-color: rgba(251, 7, 7, 0.5); 
	transition: all 600ms cubic-bezier(0.6, -0.28, 0.735, 0.045) 0s; 
	animation-duration: 600ms; 
	animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);	
}

.slides h3 {
	display: block; 
	position: absolute; 
	font-size: 20px; 
	line-height: 31px; 
	padding: 3.13684px 6.27368px; 
	border-width: 0px; 
	border-style: none; 
	border-color: rgb(238, 238, 238); 
	width: 360px; 
	background-color: rgba(255, 255, 255, 0.5);
	transition: none 0s ease 0s ; 
	animation-duration: 600ms; 
	animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.slides h3.lang {
	width: 420px; 
}


#map {
	height: 245px;
	width: 94%;
	border: solid 2px #FB0707;
	margin: 0 0 15px 15px;	
   }


/* ------------------------
:: Nur Webseite
------------------------- */


@media screen and (max-width: 1000px) {	
	h1 {font-size:36px;}	
}

@media screen and (max-width: 900px) {
	h1 {font-size:32px; line-height:60px;}	

}

@media screen and (max-width: 810px) {
	h1 {font-size:28px; line-height:50px;}	
	.w50 {width:100%; float:left;}
	.w49 {width:100%; float:left;}
	.w24 {width:48%; float:left;}
	.w65 {width:100%; float:left;}
	.w34 {width:100%; float:left;}
	
	.ipad {display:none;}
	
}
@media screen and (max-width: 710px) {
	h1 {font-size:22px;}	
	
}
@media screen and (max-width: 610px) {
	h1 {font-size:19px; line-height:40px;}	
	
}



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

	.w50 {width:100%; float:left;}
	.w24 {width:100%; float:left;}
	.w49 {width:100%; float:left;}
	
#footerMobile {display:block;}

#footerMobile .w33 {width:33.3%; float:left;}
	
}