@import "../../../css/colors.less";

.uiMiddleHud {
	position: absolute;
	left: calc(50% - 12px);
	top: calc(50% + 31px);

	.btnGather {
		display: none;
		background-color: fade(#3a3b4a, 90%);
		padding: 8px 10px 8px 10px;
		width: 120px;
		margin-top: 8px;
		margin-left: calc(12px - 60px);
		text-align: center;
		position: absolute;
		left: calc(50vw - 86px);
		top: calc(50vh - 113px);
		width: 64px;
		height: 64px;

		.icon {
			position: absolute;
			left: 0px;
			top: 0px;
			width: 100%;
			height: 100%;
			background: url(../../../images/uiIcons.png) -448px -64px;
		}
	}

	.casting {
		display: none;
		width: 32px;
		height: 5px;
		position: relative;
		background-color: @brownD;

		.bar {
			width: 0%;
			height: 100%;
			background-color: @yellowB;
		}

		.text {
			position: absolute;
			left: 0px;
			top: 0px;
			padding-top: 2px;
			width: 100%;
			text-align: center;
			color: @black;
		}
	}
}
