html.pms-modal-open,
body.pms-modal-open {
overflow: hidden;
} .pms-modal {
position: fixed;
inset: 0;
z-index: 9999;
display: none;
} .pms-modal.is-open {
display: block;
} .pms-modal__overlay {
position: fixed;
inset: 0;
background: rgba(0, 0, 0, 0.85);
display: flex;
align-items: center;
justify-content: center;
} .pms-modal__dialog {
position: relative;
width: 70vw;
max-width: 1200px;
background: transparent;
} @media (max-width: 768px) {
.pms-modal__dialog {
width: 90vw;
border-radius: 12px;
}
} .pms-modal__body {
position: relative;
width: 100%;
overflow: hidden;
border-radius: var(--pmsyt-radius-outer);
} .pms-modal__body .pmsyt-wrapper {
width: 100%!important;
max-width: 100%!important;
} .pms-modal__dialog.pms-modal__dialog--portrait {
width: auto !important;
max-width: none !important;
height: 90vh !important;
aspect-ratio: 9 / 16 !important;
}
@media (max-width: 768px) {
.pms-modal__dialog.pms-modal__dialog--portrait {
height: 85vh !important;
}
} .pms-modal__dialog.pms-modal__dialog--portrait .pms-modal__body {
height: 100% !important;
}
.pms-modal__dialog.pms-modal__dialog--portrait .pmsyt-root,
.pms-modal__dialog.pms-modal__dialog--portrait .pmsyt-header,
.pms-modal__dialog.pms-modal__dialog--portrait .pmsyt-wrapper,
.pms-modal__dialog.pms-modal__dialog--portrait .pmsyt-inner {
height: 100% !important;
}
.pms-modal__dialog.pms-modal__dialog--portrait .pmsyt-video-area {
height: 100% !important;
padding-top: 0 !important;
}
.pms-modal__dialog.pms-modal__dialog--portrait .pmsyt-video-container,
.pms-modal__dialog.pms-modal__dialog--portrait .pmsyt-cover {
position: absolute !important;
inset: 0 !important;
width: 100% !important;
height: 100% !important;
}
.pms-modal__dialog.pms-modal__dialog--portrait .pmsyt-video-container iframe {
width: 100% !important;
height: 100% !important;
} .pms-modal__close {
position: absolute;
top: -18px;
right: -18px;
width: 34px;
height: 34px;
border-radius: 999px;
border: none;
padding: 0;
cursor: pointer;
background: #ffffff;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
z-index: 2;
} .pms-modal__close::before,
.pms-modal__close::after {
content: "";
position: absolute;
width: 18px;
height: 2px;
background: #111111;
border-radius: 999px;
}
.pms-modal__close::before {
transform: rotate(45deg);
}
.pms-modal__close::after {
transform: rotate(-45deg);
}
.pms-modal__close:hover::before,
.pms-modal__close:hover::after {
background: #000000;
} .pms-modal.is-open .pms-modal__dialog {
animation: pms-modal-in 0.2s ease-out;
}
@keyframes pms-modal-in {
from {
opacity: 0;
transform: translateY(14px) scale(0.98);
}
to {
opacity: 1;
transform: translateY(0) scale(1);
}
}