.cxc26--hero-wrapper{
  position:relative; 
  overflow:hidden;
  padding:160px 30px 100px;
}

.cxc26--hero-wrapper h1{
  margin:0;
  padding:0;
}

.cxc26--hero-video{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%:
}

.cxc26--hero-video-overlay{
  background:#000b;
  background: #000;
background: linear-gradient(0deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 0.0) 100%);
  position:absolute;
  top:0;
  bottom:0;
  right:0;
  left:0;
}

.cxc26--hero-video-button{
  position:absolute;
  bottom:20px;
  right:20px;
}

.cxc26--hero-video-button button{
  border:1px solid #fff;
  background:transparent;
  height:30px;
  width:30px;
  text-align:center;
  cursor:pointer;
  line-height:26px;
  color:#fff;
  border-radius:50%; 
  font-size:16px;
}

.cxc26--hero-content{
  position:relative;
  color:#fff;
}

.cxc26--hero-content svg{
  display:block;
 margin:0 auto 40px; 
  width:600px;
  max-width:100%;
  height:auto;
}

.cxc26--hero-details{
  position:absolute;
  bottom:30px;
  color:#fff;
  width:700px;
  max-width:100%;
  left:50%;
  margin-left:-350px;
  text-align:center;
}

.cxc26--hero-details span{
  font-size:160%; 
}

.cxc26--hero-wrapper svg > *{
  opacity:0;
  transition:all 200ms ease;
}

.cxc26--hero-wrapper svg #svg-shape{ transition:all 300ms ease 100ms;  }
.cxc26--hero-wrapper svg #svg-shape2{ transform:translateY(-100px); transition:all 300ms ease 900ms; }
.cxc26--hero-wrapper svg #svg-c{ transition:all 300ms ease 150ms; }
.cxc26--hero-wrapper svg #svg-x{ transition:all 300ms ease 150ms; }
.cxc26--hero-wrapper svg #svg-dot{ transition:all 300ms ease 250ms; }
.cxc26--hero-wrapper svg #svg-c2{ transition:all 300ms ease 300ms; }
.cxc26--hero-wrapper svg #svg-i{ transition:all 300ms ease 350ms; }
.cxc26--hero-wrapper svg #svg-idot{ transition:all 300ms ease 350ms; }
.cxc26--hero-wrapper svg #svg-r{ transition:all 300ms ease 400ms; }
.cxc26--hero-wrapper svg #svg-c3{ transition:all 300ms ease 500ms; }
.cxc26--hero-wrapper svg #svg-l{ transition:all 300ms ease 600ms; }
.cxc26--hero-wrapper svg #svg-e{ transition:all 300ms ease 700ms; }
.cxc26--hero-wrapper svg #svg-2026{ transition:all 500ms ease 800ms; }
.cxc26--hero-wrapper svg #svg-emea{ transform:translateY(50px); transition:all 500ms ease 900ms; }

.domloaded .cxc26--hero-wrapper svg > *{
  opacity:1!important;
  transform:translateY(0)!important;
}

.cxc26--hero-ctas{
 position: relative;
    text-align: center; 
}

@media (max-width:767px){
  .cxc26--hero-wrapper {
    padding: 70px 30px 0px;
    background:#7c0133;
        display: flex;
    flex-direction: column;
}
  .cxc26--hero-details{
     position: relative;
    margin: 40px 0 0;
    left: 0;
}

  .cxc26--hero-content svg{
 margin:20px auto 40px; 
}
  .cxc26--hero-video{
   position: relative;
    top: auto;
    left: auto; 
    margin:0 -30px;
    width:calc(100% + 60px);
    order:4
  }
  .cxc26--hero-video-overlay,
  .cxc26--hero-video-button{
    display:none; 
  }
  #svg-shape{
    fill:#440220 
  }
  .cxc26--hero-details span {
    font-size: 120%;
    margin: 20px 0 0;
    display: block;
}
}