@import url("https://use.typekit.net/yyj2lxx.css");   

/*Allgemeine Styles*/
body{color: #777777; display: block;}

/*Farben*/
.blue{color: #1e337a};
.darkblue{color: #132255;}
.gray{color: #777777}
.white{color: #FFFFFF}

/*Buttons*/
.bg-primary  {background-color: #1e337a !important;}
.bg-secondary {background-color: #132255 !important;}

.btn-outline-primary {
  color: #1e337a  !important;
  border-color: #1e337a !important;
}
.btn-outline-primary:hover {
  background-color: #1e337a  !important;
  color: white !important;
}

.btn-primary {
  background-color: #1e337a  !important;
  border-color: #1e337a !important;
}
.btn-primary:hover {
  background-color: #fff  !important;
  color: #1e337a !important;
  border-color: #1e337a !important;
}

/*Ãœberschriften*/
h1 {font-family: 'Nunito', sans-serif;font-family: futura-pt, sans-serif; font-size: 50px; }
h2 {font-family: 'Nunito', sans-serif;font-family: futura-pt, sans-serif; font-size: 34px; }
h3 {font-family: 'Nunito', sans-serif;font-family: futura-pt, sans-serif; font-size: 20px; font-weight: 300;}

/********************************************************************/
/****************************Mobile First****************************/
/********************************************************************/


/**************Navigation & Header**************/
/***********************************************/
header#header{border-top: 5px solid #1e337a;}

.navbar-toggler{ width: 47px; height: 38px; border:none;}
.navbar-toggler .line{  width: 100%; float: left; height: 2px; background-color: #fff; margin-bottom: 2px; margin-top: 2px;}

.navbar-brand{font-size: 24px; color: #1e337a !important;}
#navbar a.nav-link{color: #777777;}
#navbar button{background-color: #1e337a; border-radius: 5px; color: white;}

@media (min-width: 768px) {.navbar-nav li.nav-item{padding-left: 10px;padding-right: 10px;} }


@media (max-width: 768px) { .navbar-collapse {padding-bottom: 20px;}}


 
.dropdown-menu {background-color: #e9e9e9; border-color: white; border-radius: 0%;}
.dropdown-menu li{border-bottom: 1px solid #777777;}
.dropdown-menu li:last-child{border: none;}
.dropdown-menu li a{color: #777777;}


@media (min-width: 768px) {
.dropdown-menu {background-color: #fff; border: none; 
  box-shadow: 1px 5px 6px 0px rgba(0,0,0,0.57);
  -webkit-box-shadow: 1px 5px 6px 0px rgba(0,0,0,0.57);
  -moz-box-shadow: 1px 5px 6px 0px rgba(0,0,0,0.57);}
  .dropdown-menu li{border-bottom:none;}
}


#header {height: 70px; z-index: 997; transition: all 0.5s ease-in-out;  background: #fff; box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);}

#headerimage_index {width: 100%; height: 90vh; background: url("media.php/319/header.jpg") top center; background-size: cover; position: relative; margin-bottom: -140px; z-index: 1;}

#headerimage_index:before {content: ""; background: rgba(60, 65, 51, 0.2); position: absolute; bottom: 0; top: 0; left: 0; right: 0;}

#headerimage_index .headerimage-container {position: absolute;  bottom: 0; top: 0;  left: 0; right: 0; display: flex; justify-content: center;  align-items: center;  flex-direction: column; text-align: center;}

#headerimage_index h1 {margin: 0 0 10px 0; line-height: 56px; color: white;}

.headerimage-container img {background-color: rgba(255, 255, 255, 0.5); padding: 7px;}

@media (min-width: 1024px) {#headerimage_index { background-attachment: fixed; height: 80vh; }}


@media (min-width: 768px) and (max-width: 1022) { 
  #headerimage_index { height: 60vh; }
  #headerimage_index h1 { font-size: 28px; line-height: 36px;}
  #headerimage_index .headerimage-container { padding: 0 15px;}
}

@media (max-width: 765px) { 
  #headerimage_index { height: 100vh; }
  #headerimage_index h1 { font-size: 28px; line-height: 36px;}
  #headerimage_index .headerimage-container { padding: 0 15px;}
}


/*Headerimage Folgeseite*/
#headerimage {width: 100%; height: 60vh; background: url("media.php/319/header.jpg") top center; background-size: cover; position: relative; margin-bottom: -140px; z-index: 1;}
#headerimage:before {content: ""; background: rgba(60, 65, 51, 0.2);  position: absolute;  bottom: 0;  top: 0; left: 0; right: 0; }
#headerimage .headerimage-container { position: absolute;  bottom: 0; top: 0; left: 0; right: 0; display: flex; justify-content: center; align-items: center; flex-direction: column; text-align: center;}
#headerimage h1 {margin: 0 0 10px 0; line-height: 56px;  color: white;}

@media (min-width: 1024px) { #headerimage {background-attachment: fixed;}}
@media (max-width: 768px) {
  #headerimage { height: 100vh; }
  #headerimage h1 {font-size: 28px; line-height: 36px;}
  #headerimage h2 {font-size: 18px;line-height: 24px; margin-bottom: 30px; }
  #headerimage .headerimage-container {padding: 0 15px;}
}

@media (max-height: 500px) { #headerimage { height: 120vh;}}



/*****************Main********************/
/*****************************************/

#main {margin-top: 40px;  z-index: 980; position: relative;}
section {overflow: hidden; }


/*Map*/
.map .container {  box-shadow: 0px 2px 15px rgb(0 0 0 / 10%); padding-bottom: 15px;background: #fff;}

.parallax {
  background-image: url("media.php/319/para_map.jpg");
  filter: brightness(0.9);
  -webkit-filter: brightness(0.9)  ;
  min-height: 500px; 
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/*Links*/
#main a{color: #1e337a; text-decoration: none;}
#main a:hover{color: #1e337a; text-decoration: underline;}




/****************Footer********************/
/*****************************************/

footer a{color: white; text-decoration: none;}
footer a:hover{color: white; text-decoration: underline;}