#alertPanelBlockedBox {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 60px auto 60px;
}

.mybox {
	font-family: "Josefin Sans", sans-serif;
	width: 75%;
	max-width: 500px;
	border: 2px solid #000;
	margin: 5px auto 5px;
	text-align: center;
	padding: 20px;
	font-weight: bold;
	border-radius: 10px;
	position: relative;
}

.warning {
	background: #f24954;
	color: #ebe360;
	border-color: #2d2d2d;
}

.warning:before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f12a";
	font-size: 2rem;
	position: absolute;
	left: 10px;
	top: 10px;
	text-shadow: 1px 1px 1px black;
	transform: rotate(-5deg);
}

.info {
	background: #58dbf2;
	color: #2d2d2d;
	border-color: #2d2d2d;
}

.info:before {
	font-family: "Font Awesome 5 Free";
	color: #58cef2;
	font-weight: 900;
	content: "\f129";
	font-size: 2rem;
	position: absolute;
	left: 10px;
	top: 10px;
	text-shadow: 1px 2px 1px black;
	transform: rotate(-5deg);
}

.success {
	background: #b3eca9;
	color: #306517;
	border-color: #2d2d2d;
}

.success:before {
	font-family: "Font Awesome 5 Free";
	color: #306517;
	font-weight: 900;
	content: "\f00c";
	font-size: 2rem;
	position: absolute;
	left: 10px;
	top: 10px;
	text-shadow: 1px 2px 1px black;
	transform: rotate(-5deg);
}

.error {
	background: #ebb1b1;
	color: #973939;
	border-color: #2d2d2d;
}

.error:before {
	font-family: "Font Awesome 5 Free";
	color: #973939;
	font-weight: 900;
	content: "\f00d";
	font-size: 2rem;
	position: absolute;
	left: 10px;
	top: 10px;
	transform: rotate(-5deg);
}

.question {
	background: lightgrey;
	color: #2d2d2d;
	border-color: #2d2d2d;
}

.question:before {
	font-family: "Font Awesome 5 Free";
	color: #2d2d2d;
	font-weight: 900;
	content: "\f128";
	font-size: 2rem;
	position: absolute;
	left: 10px;
	top: 10px;
	transform: rotate(-5deg);
}

.mybox-content p {
    margin: 5px 10px;
}