/*
 * Dependencies: flaticon.css, global.css
 */

#msgbox {
	display: flex;
	align-items: center;
	box-sizing: border-box;
	box-shadow: 2px 2px 10px 3px rgba(0,0,0, 0.5);
	border-radius: 6px;
	border-width: 1px;
	border-style: solid;
	position: fixed;
	top: 215px;
	left: calc(50% - 210px);
	width: 420px;
	padding: 20px;
	z-index: 1000;
	cursor: default;
}
#msgbox > i { /* flaticon */
	flex: 0;
	display: block;
	line-height: 32px;
	font-size: 32px;
}
#msgbox > p { /* message text */
	flex: 1;
	padding-left: 15px;
	margin: 0;
	font-size: 12px;
}

.msgbox-info {
	border-color: #7B8767;
	background: #FAFDE4;
	color: #2F3E06;
}
.msgbox-info > i:before {
	content: var(--flaticon-check33);
	color: #88A54A;
}

.msgbox-warn {
	border-color: #746D3E;
	background: #FBF7E3;
	color: #332507;
}
.msgbox-warn > i:before {
	content: var(--flaticon-warning8);
	color: #DF932F;
}

.msgbox-busy {
	border-color: #777;
	background: #FFF;
	color: #222;
}
.msgbox-busy > i {
	animation: var(--animation-spin);
}
.msgbox-busy > i:before {
	content: var(--flaticon-settings21);
	color: #AAA;
}