ActiveReloadBar {
	width: 100%;
	height: 100%;
	position: relative;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	//background-color: blue;
	transition: opacity 0.1s ease-out;
	//border: 4px solid black;

	.container {
		position: relative;
		//top: 20%;
		height: 24px;
		width: 1000px;
		color: white;
		align-items: center;
		//align-items: flex-start;
		//justify-content: flex-start;
		//padding-left: 32px;
		//padding: 64px 0px 0px 32px;
		//flex-direction: column;
		background-color: #33000099;

		&.in-section {
			background-color: #8888aa55;
		}
		//border: 4px solid yellow;

		.section {
			position: absolute;
			height: 32px;
			width: 50px;
			background-color: #44ff44;
			z-index: 5;
		}

		.bar {
			position: absolute;
			height: 200px;
			width: 9px;
			background-color: #ffffff;
			//background-color: #000;
			z-index: 6;
			//border: 1px solid black;
		}

		.health {
			transition: opacity 0.25s ease-out;
		}

		.healthbar {
			position: relative;
			background-color: rgba(0, 0, 0, 0.8);
			width: 100%;
			height: 40px;

			.heathbardelta {
				position: absolute;
				background-color: rgba(255, 255, 255, 1);
				width: 100%;
				height: 40px;
				transition: width 0.6s linear;
				//opacity:0.8;
			}

			.heathbarfill {
				position: absolute;
				//background: linear-gradient(90deg, rgba(230, 50, 50, 1) 0%, rgba(255, 100, 100, 1) 100%);
				background-color: rgba(255, 55, 55, 1);
				width: 100%;
				height: 40px;
				transition: width 0.1s ease-out;
				//opacity:1;
			}
		}
	}
}