@charset "UTF-8";

body
{	margin-top: 0px;
	font-family: Arial Narrow, sans-serif, condensed;
	font-size: 1.25em;
	color: #94877A;
	background-color: #FFF;
}

.box {
  margin: 2em;
  background-color: #ffffff;
  border: 1px solid black;
  opacity: 0.6;
display:table;
}

.sprachen{
	text-align: center;
	margin: auto;
}

header{
	margin-top: 0px;
	background-color: #94877A;
	padding: 1em;
	min-height: 8em;
}

.logo{
	float: left;
	margin-right: 2em;
	margin-bottom: 1em;
	max-width: 100%;
  	height: auto;
}

.logopos{
	display:block;
}

.Head{
        height: auto;
        padding: 35px;        
}

.navigation{
baseline-shift: sub;
}

h1{
	font-size: 1.6em;
	margin-top: auto;
	margin-bottom: 0.5em;
	color: #fff;
	text-transform: uppercase;
	text-align: center;
	font-weight: lighter;
}

h2{
	margin-top: auto;
	margin-bottom: auto;
	color: #fff;
	text-transform: uppercase;
	text-align: center;
	postion: relative;
	font-weight: lighter;
	font-size: 1em;
}

h3{
	font-size: 1.25em;
	margin-top: auto;
	margin-bottom: auto;
	color: #fff;
	text-transform: uppercase;
	text-align: center;
	letter-spacing: 0.1em;
}

h4{
	text-transform: uppercase;
	color: #6B5C4F;
	margin: 5%;
	background: rgba(255, 255, 255, 0.5);
}

a:link, a:visited { 
	color: #94877A;
	text-decoration: none;
}

a:hover, a:active { 
	color: #6B5C4F; 
	text-decoration: none;
} 

li {
	display: inline;
	list-style-type: none;
	text-transform: uppercase;
	}

 ul{
   	diplay: block;
	margin: auto;
	padding: 0.5em;
	color: #A09D98;
	text-align: center;
}

.containerhome{
	height: 640px;
   	width: 100%;
	background-image: url("images/container.jpg");
	background-position: top center;
	background-size: cover;
	margin: auto;
}

.containerhaende{
	height: 640px;
   	width: 100%;
	background-image: url("images/haende.jpg");
	margin: auto;
	background-position: top center;
  	background-repeat: no-repeat;
 	overflow: hidden;
	text-align: center;
	background-size: cover;
}

.containertelefon{
	height: 640px;
   	width: 100%;
	background-image: url("images/telefon.jpg");
	position: relative;
	margin: auto;
	background-position: top center;
  	background-repeat: no-repeat;
 	overflow: hidden;
	background-size: cover;
}

.containerfarbe{
	height: auto;
   	width: 100%;
	position: relative;
	margin: auto;
	background-color: #DED6CC;
	background-position: center center;
  	background-repeat: no-repeat;
 	overflow: hidden;
}

p{
	padding: 2em;
	text-align: left;
	width: 35em;
	min-height:440px;
	margin-left: auto;
    margin-right: auto;
	color: #6B5C4F;
}

.portrait {
	padding-top: 60px;
  	padding-left: 320px;
	float: left;
	margin-right: 1em;
	margin-bottom: 1em;
}

.inside {
	padding-left: 1em;
	float: left;
}

.Karte{
	padding: 1em;
	height: 90%;
  	display: flex;
  	justify-content: center;
	}

.right{
	align:top;
}

.responsive{
	max-width: 100%;
  	height: auto;
}

/*Mobile View*/
@media (max-width: 400px)
{
p{ max-width: 240px;}

	
.Karte{
	width: 200px;
	height: auto;
	display:block;
	}
	
.containerhome{
	height: 300px;
   	width: 100%;
}

.right{
	}
}

/*Tablet View*/
@media (min-width: 401px) and (max-width: 949px){

.containerhome{
	height: 440px;
   	width: 100%;
}
	p{ max-width: 600px;}

.Karte{
	width: 150%;
	height: auto;
	display: block;
	}

/*Desktop View*/
@media (min-width: 950px){
}