.modal,
.modal-box {
	z-index: 9999999;
}

.modal {
	display: none; 
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
		
	background: transparent;
	overflow: auto;

}





.modal-header {
 
	padding:20px;
	
	background: #2d9051;
	color: #ffffff;
	
}

.header-title, .close-modal{
	
		display:inline-block;
	
}

.header-title{
	
	margin-left: 5%;
		
}

.modal-body {
	background: #ECEFF1;
	padding: 20px 20px;
}

/* Close Button */
.close-modal {
	
	cursor: pointer;
	padding: 15px;
 
}



/* Animation */
@-webkit-keyframes modalbox {
	0% {
		top: -250px; 
		opacity: 0;
	}
	100% {
		top: 0; 
		opacity: 1;
	}
}

@keyframes modalbox {
	0% {
		top: -250px; 
		opacity: 0;
	}
	100% {
		top: 0; 
		opacity: 1;
	}
}

/* Aditional Styles */

/*
p {
	line-height: 1.4em;
}

*/

@media screen and (min-width: 721px) {
	
	.modal-box {
		position: relative;
		width: 100%;
		min-width: 600px;
		max-width:600px;
		margin: 5px auto;
		animation-name: modalbox;
		animation-duration: .3s;
		animation-timing-function: ease-out;
		
	}	
	
	#close-id{
		
			float: right;
			margin-right: 3%;
			margin-top: 3%;
		
	}
}


@media screen and (max-width: 720px) {
	
	.modal-box {
		position: relative;
		width: 100%;
		margin: 5px auto;
		animation-name: modalbox;
		animation-duration: .3s;
		animation-timing-function: ease-out;
		
	}
	
	#close-id{
		
			float: right;
			margin-right: 3%;
			margin-top: 3%;
			
		
	}
	
	
}