*{margin:0;padding:0;}
body,html{
    height:100%;
    width:100%;
    overflow: hidden;
}
.floatleftandright_body{
    height:70%;
    margin: 0px auto;
    position:relative;
    top: 19%;
}
.floatleftandright{
    position: absolute;
    background-color: rgba(46,166,249,0.1);
    color: #fff;
    text-align: center;
    transform: skew(5deg);
    -webkit-transform: skew(5deg);
}
.floatleftandright>span{
    display: inline-block;
    transform: skew(-5deg);
    -webkit-transform: skew(-5deg);
}
.floatleftandright_1{
    width: 100px;
    height: 40px;
    line-height: 40px;
    top:20%;
    left:25%;
    animation: floatleftandright_ani1 3s linear 0s infinite;
    -webkit-animation: floatleftandright_ani1 3s linear 0s infinite;
    -moz-animation:floatleftandright_ani1 3s linear 0s infinite;
}
.floatleftandright_2{
    width: 100px;
    height: 40px;
    line-height: 40px;
    top:20%;
    left:70%;
    animation:floatleftandright_ani2 3s linear 0s infinite;
    -webkit-animation: floatleftandright_ani2 3s linear 0s infinite;
    -moz-animation: floatleftandright_ani2 3s linear 0s infinite;
}
.floatleftandright_3{
    width: 150px;
    height: 50px;
    line-height: 50px;
    top:33%;
    left:20%;
    animation:floatleftandright_ani3 3s linear 0s infinite;
    -webkit-animation: floatleftandright_ani3 3s linear 0s infinite;
    -moz-animation: floatleftandright_ani3 3s linear 0s infinite;
    transform: rotate(-3deg);
    -webkit-transform: rotate(-3deg);
    font-size: 20px;
}
.floatleftandright_4{
    width: 150px;
    height: 40px;
    line-height: 40px;
    top:33%;
    left:70%;
    animation:floatleftandright_ani4 3s linear 0s infinite;
    -webkit-animation: floatleftandright_ani4 3s linear 0s infinite;
    -moz-animation: floatleftandright_ani4 3s linear 0s infinite;
    transform: rotate(-3deg);
    -webkit-transform: rotate(-3deg);
    font-size: 18px;
}
.floatleftandright_5{
    width: 100px;
    height: 40px;
    line-height: 40px;
    top:46%;
    left:30%;
    animation:floatleftandright_ani5 3s linear 0s infinite;
    -webkit-animation: floatleftandright_ani5 3s linear 0s infinite;
    -moz-animation: floatleftandright_ani5 3s linear 0s infinite;
    transform: rotate(-3deg);
    -webkit-transform: rotate(-3deg);
}
.floatleftandright_6{
    width: 100px;
    height: 40px;
    line-height: 40px;
    top:46%;
    left:75%;
    animation:floatleftandright_ani6 3s linear 0s infinite;
    -webkit-animation: floatleftandright_ani6 3s linear 0s infinite;
    -moz-animation: floatleftandright_ani6 3s linear 0s infinite;
    transform: rotate(-3deg);
    -webkit-transform: rotate(-3deg);
    font-size: 20px;
}

.scanning{
    background: #fff;
    width: 280px;
    height: 5px;
    position: absolute;
    top: 17%;
    left: 39%;
    opacity: 0.5;
    animation:scanning 3s linear 0s infinite;
    -webkit-animation: scanning 3s linear 0s infinite;
    -moz-animation: scanning 3s linear 0s infinite;
}
.picture_emergence{
    position: absolute;
    left: 61%;
    bottom: 28%;
    animation:emergence_ani 1s linear;
    -webkit-animation: emergence_ani 1s linear;
    -moz-animation: emergence_ani 1s linear;
    opacity: 1;
}
@keyframes floatleftandright_ani1{
    0%{
        left: 25%;
    }
    50%{
        left: 28%;
    }
    100%{
        left: 25%;
    }
}
@-webkit-keyframes floatleftandright_ani1{
    0%{
        left: 25%;
    }
    50%{
        left: 28%;
    }
    100%{
        left: 25%;
    }
}
@keyframes floatleftandright_ani2{
    0%{
        left: 70%;
    }
    50%{
        left: 65%;
    }
    100%{
        left: 70%;
    }
}
@-webkit-keyframes floatleftandright_ani2{
    0%{
        left: 70%;
    }
    50%{
        left: 65%;
    }
    100%{
        left: 70%;
    }
}
@keyframes floatleftandright_ani3{
    0%{
        left: 20%;
    }
    50%{
        left: 30%;
    }
    100%{
        left: 20%;
    }
}
@-webkit-keyframes floatleftandright_ani3{
    0%{
        left: 20%;
    }
    50%{
        left: 30%;
    }
    100%{
        left: 20%;
    }
}
@keyframes floatleftandright_ani4{
    0%{
        left: 70%;
    }
    50%{
        left: 67%;
    }
    100%{
        left: 70%;
    }
}
@-webkit-keyframes floatleftandright_ani4{
    0%{
        left: 70%;
    }
    50%{
        left: 67%;
    }
    100%{
        left: 70%;
    }
}
@keyframes floatleftandright_ani5{
    0%{
        left: 30%;
    }
    50%{
        left: 25%;
    }
    100%{
        left: 30%;
    }
}
@-webkit-keyframes floatleftandright_ani5{
    0%{
        left: 30%;
    }
    50%{
        left: 25%;
    }
    100%{
        left: 30%;
    }
}
@keyframes floatleftandright_ani6{
    0%{
        left: 75%;
    }
    50%{
        left: 65%;
    }
    100%{
        left: 75%;
    }
}
@-webkit-keyframes floatleftandright_ani6{
    0%{
        left: 75%;
    }
    50%{
        left: 65%;
    }
    100%{
        left: 75%;
    }
}

@keyframes scanning{
    0%{
        top:17% ;
        left: 39%;
    }
    50%{
        top: 54%;
    left: 42.5%;
    }
    100%{
        top:17% ;
        left: 39%;
    }
}
@-webkit-keyframes scanning{
    0%{
        top:17% ;
        left: 39%;
    }
    50%{
        top: 54%;
    left: 42.5%;
    }
    100%{
        top:17% ;
        left: 39%;
    }
}

@keyframes emergence_ani{
    0%{
        bottom: 15%;
        opacity: 0;
    }
    100%{
        bottom: 28%;
        opacity: 1;
    }
}
@-webkit-keyframes emergence_ani{
    0%{
        bottom: 15%;
        opacity: 0;
    }
    100%{
        bottom: 28%;
        opacity: 1;
    }
}