@media all {
  * {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 100%;
	margin: 0;
	padding: 0;
	line-height: 14px;
  }

  a, img, table, th, td, caption, fieldset {
    border: 0;
  }

  a, :focus {
    outline: 0;
  }
  
  a {
    text-decoration: underline;
  }
  
  a:hover, a:focus {
    text-decoration: none;
  }

  table {             
    border-collapse: collapse;
    border-spacing: 0;
  }

  th, td {
    vertical-align: top;
  }

  h1 {
    font-size: 140%; 
  }

  h2 {
    font-size: 120%;
  }

  h3 {
    font-size: 120%; 
  }
  
  h2, h3 {
    font-weight: normal;
  }
  
  h4, h5 {
    font-size: 100%;
  }

  h1, h2, h3, h4, h5, h6, strong {
    font-weight: bold; 
  }

  abbr, acronym {
    cursor: help;
  }

  em {
    font-style: italic;
  }

  blockquote {
    margin: 1em;
  }

  ul {         
    list-style: none;
    margin: 1em 1em 1em 13px;
  }
  
  ul li {
    list-style: square outside;
    line-height: 150%;
    margin-bottom: 5px;
  }

  ol {
    margin: 1em 1em 2em 2em; 
  }

  ol li {
    list-style: decimal outside;
    line-height: 150%;
    margin-bottom: 5px;
  }

  dl {
    margin: 1em;
    margin-left: 2em; 
  }

  dl dd {
    margin-left: 1em; 
  }

  caption {
    margin-bottom: .5em;
    text-align: left;
  }

  pre, code, kbd, samp, tt {
    font-family: monospace;
    font-size: 110%;
    line-height: 130%; 
  }
  
  a, a *, button, button * {
    cursor: pointer;
  }
  
  textarea {
    overflow: auto;
  }

  .centered {
    text-align: center; 
  }
  
  .nav, .nav li {
    list-style: none;
    margin: 0;
    padding: 0;
  }
  
  .nav a {
    text-decoration: none;
  }

  .clear:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
  }

  .clear {
    display: inline-table;
  }

  /* Hides from IE-mac \*/
  * html .clear {
    height: 1%;
  }

  .clear {
    display: block;
  }
  /* End hide from IE-mac */
  
  .ri {
    text-align: right;
  }
}

@media screen {
  html, body {
    background: #bfc6cd url('../img/bg2.jpg') repeat center top;
    color: #000;
  }
  
  body {
    font-size: .75em;
    text-align: center;
  }
  
  h2, a {
    color: #851f83;
  }
  
  h2, h3, h4 {
    font-size: 100%;
    padding-bottom: .3em;
  }
  
  p {
    line-height: 160%;
    padding-bottom: 2em;
  }
  
  a img {
    vertical-align: middle;
  }
  
  .access, #logo h1 span {
    display: none;
  }
  
  .img-left, .img-right {
    margin: 5px 10px 10px 0;
  }
  
  .img-left {
    float: left;
  }
  
  .img-right {
    float: right;
    margin: 5px 0 10px 10px;
  }
  
  .box,
  .mediabox  {
    background: #7c7c7c;
    display: block;
    margin: 0 0 15px 0;
    padding: 12px;
    width: 942px;
  }
  
  .mediabox  {
    width: 966px;
    height: 330px;
    padding: 0;
    background: transparent url('../img/impressum_bg.jpg') no-repeat left top;
    border-top: 1px solid #7c7c7c;
    border-bottom: 1px solid #7c7c7c;
  }
  
  .videobox{
    float: left;
    width: 450px;
  }
  
  .videoboxtext{
    width: 400px;
    margin: 30px 12px 12px 495px;
    color: #fff;
  }
  
  .videoboxtext h3.video{
    color: #ffe800;
    font-size:1.3em;
    line-height: 1.3;
    margin-bottom: 1em;
  }
  
  #siteholder {
    margin: 0 auto;
    padding: 12px 0;
    text-align: left;
    width: 966px;
  }
  
  #header, #header .bg, #header .bg2, #header .bg3 span {
    display: block;
    height: 67px;
    padding: 20px 0;
  }
  
  #header {
    border: 1px solid #bdc5cb;
    height: 67px;
    overflow: hidden;
    position: relative;
    margin-bottom: 15px;
    width: 964px;
  }
  
  #header .bg,
  #header .bg2,
  #header .bg3 {
    display: block;
    left: 0;
    position: absolute;
    top: 0;
    z-index: 10;
    width: 964px;
  }
  
  #header .bg2 {
    background: #13304a;
    opacity: .1;
  }
  
  #header .bg3 {
    opacity: .4;
    z-index: 20;
  }
  
  #header .bg3 span {
    background: transparent url('../img/header_bg_inner.png') repeat left top;
  }
  
  #logo, #logo h1, #logo h1 a {
    display: block;
    height: 59px;
    width: 343px;
  }
  
  #logo, #metaNav {
    position: relative;
    z-index: 30;
  }
  
  #logo {
    float: left;
    padding-left: 3px;
  }
  
  #logo h1 {
    background: transparent url('../img/logo.png') no-repeat left top;
  }
  
  #logo p {
    left: 353px;
    position: absolute;
    top: -30px;
    z-index: 60;
  }
  
  #metaNav {
    float: right;
    font-weight: bold;
    padding: 60px 10px 0 0;
    text-align: right;
    width: 400px;
  }
  
  #metaNav a {
    background: transparent url('../img/ico_print.gif') no-repeat left 50%;
    color: #fff;
    margin-left: 15px;
    padding: 0 0 0 16px;
    text-decoration: none;
    text-transform: uppercase;
  }
  
  #metaNav a:hover, #metaNav a:focus {
    text-decoration: underline;
  }
  
  #metaNav .tip {
    background-image: url('../img/ico_tip.gif');
  }
  
  #mainNav {
    border-bottom: 19px solid #8c218a;
    font-size: 110%;
    overflow: hidden;
    width: 966px;
  }
  
  #mainNav ul {
    margin-left: -14px;
    width: 980px
  }
  
  #mainNav li, #mainNav li a, #mainNav li span {
    display: block;
    float: left;
    font-weight: bold;
    width: 210px;
  }
  
  #mainNav li.media, #mainNav li.media a, #mainNav li.media span {
    display: block;
    float: left;
    font-weight: bold;
    width: 115px;
  }
  
  #mainNav li {
    padding-left: 5px;
  }
  
  #mainNav li a, #mainNav li span {
    background: #808080 url('../img/mainnav_tab_bg.gif') repeat-x left bottom;
    color: #fff;
    padding: 14px 0 12px;
    text-align: center;
    text-transform: uppercase;
  }
  
  #mainNav li a:hover, #mainNav li a:focus,
  #mainNav li.act a, #mainNav li.act span {
    background-color: #ab28a8;
    background-image: url('../img/mainnav_tab_act_bg.gif');
    color: #ffe800;
  }
  
  #middle {
    padding-top: 15px;
  }
  
  #middle h2 {
    font-size: 200%;
    text-transform: uppercase;
  }
  
  #teaserBox a img {
    display: block;
    margin: 0 auto;
  }
  
  #teaserSplitBox {
    overflow: hidden;
    width: 942px;
  }
  
  #teaserSplitBox .teaserSplitBoxInner {
    margin-left: -23px;
    width: 1000px;
  }
  
  #teaserSplitBox .teaserSplitBoxInner .container {
    background: #fff;
    float: left;
    height: 243px;
    margin-left: 23px;
  }
  
  #teaserSplitBox .pgteaserSplitBoxInner {
    width: 942px;
    height: 337px;
    overflow-x: scroll;
    overflow-y: hidden;
    scrollbar-face-color: #ab28a8;
    scrollbar-highlight-color: #fff;
    scrollbar-3dlight-color: #ab28a8;
    scrollbar-darkshadow-color: #333;
    scrollbar-shadow-color: #ab28a8;
    scrollbar-arrow-color: #fff;
    scrollbar-track-color: #666;
  }
  
  #teaserSplitBox .pgteaserSplitBoxInner .pgcontainer{
    background: #fff;
    float: left;
    height: 307px;
    margin-right: 23px;
  }
  
  #junges-wohnen a {
    background: #fff200 url('../img/junges-wohnen.jpg') no-repeat right top;
    color: #000;
    display: block;
    height: 243px;
    position: relative;
    text-decoration: none;
    width: 454px;
  }
  
  #junges-wohnen a span.inner {
    bottom: 20px;
    position: absolute;
    right: 10px;
    width: 89px;
  }
  
  #junges-wohnen a span span {
    color: #851f83;
    display: block;
    padding-top: 5px;
    text-decoration: underline;
  }
  
  #junges-wohnen a:hover span, #junges-wohnen a:focus span {
    text-decoration: none;
  }
  
  #googleroutenplaner {
    background: #fff url('../img/googleroutenplaner_bg.gif') no-repeat right top !important;
    padding: 0 6px;
    width: 448px;
  }
  
  #googleroutenplaner h3, #googleroutenplaner p {
    color: #851f83;
  }
  
  #googleroutenplaner h3 {
    font-size: 200%;
    line-height: 100%;
    padding: 14px 0 20px;
    text-transform: uppercase;
    width: 100px;
  }
  
  #googleroutenplaner img {
    border: 1px solid #000;
  }
  
  .imgBox .im {
    float: left;
  }
  
  .imgBox .tx {
    float: right;
  }
  
  #googleroutenplaner .imgBox .im {
    width: 214px;
  }
  
  #googleroutenplaner .imgBox .tx {
    padding-top: 3px;
    width: 214px;
  }
  
  #googleroutenplaner .imgBox .tx p {
    line-height: 130%;
    padding: 10px 0 0;
  }
  
  #textTeaser {
    background: #fff;
    height: 335px;
    padding: 0;
    position: relative;
  }
  
  #textTeaser .textTeaserBoxText {
	background: #fff;
	bottom: 12px;
	display: block;
	left: 12px;
	padding: 10px 10px 5px 10px;
	position: absolute;
	width: 921px;
  }
  
  #textTeaser .textTeaserBoxText h2 {
    padding-top: 0;
  }
  
  #textTeaser .textTeaserBoxText p {
    padding-bottom: 5px;
  }
  
  #clientClub {
    background: #fff;
    padding: 0;
    width: 966px;
  }
  
  #clientClub .left, #clientClub .right {
    height: 300px;
  }
  
  #clientClub .left {
	background: transparent url('../img/hausmann_clubcard.png') no-repeat left bottom;
    /*background: transparent url('../img/clientclub_card.jpg') no-repeat left bottom;*/
    float: left;
    padding: 10px 0 0 15px;
    width: 556px;
  }
  
  #clientClub .left h2 {
    padding-top: 10px;
  }
  
  #clientClub .left p {
    padding-bottom: 10px;
  }
  
  #clientClub .left ul {
    color: #851f83;
    font-weight: bold;
    padding: 30px 0 0 250px;
    text-transform: uppercase;
  }
  
  #clientClub .left ul li {
    line-height: 120%;
    padding: 0;
  }
  
  #clientClub .right {
    float: right;
    padding: 0 0 0 20px;
    text-align: left;
    width: 345px;
  }
  
  #clientClub .right a {
    background: transparent url('../img/clientclub_discount.jpg') no-repeat right bottom;
    color: #000;
    display: block;
    font-size: 140%;
    font-weight: bold;
    padding: 22px 0 0 0;
    height: 288px;
    text-align: left;
    text-decoration: none;
    text-transform: uppercase;
  }
  
  #clientClub .right a:hover, #clientClub .right a:focus {
    color: #851f83;
  }
  
  #footer {
    background: #808080 url('../img/footer_bg.gif') repeat-x left bottom;
    padding: 10px;
  }
  
  #footer, #footer a {
    color: #fff;
    text-decoration: none;
  }
  
  #footer {
    padding: 10px;
    width: 946px;
  }
  
  #footer .fnav {
    display: block;
    float: left;
    font-weight: bold;
    padding-top: 4px;
    text-transform: uppercase;
    width: 600px;
  }
  
  #footer .fnav span {
    padding: 0 3px;
  }
  
  #footer .fnav a:hover, #footer .fnav a:focus {
    text-decoration: underline;
  }
  
  #footer .social {
    float: right;
    text-align: right;
    width: 200px;
  }
  
  #footer .social a {
    margin-left: 5px;
  }
  
  #footer .social img {
    vertical-align: middle;
  }
}

@media print {
  html, body {
    background: #fff;
    color: #000;
    font-size: 11pt;
    line-height: 150%;
  }
  
  h1, h2, h3, h4, h5, h6 {
    font-size: 11pt;
    font-weight: bold;
  }
  
  h1 {
    font-size: 17pt;
  }
  
  h2 {
    font-size: 12pt;
  }
  
  #logo, .box, .mediabox {
    border-bottom: 1px solid #ccc;
    padding-bottom: 11pt;
    margin-bottom: 11pt;
  }
  
  #logo h1 a {
    color: #000;
    text-decoration: none;
  }
  
  #teaserSplitBox .container {
    float: left;
    padding: 10px;
  }
  
  #logo p, #metaNav, #mainNav, #footer,
  .textTeaserBoxImages {
    display: none;
  }
}