/* modal (background) */
.modal {
	display: none;			/* hidden by default */
	position: fixed;		/* stay in place */
	z-index: 1;				/* sit on top */
	padding-top: 75px;		/* location of the box */
	left: 0;
	top: 0;
	width: 100%;			/* full width */
	height: 100%;			/* full height */
	overflow: auto;			/* enable scroll if needed */
}

/* modal content (when clicked) */
.modal-content {
	margin: auto;
	display: block;
	width: 90%;
	border-radius: 10px;
	border: 1px solid var(--orange);
}

/* animation */
.modal-content {  
	-webkit-animation-name: zoom;
	-webkit-animation-duration: 0.6s;
	animation-name: zoom;
	animation-duration: 0.6s;
}

@-webkit-keyframes zoom {
	from {transform:scale(0)} to {transform:scale(1)}
}

@keyframes zoom {
	from {transform:scale(0.1)} to {transform:scale(1)}
}

/* close mechanism, container */
.close {
	position: fixed;
	top: 24px;
	right: 150px;
	cursor: pointer;
}

/* close mechanism, cross parameters */
.cross div {
    width: 35px;
    height: 5px;
    background: var(--orange);
    border-radius: 5px;
}