.holder{position:relative;width:100%;height:400px;background-color:#ebe5df;padding-top:70px}.flying-notes{position:relative;width:100px;height:100px;margin:0 auto}.flying-notes .note{position:relative;left:0%;top:0%;width:100px;height:100px;animation:wobble 1s infinite;transform-origin:50% 100%}@keyframes wobble {
    0% {
        transform: rotateZ(0deg);
    }
    10% {
        transform: rotateZ(-10deg);
    }
    20% {
        transform: rotateZ(10deg);
    }
    30% {
        transform: rotateZ(-5deg);
    }
    40% {
        transform: rotateZ(5deg);
    }
    50% {
        transform: rotateZ(-3.3333333333deg);
    }
    60% {
        transform: rotateZ(3.3333333333deg);
    }
    70% {
        transform: rotateZ(-2.5deg);
    }
    80% {
        transform: rotateZ(2.5deg);
    }
    90% {
        transform: rotateZ(-2deg);
    }
    100% {
        transform: rotateZ(0deg);
    }
}.flying-notes .note svg{width:100%;height:100%}.flying-notes .note.note1{position:absolute;opacity:0;width:100px;animation:note1 5.7s infinite linear;animation-delay:0s}@keyframes note1 {
    0% {
        left: 0px;
        top: 0px;
        opacity: 0;
        transform: rotateY(0deg);
    }
    20% {
        left: -27px;
        top: -27px;
        opacity: 0.8;
        transform: rotateY(720deg);
        width: 32px;
    }
    35% {
        left: -27px;
        top: -27px;
        opacity: 0;
        transform: rotateY(1080deg);
        width: 32px;
    }
    100% {
        left: -27px;
        top: -27px;
        opacity: 0;
        transform: rotateY(0deg);
    }
}.flying-notes .note.note2{position:absolute;opacity:0;width:100px;animation:note2 5.7s infinite linear;animation-delay:1s}@keyframes note2 {
    0% {
        left: 0px;
        top: 0px;
        opacity: 0;
        transform: rotateY(0deg);
    }
    20% {
        left: -29px;
        top: -27px;
        opacity: 0.8;
        transform: rotateY(720deg);
        width: 33px;
    }
    35% {
        left: -29px;
        top: -27px;
        opacity: 0;
        transform: rotateY(1080deg);
        width: 33px;
    }
    100% {
        left: -29px;
        top: -27px;
        opacity: 0;
        transform: rotateY(0deg);
    }
}.flying-notes .note.note3{position:absolute;opacity:0;width:100px;animation:note3 5.7s infinite linear;animation-delay:2s}@keyframes note3 {
    0% {
        left: 0px;
        top: 0px;
        opacity: 0;
        transform: rotateY(0deg);
    }
    20% {
        left: 4px;
        top: -12px;
        opacity: 0.8;
        transform: rotateY(720deg);
        width: 45px;
    }
    35% {
        left: 4px;
        top: -12px;
        opacity: 0;
        transform: rotateY(1080deg);
        width: 45px;
    }
    100% {
        left: 4px;
        top: -12px;
        opacity: 0;
        transform: rotateY(0deg);
    }
}.flying-notes .note.note4{position:absolute;opacity:0;width:100px;animation:note4 5.7s infinite linear;animation-delay:3s}@keyframes note4 {
    0% {
        left: 0px;
        top: 0px;
        opacity: 0;
        transform: rotateY(0deg);
    }
    20% {
        left: 33px;
        top: -48px;
        opacity: 0.8;
        transform: rotateY(720deg);
        width: 39px;
    }
    35% {
        left: 33px;
        top: -48px;
        opacity: 0;
        transform: rotateY(1080deg);
        width: 39px;
    }
    100% {
        left: 33px;
        top: -48px;
        opacity: 0;
        transform: rotateY(0deg);
    }
}.flying-notes .note.note5{position:absolute;opacity:0;width:100px;animation:note5 5.7s infinite linear;animation-delay:4s}@keyframes note5 {
    0% {
        left: 0px;
        top: 0px;
        opacity: 0;
        transform: rotateY(0deg);
    }
    20% {
        left: 19px;
        top: -58px;
        opacity: 0.8;
        transform: rotateY(720deg);
        width: 37px;
    }
    35% {
        left: 19px;
        top: -58px;
        opacity: 0;
        transform: rotateY(1080deg);
        width: 37px;
    }
    100% {
        left: 19px;
        top: -58px;
        opacity: 0;
        transform: rotateY(0deg);
    }
}.flying-notes .note.note6{position:absolute;opacity:0;width:100px;animation:note6 5.7s infinite linear;animation-delay:5s}@keyframes note6 {
    0% {
        left: 0px;
        top: 0px;
        opacity: 0;
        transform: rotateY(0deg);
    }
    20% {
        left: 23px;
        top: -91px;
        opacity: 0.8;
        transform: rotateY(720deg);
        width: 39px;
    }
    35% {
        left: 23px;
        top: -91px;
        opacity: 0;
        transform: rotateY(1080deg);
        width: 39px;
    }
    100% {
        left: 23px;
        top: -91px;
        opacity: 0;
        transform: rotateY(0deg);
    }
}.flying-notes .note.note7{position:absolute;opacity:0;width:100px;animation:note7 5.7s infinite linear;animation-delay:6s}@keyframes note7 {
    0% {
        left: 0px;
        top: 0px;
        opacity: 0;
        transform: rotateY(0deg);
    }
    20% {
        left: -11px;
        top: -38px;
        opacity: 0.8;
        transform: rotateY(720deg);
        width: 39px;
    }
    35% {
        left: -11px;
        top: -38px;
        opacity: 0;
        transform: rotateY(1080deg);
        width: 39px;
    }
    100% {
        left: -11px;
        top: -38px;
        opacity: 0;
        transform: rotateY(0deg);
    }
}.flying-notes .note.note8{position:absolute;opacity:0;width:100px;animation:note8 5.7s infinite linear;animation-delay:7s}@keyframes note8 {
    0% {
        left: 0px;
        top: 0px;
        opacity: 0;
        transform: rotateY(0deg);
    }
    20% {
        left: 30px;
        top: -21px;
        opacity: 0.8;
        transform: rotateY(720deg);
        width: 27px;
    }
    35% {
        left: 30px;
        top: -21px;
        opacity: 0;
        transform: rotateY(1080deg);
        width: 27px;
    }
    100% {
        left: 30px;
        top: -21px;
        opacity: 0;
        transform: rotateY(0deg);
    }
}.flying-notes .note.note9{position:absolute;opacity:0;width:100px;animation:note9 5.7s infinite linear;animation-delay:8s}@keyframes note9 {
    0% {
        left: 0px;
        top: 0px;
        opacity: 0;
        transform: rotateY(0deg);
    }
    20% {
        left: 64px;
        top: -61px;
        opacity: 0.8;
        transform: rotateY(720deg);
        width: 47px;
    }
    35% {
        left: 64px;
        top: -61px;
        opacity: 0;
        transform: rotateY(1080deg);
        width: 47px;
    }
    100% {
        left: 64px;
        top: -61px;
        opacity: 0;
        transform: rotateY(0deg);
    }
}.flying-notes .note.note10{position:absolute;opacity:0;width:100px;animation:note10 5.7s infinite linear;animation-delay:9s}@keyframes note10 {
    0% {
        left: 0px;
        top: 0px;
        opacity: 0;
        transform: rotateY(0deg);
    }
    20% {
        left: -29px;
        top: -52px;
        opacity: 0.8;
        transform: rotateY(720deg);
        width: 46px;
    }
    35% {
        left: -29px;
        top: -52px;
        opacity: 0;
        transform: rotateY(1080deg);
        width: 46px;
    }
    100% {
        left: -29px;
        top: -52px;
        opacity: 0;
        transform: rotateY(0deg);
    }
}