.cesium-button { display: inline-block; position: relative; background: #303336; border: 1px solid #444; color: #edffff; fill: #edffff; border-radius: 4px; padding: 5px 12px; margin: 2px 3px; cursor: pointer; overflow: hidden; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none } .cesium-button:focus { color: #fff; fill: #fff; border-color: #ea4; outline: none } .cesium-button:hover { color: #fff; fill: #fff; background: #48b; border-color: #aef; box-shadow: 0 0 8px #fff } .cesium-button:active { color: #000; fill: #000; background: #adf; border-color: #fff; box-shadow: 0 0 8px #fff } .cesium-button:disabled, .cesium-button-disabled, .cesium-button-disabled:focus, .cesium-button-disabled:hover, .cesium-button-disabled:active { background: #303336; border-color: #444; color: #646464; fill: #646464; box-shadow: none; cursor: default } .cesium-button option { background-color: #000; color: #eee } .cesium-button option:disabled { color: #777 } .cesium-button input, .cesium-button label { cursor: pointer } .cesium-button input { vertical-align: sub } .cesium-toolbar-button { box-sizing: border-box; width: 32px; height: 32px; border-radius: 14%; padding: 0; vertical-align: middle; z-index: 0 } .cesium-performanceDisplay-defaultContainer { position: absolute; top: 50px; right: 10px; text-align: right } .cesium-performanceDisplay { background-color: #282828b3; padding: 7px; border-radius: 5px; border: 1px solid #444; font: 700 12px sans-serif } .cesium-performanceDisplay-fps { color: #e52 } .cesium-performanceDisplay-throttled { color: #a42 } .cesium-performanceDisplay-ms { color: #de3 } .cesium-animation-theme { visibility: hidden; display: block; position: absolute; z-index: -100 } .cesium-animation-themeNormal { color: #222 } .cesium-animation-themeHover { color: #4488b0 } .cesium-animation-themeSelect { color: #242 } .cesium-animation-themeDisabled { color: #333 } .cesium-animation-themeKnob { color: #222 } .cesium-animation-themePointer { color: #2e2 } .cesium-animation-themeSwoosh { color: #8ac } .cesium-animation-themeSwooshHover { color: #aef } .cesium-animation-svgText { fill: #edffff; font-family: Sans-Serif; font-size: 15px; text-anchor: middle } .cesium-animation-blank { fill: #000; fill-opacity: .01; stroke: none } .cesium-animation-rectButton { cursor: pointer; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none } .cesium-animation-rectButton .cesium-animation-buttonGlow { fill: #fff; stroke: none; display: none } .cesium-animation-rectButton:hover .cesium-animation-buttonGlow { display: block } .cesium-animation-rectButton .cesium-animation-buttonPath { fill: #edffff } .cesium-animation-rectButton .cesium-animation-buttonMain { stroke: #444; stroke-width: 1.2 } .cesium-animation-rectButton:hover .cesium-animation-buttonMain { stroke: #aef } .cesium-animation-rectButton:active .cesium-animation-buttonMain { fill: #abd6ff } .cesium-animation-buttonDisabled { -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none } .cesium-animation-buttonDisabled .cesium-animation-buttonMain { stroke: #555 } .cesium-animation-buttonDisabled .cesium-animation-buttonPath { fill: #818181 } .cesium-animation-buttonDisabled .cesium-animation-buttonGlow { display: none } .cesium-animation-buttonToggled .cesium-animation-buttonGlow { display: block; fill: #2e2 } .cesium-animation-buttonToggled .cesium-animation-buttonMain { stroke: #2e2 } .cesium-animation-buttonToggled:hover .cesium-animation-buttonGlow { fill: #fff } .cesium-animation-buttonToggled:hover .cesium-animation-buttonMain { stroke: #2e2 } .cesium-animation-shuttleRingG, .cesium-animation-shuttleRingPointer, .cesium-animation-shuttleRingPausePointer { cursor: pointer } .cesium-animation-shuttleRingBack { fill: #181818; fill-opacity: .8; stroke: #333; stroke-width: 1.2 } .cesium-animation-shuttleRingSwoosh line { stroke: #8ac; stroke-width: 3; stroke-opacity: .2; stroke-linecap: round } .cesium-animation-knobOuter { cursor: pointer; stroke: #444; stroke-width: 1.2 } .cesium-animation-knobInner { cursor: pointer } .cesium-baseLayerPicker-selected { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: none } .cesium-baseLayerPicker-dropDown { display: block; position: absolute; box-sizing: content-box; top: auto; right: 0; width: 320px; max-height: 500px; margin-top: 5px; background-color: #262626bf; border: 1px solid #444; padding: 6px; overflow: auto; border-radius: 10px; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; transform: translateY(-20%); visibility: hidden; opacity: 0; transition: visibility 0s .2s, opacity .2s ease-in, transform .2s ease-in } .cesium-baseLayerPicker-dropDown-visible { transform: translate(0); visibility: visible; opacity: 1; transition: opacity .2s ease-out, transform .2s ease-out } .cesium-baseLayerPicker-sectionTitle { display: block; font-family: sans-serif; font-size: 16pt; text-align: left; color: #edffff; margin-bottom: 4px } .cesium-baseLayerPicker-choices { margin-bottom: 5px } .cesium-baseLayerPicker-categoryTitle { color: #edffff; font-size: 11pt } .cesium-baseLayerPicker-choices { display: block; border: 1px solid #888; border-radius: 5px; padding: 5px 0 } .cesium-baseLayerPicker-item { display: inline-block; vertical-align: top; margin: 2px 5px; width: 64px; text-align: center; cursor: pointer } .cesium-baseLayerPicker-itemLabel { display: block; font-family: sans-serif; font-size: 8pt; text-align: center; vertical-align: middle; color: #edffff; cursor: pointer; word-wrap: break-word } .cesium-baseLayerPicker-item:hover .cesium-baseLayerPicker-itemLabel, .cesium-baseLayerPicker-item:focus .cesium-baseLayerPicker-itemLabel { text-decoration: underline } .cesium-baseLayerPicker-itemIcon { display: inline-block; position: relative; width: inherit; height: auto; background-size: 100% 100%; border: solid 1px #444; border-radius: 9px; color: #edffff; margin: 0; padding: 0; cursor: pointer; box-sizing: border-box } .cesium-baseLayerPicker-item:hover .cesium-baseLayerPicker-itemIcon { border-color: #fff; box-shadow: 0 0 8px #fff, 0 0 8px #fff } .cesium-baseLayerPicker-selectedItem .cesium-baseLayerPicker-itemLabel { color: #bdecf8 } .cesium-baseLayerPicker-selectedItem .cesium-baseLayerPicker-itemIcon { border: double 4px rgb(189, 236, 248) } .cesium-widget { font-family: sans-serif; font-size: 16px; overflow: hidden; display: block; position: relative; top: 0; left: 0; width: 100%; height: 100% } .cesium-widget, .cesium-widget canvas { width: 100%; height: 100%; touch-action: none } .cesium-widget-credits { display: block; position: absolute; bottom: 0; left: 0; color: #fff; font-size: 10px; text-shadow: 0px 0px 2px #000000; padding-right: 5px } .cesium-widget-credits a, .cesium-widget-credits a:visited { color: #fff } .cesium-widget-errorPanel { position: absolute; inset: 0; text-align: center; background: rgba(0, 0, 0, .7); z-index: 99999 } .cesium-widget-errorPanel:before { display: inline-block; vertical-align: middle; height: 100%; content: "" } .cesium-widget-errorPanel-content { width: 75%; max-width: 500px; display: inline-block; text-align: left; vertical-align: middle; border: 1px solid #510c00; border-radius: 7px; background-color: #f0d9d5; font-size: 14px; color: #510c00 } .cesium-widget-errorPanel-content.expanded { max-width: 75% } .cesium-widget-errorPanel-header { font-size: 18px; font-family: Open Sans, Verdana, Geneva, sans-serif; background: #d69d93; border-bottom: 2px solid #510c00; border-radius: 3px 3px 0 0; padding: 15px } .cesium-widget-errorPanel-scroll { overflow: auto; font-family: Open Sans, Verdana, Geneva, sans-serif; white-space: pre-wrap; padding: 0 15px; margin: 10px 0 20px } .cesium-widget-errorPanel-buttonPanel { padding: 0 15px; margin: 10px 0 20px; text-align: right } .cesium-widget-errorPanel-buttonPanel button { border-color: #510c00; background: #d69d93; color: #202020; margin: 0 } .cesium-widget-errorPanel-buttonPanel button:focus { border-color: #510c00; background: #f0d9d5; color: #510c00 } .cesium-widget-errorPanel-buttonPanel button:hover { border-color: #510c00; background: #f0d9d5; color: #510c00 } .cesium-widget-errorPanel-buttonPanel button:active { border-color: #510c00; background: #b17b72; color: #510c00 } .cesium-widget-errorPanel-more-details { text-decoration: underline; cursor: pointer } .cesium-widget-errorPanel-more-details:hover { color: #2b0700 } .cesium-cesiumInspector { border-radius: 5px; transition: width ease-in-out .25s; background: rgba(48, 51, 54, .8); border: 1px solid #444; color: #edffff; display: inline-block; position: relative; padding: 4px 12px; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; overflow: hidden } .cesium-cesiumInspector-button { text-align: center; font-size: 11pt } .cesium-cesiumInspector-visible .cesium-cesiumInspector-button { border-bottom: 1px solid #aaa; padding-bottom: 3px } .cesium-cesiumInspector input:enabled, .cesium-cesiumInspector-button { cursor: pointer } .cesium-cesiumInspector-visible { width: 210px; height: auto } .cesium-cesiumInspector-hidden { width: 122px; height: 17px } .cesium-cesiumInspector-sectionContent { max-height: 500px } .cesium-cesiumInspector-section-collapsed .cesium-cesiumInspector-sectionContent { max-height: 0; padding: 0 !important; overflow: hidden } .cesium-cesiumInspector-dropDown { margin: 5px 0; font-family: sans-serif; font-size: 10pt; width: 185px } .cesium-cesiumInspector-frustumStatistics { padding: 5px; background-color: #505050bf } .cesium-cesiumInspector-pickButton { background-color: #0000004d; border: 1px solid #444; color: #edffff; border-radius: 5px; padding: 3px 7px; cursor: pointer; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none; margin: 0 auto } .cesium-cesiumInspector-pickButton:focus { outline: none } .cesium-cesiumInspector-pickButton:active, .cesium-cesiumInspector-pickButtonHighlight { color: #000; background: #adf; border-color: #fff; box-shadow: 0 0 8px #fff } .cesium-cesiumInspector-center { text-align: center } .cesium-cesiumInspector-sectionHeader { font-weight: 700; font-size: 10pt; margin: 0; cursor: pointer } .cesium-cesiumInspector-pickSection { border: 1px solid #aaa; border-radius: 5px; padding: 3px; margin-bottom: 5px } .cesium-cesiumInspector-sectionContent { margin-bottom: 10px; transition: max-height .25s } .cesium-cesiumInspector-tileText { padding-bottom: 10px; border-bottom: 1px solid #aaa } .cesium-cesiumInspector-relativeText { padding-top: 10px } .cesium-cesiumInspector-sectionHeader:before { margin-right: 5px; content: "-"; width: 1ch; display: inline-block } .cesium-cesiumInspector-section-collapsed .cesium-cesiumInspector-sectionHeader:before { content: "+" } ul.cesium-cesiumInspector-statistics { margin: 0; padding-top: 3px; padding-bottom: 3px } ul.cesium-cesiumInspector-statistics+ul.cesium-cesiumInspector-statistics { border-top: 1px solid #aaa } .cesium-cesiumInspector-slider { margin-top: 5px } .cesium-cesiumInspector-slider input[type=number] { text-align: left; background-color: #222; outline: none; border: 1px solid #444; color: #edffff; width: 100px; border-radius: 3px; padding: 1px; margin-left: 10px; cursor: auto } .cesium-cesiumInspector-slider input[type=number]::-webkit-outer-spin-button, .cesium-cesiumInspector-slider input[type=number]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0 } .cesium-cesiumInspector-slider input[type=range] { margin-left: 5px; vertical-align: middle } .cesium-cesiumInspector-hide .cesium-cesiumInspector-styleEditor { display: none } .cesium-cesiumInspector-styleEditor { padding: 10px; border-radius: 5px; background: rgba(48, 51, 54, .8); border: 1px solid #444 } .cesium-cesiumInspector-styleEditor textarea { width: 100%; height: 300px; background: transparent; color: #edffff; border: none; padding: 0; white-space: pre; overflow-wrap: normal; overflow-x: auto } .cesium-3DTilesInspector { width: 300px; pointer-events: all } .cesium-3DTilesInspector-statistics { font-size: 11px } .cesium-3DTilesInspector-disabledElementsInfo { margin: 5px 0 0; padding: 0 0 0 20px; color: #eed202 } .cesium-3DTilesInspector div, .cesium-3DTilesInspector input[type=range] { width: 100%; box-sizing: border-box } .cesium-cesiumInspector-error { color: #ff9e9e; overflow: auto } .cesium-3DTilesInspector .cesium-cesiumInspector-section { margin-top: 3px } .cesium-3DTilesInspector .cesium-cesiumInspector-sectionHeader+.cesium-cesiumInspector-show { border-top: 1px solid white } input.cesium-cesiumInspector-url { overflow: hidden; white-space: nowrap; overflow-x: scroll; background-color: transparent; color: #fff; outline: none; border: none; height: 1em; width: 100% } .cesium-cesiumInspector .field-group { display: table } .cesium-cesiumInspector .field-group>label { display: table-cell; font-weight: 700 } .cesium-cesiumInspector .field-group>.field { display: table-cell; width: 100% } .cesium-VoxelInspector { width: 300px; pointer-events: all } .cesium-VoxelInspector div, .cesium-VoxelInspector input[type=range] { width: 100%; box-sizing: border-box } .cesium-VoxelInspector .cesium-cesiumInspector-section { margin-top: 3px } .cesium-VoxelInspector .cesium-cesiumInspector-sectionHeader+.cesium-cesiumInspector-show { border-top: 1px solid white } .cesium-button.cesium-fullscreenButton, .cesium-button.cesium-vrButton { display: block; width: 100%; height: 100%; margin: 0; border-radius: 0 } .cesium-viewer-geocoderContainer .cesium-geocoder-input { border: solid 1px #444; background-color: #282828b3; color: #fff; display: inline-block; vertical-align: middle; width: 0; height: 32px; margin: 0; padding: 0 32px 0 0; border-radius: 0; box-sizing: border-box; transition: width ease-in-out .25s, background-color .2s ease-in-out; -webkit-appearance: none } .cesium-viewer-geocoderContainer:hover .cesium-geocoder-input { border-color: #aef; box-shadow: 0 0 8px #fff } .cesium-viewer-geocoderContainer .cesium-geocoder-input:focus { border-color: #ea4; background-color: #0f0f0fe6; box-shadow: none; outline: none } .cesium-viewer-geocoderContainer:hover .cesium-geocoder-input, .cesium-viewer-geocoderContainer .cesium-geocoder-input:focus, .cesium-viewer-geocoderContainer .cesium-geocoder-input-wide { padding-left: 4px; width: 250px } .cesium-viewer-geocoderContainer .search-results { position: absolute; background-color: #000; color: #eee; overflow-y: auto; opacity: .8; width: 100% } .cesium-viewer-geocoderContainer .search-results ul { list-style-type: none; margin: 0; padding: 0 } .cesium-viewer-geocoderContainer .search-results ul li { font-size: 14px; padding: 3px 10px } .cesium-viewer-geocoderContainer .search-results ul li:hover { cursor: pointer } .cesium-viewer-geocoderContainer .search-results ul li.active { background: #48b } .cesium-geocoder-searchButton { background-color: #303336; display: inline-block; position: absolute; cursor: pointer; width: 32px; top: 1px; right: 1px; height: 30px; vertical-align: middle; fill: #edffff } .cesium-geocoder-searchButton:hover { background-color: #48b } .cesium-infoBox { display: block; position: absolute; top: 50px; right: 0; width: 40%; max-width: 480px; background: rgba(38, 38, 38, .95); color: #edffff; border: 1px solid #444; border-right: none; border-top-left-radius: 7px; border-bottom-left-radius: 7px; box-shadow: 0 0 10px 1px #000; transform: translate(100%); visibility: hidden; opacity: 0; transition: visibility 0s .2s, opacity .2s ease-in, transform .2s ease-in } .cesium-infoBox-visible { transform: translate(0); visibility: visible; opacity: 1; transition: opacity .2s ease-out, transform .2s ease-out } .cesium-infoBox-title { display: block; height: 20px; padding: 5px 30px 5px 25px; background: rgba(84, 84, 84, 1); border-top-left-radius: 7px; text-align: center; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; box-sizing: content-box } .cesium-infoBox-bodyless .cesium-infoBox-title { border-bottom-left-radius: 7px } button.cesium-infoBox-camera { display: block; position: absolute; top: 4px; left: 4px; width: 22px; height: 22px; background: transparent; border-color: transparent; border-radius: 3px; padding: 0 5px; margin: 0 } button.cesium-infoBox-close { display: block; position: absolute; top: 5px; right: 5px; height: 20px; background: transparent; border: none; border-radius: 2px; font-weight: 700; font-size: 16px; padding: 0 5px; margin: 0; color: #edffff } button.cesium-infoBox-close:focus { background: rgba(238, 136, 0, .44); outline: none } button.cesium-infoBox-close:hover { background: #888; color: #000 } button.cesium-infoBox-close:active { background: #a00; color: #000 } .cesium-infoBox-bodyless .cesium-infoBox-iframe { display: none } .cesium-infoBox-iframe { border: none; width: 100%; width: calc(100% - 2px) } span.cesium-sceneModePicker-wrapper { display: inline-block; position: relative; margin: 0 3px } .cesium-sceneModePicker-visible { visibility: visible; opacity: 1; transition: opacity .25s linear } .cesium-sceneModePicker-hidden { visibility: hidden; opacity: 0; transition: visibility 0s .25s, opacity .25s linear } .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-none { display: none } .cesium-sceneModePicker-slide-svg { transition: left 2s; top: 0; left: 0 } .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-dropDown-icon { box-sizing: border-box; padding: 0; margin: 3px 0 } .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-button3D, .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-buttonColumbusView, .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-button2D { margin: 0 0 3px } .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-button3D .cesium-sceneModePicker-icon2D { left: 100% } .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-button3D .cesium-sceneModePicker-iconColumbusView { left: 200% } .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-buttonColumbusView .cesium-sceneModePicker-icon3D { left: -200% } .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-buttonColumbusView .cesium-sceneModePicker-icon2D, .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-button2D .cesium-sceneModePicker-icon3D { left: -100% } .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-button2D .cesium-sceneModePicker-iconColumbusView { left: 100% } .cesium-sceneModePicker-wrapper .cesium-sceneModePicker-selected { border-color: #2e2; box-shadow: 0 0 8px #fff, 0 0 8px #fff } span.cesium-projectionPicker-wrapper { display: inline-block; position: relative; margin: 0 3px } .cesium-projectionPicker-visible { visibility: visible; opacity: 1; transition: opacity .25s linear } .cesium-projectionPicker-hidden { visibility: hidden; opacity: 0; transition: visibility 0s .25s, opacity .25s linear } .cesium-projectionPicker-wrapper .cesium-projectionPicker-none { display: none } .cesium-projectionPicker-wrapper .cesium-projectionPicker-dropDown-icon { box-sizing: border-box; padding: 0; margin: 3px 0 } .cesium-projectionPicker-wrapper .cesium-projectionPicker-buttonPerspective, .cesium-projectionPicker-wrapper .cesium-projectionPicker-buttonOrthographic { margin: 0 0 3px } .cesium-projectionPicker-wrapper .cesium-projectionPicker-buttonPerspective .cesium-projectionPicker-iconOrthographic { left: 100% } .cesium-projectionPicker-wrapper .cesium-projectionPicker-buttonOrthographic .cesium-projectionPicker-iconPerspective { left: -100% } .cesium-projectionPicker-wrapper .cesium-projectionPicker-selected { border-color: #2e2; box-shadow: 0 0 8px #fff, 0 0 8px #fff } .cesium-performance-watchdog-message-area { position: relative; background-color: #ff0; color: #000; padding: 10px } .cesium-performance-watchdog-message { margin-right: 30px } .cesium-performance-watchdog-message-dismiss { position: absolute; right: 0; margin: 0 10px 0 0 } .cesium-navigationHelpButton-wrapper { position: relative; display: inline-block } .cesium-navigation-help { visibility: hidden; position: absolute; top: 38px; right: 2px; width: 250px; border-radius: 10px; transform: scale(.01); transform-origin: 234px -10px; transition: visibility 0s .25s, transform .25s ease-in } .cesium-navigation-help-visible { visibility: visible; transform: scale(1); transition: transform .25s ease-out } .cesium-navigation-help-instructions { border: 1px solid #444; background-color: #262626bf; padding-bottom: 5px; border-radius: 0 0 10px 10px } .cesium-click-navigation-help { display: none } .cesium-touch-navigation-help { display: none; padding-top: 5px } .cesium-click-navigation-help-visible, .cesium-touch-navigation-help-visible { display: block } .cesium-navigation-help-pan { color: #6cf; font-weight: 700 } .cesium-navigation-help-zoom { color: #65fd00; font-weight: 700 } .cesium-navigation-help-rotate { color: #ffd800; font-weight: 700 } .cesium-navigation-help-tilt { color: #d800d8; font-weight: 700 } .cesium-navigation-help-details { color: #fff } .cesium-navigation-button { color: #fff; background-color: transparent; border-bottom: none; border-top: 1px solid #444; border-right: 1px solid #444; margin: 0; width: 50%; cursor: pointer } .cesium-navigation-button-icon { vertical-align: middle; padding: 5px 1px } .cesium-navigation-button:focus { outline: none } .cesium-navigation-button-left { border-radius: 10px 0 0; border-left: 1px solid #444 } .cesium-navigation-button-right { border-radius: 0 10px 0 0; border-left: none } .cesium-navigation-button-selected { background-color: #262626bf } .cesium-navigation-button-unselected { background-color: #000000bf } .cesium-navigation-button-unselected:hover { background-color: #4c4c4cbf } .cesium-selection-wrapper { position: absolute; width: 160px; height: 160px; pointer-events: none; visibility: hidden; opacity: 0; transition: visibility 0s .2s, opacity .2s ease-in } .cesium-selection-wrapper-visible { visibility: visible; opacity: 1; transition: opacity .2s ease-out } .cesium-selection-wrapper svg { fill: #2e2; stroke: #000; stroke-width: 1.1px } .cesium-timeline-main { position: relative; left: 0; bottom: 0; overflow: hidden; border: solid 1px #888; -moz-user-select: none; -webkit-user-select: none; -ms-user-select: none; user-select: none } .cesium-timeline-trackContainer { width: 100%; overflow: auto; border-top: solid 1px #888; position: relative; top: 0; left: 0 } .cesium-timeline-tracks { position: absolute; top: 0; left: 0; width: 100% } .cesium-timeline-needle { position: absolute; left: 0; top: 1.7em; bottom: 0; width: 1px; background: #f00 } .cesium-timeline-bar { position: relative; left: 0; top: 0; overflow: hidden; cursor: pointer; width: 100%; height: 1.7em; background: linear-gradient(to bottom, rgba(116, 117, 119, .8) 0%, rgba(58, 68, 82, .8) 11%, rgba(46, 50, 56, .8) 46%, rgba(53, 53, 53, .8) 81%, rgba(53, 53, 53, .8) 100%) } .cesium-timeline-ruler { visibility: hidden; white-space: nowrap; font-size: 80%; z-index: -200 } .cesium-timeline-highlight { position: absolute; bottom: 0; left: 0; background: #08f } .cesium-timeline-ticLabel { position: absolute; top: 0; left: 0; white-space: nowrap; font-size: 80%; color: #eee } .cesium-timeline-ticMain { position: absolute; bottom: 0; left: 0; width: 1px; height: 50%; background: #eee } .cesium-timeline-ticSub { position: absolute; bottom: 0; left: 0; width: 1px; height: 33%; background: #aaa } .cesium-timeline-ticTiny { position: absolute; bottom: 0; left: 0; width: 1px; height: 25%; background: #888 } .cesium-timeline-icon16 { display: block; position: absolute; width: 16px; height: 16px; background-image: url(data:text/plain;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAQCAYAAAB3AH1ZAAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAd0SU1FB9sIDBITKIVzLEMAAAKNSURBVEjHxdXNSxRhHAfw7zzrqhuoWJnSkrippUVSEKsHI9BTUYdAJA/RoYMREV26rAdn6tAfUARi16hQqkOBQRgUEYFWEC3OwczMjdZd92VmdWfmeelgTjO7q7gb0VzmmZnn85vvPPPMM8B/3qTcE2PPpuTZKB1eWuUQACgXYACYwVFbCTTVeZXB/i55o4LFelcAZfStYD4vpAoPGAGo4GBcQEgSOAUMQyAezwK6iQfDPXnhS/FkHZ+/8VLMWxxqWkfH3gbMRNOYi2roavbja0zHQmoFPYf8ED4Ko4aivm9MOG/u9I8mwrafeK7a/tVrNc/bARYN5noadeq7q0342vXw9CIMU6BmW8rVP9cPBPe52uu+v3O/y9sB4gkTWs6Qsk0mj5ExXMelejvA8WafYmkmGPHanTijdtvif8rx5RiCjdWKs2Cp3jWRDl96KhrbqlBeJqBOLyLQXg0IgbkZDS0dO8EZxZfPSTA9jvDDK3mT0OmP1FXh3XwEEAKdTX5MRWLgjCK4pwH3xt/YnjgLHAv4lHTCAKMMu/wV+KZGob6PoKyMQ0+sgBpZVJZn0NterxQaVqef/DRn+/EXYds/mZx2eVeAW9d65dhCEsaKCb7K8HH0gqTevyh9GDkn0VULRiaLzJKGBu9swfdaiie5RVo9ESURN8E8BE0n7ggACJy8KzghSCzp6DmwWxkaCm24EBXr8wI8Hrkq06QBiRC0t24HALS11IBTCyJl4vb1AXmzpbVYTwoVOXN0h7L8Mwtm8bXPybIQ/5FCX3dA2cr6XowvGCA02CvztAnz9+JiZk1AMxG6fEreSoBiPNmoyNnuWiWVzAIAtISO08E6pZi/3N96AIDn4E3h3P8L/wshP+txtEs4JAAAAABJRU5ErkJggg==); background-repeat: no-repeat } .cesium-viewer { font-family: sans-serif; font-size: 16px; overflow: hidden; display: block; position: relative; top: 0; left: 0; width: 100%; height: 100% } .cesium-viewer-cesiumWidgetContainer { width: 100%; height: 100% } .cesium-viewer-bottom { display: block; position: absolute; bottom: 0; left: 0; padding-right: 5px } .cesium-viewer .cesium-widget-credits { display: inline; position: static; bottom: auto; left: auto; padding-right: 0; color: #fff; font-size: 10px; text-shadow: 0 0 2px #000000 } .cesium-viewer-timelineContainer { position: absolute; bottom: 0; left: 169px; right: 29px; height: 27px; padding: 0; margin: 0; overflow: hidden; font-size: 14px } .cesium-viewer-animationContainer { position: absolute; bottom: 0; left: 0; padding: 0; width: 169px; height: 112px } .cesium-viewer-fullscreenContainer, .cesium-viewer-vrContainer { position: absolute; bottom: 0; right: 0; padding: 0; width: 29px; height: 29px; overflow: hidden } .cesium-viewer-toolbar { display: block; position: absolute; top: 5px; right: 5px } .cesium-viewer-cesiumInspectorContainer { display: block; position: absolute; top: 50px; right: 10px } .cesium-viewer-geocoderContainer { position: relative; display: inline-block; margin: 0 3px } .cesium-viewer-cesium3DTilesInspectorContainer, .cesium-viewer-voxelInspectorContainer { display: block; position: absolute; top: 50px; right: 10px; max-height: calc(100% - 120px); box-sizing: border-box; overflow-y: auto; overflow-x: hidden } .divPoint-camera-content { height: 30px } .divPoint-camera-img { width: 30px; height: 30px; animation: cameraMove 1s linear infinite alternate; -webkit-animation: cameraMove 1s linear infinite alternate } @keyframes cameraMove { 0% { margin-top: 20px } to { margin-top: 0 } } @-webkit-keyframes cameraMove { 0% { margin-top: 20px } to { margin-top: 0 } } .divPoint-camera-line { height: 120px; width: 5px; margin-top: 20px; border-left: 3px dashed #5b8fee; margin-left: calc(50% - 1px) } .divPoint-camera-point { border-radius: 50%; width: 8px; height: 8px; margin-left: calc(50% - 3px); background-color: #5b8fee } body, html { height: 100%; margin: 0; padding: 0; overflow: hidden; user-select: none } #cesiumContainer { width: 100%; height: 100%; background-color: #000; background-size: cover } .navigation-controls { position: absolute; right: 70px !important; top: calc(100% - 182px) !important; width: 30px; border: 1px solid rgba(255, 255, 255, .1); font-weight: 300; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none } .funcBox { position: absolute; top: 30px; padding: 10px; background-color: #000000b3; border-radius: 4px; left: 20px } .funcBox label { color: #fff !important } blockquote, body, button, dd, div, dl, dt, form, h1, h2, h3, h4, h5, h6, input, li, ol, p, pre, td, textarea, th, ul { margin: 0; padding: 0; -webkit-tap-highlight-color: rgba(0, 0, 0, 0) } a:active, a:hover { outline: 0 } li { list-style: none } #sdkContainer { width: 100%; height: 100%; background-color: #000; background-size: cover } .cesium-viewer-cesiumInspectorContainer, .cesium-viewer-animationContainer, .cesium-viewer-timelineContainer { display: none } .distance-legend { right: 75px !important; bottom: 38px !important } .resultToolTipClose { padding-right: 16px !important } .resultToolTipClose:after { content: "x"; font: 16px/14px Tahoma, Verdana, sans-serif; position: absolute; pointer-events: all; cursor: pointer; top: 0; right: 0; padding: 4px 4px 0 0; font-weight: 700 } .other-class { border-radius: 5px; background-color: #00000080 !important; border: 1px solid rgba(32, 160, 255, .6) !important } .other-class .layui-layer-title { background: #777; font-weight: 700; color: #fff } .other-class .layui-layer-content { background: rgba(0, 0, 0, 0) } .layui-layer-setwin .layui-layer-close1 { background-position: -95px -130px } .layui-layer-iframe { overflow-y: hidden !important } .smartEarthBlackPanel { min-width: 90px; min-height: 35px; position: absolute; left: 16px; bottom: 31px; cursor: default; opacity: .96; border: 1px solid #14171c; box-shadow: 0 2px 21px #2122278c; border-radius: 4px; box-sizing: border-box; background: linear-gradient(0deg, #1e202a 0%, #0d1013 100%) } .smartEarthBlackPanel:before { content: ""; width: calc(100% + 22px); height: 39px; position: absolute; bottom: -39px; left: -22px; background: url(data:text/plain;base64,iVBORw0KGgoAAAANSUhEUgAAB4AAAAAlCAYAAACj1PQVAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MTJFMTU1RjExN0UzMTFFOTg3RTBFODdGNTY0NThGQkUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MTJFMTU1RjIxN0UzMTFFOTg3RTBFODdGNTY0NThGQkUiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoxMkUxNTVFRjE3RTMxMUU5ODdFMEU4N0Y1NjQ1OEZCRSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoxMkUxNTVGMDE3RTMxMUU5ODdFMEU4N0Y1NjQ1OEZCRSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pj97JFoAAAV9SURBVHja7N1faJ1nHQfw33nzpuekaZfWNFmbLHXWdf7DWgvebF4M0SEZhTG8mKvFyzG9UJFKh9peVGnd0DkE/10Ic6s6BBEGbshggho3BVGnRnC2s1n/ras2J2uzc05PXp+3yZzSm7XJkvfi84HveZ9z3ve8F7/bL8/71oqiiMs8NhCLsCllfcpfAwAAAAAAAIDlsXM68jfgtl9K2Z3Sa8IAAAAAAAAAb7hjKW8uF9kS3/jdKR9PaZkxAAAAAAAAwPJa6h3A96X0pBxK+bLxAgAAAAAAACyfpSyAP5jy4ZQXUh747687p00ZAAAAAAAAYBlkS3if+xfW+1MuGC0AAAAAAADA8lqqAnh3yvaUZ1MeMlYAAAAAAACA5bcUBXBfyoGF9edSusYKAAAAAAAAsPyWogD+VMpYypMpTxgpAAAAAAAAwMpYbAG8IWVvylzKHuMEAAAAAAAAWDmLLYC/mDKQ8nDKH4wTAAAAAAAAYOUspgC+IeWelNmYL4IBAAAAAAAAWEGLKYAPpfSmfD1lyigBAAAAAAAAVtbVFsA3pdyR8lLMF8EAAAAAAAAArLCrKYBrKfcvHA+kNI0RAAAAAAAAYOVdTQFc7vwtdwA/l/ItIwQAAAAAAACohistgMt3/h5cWO9N6RghAAAAAAAAQDVcaQF8d8rWlImUnxgfAAAAAAAAQHVcSQF8Tcq+lCJlz8IRAAAAAAAAgIq4kgK4fOTzUMzv/J0wOgAAAAAAAIBqeb0F8FjKp2P+nb97jQ0AAAAAAACgel5vAXwgpS/l2ynPGRsAAAAAAABA9eSjd370sh+P7/q/r9tTdqc0Y74IBgAAAAAAAKCC8v9Zl7uB6yn9o4fHG+lYS2n/867Hv5bXivLcoZQzRgYAAAAAAABQTfnw5nvjxWMHe9N6cP+OyVtv2nj2ruFG6209WbGqM5c181rx9m5RO/ngn2/4zlf/tLV2fNfPCmMDAAAAAAAAqJ68LH+HGq2xRz7wu2+8a31zvCgiLs5FlC3vqp4YKS8638mzqZf7tqXlb1MuGBsAAAAAAABA9ZSPdh58tfyd7UScOh9xYjqLszNZlGVwN6U/71z7hR1/e/g9g9NbRg+P9xobAAAAAAAAQPVk+3ZMfujV8vf0TC3WXWzE9ZveHyNjt0UxOxCnp7NotiPWr2pfl67dk/6zxtgAAAAAAAAAqie7eePZXeVO33OtiOGsHqtvfjDi1scibnkkesafipHVI3HuQi3a3Yh3rpsZT/+5ZvTweM3oAAAAAAAAAKolH2q0byzf+dtuZ9G/8b0RW+587ezat0a84xPR+8z+aHU7MVDvbLhl05lrf3FyaGr08Hj5muA4/qMfmiIAAAAAAABABWS1KPJLTW75UR+8/Ir6uksvCi6K+a/Dfa26sQEAAAAAAABUT/ZyJz+Z19IiL6J7eiLi/NRrZ4tuxNEfRzvmorcnoj2XvfL41MZTMV8XAwAAAAAAAFAh2eS5tU9kWcRAo4ipC9MRP98ZMfnNiH/8IOLJO+LMC7+ORl83Gj0RR5r9z8x08nOhAAYAAAAAAAConPyzT2976H1D//7YYL21ZW5NN442n4/ep/ddeuxzK+air68bb2pEdCN75dEj192Xfp4xNgAAAAAAAIDqyWY6+akHnt16d7Oz6uRAPWJkoIi1azuxek0nhge6MdQXUatlrZ8+P/L5706+ZSLKXhgAAAAAAACAyik3+s5+/++bJ+751fbbfv/S+kc7c/l0WQSva0TUe2rtIzNrJr7yxxs/8pnfbPteurY5vPlej38GAAAAAAAAqKC8LHRfPHZw9penNvwl5ZP1nrmB268/MdafX+x96sTQ8aMz/f9K102ntJS/AAAAAAAAANX1HwEGAM75MhcANnAkAAAAAElFTkSuQmCC) 0px 0px no-repeat; background-position: 0px 0px } .smartEarthBlackPanel-text { width: 100%; height: 100%; min-height: 33px; text-align: center; padding: 10px 5px 0; margin: 0; font-size: 14px; font-weight: 400; color: #fff; border: 1px solid #ffffff4f; -webkit-box-sizing: border-box; box-sizing: border-box; white-space: nowrap } .smartEarth3d-divBoderLabel { position: absolute; left: 0; bottom: 0; cursor: pointer; --animation-name: mars3d-divBoderLabel-animation; --text-left-position: -75px; --text-font-size: 15px; --boder-width: 162px; --clip-width-1: 177px; --clip-width-2: 175px; --boder-height: 30px; --clip-height-1: 40px; --clip-height-2: 38px; --text-color: #ccc; --border-color: #15d1f2; --box-shadow-color: rgba(21, 209, 242, .56) } .smartEarth3d-divBoderLabel-boder, .smartEarth3d-divBoderLabel-boder:before, .smartEarth3d-divBoderLabel-boder:after { position: absolute; inset: 0 } .smartEarth3d-divBoderLabel-boder { width: var(--boder-width); height: var(--boder-height); margin: auto; color: var(--border-color); box-shadow: inset 0 0 0 1px var(--box-shadow-color) } .smartEarth3d-divBoderLabel-boder:before { animation-delay: -4s } .smartEarth3d-divBoderLabel-boder:before, .smartEarth3d-divBoderLabel-boder:after { content: ""; margin: -5%; box-shadow: inset 0 0 0 2px; animation: mars3d-divBoderLabel-animation 8s linear infinite } .smartEarth3d-divBoderLabel-text { color: var(--text-color); font-size: var(--text-font-size); display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; font-weight: bolder; user-select: none; cursor: pointer } @keyframes mars3d-divBoderLabel-animation { 0%, to { clip: rect(0px, var(--clip-width-1), 2px, 0px) } 25% { clip: rect(0px, 2px, var(--clip-height-1), 0px) } 50% { clip: rect(var(--clip-height-2), var(--clip-width-1), var(--clip-width-1), 0px) } 75% { clip: rect(0px, var(--clip-width-1), var(--clip-height-1), var(--clip-width-2)) } } .smartErath3d-divGraphic { position: absolute; left: 0; top: 0 } .smartErath3d-animation-point { width: 10px; height: 10px; border-radius: 50%; border: 1px solid hsla(0, 0%, 100%, .5); cursor: pointer; color: #0ff; background: currentColor; z-index: 3; left: 50%; top: 50%; transform: translate(-50%, -50%); box-shadow: 0 0 2em currentColor, 0 0 .5em currentColor; position: absolute } .smartErath3d-animation-point:after, .smartErath3d-animation-point:before, .smartErath3d-animation-point p:after, .smartErath3d-animation-point p:before { content: ""; position: absolute; width: 100%; height: 100%; left: 50%; top: 50%; border-radius: 50%; transform: translate(-50%, -50%) } .smartErath3d-animation-point:after, .smartErath3d-animation-point:before { border: 1px solid; animation: smartErath3d-animation-point-mapAni 1s ease infinite } .smartErath3d-animation-point p:before { border: 1px solid } .smartErath3d-animation-point, .smartErath3d-animation-point:after, .smartErath3d-animation-point:before, .smartErath3d-animation-point p, .smartErath3d-animation-point p:after, .smartErath3d-animation-point p:before { margin: 0; padding: 0; box-sizing: border-box } .smartErath3d-animation-point p { position: absolute; left: 50%; top: 50%; width: 0; height: 0; border-radius: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-animation: smartErath3d-animation-point-mapAni 2s ease infinite; -moz-animation: smartErath3d-animation-point-mapAni 2s ease infinite; -o-animation: smartErath3d-animation-point-mapAni 2s ease infinite; -ms-animation: smartErath3d-animation-point-mapAni 2s ease infinite; animation: smartErath3d-animation-point-mapAni 2s ease infinite } .smartErath3d-wave-main, .smartErath3d-wave { width: 100px; height: 100px; border-radius: 50%; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) } .smartErath3d-wave { background: darkturquoise; overflow: hidden } .smartErath3d-wave:after { content: ""; width: 112px; height: 110px; background: rgba(255, 255, 255, .8); position: absolute; left: 50%; top: -5%; transform: var(--transform); border-radius: 40%; animation: smartErath3d-wave 5s linear infinite } .smartErath3d-wave:before { content: var(--text-context); position: absolute; left: 50%; top: 0; color: #17a4a6; z-index: 99; transform: translate(-50%, 17px) } @keyframes smartErath3d-wave { to { transform: var(--transform) rotate(360deg) } } @-webkit-keyframes smartErath3d-animation-point-mapAni { 0% { width: 0; height: 0; opacity: 1; filter: alpha(opacity=1) } 25% { width: 120%; height: 120%; opacity: .7; filter: alpha(opacity=70) } 50% { width: 200%; height: 200%; opacity: .5; filter: alpha(opacity=50) } 75% { width: 300%; height: 300%; opacity: .2; filter: alpha(opacity=20) } to { width: 400%; height: 400%; opacity: 0; filter: alpha(opacity=0) } } @-moz-keyframes smartErath3d-animation-point-mapAni { 0% { width: 0; height: 0; opacity: 1; filter: alpha(opacity=1) } 25% { width: 120%; height: 120%; opacity: .7; filter: alpha(opacity=70) } 50% { width: 200%; height: 200%; opacity: .5; filter: alpha(opacity=50) } 75% { width: 300%; height: 300%; opacity: .2; filter: alpha(opacity=20) } to { width: 400%; height: 400%; opacity: 0; filter: alpha(opacity=0) } } @-o-keyframes smartErath3d-animation-point-mapAni { 0% { width: 0; height: 0; opacity: 1; filter: alpha(opacity=1) } 25% { width: 120%; height: 120%; opacity: .7; filter: alpha(opacity=70) } 50% { width: 200%; height: 200%; opacity: .5; filter: alpha(opacity=50) } 75% { width: 300%; height: 300%; opacity: .2; filter: alpha(opacity=20) } to { width: 400%; height: 400%; opacity: 0; filter: alpha(opacity=0) } } @-ms-keyframes smartErath3d-animation-point-mapAni { 0% { width: 0; height: 0; opacity: 1; filter: alpha(opacity=1) } 25% { width: 120%; height: 120%; opacity: .7; filter: alpha(opacity=70) } 50% { width: 200%; height: 200%; opacity: .5; filter: alpha(opacity=50) } 75% { width: 300%; height: 300%; opacity: .2; filter: alpha(opacity=20) } to { width: 400%; height: 400%; opacity: 0; filter: alpha(opacity=0) } } @keyframes smartErath3d-animation-point-mapAni { 0% { width: 0; height: 0; opacity: 1; filter: alpha(opacity=1) } 25% { width: 120%; height: 120%; opacity: .7; filter: alpha(opacity=70) } 50% { width: 200%; height: 200%; opacity: .5; filter: alpha(opacity=50) } 75% { width: 300%; height: 300%; opacity: .2; filter: alpha(opacity=20) } to { width: 400%; height: 400%; opacity: 0; filter: alpha(opacity=0) } } html { height: 100% } body { height: 100%; width: 100%; margin: 0; overflow: hidden; padding: 0; background: #000 } .fullWindow { position: absolute; top: 0; left: 0; height: 100%; width: 100%; margin: 0; overflow: hidden; padding: 0; font-family: sans-serif; background-color: #000; background-size: cover } .loadingIndicator { display: block; position: absolute; top: 50%; left: 50%; margin-top: -33px; margin-left: -33px; width: 66px; height: 66px; background-position: center; background-repeat: no-repeat } .button { overflow: hidden; z-index: 1000; position: relative } .map-widget { position: relative } .map-widget, .map-widget canvas { width: 100%; height: 100%; touch-action: none } .map-widget-credits { display: none; position: absolute; bottom: 0; left: 0; color: #fff; font-size: 10px; text-shadow: 0 0 2px #000000; padding-right: 5px } .map-widget-credits a, .map-widget-credits a:visited { color: #fff } .map-widget-errorPanel { position: absolute; inset: 0; text-align: center; background: rgba(0, 0, 0, .7); z-index: 99999 } .map-widget-errorPanel:before { display: inline-block; vertical-align: middle; height: 100%; content: "" } .map-widget-errorPanel-content { width: 75%; display: inline-block; text-align: left; vertical-align: middle; border: 1px solid #526f82; border-radius: 7px; background-color: #000; color: #fff; font-size: 10pt; padding: 1em } .map-widget-errorPanel-header { font-size: 120%; color: #fe4 } .map-widget-errorPanel-scroll { overflow: auto; font-family: monospace; white-space: pre-wrap; padding: 0; margin: 10px 0 } .map-widget-errorPanel-buttonPanel { text-align: center } .cesium-svgPath-svg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden } .tooltipdiv { display: block; position: absolute; visibility: visible; opacity: .7 } .map-performanceDisplay-defaultContainer { position: absolute; top: 50px; right: 10px; text-align: right } .full-window { position: absolute; inset: 0; margin: 0; overflow: hidden; padding: 0; -webkit-transition: left .25s ease-out; -moz-transition: left .25s ease-out; -ms-transition: left .25s ease-out; -o-transition: left .25s ease-out; transition: left .25s ease-out } .transparent-to-input { pointer-events: none } .opaque-to-input { pointer-events: auto } .clickable { cursor: pointer } a:hover { text-decoration: underline } #ui { z-index: 2100 } @media print { .full-window { position: initial } } .floating { pointer-events: auto; position: absolute; border-radius: 15px } .floating-horizontal { pointer-events: auto; position: absolute; border-radius: 15px; padding-left: 5px; padding-right: 5px } .floating-vertical { pointer-events: auto; position: absolute; border-radius: 15px; padding-top: 5px; padding-bottom: 5px } @media print { .floating { display: none } } .distance-legend { pointer-events: auto; position: absolute; border-radius: 15px; padding-left: 5px; padding-right: 5px; bottom: 30px; height: 30px; width: 125px; box-sizing: content-box } .distance-legend-label { display: inline-block; font-family: Roboto, sans-serif; font-size: 14px; font-weight: lighter; line-height: 30px; color: #C1C1C1; width: 125px; text-align: center } .distance-legend-scale-bar { border-left: 1px solid #C1C1C1; border-right: 1px solid #C1C1C1; border-bottom: 1px solid #C1C1C1; position: absolute; height: 10px; top: 15px } @media print { .distance-legend { display: none } } @media screen and (max-width: 700px), screen and (max-height: 420px) { .distance-legend { display: none } } .navigation-controls { background-color: #35353840; position: absolute; right: 30px; top: 210px; width: 30px; border: 1px solid rgba(255, 255, 255, .1); font-weight: 300; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none } .navigation-control { cursor: pointer; border-bottom: 1px solid #555555 } .naviagation-control:active { color: #fff } .navigation-control-last { cursor: pointer; border-bottom: 1px solid #555555; border-bottom: 0 } .navigation-control-icon-zoom-in { position: relative; text-align: center; font-size: 20px; color: #fff; padding-bottom: 4px } .navigation-control-icon-zoom-out { position: relative; text-align: center; font-size: 20px; color: #fff } .navigation-control-icon-reset { position: relative; left: 10px; width: 10px; height: 10px; fill: #fffc; padding-top: 6px; padding-bottom: 6px; box-sizing: content-box } .compass { pointer-events: auto; position: absolute; right: 38px; bottom: 180px; width: 95px; height: 95px; overflow: hidden } .compass-outer-ring { position: absolute; top: 0; width: 95px; height: 95px; fill: #ffffff80 } .compass-outer-ring-background { position: absolute; top: 14px; left: 14px; width: 44px; height: 44px; border-radius: 44px; border: 12px solid rgba(47, 53, 60, .8); box-sizing: content-box } .compass-gyro { pointer-events: none; position: absolute; top: 0; width: 95px; height: 95px; fill: #ccc } .compass-gyro-active { fill: #68adfe } .compass-gyro-background { position: absolute; top: 30px; left: 30px; width: 33px; height: 33px; border-radius: 33px; background-color: #2f353ccc; border: 1px solid rgba(255, 255, 255, .2); box-sizing: content-box } .compass-gyro-background:hover+.compass-gyro { fill: #68adfe } .compass-rotation-marker { position: absolute; top: 0; width: 95px; height: 95px; fill: #68adfe } .infoview { position: absolute; top: 10px; left: 10px; padding: 10px 15px; border-radius: 4px; border: 1px solid rgba(128, 128, 128, .5); color: #fff; background: rgba(0, 0, 0, .4); box-shadow: 0 3px 14px #80808080; z-index: 9999 } .infoview input, .infoview select, .infoview textarea { color: #fff; background-color: #20a0ff33; border: 1px solid #e4eaec; font-size: 14px } @media screen and (max-width: 700px), screen and (max-height: 420px) { .navigation-controls, .compass { display: none } } @media print { .navigation-controls, .compass { display: none } }