/* styles cdrb 2016 Mobile Template
=================================== */
html,
body {
width:100%;
min-width:480px;
height:100%;
background-color:#f7f1f1;
}

* {
  font-family: 'Open Sans', sans-serif;
  color:#4D4A4B;
}

/* Startseite
=============*/
#start {
  display:block;
  position:relative;
  top:0;
  margin:4% 2% 0 2%;
  width:96%;
  padding:0;
  height:auto;
  background-color:#ddd6d4;
}

#start img.logo {
  margin-left:5%;
  width:95%;
  height:auto;
}

/* Header
=========*/
header {
  display:block;
  position:relative;
  top:0;
  margin:auto;
  width:96%;
  padding:0 2% 0 2%;
  height:auto;
  background-color:#f7f1f1;
}

#logo {
  margin:5% 0 5% 0;
  width:80%;
  height:auto;
}

/* Menü
=======*/
#menu {
	font-size:26px;
	float:right;
	margin-top:-4%;
	position:relative;
	z-index:1000;
}

#menu a {
	color:#A79C94;
	text-decoration:none;
}


#menu a span {
	color:#4D4A4B;
}

#start #menu {
  font-size:26px;
  position:absolute;
  top:33%;
  left:68%;
}

#start #menu ul li a {
  color:#fff;
}

#start #menu ul li ul a {
  padding: 0.5em 1em;
}

nav ul {
	padding:0px;
	list-style-type:none;
}

nav ul ul {
	display:none;
	padding-right:20px;
	width:210px;
	position:absolute;
	top:32px;
	right:16px;
	z-index:auto; /* Ausblendung des Untermenüs */
	font-size:0em; /* Ausblendung des Untermenüs */
}

#start #menu ul ul {
  top:32px;
  padding-right:10px;
  width:200px;
  font-size:20px;
}

nav ul li:hover ul,
nav ul li:active ul {
	display:block;
	z-index:auto; /* Einblendung des Untermenüs */
	font-size:20px; /* Einblendung des Untermenüs */
}

nav ul ul li {
    margin: 0;
    border:0;
}
nav ul li:hover ul li,
nav ul li:active ul li,
#start nav ul ul li {
  border-bottom:1px solid #bfb7b5;
}

nav ul ul a {
	display:block;
    padding: 0.7em 1em;
    text-decoration: none; 
    background-color: rgba(255, 255, 255, .94);
	transition: background-color .25s ease-in;
}

nav ul ul a:focus,
nav ul ul a:hover,
nav ul ul a:active {    
    background-color: rgba(215, 0, 54, 1);
	transition: background-color 0.01s;
}

#menu ul ul a:focus span,
#menu ul ul a:hover span,
#menu ul ul a:active span {
	color:#FFFFFF;
}

/* Topboxen
===========*/
#topbox {
  display:block;
  position:relative;
  width:98%;
  padding:0 0 0 2%;
  margin:0 auto 5% auto;
}

#topbox aside {
  display:block;
  float:left;
  margin:0px 2% 2% 0px;
  padding:0;
  width:48%;
  height:140px;
  background-color:#bfb7b5;
  overflow:hidden;
}
#topbox aside:last-child {
  margin-right:0;
}

#topbox aside.zentriert {
  text-align:center;
}

#topbox aside div {
  padding:8% 4% 4% 4%;
  display:block;
  width:92.1%;
  height:88.1%;
  color:#fff;
  font-size:14px;
  font-weight:600;
  line-height:150%;
}

#topbox aside div h1 {
  margin:0 0 10px 0;
  padding:0;
  font-size:16px;
  color:#d50b3d;
}

#topbox aside a.play {
  margin:0;
  padding:8% 4% 4% 4%;
  display:block;
  width:92.1%;
  height:88.1%;
  background:url("/images/play.png") 50% 70% no-repeat #bfb7b5;
  font-weight:700;
  font-size:16px;
  color:#d50b3d;
  text-decoration:none;
}
#topbox aside a.play:hover,
#topbox aside a.play:active {
  background-color:#d50b3d;
  color:#fff;
}

#conbox {
  display:block;
  position:relative;
  width:96%;
  padding:0 2% 0 2%;
  margin:0 auto 5% auto;
}

#conbox aside {
  display:block;
  float:left;
  margin:0 0 2% 0;
  padding:4% 2% 4% 2%;
  width:96%;
  height:min-content;
  background-color:#bfb7b5;
  line-height:150%;
  font-size:14px;
  font-weight:700;
  color:#fff;
}

#conbox aside:first-child {
  background-color:#d50b3d;
  color:#fff;
}

#conbox aside:first-child h2 {
  margin-top:0px;
  font-weight:700;
  font-size:20px;
  color:#fff;
}
#conbox aside:last-child address {
  font-style:normal;
}

#conbox aside:last-child h2 {
  margin-top:0px;
  font-weight:700;
  font-size:20px;
  color:#4D4A4B;
}

#conbox aside a.play {
  margin:0;
  padding:4% 2% 0 2%;
  display:block;
  width:96%;
  height:80%;
  background:url("/images/play_big.png") 80% 50% no-repeat #bfb7b5;
  font-size:16px;
  color:#d50b3d;
  text-decoration:none;
}
#conbox aside a.play span {
  display:block;
  color:#fff;
  font-weight:400;
}

#conbox aside a.play:hover,
#conbox aside a.play:active,
#conbox aside a.selected {
  background-color:#d50b3d;
  color:#fff;
}

/* content
==========*/
#content,
#basics {
  display:block;
  position:relative;
  margin:auto;
  width:96%;
  padding:0 2% 0 2%;
}

#showroom,
#showroom_detail,
#macher {
  display:block;
  position:relative;
  width:98%;
  padding:0 0 0 2%;
  margin:0 auto 0 auto;
}

/* Showroom-Boxen
=================*/
#showroom div.box {
  display:block;
  background-color:#fff;
  height:auto;
  margin:0 2% 2% 0;
  float:left;
  width:48%;
  line-height:0;
  overflow:hidden;
}
#showroom div.doppelx {
  width:98%;
}
#showroom div.doppely {
  height:auto;
}

#showroom div section {
  width:100%;
  height:100%;
  position:relative;
}
#showroom div img {
  width:100%;
  height:100%;
}
#showroom div section div {
  position:absolute;
  display:table;
  left:0;
  bottom:0;
  width:98%;
  height:auto;
  min-height:50px;
  padding:2%;
  background-color:rgba(191,183,181,.8);
  transition: background-color .0s ease-in;
  transition: color .0s ease-in;
  line-height:100%;
}

#showroom div section div a {
  text-decoration:none;
  display:table-cell;
  vertical-align:middle;
  text-align:center;
  color:#fff;
  font-size:12px;
}  
#showroom div section div a h2 {
  color:#fff;
  font-weight:700;
  font-size:14px;
  margin:0;
} 

#showroom_detail div.box {
  display:block;
  margin:0 2% 2% 0;
  float:left;
  width:98%;
  height:auto;
  line-height:0;
}

#showroom_detail div.doppelx {
  width:98%;
}

#showroom_detail div.rechts {
  float:right;
}

#showroom div.text {
  width:98%;
}

#showroom_detail div.box img {
  width:100%;
  height:auto;
}

#showroom_detail div.box div {
  display:table-cell;
  padding:4% 2% 4% 2%;
  vertical-align:middle;
  text-align:left;
  color:#fff;
  line-height:150%;
  font-size:14px;
}

#showroom_detail div.box div h2,
#showroom_detail div.box div a {
  font-weight:700;
  font-size:16px;
  margin:0 0 5px 0;
  text-decoration:none;
  color:#fff;
}

#showroom_detail div.box div a:hover {
  text-decoration:underline;
}

#showroom_detail div.box div h2 span {
  color:#fff;
  font-weight:400;
}
#showroom_detail div.box div strong {
  color:#fff;
  font-weight:700;
}

#content div.box,
#basics div.box {
  display:block;
  background-color:#fff;
  float:left;
  padding:4% 2% 4% 2%;
  font-size:14px;
  margin-bottom:5%;
  width:96%;
  overflow:hidden;
}

#content div.box:last-child,
#basics div.box:last-child {
  margin-bottom:0;
}

#content div.box h1,
#basics div.box h1 {
  font-size:16px;
  color:#d50b3d;
}

#content div.box a {
  font-weight:700;
  text-decoration:none;
  color:#4d4a4b;
}
#content div.box a:hover {
  color:#d50b3d;
}

#macher div.box {
  display:block;
  background-color:#fff;
  float:left;
  padding:4% 2% 4% 2%;
  width:94%;
  font-size:14px;
  margin-bottom:5%;
}

#macher figure {
  display:block;
  background-color:#fff;
  margin:0 2% 2% 0;
  float:left;
  width:48%;
  height:auto;
}

#macher figure img {
  width:100%;
  height:auto;
}

#macher figure span {
  height:95px;
  padding:0 8px 0 8px;
  display:block;
  font-size:14px;
  overflow:hidden;
}

#macher figure span h2 {
  font-size:16px;
  color:#d50b3d;
  margin:0;
  padding:0;
}
  
.clearfix:after {
    content: ".";
    clear: both;
    display: block;
    visibility: hidden;
    height: 0px;
}

#content div.box address {
  font-style:normal;
}

.backlink {
  clear:both;
  display:block;
  width:28px;
  height:28px;
  background:url("/images/backlink.png") top left no-repeat;
  margin:0 auto 0 auto;
}

.uplink {
  clear:both;
  display:block;
  width:28px;
  height:28px;
  background:url("/images/uplink.png") top left no-repeat;
  margin:0 auto 0 auto;
}
p, div, span, aside, section {
  -moz-hyphens: auto;
  -o-hyphens: auto;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
}

*.nohyphens {
  -moz-hyphens: none;
  -o-hyphens: none;
  -webkit-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
}
/* Footer
=========*/
footer {
  position:relative;
  width:96%;
  padding:24px 2% 24px 2%;
  margin:0 auto 0 auto;
  font-size:14px;
}
 footer img.facebook {
   float:left;
   margin:0px 12px 0px 0px;
}

footer a {
  color:#4d4a4b;
  text-decoration:none;
}
footer a:hover {
  color:#d50b3d;
}