/*!
 * Start Bootstrap - Scrolling Nav HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary, div {
  display: block;
  border:0px;
}

body {
    width: 100%;
height:100%;
font-size:20px;
background:#fff;
background-position:center center;
background-size:cover;
background-repeat:no-repeat;
background-attachment:fixed;
font-family: 'Baloo Bhaijaan 2', sans-serif;
}

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


a{
color:#01adff;
text-decoration:none;

}
a:hover{
color:#01adff;
text-decoration:none;
}
.panel-heading a{
color:#fff;
font-weight:bold;
text-decoration:none;
}
.panel-heading{
  background:#01adff !important;
  color:#ffffff !important;
}
.panel-default{
  border: 1px solid #01adff !important;
}

.nav-tabs a{
color:#000;
font-weight:bold;
text-decoration:none;
}

.nav-tabs a:hover{
color:#000;
text-decoration:none;
}
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover{

color:#01adff !important;
text-decoration:none;
}

h1{
  margin:0px;
  margin-left:-1px;
font-size:40px;
font-weight:bold;
font-family: 'Baloo Bhaijaan 2', sans-serif;
}
h2{
  margin:0px;
  margin-bottom:15px;
  margin-left:-1px;
font-size:40px;
font-weight:bold;
font-family: 'Baloo Bhaijaan 2', sans-serif;
}
h3,h4{
    color:#01adff;
  margin:0px;
margin-bottom:15px;
font-family: 'Baloo Bhaijaan 2', sans-serif;
font-weight:bold;
}
.fancybox-opened {
z-index: 9999 !important;
}
.navbar-default {
background:transparent;
background-position:center bottom;
border:0px;
height:90px;
padding:25px 0 ;
}
.navbar-brand{
padding:0px;
padding-left:10px;
padding-right:15px;
padding-top:4px;
font-size:28px;
line-height:22px;
color:#000 !important;
}
.logo{
  width:160px;
  height:auto;
  margin-top:5px;
  filter: invert(0%) contrast(200%) saturate(1%) brightness(200%);
    -webkit-filter: invert(0%) saturate(1%) contrast(200%) brightness(200%);
}
.headbg{
  background:#fff;
  transition: 1s;
}
.headbg img{
  filter: invert(0%) brightness(100%);
  -webkit-filter: invert(0%) brightness(100%);
}

.navbar-nav {
    float: right;
    margin: 0;
}
.navbar-header{
  z-index:999;
  position:relative;
}
.navbar-default .navbar-collapse{
  z-index:998;
  position:relative;
  border:0px;
  border-color:transparent;
  box-shadow:unset;
}
.navbar-default .navbar-nav > li > a {
    color: #fff;
text-decoration:none;
font-weight:bold;
font-family: 'Baloo Bhaijaan 2', sans-serif;
}
.headbg .navbar-nav > li > a {
    color: #000;
}
.navbar-default .navbar-nav > li > a:focus {
    color:#01adff;
font-weight:bold;
background:transparent;
}
.navbar-default .navbar-nav > li > a:hover {
    color:#01adff;
font-weight:bold;
background:transparent;
}
.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .active > a:hover {
    color:#01adff;
font-weight:bold;
background:transparent;
}
.navbar-toggle {
    background-color: transparent !important;
    background-image: none;
    border: 0px solid transparent;
    border-radius: 4px;
    float: right;
    margin-bottom: 8px;
    margin-right: 15px;
    margin-top: 2px;
    padding: 2x;
    position: relative;
font-size:25px;
color:#000;
}
.navbar-toggle-out{
  display:none;
}
figure img{
width:calc(100% - 15px);
margin-bottom:15px;
}
footer {
    margin: 50px 0;
}
p{
min-height:16px;
}

.material-symbols-outlined {
  font-variation-settings:
  'FILL' 0,
  'wght' 400,
  'GRAD' 0,
  'opsz' 26
}
.navbar-toggle span{
  color:#fff;
}
.headbg .navbar-toggle span{
  color:#000;
}


/* Standard Sektionen */
.standard-section {
    height: auto;
    padding-top: 100px;
    padding-bottom:100px;
    text-align: center;
    background: #fff;
background-size:cover;
background-position:center center;
color:#000;
position:relative;
display:block;
}
.fullsize-section {
    height: 100vh;
    padding-top: 100px;
    padding-bottom:100px;
    text-align: center;
    background: #fff;
background-size:cover;
background-position:center center;
color:#000;
position:relative;
display:block;
}
#datenschutz{
  display:none;
  font-size:16px;
  max-height:90%;
}
.fancybox-opened {
z-index: 9999;
}
.fancybox-opened .fancybox-skin{
  padding-top:25px !important;
}

.cky-revisit-bottom-left{
  display:none !important;
}

/* Editor Styles */
.sc-content p.boxed {
  background: #fff;
  color: #000;
  padding: 15px;
}
.sc-content img.rounded {
  border-radius:50%;
  overflow:hidden;
}
.sc-content p.button a {
  display: inline-block;
  padding: 10px 20px;
  background: #01adff;
  color: #fff;
  margin-top:10px;
  text-decoration: none;
  border-radius: 5px;
}
.sc-content p.left-align,
.sc-content h2.left-align,
.sc-content h3.left-align,
.sc-content h4.left-align {
  text-align: left;
}
.sc-content p.center-align,
.sc-content h2.center-align,
.sc-content h3.center-align,
.sc-content h4.center-align {
  text-align: center;
}
.sc-content p.right-align,
.sc-content h2.right-align,
.sc-content h3.right-align,
.sc-content h4.right-align {
  text-align: right;
}
.sc-content p.boxed-left-align {
  text-align: left;
  background:#f4f4f4;
  padding:15px;
}
.sc-content p.boxed-center-align {
  text-align: center;
  background:#f4f4f4;
  padding:15px;
}
.sc-content p.boxed-right-align {
  text-align: right;
  background:#f4f4f4;
  padding:15px;
}

/* Animationen */
a:hover,.zoomit:hover{
  transform: scale(1.1) !important;
  transition: all 0.3s ease !important;
}
.fade-in {
  opacity: 0;
}
.plopp-in {
  opacity: 0;
}
.fade-in-visible {
  animation: FadeIn 2.4s forwards;
}
.plopp-in-visible {
  animation: ploppIn 2.1s forwards;
}


@keyframes ploppIn {
  0% {
    opacity: 0;
		transform: scale(0);

  }
	50% {
    opacity: 1;
		transform: scale(1.05);
  }
  100% {
		transform: scale(1);
    opacity: 1;
  }
}
@keyframes FadeIn {
  0% {
    opacity: 0;
  }
100% {
		  opacity: 1;
  }
}

.color-change-5x {
	-webkit-animation: color-change-5x 8s linear infinite alternate both;
	        animation: color-change-5x 8s linear infinite alternate both;
}
@-webkit-keyframes color-change-5x {
  0% {
    background: #19dcea;
  }
  25% {
    background: #b22cff;
  }
  50% {
    background: #ea2222;
  }
  75% {
    background: #f5be10;
  }
  100% {
    background: #3bd80d;
  }
}
@keyframes color-change-5x {
  0% {
    background: #19dcea;
  }
  25% {
    background: #b22cff;
  }
  50% {
    background: #ea2222;
  }
  75% {
    background: #f5be10;
  }
  100% {
    background: #3bd80d;
  }
}
section .airs{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background: url(../images/wave.png);
  background-size: 1000px 100px
}
section .airs.air1{
  animation: wave 30s linear infinite;
  z-index: 1000;
  opacity: 1;
  animation-delay: 0s;
  bottom: 0px;
}
section .airs.air2{
  animation: wave2 15s linear infinite;
  z-index: 999;
  opacity: 0.5;
  animation-delay: -5s;
  bottom: 10px;
}
section .airs.air3{
  animation: wave 30s linear infinite;
  z-index: 998;
  opacity: 0.2;
  animation-delay: -2s;
  bottom: 15px;
}
section .airs.air4{
  animation: wave2 5s linear infinite;
  z-index: 997;
  opacity: 0.7;
  animation-delay: -5s;
  bottom: 20px;
}
section .air{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background: url(../images/wave.png);
  background-size: 1000px 100px
}
section .air.air1{
  animation: wave 30s linear infinite;
  z-index: 1000;
  opacity: 1;
  animation-delay: 0s;
  bottom: 0px;
}
section .air.air2{
  animation: wave2 15s linear infinite;
  z-index: 999;
  opacity: 0.5;
  animation-delay: -5s;
  bottom: 10px;
}
section .air.air3{
  animation: wave 30s linear infinite;
  z-index: 998;
  opacity: 0.2;
  animation-delay: -2s;
  bottom: 15px;
}
section .air.air4{
  animation: wave2 5s linear infinite;
  z-index: 997;
  opacity: 0.7;
  animation-delay: -5s;
  bottom: 20px;
}
section .airb{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100px;
  background: url(../images/wave.png);
  transform: rotate(180deg);
  background-size: 1000px 100px
}
section .airb.air1{
  animation: wave 30s linear infinite;
  z-index: 1000;
  opacity: 1;
  animation-delay: 0s;
  top: 0px;
}
section .airb.air2{
  animation: wave2 15s linear infinite;
  z-index: 999;
  opacity: 0.5;
  animation-delay: -5s;
  top: 10px;
}
section .airb.air3{
  animation: wave 30s linear infinite;
  z-index: 998;
  opacity: 0.2;
  animation-delay: -2s;
  top: 15px;
}
section .airb.air4{
  animation: wave2 5s linear infinite;
  z-index: 997;
  opacity: 0.7;
  animation-delay: -5s;
  top: 20px;
}
@keyframes wave{
  0%{
    background-position-x: 0px;
  }
  100%{
    background-position-x: 1000px;
  }
}
@keyframes wave2{
  0%{
    background-position-x: 0px;
  }
  100%{
    background-position-x: -1000px;
  }
}



/* Standard Mobile Styles */
@media(max-width:768px) {
.container-fluid>.navbar-collapse, .container-fluid>.navbar-header, .container>.navbar-collapse, .container>.navbar-header{
  padding:0px;
  margin:0px;
  width:100%;
  height:100%;
  text-align:center;
}

.navbar-collapse .navbar-nav {
  width:100%;
  padding:0px;
  margin:0px;
  margin-top:35px;
}
.navbar-collapse .navbar-nav li a{
  width:100%;
  padding-top:10px;
  padding-bottom:10px;
  margin-top:20px;
  margin-bottom:20px;
}
.standard-section .container{
padding:25px;
}
}

@media(max-width:400px) {
h1, h2, h3, h4, h5{
word-wrap: break-word;
}
}



/* Introbereich */
.intro-section {
    height: calc(100%);
    padding-top: 120px;
padding-bottom:150px;
    text-align: center;
    background: transparent;
color:#000;
display:table;
width:100%;
animation-name: start;
    animation-duration: 1s;
}
.intro-section .container{
  width:100%;
}
.intro-section h1, .intro-section span{
font-size:40px;
color:#fff;
}
.intro-section h2{
  font-size:25px;
  color:#fff;
  padding-top:10px;
}


#leistungen{

}

#portfolio{
  background:#111;
  padding-top:250px;
  padding-bottom:250px;
  color:#fff;
}

#preise{

}

#ablauf{
  background:transparent;
  padding-top:250px;
  padding-bottom:250px;
  color:#fff;
}

#kontakt{

}



/* Footer Sektion */
#footer{
  background:transparent;
  position:fixed;
  bottom:0px;
  height:60px;
  z-index:9999;
  width:100%;
  padding-top:10px;
}
#footer a{
font-size:14px;
color:#000;
}