/* text */
#banner-homoween-title.life > tspan {
	opacity: 1;
}
#banner-homoween-title {
	text-shadow: 0 4px 10px #ff000060;
}
#banner-homoween-title.life > #banner-homoween-title {
	animation: blinker 0.5s forwards;
}
@media (max-width: 767.98px) {
	#banner-homoween-title {
		transform: scale(1.4) translate(-90px, -120px);
		animation:none !important;
	}
	#banner-homoween-presenting {
		transform: scale(1.4) translate(-90px, -120px);
	}
	#banner-homoween-bats {
		display:none;
	}
}

@keyframes float {
	0% {
		transform: translateY(0px);
	}
	50% {
		transform: translateY(-6px);
	}
	100% {
		transform: translateY(0px);
	}
}
@keyframes blinker {
	10% {
		opacity: 0;
	}
	,
	30% {
		opacity: 0.4;
	}
	,
	60% {
		opacity: 0.2;
	}
	,
	85% {
		opacity: 0.5;
	}
	,
	100% {
		opacity: 0.9;
	}
}

/*days*/
:root {
	/*sky*/
	--sky-gradient-day10: radial-gradient(at bottom, #d43a27 25%, #761ab3 100%);
	--sky-gradient-day11: radial-gradient(at bottom, #d43a27 25%, #761ab3 100%);
	--sky-gradient-day12: radial-gradient(at bottom, #bf055c 25%, #6b007d 70%);
	--sky-gradient-day13: radial-gradient(at bottom, #bf055c 25%, #6b007d 70%);
	--sky-gradient-day14: radial-gradient(at bottom, #bf0583 5%, #560272 60%);
	--sky-gradient-day15: radial-gradient(at bottom, #bf0583 5%, #560272 60%);
	--sky-gradient-day16: radial-gradient(at bottom, #930184 -15%, #490272 60%);
	--sky-gradient-day17: radial-gradient(at bottom, #930184 -15%, #490272 60%);
	--sky-gradient-day18: radial-gradient(at bottom, #800073 -55%, #400179 60%);
	--sky-gradient-day19: radial-gradient(at bottom, #800073 -55%, #400179 60%);
	--sky-gradient-day20: radial-gradient(at bottom, #69017a 25%, #390271 70%);
	--sky-gradient-day21: radial-gradient(at bottom, #69017a 25%, #390271 70%);
	--sky-gradient-day22: radial-gradient(at bottom, #69017a 25%, #2d005b 70%);
	--sky-gradient-day23: radial-gradient(at bottom, #69017a 25%, #2d005b 70%);
	--sky-gradient-day24: radial-gradient(at bottom, #af00a6 -20%, #270146 70%);
	--sky-gradient-day25: radial-gradient(at bottom, #af00a6 -20%, #270146 70%);
	--sky-gradient-day26: radial-gradient(at bottom, #69047b -10%, #1e0037 70%);
	--sky-gradient-day27: radial-gradient(at bottom, #69047b -10%, #1e0037 70%);
	--sky-gradient-day28: radial-gradient(at bottom, #59047b 10%, #150026 70%);
	--sky-gradient-day29: radial-gradient(at bottom, #59047b 10%, #150026 70%);
	--sky-gradient-day30: radial-gradient(at bottom, #350249 10%, #150026 70%);
	--sky-gradient-day31: radial-gradient(at bottom, #21002e 10%, #150026 70%);

	/*moon*/
	--moon-fill-day10: gold;
	--moon-fill-day11: gold;
	--moon-fill-day12: gold;
	--moon-fill-day13: gold;
	--moon-fill-day14: goldenrod;
	--moon-fill-day15: goldenrod;
	--moon-fill-day16: none;
	--moon-fill-day17: none;
	--moon-fill-day18: none;
	--moon-fill-day19: none;
	--moon-fill-day20: #e4e4e4;
	--moon-fill-day21: #e4e4e4;
	--moon-fill-day22: #e4e4e4;
	--moon-fill-day23: #e4e4e4;
	--moon-fill-day24: #e4e4e4;
	--moon-fill-day25: #e4e4e4;
	--moon-fill-day26: #e4e4e4;
	--moon-fill-day27: #e4e4e4;
	--moon-fill-day28: #e4e4e4;
	--moon-fill-day29: #e4e4e4;
	--moon-fill-day30: #e4e4e4;
	--moon-fill-day31: #e4e4e4;

	--moon-shadow-day10: drop-shadow(0px 0px 20px yellow);
	--moon-shadow-day11: drop-shadow(0px 0px 20px yellow);
	--moon-shadow-day12: drop-shadow(0px 0px 20px yellow);
	--moon-shadow-day13: drop-shadow(0px 0px 20px yellow);
	--moon-shadow-day14: drop-shadow(0px 0px 20px gold);
	--moon-shadow-day15: drop-shadow(0px 0px 20px gold);
	--moon-shadow-day16: none;
	--moon-shadow-day17: none;
	--moon-shadow-day18: none;
	--moon-shadow-day19: none;
	--moon-shadow-day20: drop-shadow(0px 0px 5px #deddcf);
	--moon-shadow-day21: drop-shadow(0px 0px 5px #deddcf);
	--moon-shadow-day22: drop-shadow(0px 0px 10px #deddcf);
	--moon-shadow-day23: drop-shadow(0px 0px 10px #deddcf);
	--moon-shadow-day24: drop-shadow(0px 0px 10px #deddcf);
	--moon-shadow-day25: drop-shadow(0px 0px 10px #deddcf);
	--moon-shadow-day26: drop-shadow(0px 0px 10px #deddcf);
	--moon-shadow-day27: drop-shadow(0px 0px 10px #deddcf);
	--moon-shadow-day28: drop-shadow(0px 0px 10px #deddcf);
	--moon-shadow-day29: drop-shadow(0px 0px 10px #deddcf);
	--moon-shadow-day30: drop-shadow(0px 0px 10px #deddcf);
	--moon-shadow-day31: drop-shadow(0px 0px 10px #deddcf);

	--moon-position-day10: 303px;
	--moon-position-day11: 303px;
	--moon-position-day12: 308px;
	--moon-position-day13: 308px;
	--moon-position-day14: 320px;
	--moon-position-day15: 320px;
	--moon-position-day16: 350px;
	--moon-position-day17: 350px;
	--moon-position-day18: 350px;
	--moon-position-day19: 350px;
	--moon-position-day20: 322px;
	--moon-position-day21: 322px;
	--moon-position-day22: 312px;
	--moon-position-day23: 312px;
	--moon-position-day24: 308px;
	--moon-position-day25: 308px;
	--moon-position-day26: 303px;
	--moon-position-day27: 303px;
	--moon-position-day28: 300px;
	--moon-position-day29: 300px;
	--moon-position-day30: 300px;
	--moon-position-day31: 300px;

	/*ground*/
	--ground-shadow-day10: #5818bd;
	--ground-shadow-day11: #5818bd;
	--ground-shadow-day12: #5818bd;
	--ground-shadow-day13: #5818bd;
	--ground-shadow-day14: #5818bd;
	--ground-shadow-day15: #5818bd;
	--ground-shadow-day16: #5818bd;
	--ground-shadow-day17: #5818bd;
	--ground-shadow-day18: #5818bd;
	--ground-shadow-day19: #5818bd;
	--ground-shadow-day20: #5818bd;
	--ground-shadow-day21: #5818bd;
	--ground-shadow-day22: #4e16a6;
	--ground-shadow-day23: #4e16a6;
	--ground-shadow-day24: #51009a;
	--ground-shadow-day25: #51009a;
	--ground-shadow-day26: #4b028c;
	--ground-shadow-day27: #4b028c;
	--ground-shadow-day28: #41017b;
	--ground-shadow-day29: #41017b;
	--ground-shadow-day30: #41017b;
	--ground-shadow-day31: #41017b;

	--house-shadow-day10: #5818bd;
	--house-shadow-day11: #5818bd;
	--house-shadow-day12: #5818bd;
	--house-shadow-day13: #5818bd;
	--house-shadow-day14: #5818bd;
	--house-shadow-day15: #5818bd;
	--house-shadow-day16: #5818bd;
	--house-shadow-day17: #5818bd;
	--house-shadow-day18: #5818bd;
	--house-shadow-day19: #5818bd;
	--house-shadow-day20: #5818bd;
	--house-shadow-day21: #5818bd;
	--house-shadow-day22: #5818bd;
	--house-shadow-day23: #5818bd;
	--house-shadow-day24: #4a149f;
	--house-shadow-day25: #4a149f;
	--house-shadow-day26: #431290;
	--house-shadow-day27: #431290;
	--house-shadow-day28: #3a1476;
	--house-shadow-day29: #3a1476;
	--house-shadow-day30: #3a1476;
	--house-shadow-day31: #3a1476;

	--object-fill-day10: #240441;
	--object-fill-day11: #240441;
	--object-fill-day12: #240441;
	--object-fill-day13: #240441;
	--object-fill-day14: #240441;
	--object-fill-day15: #240441;
	--object-fill-day16: #240441;
	--object-fill-day17: #240441;
	--object-fill-day18: #240441;
	--object-fill-day19: #240441;
	--object-fill-day20: #240441;
	--object-fill-day21: #240441;
	--object-fill-day22: #240441;
	--object-fill-day23: #240441;
	--object-fill-day24: #1e0538;
	--object-fill-day25: #1e0538;
	--object-fill-day26: #18042c;
	--object-fill-day27: #18042c;
	--object-fill-day28: #18042c;
	--object-fill-day29: #18042c;
	--object-fill-day30: #18042c;
	--object-fill-day31: #18042c;

	--star-opacity-day10: 0;
	--star-opacity-day11: 0;
	--star-opacity-day12: 0;
	--star-opacity-day13: 0;
	--star-opacity-day14: 0;
	--star-opacity-day15: 0;
	--star-opacity-day16: 0.2;
	--star-opacity-day17: 0.2;
	--star-opacity-day18: 0.3;
	--star-opacity-day19: 0.3;
	--star-opacity-day20: 0.4;
	--star-opacity-day21: 0.4;
	--star-opacity-day22: 0.5;
	--star-opacity-day23: 0.5;
	--star-opacity-day24: 0.5;
	--star-opacity-day25: 0.5;
	--star-opacity-day26: 0.6;
	--star-opacity-day27: 0.6;
	--star-opacity-day28: 0.7;
	--star-opacity-day29: 0.7;
	--star-opacity-day30: 0.7;
	--star-opacity-day31: 0.7;
}

/* stars */
.star {
	animation: linear infinite alternate twinkle;
}

.star1 {
	animation-duration: 3s;
}

.star2 {
	animation-duration: 4s;
}

.star3 {
	animation-duration: 3.5s;
}

.star4 {
	animation-duration: 2s;
}

.star5 {
	animation-duration: 4s;
}

.star1 circle {
	r: 0.5px;
}
.star2 circle {
	r: 0.75px;
}
.star3 circle {
	r: 1.0px;
}
.star4 circle {
	r: 1.2px;
}
.star5 circle {
	r: 1.5px;
}

@media (max-width: 767.98px) {
	.star {
		animation: none;
		fill-opacity: 0.5;
	}
	.star1 circle {
		r: 1px;
	}
	.star2 circle {
		r: 1.5px;
	}
	.star3 circle {
		r: 2px;
	}
	.star4 circle {
		r: 2px;
	}
	.star5 circle {
		r: 2.5px;
	}
}

@keyframes twinkle {
	0% {
		opacity: 1;
	}
	50% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

#banner-homoween-title {
	animation: float infinite 8s ease-in-out;
}
#banner-homoween-title > tspan {
	opacity: 0;
}