@charset "iso-8859-1";
/* CSS Document */

/* roboto-500 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/roboto-v30-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/roboto-v30-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/roboto-v30-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/roboto-v30-latin-500.woff') format('woff'), /* Modern Browsers */
       url('../fonts/roboto-v30-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/roboto-v30-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* ubuntu-300 - latin */
@font-face {
  font-family: 'Ubuntu';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/ubuntu-v20-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../fonts/ubuntu-v20-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/ubuntu-v20-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/ubuntu-v20-latin-300.woff') format('woff'), /* Modern Browsers */
       url('../fonts/ubuntu-v20-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/ubuntu-v20-latin-300.svg#Ubuntu') format('svg'); /* Legacy iOS */
}
body {
  background-color:#b2e0d8;
  font-family: 'Ubuntu', sans-serif;
  font-size:120%;
  line-height:140%;
  margin:0px;
  padding:0px;
}
.container {
  position:relative;
  margin:0px auto;
  width:80%;
  height:auto;
  min-height:500px;
  background-color:#fff;
}
.logo {
  position:relative;
  width:100%;
  height:90px;
  text-align:center;
  padding:30px 0px 0px 0px;
  background-color:#fff;
}
.bild {
  position:relative;
  width:100%;
  display:inline-block;
  text-align:center;
  height:auto;
}
.content {
  position:relative;
  display:block;
  width:100%;
  margin:0 auto;
}
.notdienst {
  display:block;
  width:250px;
  height:270px;
  position:absolute;
  top:2%;
  right:0px;
  background-color:#69cbba;
}
.notdienst .innen {
  display:block;
  margin:10px;
  height:244px;
  border:2px solid #fff;
}
.notdienst .innen p {
  margin:7px 0px;
}
.notdienst .innen table {
  width:180px;
  margin:0 auto;
}
span.not {font-size:80%;line-height:150%;}
.footer {
  position:relative;
  display:block;
  width:100%;
  height:40px;
  color:#fff;
  text-align:right;
  background-color:#666;
}
a:link, a:visited {
  color:#000;
  text-decoration:none;
}
a:hover, a:active {
  color:#69cbba;
  text-decoration:none;  
}
a.impressum {
  color:#fff;
  margin-right:10px;
  padding-top:5px;
  float:right;
  display:inline-block;
}
a.datenschutz {
  color:#fff;
  padding-right:30px;
  padding-top:5px;
  display:inline-block;
}
a.impressum:hover,
a.impressum:active,
a.datenschutz:hover, 
a.datenschutz:active {
  color:#69cbba;
}
h1 {line-height:120%;}
.portrait, .portrait2 {
  display: inline-block; 
  width: 170px; 
  background-color: #999; 
  height: 320px; 
  padding: 15px; 
  line-height:115%;
  margin: 0px 15px 20px 0px;
}
p.adr {
  font-size: 80%; 
  color: #fff; 
  text-align: center; 
  font-weight: bold; 
  line-height: 135%;
}
.portrait1 {
  display: inline-block; 
  width: 170px; 
  background-color: #999; 
  height: 260px; 
  line-height:115%;
  padding: 15px; 
  margin: 0px 15px 20px 0px;
}
.zeiten {width: 20%;height:250px;}
.adresse {width: 40%;height:250px;}
.anfahrt {width: 40%;}
.item.span12 p {display:none;}
.item.span12 p.funktion {display:block;}
.titelbild {width:100%;}

/* `Container
----------------------------------------------------------------------------------------------------*/
.satzspiegel {
  position:relative;
  margin-left: auto;
  margin-right: auto;
  display:block;
  width:100%;
  margin:5% auto;
}

/* `Grid >> Global
----------------------------------------------------------------------------------------------------*/

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
  display: inline;
  float: left;
  margin-left: 10px;
  margin-right: 10px;
}

/* `Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/

.alpha {
  margin-left: 0;
}

.omega {
  margin-right: 0;
}

/* `Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/
.grid_1 {
  font-size:80%;
  margin-left:0px;
  width:40%;
  max-width:150px;
  min-width:70px;
}
.satzspiegel .grid_1 {
  width: 60px;
}

.satzspiegel .grid_2 {
  width: 140px;
}

.satzspiegel .grid_3 {
  width: 220px;
}

.satzspiegel .grid_4 {
  width:28%;
  min-width: 300px;
}

.satzspiegel .grid_5 {
  width: 380px;
}

.satzspiegel .grid_6 {
  width:50%;
  min-width: 460px;
}

.satzspiegel .grid_7 {
  width: 540px;
}

.satzspiegel .grid_8 {
  width:52%;
  padding-left:20%;
}

.satzspiegel .grid_9 {
  width: 700px;
}

.satzspiegel .grid_10 {
  width: 780px;
}

.satzspiegel .grid_11 {
  width: 860px;
}

.satzspiegel .grid_12 {
  width: 60%;
  padding:0px 20%;
}
/* http://sonspring.com/journal/clearing-floats */

.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */

.clearfix:before,
.clearfix:after,
.satzspiegel:before,
.satzspiegel:after {
  content: '.';
  display: block;
  overflow: hidden;
  visibility: hidden;
  font-size: 0;
  line-height: 0;
  width: 0;
  height: 0;
}

.clearfix:after,
.satzspiegel:after {
  clear: both;
}

/*
  The following zoom:1 rule is specifically for IE6 + IE7.
  Move to separate stylesheet if invalid CSS is a problem.
*/

.clearfix,
.satzspiegel {
  zoom: 1;
}
@media screen and (min-width:1024px) and (max-width:1345px) {
  .zeiten {
    width:35%;
    font-size:90%;
    height:250px;
}
span.not {font-size:90%;line-height:120%;}
.adresse {
	width:35%;
    font-size:80%;height:250px;}
.anfahrt {width:30%;}
  }
@media screen and (min-width:768px) and (max-width:1260px) {
.satzspiegel {
  width:100%;
}
.satzspiegel .grid_8 {
  width:52%;
  padding-left:10%;
}
.grid_1 {
        margin-left:0px;
    }
}

@media screen and (min-width:768px) 
and (max-width:1024px) 
and (orientation : landscape) {

  .zeiten {width:30%;}
  .adresse {width:70%;}
  .anfahrt {width:100%;}
}
@media screen and (min-width:768px) 
and (max-width:1024px) 
and (orientation:portrait) { 
.container {
  width:94%;
}
.portrait, .portrait2 {
  display: inline-block; 
  width: 150px; 
  background-color: #999; 
  height: 300px; 
  padding: 10px; 
  line-height:125%;
  margin: 0px 10px 10px 0px;
}
.portrait1 {
  display: inline-block; 
  width: 150px; 
  background-color: #999; 
  height: 230px; 
  padding: 10px; 
  line-height:125%;
  margin: 0px 10px 10px 0px;
}
  .zeiten {width:30%;}
  .adresse {width:69.5%;}
  .anfahrt {width:100%;}
}
@media screen and (min-width:601px)
and (max-width:1024px)  {
  .zeiten {
    width:50%;
    font-size:90%;
    height:250px;
}
span.not {font-size:90%;line-height:120%;}
.adresse {
	width:50%;
    font-size:80%;height:250px;}
.anfahrt {width:100%;}
  }
@media only screen 
and (max-width:600px) {
.container {
  	width:100%;
  }
.titelbild {
  width:130%;
  display:inline-block;
}
.bild {
  display:inline-block;
  	overflow:hidden;
  }
.notdienst {
    position:relative;
  	width:90%;
  	padding:5%;
  	height:15%;
  	right:0;
  }
.notdienst .innen {
  display:block;
  height:5%;
  border:2px solid #fff;
}
.notdienst .innen p {
  margin:7px 15px;
  color:#fff;
  
}
.notdienst .innen table {
  width:180px;
  margin:0 auto;
}
p.adr {
  font-size: 100%; 
  color: #fff; 
  text-align: center; 
  font-weight: bold; 
  line-height: 135%;
}
.grid_1 {
  font-size:100%;
  margin-left:0px;
  max-width:100px;
  min-width:70px;
}
.portrait {
  display: inline-block; 
  width: 150px; 
  background-color: #999; 
  height: 300px; 
  padding: 10px; 
  margin: 0px 10px 20px 0px;
}
.portrait1, .portrait2 {
  display: inline-block; 
  width: 150px; 
  background-color: #999; 
  height: 240px; 
  padding: 10px; 
  margin: 0px 10px 20px 0px;
}
#lgx-parallax91 {
    height: 1000px;
    width: 100%;
    margin: 0px 0px 0px 0px;
  }
.satzspiegel .grid_1,
.satzspiegel .grid_2,
.satzspiegel .grid_3,
.satzspiegel .grid_4,
.satzspiegel .grid_5,
.satzspiegel .grid_6,
.satzspiegel .grid_7,
.satzspiegel .grid_8,
.satzspiegel .grid_9,
.satzspiegel .grid_10,
.satzspiegel .grid_11,
.satzspiegel .grid_12 {
  width:96%;
  padding:1.5%;
}
  .zeiten {width:46%;
  font-size:80%;}
  span.not {font-size:100%;line-height:120%;}
  .adresse {width:53.5%;
  font-size:80%;}
  .anfahrt {width:100%;}
  }
@media only screen 
and (max-width : 480px)
and (orientation : portrait) {
  #lgx-parallax91 {
    height: 1400px;
    width: 100%;
    margin: 0px 0px 0px 0px;
  }
  h1 {font-size:120%;line-height:135%;}
.zeiten {
    width:100%;
    font-size:80%;
    height:250px;
}
span.not {font-size:100%;line-height:120%;}
.adresse {
	width:100%;
    font-size:80%;height:160px;}
.anfahrt {width:100%;}
  }