/* ibm-plex-sans-regular - latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('../fonts/ibm-plex-sans-v14-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/ibm-plex-sans-v14-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* ibm-plex-sans-700 - latin */
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       url('../fonts/ibm-plex-sans-v14-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/ibm-plex-sans-v14-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* ibm-plex-serif-regular - latin */
@font-face {
  font-family: 'IBM Plex Serif';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('../fonts/ibm-plex-serif-v15-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/ibm-plex-serif-v15-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

body {
  position: relative;
  width: 100%;
  height: 100%;
  color: black;
  background-color: white;
}

html {
  width: 100%;
  height: 100%;
}

h1,
h3,
h4,
h5,
h6 {
  font-family: 'IBM Plex Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 22px;
  margin: 0 0 35px;
  letter-spacing: 1px;
}

h2 {
  font-family: 'IBM Plex Serif', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 30px;
  color: rgba(18, 69, 122, 1);
  letter-spacing: 1px;
}

.absolute-text{
  position:absolute;
}

 .subhead {
  font-family: 'IBM Plex Sans Italic', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 22px;
  font-weight: 500;

  letter-spacing: 1px;
  color: rgba(255,91,68,1);
}
.cont1{
  background: url("") no-repeat bottom center scroll;  float: left;
  background-size: contain;


}

.coltext {
  margin-top: 500px;
}

.col1{
  padding-bottom: 31%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
  background: url("../img/Bildergalerie/Bildergalerie1.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
  width: 31%;
  margin: 1% 1%;
  cursor: pointer;
}

.col1:hover{
  background: url("../img/Bildergalerie/Bildergalerie2.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;

}

.col2{
  padding-bottom: 31%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
  background: url("../img/Bildergalerie/Bildergalerie3.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
  width: 31%;
  margin: 1% 1%;
  cursor: pointer;
}

.col2:hover{
  background: url("../img/Bildergalerie/Bildergalerie4.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
}

.col3{
  padding-bottom: 31%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
  background: url("../img/Bildergalerie/Bildergalerie5.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
  width: 31%;
  margin: 1% 1%;
  cursor: pointer;
}

.col3:hover{
  background: url("../img/Bildergalerie/Bildergalerie6.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
}

.col4{
  padding-bottom: 31%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
  background: url("../img/Bildergalerie/Bildergalerie7.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
  width: 31%;
  margin: 1% 1%;
  cursor: pointer;
}

.col4:hover{
  background: url("../img/Bildergalerie/Bildergalerie8.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
}

.col5{
  padding-bottom: 31%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
  background: url("../img/Bildergalerie/Bildergalerie9.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
  width: 31%;
  margin: 1% 1%;
  cursor: pointer;
}

.col5:hover{
  background: url("../img/Bildergalerie/Bildergalerie10.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
}

.col6{
  padding-bottom: 31%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
  background: url("../img/Bildergalerie/Bildergalerie11.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
  width: 31%;
  margin: 1% 1%;
  cursor: pointer;
}

.col6:hover{
  background: url("../img/Bildergalerie/Bildergalerie12.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
}

.col7{
  padding-bottom: 31%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
  background: url("../img/Bildergalerie/Bildergalerie13.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
  width: 31%;
  margin: 1% 1%;
  cursor: pointer;
}

.col7:hover{
  background: url("../img/Bildergalerie/Bildergalerie14.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
}

.col8{
  padding-bottom: 31%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
  background: url("../img/Bildergalerie/Bildergalerie15.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
  width: 31%;
  margin: 1% 1%;
  cursor: pointer;
}

.col8:hover{
  background: url("../img/Bildergalerie/Bildergalerie16.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
}

.col9{
  padding-bottom: 31%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
  background: url("../img/Bildergalerie/Bildergalerie17.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
  width: 31%;
  margin: 1% 1%;
  cursor: pointer;
}

.col9:hover{
  background: url("../img/Bildergalerie/Bildergalerie18.jpg") no-repeat bottom center scroll;  float: left;
  background-size: contain;
}



.Portrait{
width: 100%;
height: auto;

}

p {
  font-family: 'IBM Plex Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 20px;
  line-height: 1.5;
  margin: 0 0 25px;
}

pplus {
  font-family: 'IBM Plex Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: 700;
  font-size: 30px;
  line-height: 1.5;
  margin: 0 0 25px;
}


@media (min-width: 768px) {
  p {
    font-size: 18px;
    line-height: 1.6;
    margin: 0 0 35px;
  }
}

pplus {
  font-size: 23px;
  line-height: 1.6;
  margin: 0 0 35px;
}
}


a {
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  color: rgba(40, 74, 154, 1);
}

h2{
  font-size:30px;
}

a:focus, a:hover {
  text-decoration: none;
  color: rgb(133, 160, 224);
}


#mainFoot a {
  color: white;
}

#mainNav {
  font-family: 'IBM Plex Serif', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  margin-bottom: 0;
  border-bottom: 1px solid rgba(40, 74, 154, 1);
  background-color: rgba(40, 74, 154, 1);
}

#mainNav .navbar-toggler {
  font-size: 14px;
  padding: 11px;
  color: white;
  border: 1px solid white;
}

#mainNav .navbar-brand {
  font-weight: 700;
}



#mainNav a {
  color: rgba(40, 74, 154, 1);
}



a.snapper{
	color: rgba(40, 74, 154, 1) !important;
	text-decoration: underline !important;
  cursor: pointer !important;
}

#mainNav.navbar-shrink a{
	color:#fff;
}


#mainNav .navbar-nav .nav-item {
  -webkit-transition: background 0.3s ease-in-out;
  -moz-transition: background 0.3s ease-in-out;
  transition: background 0.3s ease-in-out;
}

#mainNav .navbar-nav .nav-item:hover {
  color: fade(white, 80%);
  outline: none;
  background-color: transparent;
}

#mainNav .navbar-nav .nav-item:active, #mainNav .navbar-nav .nav-item:focus {
  outline: none;
  background-color: transparent;
}

@media (max-width: 992px) {


#mainNav #navbarResponsive a{
	color:#fff;
}


	#mainNav .navbar-brand {
		color:#fff !important;
	}

  .col1{
    padding-bottom: 48%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie1.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 48%;
    margin: 1% 1%;
  }

  .col1:hover{
    background: url("../img/Bildergalerie/Bildergalerie2.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col2{
    padding-bottom: 48%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie3.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 48%;
    margin: 1% 1%;
  }

  .col2:hover{
    background: url("../img/Bildergalerie/Bildergalerie4.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col3{
    padding-bottom: 48%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie5.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 48%;
    margin: 1% 1%;
  }

  .col3:hover{
    background: url("../img/Bildergalerie/Bildergalerie6.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col4{
    padding-bottom: 48%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie7.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 48%;
    margin: 1% 1%;
  }

  .col4:hover{
    background: url("../img/Bildergalerie/Bildergalerie8.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col5{
    padding-bottom: 48%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie9.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 48%;
    margin: 1% 1%;
  }

  .col5:hover{
    background: url("../img/Bildergalerie/Bildergalerie10.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col6{
    padding-bottom: 48%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie11.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 48%;
    margin: 1% 1%;
  }

  .col6:hover{
    background: url("../img/Bildergalerie/Bildergalerie12.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col7{
    padding-bottom: 48%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie13.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 48%;
    margin: 1% 1%;
  }

  .col7:hover{
    background: url("../img/Bildergalerie/Bildergalerie14.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col8{
    padding-bottom: 48%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie15.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 48%;
    margin: 1% 1%;
  }

  .col8:hover{
    background: url("../img/Bildergalerie/Bildergalerie16.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col9{
    padding-bottom: 48%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie17.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 48%;
    margin: 1% 1%;
  }

  .col9:hover{
    background: url("../img/Bildergalerie/Bildergalerie18.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }
}

@media (min-width: 992px) {



  #mainNav {
    padding-top: 20px;
    padding-bottom: 20px;
    -webkit-transition: background 0.3s ease-in-out, padding-top 0.3s ease-in-out, padding-bottom 0.3s;
    -moz-transition: background 0.3s ease-in-out, padding-top 0.3s ease-in-out, padding-bottom 0.3s;
    transition: background 0.3s ease-in-out, padding-top 0.3s ease-in-out, padding-bottom 0.3s;
    letter-spacing: 1px;
    border-bottom: none;
    background: transparent;
  }
  #mainNav.navbar-shrink {
    padding-top: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(40, 74, 154, 1);
  }
  #mainNav .nav-link.active {
    outline: none;
    background-color: rgba(255, 255, 255, 0.3);
  }
  #mainNav .nav-link.active:hover {
    color: white;
  }
}

.masthead {
  display: table;
  width: 100%;
  height: auto;
  padding: 80px 0;
  text-align: left;
  color: black;
  background-color: rgba(240,238,233,1);
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.masthead .intro-body {
  display: table-cell;
  vertical-align: top;
}

.masthead .intro-body .brand-heading {
  font-size: 50px;
}

.intro-body .intro-text {
  font-size: 24px;
}


@media (max-width: 768px) {
  .col1{
    padding-bottom: 98%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie1.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 98%;
    margin: 1% 1%;
  }

  .col1:hover{
    background: url("../img/Bildergalerie/Bildergalerie2.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col2{
    padding-bottom: 98%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie3.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 98%;
    margin: 1% 1%;
  }

  .col2:hover{
    background: url("../img/Bildergalerie/Bildergalerie4.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col3{
    padding-bottom: 98%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie5.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 98%;
    margin: 1% 1%;
  }

  .col3:hover{
    background: url("../img/Bildergalerie/Bildergalerie6.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col4{
    padding-bottom: 98%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie7.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 98%;
    margin: 1% 1%;
  }

  .col4:hover{
    background: url("../img/Bildergalerie/Bildergalerie8.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col5{
    padding-bottom: 98%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie9.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 98%;
    margin: 1% 1%;
  }

  .col5:hover{
    background: url("../img/Bildergalerie/Bildergalerie10.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col6{
    padding-bottom: 98%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie11.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 98%;
    margin: 1% 1%;
  }

  .col6:hover{
    background: url("../img/Bildergalerie/Bildergalerie12.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col7{
    padding-bottom: 98%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie13.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 98%;
    margin: 1% 1%;
  }

  .col7:hover{
    background: url("../img/Bildergalerie/Bildergalerie14.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col8{
    padding-bottom: 98%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie15.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 98%;
    margin: 1% 1%;
  }

  .col8:hover{
    background: url("../img/Bildergalerie/Bildergalerie16.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

  .col9{
    padding-bottom: 98%; /* padding-bottom = width value - 2 (1 each for margin top and bottom values */
    background: url("../img/Bildergalerie/Bildergalerie17.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
    width: 98%;
    margin: 1% 1%;
  }

  .col9:hover{
    background: url("../img/Bildergalerie/Bildergalerie18.jpg") no-repeat bottom center scroll;  float: left;
    background-size: contain;
  }

}




@media (min-width: 768px) {


  .masthead {
    height: auto;
    padding-top: 100px;
  }
  .masthead .intro-body .brand-heading {
    font-size: 100px;
  }
  .masthead .intro-body .intro-text {
    font-size: 25px;
  }
}

.btn-circle {
  font-size: 26px;
  width: 55px;
  height: 55px;
  margin-top: 15px;
  line-height: 45px;
  -webkit-transition: background 0.3s ease-in-out;
  -moz-transition: background 0.3s ease-in-out;
  transition: background 0.3s ease-in-out;
  color: white;
  border: 2px solid white;
  border-radius: 100% !important;
  background: transparent;
}

.btn-circle:focus, .btn-circle:hover {
  color: white;
  outline: none;
  background: rgba(255, 255, 255, 0.1);
}

.content-section {
  padding-top: 50px;
  padding-bottom: 50px;
}

.download-section {
  color: white;
  background: url("../img/downloads-bg.jpg") no-repeat center center scroll;
  background-color: white;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.quote-section {
  background-color: rgba(247,245,241,1);
}

#map {
  width: 100%;
  height: 300px;
}

@media (min-width: 992px) {
  .content-section {
    padding-top: 100px;
    padding-bottom: 100px;
  }
  #map {
    height: 350px;
  }
}

.btn {
  font-family: 'IBM Plex Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-weight: 400;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  text-transform: uppercase;
  border-radius: 0;
}

.btn-default {
  color: white;
  border: 1px solid white;
  background-color: transparent;
}

.btn-default:focus, .btn-default:hover {
  color: rgba(40, 74, 154, 1)
  border: 1px solid white;
  outline: none;
  background-color: white;
}

ul.banner-social-buttons {
  margin-top: 0;
}

@media (max-width: 1199px) {
  ul.banner-social-buttons {
    margin-top: 15px;
  }
}

@media (max-width: 767px) {
  ul.banner-social-buttons li {
    display: block;
    margin-bottom: 20px;
    padding: 0;
  }
  ul.banner-social-buttons li:last-child {
    margin-bottom: 0;
  }
}

.orange-head {
color: rgba(255,91,68,1) ;

}

footer {
  background-color: rgba(40, 74, 154, 1);
  padding: 50px 0;
  color: white !important;
}

footer p {
  margin: 0;
}
.headline-footer{
color:white;
}

.logo{
height: 60px;
width: auto;

}

::-moz-selection {
  color: #fcfcfc;
  background: #fcfcfc;
  background: rgba(40, 74, 154, 1);
  text-shadow: none;
}

::selection {
  color: #fcfcfc;
  background: #fcfcfc;
  background: rgba(40, 74, 154, 1);
  text-shadow: none;
}

img::selection {
  background: transparent;
}

img::-moz-selection {
  background: transparent;
}

#accordion .col-l-6 div{
	display:block;
	width:96%;
	padding:0em;
	padding-right:2%;
	padding-left:2%;
	left:0;
	color:#fff;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	text-align: center;
}


@media (min-width: 100px){
	.hidden_2nd{
		clear:both;
		margin-left:1%;
		margin-right:1%;
		width:97%;
		display:none;
	}
}



.hidden_3rd{
	visibility: hidden;
}

div.show{
	display: none;
}

#accordion .col-l-4{
	position: relative;
}

@media (min-width: 992px){

	.hidden_2nd{
		display:none !important;
		visibility: hidden;
	}

	.hidden_3rd{
		clear:both;
		margin-left:1%;
		margin-right:1%;
		width:97%;
		display:none;
		visibility: visible;
	}


}

@media (max-width: 991px){
	.hidden_3rd{
		display: none !important;
	}
}

@media (max-width: 768px){
	.hidden_2nd,
	.hidden_3rd{
		display: none !important;
		visibility: hidden;
	}

	div.show{
		display: inherit;
	}
}

.snapcontent{
	display:none;
}

.abstand-rechts {
  margin-right: 15px;
  margin-bottom: 10px;
}
