body { display: flex; flex-direction: column; height: 100vh; overflow: hidden; margin: 0; padding: 0; } figure { width: 100%; height: auto; } figure img { width: 100%; } header { flex: 0 0 122px; padding: 0; margin: 0; display: flex; flex-direction: column; } #menu .logo { flex: 0 0 50%; display: inline-block; vertical-align: top; } nav#menu { width: 100%; } #menu { flex: 0 0 auto; display: flex; padding: .5em 0 0 .5em; flex-direction: row; } #venue-photo { flex: 2 0 0; /* height: 100%; */ display: flex; border-right: 3px solid black; } #venue-detail-text { flex: 1 0 0; padding: 20px 30px; max-height: 100%; overflow-y: auto; position: relative; } #venue-container { display: flex; flex-direction: row; /* width: 120%; */ /* position: absolute; */ /* right: 0px; */ /* height: 100%; */ border-top: 3px solid black; padding: 0px; flex: 1 0; /* overflow: hidden; */ } #venue-list li { list-style-type: none; font-size: 1.2em; line-height: 1.3em; } #venue-info { margin-top: 50px; } #venue-info p { display: block; } .venue-name { font-family: "Syne"; font-weight: 900; font-size: 1.4em; } .venue-name-room, .venue-adress { font-family: "Syne"; font-weight: 700; font-size: 1.3em; letter-spacing: 0.02em; line-height: 1.2em; } .venue-name + .venue-name-room { margin-top: 3pt; } .venue-intro + .venue-adress { margin-top: 5pt; } .venue-intro { font-family: "LM"; font-size: 1.3em; line-height: 1.1em; } #venue-list a.active { margin-left: 20px; border-bottom: 3px solid var(--yellow-moon); } #venue-list a.active:hover { text-decoration: none; }