1.ol-box { 2 box-sizing: border-box; 3 border-radius: 2px; 4 border: 2px solid blue; 5} 6 7.ol-mouse-position { 8 top: 8px; 9 right: 8px; 10 position: absolute; 11} 12 13.ol-scale-line { 14 background: rgba(0,60,136,0.3); 15 border-radius: 4px; 16 bottom: 8px; 17 left: 8px; 18 padding: 2px; 19 position: absolute; 20} 21.ol-scale-line-inner { 22 border: 1px solid #eee; 23 border-top: none; 24 color: #eee; 25 font-size: 10px; 26 text-align: center; 27 margin: 1px; 28 will-change: contents, width; 29} 30.ol-overlay-container { 31 will-change: left,right,top,bottom; 32} 33 34.ol-unsupported { 35 display: none; 36} 37.ol-viewport, .ol-unselectable { 38 -webkit-touch-callout: none; 39 -webkit-user-select: none; 40 -moz-user-select: none; 41 -ms-user-select: none; 42 user-select: none; 43 -webkit-tap-highlight-color: rgba(0,0,0,0); 44} 45.ol-selectable { 46 -webkit-touch-callout: default; 47 -webkit-user-select: auto; 48 -moz-user-select: auto; 49 -ms-user-select: auto; 50 user-select: auto; 51} 52.ol-grabbing { 53 cursor: -webkit-grabbing; 54 cursor: -moz-grabbing; 55 cursor: grabbing; 56} 57.ol-grab { 58 cursor: move; 59 cursor: -webkit-grab; 60 cursor: -moz-grab; 61 cursor: grab; 62} 63.ol-control { 64 position: absolute; 65 background-color: rgba(255,255,255,0.4); 66 border-radius: 4px; 67 padding: 2px; 68} 69.ol-control:hover { 70 background-color: rgba(255,255,255,0.6); 71} 72.ol-zoom { 73 top: .5em; 74 left: .5em; 75} 76.ol-rotate { 77 top: .5em; 78 right: .5em; 79 transition: opacity .25s linear, visibility 0s linear; 80} 81.ol-rotate.ol-hidden { 82 opacity: 0; 83 visibility: hidden; 84 transition: opacity .25s linear, visibility 0s linear .25s; 85} 86.ol-zoom-extent { 87 top: 4.643em; 88 left: .5em; 89} 90.ol-full-screen { 91 right: .5em; 92 top: .5em; 93} 94@media print { 95 .ol-control { 96 display: none; 97 } 98} 99 100.ol-control button { 101 display: block; 102 margin: 1px; 103 padding: 0; 104 color: white; 105 font-size: 1.14em; 106 font-weight: bold; 107 text-decoration: none; 108 text-align: center; 109 height: 1.375em; 110 width: 1.375em; 111 line-height: .4em; 112 background-color: rgba(0,60,136,0.5); 113 border: none; 114 border-radius: 2px; 115} 116.ol-control button::-moz-focus-inner { 117 border: none; 118 padding: 0; 119} 120.ol-zoom-extent button { 121 line-height: 1.4em; 122} 123.ol-compass { 124 display: block; 125 font-weight: normal; 126 font-size: 1.2em; 127 will-change: transform; 128} 129.ol-touch .ol-control button { 130 font-size: 1.5em; 131} 132.ol-touch .ol-zoom-extent { 133 top: 5.5em; 134} 135.ol-control button:hover, 136.ol-control button:focus { 137 text-decoration: none; 138 background-color: rgba(0,60,136,0.7); 139} 140.ol-zoom .ol-zoom-in { 141 border-radius: 2px 2px 0 0; 142} 143.ol-zoom .ol-zoom-out { 144 border-radius: 0 0 2px 2px; 145} 146 147 148.ol-attribution { 149 text-align: right; 150 bottom: .5em; 151 right: .5em; 152 max-width: calc(100% - 1.3em); 153} 154 155.ol-attribution ul { 156 margin: 0; 157 padding: 0 .5em; 158 font-size: .7rem; 159 line-height: 1.375em; 160 color: #000; 161 text-shadow: 0 0 2px #fff; 162} 163.ol-attribution li { 164 display: inline; 165 list-style: none; 166 line-height: inherit; 167} 168.ol-attribution li:not(:last-child):after { 169 content: " "; 170} 171.ol-attribution img { 172 max-height: 2em; 173 max-width: inherit; 174 vertical-align: middle; 175} 176.ol-attribution ul, .ol-attribution button { 177 display: inline-block; 178} 179.ol-attribution.ol-collapsed ul { 180 display: none; 181} 182.ol-attribution.ol-logo-only ul { 183 display: block; 184} 185.ol-attribution:not(.ol-collapsed) { 186 background: rgba(255,255,255,0.8); 187} 188.ol-attribution.ol-uncollapsible { 189 bottom: 0; 190 right: 0; 191 border-radius: 4px 0 0; 192 height: 1.1em; 193 line-height: 1em; 194} 195.ol-attribution.ol-logo-only { 196 background: transparent; 197 bottom: .4em; 198 height: 1.1em; 199 line-height: 1em; 200} 201.ol-attribution.ol-uncollapsible img { 202 margin-top: -.2em; 203 max-height: 1.6em; 204} 205.ol-attribution.ol-logo-only button, 206.ol-attribution.ol-uncollapsible button { 207 display: none; 208} 209 210.ol-zoomslider { 211 top: 4.5em; 212 left: .5em; 213 height: 200px; 214} 215.ol-zoomslider button { 216 position: relative; 217 height: 10px; 218} 219 220.ol-touch .ol-zoomslider { 221 top: 5.5em; 222} 223 224.ol-overviewmap { 225 left: 0.5em; 226 bottom: 0.5em; 227} 228.ol-overviewmap.ol-uncollapsible { 229 bottom: 0; 230 left: 0; 231 border-radius: 0 4px 0 0; 232} 233.ol-overviewmap .ol-overviewmap-map, 234.ol-overviewmap button { 235 display: inline-block; 236} 237.ol-overviewmap .ol-overviewmap-map { 238 border: 1px solid #7b98bc; 239 height: 150px; 240 margin: 2px; 241 width: 150px; 242} 243.ol-overviewmap:not(.ol-collapsed) button{ 244 bottom: 1px; 245 left: 2px; 246 position: absolute; 247} 248.ol-overviewmap.ol-collapsed .ol-overviewmap-map, 249.ol-overviewmap.ol-uncollapsible button { 250 display: none; 251} 252.ol-overviewmap:not(.ol-collapsed) { 253 background: rgba(255,255,255,0.8); 254} 255.ol-overviewmap-box { 256 border: 2px dotted rgba(0,60,136,0.7); 257} 258 259.ol-overviewmap .ol-overviewmap-box:hover { 260 cursor: move; 261} 262