
/* open-sans-regular - latin */
@font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: url('../fonts/open-sans-v27-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/open-sans-v27-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/open-sans-v27-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/open-sans-v27-latin-regular.woff') format('woff'), /* Modern Browsers */
         url('../fonts/open-sans-v27-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/open-sans-v27-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
  }
  /* open-sans-600 - latin */
  @font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    src: url('../fonts/open-sans-v27-latin-600.eot'); /* IE9 Compat Modes */
    src: local(''),
         url('../fonts/open-sans-v27-latin-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
         url('../fonts/open-sans-v27-latin-600.woff2') format('woff2'), /* Super Modern Browsers */
         url('../fonts/open-sans-v27-latin-600.woff') format('woff'), /* Modern Browsers */
         url('../fonts/open-sans-v27-latin-600.ttf') format('truetype'), /* Safari, Android, iOS */
         url('../fonts/open-sans-v27-latin-600.svg#OpenSans') format('svg'); /* Legacy iOS */
  }




body{font-family: 'Open Sans', sans-serif; font-size: 14px;}
h1{color:#1e337a;}
h2{color:#1e337a;}
h2{font-size: 1.75rem;}
.white{color: #FFFFFF;}
.blue{color: #008ac4;}

.bg-gray{background-color: #f3f3f3;}
.bg-blue{background-color: #0578a3;}
.bg-darkblue{background-color: #001627;}
.bg_image1{background-image: url('../images/bg_weiss.jpg'); background-size: cover;}
.bg_image2{background-image: url('../images/bg_weiss_2.jpg'); background-size: cover;}

.btn_blue{background-color: #008ac4; color: white;}
.btn_blue:hover{background-color: #f3f3f3; color: #008ac4;}
.btn{line-height: 1.3;}
.btn-secondary { background-color: #1e337a;border-color: #1e337a;}

section {
    padding: 40px 0;
    overflow: hidden;
    position: relative;
}

.section-bg {
    padding: 50px 0;
    /*background-color: #008ac4;*/
    background-color: #0578a3
}


.zindex-1000{z-index: 1000;}
.number{font-size: 50px;}
.navbox{background-color: #f3f3f3; color: #008ac4; text-align: center; padding: 40px 10px;}
.navbox:hover, .navbox.active{background-color: #008ac4; color: white;}
.navbox:hover h2, .navbox.active h2, .navbox:hover p, .navbox.active p{color: white!important;}

form.form-inline{display: inline-flex;}
label.suche{display: none; }

  /* Default height for small devices */
  #intro-example {
    height: 400px;
  }

  #intro-example .container{margin-top: 10%;}
  #intro-example .container h1{font-weight: bold; text-transform: uppercase; font-size: 48px;}
  #intro-example .container h2 { margin: 10px 0 0 0; font-size: 36px;}
  /* Height for devices larger than 992px */
  @media (min-width: 992px) {
    #intro-example {
      height: 500px;
    }
  }


  @keyframes animatedBackground {
    from {
      background-position: 0 0;
    }
    to {
      background-position: 100% 0;
    }
  }
  #intro-example {

    background-image: url('../images/header.jpg');
    background-position: 0px 0px;
    background-repeat: repeat-x;
    animation: animatedBackground 20s linear infinite alternate;
  }


.parallax_para1 {
    background-image: url("../images/para_1.jpg");
    height: 500px;
  
  }

  .parallax{  
  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;}

    .parallax_text{ 
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);}

    #flex-container {
        display: -webkit-flex;
        display: -ms-flex;
        display: flex;
        -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
     }
     .panel_text {
       width: 30%;
       padding: 20px;
       margin: 10px;
     }

/*NAVIGATION*/
a.nav-link{color: #1e337a!important; padding: 5px!important; font-size:14px;}

.dropdown-menu {
  min-width: 15rem!important;
  padding: 0.5rem 0;
  margin-top: 0px!important;
  margin-left: -5px;
  font-size: 1rem;
  color: #1e337a;
 border: none !important;
  border-radius: 0px !important;
}


.dropdown-item{color: #1e337a!important; padding-bottom: 5px; font-size: 14px;}

.search{ font-size:14px;}


/*HEADER-SLIDER*/
.carousel-caption{margin-bottom: 10%!important;}



/*MAIN*/
main a, .modal-body a{color: #1e337a; text-decoration: underline;}
.label-div{width: 140px; display: inline-block; }

/*Veranstaltungskalender*/
.list-group-item{border: none; border-bottom: 1px solid rgba(0,0,0,.125); padding: 1rem 1rem;}

.transistion_box {
  position: relative;
  z-index: 1;
  
 
}
.transistion_box::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: scaleY(0);
  transform-origin: bottom center;
  /*background: #008ac4;*/
  background: #0578a3;
  z-index: -1;
  transition: transform 0.3s, color 1s;
  -webkit-transition: transform 0.3s, color 1s;
 
}
.transistion_box:hover{color: white;  }

.transistion_box:hover::after {
  transform: scaleY(1);
  
}


.grayscale {
  -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
  filter: grayscale(100%);
  
}

.grayscale:hover {
  -webkit-filter: grayscale(0%); /* Safari 6.0 - 9.0 */
  filter: grayscale(0%);
  transition: filter 1s;
}

.accordion-item{border-radius: 0px!important;}
.accordion-button:not(.collapsed) {
  color: #002949;
  background-color: #f3f3f3;
  box-shadow: inset 0 -1px 0 rgb(0 0 0 / 13%);
}
button.accordion-button.collapsed {background-color: #f3f3f3;}

#backTop {
  display: none; /* Hidden by default */
  position: fixed; /* Fixed/sticky position */
  bottom: 9px; /* Place the button at the bottom of the page */
  right: 65px; /* Place the button 30px from the right */
  z-index: 99; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: #1e337a; /* Set a background color */
  color: white; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 15px; /* Some padding */
  border-radius: 30px; /* Rounded corners */
  font-size: 18px; /* Increase font size */
}

button.accordion-button:active, button.accordion-button:focus{border: 2px solid #0578a3;}

#backTop:hover {
  background-color: #555; /* Add a dark-grey background on hover */
}



/*DropUP*/
/* Dropup Button */
.dropbtn {
  background-color: #3498DB;
  color: white;
  padding: 16px;
  font-size: 16px;
  border: none;
}

/* The container <div> - needed to position the dropup content */
.dropup {
  position: relative;
  display: inline-block;
}




.border-blau{border: 1px solid #1e337a}
#contact input::placeholder {font-size: 12px;}
#contact textarea{font-size: 12px; }
#contact .weitereangaben {display: none;}


.embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
}
.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}
.embed-responsive-4by3 {
  padding-bottom: 75%;
}

/*/ Small devices (landscape phones, 576px and up)
@media (min-width: 576px) { ... }*/

/*/ Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) {   }

/*/  Large devices (desktops, 992px and up)*/
@media (min-width: 992px) {
    /*NAVIGATION*/
    .nav-item{margin-right: 10px; padding: 0px 5px;}
    .nav-item:last-child{margin-right: 0px;}
    .nav-item:hover{background-color: #dfdfdf;}
    .active {background-color: #dfdfdf;}
    .ml-auto, .mx-auto {
        margin-left: auto!important;
    }

}

.card_wahl{margin: 10px; padding: 10px;}

.zoom {
  transition: transform .2s; /* Animation */
}

.zoom:hover {
  transform: scale(1.1); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}


/*Carousel*/
@media (max-width: 767px) {
  .carousel-inner .carousel-item > div {
      display: none;
  }
  .carousel-inner .carousel-item > div:first-child {
      display: block;
  }
}

.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
  display: flex;
}

/* medium and up screens */
@media (min-width: 768px) {
  
  .carousel-inner .carousel-item-end.active,
  .carousel-inner .carousel-item-next {
    transform: translateX(10%);
  }
  
  .carousel-inner .carousel-item-start.active, 
  .carousel-inner .carousel-item-prev {
    transform: translateX(-10%);
  }
}

.carousel-inner .carousel-item-end,
.carousel-inner .carousel-item-start { 
transform: translateX(0);
}


.carousel-control-prev {
  left: -50px !important;
}

.carousel-control-next {
  right: -50px !important;
}


@media only screen and (max-device-width: 1024px) {
    .parallax {
        background-attachment: scroll;
    }
}

/*/  X-Large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) {  }

/*/  XX-Large devices (larger desktops, 1400px and up)*/
@media (min-width: 1400px) {}






/*@media all and (min-width: 992px) {
	.navbar .dropdown-menu-end{ right:0; left: auto;  }
	.navbar .nav-item .dropdown-menu{  display:block; opacity: 0;  visibility: hidden; transition:.3s; margin-top:0;  }
	.navbar .nav-item:hover .nav-link{ color: #fff;  }
	.navbar .dropdown-menu.fade-down{ top:80%; transform: rotateX(-75deg); transform-origin: 0% 0%; }
	.navbar .dropdown-menu.fade-up{ top:180%;  }
	.navbar .nav-item:hover .dropdown-menu{ transition: .3s; opacity:1; visibility:visible; top:100%; transform: rotateX(0deg); }
}*/	



