@media (min-width: 821px) and (max-width: 1219px){
  
#container {
position: absolute;
top: 50px;
left: 50%;
width: 800px;
margin: 0 0 0 -400px;
}

#nav {
position: absolute;
top: 0;
left: 0;
width: 240px;
height: 150px;
vertical-align:bottom;
}

#mitte {
position: absolute;
top: 200px;
left: 0;
width: 800px;
height: auto;
}
  
#arena {
min-height: 500px;
} 

#aside {
position: absolute;
top: 0;
left: 580px;
width: 220px;
height: 150px;
vertical-align:bottom;
}
  
  
/* HAUPTMENUE --------------------------------------------------------------------------*/

#nav div.moduletable.menu {
position: absolute;
bottom: 0;
margin:0;
padding:0;
vertical-align: bottom;
text-align: left;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

#nav div.moduletable.menu ul.nav {
display:block;
list-style-type:none;
margin:0;
padding:0;
position: absolute;
bottom:0;
}

#nav ul li {
width:auto;
line-height: 1.0em;
list-style-type:none;
border:0;
margin: 1em 0 0 0;
padding:0;
display:block;
}
  
#nav ul li a{
font-size: 1.0em;
line-height: 1.0em;
text-decoration: none;
list-style-type:none;
border:0;
margin:0 auto;
padding:0;
}

#nav ul li.current a, #nav ul a:hover{
color:#ef181e;
}
  
  
/* ADRESSE+LOGO ------------------------------------------- */

#aside div.moduletable.mobillogo {
display: none;
}
  
#aside div.moduletable.logo {
position: absolute;
bottom: 0;
margin:0;
padding:0;
vertical-align: bottom;
text-align: left;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

#aside .custom_ p{
margin:0.3em auto 0 30px;
padding:0;
}
  
#aside .custom p.logo{
margin:0;
padding:0;
}

  
/* INHALT --------------------------------------------------------------------- */

#arena .item-page .item-image {
    width: 790px;
  }
  
#arena div.blog-item {
    width: 190px;
    height: 190px;
    margin: 0 10px 10px 0;
    padding:0;
    float: left;
    overflow: hidden;
    border: 1px solid #555555;
    -moz-box-sizing: border-box;
-o-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
  }
  
#mitte div.blog-item .page-header h2{
text-align: center;
width: 100%;
height: 100%;
margin:0;
padding: 0;
font-size:1.0em;
display: flex;
justify-content: center;
flex-direction: column;
display: -webkit-flex;
-webkit-justify-content: center;
-webkit-flex-direction: column;
background: url('../images/bg_trans.png') repeat;
}
  
#arena div.blog-item .page-header {
position: relative;
top: -60px;
left:0;
width: 100%;
height: 60px;
padding: 0;
text-align: center;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
  
  
/* KONTAKT --------------------------------------------------------------------- */

div.contact-miscinfo {
background-image: url('../images/lageplan_brandhuber_gmbh.jpg');
}
  
span.contact-misc a {
font-size: 1.3em;
}
  
/* FOOTER ---------------------------------------------------------------------- */
  
#footer {
width: 790px;
margin-right:10px !important;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
  
#footer div.moduletable, #footer div.moduletable h3, #footer ul.nav{
width:auto;
list-style-type:none;
margin:0 auto;
padding:0;
border:0;
}

#footer div.moduletable h3 {
float:left;
font-size: 13px;
color:#555555;
font-weight:500;
}

#footer div.moduletable ul {
float:right;
text-align: right;
margin-top:-4px;
}
  

}