
/* CSS Document */
 /*FONTS*/
 
 
 @font-face {
    font-family: 'NunitoSansRegular';
    src: url('../fonts/NunitoSansRegular.eot');
    src: url('../fonts/NunitoSansRegular.eot') format('embedded-opentype'),
         url('../fonts/NunitoSansRegular.woff2') format('woff2'),
         url('../fonts/NunitoSansRegular.woff') format('woff'),
         url('../fonts/NunitoSansRegular.ttf') format('truetype'),
         url('../fonts/NunitoSansRegular.svg#NunitoSansRegular') format('svg');
}


 @font-face {
    font-family: 'Lato';
    src: url('../fonts/LatoBold.eot');
    src: url('../fonts/LatoBold.eot') format('embedded-opentype'),
         url('../fonts/LatoBold.woff2') format('woff2'),
         url('../fonts/LatoBold.woff') format('woff'),
         url('../fonts/LatoBold.ttf') format('truetype'),
         url('../fonts/LatoBold.svg#LatoBold') format('svg');
}

/***/


.blau {color: #9DA9AA;}
.green {color: #88C040;}
.hellgrau {color:#9DA9AA;}

.parallax {
  /* The image used */
  background-image: url(../media/plan_de.jpg);

  /* Set a specific height */
  min-height: 300px; 

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


.grid {
	position: relative;
	margin: 0 auto;
	padding: 0;
	max-width: 1000px;
	list-style: none;
	text-align: center;
}

/* Common style */
.grid figure {
	position: relative;
/*float: left;*/
overflow: hidden;
margin: 10px 1%;
/*min-width: 320px;*/
/*max-width: 480px;*/
/*max-height: 360px;*/
/*width: 48%;*/
background: #3085a3;
text-align: center;
cursor: pointer;
}

.grid figure img {
	position: relative;
	display: block;
	min-height: 100%;
	max-width: 100%;
	opacity: 0.8;
}

.grid figure figcaption {
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
	pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.grid figure figcaption a {
	background-color: rgba(0,0,0,0.42);
}

/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.grid figure figcaption > a {
	z-index: 1000;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}

.grid figure h2 {
	word-spacing: -0.15em;
	font-weight: 300;
}

.grid figure h2 span {
	font-weight: 800;
}

.grid figure h2,
.grid figure p {
	margin: 0;
}

.grid figure p {
	letter-spacing: 1px;
	font-size: 65%;
}


figure.effect-oscar {
	background: -webkit-linear-gradient(45deg, #88C040 0%,#9DA9AA 40%,#808992 100%);
	background: linear-gradient(45deg, #88C040 0%,#9DA9AA 40%,#808992 100%);
}

figure.effect-oscar img {
	opacity: 0.9;
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;
}

figure.effect-oscar figcaption {
	padding: 3em;
background-color: rgba(0, 0, 0, 0.49);
-webkit-transition: background-color 0.35s;
transition: background-color 0.35s;
}

figure.effect-oscar figcaption::before {
	position: absolute;
	top: 30px;
	right: 30px;
	bottom: 30px;
	left: 30px;
	border: 1px solid #fff;
	content: '';
}

figure.effect-oscar h2 {
	margin: 20% 0 10px 0;
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
	-webkit-transform: translate3d(0,100%,0);
	transform: translate3d(0,100%,0);
}

figure.effect-oscar figcaption::before,
figure.effect-oscar p {
	opacity: 0;
	-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
	transition: opacity 0.35s, transform 0.35s;
	-webkit-transform: scale(0);
	transform: scale(0);
}

figure.effect-oscar:hover h2 {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

figure.effect-oscar:hover figcaption::before,
figure.effect-oscar:hover p {
	opacity: 1;
	-webkit-transform: scale(1);
	transform: scale(1);
}

figure.effect-oscar:hover figcaption {
	background-color: rgba(58,52,42,0);
}

figure.effect-oscar:hover img {
	opacity: 0.4;
}





nav ul { 
  text-align: center;
  font-size:0.8rem;
}
nav ul li a {
  position: relative;
}
nav ul li a:after {    
  background: none repeat scroll 0 0 transparent;
  bottom: 0;
  content: "";
  display: block;
  height: 2px;
  left: 50%;
  position: absolute;
  background: #dadada;
  transition: width 0.3s ease 0s, left 0.3s ease 0s;
  width: 0;
}
nav ul li a:hover:after { 
  width: 100%; 
  left: 0; 
}




@media screen and (max-height: 300px) {
	nav ul {
		margin-top: 40px;
	}
}
 
 
 .btn-danger {
	font-family:'Lato';
 }
 
 


#myBtn {
  display: none;
  position: fixed;
bottom: 90px;
right: 30px;
border: 2px solid #8c8c8c;
outline: none;
background-color: rgba(255, 255, 255, 0.9);
color: white;
cursor: pointer;
padding: 10px;
border-radius: 5px;
z-index: 1000;
height: 54px;


}

#myBtn:hover {
  border: 2px solid #88C040;
}


#cookiedingsbums a {color: #c0262c; text-decoration:none;}

#cookiedingsbums a:hover {text-decoration:underline;}

#cookiedingsbums div {padding:10px; padding-right:50px;}

#cookiedingsbums { 
   text-align: center;
border-top: 1px solid #d1d1d1;
background-color: rgba(255, 255, 255, 0.9) !important;
position: fixed;
bottom: 0px;
padding: 4px;
z-index: 3000;
width: 100%;
font-size: 12px;
line-height: 16px;
color: #8c8c8c;
   }

#cookiedingsbumsCloser {
   color: #c0262c;
vertical-align: middle;
text-align: center;
position: absolute;
right: 5px;
text-decoration: none;
top: 5px;
cursor: pointer;
border: 1px solid #c0262c;
border-radius: 27px;
padding: 4px;
width: 30px;
height: 30px;
 }

#cookiedingsbumsCloser:hover {color: #A5A5A5;
border: 1px solid #A5A5A5;
border-radius: 27px;}
   
   
.red {color:rgba(192,38,44,1.00);}
.footer .bg-dark {background-color:#fff;}
.footer .navbar {
	

}

.footer .navbar-nav {
    margin-top: -22px;
	
}

.bg-darker {
		font-family: 'Lato';
		font-size:0.7rem;
		background-color:#a0a9ad;
		text-align:center;
		color:#dfe2e4;
		width:100%;
		padding:1rem;
}


.footer nav ul { 
  text-align: center;
  font-size:0.8rem;
  
}
.footer nav ul li a {
  position: relative;
  
}
.footer nav ul li a:after {    
  background: none repeat scroll 0 0 transparent;
  bottom: 0;
  content: "";
  display: block;
  height: 1px;
  left: 50%;
  position: absolute;
  background: #8c8c8c;
  transition: width 0.3s ease 0s, left 0.3s ease 0s;
  width: 0;
}
.footer nav ul li a:hover:after { 
  width: 100%; 
  left: 0; 
}


.footer .navbar-dark .navbar-nav .nav-link

{color:#a0a9ad;}

.bg-header{
	background-image: url(../media/header.jpg);
	background-size:cover;
	background-repeat:no-repeat;
	height:500px;	
}


.red-header{
	background-image: url(../media/red_header.png);
	background-size:cover;
	background-repeat:no-repeat;
	background-position-x: right;
	height:200px;
	position: absolute;
left: 0px;
width: 90%;
margin-top: 200px;	
}

.header-text {
	position: relative;
	margin-top: 250px;
}

.linie {margin-top:-120px; margin-left:-5px}

.row .btn-danger {
	font-family:'Lato';
    font-size: 1.2rem;
    text-align: center;
    border-radius: 5px;
	position:relative;
	margin: 0 auto;
}

.bg-grau {
	background-color:#dae6d7;
	color:#616f77;
	background-image:url(../media/hg.png);
	background-repeat:no-repeat;
	background-size:cover;
	background-position: right bottom;
}

.bg-grau2 {
	background-color:#8c8c8c;
	color:#fff;
}




.rounded{width:200px; margin-top:-70px;}
.card-body {text-align:left;}
.card-header {border-radius: 10px 10px 0px 0px;}

.card-deck .rounded {width:70px; -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.3);}

.card-deck .bg-item1{background-color:#f3f3f3;}


.card-deck .bg-item2{background-color:#eeeeee;}


.card-deck .bg-item3{background-color:#e8e8e8;}


.card-deck .bg-item4{
	background-color:#DCE8D9;
}

.vorteile ul  {
	font-family:'Lato';
	list-style-type:none;
	line-height:4rem;
	position:relative;
	left:0px;
	text-align:left;
}

.bg-grau ul{
	list-style-type:none;
	line-height:3rem;
	left:0px;
	margin-left: -40px;
	
}

.bg-grau ul a{
	text-decoration: none;
	color:white;
	
}

.bg-grau ul a:hover{
	text-decoration: underline;
	color:white;
	
}

.btn-link {
  font-weight: 400;
  color: white;
  text-decoration: none;
}

.btn-link:hover {
  color: white;
  text-decoration: underline;
}

.btn-link:focus, .btn-link.focus {
  text-decoration: underline;
}

.btn-link:disabled, .btn-link.disabled {
  color: #6c757d;
  pointer-events: none;
}



.btn-download {
	color: #88C040;
	background-color: #fff;
	border-radius:10px;
	padding-left:2.5rem;
	padding-right:2.5rem;
	font-size: 0.9rem;
	font-family:'Lato';
}

.btn-download:hover {
  color: rgba(75,172,68,1.00);

border-color: rgba(75,172,68,1.00);
}

.btn-download:focus, .btn-download.focus {
  color: rgba(75,172,68,1.00);

  border-color: rgba(75,172,68,1.00);
  box-shadow: 0 0 0 0.2rem rgba(225, 83, 97, 0.5);
}

.btn-download.disabled, .btn-download:disabled {
  color: rgba(142,28,32,1.00);

  border-color: #dc3545;
}

.btn-download:not(:disabled):not(.disabled):active, .btn-download:not(:disabled):not(.disabled).active,
.show > .btn-download.dropdown-toggle {
  color: rgba(142,28,32,1.00);

  border-color: #b21f2d;
}

.btn-download:not(:disabled):not(.disabled):active:focus, .btn-download:not(:disabled):not(.disabled).active:focus,
.show > .btn-download.dropdown-toggle:focus {
  box-shadow: 0 0 0 0.2rem rgba(225, 83, 97, 0.5);
}






.mob{
	margin-left:3rem;
	}
	
	.mob2{
	padding-left:3rem;
	}
	



@media only screen and (max-width: 1091px ) {
	
	h1, .h1 {
  font-size:250%;
}
	
	h2, h3, h4, h5, h6, .h2, .h3, .h4, .h5, .h6 {
  font-size:130%;
}



figure.effect-oscar h2 {margin: 20% 0 10px 0;}
.grid figure {height:400px;}

	


}





@media only screen and (max-width: 991px ) {
	
	
	
	h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-size:130%;
}



figure.effect-oscar h2 {margin: 20% 0 10px 0;}
.grid figure {height:400px;}

	
	
	.navbar-nav {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 0;
    margin-bottom: 75px;
	margin-right:0rem;
    list-style: none;
    text-align: center;
}
	
	.nav-link {
  display: block;
  padding: 1.5rem 1rem;
  font-size:1.2rem;
}


.footer .navbar-nav {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    padding-left: 0;
	margin-right:0rem;
	margin-bottom: 20px;
    list-style: none;
    text-align: center;
	margin-top: 20px;
	
}
	
.footer	.nav-link {
  display: block;
  padding: 1rem 1rem;
  font-size:1rem;
}

.navbar-nav .btn-danger {
    font-size: 1.2rem;
    width: 165px;
    text-align: center;
    border-radius: 5px;
	position:relative;
	top:50px;
	margin: 0 auto;
	padding:6px;
	
	
}



.red-header{
	background-image: url(../media/red_header.png);
	background-size:cover;
	background-repeat:no-repeat;
	background-position-x: left;
	height:250px;
	position: absolute;
left: 0px;
width: 100%;
margin-top: 150px;	
}

.header-text {
	position: relative;
	margin-top: 180px;
	text-align:center;
}


.bg-header{
	background-image: url(../media/header.jpg);
	background-size:cover;
	background-repeat:no-repeat;
	background-position-x: center;
	height:500px;	
}

.row .btn-danger {
	font-family:'Lato';
    font-size: 1.2rem;
    text-align: center;
    border-radius: 5px;
	position:relative;
}

.row {text-align:center;}
.card-body {text-align:center;}

.vorteile ul  {
	font-family:'Lato';
	list-style-type:none;
	line-height:4rem;
	position:relative;
	left:0px;
	text-align:center;
	padding-right: 3rem;
	
}
.vorteile ul  li {
	
	line-height:1rem;
	padding-top:4rem;
	
}


.bg-grau ul{
	list-style-type:none;
	line-height:3rem;
	left:0px;
	text-align:center;

	
}

.mob{
	margin-left:0rem;
	}
	
	.mob2{
	padding-left:0rem;
	}



}


@media screen and (max-width: 480px) {
  [data-aos] {
    display: none !important;
  }
  
  [data-aos=fade-down] {
	  display: block !important;
  }
  
  .leistung_no {display:none;}
  
  .grid figure img {
   max-width: 180%;
    width: 180%;
}
}

@media screen and (max-width: 600px) {
.display-4 {font-size:2rem;}	
}