.asmAlarm {
	border-radius: 3.125rem;
	padding: 0.75rem 1.25rem;
	z-index: 1001;
	color: white;
	animation-name: alramIn;
	animation-duration: 1s;
	position: relative;
	box-shadow: 0px 6px 16px rgba(17, 17, 17, 0.14);
}


.asmAlarm:hover {
	cursor: pointer;
}

.asmAlarm.sizeLong {
	/* width: 30rem; */
	width: unset;
}


.asmAlarm.sizeLong.asmAlarm.asmError{
	/* width: 30rem; */
	background-color: #FF8C00;
}


@keyframes alramIn {
	0% {
		right: -50%;
	}
	80% {
		right: 50%;
	}
	100% {
		right: 0%;
	}
}

.asmAlarm.asmText {
	background-color: #4e5558;
}


.asmAlarm.asmInfo {
	background-color: #3D4147;
}

.asmAlarm.asmSuccess {
	background-color: #2F80ED;
}

.asmAlarm.asmWarning {
	background-color: #FF8C00;
}

.asmAlarm.asmError {
	background-color: #FF8C00;
}
.asmAlarm.asmMsg {
	background-color: #464645;
}
.asmAlarm.content{
	margin: 0;
}

.asmAlarm > div > .link {
	height: 0;
	width: 0;
	/* width: 2rem; */
}

.asmAlarm > div > img {
	width: 1.5rem;
	height: 1.5rem;
	position: relative;
	margin-top: 2px;
}

.asmAlarm > div > .contentsArea {
	/* width: 11rem;
	text-align: left;
	font-size: 1.1rem;
	position: relative;
	bottom: 45%;
	left: 3rem;
	text-align: left; */
	align-items:center;
	font-size: 1rem;
	position: relative;
	width: fit-content;
}

.asmAlarm > div {
	display: flex;
	align-items:center;
	gap:8px;
	width: 21.875rem;
}

.asmAlarm.asmText > div > .contentsArea {
	top: 23%;
	left: 1rem;
	bottom: 0%;
}

.asmAlarm.asmWarning > div > .contentsArea {
	bottom: 37%;
}

.asmAlarm.sizeLong > div > .contentsArea {
	/* width: 26rem; */
	width: max-content;
}

#alarmDiv {
	width: max-content;
	height: max-content;
	position: absolute;
	bottom:134px;
	left: 40%;

	z-index: 1061;
}

#alarmDivmap {
	width: max-content;
	height: max-content;
	position: absolute;
	bottom: 2%;
	right: 1rem;
	display: flex;
	align-items: flex-end;
	flex-direction: column;
	z-index: 1061;
}
