sunset-down-1x.css

/*body{
	margin: 0;
	padding: 0; 
}*/
.wrapper-down-ss-1x{
	width: 100%;
	height: 582px;
	background-color: #d2c13a;
	display: block;
	position: relative;
	animation: ani-one-down-ss-one 10s ease-in-out 1.5s forwards 1;
}

.round-down-ss-1x{
	background-color: #FFFF00;
	width: 11%;
	height: 150px;
	position: absolute;
	left: 80%;
	top: 0;
	display: block;
	border-radius: 50%;
	animation: ani-three-down-ss-one 10s ease-in-out forwards 1;
}

.wrapper-2-down-ss-1x{
	/*position: absolute;*/
	bottom: 0;
}

.image-area-down-ss-1x{
	width: 100%;
	float: left;
	height: 582px;
	position: absolute;
	background-image: url('mountains.png');
}

@keyframes ani-one-down-ss-one{
	10%{
		background-color: #D2C13A;
	}
	20%{
		background-color: #C29C33;
	}
	30%{
		background-color: #B2772B;
	}
	40%{
		background-color: #A25224;
	}
	50%{
		background-color: #97391F;
	}
	70%{
		background-color: #C1491C;
	}
	80%{
		background-color: #7C2F20;
	}
	90%{
		background-color: #542123;
	}
	100%{
		background-color: #040427;
	}
}
@keyframes ani-three-down-ss-one{
	100%{
		top: 100%;
		opacity: 0%;
	}
	90%{
		opacity: 40%;
	}
	0%{
		top: 0;
	}
}