body { height: 100%; width: 100%; max-width: 100%; max-height: 100%; margin: 0; overflow: hidden; } #map { position: absolute; height: 100%; width: 100%; max-height: 100%; max-width: 100%; border: none; } #title-container { position: absolute; pointer-events: none; display: flex; flex-flow: row wrap; z-index: 800; text-align: right; width: 100%; height: 100%; } h1, h2, h3 { position: absolute; width: 100%; pointer-events: none; font-family: Courier; color: #d152b8; margin: 0; } h1 { padding-top: 2%; padding-right: 2%; font-size: 10vw; align-self: flex-start; } h2 { padding-top: 10%; padding-right: 2.5%; font-size: 3vw; align-self: flex-start; } h3 { padding-top: 15%; font-size: 2.5vw; padding-right: 2%; align-self: flex-start; } #bottom_menu { position: absolute; pointer-events: all !important; display: flex; justify-content: space-between; align-self: flex-end; z-index: 1000; background: white; height: 4%; width: 100%; font-family: Courier; font-weight: bold; font-size: 2vw; text-align: center; align-items: center; border: 1px #d152b8; } #bottom_menu a { padding: 1vw 3vw 1vw 3vw; color: #d152b8; } /* Hide scrollbar for Chrome, Safari and Opera */ #infotext, #infotext_en, #abouttext, #contacttext, #popuptext, #popuptext_en, #howtotext, #howtotext_en:-webkit-scrollbar { display: none; } /* Hide scrollbar for IE, Edge and Firefox */ #infotext, #infotext_en, #abouttext, #contacttext, #howtotext, #howtotext_en, #popuptext, #popuptext_en { -ms-overflow-style: none; /* IE and Edge */ scrollbar-width: none; /* Firefox */ } #infotext, #infotext_en, #abouttext, #contacttext, #howtotext, #howtotext_en, #popuptext, #popuptext_en { visibility: hidden; opacity:0; overflow-x: hidden !important; overflow-y: scroll !important; position: absolute; z-index: 1000; width: 80%; height: 70%; max-height: 100%; max-width: 100%; word-wrap: break-word; background-color: #d152b8; color: white; margin: 14% 10% 10% 10%; transition: opacity 1s; } #infotext p, #infotext_en p, #abouttext p, #howtotext p, #howtotext_en p { padding: 0% 10% 10% 10%; margin: 0; font-family: Arial; font-weight: bold; font-size: 1.5vw; color: white; } #popuptext p, #popuptext_en p { padding: 0% 10% 10% 10%; margin: 0; font-family: Arial; font-weight: bold; font-size: 2.5vw; color: white; } #infotext a, #infotext_en a, #abouttext a, #howtotext a, #howtotext_en a , #popuptext a, #popuptext_en a { color: white; } #howtotext a { text-decoration: underline !important; } #howto { font-size: 2vw; } #contacttext p { padding: 0% 10% 10% 10%; margin: 0; font-family: Arial; font-weight: bold; font-size: 1.5vw; color: white; } #contacttext a, #contacttext span, , #howtotext span, #howtotext_en span { color: white; padding-left: 5vw; font-size: 1.5vw; } #abouttext p { font-size: 1.5vw; } #abouttext span { font-size: 1.5vw; } #infobuttons { display: flex; flex-direction: row; justify-content: space-between; padding: 1vw; } #closeButton { height: min-content; width: min-content; font-family: Arial; font-size:2vw; font-weight:bold; padding:1%; cursor: pointer; margin: 0; } #enButton { position: relative; height: min-content; width: min-content; margin: 0; font-family: Arial; font-size:2vw; font-weight:bold; color: white; padding:1%; text-align: right; cursor: pointer; } #closeButtonbottom { position: relative; font-family: Arial; font-size: 2vw; font-weight: bold; text-align: center; padding-bottom: 5vh; margin: 0; cursor: pointer; } /*client location*/ .leaflet-control-locate a { padding-top: 4px; } .leaflet-control-locate a span { font-size: 1.4em; cursor: pointer; } .leaflet-control-locate.active a { color: #2A93EE; } .leaflet-control-locate.active.following a { color: #2A93EE; } @media only screen and (max-width: 768px) { h1 { font-size: 15vw; } h2 { padding-top: 10vh; font-size: 5vw; } h3 { padding-top: 15vh; font-size: 5vw; } #howto { font-size: 6vw; } #infotext, #infotext_en, #abouttext, #contacttext, #howtotext, #howtotext_en { visibility: hidden; overflow-x: hidden !important; overflow-y: scroll !important; position: absolute; z-index: 400; width: 90%; height: 73%; max-height: 100%; max-width: 100%; word-wrap: break-word; background-color: #d152b8; color: white; margin: 28% 5% 0% 5%; } #abouttext span { font-size: 4vw; } #contacttext p { font-size: 5vw; } #contacttext a, #contacttext span, , #howtotext span, #howtotext_en span { font-size: 4vw; } #closeButton, #enButton { font-family: Arial; font-size:4vw; font-weight:bold; padding:3%; } #closeButtonbottom { font-size:4vw; font-weight:bold; } #infotext p, #infotext_en p, #abouttext p, #contacttext p, #howtotext p, #howtotext_en p { padding: 20px; font-family: Arial; font-weight: bold; font-size: 4vw; margin: 0; } #bottom_menu { height: 5%; font-size: 5vw; } }