.backgroundImg{
	background: url("../_images/leaf2.png") top left no-repeat;
	width: 700px;
	height: 1000px;
}

.home-img{
    margin-top:-100px;
	background-image: url("../_images/leaf2.png");
	background-repeat:no-repeat;
background-size:contain;
background-position:center;
    min-height: 90vh;
}
.home-img img{
	
    width: 50vw;
    animation: floatImage 3s ease-in-out infinite;
}

.keyframes{
    width: 100px;
    height: 100px;
    background-color: red;
    /*animation-name: move;
    animation-duration: 3s;
    animation-delay: 2s;
    animation-timing-function: ease-in-out;
    animation-direction: alternate;
    animation-iteration-count: 3;
    animation-fill-mode: forwards;*/
    /*animation: move 3s ease-in-out alternative 3 forwards;*/
    animation: move 8s ease-in-out;
}   

@keyframes move{
    0%{
        transform: translateX(0);
    }
    25%{
        transform: translateX(200px);
        background-color: blue;
    }
    50%{
        transform: translate(200px, 200px);
        background-color: bisque;
        /*transform: scale(1.5);*/
    }
    75%{
        transform: translate(0, 200px);
        background-color: aliceblue;
    }
    100%{
        transform: translateY(0);
    }
}

@keyframes floatImage{
    0%{
        transform: translateY(0);
    }
    50%{
        transform: translateY(-1.5rem);
    }
    100%{
        transform: translateY(0);
    }
}