
.AlertBoxContainer .AlertBoxContent .Icon.Alert { 
	filter: invert(55%) sepia(95%) saturate(561%) hue-rotate(348deg) brightness(104%) contrast(101%);
}
.AlertBoxContainer .AlertBoxContent .Icon.Error { 
	filter: invert(11%) sepia(62%) saturate(7118%) hue-rotate(1deg) brightness(104%) contrast(118%);
}
.AlertBoxContainer .AlertBoxContent .Icon.Info { 
	filter: invert(20%) sepia(27%) saturate(7419%) hue-rotate(218deg) brightness(92%) contrast(94%);
}
.AlertBoxContainer .AlertBoxContent .Icon.Prompt { 
	filter: invert(15%) sepia(79%) saturate(4265%) hue-rotate(275deg) brightness(86%) contrast(97%);
}

@media only screen and (max-device-width: 767px) {

	.AlertBoxContainer { 
		z-index: 2147483633 !important;
	}
	.AlertBoxContainer, .AlertBoxContainer .AlertBox {
	    left: 0 !important;
	    top: 0 !important;
	    width: 100vw !important;
	    height: 100vh !important;
	    font-size: 1.7rem !important;
	    text-align: center;
	    position: fixed !important;
	    background-color: #ffffff !important;
	    padding-left: 1rem;
	    padding-right: 1rem;
	    box-sizing: border-box;
	    z-index: 2147483633;
	}
	.AlertBoxContainer .AlertBoxContent .Icon { 
    	width: 40vw;
    	margin-top: 3rem;
    	margin-bottom: 1rem;
	}
	.AlertBoxContainer .AlertBoxContent .AlertBoxTitle {
		font-size: 1.6em;
		font-family: "Roboto Condensed","Arial Narrow","Helvetica Condensed";
		font-weight: bold;
		color: #333333;
		margin-left: 1em;
		margin-right: 1em;
		margin-bottom: 0.8em;
		line-height: 1.2em;
	}
	.AlertBoxContainer .AlertBoxContent .AlertBoxMessage {
		font-size: 1.1em;
		line-height: 1.2em;
		font-family: "Roboto","Arial","Helvetica";
		color: #333333;
		margin-left: 1em;
		margin-right: 1em;
	}
	.AlertBoxContainer .AlertBoxContent .AlertBoxButtCont {
		display: block;
		padding-top: 2em;
		text-align: center;
	}
	.AlertBoxContainer .AlertBoxContent .AlertBoxButtCont .Button {
		display: inline-block;
		padding-left: 1em;
		padding-right: 1em;
		text-align: center;
		font-size: 1.1em;
		line-height: 2.2em;
		min-width: 3em;
		margin-left: 0.5em;
		margin-right: 0.5em;
		font-family: "Roboto","Arial","Helvetica";
		color: #ffffff;
		background-color: #777777;
		-webkit-border-radius: 0.4em; 
		-moz-border-radius: 0.4em; 
		border-radius: 0.4em; 
		cursor: pointer;
	}
	.AlertBoxContainer .AlertBoxContent .AlertBoxButtCont .Button:HOVER {
		background-color: #333333;
	}

}

@media only screen and (min-device-width: 768px) {

	.AlertBoxContainer { 
		display: none;
		position: fixed;
		left: 0;
		top: 0;
		width: 100vw;
		height: 100vh;
		z-index: 2147483633 !important;
		background-color: #000000CC;
		font-size: 1.1rem; /* Questo ridimensiona la popup */
	}

	.AlertBoxContainer .AlertBox { 
		margin:0px; 
		padding:0px; 
		position:fixed; 
		background-color:#FFFFFF; 
		border:0.05em solid #000000; 
		box-shadow:0px 0.2em 0.6em #000000; 
		-webkit-border-radius: 0.7em; 
		-moz-border-radius: 0.7em; 
		border-radius: 0.7em; 
		width: 40em !important;
		height: auto !important;
		font-size: 1em;
	}
	.AlertBoxContainer .AlertBoxContent { 
		overflow: hidden;
		margin:0px; 
		padding:0px; 
		position:relative; 
		width:100%; 
		padding-bottom: 1.5em;
		box-sizing: border-box;
		background-color:transparent; 
	}
	.AlertBoxContainer .AlertBoxContent .Icon { 
	    position: absolute;
	    left: 1.8em;
	    top: 1.8em;
	    width: 5.8em;
	}
	.AlertBoxContainer .AlertBoxContent .AlertBoxTitle {
		font-size: 1.9em;
		line-height: 1.2em;
		font-family: "Roboto Condensed","Arial Narrow","Helvetica Condensed";
		font-weight: bold;
		color: #333333;
		margin-left: 5em;
		margin-right: 2em;
		margin-top: 0.9em;
		margin-bottom: 0.2em;
	}
	.AlertBoxContainer .AlertBoxContent .AlertBoxMessage {
		font-size: 1.1em;
		line-height: 1.2em;
		font-family: "Roboto","Arial","Helvetica";
		color: #333333;
		margin-left: 8.6em;
		margin-right: 2em;
		min-height: 3.5em;
	}
	.AlertBoxContainer .AlertBoxContent .AlertBoxButtCont {
		display: block;
		padding-top: 2em;
		padding-right: 2em;
		text-align: right;
	}
	.AlertBoxContainer .AlertBoxContent .AlertBoxButtCont .Button {
		display: inline-block;
		padding-left: 1em;
		padding-right: 1em;
		margin-left: 1em;
		text-align: center;
		font-size: 1.1em;
		line-height: 2.2em;
		min-width: 4em;
		font-family: "Roboto","Arial","Helvetica";
		color: #ffffff;
		background-color: #777777;
		-webkit-border-radius: 0.4em; 
		-moz-border-radius: 0.4em; 
		border-radius: 0.4em; 
		cursor: pointer;
	}
	.AlertBoxContainer .AlertBoxContent .AlertBoxButtCont .Button:HOVER {
		background-color: #333333;
	}

}

