html,body{height:100%;margin:0}body{flex-direction:column;font-family:Arial,Helvetica,sans-serif;display:flex}h1{text-align:center;font-size:large}#app{width:100vw;height:100vh}.places-ui-kit{width:100%;height:100%;display:flex;position:absolute}.map-container{flex-grow:1;width:100%;height:100%}.place-list-wrapper{z-index:10;width:400px;max-height:500px;position:absolute;top:80px;right:40px;overflow-y:auto}.controls{position:absolute;top:40px;right:40px}.type-select{border:1px solid #000;border-radius:10px;flex-grow:1;width:400px;height:32px;padding:0 10px}gmp-place-search{border:none;border-radius:10px;width:100%;margin:0;display:block}gmp-place-details-compact{border:none;width:350px;max-height:800px;margin-right:20px;display:none}@media (width<=768px){.places-ui-kit{flex-direction:column}.place-list-wrapper{width:100%;max-height:40vh;position:relative;top:0;right:0}.controls{box-sizing:border-box;width:100%;padding:10px;position:relative;top:0;right:0}.type-select{width:100%}.map-container{height:60vh}}gmp-place-details-compact:after{content:"";z-index:1;clip-path:polygon(0% 0%,100% 0%,50% 100%);transform-origin:50%;background-color:#fff;width:20px;height:20px;position:absolute;bottom:-18px;left:50%;transform:translate(-50%);box-shadow:2px 2px 5px #0003}@media (prefers-color-scheme:dark){gmp-place-details-compact:after{background-color:#131314}}