div.modal {
	margin:0 0 0 0;
	padding:1.25rem;
    width: calc(100% - 2.5rem);
	height: calc(100% - 2.5rem);
	z-index: -20001;
	position: fixed;
	background-color: rgba(0, 0, 0, 0.7);
	
    display:flex;
	align-items:center;
	justify-content:flex-start;

	-webkit-align-items:center;
	-webkit-justify-content:flex-start;

	display:-ms-flexbox;
	-ms-align-items:center;
	-ms-flex-pack:flex-start;
    
    flex-flow:column wrap;
	-webkit-flex-flow:column wrap;
	-ms-flex-flow:column wrap;
	opacity: 0;
	transition: opacity ease-in-out 300ms;
}
div.modal article {
	margin:-100% 0 0 0;
	padding:1.25rem 2.5rem;
	background: #F5F5F5;
	transition: margin ease-in-out 300ms;
}
div.modal article h3 {
	margin:0 0 0 0;
	padding:0 2rem 0.625rem;
	background: none;
	width: calc(100% - 4rem);
	text-align: center;
	color: #000;
	font-weight: 700!important;font-size: 1.2rem;
	position: relative;
}
div.modal article h3 a.chiudi {
	width: 1.2rem;
	height: 1.2rem;
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	background: url("../images/close.svg") no-repeat;
	background-position: center center;
	background-size: 100% 100%;
}
div.modal article p {
	margin:0.625rem 0;
	padding:1.25rem 0;
	width: 100%;
	text-align: center;
	background: #F5F5F5;
	border-bottom: 1px solid #CCC;
	border-top: 1px solid #CCC;
}
div.modal article a.bottone_modal {
	margin:0.625rem 0 0 0.3125rem;
	padding:0.625rem 1.25rem;
	float: right;
	text-align: center;
	border: 1px solid #777;
	text-decoration: none;
}
div.modal article a.rosso {
	color: #FFF;
	background: #CD4D52;
	border: 1px solid #CD4D52;
}
div.modal article a.nero {
	color: #FFF;
	background: #464F5E;
	border: 1px solid #464F5E;
}
div.modal article a.rosso:hover {
	background: #B32C30;
	border: 1px solid #B32C30;
}
div.modal article a.nero:hover {
	background: #2A2F38;
	border: 1px solid #2A2F38;
}
div.attivo {
	opacity: 1!important;
	z-index: 20001!important;
}
div.attivo article {
	margin:0 0 0 0!important;
}

@media only screen and (max-width : 600px) {
div.modal {
	padding:0.625rem;
    width: calc(100% - 1.25rem);
	height: calc(100% - 1.25rem);
}
	
div.modal article {
	padding:0.625rem;
}
div.modal article p {
	font-size: 0.875rem;
}
div.modal article h3 {
	font-size: 1rem;
}
}
@media only screen and (min-width : 601px) and (max-width : 900px)  {
div.modal article {
	max-width: 500px;
}
}
@media only screen and (min-width : 901px) and (max-width : 1200px) {
div.modal article {
	max-width: 600px;
}
}
@media only screen and (min-width : 1201px) {
div.modal article {
	max-width: 760px;
}
}