/* marquee */
.marquee2,
.marquee {
    padding:0.5em 0;
    overflow:hidden;
    margin-bottom:10px;
    position:relative;
  }
  /* .marquee p:hover {
  -moz-animation-play-state: paused;
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
  } */
  .marquee2 p:after,
  .marquee p:after {
    content:"";
    white-space:nowrap;
    padding-right:50px;
  }
  
  .marquee p {
    margin:0;
    padding-left:100%;
    display:inline-block;
    white-space:nowrap;
      -webkit-animation-name:marquee;
      -webkit-animation-timing-function:linear;
      -webkit-animation-duration:25s;
      -webkit-animation-iteration-count:infinite;
      -moz-animation-name:marquee;
      -moz-animation-timing-function:linear;
      -moz-animation-duration:25s;
      -moz-animation-iteration-count:infinite;
      -ms-animation-name:marquee;
      -ms-animation-timing-function:linear;
      -ms-animation-duration:25s;
      -ms-animation-iteration-count:infinite;
      -o-animation-name:marquee;
      -o-animation-timing-function:linear;
      -o-animation-duration:25s;
      -o-animation-iteration-count:infinite;
      animation-name:marquee;
      animation-timing-function:linear;
      animation-duration:25s;
      animation-iteration-count:infinite;
  }
  .marquee2 p {
    margin:0;
    padding-left:100%;
    display:inline-block;
    white-space:nowrap;
      -webkit-animation-name:marquee2;
      -webkit-animation-timing-function:linear;
      -webkit-animation-duration:30s;
      -webkit-animation-iteration-count:infinite;
      -moz-animation-name:marquee2;
      -moz-animation-timing-function:linear;
      -moz-animation-duration:30s;
      -moz-animation-iteration-count:infinite;
      -ms-animation-name:marquee2;
      -ms-animation-timing-function:linear;
      -ms-animation-duration:30s;
      -ms-animation-iteration-count:infinite;
      -o-animation-name:marquee2;
      -o-animation-timing-function:linear;
      -o-animation-duration:30s;
      -o-animation-iteration-count:infinite;
      animation-name:marquee2;
      animation-timing-function:linear;
      animation-duration:30s;
      animation-iteration-count:infinite;
  }
  @-webkit-keyframes marquee {
    from   { -webkit-transform: translate(-50%);}
    99%,to { -webkit-transform: translate(-70%);}
  }
  @-moz-keyframes marquee {
    from   { -moz-transform: translate(-50%);}
    99%,to { -moz-transform: translate(-70%);}
  }
  @-ms-keyframes marquee {
    from   { -ms-transform: translate(-50%);}
    99%,to { -ms-transform: translate(-70%);}
  }
  @-o-keyframes marquee {
    from   { -o-transform: translate(-50%);}
    99%,to { -o-transform: translate(-70%);}
  }
  @keyframes marquee {
    from   { transform: translate(-50%);}
    99%,to { transform: translate(-70%);}
  }
  
  

  
  @-webkit-keyframes marquee2 {
    from   { -webkit-transform: translateX(-90%);}
    99%,to { -webkit-transform: translateX(-70%);}
  }
  @-moz-keyframes marquee2 {
    from   { -moz-transform: translateX(-90%);}
    99%,to { -moz-transform: translateX(-70%);}
  }
  @-ms-keyframes marquee2 {
    from   { -ms-transform: translateX(-90%);}
    99%,to { -ms-transform: translateX(-70%);}
  }
  @-o-keyframes marquee2 {
    from   { -o-transform: translateX(-90%);}
    99%,to { -o-transform: translateX(-70%);}
  }
  @-webkit-keyframes marquee2 {
    from   { -webkit-transform: translateX(-90%);}
    99%,to { -webkit-transform: translateX(-70%);}
  }
  @keyframes marquee2 {
    from   { transform: translateX(-90%);}
    99%,to { transform: translateX(-70%);}
  }



/* txtmove */
.txtmove {
    position: relative;
    overflow: hidden;
    display: inline-block;
    line-height: 1.2em;
}
.txtmove .target {
    opacity: 0;
}
.txtmove.appear-animation-visible .target {
    animation: txt_opa both cubic-bezier(0.680, 0, 0.265, 1) 1.4s 0s;
}
.txtmove .move_left {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background:#000;
}
.txtmove.appear-animation-visible .move_left {
    animation: move_left both cubic-bezier(0.680, 0, 0.265, 1) 1.4s 0s;
}
.realtxt {
    display: inline-block;
    position: relative;
    z-index: 3;
    padding: 0 8px;
    margin: 0 -8px;
}
.txtmove .lined {
    display: block;
    position: absolute;
    left: 0;
    top: 40%;
    width: 0%;
    height: 50%;
    background:#ebbc87;
}
.txtmove.appear-animation-visible .lined {
    animation: move_show both cubic-bezier(0.680, 0, 0.265, 1) 1.4s 0.7s;
}

@keyframes move_show {
    0% {width: 0;}
    100% {width: 100%;}
}
@keyframes move_left {
    0% {transform:translateX(-101%);}
    50% {transform:translateX(0);}
    100% {transform:translateX(101%);}
}
@keyframes txt_opa {
    51% {opacity:0;}
    100% {opacity:1;}
}