/**
 * CSS Framework
 *
 * default screen stylesheet - Master-layout type layout
 *
 * version 0.0.1
 */

@media screen {
  /* force vertical scrollbar */
  body {
    overflow-y: scroll;
    background-color:#f1f1f1;
  }

  /* fallback for missing media queries support*/
  body > header, body > nav, body > main, body > footer {
    min-width: 760px;
  }

/* ----- Basic Element Styling */
  header {
    background: #ffffff;
    background: #ffffff url() repeat-x top center;
    background-size: cover;
    color: #ffffff;
  }
/*
   .home header { background-image: url(/images/headbilder/head-home.jpg); }
  .content header { background-image: url(/images/headbilder/head-person.jpg);}
  .listen header { background-image: url(/images/headbilder/head-angebot.jpg);}
  .team header { background-image: url(/images/headbilder/head-team.jpg);}
  .seminare header { background-image: url(/images/headbilder/head-person.jpg);}
  .intern header { background-image: url(/images/headbilder/head-gestalt.jpg);}
  .kontakt header { background-image: url(/images/headbilder/head-kontakt.jpg);}
  .newsletter header { background-image: url(/images/headbilder/head-newsletter.jpg);}
  .impressum header { background-image: url(/images/headbilder/head-impressum.jpg);}
*/
  header .header {
    background-color: rgba(0,0,0,0);
    padding: 0.8em 0em 0em 0em;
    color: #FFF;
    //min-height:160px;
    text-align:center;
  }
/*
  //.home header .header { background-image: url(/images/headbilder/head-home.jpg); }
  //.person header .header { background-image: url(/images/headbilder/head-person.jpg);}
  //.angebot header .header { background-image: url(/images/headbilder/head-angebot.jpg);}
  //.gestalt header .header { background-image: url(/images/headbilder/head-gestalt.jpg);}
  //.kontakt header .header { background-image: url(/images/headbilder/head-kontakt.jpg);}
  //.impressum header .header { background-image: url(/images/headbilder/head-impressum.jpg);}
*/
  header .logo {
    float:right;
    margin:0px 0px 0px 0px;
			float:none;
			width:95%


  }
  header .zerti {
    float:left;
    margin: 0px 0px 10px 20px;
    height: 60px;
  }


  nav {
    background: #ffffff;
    padding-bottom: 18px;
    padding-top: 20px;
    margin-bottom: 0em;
  }


  main {
    position: relative;
    background: #dcdcdc;
  }
  main .info {
    margin-bottom: 1.5em;
  }
  .colleft {
    padding-top: 25px;
    background-color:#dcdcdc;
  }


  aside {
    border-left: 1px #ddd solid;
    margin-left:-0px;
  }

  footer {
    //height: 200px;
    color: #444;
    padding: 2.45em 0.8em 0.5em 0.8em;
    margin: 0px 0px 50px 0px;
    border: 0px #dedede solid;
    overflow:hidden;
    background: #505050;
    //height:200px
  }
  footer .col-sm-12, 
  footer .col-sm-6 { 
    padding-right: 0px !important;
    padding-left: 0px !important;
    padding-top: 0px !important;
  }
  footer p {
    margin:11px 0px 0px 0px;
    text-align:left;
  }
  footer a {
    color: #ffffff;
  }
  footer a:hover,
  footer a:focus {
    color: #eb691b;
  }
  footer ul {
    //width: 100%;
    overflow: hidden;
    float: left;
    position: relative;
    line-height: 1em;
    background: transparent none repeat scroll 0% 0%;
    margin: 0px;
    padding: 0.5em 1.5em;
    display: inline;
    border: 0px solid #E1E1E1;
  }
  footer ul li {
    display: inline;
    float: left;
    font-size: 1em;
    line-height: 1;
    list-style-type: none;
    margin: 0px 0.25em 0px 0px;
    padding: 0px;
  }
  footer ul li a {
    background: transparent none repeat scroll 0% 0%;
    color: #ffffff;
    display: block;
    font-size: 1em;
    line-height: 2em;
    padding: 0px 0.5em;
    font-weight: normal;
    text-decoration: none;
    width: auto;
  }
  footer ul li a:hover,
  footer ul li a.aktiv{
    color: #eb691b;
  }

	footer .headbox,
  footer .adressbox,
  footer .phonebox,
  footer .copybox,
  footer .navibox,
  footer .mailbox {
    color: #ffffff;
    margin:0;
    padding:0;
    border:0px solid #5a5a5a;
  }
  footer .headbox {
    font-size: 135%;
    color: #ffffff;
    text-transform:uppercase;
    margin:0px 0px 10px 0px;
    padding:0;
    border:0px solid #5a5a5a;
  }
  footer .navibox {
    color: #ffffff;
    margin:0;
    padding:0;
    border:0px solid #5a5a5a;
    text-align:right;
  }
  footer .navibox p {
    text-align:right;
  }
  footer .navibox ul {
    padding-right: 0em;
  }
  footer .navibox ul li {
    margin: 0px 0em 0px 0px;
  }
  footer .navibox ul li:last-child a {
    padding-right: 0px;
  }
  footer .copybox {
    font-size: 78%;
    color: #ffffff;
    text-align:left;
    margin:40px 0px 10px 30px;
    padding:0;
  }
  footer .adress,
  footer .phone,
  footer .fax,
  footer .copyright,
  footer .mailadress {
    color: #ffffff;
    line-height:1.8em
  }
  footer .adress {
    display:inline-block;
    background: transparent url(/images/elemente/icon-adresse.png) no-repeat left 5px;
    padding-left: 31px;
  }
  footer .phone {
    display:inline-block;
    background: transparent url(/images/elemente/icon-phone.png) no-repeat left 3px;
    padding-left: 31px;
  }
  footer .fax {
    display:inline-block;
    background: transparent url(/images/elemente/icon-fax.png) no-repeat left 3px;
    padding-left: 31px;
  }
  footer .mailadress {
    display:inline-block;
    background: transparent url(/images/elemente/icon-mail.png) no-repeat left 3px;
    padding-left: 31px;
  }


/* ----- skip links styling */
  .skiplinks a.skip:focus,
  .skiplinks a.skip:active {
    color: #fff;
    background: #333;
    border-bottom: 1px #000 solid;
    padding: 10px 0;
    text-align: center;
    text-decoration: none;
  }

/* ----- Anpassungen Inhaltlich  */

/* ----- Links  */

  a.pdf-link {
    line-height:18px; 
    margin-left:3px; 
    padding:1px 0px 1px 22px; 
    background:transparent url(/images/elemente/link-pdf.png) no-repeat center left;
    border:0px solid #888888; 
  }
  a.ext-link {
    line-height:18px; 
    margin-left:3px; 
    padding:1px 0px 1px 22px; 
    background:transparent url(/images/elemente/link-extern.png) no-repeat center left;
    border:0px solid #888888; 
  }
  a.ext-link:hover,
  a.pdf-link:hover {
    text-decoration:underline; 
  }


/* ----- Blockelemente  */
  hr {
    color: #fff;
    background: transparent;
    margin: 0 0 0.75em 0;
    padding: 0 0 0.67857em 0;
    border: 0;
    border-bottom: 1px #eeeeee solid;
  }


/* ----- Swiper Elemente  */
  .swiper-pagination-bullet {
    background: #ffffff !important;
    opacity: .5 !important;
  }
  .swiper-pagination-bullet-active {
    background: #337ab7 !important;
    opacity: 1.0 !important;
  }


/* ----- Klassen für die Downloadseite  */
  .downbox {
    margin:0px 0px 10px 0px;
    padding:0px 0px 20px 0px;
    overflow:hidden;
    border-bottom: 1px solid #eeeeee;
  }
  .downbox a {
    font-weight:500;
    color:#4a9192;
  }
  .downbox span.byte {
    color:#888888;
  }

/* ----- Klassen für die homeseite  */

  .teaser {
    position: absolute;
    right: 0px;
    top: -1000px;
  }
  .home main {
    background: transparent;
  }
  .home .ccontainer {
    padding-right: 0px;
    padding-left: 0px;
  }
  .home .slidebox {
    position: relative;
  }
  .home .homebox {
    padding-top: 25px;
    padding-bottom: 40px;
  }
  .home .homebox1,
  .home .homebox2,
  .home .homebox3,
  .home .homebox4 {
    border-bottom: 4px solid #1261a9;
    padding: 0 20px 0 20px;
  }
  .home .homebox4 {
    border-bottom: 0px solid #1261a9;
  }
  .home .homebox h2 {
    padding-top: 25px;
    text-align:center;
    text-transform: uppercase;
    font-size: 150%;
    line-height: 1.0;
    color:#1261a9;
    margin: 0 0 0.25em 0;
  }
  .home .homebox a {
    color: #337ab7;
  }
  .home .homebox a:hover {
    color: #eb691b;
  }
  .home .homebox hr {
    display: none;
    border: 0px;
    border-top: 4px solid #1261a9;
    height: 0px;
    margin: 0 0 20px 0;
    padding: 0 0 00;
  }
  .home .homebox hr + p {
    min-height: auto;
  }
  .home .homebox a.linkbutton {
    border: 0px;
    height: 0px;
    margin: 0px 0px 0px 0px ;
    padding: 2px 35px 3px 15px;
    font-family: Cabin, Verdana, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 85%;
    color: #ffffff;
    background: #eb691b url(/images/elemente/link-arrow-25-25.png) no-repeat center right;
  }
  .home .hometext {
    padding-top: 32px;
    padding-bottom: 50px;
    color: #ffffff;
  }
  .home .hometext h1 {
    text-transform: uppercase;
    font-size: 180%;
    font-weight: 500;
    line-height: 1.0;
    color: #ffffff;
    margin: 0 0 0.75em 0;
  }
  .home .hometext h2 {
    text-transform: uppercase;
    font-size: 140%;
    font-weight: 300;
    line-height: 1.0;
    color: #eb691b;
    margin: 0 0 0.20em 0;
  }
  .home .hometext p {
    font-size: 100%;
    color: #ffffff;
    margin: 0 0 1.00em 0;
  }
  .home a.bildungslink {
    position: relative;
    display: block;
    z-index: 1;
    width: 100%;
    padding: 6px 40px 7px 15px;
    font-family: Cabin, Verdana, Helvetica, Arial, sans-serif;
    font-weight: 800;
    font-size: 170%;
    color: #ffffff;
    text-align:center;
    text-transform:uppercase;
    background: #eb691b url(/images/elemente/link-arrow-30-30.png) no-repeat center right;
  }
  .home a.stellenlink {
    position: absolute;
    display: inline-block;
    z-index: 1;
    max-width: 350px;
    padding: 15px 15px 15px 15px;
    font-family: Cabin, Verdana, Helvetica, Arial, sans-serif;
    font-weight: 400;
    font-size: 140%;
    line-height: 1.10em;
    letter-spacing: 0.9px;
    color: #ffffff;
    //text-align:center;
    //text-transform:uppercase;
    background: #eb691b url(/images/elemente/link-arrow-30-30.png) no-repeat bottom right;
    background-position: 100% calc(100% - 14px);
    bottom:50px;
    left:50px;
  }
  .home a.stellenlink span {
    text-transform: uppercase;
    font-size: 1.35em;
    font-weight: 600;
    display: inline-block;
    padding: 15px 0px 25px 0px;
    line-height: 1.10em;
  }

@media screen and (max-width: 990px) {
  .home a.stellenlink {
    bottom: 20px;
    left: 20px;
  }
}
@media screen and (max-width: 766px) {
  .home a.stellenlink {
    position: relative;
    bottom: 0px;
    left: 0px;
    width: 100%;
    max-width: initial;
    margin-top: 5px;
    margin-bottom: 5px;
  }
}
  .tteaser {
    position: sticky;
    float: right;
    margin-right: -165px;
    top: 0;
    z-index: 2;
  }


/* ----- Klassen für die profilseite  */
  .profil .colleft {
    padding-top: 25px;
    background-color:#dcdcdc;
  }
  .profil .colright {
    padding-top: 25px;
    color:#ffffff;
    background-color:#49657f;
  }
  .profil .colleft h2 {
    color:#505050;
  }
  .profil .colright h2 {
    color:#ffffff;
  }


/* ----- Klassen für die geschichte  */
  .geschichte main section.row {
    background-color:#58728a;
  }
  .geschichte .colleft {
    padding: 25px 50px 50px 50px;
    color:#ffffff;
    background-color:#58728a;
  }
  .geschichte .colright {
    padding-top: 25px;
    padding: 0px;
    background-color:#f1f1f1;
  }
  .geschichte .colleft h2 {
    color:#ffffff;
  }
  .geschichte .colright h2 {
    color:#ffffff;
  }
  .geschichte .colleft h3 {
    padding: 0px;
    margin: 0px;
    margin-bottom: 0.15em;
    font-size:1.1em;
    font-weight:bold;
    text-transform:uppercase;
    color:#ffffff;
  }
  .geschichte .colright p {
    padding: 0px;
    margin: 0px;
  }
  .geschichte .colright .bild-links {
    float:left;
    padding: 0px 5px 0px 0px !important;
    margin: 0px 0px 0px 0px !important;
    width:50%;
    height: auto;
  }
  .geschichte .colright .bild-rechts {
    float:right;
    padding: 0px 0px 0px 5px !important;
    margin: 0px 0px 0px 0px !important;
    width:50%;
    height: auto;
  }
  .geschichte .colright .bild-mitte {
    clear:both;
    padding: 10px 0px 0px 0px !important;
    margin: 0px 0px 0px 0px !important;
    width:100%;
    height: auto;
  }


/* ----- Klassen für die leistunsseite  */

  .leistungen .colleft {
    padding:25px 50px 15px 50px;
    color:#ffffff;
    background-color:transparent;
  }
  .leistungen .colright {
    padding:25px 50px 15px 50px;
    color:#ffffff;
    background-color:transparent;
  }

  .leistungen .leistung1 { background-color:#515151; overflow:hidden; }
  .leistungen .leistung2 { background-color:#568dc0; overflow:hidden; }
  .leistungen .leistung3 { background-color:#385774; overflow:hidden; }
  .leistungen .leistung4 { background-color:#dcdcdc; overflow:hidden; }

  .leistungen .leistung1 .colleft { padding:0; }
  .leistungen .leistung2 .colright { padding:0; }
  .leistungen .leistung3 .colleft { padding:0; }
  .leistungen .leistung4 .colright { padding:0; }

  .leistungen .leistung1 .colleft { padding:0; background:url(/images/content/strassenbau.jpg) no-repeat center center; }
  .leistungen .leistung2 .colright { padding:0; background:url(/images/content/rhinopatch.jpg) no-repeat center center; }
  .leistungen .leistung3 .colleft { padding:0; background:url(/images/content/planung-beratung.jpg) no-repeat center center; }
  .leistungen .leistung4 .colright { padding:0; background:url(/images/content/walz-guss-asphalt.jpg) no-repeat center center; }

  .leistungen .leistung4 .colleft { color:#505050; }
  .leistungen .leistung4 .colleft h2 { color:#505050; }
  .leistungen .leistung4 .colleft h3 { color:#505050; }

  .leistungen .colleft h3,
  .leistungen .colright h3 {
    font-size: 150%;
    line-height: 1.0;
    color:#ffffff;
    margin: 0 0 0.25em 0;
  }
  .leistungen .colleft h2,
  .leistungen .colright h2 {
    color:#ffffff;
  }

  .leistungen .imgrow {
    min-height:350px;
    padding:0; 
    background:url(/images/content/strassenbau.jpg) no-repeat center center;
    background-size:cover;
  }
  .leistungen .txtrow {
    padding:25px 15px 15px 15px;
    color:#ffffff;
    background-color:transparent;
  }
  .leistungen .txtrow h2 {
    color:#ffffff;
  }
  .leistungen .txtrow h3 {
    font-size: 150%;
    line-height: 1.0;
    color:#ffffff;
    margin: 0 0 0.25em 0;
  }
  .leistungen .leistung4 .txtrow { color:#505050; }
  .leistungen .leistung4 .txtrow h2 { color:#505050; }
  .leistungen .leistung4 .txtrow h3 { color:#505050; }



  .leistungen a.link1,
  .leistungen a.link2,
  .leistungen a.link3,
  .leistungen a.link4 {
    position: absolute;
    display: block;
    top: 60%;
    left: 26%;
    min-width: 297px;
    border: 0px;
    margin: 0px 0px 0px 0px ;
    padding: 3px 35px 4px 15px;
    font-family: Cabin, Verdana, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 140%;
    color: #ffffff;
    background: #eb691b url(/images/elemente/link-arrow-30-30.png) no-repeat center right;
  }
  .leistungen a.link1 { top: 60%; left: 26%;}
  .leistungen a.link2 { top: 44%; left: 26%;}
  .leistungen a.link3 { top: 75%; left: 10%;}
  .leistungen a.link4 { top: 45%; left: 26%;}


/* ----- Klassen für die Galerieseite  
  .galerie .bild-1 {
    padding: 0px;
    overflow:hidden;
  }
  .galerie .bild-1:nth-child(even) {
    padding-left: 5px;
    padding-bottom: 10px;
  }
  .galerie .bild-1:nth-child(odd) {
    padding-right: 5px;
    padding-bottom: 10px;
  }
  .galerie .bild-1 img {
    width: 100%;
  }
  .galerie .bild-4 {
    padding: 0px;
  }
  .galerie .bild-4:nth-child(even) {
    padding-left: 5px;
    padding-bottom: 0px;
  }
  .galerie .bild-4:nth-child(odd) {
    padding-right: 5px;
    padding-bottom: 0px;
  }
  .galerie .bild-4 div:nth-child(even) {
    padding-left: 5px;
    padding-bottom: 10px;
    overflow:hidden;
    border:0px solid #999999;
  }
  .galerie .bild-4 div:nth-child(odd) {
    padding-right: 5px;
    padding-bottom: 10px;
    overflow:hidden;
    border:0px solid #999999;
  }
  .galerie .bild-4 img {
    width: 100%;
  }


  .galerie figcaption {
    position: absolute;
    bottom: 0%;
    //display: none;
    height: 100%;
    width: 100%;
    border: 1px solid #999999;
    background-image: linear-gradient(to top, #1361a9 0%, transparent 50%);
    margin: 10px 55px 10px 0px;
    border-right: 20px solid transparent;
	}
 
  .galerie figure {
    position: relative;
    width: 100%;
    overflow: hidden;
    border: 1px solid #ff0000;
  }

 .galerie figcaption {
    position: absolute;
    top: 0%;
    //display: none;
    height: 100%;
    width: 100%;
    border: 1px solid #999999;
    background-image: linear-gradient(to top, #1361a9 0%, transparent 50%);
    margin: 10px 0px 10px 0px;
    border-right: 0px solid transparent;
    box-sizing: border-box;
    box-sizing: content-box;
    padding-top: 60%;
    color: #ffffff;
    //padding-left: 20px;
    text-transform: uppercase;
  }
*/


	
	
	.galerie figure {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-bottom:10px solid #ffffff;
  }

 .galerie figcaption {
    position: absolute;
    display: none;
    vertical-align: bottom;
    top: 0px;
    height: 100%;
    width: 100%;
    padding-top:100%;
    font-family: Cabin, Verdana, Helvetica, Arial, sans-serif;
    font-weight: 800;
    font-size: 90%;
    color: #ffffff;
    text-transform: uppercase;
    display: table;
    -webkit-transition: padding-top 1.0s;
    transition: padding-top 1.0s;
  }
 .galerie figcaption span {
    display: table-cell;
    vertical-align: bottom;
    padding: 0px 0px 12px 20px;
    //box-sizing: border-box;
    //box-sizing: content-box;
    background-image: linear-gradient(to top, #1361a9 0%, transparent 50%);
  }
 .galerie figure:hover figcaption {
    padding-top:0%
 }

	.galerie figure img {
    width:100%;
    height:auto;
 }

  .galerie .bildleft-1,
  .galerie .bildleft-4,
  .galerie .bildright-1,
  .galerie .bildright-4 {
    padding: 0;
    border-bottom: 0px solid #ffffff;
    overflow:hidden;
 }
  .galerie .bildleft-1 figure,
  .galerie .bildright-1 figure {
    height:auto;
 }
  .galerie .bildleft-4 figure,
  .galerie .bildright-4 figure {
    height:auto;
    width: 50%;
    float: left;
 }
  galerie .bildleft-4 figure img,
  galerie .bildright-4 figure img {
    //height:auto;
 }
  .galerie .bildleft-4 figure:nth-child(even),
  .galerie .bildright-4 figure:nth-child(even) {
    border-left: 5px solid #ffffff;
 }
  .galerie .bildleft-4 figure:nth-child(odd),
  .galerie .bildright-4 figure:nth-child(odd) {
    border-right: 5px solid #ffffff;
 }





	
	/* ----- Klassen für die Stelleseite  */

  .stellenangebote main {
    background-color:transparent;
  }
  .stellenangebote .colhead {
    color:#ffffff;
  }
  .stellenangebote .colbild {
    min-height:400px;
    padding:0; 
    background:url(/images/content/ausbildung-1.jpg) no-repeat center center;
    background-size:cover;
  }
  .stellenangebote .coltext {
    padding:25px 15px 15px 15px;
    color:#ffffff;
  }

  .stellenangebote .row { margin-bottom:5px; }

  .stellenangebote .row0 { background-color:#7e7e7e; }
  .stellenangebote .row1 { background-color:#578ec1; }
  .stellenangebote .row2 { background-color:#616157; }
  .stellenangebote .row3 { background-color:#385774; }
  .stellenangebote .row4 { background-color:#dcdcdc; }

  .stellenangebote .row4 .colleft { color:#505050; }
  .stellenangebote .row4 .colleft h2 { color:#505050; }
  .stellenangebote .row4 .colleft h3 { color:#505050; }


  .stellenangebote .colhead h1 {
    font-size: 315%;
    color: #ffffff;
    padding: 24px 25px 15px 10px;
    margin: 0 0 0 0;
    letter-spacing: 0.025em;
  }
  .stellenangebote .coltext p {
    margin: 0 0 10px 0px;
    color:#ffffff;
  }
  .stellenangebote .coltext ul {
    margin: 0 0 10px 0px;
  }
  .stellenangebote .coltext h2 {
    line-height: 1.0;
    margin: 0 0 8px 0;
    padding: 0 0 0 0;
    color:#ffffff;
  }
  .stellenangebote .coltext h3 {
    font-size: 150%;
    line-height: 1.0;
    color:#ffffff;
    margin: 0 0 0.25em 0;
  }
  .stellenangebote a.linkbutton {
    border: 0px;
    height: 0px;
    margin: 0px 0px 0px 0px ;
    padding: 2px 35px 3px 15px;
    font-family: Cabin, Verdana, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 85%;
    color: #ffffff;
    background: #eb691b url(/images/elemente/link-arrow-25-25.png) no-repeat center right;
  }

  .stellenangebote .row3 { 
    display:grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    grid-auto-columns: 100px;
    background-color:transparent;
    width:100%;
    width: calc(100% + 30px);
    margin-left: -15px;
    margin-bottom: 5px;
  }
  .stellenangebote section.row3::before { content:inherit;}

  .stellenangebote .row3 article { 
    background-color:#48B7E6; 
    width:100%;
    position:relative;
  }
  .stellenangebote .row3 article + article { 
    background-color:#385774; 
    width:100%;
  }
  .stellenangebote .row3 .coltext {
    font-size: 110%;
    line-height: 1.0;
    margin: 0 0 0 0;
  }
  .stellenangebote .row3  a.linkbutton {
    height: auto;
    bottom: 50px;
    position: absolute;
  }
  .stellenangebote .row3 .coltext h2 {
    line-height: 1.25;
  }
  .stellenangebote .row3 .coltext h2 + h2 {
    font-size: 55.3px;
    margin-top: 40px;
  }
  .stellenangebote .row3 .coltext h3 {
    color:#48B7E6;
    font-size: 110%;
  }
@media screen and (max-width: 990px) {
  .stellenangebote .row3  a.linkbutton {
    display:inline-block;
    position: relative;
    bottom: 0px;
    margin:20px 0px 15px 0px;
  }
}

/* ----- Klassen für die referenzseite  */
  .referenzen .row { 
    color: #ffffff; 
    padding-bottom:20px;
  }
  .referenzen .col-sm-12 { 
    padding-top: 15px;
  }
  .referenzen .col-sm-12, 
  .referenzen .col-sm-6 { 
    //padding-right: 45px;
    //padding-left: 45px;
  }
  .referenzen .row1 { background-color: #18a6e3; }
  .referenzen .row2 { background-color: #aaaaaa; }
  .referenzen .row3 { background-color: #385774; }
  .referenzen .row4 { background-color: #385774; }

  .referenzen h1,
  .referenzen h2 {
    font-size: 225%;
    line-height: 1.0;
    color: #ffffff;
    text-transform: uppercase;
    margin: 15px 0 35px 0;
  }
  .referenzen h3 {
    font-size: 131%;
    line-height: 1.2;
    color:#ffffff;
    text-transform: uppercase;
    margin: 0 0 10px 0;
  }
  .referenzen ul + h3 {
    margin-top: 20px;
  }
  .referenzen h4 {
    font-size: 100%;
    line-height: 1.0;
    color:#ffffff;
    //text-transform: uppercase;
    margin: 0 0 0 0;
  }
  .referenzen ul {
    font-size: 100%;
    line-height: 1.35;
    margin: 0 0 1.5em 0;
  }
  .referenzen .row1 h3 { color: #1261a9; }
  .referenzen .row2 h3 { color: #1261a9; }
  .referenzen .row3 h3 { color: #48b7e6; }



/* ----- Klassen für die ausbildung  */
  .ausbildung .row { 
    color: #ffffff; 
    padding-bottom:0px;
  }
  .ausbildung .col-sm-12, 
  .ausbildung .col-sm-6 { 
    padding-right: 0px;
    padding-left: 50px;
    	padding-left: 15px;
  }
  .ausbildung .row1 { background: transparent url(/images/content/bg-ausbildung.jpg) no-repeat center top; background-size: contain;}
  .ausbildung .row2 { background-color: transparent; }
  .ausbildung .row3 { background-color: #385774; }
  .ausbildung .row4 { background-color: #385774; }

  .ausbildung .overlaytext { 
    background-image: linear-gradient(to right, #1165ac 0%, #009ee1 100%);
    padding-top: 20px;
    padding-bottom: 20px;
  }

  .ausbildung h1 {
    font-size: 442%;
    color: #ffffff;
    text-transform: uppercase;
    margin: 15px 0 35px 0;
  }

  .ausbildung h1 {
    height: 60vw;
    font-size: 9vw;
    color: #ffffff;
    text-transform: uppercase;
    margin: 15px 0 0px 0;
    letter-spacing: 0.010em;
  }

  .ausbildung h2,
  .ausbildung h3 {
    font-size: 235%;
    line-height: 1.0;
    color:#ffffff;
    text-transform: uppercase;
    letter-spacing: 0.035em;
    margin: 0 0 20px 0;
  }
  .ausbildung ul + h3 {
    margin-top: 20px;
  }
  .ausbildung p + ul {
    margin-top: -20px;
    margin-bottom: 20px;
  }
  .ausbildung h4 {
    font-size: 100%;
    line-height: 1.0;
    color:#ffffff;
    //text-transform: uppercase;
    margin: 0 0 0 0;
  }
  .ausbildung p.bgblau {
    font-size: 100%;
    background-image: linear-gradient();
    padding: 0px;
  }
  .ausbildung ul {
    font-size: 100%;
    line-height: 1.35;
    margin: 0 0 0 0;
  }
  .ausbildung .row1 h3 { color: #1261a9; }
  .ausbildung .row2 h3 { color: #1261a9; }
  .ausbildung .row3 h3 { color: #48b7e6; }

  .ausbildung a.linkbutton {
    border: 0px;
    height: 0px;
    margin: 0px 0px 0px 0px ;
    padding: 10px 35px 11px 15px;
    font-family: Cabin, Verdana, Helvetica, Arial, sans-serif;
    font-weight: 500;
    font-size: 95%;
    color: #ffffff;
    background: #eb691b url(/images/elemente/link-arrow-25-25.png) no-repeat center right;
  }


  .ausbildung .infotext {
    padding: 30px 50px 20px 50px;
  }
  .ausbildung .infotext h3 {
    display: inline-block;
    margin: 8px 0px 3px 0px ;
    padding: 5px 15px 3px 10px;
    height: auto;
    width: auto;
    min-width: 50%;
    font-weight: 600;
    font-size: 110%;
    color: #1261a9;
    background: #d3e7f6 url() no-repeat center left;
  }
  .ausbildung .infotext a.linkbutton {
    display: inline-block;
    margin: 5px 0px 0px 0px ;
    padding: 2px 15px 3px 33px;
    height: auto;
    min-width: 210px;
    font-weight: 700;
    font-size: 101%;
    color: #505050;
    background: transparent url(/images/elemente/arrow-orange.png) no-repeat center left;
  }
  .ausbildung .infotext a.linkbutton:hover {
    color: #eb691b;
  }

  .ausbildung .row2 .bild-center { 
  }



  .ausbildung .row2 .bild-center { 
    text-align: center;
  }
  .ausbildung .row2 .bild-center img { 
    display: inline-block;
    border: 5px solid #ffffff;
  }


/* ----- Klassen für die rhinopach  */
  .rhinopach main section.row {
    background-color:#f1f1f1;
  }
  .rhinopach .colleft {
    padding: 25px 50px 50px 50px;
    color:#ffffff;
    background-color:#568dc0;
  }
  .rhinopach .colright {
    padding: 25px 20px 50px 10px;
    background-color:#e1e1e1;
    font-size:0.85em;
  }
  .rhinopach .colleft h1 {
    text-transform:uppercase;
    color:#ffffff;
  }
  .rhinopach .colleft h2 {
    color:#ffffff;
  }
  .rhinopach .colright h2 {
    color:#ffffff;
  }
  .rhinopach .colleft h3 {
    padding: 0px;
    margin: 0px;
    margin-bottom: 0.15em;
    font-size:1.1em;
    font-weight:bold;
    text-transform:uppercase;
    color:#ffffff;
  }
  .rhinopach .colright h3 {
    padding: 0px;
    margin: 0px;
    margin-bottom: 0.15em;
    font-size:1.05em;
    font-weight:bold;
    text-transform:uppercase;
  }
  .rhinopach .colright p {
    display:block;
    padding: 0px;
    margin: 0px;
    overflow:hidden;
  }
  .rhinopach .colright .bild-links {
    float:left;
    padding: 0px 0px 0px 0px !important;
    margin: 3px 10px 22px 0px !important;
    width:140px;
  }
  .rhinopach .colright .bild-rechts {
    float:right;
    padding: 0px 0px 0px 0px !important;
    margin: 5px 0px 40px 10px !important;
    width:140px;
  }
  .rhinopach .colright .bild-mitte {
    clear:both;
    padding: 10px 0px 0px 0px !important;
    margin: 0px 0px 0px 0px !important;
    width:100%;
  }


/* ----- Klassen für die Linkseite  */
  .linkbox {
    margin:0px 0px 10px 0px;
    padding:0px 0px 10px 20px;
    overflow:hidden;
    border-bottom: 1px solid #eeeeee;
  }
  .linkbox a {
    font-weight:500;
    color:#4a9192;
  }


/* ----- Klassen für die Literaturliste  */
  .litbox {
    margin:0px 0px 0px 0px;
    padding:10px 0px 6px 0px;
    border-bottom: 1px solid #eeeeee;
  }
  .litbox h2.zwischentitel {
    margin:-15px 0px 10px 0px;
    padding:35px 0px 0px 0px;
    font-size:1.7em;
    color:#666666;
    background-color:#ffffff;
    border-top: 0px solid #880000;
    border-bottom: 1px solid #bababa;
  }


/* ----- Klassen für die FAQ-Seite  */
  .faqbox { 
    height:auto;
    padding:10px 0px 10px 20px; 
    margin:0px 0px 0px 0px; 
    border-bottom: 1px solid #cccccc; 
  }
  .faqbox:first-child { 
    border-top: 1px solid #cccccc; 
  }
  .faqbox .blockhead { 
    margin:0; 
    padding:0; 
    cursor:pointer;
    outline:none; 
  }


/* ----- Klassen für die Team-Seite  */
  .teambox { 
    height:auto;
    overflow:hidden; 
    margin:0px 25px 0px 25px; 
    padding:20px 0px 20px 0px; 
    background-color:#f6f6f6;
    border-bottom: 1px solid #ababab; 
  }
  .teambox:first-of-type { 
    margin-top:25px; 
    border-top: 1px solid #ababab; 
  }
  .teambox.even { background-color:transparent;}
  .teambox p { 
    margin:0px; 
    padding:10px 20px 0px 105px; 
  }
  .teambox img { 
    margin:0px 14px 0px 0px; 
    border:0px solid #ababab; 
  }


/* ----- Klassen für die Accordion-Seite  */
  .accorbox { 
    height:auto;
    padding:20px 0px 20px 20px; 
    margin:0px 0px 0px 0px; 
    border-bottom: 1px solid #8c8d8f; 
  }
  .accorbox:first-child { 
    border-top: 1px solid #8c8d8f; 
  }
  .accorbox .blockhead { 
    margin:0px 10px 0px 0px; 
    padding:0; 
    text-transform:none;
    cursor:pointer;
    outline:none; 
  }
  .accorbox .blockhead.ui-state-default { 
    background:transparent url(/images/elemente/arrows-close.png) no-repeat center right;

  }
  .accorbox .blockhead.ui-state-hover { 
    background:transparent url(/images/elemente/arrows-hover.png) no-repeat center right;
    color:#b00135;  }
  .accorbox .blockhead.ui-state-active { 
    background:transparent url(/images/elemente/arrows-open.png) no-repeat center right;
    color:#b00135;  }

  .accorbox .blockbox { 
    padding:20px 30px 0px 0px !Important; 
  }


/* ----- Klassen für Bildergalerien  */
  .galerybox {
    display:block;
    //overflow:hidden;
    padding: 30px 0px 30px 0px;
    border-bottom: 0px solid #b51621;
  }
  .galerybox:first-child {
    margin-top: 95px;
    border-top: 1px solid #dedede;
  }
  .galerybox img {
    margin: 0px 10px 20px 0px;
    display:inline-block; 
    padding: 4px;
    border: 1px solid #cccccc;
    border-radius: 2px;
  }
  .sb-galerie .galerybox {
    display:block;
    overflow:hidden;
    padding: 0px 0px 30px 0px;
    border-bottom: 0px solid #b51621;
  }
  .sb-galerie .galerybox:first-child {
    margin-top: 95px;
    border-top: 1px solid #dedede;
  }
  .sb-galerie .galerybox h2 {
    padding: 0px 0px 5px 0px;
    font-size:120%;
    color:#ababab;
    font-style: normal;
  }
  .sb-galerie .galerybox img {
    margin: 0px 0px 20px 0px;
    display:block; 
    clear: both;
    //width: 100%;
    //height: auto;
    padding: 4px;
    border: 1px solid #cccccc;
    border-radius: 2px;
  }
  .sb-galerie .galerybox a {
    display: block;
    clear: both;
    margin: 0px 0px 0px 0px;
  }
  .sb-galerie .galerietext {
    margin: 0px 0px 0px 0px; 
    padding:3px 4px 3px 4px; 
    display:inline-block; 
    width:100%; 
    border:1px solid #cccccc; 
    border-radius: 2px;
  }




/* ----- Klassen für die Kontaktseite  */

  .kontakt main {
    background-color: #395875;
  }

  .kontakt main .colleft {
    color:#ffffff;
    padding:25px 50px 30px 50px;
    background-color: transparent;
  }
  .kontakt main .colright {
    color:#ffffff;
    padding:25px 50px 30px 50px;
    background-color: #049de1;
  }
  .kontakt main .colleft h1,
  .kontakt main .colleft h2,
  .kontakt main .colright h1,
  .kontakt main .colright h2 {
    font-size: 228.57143%;
    line-height: 1.0;
    margin: 0 0 0.8em 0;

    letter-spacing: 0.04em;
    color:#ffffff;
  }	

  .kontakt main .colleft h3,
  .kontakt main .colright h3 {
    font-size: 128.50%;
    line-height: 1.2;
    font-weight:700;
    margin: 0 0 1.0em 0;
    color:#ffffff;
  }	
  .impressum main .colleft a {
    color:#1261a9;
  }	
  .impressum main .colleft a:hover {
    color:#eb691b;
  }	
  .datenschutz main .colleft a {
    color:#1261a9;
  }	
  .datenschutz main .colleft a:hover {
    color:#eb691b;
  }	



  .kontakt main strong {
    font-weight:700;
  }





  #map_canvas {
    width:100%;
    height:380px;
    border:1px solid #646464;
  } 

/* ----- Klassen für die Home-Seite  */

  .homeleft {
    font-size: 140%;
    font-weight:400;
    line-height: 1.25 !important;
  }
  .homeleft h1 {
    font-size:205%;
    color: #0471a7;
  }
  .homeleft p {
    line-height: 1.25 !important;
  }
  .homeright {
    font-size:100%;
  }


/* ----- Klassen für Content  */
  .bild-links { float:left; display:inline; margin-right:0em; margin-bottom:0em; margin-top:0.45em; border: 0px solid #999999; border-radius: 0px;}
  .bild-rechts { float:right; display:inline; margin-left:0em !important; margin-bottom:0.45em; margin-top:0em; border: 0px solid #999999; border-radius: 0px;}
  .bild-mitte { display:block; text-align:center; margin:0em auto; margin-top:0em; border: 0px solid #999999; border-radius: 0px; }
  .bild-block { display:block; margin-right:0em; margin-bottom:0em; margin-top:0em; border: 0px solid #999999; border-radius: 0px;}




}


/* ----- Breite ab 0px ----- */
@media screen and (min-width: 0px) {
  body > header, body > nav, body > main, body > footer {
    min-width: 0;
  }

}



/* ----- Breite ab 480px ----- */
@media screen and (min-width: 480px) {

}
/* ----- Breite ab 560px ----- */
@media screen and (max-width: 560px) {

  //footer .headbox { width: 100%; }
  //footer .adressbox { width: 100%; }
  //footer .phonebox { width: 100%; }
  //footer .mailbox { width: 100%; }
  //footer .navibox { width: 100%; }
  //footer .copybox { width: 100%; }
  


}


/* ----- Breite ab 768px ----- */
@media screen and (min-width: 768px) {

  header .header {
    padding: 1.5em 0em 0em 0em;
    min-height:160px;
    text-align:left;
  }
  header .logo {
    float:right;
    margin:0px 0px 0px 0px;
    width: auto;
    		width: 450px;
  }
  header .zerti {
    margin: 10px 20px 0px 0px;
    height: 80px;
  }

  nav {
    position: sticky;
    top: 0px;
    z-index: 2;
  }

  footer { 
    padding-right: 0px !important;
    padding-left: 0px !important;
    height:auto;
  }
  footer .copybox {
    text-align: right !important;
    margin-left:0px;
  }
  footer ul {
    float: right;
  }
  .home a.bildungslink {
    position: absolute;;
    display: initial;
    width: auto;
    bottom: 20px;
    right: 20px;
    text-align:left;
    text-transform:uppercase;
  }

  .profil .colleft {
    padding: 25px 50px 50px 50px;
  }
  .profil .colright {
    padding: 25px 50px 50px 50px;
  }


  .galerie .bildleft-1,
  .galerie .bildleft-4 {
    border-right: 5px solid #ffffff;
  }
  .galerie .bildright-1,
  .galerie .bildright-4 {
    border-left: 5px solid #ffffff;
  }

  .ausbildung .col-sm-12, 
  .ausbildung .col-sm-6 { 
    padding-left: 20px;
  }
  .ausbildung h1 {
    height: 450px;
    font-size: 355%;
    margin: 15px 0 0px 0;
  }
  .referenzen .col-sm-12,
  .referenzen .col-sm-6 {
    padding-right: 25px;
    padding-left: 25px;
 }

  .leistungen .colleft {
    padding:25px 0px 15px 0px;
  }
  .leistungen .colright {
    padding:25px 0px 15px 0px;
  }

  .leistungen .colleft {
    padding:25px 15px 15px 15px;
  }
  .leistungen .colright {
    padding:25px 15px 15px 15px;
  }
  .leistungen .imgrow {
    min-height:500px;
  }
  .leistungen .txtrow {
    padding:25px 15px 15px 15px;
  }
  .leistungen a.link1 { top: 60%; left: 10%;}
  .leistungen a.link2 { top: 44%; left: 10%;}
  .leistungen a.link3 { top: 75%; left: 10%;}
  .leistungen a.link4 { top: 45%; left: 10%;}

  .stellenangebote .colbild {
    min-height:520px;
  }
  .stellenangebote .coltext {
    padding:25px 15px 15px 15px;
  }

  .geschichte .colleft {
    padding: 25px 15px 50px 15px;
  }


}


/* ----- Breite ab 992px ----- */
@media screen and (min-width: 992px) {

  header .zerti {
    margin: 0px 0px 0px 27px;
    height: auto;
  }
  header .logo {
    float:right;
    margin:0px 0px 0px 0px;
    width: auto;
    		width: 580px;
  }
  .home .homebox hr {
    display: block;
  }
  .home .homebox hr + p {
    min-height: 7em;
  }
  .home .homebox1,
  .home .homebox2,
  .home .homebox3,
  .home .homebox4 {
    border-bottom: 0px solid #1261a9;
    padding: 0 0 0 0;
  }
  .home a.bildungslink {
    position: absolute;;
    display: initial;
    width: auto;
    bottom: 50px;
    right: 65px;
    text-align:left;
    text-transform:uppercase;
  }

  .ausbildung .row1 { background-size: cover;}

  .ausbildung .overlaytext { 
    background-image: initial;
    padding-top: 0px;
    margin-top: initial;
  }
  .ausbildung .col-sm-12, 
  .ausbildung .col-sm-6 { 
    padding-left: 50px;
  }
  .ausbildung h1 {
    height: auto;
    font-size: 355%;
    margin: 15px 0 35px 0;
    margin: 25px 0 25px 0;
  }
  .ausbildung p.bgblau {
    font-size: 100%;
    background-image: linear-gradient(to right, #1165ac 0%, #009ee1 100%);
    padding: 15px;
  }
  .ausbildung p.bgblau + p a.linkbutton {
    display: inline-block;
    min-width: 15px;
    height: auto;
    float: right;
    margin-top: -23px;
  }
  .ausbildung .infotext a.linkbutton {
    color: #ffffff;
  }
  .ausbildung p.bgblau + p a.bewerbbutton {
    display: block;
    padding: 12px 35px 12px 25px;
    font-size: 20px;
    margin-top: 10px;
  }





  .referenzen .col-sm-12,
  .referenzen .col-sm-6 {
    padding-right: 30px;
    padding-left: 30px;
 }

  .leistungen .colleft {
    padding:25px 20px 15px 20px;
  }
  .leistungen .colright {
    padding:25px 20px 15px 20px;
  }
  .leistungen .imgrow {
    min-height:450px;
  }
  .leistungen .txtrow {
    padding:25px 20px 15px 20px;
  }
  .leistungen a.link1 { top: 60%; left: 20%;}
  .leistungen a.link2 { top: 44%; left: 20%;}
  .leistungen a.link3 { top: 75%; left: 20%;}
  .leistungen a.link4 { top: 45%; left: 20%;}

  .stellenangebote .colbild {
  }
  .stellenangebote .coltext {
    min-height:450px;
    padding:25px 20px 15px 20px;
  }

  .geschichte .colleft {
    padding: 25px 20px 50px 20px;
  }


}


/* ----- Breite ab 1200px ----- */
@media screen and (min-width: 1200px) {

  .container {
    width: 1200px;
  }
  .teaser {
    right: -150px;
    top: 0px;
  }
  header .logo {
    float:right;
    margin:0px 0px 0px 0px;
    width: auto;
    		width: auto;
  }
  .home .homebox hr + p {
    min-height: 7em;
  }
  .home .homebox1,
  .home .homebox2,
  .home .homebox3,
  .home .homebox4 {
    padding: 0 20px 0 20px;
  }

  .galerie .bildleft-1 figure,
  .galerie .bildright-1 figure {
    height:450px;
 }
  .galerie .bildleft-4 figure,
  .galerie .bildright-4 figure {
    height:225px;
    width: 50%;
    float: left;
 }
  .ausbildung h1 {
    font-size: 442%;
    margin: 25px 0 25px 0;
  }
  .referenzen .col-sm-12,
  .referenzen .col-sm-6 {
    padding-right: 45px;
    padding-left: 45px;
 }
  .leistungen .colleft {
    padding:25px 50px 15px 50px;
    color:#ffffff;
  }
  .leistungen .colright {
    padding:25px 50px 15px 50px;
    color:#ffffff;
  }
  .leistungen .txtrow {
    padding:25px 50px 15px 50px;
  }
  .leistungen a.link1 { top: 60%; left: 26%;}
  .leistungen a.link2 { top: 44%; left: 26%;}
  .leistungen a.link3 { top: 75%; left: 10%;}
  .leistungen a.link4 { top: 45%; left: 26%;}

  .stellenangebote .colbild {
    min-height:450px;
  }
  .stellenangebote .coltext {
    padding:25px 50px 15px 50px;
  }
  .geschichte .colleft {
    padding: 25px 50px 50px 50px;
  }


}


