.tmodalwindow:not(.tmodalwindow-open) {
left: -110%;
visibility: hidden;
}
/* ------------------------- Zentrierungsbox ------------------------ */
.tmodalwindow {
position: fixed;
z-index: 9999;
top: 0;
left: 0;
height: 100%;
width: 100%;
text-align: center;
background-color: rgba(0,0,0,0.3);
}
.tmodalwindow:before,
.tmodalwindow > div {
display: inline-block;
vertical-align: middle;
}
.tmodalwindow:before {
content: '';
width: 0;
height: 100%;
}
.tmodalwindow > div {
max-width: 100%;
text-align: left;
}
/* --------------------------- Fenster ---------------------------- */
.tmodalwindow > div > div {
margin: 0 auto;
max-width: 90%;
max-height: 90vh;
background-color: white;
box-shadow: 2px 2px 8px rgba(0,0,0,0.4);
position: relative;
overflow-y: auto; /* wenn der Inhalt doch nicht ganz in die Box passt */
}
tmodalwindow > div > div.tmodalwindow-fix-aspectratio {
/*width: auto;*/
height: auto;
}
/* Diese Werte könnte auch via Script an die Größe des im Fenster dargestellten Inhaltes angepasst werden */
@media (max-width: 360px), (max-height: 360px) { /* oder 479px */
.tmodalwindow > div > div {
width: 100%;
max-width: 100%;
height: 100vh;
max-height: 100vh;
}
}
.tmodalwindow .tmodalwindow-fix-aspectratio > div {
display: block;
height: 100%;
}
.tmodalwindow .tmodalwindow-fix-aspectratio > div > div {
position: relative;
display: block;
height: 0;
max-width: 100%;
text-align: left; /* Zurücksetzen von -Styles */
line-height: 1.35;
font-size: 16px;
font-size: 1rem;
}
.tmodalwindow .tmodalwindow-fix-aspectratio > div > div > * { /* ![]()
,