


.animetion {
    fill: none;
    stroke-dasharray: 1500;
    stroke-dashoffset: 1500;
    animation: DASH 2s ease-in 1s forwards;
    -webkit-animation: DASH 2s ease-in 1s forwards;
}

@keyframes DASH {
    0% {
        stroke-dashoffset: 1500;
        fill: rgba(255, 255, 255, 0);
    }
       100% {
        stroke-dashoffset: 0;
        fill: rgba(255, 255, 255, 1);
    }
}

@-webkit-keyframes DASH {
    0% {
        stroke-dashoffset: 1500;
        fill: rgba(255, 255, 255, 0);
    }
    
    100% {
        stroke-dashoffset: 0;
        fill: rgba(255, 255, 255, 1);
    }
}




span{
-webkit-animation: example 0.8s ease 4s 1 forwards;
  animation: example 0.8s ease 4s 1 forwards;
}

@-webkit-keyframes example {
  100% {
    opacity: 1;
  }
}
@keyframes example {
  100% {
    opacity: 1;
  }
}







.skew {
transform: skewY(-45deg);
transform-origin: top right;
position:absolute;
top: 0;
width: 100%;
}
.skew_mask {
overflow: hidden;
background: url(../img/sample_border.gif);
height: 249px;
animation: moveBg 10s infinite linear;
opacity: 0.5;
}
.skew2 {
transform: skewY(-45deg);
transform-origin: top right;
position:absolute;
top: -250px;
width: 100%;
}
.skew_mask2 {
overflow: hidden;
background: url(../img/sample_border02.gif);
height: 250px;
animation: moveBg02 10s infinite linear;
opacity: 0.5;
}
.skew3 {
transform: skewY(-45deg);
transform-origin: top right;
position:absolute;
top: -500px;
width: 100%;
}
.skew_mask3 {
overflow: hidden;
background: url(../img/sample_border03.gif);
height: 250px;
animation: moveBg03 10s infinite linear;
opacity: 0.5;
}
.skew4 {
transform: skewY(-45deg);
transform-origin: top right;
position:absolute;
top: -750px;
width: 100%;
}
.skew_mask4 {
overflow: hidden;
background: url(../img/sample_border04.gif);
height: 250px;
animation: moveBg04 15s infinite linear;
opacity: 0.5;
}
.skew5 {
transform: skewY(-45deg);
transform-origin: top right;
position:absolute;
top: -1000px;
width: 100%;
}
.skew_mask5 {
overflow: hidden;
background: url(../img/sample_border05.gif);
height: 250px;
animation: moveBg05 30s infinite linear;
opacity: 0.5;
}
.skew6 {
transform: skewY(-45deg);
transform-origin: top right;
position:absolute;
top: -1250px;
width: 100%;
}
.skew_mask6 {
overflow: hidden;
background: url(../img/sample_border06.gif);
height: 250px;
animation: moveBg06 10s infinite linear;
opacity: 0.5;
}
.skew7 {
transform: skewY(-45deg);
transform-origin: top right;
position:absolute;
top: 249px;
width: 100%;
}
.skew_mask7 {
overflow: hidden;
background: url(../img/sample_border07.gif);
height: 250px;
animation: moveBg07 10s infinite linear;
opacity: 0.5;
}
.skew8 {
transform: skewY(-45deg);
transform-origin: top right;
position:absolute;
top: 498px;
width: 100%;
}
.skew_mask8 {
overflow: hidden;
background: url(../img/sample_border08.gif);
height: 250px;
animation: moveBg08 10s infinite linear;
opacity: 0.5;
}
.skew9 {
transform: skewY(-45deg);
transform-origin: top right;
position:absolute;
top: -1500px;
width: 100%;
}
.skew_mask9 {
overflow: hidden;
background: url(../img/sample_border08.gif);
height: 250px;
animation: moveBg09 10s infinite linear;
opacity: 0.5;
}

@keyframes moveBg{
    0%    { background-position: 0 0; }
    100%  { background-position: -256px 256px; }
}

@keyframes moveBg02{
    0%    { background-position: 0 0; }
    100%  { background-position: 173px -173px; }
}

@keyframes moveBg03{
    0%    { background-position: 0 0; }
    100%  { background-position: -245px 245px; }
}
@keyframes moveBg04{
    0%    { background-position: 0 0; }
    100%  { background-position: 270px -270px; }
}
@keyframes moveBg05{
    0%    { background-position: 0 0; }
    100%  { background-position: -600px 600px; }
}
@keyframes moveBg06{
    0%    { background-position: 0 0; }
    100%  { background-position: 228px -228px; }
}
@keyframes moveBg07{
    0%    { background-position: 0 0; }
    100%  { background-position: 211px -211px; }
}
@keyframes moveBg08{
    0%    { background-position: 0 0; }
    100%  { background-position: -205px 205px; }
}
@keyframes moveBg09{
    0%    { background-position: 0 0; }
    100%  { background-position: -205px 205px; }
}