.modal{
	position: fixed;
    top: 0;
    left: 0;
    background: rgba(0,0,0,0.6);
    width: 100%;
    height: 100%;
   	visibility:hidden;
	transition: visibility 0s linear 0.2s;
	z-index:10;
	color: black;
}

.modal-active{
	transition-delay:0s;
	visibility:visible;
}

.modal-active .modal-body{
	margin-top:50px;
	opacity:1;
}

.modal-body{
	opacity:0;
	margin:50px auto;
	margin-top:-100px;
	background:white;
	padding:20px;
	max-width:1200px;
	width:100%;
	border-radius:2px;
    transition: margin 0.2s ease-in-out,opacity 0.2s ease-in-out;
}

.modal-content{
	
}

.modal-body-small{
	max-width:500px;
}

.modal-body .modal-title{
	font-size:24px;
	margin:0;
}

.modal-close{

}

.modal-header-content{
	flex-grow:1;

}

.modal-header{
	display:flex;
	margin-bottom:10px;
}