@import url('https://fonts.googleapis.com/css2?family=Play&display=swap');

body
{
    font-family: 'Play', sans-serif;
}

.title h3, h1
{
    color:#fff;
    text-transform:uppercase;
}

.row h2 
{
    visibility:visible;
    font-size:26px;
}

.LogoWrapper
{
    left:60px;    
    position:absolute;
    text-align:center;
    width:auto;
    z-index:999;
    top:60px;
}

.mainLogo
{
    max-width: 300px;
    margin: auto;
}

.footerLink
{
    font-size:18px;
    text-decoration:none;
}


.socials
{
    font-size:30px;
}

.socials a
{
    margin-right:9px;
}

.amazon img
{
   width:160px;
   position:relative;
   top:-8px;
}

.footerElements
{
   position: fixed;
    bottom: 0px;
    left: 0px;
    width: 100%;
    padding-bottom: 40px;
}

body
{
    display: flex;
align-items: center;
justify-content: center;
}

header
{
    z-index:999999999 !important;
}

.navbarTop
{
    width:100% !important;
    max-width:100% !important;
}

.navbar-dark .navbar-toggler {
    position: relative;
    left: 30px;
}

.navbar-brand {
    right: -2.35em;
    position: relative;
}

#webTicker li
{
    font-size:12px;
    font-family: Sansita,sans-serif;
    font-weight: normal;
    color:#ffffff;
}



#webTicker .last::after, #webTicker .ticker-space::after
{
    content: ''; display:none;
}

h2
{
    visibility:visible;
}

h3 {
    font-size: 23px;
}

.silberStreifen
{
    background: linear-gradient(to right, #717171 0%,#F7F7F7 14%,#B7B7B7 30%,#F7F7F7 37%,#E9FBFF 53%,#C6F8FF 64%,#BFBFBF 70%,#F7F7F7 85%,#757575 100%);
}

.modal-content, .modal-content h1, .modal-content h2, .modal-content h3, .modal-content h4
{
    color:#fff !important;
    visibility:visible !important;
    text-align:justify !important;
}

.modal-content ul
{
    display:inline-block;
}


.modal-content li
{
    text-align:left;
}

#modalKontakt
{
    background-color:#000 !important;
}

#navbarHeader {
    position: absolute !important;
    width: 100% !important;
    padding-top: 100px !important;
    top:0px;
}

main
{
    z-index:1;
    position:relative;
}


.lightboxWrapper
{
    margin-top:25px;
}

.by
{
    font-size:10px;
}

#btnLB
{
    display:none;
}

#btn-close-modal
{
    background-color:#333;
    padding:10px 0px;
    position: fixed;
    z-index: 999999;
}

.modal-content
{
    background: rgba(0,0,0,0.95) !important;
    padding: 90px !important;
    overflow-y: auto;
    height: 100%;
}

.modalDS-on, .modalImpressum-on, .modalLightbox-on
{
    background-color:transparent !important;
    z-index:9999999999 !important;
    overflow-y: hidden !important;
}

.modalDS-off, .modalImpressum-off, .modalLightbox-off
{
    z-index:-99999999 !important;
    display:none;
}


a
{
    cursor:pointer;
}

.modal
{
    z-index: 9999999;
}

 #btn-close-modal {
                width:100%;
                text-align: center;
                cursor:pointer;
                color:#fff;
            }



.myVideo {
  position: fixed;
  right: 0;
  bottom: 0;
  width: 100%;
  height: auto;
}


.padding20
{
    padding:20px;
}

.shadowLogo
{
    height:100px;
}

#ref1 .newline, #ref2 .newline
{
    display:block;
}
.contentWrapper
{
    position: relative;
    margin: auto;
    text-align: center;
    background: rgba(0,0,0,0.0);
    padding: 0px;
    margin-top:15px;
}


.site-header
{
    position: fixed;
    top: 20px;
    left: 20px;
    z-index:9999;
}

.marginTop100
{
    margin-top:100px;
}


.referenzListe
{

}

.nav-link
{
    text-decoration:none;
}

#navbarHeader
{
    background-color:#000;
    background-image:none;
}

.navbar-toggler,  .menuIcon:hover
{
     box-shadow:
    0 0 15px 8px #fff,
    0 0 25px 15px #0099FF,
    0 0 35px 22px #0ff;
    background-color:#fff;
}

.nav-link {
  color: #fff;
  font-weight: bold;
  font-size:18px;
  -webkit-animation: glow 1s ease-in-out infinite alternate;
  -moz-animation: glow 1s ease-in-out infinite alternate;
  animation: glow 1s ease-in-out infinite alternate;
}


@-webkit-keyframes glow {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #0099FF, 0 0 40px #0099FF, 0 0 50px #0099FF, 0 0 60px #0099FF, 0 0 70px #0099FF;
  }
  to {
    text-shadow: 0 0 20px #fff, 0 0 30px #0ff, 0 0 40px #0ff, 0 0 50px #0ff, 0 0 60px #0ff, 0 0 70px #0ff, 0 0 80px #0ff;
  }
}


.navbar-dark .navbar-toggler-icon {

}


.bg-dark h4
{
    margin-bottom:20px;
}

.bg-dark h5
{
    font-size:13px;
    color:#fff;
    text-align:center;
    margin-top:6px;
}

.tilt {position:relative; width:400px;height:225px;transform-style: preserve-3d; border-radius:15px;overflow:hidden;margin:auto;}
	.tilt img {width:400px;height:225px;position:absolute;top:0px;left:0px;transform: translateZ(20px); opacity:0.95;cursor:pointer;
	 transition-property: opacity;
  transition-duration: 2s;
	}
	.tilt img:hover {opacity:0.15;}
	.tilt video {width:400px;height:225px;}
	
	
  .bd-placeholder-img {
        font-size: 1.125rem;
        text-anchor: middle;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
      }


.jumbotron p:last-child {
  margin-bottom: 0;
}

.jumbotron-heading {
  font-weight: 300;
}

.jumbotron .container {
  max-width: 40rem;
}

.black
{
    background-color:#000;
}

footer {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

footer p {
  margin-bottom: .25rem;
}

a {color:white;}
a:hover {color:#f9f9f9;}

.bg-dark, body, html, .jumbotron {
    background-color: #171717!important;
    background-image:url(/img/kachelBG.jpg);
}

.bg-dark
{
    position: relative;
    z-index: 999;
}

.text {
 /* position: fixed;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);*/
  list-style: none;
  border-bottom: 0;
}

.text.hidden {
  border-bottom: 0px solid #fff;
}

.text span {
  display: inline-block;
  float: left;
  font-weight: 700;
  font-size: 2em;
  color: #fff;
  opacity: 1;
  transition: all 0.5s ease-in-out;
  max-width: 2em;
}
.text.hidden span.spaced {
  padding-left: 0;
}
.text span.spaced {
  padding-left: 0.5em;
}

.text.hidden span.ghost {
  opacity: 0;
  max-width: 0;
}

.shadowLogo {
   -moz-box-shadow:    inset 0 0 10px #000000;
   -webkit-box-shadow: inset 0 0 10px #000000;
   box-shadow:         inset 0 0 10px #000000;
}

.law .btn1
{
    top: 8px;
    position: relative;
    font-size:2.25rem !important;
}

#flairEffect
{
    display:block;
    width:100px;
    background:none;
    margin: 0 auto;
    z-index:9999999999;
}

	  .jumbotron {
  padding-top: 3rem;
  padding-bottom: 3rem;
  margin-bottom: 0;
  background-color: #fff;
}

#lbImg
{
    max-width: 100%;
    position: relative;
    margin: auto;
}

.show565
    {
        display:none;
    }
    
    .hide565
    {
        display:block;
    }
    
.lieberamgroup
{
    position: absolute;
    left: 4%;
    top: 25px;
    width: 275px;
}

@media (max-width:1650px)
{
    .tilt {width:300px;height:169px;}
	.tilt img {width:300px;height:169px;}
	.tilt video {width:300px;height:169px;}
}

@media (max-width:1250px)
{
    .tilt {width:250px;height:141px;}
	.tilt img {width:250px;height:141px;}
	.tilt video {width:250px;height:141px;}
}

@media (max-width:1100px)
{
    .lieberamgroup
    {
        position: absolute;
        left: 4%;top: 75px;
    }
}

@media (max-width:1050px)
{
    
    .tilt {width:175px;height:98px;}
	.tilt img {width:175px;height:98px;}
	.tilt video {width:175px;height:98px;}
	h3 {font-size: 0.9em;
    margin-top: 10px;}
    
    footer
    {
        position:relative !important;
    }
    
    #btnDS, #btnImpressum
    {
        display:inline;
    }

    .by
    {
        margin-left:10px;
    }
}



@media (min-width:767px) and (max-width:990px)
{
    .referenzListe
    {
        padding:20px;
        font-size:12px;
    }
}

@media (max-width:767px)
{
    .mainLogo {
    max-width: 250px;
    }
    
    .amazon img
    {
           width: 135px;
    position: relative;
    top: -5px;
    }
    
   
    
    .socials {
        font-size: 23px;
    }

    .center-mobil
    {
        text-align:center !important;
    }
    
    .wrap {min-height: 50%;}
    
    .tilt {width:400px;height:225px;}
	.tilt img {width:400px;height:225px;}
	.tilt video {width:400px;height:225px;}
	
	h3 {font-size: 1.6em;
    margin-top: 10px; margin-bottom:30px}
	
    .referenzListe
    {
        padding:20px;
        font-size:12px;
    }
    
    .padding20
    {
        padding:20px 20px 20px 50px;
    }
    
    .navbar-toggler
    {
         box-shadow:0 0 30px 1px #fff, 0 0 20px 3px #0099FF, 0 0 17px 5px #0ff;
    }
}

@media (min-width: 768px) {
        .bd-placeholder-img-lg {
          font-size: 3.5rem;
        }
     
  .jumbotron {
    padding-top: 6rem;
    padding-bottom: 6rem;
  }
}

@media (max-width:565px)
{
    .show565
    {
        display:block;
        font-size: 24px;
    }
    
    
    .footerLink
    {
        font-size:12px;
    }
    
    .hide565
    {
        display:none !important;
    }
    
    .footerElements
    {
        padding-bottom:15px;
    }
    
    .rowLaw
    {
        font-size: 11px;
        padding-top: 20px;
    }
    
    
    .amazon img {
            width: 125px;
    position: relative;
    left: 7px;
    top: 5px;
    }
    
    .socials {
    font-size: 18px;
}

.paddingL30
{
    padding-left:34px;    
}

.show565 a {
    margin-right: 3px;
}

    .contentWrapper
    {
       
        margin-top:35px;
    }
    
    main
    {
        top: 290px;
        position:relative;
    }
    
    .myVideo
    {
        width: 100%;
    }

h1
{
    font-size:24px;
}

h2
{
    font-size:21px;
}

.navbar-toggler {
    padding: .15rem .35rem;
}

    .shadowLogo
    {
        height:45px;
    }
}

@media (max-width:400px)
{
    .tilt {width:300px;height:169px;}
	.tilt img {width:300px;height:169px;}
	.tilt video {width:300px;height:169px;}

    .myVideo {
        position: fixed !important;
        top: 0px !important;
        right: 0v;
        bottom: 0 !important;
        min-width: 100% !important;
    }
}
