:root {
    --timing: 0.5s;
    --delay: 0.6s;
    /* --delay: 0s; */
    --duration: 0s;
    --ticker_duration:30s;
    --bottom_distance:0px;
}
/* body.home .home-link{
    display:none;
} */
body.home .cky-consent-container{
    display:none;
}
.text-logo .animated-text span.dashicons{
    font-size:30px;
    width:auto;
    height:auto;
    position: relative;
    top:11px;
    padding:0 5px;

}
.text-logo .animated-text span.dashicons:last-child{
    padding-right:0px;
}
.text-logo .slogan span.dashicons{
    font-size:50px;
    /* content:'';
    display:inline-block;
    background-image:url('/wp-content/themes/shift_online/images/adelle-pfeil.svg');
    background-repeat:no-repeat;
    background-size:contain;
    width:40px;
    height:40px; */
    width:auto;
    height:auto;
    position: relative;
    vertical-align: middle;
    top:-10px
}
.slogan1 span.dashicons{
    color:#01A0C6;
}
.slogan2 span.dashicons{
    /* background-image:url('/wp-content/themes/shift_online/images/adelle-pfeil_dark.svg'); */
    color:#2E3092;
}
#page-wrapper .splash-screen .full-container {
    padding-left: 35px;
    padding-right: 35px;
}
body.home #page-wrapper > *:not(.splash-screen){
    display:none;
}
body.home a.home-link{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    z-index: 999;
}
body.home:not(.scrollable){
    overflow:hidden;
}
body.admin-bar .splash-screen{
    top:32px;
}
body.admin-bar .splash-screen .animation-wrapper,
body.admin-bar .splash-screen{
    height:calc(100vh - 32px);
}
.splash-screen{
    position:fixed;
    display:block;
    top:0px;
    left:0px;
    height:100vh;
    width:100%;
    background-color:#fff;
    z-index:9999;
    /* overflow-y:auto; */
    /* padding: 0 35px; */
    box-sizing:border-box;
    opacity:1;
    transition:opacity 0.4s ease-in-out;
}
.splash-screen.hide{
    opacity:0;
    pointer-events:none;
}
.splash-screen .text-logo{
    padding-bottom: 240px;
    position: relative;
    width: 100%;
}
.splash-screen .animation-logo{
    position: absolute;
    width: 100%;
    left: 0px;
    bottom: 0px;
}
.splash-screen .direction-links a{
    text-decoration:none;
}
.splash-screen .direction-links a:not(:last-child){
    margin-right:10px;
}
.splash-screen  .about-text p:last-child{
    margin-bottom:0px;
}
.splash-screen .home-link{
    margin-bottom:30px;
}
.splash-screen .about-text{
    margin-top:30px;
}
.skip-link{
    text-align:right;
}
.splash-screen video{
    width:100%;
}
.skip-link a{
    color: #272526!important;
    display:flex;
    align-items:center;
    justify-content: flex-end;
    cursor:pointer;
    text-decoration:none!important;
}
.splash-screen .unmute{
    text-align:center;
    display:none;
}
.splash-screen span.label{
    display:inline-block;
    color:#fff;
    font-size:18px;
    margin-right:8px;
}
.skip-link a .dashicons{
    font-size:16px;
    position:relative;
    top:2px;
    margin-left:7px;
}
.splash-video{
    position:relative;
}
.splash-video{
    margin-bottom:15px;
}
.splash-video .mejs-controls{
    opacity:0!important;
    pointer-events:none!important;
}
.splash-video .unmute-wrapper{
    display:flex;
    align-items: center;
}
.splash-video .unmute .dashicons{
    font-size:20px;
    width:20px;
    height:20px;
}
.splash-video .wp-video{
    width:100%;
    padding-bottom:56.25%;
    background-color:#bfbfbf;
    position:relative;
}
.splash-video .wp-video video,
.splash-video .wp-video .wp-video-shortcode,
.splash-video.active .unmute{
    position:absolute;
    top:0px;
    left:0px;
    width:100%!important;
    height:100%!important;
}
.splash-video .wp-video video,
.splash-video .wp-video .wp-video-shortcode,
.splash-video .unmute,.splash-video .unmute-wrapper{
    transition:opacity 0.4s ease-in-out;
    opacity:0;
}
.splash-video.active .wp-video video,
.splash-video.active .wp-video .wp-video-shortcode,
.splash-video.active .unmute{
    opacity:1;
}
.splash-video .unmute-wrapper{
    position:absolute;
    color:#fff;
    bottom:10px;
    right:18px;
    opacity:0.5;
}
.splash-video .unmute{    
    cursor:pointer;
}
.splash-video .unmute:hover .unmute-wrapper{    
    opacity:1;
}
.video-skip-link{    
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    display: block;
}
.splash-screen .splash-video .wp-video{
    background-color:#ccc;  
}
@keyframes hide {
    0%   {opacity: 1;}
    90%  {opacity: 1;}
    100% {opacity: 0;}
}
@-webkit-keyframes hide {
    0%   {opacity: 1;}
    90%  {opacity: 1;}
    100% {opacity: 0;}
}
@keyframes show {
    0%   {opacity: 0;}
    90%  {opacity: 0;}
    100% {opacity: 1;}
}
@-webkit-keyframes show {
    0%   {opacity: 0;}
    90%  {opacity: 0;}
    100% {opacity: 1;}
}
@keyframes scale_width {
    0%   {width: 0%;}
    100% {width: 100%;}
}
@-webkit-keyframes scale_width {
    0%   {width: 0%;}
    100% {width: 100%;}
}
@keyframes fade_in {
    0%   {opacity: 0;}
    100% {opacity: 1;}
}
@keyframes fade_out {
    0%   {opacity: 1;}
    100% {opacity: 0;}
}
.splash-screen  .animation-wrapper{
    width:100%;
    height:100vh;
    /* text-align:center; */
    position:relative;
    display:flex;
    justify-content:center;
    align-items: center;
}
.splash-screen img{
    position:absolute;
    width:650px;
    height:auto;
    bottom:calc(var(--bottom_distance) + 65px);
    left:50%;
    transform:translateX(-50%);
    opacity:0;
    display:block!important;
    z-index:1;
}
.splash-screen  .hand8,
.splash-screen .hand6{
    z-index:2;
}
.splash-screen  .hand1{
    animation: show var(--duration) ease-in var(--timing) forwards, hide var(--duration) ease-in calc(var(--timing) + var(--delay) * 3) forwards;
}
.splash-screen  .hand2{
    animation: show var(--duration) ease-in var(--timing) forwards, hide var(--duration) ease-in calc(var(--timing) + var(--delay)) forwards;
}
.splash-screen  .hand3{
    animation: show var(--duration) ease-in calc(var(--timing) + var(--delay)) forwards, hide var(--duration) ease-in calc(var(--timing) + var(--delay) * 2) forwards;
}
.splash-screen  .hand4{
    animation: show var(--duration) ease-in calc(var(--timing) + var(--delay) * 2) forwards, hide var(--duration) ease-in calc(var(--timing) + var(--delay) * 3) forwards;
}
.splash-screen  .hand5{
    animation: show var(--duration) ease-in calc(var(--timing) + var(--delay) * 3) forwards;
}
.splash-screen  .hand6{
    animation: show var(--duration) ease-in calc(var(--timing) + var(--delay) * 4) forwards;
}
.splash-screen  .hand7{
    animation: show var(--duration) ease-in calc(var(--timing) + var(--delay) * 5) forwards;
}
.splash-screen  .hand8{
    animation: show var(--duration) ease-in calc(var(--timing) + var(--delay) * 6) forwards;
}
.splash-screen  .hand9{
    animation: show var(--duration) ease-in calc(var(--timing) + var(--delay) * 7) forwards;
}
.splash-screen  .logo-text1,
.splash-screen  .logo-text2{
    width:250px;
    bottom:var(--bottom_distance);
}
.animated-text{
    position:absolute;
    background-color:#231F20;
    bottom: var(--bottom_distance);
    width: 0px;
    height: 65px;
    left:50%;
    transform:translateX(-50%);
    /* opacity:0; */
    z-index:2;
    display:block!important;
}
.splash-screen  .logo-text1{
    /* animation: show var(--duration) ease-in calc(var(--timing) + var(--delay) * 8) forwards; */
    animation: show var(--duration) ease-in calc(var(--timing) + var(--delay) * 8) forwards, fade_out var(--delay) ease-in calc(var(--timing) + var(--delay) * 9) forwards;
}
.splash-screen  .logo-text2{
    animation: show var(--duration) ease-in calc(var(--timing) + var(--delay) * 8) forwards;
}
.animated-text{
    animation: scale_width var(--delay) ease-in calc(var(--timing) + var(--delay) * 10) forwards;
    overflow: hidden;
}
.ticker-wrap{
    animation: fade_in var(--delay) ease-in calc(var(--timing) + var(--delay) * 12) forwards;
}
/* .animated-text-1{
    padding-top:var(--bottom_distance);
} */
.animated-text-1 > div{
    z-index:2;
    opacity:0;
    display:inline!important;
    align-items: center;
    font-size:80px;
    line-height:1.2;
}
/* .animated-text-1 .slogan span{
    padding:0 7px;
} */
.textlogo{
    color:#007733;
    animation: fade_in var(--delay) ease-in calc(var(--timing) + var(--delay) * 12) forwards;
}
.slogan1{
    color:#01A0C6;
    animation: fade_in var(--delay) ease-in calc(var(--timing) + var(--delay) * 13) forwards;
}
.slogan2{
    color:#2E3092;
    animation: fade_in var(--delay) ease-in calc(var(--timing) + var(--delay) * 14) forwards;
}
.animated-text-1 .map-consent{
    color:#231F20;
    font-size:19px;
    display:block!important;
    margin-top:30px;
    line-height:1.5;
    z-index:9;
    position:relative;
    animation: fade_in var(--delay) ease-in calc(var(--timing) + var(--delay) * 15) forwards;
}
.map-consent a {
    color:#EC008C!important;
    text-decoration:none;
    transition:opacity 0.4s ease-in-out;
}
.animated-text-1 .map-consent .accept{
    animation: fadeInUp var(--delay) ease-in calc(var(--timing) + var(--delay) * 16) forwards;
}
.map-consent .accept{
    display:block;
    text-align: center;
    cursor:pointer;
}
.map-consent a:hover {
    opacity:0.8;
}
.ticker-wrap {  
  position: absolute;
  top: 50%;
  transform:translateY(-50%);
  width: 100%;
  overflow: hidden;
  /* height: 4rem; */
  opacity:0;
  box-sizing: content-box;
  display:block!important;
  white-space: nowrap;
}
.eocjs-newsticker-container{
    margin:0 10px;
    box-sizing:border-box;
}
.ticker__item {
    display: inline-block;
    font-size: 37px;
    color: white;   
  }

@media screen and (max-width: 1024px) {     
    span.pfeil:before{
        width:4%;
        height: 4vw;
        position: relative;
        top: 4px;
    }
    .animated-text-1 > div{
        font-size:8vw
    }
    
    .text-logo .slogan span.dashicons{
        font-size:5vw;
        top:0px
    }
}
@media screen and (max-width: 680px) {  
    .ticker__item {
        font-size:25px;
    }
    .text-logo .animated-text span.dashicons{
        font-size:20px;
        top:17px;
    }
    .splash-screen .logo-text1, .splash-screen .logo-text2,
    .animated-text{
        bottom:calc(var(--bottom_distance) + 20px);
    }
    .splash-screen .logo-text1, .splash-screen .logo-text2{
        width:auto;
        height:45px;
    }
    .animated-text{
        height:45px;
    }
}
@media screen and (max-width: 460px) {  
    .splash-screen .text-logo {
        padding-bottom: 175px;
    }
    .splash-screen img{
        width:100%;
    } 
    .ticker__item {
        font-size:20px;
    }
    .text-logo .animated-text span.dashicons{
        font-size:20px;
        top:17px;
    }
    .splash-screen .logo-text1, .splash-screen .logo-text2,
    .animated-text{
        bottom:calc(var(--bottom_distance) + 25px);
    }
    .splash-screen .logo-text1, .splash-screen .logo-text2{
        width:auto;
        height:37px;
    }
    .animated-text{
        height:37px;
    } 

}

@media screen and (orientation: landscape) and (max-height: 450px){
    .animated-text-1 > div{
        font-size:4vw
    }   
    
    
    .text-logo .slogan span.dashicons{
        font-size:3vw;
    }
    .text-logo .animated-text span.dashicons{
        font-size:20px;
        top:17px;
    }
    .splash-screen img{
        width:50%;
    } 
    .ticker__item {
        font-size:20px;
    }
    .text-logo .animated-text span.dashicons{
        font-size:20px;
        top:17px;
    }
    .splash-screen .logo-text1, .splash-screen .logo-text2,
    .animated-text{
        bottom:calc(var(--bottom_distance) + 25px);
    }
    .splash-screen .logo-text1, .splash-screen .logo-text2{
        width:auto;
        height:37px;
    }
    .animated-text{
        height:37px;
    } 
    .splash-screen .text-logo {
        padding-bottom: 165px;
    }
}
/* @media screen and (max-height: 580px) and (min-width: 901px){
    :root {
        --bottom_distance:50px;
    }
    
    .animated-text-1 > div{
        font-size:3vw
    } 
    .splash-screen img{
        width:25%;
    } 
    .splash-screen .logo-text1, .splash-screen .logo-text2,
    .animated-text{
        bottom:calc(var(--bottom_distance) + 20px);
    }
    .splash-screen .logo-text1, .splash-screen .logo-text2{
        width:auto;
        height:37px;
    }
    .animated-text{
        height:37px;
    }
    .ticker__item {
        font-size:25px;
    }

} */

/* @media screen and (max-height: 750px) and (max-width: 900px){
    :root {
        --bottom_distance:100px;
    }
    .splash-screen .full-container {
        padding-bottom: 150px;
    }
    .animated-text-1 > div{
        font-size:6vw
    }  
    .splash-screen .logo-text1, .splash-screen .logo-text2{
        width:auto;
        height:37px;
    }
    .animated-text{
        height:37px;
    } 
   .splash-screen .logo-text1, .splash-screen .logo-text2,
    .animated-text{
        bottom:calc(var(--bottom_distance) + 20px);
    }  
    span.pfeil:before{
        width:2%;
        height: 2vw;
        position: relative;
        top: 0px;
    }
    .splash-screen img{
        width:50%;
    } 
    .ticker__item {
        font-size:25px;
    }  
}
@media screen and (max-height: 600px) and (max-width: 900px){
    :root {
        --bottom_distance:50px;
    }
    
    
    .animated-text-1 > div{
        font-size:30px;
    } 
    .splash-screen .logo-text1, .splash-screen .logo-text2{
        width:auto;
        height:37px;
    }
    .animated-text{
        height:37px;
    } 
   .splash-screen .logo-text1, .splash-screen .logo-text2,
    .animated-text{
        bottom:calc(var(--bottom_distance) + 20px);
    }
}
@media screen and (max-height: 400px) and (max-width: 900px){
    :root {
        --bottom_distance:40px;
    }
    
    
    .ticker__item {
        font-size:20px;
    }  
} */