/*!
 * Start Bootstrap - Stylish Portfolio (http://startbootstrap.com/)
 * Copyright 2013-2016 Start Bootstrap
 * Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
 */

/* Global Styles */

body {
    font-family: 'Open Sans', Helvetica, Arial, sans-serif;
}

/* Custom Button Styles */
.btn-dark {
    border-radius: 0;
    color: #fff;
    background-color: rgba(4, 108, 188, 0.8);
}
.btn-dark:hover,
.btn-dark:focus,
.btn-dark:active {
    color: #fff;
    background-color: rgba(4, 108, 188, 0.3);
}
.btn-light {
    border-radius: 0;
    color: #333;
    background-color: rgb(255,255,255,0.3);
}
.btn-light:hover,
.btn-light:focus,
.btn-light:active {
    color: #fff;
    background-color: rgba(0, 56, 112, 0.66);
}

/* Custom Rule */
section {
	padding: 50px 0 50px 0;
}
.bg-blue {
  color: #eee;
  background-color: #0f253b;
}
.bg-black {
  color: #eee;
  background-color: #081522;
}

.lead {
	margin-bottom: 20px;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.2;
}
.headline strong {
	margin-bottom: 20px;
	font-size: 18px;
	font-weight: 800;
	line-height: 1.2;
}
@media (min-width: 768px) {
  .lead {
    font-size: 21px;
  }
  .headline strong {
    font-size: 24px;
  }
}

a.bg-black:hover,
a.bg-black:focus {
  background-color: #0d0f11;
}

h1,
h2,
h3 {
  font-family: 'Contrail One', cursive;

}
h1.text-vertical-center {
  margin: 0;
  padding: 0;
  font-size: 3.5em;
  color: rgba(0, 56, 112, 1); 
}
@media (max-width: 768px) {
  h1.text-vertical-center {
    font-size: 2.5em;
  }
}
h3.text-vertical-center {
  color: #003870; 
}

h2 {
	padding: 20px 0 20px 0;
  font-size: 2.5em;
}
h3 {
	padding: 10px 0 0 0;
  font-size: 1.5em;
}
dd {
	padding-bottom: 20px;
}
.abstand-unten-20 {
	padding-bottom: 20px;	
}
.abstand-unten-50 {
	padding-bottom: 50px;	
}

/* RUBRIKEN*/

/* STARTSEITE */
img.opener {
  /* Set rules to fill background */
  min-height: 100%;
  min-width: 1024px;
	
  /* Set up proportionate scaling */
  width: 100%;
  height: auto;
	
  /* Set up positioning */
  position: fixed;
  top: 0;
  left: 0;

  object-fit: cover;
  object-position: center;
  z-index: -99;
}
@media screen and (max-width: 1024px) { /* Specific to this particular image */
  img.opener {
    left: 50%;
    margin-left: -512px;   /* 50% */
  }
}

div.promo {
	position: absolute;
	margin: 0 auto;
	background-color: rgb(190, 154, 222, 0);
	text-align: center;
	line-height: 1;
}
@media (min-width: 1200px) {
	.promo {
		width: 300px;
		height: 500px;
    top: 35%;
		right: 20%;
		padding: 0.5em 0;
	}
}
@media (max-width: 1199px) {
	.promo {
		width: 300px;
		height: 500px;
		top: 35%;
		right: 5%;
		padding: 0.5em 0;
	}
}
@media (max-width: 768px) {
	.promo {
		width: 200px;
		height: 500px;
		top: 35%;
		right: 2%;
		padding: 0.5em 0;
	}
}

/* Aktuelles */
@media (min-width: 1400px) {
  .aktuelles-block {
    margin-top: 70%; 
  }
}
@media (max-width: 1399px) {
  .aktuelles-block {
    margin-top: 80%; 
  }
}
@media (max-width: 1199px) {
  .aktuelles-block {
    margin-top: 90%; 
  }
}
@media (max-width: 999px) {
  .aktuelles-block {
    margin-top: 100%; 
  }
}
@media (max-width: 899px) {
  .aktuelles-block {
    margin-top: 110%; 
  }
}
@media (max-width: 799px) {
  .aktuelles-block {
    margin-top: 120%; 
  }
}
@media (max-width: 699px) {
  .aktuelles-block {
    margin-top: 130%; 
  }
}
@media (max-width: 599px) {
  .aktuelles-block {
    margin-top: 140%; 
  }
}
#aktuelles img {
	padding-bottom: 15px;
}
.aktuelles {
    padding: 50px 0;
}
.headline {
  color: #337ab7;
}

/* Vita */
.vita {
    padding: 50px 0;
}
.vita-item {
    margin-bottom: 30px;
}
.img-vita {
    margin: 0 auto;
}
.img-vita:hover {
    opacity: 0.5;
}

/* Callout */
.callout {
    height: 500px;
}

/* Galerie */
.galerie {
    padding: 50px 0;
}
.galerie-item {
    margin-bottom: 30px;
}
.img-galerie {
    margin: 0 auto;
}
.img-galerie:hover {
    opacity: 0.5;
}

/* Call to Action - BUTTONS */
.call-to-action {
    padding: 50px 0;
}
.call-to-action .btn {
    margin: 10px;
}

/* Footer */
footer {
    padding: 0 0 100px 0;
    background: rgba(255, 255, 255, 0.75);
}
#to-top {
	display: none;
	position: fixed;
	bottom: 5px;
	right: 5px;
}

@media (max-width: 768px) {
.callout {
    height: 400px;
	}
}
