#modal {
	position: fixed;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, .6);
	z-index: 10200;
}

.modal_container_sm {
	width: calc(50vw - 215px);
	background: rgba(245, 245, 245, 1);
	margin: 0 auto;
	display: block;
	padding: 56px 60px 60px;
    position: relative;
    top: 30px;
    border-radius: 6px;
}

#modal h2 {
	margin-bottom: 30px;
}

#modal .labeled_input {
	background: rgba(255, 255, 255, 1);
}

#modal button.primary {
	margin-top: 30px;
}

#modal .close {
	width: 46px;
	height: 46px;
	background: rgba(0, 0, 0, 0);
	border-radius: 40px;
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;

    -webkit-transition: all linear 200ms;
       -moz-transition: all linear 200ms;
            transition: all linear 200ms;
}
#modal .close:hover {
	background: rgba(0, 0, 0, .1);
}
#modal .close:hover:before, #modal .close:hover:after {
	background: rgba(0, 0, 0, .9);
}
#modal .close:before, #modal .close:after {
	content: '';
	display: block;
	position: absolute;
	left: 8px;
    top: 22px;
    width: 30px;
	height: 2px;
	transform: rotate(45deg);
	background: rgba(0, 0, 0, .33);

    -webkit-transition: all linear 200ms;
       -moz-transition: all linear 200ms;
            transition: all linear 200ms;
}
#modal .close:after {
	transform: rotate(-45deg);
}