/* .page-block to blur and darken 
 * the background when the modal is open 
 */
.page-block {
    display: none;
    background: rgba(0, 0, 0, .2);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(5px);  
    position: fixed;
    height: 100vh;
    width: 100vw;
    top: 0;
    left: 0;
    z-index: 10000;
}
    
.page-block--show {
    display: block;
}

.modal-dialog {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 15000;
}

.modal-dialog:target {
	opacity: 1;
	pointer-events: auto;
}

.modal-dialog__inner {
	width: 75%;
	max-width: 800px;
	max-height: calc(100vh - 150px);
	position: relative;
	margin: 75px auto;
	padding: 35px;
	background: #fff;
	color: #111;
}

.modal-dialog__close {
	font-size: 24px;
	position: absolute;
	right: -24px;
	text-align: center;
	top: -10px;
	color: #9b1f2d;
	transition: .75s;
}

.modal-dialog__close:hover {
    color: #00204d;
}

.modal-dialog__content {
	max-height: calc(100vh - 250px);
       padding: 10px;
	overflow: auto;
}