@charset "UTF-8"; /* ==================================================
 * Snapic Plus for Map Main Stylesheet by Lopwon.
 * www.Lopwon.com
 * 2023-10-18
 * ------------------------------------------------------------------- */

html { height: 100%; } body { height: 100%; margin: 0; padding: 0; } .BMap_Marker img { width: calc(100% - 4px); height: calc(100% - 4px); max-width: 32px; max-height: 32px; object-fit: cover; border-radius: 50%; border: 2px solid cyan !important; } .Lopwon_Footprint { width: 100%; height: 100%; } .Lopwon_Footprint .copyright { position: absolute; bottom: 5px; left: 85px; font-size: 12px; z-index: 1; } .Lopwon_Footprint .copyright a { color: chocolate; text-decoration: none; } .Lopwon_Footprint .copyright a:hover { color: black; } .Lopwon_Footprint .content { width: 100%; height: 100%; margin: 0; padding: 0; } .Lopwon_Footprint-info { display: flex; width: 375px; height: 100%; max-height: 150px; min-height: 150px; } .Lopwon_Footprint-info p { margin: 0; margin-bottom: 10px; } .Lopwon_Footprint-info-img { position: relative; flex-shrink: 0; width: 100%; height: 0; max-width: 150px; max-height: 150px; padding-top: 150px; border-radius: 10px; overflow: hidden; } .Lopwon_Footprint-info-img img { position: absolute; top: 50%; left: 50%; width: 100%; height: 100% !important; max-width: 100%; max-height: 100%; object-fit: cover; -webkit-transform: translate(-50%, -50%) scale(1); -moz-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); -o-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; -o-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; } .Lopwon_Footprint-info img:hover { -webkit-transform: translate(-50%, -50%) scale(1.05); -moz-transform: translate(-50%, -50%) scale(1.05); -ms-transform: translate(-50%, -50%) scale(1.05); -o-transform: translate(-50%, -50%) scale(1.05); transform: translate(-50%, -50%) scale(1.05); } .Lopwon_Footprint-info-content { display: flex; flex-direction: column; justify-content: space-between; width: 100%; margin: 0; margin-top: 15px; padding: 0; padding-left: 15px; font-size: 14px; color: #333; line-height: 1.2; word-wrap: break-word; word-break: break-all; overflow-x: hidden; overflow-y: auto; } .Lopwon_Footprint-info-title { font-size: 16px; color: #39b54a; font-weight: bold; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box !important; -webkit-box-orient: vertical; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; } .Lopwon_Footprint-info-title:hover { color: #333; } .Lopwon_Footprint-info-content p { text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; line-clamp: 3; } .Lopwon_Footprint-info-content a { color: chocolate; text-decoration: none; } .Lopwon_Footprint-info-content a:hover { color: #333; } .Lopwon_Footprint-info-content img { position: relative; margin-bottom: -2px; margin-left: 5px; width: auto; height: 15px !important; } .Lopwon_Footprint-info-content img:hover { -webkit-transform: none; -moz-transform: none; -ms-transform: none; -o-transform: none; transform: none; } .Lopwon_Footprint-info-mark { margin: 0 !important; padding: 3px 7px; width: fit-content; font-size: 87.5%; line-height: 1.4; text-align: center; border-radius: 15px; background-color: cyan; -webkit-line-clamp: 1 !important; line-clamp: 1 !important; } @media screen and (max-width:400px) { .Lopwon_Footprint .copyright { bottom: 0; } .Lopwon_Footprint-info { width: 300px; max-height: 120px; min-height: 120px; } .Lopwon_Footprint-info-img { max-width: 80px; max-height: 120px; padding-top: 120px; } .Lopwon_Footprint-info-content { margin: 0; margin-top: 10px; padding: 0 10px; font-size: 12px; line-height: 1.4; } .Lopwon_Footprint-info-title { font-size: 14px; } }