body {
	background: linear-gradient(to bottom, #170c3a 70%, #36167A);
	height: 100vh;
	margin: 0;
	overflow: hidden;
}

.sun {
	background: linear-gradient(to bottom, #f2ec4f, #c81548);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	max-width: 400px;
	height: 400px;
	border-radius: 100%;
	z-index: 2;
	overflow: hidden;
}

.sun-shadow {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 100%;
	height: 100%;
	max-width: 400px;
	height: 400px;
	background: linear-gradient(to bottom, #f2ec4f, #c81548);
	z-index: 4;
	border-radius: 100%;
	transform: scale(.9) translate(-50%, -50%);
	transform-origin: left top;
	filter: blur(50px);
	opacity: .8;
}

.sun span {
	width: 100%;
	background: #170c3a;
	position: absolute;
	bottom: 0 !important;
	height: 15px;
	animation: sunbeam 5s ease-in infinite both;
}

@keyframes sunbeam {
	from {
		transform: translateY(20px) scaleY(1);
		opacity: 1;
	}

	to {
		transform: translateY(-200px) scaleY(.2);
		opacity: 0;
	}

	75% {
		opacity: .9;
	}
}

.sun span:nth-child(1) {
	animation-delay: 5s;
}

.sun span:nth-child(2) {
	animation-delay: 4.5s;
}

.sun span:nth-child(3) {
	animation-delay: 4s;
}

.sun span:nth-child(4) {
	animation-delay: 3.5s;
}

.sun span:nth-child(5) {
	animation-delay: 3s;
}

.sun span:nth-child(6) {
	animation-delay: 2.5s;
}

.sun span:nth-child(7) {
	animation-delay: 2s;
}

.sun span:nth-child(8) {
	animation-delay: 1.5s;
}

.sun span:nth-child(9) {
	animation-delay: 1s;
}

.sun span:nth-child(10) {
	animation-delay: .5s;
}

.sun span:nth-child(11) {
	animation-delay: 0s;
}

.fog {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 40vh;
	z-index: 10;
	background: linear-gradient(to bottom, transparent, #36167A 90%);
}

svg {
	position: absolute;
	z-index: 8;
	bottom: -10vh;
	width: 100%;
}

.mountain {
	fill: #0e0021;
	stroke: #0057a2;
	stroke-width: 2px;
}