/* BASIC PAGE SETUP ============================================================================= */
@import url(http://fonts.googleapis.com/css?family=Open+Sans:300,400,700,300italic,400italic,700italic);
@import url(http://fonts.googleapis.com/css?family=PT+Sans+Narrow:400,700);

body {
	margin : 0 auto;
	padding : 0;
	text-align: center;	
	background-image:url(../images/hg04.jpg);
	background-attachment:fixed;
	color: #fff;
	font-weight: 300;
	font-style:normal;
	font-family: 'Open Sans', Calibri, Arial, sans-serif;
}

a {
	text-decoration: none;
	color: #fff;
	-moz-transition: color 0.25s linear;
	-o-transition: color 0.25s linear;
	-webkit-transition: color 0.25s linear;
	transition: color 0.25s linear;
	cursor:pointer;
	outline: none;
}

a:hover, a:focus, a:active {
	color: #fff;
	outline: none;
}


/*  MAIN LAYOUT  ============================================================================= */

.clearfix:before,
.clearfix:after {
	display: table;
	content: " ";
}

.clearfix:after {
	clear: both;
}

#wrapper {
  width: 100%;
  min-height: 100vh;
  position: relative;
  text-align: left;
}

.wrap      { float:left; width:100%; }

#headcontainer {
  width: 100%;
  margin-top: 0px;
  z-index: 99999;
  background-repeat:no-repeat;
  background-position:top;
  background-attachment: fixed;
}

.boxshadow {
	border-bottom: solid 1px #DADADA;
	-webkit-box-shadow: 0px 4px 7px 0px rgba(0, 0, 0, 0.1);
	box-shadow: 0px 4px 7px 0px rgba(0, 0, 0, 0.1);
}

header {
      clear: both;
      width: 100%;
      /*max-width: 80em;*/
      margin: 0 auto;
      padding: 0px;
      position: relative;
      color: #fff;
}

.strich {
	width: 100%;
	border-bottom: 1px solid #fff;
}

#toplogo {
	display: block;
	float: left;
	width:80%;
	margin: -2em 10% 0.5em 10%;
	padding: 0;
	text-align:center;
}

/* -------------- Footer Settings START ---------------------*/


footer {
	position:absolute;
	bottom: 0em;
	background:#f21422;
	padding: 2.8em 0 2.6em 0;
	color:#fff;
	}

footer .inner { margin:0 auto; width: 85%; max-width: 80em; clear:both; }

footer a { color:#fff; text-decoration:underline; }
footer a:hover { text-decoration:underline; color:#ff0; }

.text-footer {
	padding: 0;
	margin: 0;
	text-align: center;
font-size : 1em;
line-height: 1.4em;
font-weight: 400;
}

/* -------------- Footer Settings END ---------------------*/


/*  SECTIONS  */
.section {
  clear: both;
  padding: 0px;
  margin: 0px;
}

/*  GROUPING  */
.group:before,
.group:after {
  content:"";
  display:table;
}

.group:after {
  clear:both;
}


/*  GRID COLUMN SETUP   ============================================================================= */

.mycol {
  float:left;
}

.col {
  display: block;
  float:left;
  margin: 1% 0 1% 2.2%;
}
.col:first-child { margin-left: 0; } /* all browsers except IE6 and lower */

.span_5_of_6 {  width:82.9166666667%; }
  .span_4_of_6 { width:65.8333333333%; }
    .span_3_of_6 { width:48.75%; }
      .span_2_of_6 { width:31.6666666667%; }
        .span_1_of_6 { width:14.5833333333%; }
        
.span_6_of_7 { width:85.3571428571%; }
  .span_5_of_7 {  width:70.7142857143%; }
    .span_4_of_7 { width:56.0714285714%; }
      .span_3_of_7 { width:41.4285714286%; }
        .span_2_of_7 { width:26.7857142857%; }
          .span_1_of_7 { width:12.1428571429%; }
            
.span_7_of_8 {   width:87.1875%; }
  .span_6_of_8 { width:74.375%; }
    .span_5_of_8 {  width:61.5625%; }
      .span_4_of_8 { width:48.75%; }
        .span_3_of_8 { width:35.9375%; }
          .span_2_of_8 { width:23.125%; }
            .span_1_of_8 { width:10.3125%; }
            
/*  GRID OF TWO   ============================================================================= */

.span_2_of_2 {
  width: 100%;
}

.span_1_of_2 {
  width: 48.6%;
}

            
            
/*  HOMEPAGE FEATURES  ============================================================================= */

.resetlist { margin:0; padding:0; list-style-type:none; }

.backtotop { display:none; }

/*  PAGE FEATURES  ============================================================================= */

.homepagefeature {
  position: relative;
}

.homepagefeature .homebutton { position: absolute; bottom: 1em; }

.breadcrumb { color:#888; padding:0.8em 0 0 0; }
.breadcrumb a { color:#004a8d; }


/* ausrichtungen links mitte rechts über typo3 classen ----*/
.align-center {
  text-align: center;
}
.align-left {
  text-align: left;
}

.align-right {
  text-align: right;
}
.opacity {   
    opacity: 0.6;       /* modern browser */  
    -moz-opacity: 0.6;  /* older Mozilla browser */  
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; /* IE8 in Standard Compliant Mode */  
    filter:alpha(opacity=60); /* IE5.x -7.0 */  
}


/*------------------------------ */


p .nopadding {
  padding: 0;
}

  
/*  COLUMNS  ============================================================================= */

.twocolumns{
  -moz-column-count: 2;
  -moz-column-gap: 2em;
  -webkit-column-count: 2;
  -webkit-column-gap: 2em;
  column-count: 2;
  column-gap: 2em;
  }


/*  HEADINGS  ============================================================================= */

h1, h2, h3, h4, h5, h6 {
font-family: 'PT Sans Narrow', sans-serif;
}

.my-h1, .my-h2 {
font-family: 'Open Sans', Calibri, Arial, sans-serif;
}

h1 { 
color: #fff;
margin: 0 0 0.2em 0;
font-size : 3.5em;
line-height : 1.1em;
font-weight: 700;
 -webkit-hyphens: auto;
 -moz-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto;
}

h2 { 
color: #fff;
margin: 0 0 2.5em 0;
font-size : 1.8em;
line-height : 1.4em;
font-weight: 400;
 -webkit-hyphens: auto;
 -moz-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto;
}


h3 { 
color: #fff;
margin-top: 0em;
margin-bottom : 0.6em;
font-size : 1.6em;
line-height : 1.0em; 
font-weight: 400;
 -webkit-hyphens: auto;
 -moz-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto;
}

h4 { 
color: #fff;
margin-top: 0em;
margin-bottom : 0.6em;
font-size : 1.4em;
line-height : 1.0em;
font-weight: 400;
 -webkit-hyphens: auto;
 -moz-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto;
}

h5 { 
font-family: 'Open Sans', Calibri, Arial, sans-serif;
color: #fff;
margin-top: 0em;
margin-bottom : 0.8em;
font-size : 1.1em;
line-height : 0.9em;
font-weight: 400;
 -webkit-hyphens: auto;
 -moz-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto;
}

h6 { 
color: #fff;
font-size : 1em; /* 16 / 16  */
 -webkit-hyphens: auto;
 -moz-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto;
}

.my-h1 { 
color: #333;
margin: 1.4em 0 -0.2em 0;
font-size : 2.0em;
line-height : 1.1em;
font-weight: 700;
 -webkit-hyphens: auto;
 -moz-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto;
}
.my-h1:first-child {
	margin-top: 0.4em;
}

.my-h2 { 
color: #333;
margin: 1em 0 -0.4em 0;
font-size : 1.4em;
line-height : 1.1em;
font-weight: 700;
 -webkit-hyphens: auto;
 -moz-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto;
}

.my-text1 {
color: #333;
margin: 0 0 0 0;
font-size : 1.1em;
line-height : 1.4em;
font-weight: 400;
 -webkit-hyphens: auto;
 -moz-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto;
}

.my-text2 {
color: #333;
margin: 0 0 0 0;
font-size : 1.05em;
line-height : 1.3em;
font-weight: 400;
 -webkit-hyphens: auto;
 -moz-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto;
}
.my-text2:last-child {
	margin-bottom: 12em;
}



/*  TYPOGRAPHY  ============================================================================= */

p, ol, ul, dl, address { 
font-size : 1em; /* 16 / 16 = 1 */
margin-bottom: -0.4em;
}
.my-p {
}

p { /* Silbentrennung */
 -webkit-hyphens: auto;
 -moz-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto;
}

p.center {
text-align: center;
}

.fett {	font-weight:bold;}
.gross { text-transform: uppercase;}
.unterstrichen { text-decoration:underline; }
.kursiv {	font-style:italic;}
.rot {	color: #890a25;}
.gelb { color: #FF0;}
.orange { color: #F08B2D;}

ul, 
ol { 
margin : 0 0 1.5em 0; 
padding : 0 0 0 0px;
}

li ul, 
li ol { 
margin : 0;
font-size : 1em; /* 16 / 16 = 1 */
}

dl, 
dd { 
margin-bottom : 1.5em; }

dt { 
font-weight : normal; }

b, strong { 
font-weight : bold; }

hr { 
display : block; 
margin : 1em 0; 
padding : 0;
height : 1px; 
border : 0; 
border-top : 1px solid #ccc;
}

small { 
font-size : 1em; /* 16 / 16 = 1 */ }

sub, sup { 
font-size : 75%; 
line-height : 0; 
position : relative; 
vertical-align : baseline; }

sup { 
top : -.5em; }

sub { 
bottom : -.25em; }


/* IMAGES ============================================================================= */

img {
border : 0;
max-width: 100%;
height: auto;
}

img.floatleft { float: left; margin: 0 0.5em 0.2em 0;  width: 38% }
img.floatright { float: right; margin: 0 0 0.2em 0.5em; width: 38% }



div.clear { clear: both; line-height: 0px; font-size: 0px; height: 0px; overflow: hidden; text-indent: -100px; }
 

#mainNav {
		position:relative;
		margin:0;
		float:left;
		width: 100%;
		border-bottom: 4px solid #fff;
		border-top: 1px solid #cad6de;
		background: #2286c9;
}
		
#mainNav .inner { margin:0 auto; width: 100%; max-width: 80em; clear:both;}

.block {
	background: #2286c9;
	float: left;
	padding: 0em 1em;
	width: 100%;
}

.block p {
	margin: 0;
	font-size: 1.4em;
	line-height: 48px;
}

#maincontentcontainer {
    width: 100%; 
    margin-top: 1em;
    margin-bottom: 1em;
    padding-top: 20px;
}

#maincontentcontainer2 {
    width: 100%; 
    margin-top: 1em;
    margin-bottom: 1em;
    padding-top: 20px;
}

#maincontent {
      clear: both;
      width: 90%; /* 1024px bei 1280px max-width */
      max-width: 80em; /* 1280px / 16 */
      margin: 0 auto;
      color: #333;
      line-height: 1.5em;
}
.hp-img {
	display: block;
	float: left;
	width:90%;
	margin: 0em 5% 12em 5%;
	padding: 0;
	text-align:center;
}

/* Textschablone1 Start --------------------------------- */

.textschablone1 {
    width: 100%;
    margin: 0 auto 3em auto;
}

.textschablone1 .block_header {
    width: 100%;
	color: #333;
	font-family: 'Open Sans', Calibri, Arial, sans-serif;
	font-weight: 700;
	text-transform:uppercase;
}

.textschablone1 .block_header .name {
	float:left;
	width: 90%;
	text-align: left;
	margin-top: 0.7em;
	padding-bottom: 0.38em;
	font-size: 2.1em;
}

.textschablone1 .block_header .funktion {
	float:right;
	width: 10%;
	text-align: right;
	margin-top: 0.7em;
	padding-bottom: 0.38em;
	font-size: 2.1em;
}

.textschablone1 .block_info {
    /*border: solid 1px #333;*/
	display:block;
    width: 100%;
	/*background-color: #ebebeb;*/
}

.textschablone1 .block_info .infotext {
	margin: 1em 2% 1em 2%;
	float:left;
	width: 96%;
	font-family: 'Open Sans', Calibri, Arial, sans-serif;
	font-weight: 400;
	font-size: 1.1em;
}

.textschablone1 .block_info .infotext a {
	color: #333;
	text-decoration: underline;
}

.textschablone1 .block_info .infotext a:hover {
	text-decoration: underline;
	color: #f00;
}

.textschablone1 .block_info .infotext .spalte {
    float:left;
	width: 198px;
    margin: 0.5em 0 2em 0;
	color: #333;
	text-align: center;
}
.textschablone1 .block_info .infotext .spalte .foto {
	padding: 0em;
}

.textschablone1 .block_info .infotext .spalte .zeile1 {
	font-weight:bold;
	margin-bottom: 0.3em;
}

.textschablone1 .block_info .infotext .h1-inner {
	font-weight: 700;
	font-size: 1.3em;
	text-transform:uppercase;
	color: #333;
	padding-bottom: 0.3em;
	padding-top: 1em;
}

.textschablone1 .block_info .infotext .h1-inner:first-child {
	padding-top: 0.3em;
}

.textschablone1 .block_info .infotext .h2-inner {
	font-weight: 700;
	font-size: 1.1em;
	color: #333;
	padding-bottom: 0.3em;
	padding-top: 0.7em;
}

.textschablone1 .block_info .infotext p {
	padding-bottom: 0.5em;
	margin: 0;
}
.textschablone1 .block_info .infotext p:last-child {
	margin-bottom: 8em;
}

.textschablone1 .block_info .bild {
	float: right;
	width: 33%;
	text-align: right;
	margin: 0.5em 0 0.5em 2%;
}

.textschablone1 .block_info .bild2 {
	clear:left;
	width: 50%;
	margin: 0.75em 0 0.75em 5%;
}


.schablone-bilder {
	position: relative;
    width: 100%;
    margin: 0 auto 10em auto;
}

.schablone-bilder .block_info {
    /*border: solid 2px #244466;*/
	display:block;
    width: 100%;
	color: #fff;
	/*background-color: #244466;*/
}

.schablone-bilder .block_info .block_bilder {
	margin: 0;
	padding: 0;
	float:right;
	width: 100%;
}

.schablone-bilder .block_info .block_bilder .bild {
	float: left;
	width: 100%;
	text-align: left;
	overflow: hidden;
}

.schablone-bilder .block_info .block_bilder .bild img {
	margin: 0.4em 0.4em 0.4em 0.4em;
}


.google-maps {
	position: relative;
	padding-bottom: 62.5%; // This is the aspect ratio
	height: 0;
	overflow: hidden;
	margin-bottom: 0px;
}

.google-maps iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}


 /*  MEDIA QUERIES  ============================================================================= */

@media screen and (max-width: 1440px) 
{
footer .inner,
header,
#breadcrumb,
#maincontent
	{
/*width: 90%;*/
}

#mainNav .inner
	{
   width: 90%;
}
	
}

@media screen and (max-width: 1280px) 
{
}

@media screen and (max-width: 1140px) 
{
.textschablone1 {
	margin-bottom: 2.8em;
}
.textschablone1 .block_header {
	font-size: 90%;
}
.textschablone1 .block_header .name,
.textschablone1 .block_header .funktion {
	padding-bottom: 0.36em;
}
.textschablone1 .block_info {
	font-size: 90%;
}
.textschablone1 .block_info .infotext p {
	line-height: 1.4em;
}

.my-h1 {
font-size : 1.8em;
margin-top: 1.26em;
}
.my-h1:first-child {
	margin-top: 0.36em;
}
.my-text1 {
font-size : 0.99em;
}
.my-h2 {
font-size : 1.26em;
}
.my-text2 {
font-size : 0.945em;
}
.text-footer {
font-size : 0.9em;
line-height: 1.3em;
}
footer {
	padding-top: 2.4em;
	padding-bottom: 2.2em
	}

}

@media screen and (max-width: 1024px) 
{
.textschablone1 {
	margin-bottom: 2.6em;
}
.textschablone1 .block_header {
	font-size: 85%;
}
.textschablone1 .block_header .name,
.textschablone1 .block_header .funktion {
	padding-bottom: 0.34em;
}
.textschablone1 .block_info {
	font-size: 85%;
}
.textschablone1 .block_info .infotext p {
	line-height: 1.34em;
}

.my-h1 {
font-size : 1.7em;
margin-top: 1.19em;
}
.my-h1:first-child {
	margin-top: 0.34em;
}
.my-text1 {
font-size : 0.935em;
}
.my-h2 {
font-size : 1.19em;
}
.my-text2 {
font-size : 0.8925em;
}
}

@media screen and (max-width: 880px) 
{

.textschablone1 {
	margin-bottom: 2.5em;
}
}

@media screen and (max-width: 816px) 
{
.textschablone1 {
	margin-bottom: 2.3em;
}
}

@media screen and (max-width: 768px) 
{
#toplogo {
	margin-top: -1em;
}
}

@media screen and (max-width: 740px) 
{
.textschablone1 {
	margin-bottom: 2.1em;
}

}

@media screen and (max-width: 704px) 
{
header {
	width: 100%;
}
	
body { font-size:1em; }

}

.span_1_of_6, 
.span_2_of_6,
 .span_3_of_6,
  .span_4_of_6,
   .span_5_of_6,
    .span_6_of_6
	 {
    width: 100%; margin:0 0 1em 0;
  }
  
.span_1_of_7,
 .span_2_of_7,
  .span_3_of_7,
   .span_4_of_7,
    .span_5_of_7,
	 .span_6_of_7,
	  .span_7_of_7
	   {
    width: 100%; margin:0 0 1em 0;
  }
.span_1_of_8,
 .span_2_of_8,
  .span_3_of_8,
   .span_4_of_8,
    .span_5_of_8,
	 .span_6_of_8,
	  .span_7_of_8,
	   .span_8_of_8
	    {
  width: 100%; margin:0 0 1em 0;
  }
  
  /*  GO FULL WIDTH AT LESS THAN 480 PIXELS */

  .span_2_of_2 {
    width: 100%; margin:0 0 1em 0;
  }
  .span_1_of_2 {
    width: 100%; margin:0 0 1em 0;
  }

  .pagefeature {
  background: #fff;
  padding: 1em;
  box-shadow: 4px 4px 4px rgba(102, 102, 102, 0.10);
  min-height: 380px;
}
  
.backtotop { display:block; width:100%; background:#333; background:rgba(0,0,0,0.7); text-align:center; margin:0em 0 1em 0; padding:0.7em 0; border-radius:8px; }
  
img.floatleft { float: left; margin: 0 0.5em 0.2em 0;  width: 50% }
img.floatright { float: right; margin: 0 0 0.2em 0.5em; width: 50% }

}  

@media only screen and (max-width: 660px)
{
}



@media only screen and (max-width: 560px)
{
}

@media only screen and (max-width: 480px)
{
.strich {
	display:none;
}
	
	
.col { 
    margin: 1% 0 1% 0%;
}

.span_1_of_6,
 .span_2_of_6,
  .span_3_of_6,
   .span_4_of_6,
    .span_5_of_6,
	 .span_6_of_6
	  {
    width: 100%; margin: 0 0 1em 0;
}
  
.span_1_of_7,
 .span_2_of_7,
  .span_3_of_7,
   .span_4_of_7,
    .span_5_of_7,
	 .span_6_of_7,
	  .span_7_of_7
	   {
    width: 100%; margin:0 0 1em 0;
}

.span_1_of_8,
 .span_2_of_8,
  .span_3_of_8,
   .span_4_of_8,
   .span_5_of_8,
    .span_6_of_8,
     .span_7_of_8,
      .span_8_of_8
       {
  width: 100%; margin:0 0 1em 0;
}

.textschablone1 {
	margin-bottom: 1.9em;
}

#toplogo {
	margin-top: -0.5em;
	margin-bottom: 0em;
}
.hp-img {
	display: block;
	float: left;
	width:98%;
	margin: 0em 1% 12em 1%;
	padding: 0;
	text-align:center;
}


}

@media only screen and (max-width: 340px)
 {
.block p {
	line-height: 44px;
}
/* Pushmenü Ende */	 
	 
#mainNav .inner,
footer .inner,
#breadcrumb,
#maincontent {
      width: 90%;
}

header {
		width: 100%
}
/*
body {
		font-size: 90%;
}
*/


footer {
		font-size: 0.9em;
}

.anschrift-footer img {
	width: 90%;
}
}