/* CSS Document */
/* arimo-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Arimo';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/arimo/arimo-v29-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* arimo-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Arimo';
  font-style: italic;
  font-weight: 400;
  src: url('/fonts/arimo/arimo-v29-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* arimo-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Arimo';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/arimo/arimo-v29-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* arimo-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Arimo';
  font-style: normal;
  font-weight: 600;
  src: url('/fonts/arimo/arimo-v29-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* arimo-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Arimo';
  font-style: normal;
  font-weight: 700;
  src: url('/fonts/arimo/arimo-v29-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


html{ 
  max-width: 100%;
 -moz-osx-font-smoothing: grayscale;
 -webkit-font-smoothing: antialiased;
 scroll-padding-top: 125px;}
body {font-family: "Arimo", sans-serif;  
background-color: #181818;
 position: relative;
 overflow-x: hidden;

}



h1, .title {font-size: 90px; text-transform: uppercase; font-weight: 700;font-family: "Arimo" !important}
h2,h3{font-size: 32px; font-family: "Arimo" !important; color: #fff;}
h3 {font-size: 26px; line-height: 52px; letter-spacing: 0.18px; }
p {color: rgb(208, 208, 208); line-height: 30px; font-size: 16px;}
.m-200 {margin-top:-200px;}
.container{position: relative;z-index:10; max-width: 1200px}

.text-grey, .border-grey{color: rgb(136, 136, 136)}
.bg-orange {background-color:  rgba(255, 116, 37)}
.btn-orange {background-color:  rgba(255, 116, 37)}
.btn-orange:hover {background-color:rgba(255, 116, 37)!important; color: white !important; transition-duration: 0.3s;overflow: hidden;transition: .4s;}
.btn-group {position: absolute; bottom:0px;}
.btn-group i {font-size:  24px;}

.nav-link {font-size: 22px;padding-left: 5px;}
footer .nav-link {font-size: 14px;}

#homecarousel .carousel-item {
min-height: 800px;
background: no-repeat center center scroll;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

#homecarousel .carousel-caption {
right: 0;
left: 0;
text-align: start;
top: 10%;

}


.spacer {padding-top:  50px}
.main {margin-top: -100px;}
.main span, .ueber span, .services span, .partner span, .location span {color: #888; letter-spacing: 1.3px; text-transform: uppercase; line-height: 18.6px; font-size: 14px}
.main h2 {font-size: 38px; font-family: "Arimo" !important; color: #fff; line-height: 49px;	}
.main img {opacity: 0.77; display: inline-block; vertical-align: middle; height: auto; max-width: 100%}
.ueber p {line-height: 36px}
.ueber-text {margin-left: -30px; z-index: 20;}
.services h2, .partner h2, .partner-title {font-size: 38px; line-height: 49.4px}
.services-item span {font-size: 24px}
.location-top{margin-top: -250px;}
.location-top h1, .location-top h2, .location-top h3, .location-top p, .location-top span {color: #fff;}
.location-top h1 {font-size: 70px;}
.location-top p {line-height: 22px;}
.location-top lite-youtube {max-width: 1000px!important;margin: 0 auto;}

.ueber-image {
position: relative;
background-image: url(/img/djing.png);
 background-position: center center;
 background-repeat: no-repeat;
 background-size: cover;
min-height: 100%
}
.play-button {left: 50%; width: 135px;max-width: 135px; position:absolute; top:50%}

.loc-image {
position: relative;
background-image: url(/img/alice_rooftop_001.jpg);
 background-position: center center;
 background-repeat: no-repeat;
 background-size: cover;
min-height: 100%
}

.location-text { margin-left: -30px; z-index: 20}
.services-item {
z-index: 20;
transition: all 0.4s;
padding: 0 30px 30px 0;
cursor: default;
}
.services-item.item1:hover {
 /*cursor: not-allowed;*/
 cursor: url("../img/eventkonzept.png"),auto !important;
}
.services-item.item2:hover {
 /*cursor: not-allowed;*/
 cursor: url("../img/eventplanung.png"),auto !important;
}
.services-item.item3:hover {
 /*cursor: not-allowed;*/
 cursor: url("../img/veranstaltungsbewerbung.png"),auto !important;
}
.services-item.item4:hover {
 /*cursor: not-allowed;*/
 cursor: url("../img/vorort.png"),auto !important;
}
.services-item:hover > span {
color:rgba(255, 116, 37); 
border-color:rgba(255, 116, 37);
}
.services-item:hover > hr.border.border-grey{
color:rgba(255, 116, 37); 
border-color:rgba(255, 116, 37) !important;
background-color: orange;
} 
.partner h3.title-link {
background-color: #F3F894;
color: black;
font-size: 42px;
font-weight: 700;
padding: 10px
}

.partner-item.item1, .partner-item.item2,.partner-item.item3 {
position: relative;
background-image: url("../img/360grad.jpg");
 background-position: center center;
 background-repeat: no-repeat;
 background-size: cover;
min-height: 100%;
padding: 190px 0px 172px 0px;
transition: 0.4s;
}

.partner-item.item2 {
background-image: url("../img/fotgrafie.jpg");	
margin-top: 30px;
}
.partner-item.item3 {
background-image: url("../img/videographie.jpg");  
margin-top: 60px;
}

.partner h3{
position: relative;
z-index: 20
}
.hover-img {
background-color: #000;
color: #fff;
display: inline-block;
margin: 8px;
max-width: 320px;
min-width: 240px;
overflow: hidden;
position: relative;
text-align: center;
width: 100%;
}

.hover-img * {
box-sizing: border-box;
transition: all 0.5s ease;
left: 0;
bottom: 0;
/*transform: translateX(-20px) translateY(20px);*/
}

.hover-img::before,
.hover-img::after {
background-color: rgba(0, 0, 0, 0.3);
/*border-top: 32px solid rgba(0, 0, 0, 0.5);
border-bottom: 32px solid rgba(0, 0, 0, 0.5);*/
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
content: '';
transition: all 0.5s ease;
z-index: 1;
opacity: 0;
transform: scaleY(2);
}

.hover-img img {
vertical-align: top;
max-width: 100%;
backface-visibility: hidden;
}

.hover-img figcaption {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
align-items: center;
z-index: 1;
display: flex;
flex-direction: column;
justify-content: center;
line-height: 1.1em;
opacity: 0;
transition-delay: 0.1s;
font-size: 24px;
font-family: sans-serif;
font-weight: 400;
letter-spacing: 1px;
text-transform: uppercase;
}

.hover-img:hover::before,
.hover-img:hover::after {
transform: scale(1);
opacity: 1;
}

.hover-img:hover > img {
opacity: 0.7;
}

.hover-img:hover figcaption {
opacity: 1;
}


.yellow-line {
background: rgb(243,248,148);
background: linear-gradient(180deg, rgba(243,248,148,0) 0%, rgba(243,248,148,0) 33%, rgba(243,248,148,1) 33%, rgba(243,248,148,1) 66%, rgba(243,248,148,0) 66%, rgba(243,248,148,0) 100%);
}


.counter span {font-size: 70px; font-weight: 700; color: transparent;}
.counter h4 {font-size: 30px; font-weight: 700; color: white; vertical-align: top; display: inline-block; line-height: 20px}
.videobox_link{
transition: all 0.4s;
 cursor: pointer;
 fill: white;
}
.videobox_icon {
 display: block;
 position: absolute;
 z-index: 30;
 top: 50%;
 left: 50%;
width: 32px;
 height: 32px;
 transform: translate(-50%, -60%);
 stroke-width: 0.025em;
 transition: none;
 text-align: center;
}
.videobox_content{
   justify-content: center;
 align-items: center;
   display: inline-flex;
 cursor: pointer;
 transition: 0.4s;	  
}
.text-path {
transform: rotate(var(--rotate, 0));
width: 100%;
 font-size: 34px;
 letter-spacing: 0.5px;
margin: 0px 0px 0px 0px;
}
.text-path svg {
     margin: -73px 0px 0px -70px;
   animation-name: svg-rotation;
 animation-iteration-count: infinite;
 animation-timing-function: linear;
   width:100%;
 height: auto;
 overflow: visible;
 word-spacing: 1px;
 transform: scaleX(var(--scale-x, 1)) scaleY(var(--scale-y, 1));
}
.text-path  svg text {
 fill: #FFFFFF;
 transition: var(--transition) stroke, var(--transition) stroke-width, var(--transition) fill
}

.text-path > svg {
 width: 100%;
 height: auto;
 overflow: visible;
 word-spacing: 1px;
 transform: scaleX(var(--scale-x, 1)) scaleY(var(--scale-y, 1));
}
.text-path > svg > path {
fill:transparent;
}

@keyframes svg-rotation {
0% {
 transform: rotate(0deg);
}
100% {
 transform: rotate(359deg);
}
}

.accordion {    
--bs-accordion-color: white;
 --bs-accordion-bg: transparent;
--bs-accordion-border-color:none;
--bs-accordion-active-color: rgba(255, 116, 37);
}
.accordion-body {
line-height: 30px;
font-size: 16px
}
.accordion-button {
color:white;
font-size:22px;
}
.accordion-button:not(.collapsed) {
 color:  rgba(255, 116, 37);
 background-color: transparent;
 
}
.accordion-item {
 
 border: none;
}
.accordion-button:not(.collapsed)::after {
         background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ff7425'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
     }

.accordion-button:focus {
 z-index: 3;
 outline: 0;
 box-shadow:none;
}
.accordion-button::after {
 order: -1;
 margin-left: 0;
 margin-right:0.5em;
 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23ff7425' class='bi bi-plus-circle' viewBox='0 0 16 16'%3E%3Cpath d='M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z'/%3E%3Cpath d='M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z'/%3E%3C/svg%3E");
 background-color: transparent;
}
.s-overlay{width: 100vw;
 height: 10rem;}
.overlay{background: linear-gradient(90deg, #0000 calc(100% - 1px), rgba(38,38,38,0.7) 0);
 background-size: calc((100% - 4*1px)/4 + 1px) 100%;
 position: absolute;
 inset: 0;
 width: 100%;
 height: 100%;
content:'';
}

.heading-title {line-height: 1em; padding-top: 100px }
.heading-logo {margin-right: 50px; padding: 5px 2px;
}


.outline {
color: rgba(0,0,0,0.1);	
-webkit-text-stroke-width: 1px;
 stroke-width: 1px;
 -webkit-text-stroke-color: #FFFFFF;
 stroke: #FFFFFF;}

.ri-toggler {
width:60px;
height: 60px;
text-align: center;
 transition: 0.5s;
 background: rgba(255,255,255, 0.1);
 border-radius: 60px;
 overflow: hidden;
 color: #fff;
font-size: 24px;
}
.ri-toggler:hover {
background: rgba(255, 116, 37)
}
.ri-toggler span:hover {
transform: scale(1.3);
}


.navbar-toggler,
.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
 outline: none;
 border: none;
 box-shadow: none;
}
.btn-outline-orange {border-color:rgba(255, 116, 37)!important; color: rgba(255, 116, 37)!important; text-transform: uppercase; letter-spacing:2px}
.btn-outline-orange:hover {background-color:rgba(255, 116, 37)!important; color: white !important; transition-duration: 0.3s;overflow: hidden;transition: .4s; padding-right: 30px}

.btn-outline-white {border-color:white; color: white; text-transform: uppercase; letter-spacing:2px}
.btn-outline-white:hover {background-color:white; color: rgba(255, 116, 37); transition-duration: 0.3s;overflow: hidden;transition: .4s; padding-right: 30px}


.head-margin {
margin-top: -120px
}





.marquee-container{width: 100%;
height: 12vw;
margin: 1em auto;
overflow: hidden;
position: relative;
box-sizing: border-box;
/*linear-gradient(90deg, rgba(0,0,0,1.0) 0%, rgba(0,0,0,0.01) 50%, rgba(0,0,0,1.00) 100%);*/
-webkit-mask-image:linear-gradient(90deg, rgba(0,0,0,0.1) 0%, rgba(0,0,0,1) 50%, rgba(0,0,0,0.1) 100%);
       mask-image:linear-gradient(90deg, rgba(0,0,0,0.1) 0%, rgba(0,0,0,1) 50%, rgba(0,0,0,0.1) 100%);}


.marquee01, .marquee02 { position: relative;z-index: 20;font-size: 140px; letter-spacing: 1.3px; line-height: 150px; color: rgba(208,208,208,1.00); font-weight: 700; animation: marquee 50s linear infinite;  white-space:nowrap}
.marquee02 {
color: rgba(0,0,0,.1);	
-webkit-text-stroke-width: 2px;
 stroke-width: 2px;
 -webkit-text-stroke-color: rgba(208,208,208,1.00);
 stroke: rgba(208,208,208,1.00);
font-weight: 700;
animation: marquee 40s linear infinite;
}

/* Make it move! */
@keyframes marquee {
0%   { left:   100%; }
100% { left: -200% }
}


.formhead, .formhead2 {
color: white;
display: block;
font-weight: 700;
font-size: 90px;
line-height: 100px;
text-decoration-thickness:4.5px;
text-transform: uppercase
}
.formhead2 {
  color: black;
  position: relative;
  z-index: 12
}
.img-spacer {height: 10vh;width: 100%}
.form-image-container {
align-content: center; align-items: center; padding: 0
}
.form-image {
background-image: url(/img/noiseporn-JNuKyKXLh8U-unsplash-1536x1024.jpg);
 background-position: center center;
 background-repeat: no-repeat;
 background-size: cover;
min-height: 100%
}


footer .form-control:focus {
background-color: black;
 border-color: white;
 outline: 0;
color: white;
box-shadow: none;
}
.contact .form-control:focus {
 outline: 0;
box-shadow: none;
}

footer input[type='text'], .contact input[type='text'] {
 display: block;
 height: 56px;
 max-width: 100%;
/* margin: 0 0 21px 0;
padding: 0;*/
 border: 1px solid rgba(136, 136, 136);
 border-width: 0 0 1px 0;
 border-radius: unset;
 font-family:"Arimo", sans-serif;
 font-size: 18px;
 line-height: 1.7;
 font-weight: 500;
 text-transform: unset;
 color: #fff;
 background-color: transparent;
 transition: all 0.3s, height 0s;
}

.contact input[type='text'] {
  border: 1px solid black;
border-width: 0 0 1px 0;
}
footer input[type="text"]::-webkit-input-placeholder {
color: white;
}
.contact input[type='text']::-webkit-input-placeholder {
color: black;
}
footer input[type='text'] {
color: white;
border-color: white;
}
.contact input[type='text'] {
color:black;
}
footer input[type='text']:active{
color: white;
border-color: white;
}
.contact input[type='text']:active{
color: black;
border-color: white;
}
.input-group-text {
display: inline-block;
 vertical-align: top;
background-color: #02010100;
 font-size: 20px;
 line-height: 55px;
 min-width: 16%;
 height: auto;
color: white;
 padding: 0px 0px 0px 36px;
 border-style: solid;
 border-width: 0px 0px 1px 0px;
 border-color:rgba(136, 136, 136);
}
.input-group-text:hover {color:rgba(255, 116, 37)}

.contact .form-label {
padding: 10px 0 0 10px;
}
.contact select {
border-style: solid;	
outline: none;
display: block;
 height: 56px;
 max-width: 100%;
 margin: 0 0 21px 0;  
border: 1px solid black;
 border-width: 0px 0px 1px 0px;
 font-size: 18px;
 line-height: 1.7;
 font-weight: 500;
 text-transform: unset;
 color: black;
 background-color: transparent;
 transition: all 0.3s, height 0s;	
}
.contact select option {
margin: 40px;
background: rgba(0, 0, 0, 1);
color: #fff;  
line-height: 30px
}

.contact .form-select:focus{
border-color: black;
outline: 0;
box-shadow: none;	
}
.contact textarea {
 display: block;
 height: 56px;
 max-width: 100%;
 margin: 0 0 21px 0;
 border: 1px solid #000;
 border-width: 0 0 1px 0;
 border-radius: unset;
 font-size: 18px;
 line-height: 1.7;
 font-weight: 500;
 text-transform: unset;
 color: black;
 background-color: transparent;
 transition: all 0.3s, height 0s;
}
.contact textarea:active, .contact textarea:focus {
 border-color: black;
background-color: rgba(255, 116, 37);
}

.socials li a {color: white; font-size: 18px}
.socials li a:hover {color:rgba(255, 116, 37)}


footer {position:relative; z-index:  20}

footer a, footer p, footer span, footer .nav-link {color: rgb(136, 136, 136)}
footer .nav-link:hover {color:rgba(255, 116, 37)}
footer h3 {color: #fff}
footer address {color: #fff;     line-height: 2.4; font-size: 18px;    margin-bottom: 7px;}
footer address a {color: #fff; text-decoration: none}
footer address a:hover {color:rgba(255, 116, 37)}





#scroll_up.scroll_up-icon {
 width: 60px;
 height: 60px;
 font-size: 24px;
 border-radius: 50%;
 color: #fff;
 transform: translate(-50px, 5px);
}

#scroll_up {
 position: fixed;
 right: 0;
 bottom: 0;
 z-index: 20;
 text-align: center;
 cursor: pointer;
 opacity: 0;
 transition: 0.4s;
 display: flex;
 justify-content: center;
 align-items: center;
 font-size: 16px;
 font-weight: 400;
 line-height: 1;
 top: 100%;
 min-height: -moz-fit-content;
 min-height: fit-content;
 transform: translate(-30px, 5px);
 white-space: nowrap;
 padding: 0;
 color: #fff;
}

#scroll_up.active {
 opacity: 1;
}
#scroll_up.active.scroll_up-icon {
 transform: translate(-50px, -142px);
}
#scroll_up.scroll_up-icon:before {
 content: '';
 width: 100%;
 height: 100%;
 position: absolute;
 z-index: -1;
 left: 0;
 top: 0;
 transition: 0.4s;

 background: #2e2e2e;
 border-radius: inherit;
}
#scroll_up.scroll_up-icon:hover svg {
 stroke:#fff;
 fill: #fff;
}


.law-text {font-size: 14px; color: white !important;}
.law-text p {line-height: 1.35; color: white !important;}
.law-text h1 {font-size: 1.8rem ;}
.law-text h2 {font-size: 1.5rem ;}
.law-text h3 {font-size: 1.3rem ;}
.law-text h4 {font-size: 1.1rem ;}
.law-text li {font-size: 16px; font-weight: normal;}
.law-text li ul li { list-style-type: disc;}

@media (min-width: 1921px) {
 .wrapper {
     width: 1920px;
 }
}
@media (max-width: 767px) {
  .img-spacer {height: 50vh;width: 100%}
  #homecarousel .carousel-item {
    height: 70vh;
    min-height: 200px;
  }
  .heading-title {font-size: 36px; padding: 60px 0 20px 0; line-height: 1.4em}
  .heading-title span {font-size: 54px}
  .heading-text {padding: 0px 0 30px 0;font-size: 28px !important; line-height: 30px;}
  .heading-logo {width: 50px;margin-right: 10px;padding-top: 0 !important}  
  .accordion-button {padding: 5px;}
  .main img {max-width: 95%;}
  .title {font-size: 60px;}
  #scroll_up {right: -20px;}
  .ueber-image{min-height: 300px;}
  .ueber-text {margin-left: 0;}
  .form-image-container {padding: 10px;}
  .play-button {left: 45%}
  .videobox_icon{left: 46%;}
  .services h2 {font-size: 30px; padding-bottom: 10px;}
  .services-item{padding: 10px }
  .services-item p, .location-text p {font-size: 18px;}
  .partner h3 {font-size: 30px;}
  .counter span {font-size: 50px;}
  .counter h4 {display: block; padding: 20px;}
  .location-text { margin-left:0; }
  .marquee-container{height: 24vw; margin:  1px auto;}
  .marquee01,.marquee02{line-height: 80px; font-size: 90px;}
  .formhead,.formhead2 {font-size: 33px;}
  .btn-group {position: absolute; bottom:0px; padding-left: 50px; }
  .btn-group i {font-size:  28px;}
  .m-200 {margin-top:-120px;}
}
.location div.card {border-color: #444;}