body {
    /*background-repeat: repeat-y;*/
    /* fallback for non-supporting browsers */
    /*background-color: #00d2ff;*/
    /* standard */
    /*background-image: linear-gradient(to left, #00d2ff, #3a7bd5);*/
    /* for webkit browser - Chrome,Safari */
    /*background-image: -webkit-linear-gradient(to left, #00d2ff, #3a7bd5);*/
    /* for mozilla browser */
    /*background-image: -moz-linear-gradient(to left, #00d2ff, #3a7bd5);*/
    /* for opera browser */
    /*background-image: -o-linear-gradient(to left, #00d2ff,#3a7bd5);*/



    background-color: #85FFBD;
    background-image: linear-gradient(45deg, #85FFBD 0%, #FFFB7D 100%)
}

#gear-1 {
    margin-left: 250px;
    margin-top: 200px;
    transfrom-origin: 125px 125px;
}

#gear-2 {
    /*float: left;*/
    margin-left: 485px;
    margin-top: -350px;
    transform-origin: 100px 100px;
}

#gear-3 {
    margin-left: 500px;
    transform-origin: 75px 75px;
}

#gear-4 {
    margin-left: 155px;
    margin-top: -250px;
    transform-origin: 50px 50px;
}

#gear-5 {
    margin-left: 100px;
    margin-top: 10px;
    transfrom-origin: 75px 75px;
}

#gear-6 {
    margin-left: 200px;
    margin-top: -25px;
    transform-origin: 100px 100px;
}

#gear-7 {
    margin-left: 660px;
    margin-top: -450px;
    transform-origin: 125px 125px;
}

#gear-8 {
    margin-left: 580px;
    margin-top: -20px;
    transform-origin: 100px 100px;
}

#gear-9 {
    margin-left: 420px;
    margin-top: -190px;
    transfrom-origin: 75px 75px;
}

#gear-10 {
    margin-left: 390px;
    margin-top: -510px;
}

svg {
    animation: animate 5s linear forwards infinite;
    -webkit-animation: animate 5s linear forwards infinite;
    -moz-animation: animate 5s linear forwards infinite;
    -o-animation: animate 5s linear forwards infinite;
    animation-play-state: running;
}

@-webkit-keyframes animate {
    to {
        transform: rotate(360deg);
    }
}

@-moz-keyframes animate {
    to {
        transform: rotate(360deg);
    }
}