.modal-center {
	text-align: center;
	padding: 0!important;
}

.modal-center:before {
	content: '';
	display: inline-block;
	height: 100%;
	vertical-align: middle;
	margin-right: -0.25rem;
}

.modal-dialog-center {
	display: inline-block;
	text-align: left;
	vertical-align: middle;
}

.modal-borderless {
	background: transparent;
	color: #ddd;
}

.modal-backdrop
{
    opacity:0.7 !important;
}

.modal-title-old {
	text-transform: uppercase;
	color: #525252;
}

.modal-title {
	text-transform: uppercase;
	color: #fff;
	color: var(--modal-title-color);
}

.modal-body-content {
	color: #a4a4a4;
	color: var(--modal-body-content-color);
	text-align: justify;
}

.modal-header-box {
	border: 0px;
}

.modal-footer-box {
	border: 0px;
	display: flex;
    justify-content: end;
    flex-direction: row;
}

.modal-content-box {
	border: 1px solid var(--main-popup-group-box-border);
    background-color: var(--main-popup-group-box-bg);
	border-radius: 14px;
}

.modal-content-box-btn {
	background: var(--active-blue);
	color: #fff;
	text-transform: uppercase;
	border-radius: 0.3125rem;
	border: 0rem;
}

.modal-content-box-btn-a {
	background: #000;
	color: #fff;
	text-transform: uppercase;
	border-radius: 0.3125rem;
	border: 1px solid #fff;
}

.modal-content-box-btn-a:hover {
	color: #000;
}

.modal-body-scrollable {
	max-height: calc(100vh - 13.75rem);
	overflow-y: auto;
}

#page-modal-box .modal-dialog.wide-modal,
#page-modal-box-yesno .modal-dialog.wide-modal {
  width: calc(100% - 3.125rem);
  max-width: 75rem;
}

#page-modal-box .modal-dialog.wide-modal,
#page-modal-box-yesno .modal-dialog.wide-modal {
  width: calc(100% - 3.125rem);
  max-width: 75rem;
}

.wider-modal {
	width: 50rem;
}

.modal-extendable {
	width: auto !important;
	max-width: calc(100vw - 1.25rem) !important;
}

@media (max-width: 54.25rem) {
	.wider-modal {
    	width: 80% !important;
	}
}

@media (min-width: 48rem) {
	.modal-extendable {
    	min-width: 37.5rem !important;
	}
}

@media (max-width: 35rem) {
	.modal-extendable {
    	min-width: 80% !important;
		width: 80% !important;
    }
}

@media (max-width: 700px) {
    .modal-dialog {
        width: 80% !important;
    }
}

#page-modal-box-threshold .modal-dialog-center {
	max-width: 70rem;
	width:80%;
}