/* 1. Übergreifend */

/* 1.1 Allgemeines: Fonts, H, a, classes */
body {
	font-family: 'Maven Pro', Verdana, sans-serif;}

header {
	font-weight:bold;
	z-index:10;}

h1 {
	font-size:42px;
	margin-bottom:0.2em;
	margin-top:0.2em;}

h2 {
	color: #3C3C3B;
	font-size:32px;}	 
	
h3 {
	color:#E94E1B;}	

.inver {
	background-color:#E94E1B;
	color:white;
	padding:5px;}	

main {
display:block; }    
    
    
main a {
	text-decoration:none;   
   color:#E94E1B;
   font-weight:normal;}	
  
main a:hover {
	text-decoration:underline dashed;}   
	
main a:visited {
	text-decoration:none;   
   color:#FE6600;
   font-weight:normal;}  

#menue a {
	text-decoration:none;
	color: white;}
   
#menue a:hover {
	font-weight:bold;}
	
#menue a:visited {
text-decoration:none;
color:#404040;}
   
.left {
	margin-left:40%;} */

.clear {
	clear:both;}
	
	 
/* 1.2 Kontaktfeld */
	 
#kontakt {
  	margin-left:0em;}	

#textfeld {
 	 border-style:3px solid black;}

#send {
  	background-color:#E94E1B;
	color:white;
	padding-top:1.3em;
	padding-bottom:1.3em;
	padding-left:2em;
	padding-right:2em;
	border-style:none;
	font-size:14px;
	font-weight:bold;
	opacity:0.8;}

#send:hover {
	opacity:1;}

textarea, input {
	border: 1px solid grey;
	font-family: 'Maven Pro', Verdana, sans-serif;
	font-size:20px;
	color:black;
	width:80%;}*/

input #headl {
	font-size:32px;
	font-weight: bold;
	color:#E94E1B;
	width:70%;
	height:2em;
}

#headl {
	font-size:32px;
	color:#E94E1B;
	font-weight: bold;
}

textarea #bildl {
	width:20%;
}

#bildl {
	width:20%;

}

textarea #anreisserl {
	width:50%;
} 

#anreisserl {
	width:50%;
} 

input #linkl, #passl {
	width:70%;
}

#linkl, #passl {
	width:70%;
}

button#calltoaction {
box-sizing: border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing: border-box;
width: 200px;
height:50px;
text-align: center;
color:white;
font-weight: bold;
background-color:#12A19A;
padding-top:12px;
}

button#calltoaction:hover {
text-decoration:none;
background-color:#10C19A;
box-shadow: 2px 2px 2px grey;
}


/* Call to Action Button */

#calltoaction {
box-sizing: border-box;
-moz-box-sizing:border-box;
-webkit-box-sizing: border-box;
width: 200px;
height:50px;
text-align: center;
color:white;
font-weight: bold;
background-color:#12A19A;
padding-top:12px;
}

#calltoaction:hover {
text-decoration:none;
background-color:#10C19A;
box-shadow: 2px 2px 2px grey;
}

/* 1.3 Menü */

nav {
	float:left;
	position:fixed;
	top:0px;}

#menue {
	float:left;
	height:3em;
	padding:0;}

ul#menue {
      list-style:none;
      padding:0;
      }

ul#menue li {
      float:left;
      margin-left:2em;
      text-transform:uppercase;
      font-size:20px;
      margin-top:-0.2em;
      padding-left:0.3em;
      padding-right:0.3em;
      position:static;
      width:8em;}


/* 1.3.1 auslösende elemente */   
   
ul#menue li a {
      color: black;}
      
/* 1.3.2 Submenüs */   

ul#menue li ul {
      list-style:none;
      padding:0; 
      display:none;
      position:relative;
      background-color:white;
      opacity:1;
}
      
ul#menue li ul a {
		color:white;}  
		
ul#menue li ul.first {
		background-color:white;
		width:12em;
		padding-top:0.5em;
		margin-top:0.1em;
		position:relative;
		opacity:1;}    

	ul#menue li ul.second {
		background-color:white;
		width:12em;
		margin-top:-1.65em;
		position:relative;}  
      
/* 1.3.2.1 Submenüs, einzelne Elemente */

ul#menue li ul li.eins {
      float:none;
      text-transform:none;
      color:black;
      font-weight:bold;
      margin-left:0px;
      position:relative;
      margin-top:0.2em;
      padding:0.2em;
      width:97%;
      overflow:visible;
      opacity:1;}


ul#menue li ul li.zwei {
      float:none;
      text-transform:none;
      color:white;
      font-weight:bold;
      margin-left:0px;
      position:relative;
      margin-top:0.2em;
      padding:0.2em;
      width:97%;
      overflow:visible;
      opacity:1;}
      
/* 1.3.3 Menü hover */ 
ul#menue li:hover ul.first {
      display:block;}

ul#menue li:hover ul#menue2 {
      display:block;}     

ul#menue li:hover ul li:hover {
	opacity:1;
	background-color: #E94E1B;}

ul#menue:hover li a#start {
	border-bottom: 3px solid white;}   
 
ul#menue:hover li ul li {
 	background-color:white; }    
         
ul#menue2 li ul {
      list-style:none;
      padding:0; 
      display:none;
      position:relative;
      margin-left:13.1em;
      margin-top:-1.65em;
      position:relative; }
     
ul#menue2 li:hover ul{
	display:block;}

ul#menue2 {
      list-style:none;
      padding:0;}
      
ul#menue2 li {
	height:1.5em;}      

/* 1.4 Action Buttons */	
	
#action {
width: 11em;
height:3em;
background-color:#E94E1B;
opacity:0.8;
color:white;
text-align:center;
padding:0.2em;
font-size:1.1em;}

#action:hover {
opacity:1;}	

/* 2. DESKTOP ALLGEMEIN*/

@media (min-width:701px) {
	#navsmart {
		display:none;}

	header { 
		background-color: white;
		width:100%;
		position:fixed;
		left: 0px;
		height:3em;
		top:0px;	
		z-index:10;
		/*border-bottom: 5px dotted black;*/
		background-image: linear-gradient(to right, #333 40%, rgba(255, 255, 255, 0) 20%);
  		background-position: bottom;
  		background-size: 10px 4px;
  		background-repeat: repeat-x;}
	
	header img {		
		height:3em;
		float:left;
		position:relative;}  
		
	#logo {
		height:3em;
		width:18em;
		background-color:white;
		padding-top:20px;
		padding-bottom:5px;
		padding-left:25px;
		margin-top:-0.5em;}
	
	footer {
		width:100%;
		bottom:0px;
		margin-top:1em;
		/*border-top:5px dotted black;*/
		padding-left:160px;
		padding-bottom:10px;
		padding-top:5px;
		background-image: linear-gradient(to right, #333 40%, rgba(255, 255, 255, 0) 20%);
  		background-position: top;
  		background-size: 10px 4px;
  		background-repeat: repeat-x;
		}

	footer ul li {
		display:inline;
		margin-right:25px;
		font-size:16px;}
		
	footer a {
	text-decoration:none;
	color:black;
	}
	
	footer a:hover {
	font-weight:bold;}	
		
	#smart {
		display:none;}

#bc-news img {
	width:100px;}
		
#bc-news > div:first-of-type{
width:150%;
margin-top:-90px;}		

#bc-news > div:first-of-type img {
	width:350px;}

#bc-news > div:first-of-type h2 {
	font-size:50px;}	

article#beratung {
margin-top:-4em;}
	
article#beratung, article#analyse, article#workshops {
padding-top:1.5em;
}

article#workshops, article#analyse {
margin-top:-5em;
margin-bottom:2em;} 


#uberuns article {
margin-top:-3em;
margin-bottom:-2em;
padding-top:4em;
opacity:0.9;
position:relative;
}

#uberuns > article:first-of-type {
margin-top:5em;
padding-top:0em;
z-index: 6;
}

#uberuns > article:first-of-type a {
z-index:5;}

#uberuns >article:nth-of-type(2) {
z-index:4;}

#uberuns >article:nth-of-type(3) {
z-index:3;}

#uberuns >article:nth-of-type(4) {
z-index:2;}

#uberuns >article:nth-of-type(5) {
z-index:1;
margin-bottom:4em;}

#uberuns >article:nth-of-type(6) {
z-index:0;
margin-bottom:4em;}

#team img {
display:none;}

article#downloads {
margin-top:-3em;;

}

}	


/* Smartphone */


@media (max-width:700px) {

body {
	padding:0.5em;}

h1 {
font-size:30px;}

h2 {
font-size: 26px;}

header {
width:100%;
padding:0;
}

header img {
width:100%;
}

nav {
display:none;}

#hintergrundbild img {
width: 100%;
margin-bottom:-20em;
}


#hintergrundbild2 img {
width:100%;}

#hintergrundbild3{
display:none;}

#team img {
width:100%;
}

#navsmart {
}

#navsmart div.level1 {
width:100%;
background-color:#008888;
color:white;
margin-top:0.2em;
position:relative;
text-align:center;
padding-top:0.7em;
padding-bottom:0.7em;
text-transform:uppercase;}


#navsmart a {
color:white;
text-decoration:none;
}

main {
	float:left;	
	margin-top: 1em;
	width:100%;
	font-size:16px;
	background-color:white;
	padding-bottom:1em;
	margin-bottom: 1em;}


footer {
width:95%;
background-color:black;
color:white;
padding-top:1em;
padding-bottom:2em;
margin-top:50px;
}

footer ul {
list-style:none;
margin-left:-20px;}

footer ul li {
margin-top:5px;}

footer a {
text-decoration:none;
color:white;
font-size:20px;
}

footer a::before {
	content: ">> "}
	
footer a:visited {
color:white;}

table#desktop {
display:none;}


#smart div p {
margin-left:1em;
margin-right:1em;
text-transform:none;
color:white;}

#smart a {
color:white;}

.unsichtbar {
display:none;
background-color:white;}

.unsichtbar div {
width:100%;
background-color:#008888;
opacity:.5;
color:white;
height:2em;
margin-top:0.2em;
text-align:center;
padding-top:0.7em;
position:relative;}

}



/* Kleiner Monitor */

@media (min-width:701px) and (max-width:1079px) {
#logo {
	margin-left:20px;}	
	

nav {
		margin-left:30%;}	

ul#menue {
	margin-left:30px;
	width:135px;}
		
ul#menue li {
      margin-left:40px;}

ul#menue li ul li.eins, li.zwei {
	font-size:18px;
	width:135px;}

ul#menue li ul.first, ul.second {
		width:135px;} 

#hintergrundbild {
		width:90%;
		margin-top:5%;
		z-index: -10;
		position:relative;
		right:0;
		}	
		
		#hintergrundbild2 {
		width:90%;
		margin-top:8%;
		margin-left:7%;
		z-index: -10;
		position:relative;
		right:0;}
		
		#hintergrundbild3{
		width:70%;
		margin-top:8%;
		margin-left:7%;
		z-index: -10;
		position:relative;
		right:0;
		display:inline;}
		
		
#hintergrundbild img {
		width:65%;
		margin-left:40%;
		margin-top:2em;
		margin-bottom:-20em;
		}		
		
		#hintergrundbild2 img {
		margin-left:30%;
		margin-top:2em;
		margin-bottom:4em;
		width:70%;}
		
		#hintergrundbild3 img {
	height:200px;
	margin-top:5em;
	margin-left:2em;
	margin-bottom:20em;
	}
	
	#hintergrundbild3 > img:first-of-type {
	margin-left:20em;}

main {	
		width:100%;
		margin-top: -40%;
		margin-left:35px;
        }		
		
	article {
	margin-top:4em;
	padding-top:1em;
	width:38%;
	min-width:600px;
	font-size:20px;
	margin-bottom:5em;
	background-color:white;
	opacity:0.9;
	border-radius:3px;}		
	
	
	table {
		margin-left:20%;}	
	
	#headline {	
		float:left;	
		margin-top: -40em;
		margin-left:12.6%;
		padding:1.5em;
		margin-bottom:3em;
		font-size:16px;
		z-index:2;
		opacity:0.7;
		position:relative;}	

	footer {
	padding-left:0px;}	
	
#bc-news > div:first-of-type{
margin-top:400px;}	
	
	article#prinzip, article#potenziale {
	margin-top:-5em;
	padding-top:2.5em;}	
		
}

/* Großer Monitor */

@media (min-width:1080px) {
	
	#logo {
	margin-left:134px;}		
	
	#hintergrundbild {
		width:85%;
		margin-top:2%;
		z-index: -10;
		position:relative;
		right:0;
		}
	
		#hintergrundbild2 {
		width:90%;
		margin-top:8%;
		margin-left:7%;
		z-index: -10;
		position:relative;
		right:0;}
		
		#hintergrundbild3{
		width:90%;
		margin-top:8%;
		margin-left:7%;
		z-index: -10;
		position:relative;
		right:0;
		display:inline;}
		
	
	#hintergrundbild img {
		margin-left:40%;
		margin-right:0%;
		width:70%;
		margin-bottom:-30em;
		}
	
	#hintergrundbild2 img {
		margin-left:40%;
		margin-right:0%;
		width:50%;}
		
	#hintergrundbild3 img {
	height:200px;
	margin-top:150px;
	margin-left:1em;
	margin-bottom:200px;
	}
	
	#hintergrundbild3 > img:first-of-type {
	margin-left:600px;}
	
	nav {
		margin-left:35%;}	
	
	main {	
		width:100%;
		margin-top: -35%;
		margin-left:150px;
		}	
		
	.whitewide {
	width:100%;
	height:50em;
	background-color:white;}		
		
	article {
	margin-top:6em;
	width:38%;
	min-width:600px;
	font-size:20px;
	margin-bottom:5em;
	background-color:white;
	opacity:0.9;
	border-radius:3px;}		
	
	article#prinzip, article#potenziale {
	margin-top:-5em;
	padding-top:2.5em;}
	
	
	table {
		margin-left:20%;}	
	
	#headline {	
		float:left;	
		margin-left:12.6%;
		padding:1.5em;
		margin-bottom:3em;
		font-size:16px;
		z-index:2;
		opacity:0.7;
		position:relative;}	

	footer {
	padding-left:110px;}
}


/* Ganz Großer Monitor */

@media (min-width:1301px) {	
	#logo {
	margin-left:184px;}	
	
	main {	
		margin-left:200px;
		}		
	
	footer {
	padding-left:160px;}
	
	
}

@media (min-width:1360px) {	


		#hintergrundbild3{
		width:90%;
		margin-top:8%;
		margin-left:7%;
		z-index: -10;
		position:relative;
		right:0;
		display:inline;}

	#hintergrundbild3 img {
	height:250px;
	margin-top:5em;
	margin-left:2em;
	margin-bottom:20em;
	}
	
		#hintergrundbild img {
		margin-left:40%;
		margin-right:0%;
		width:70%;
		margin-bottom:-35em;
		}
	
}

@media (min-width:1601px) {	


		#hintergrundbild3{
		width:90%;
		margin-top:8%;
		margin-left:7%;
		z-index: -10;
		position:relative;
		right:0;
		display:inline;}

	#hintergrundbild3 img {
	height:300px;
	margin-top:5em;
	margin-left:2em;
	margin-bottom:20em;
	}
	
	#hintergrundbild img {
		margin-left:40%;
		margin-right:0%;
		width:70%;
		margin-bottom:-42em;
		}
	
}

@media (min-width:1801px) {	


		#hintergrundbild3{
		width:90%;
		margin-top:8%;
		margin-left:7%;
		z-index: -10;
		position:relative;
		right:0;
		display:inline;}

	#hintergrundbild3 img {
	height:300px;
	margin-top:5em;
	margin-left:2em;
	margin-bottom:25em;
	}
	
		#hintergrundbild img {
		margin-left:40%;
		margin-right:0%;
		width:70%;
		margin-bottom:-50em;
		}
	
}

@media (min-width:1951px) {	


		#hintergrundbild3{
		width:90%;
		margin-top:8%;
		margin-left:7%;
		z-index: -10;
		position:relative;
		right:0;
		display:inline;}

	#hintergrundbild3 img {
	height:300px;
	margin-top:5em;
	margin-left:2em;
	margin-bottom:30em;
	}
	
		#hintergrundbild img {
		margin-left:40%;
		margin-right:0%;
		width:70%;
		margin-bottom:-55em;
		}
	
}


