html,body { height: 100%; margin: 0; padding: 0; } #map { height: 100%; } #map.fp-overFeature { cursor: pointer; } #map.fp-clickHandler { cursor: crosshair; } .fp-map { position: relative; } .fp-map-disabled-cover { background-color: #888; opacity: 0.7; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; filter: alpha(opacity=70); -moz-opacity: 0.7; -khtml-opacity: 0.7; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .fp-map-loading { position:absolute; top:0; left:0; right:0; bottom:0; padding:10px; background: #fff; z-index:100000; font-size:1.5em; font-weight:bold; } .fp-toolbox { position: absolute; top: 10px; right: 10px; } @media print { .fp-toolbox { display: none; } } .error,.success,.warning,.info { padding: 8px; border-radius: 3px; border: 1px solid; font-weight: bold; white-space: pre-line; } .error { background-color: #f2dede; color: #a94442; border-color: #ebccd1; } .success { background-color: #dff0d8; border-color: #d6e9c6; color: #3c763d; } .info { background-color: #d9edf7; border-color: #bce8f1; color: #31708f; } .warning { background-color: #fcf8e3; border-color: #faebcc; color: #8a6d3b; } dl { margin: 0; padding: 0; } dt { display: inline-block; font-weight: bold; margin: 5px 0 0 0; padding: 0; width: 29%; vertical-align: top; } dt:after { content: ":\a0"; } dd { display: inline-block; width: 69%; margin: 5px 0 0 0; padding: 0; vertical-align: top; } dd :first-child,td :first-child { margin-top: 0; } dd :last-child,td :last-child { margin-bottom: 0; } dd input, dd textarea { width: 100%; } dd input.inline { width: 10em; } dl:after { clear: left; display: block; content: " "; } label.disabled { color: #888; } tr.selected td { font-weight: bold; } table { width: 100%; border-spacing: 0; border-collapse: collapse; } table th.sort { cursor: pointer; } table th.sort .ui-icon { display: inline-block; vertical-align: middle; } table td.button { width: 1px; white-space: nowrap; } table td.button button { white-space: nowrap; } table.border td, table.border th { border: 1px solid #ddd; padding: .5em; } table.border thead th, table.border thead.td { background-color: #f8f8f8; } table.border td.move,table.border th.move { border: none; padding: 0; background: transparent; } table.border input, table.border textarea, table.border select { width: 100%; box-sizing: border-box; } .messages { position: absolute; top: 10px; width: 50%; left: 25%; } .messages p { font-size: 1.5em; margin:0 0 10px 0; position: relative; box-shadow: 0 0 15px; border-radius: 5px; white-space: normal; } .messages .close-button { position: absolute; top: 5px; right: 5px; color: inherit; text-decoration: none; } textarea { height: 5em; } .fp-popup { background: #fff; position:absolute; width: 350px; height: 200px; border-radius: 10px; box-shadow: 0 0 10px #888; } .fp-popup-hidden { display: none; } .fp-popup .content { position: absolute; top: 0; left: 0; bottom: 0; right: 0; padding: 5px 10px 2.1em 10px; overflow: auto; } .fp-popup:before { content: ""; position: absolute; border: 0; border-style: solid; border-color: transparent #fff; display: block; width: 0; } .fp-popup-bottom { margin-top: 51px; } .fp-popup-bottom:before { top: -50px; border-top-width: 50px; } .fp-popup-right { margin-left: -30px; } .fp-popup-right:before { left: 30px; border-left-width: 15px; } .fp-popup-top { margin-top: -264px; } .fp-popup-top:before { bottom: -50px; border-bottom-width: 50px; } .fp-popup-left { margin-left: -319px; } .fp-popup-left:before { right: 30px; border-right-width: 15px; } .fp-popup .buttons { position: absolute; background: #fff; bottom: 0; left: 10px; right: 10px; padding: 5px 0; box-shadow: 0 0 10px #fff; } .fp-popup .close-button { position: absolute; top: 10px; right: 20px; font-size: 1.5em; font-weight: bold; color: inherit; text-decoration: none; } .fp-popup .content h2 { margin-bottom: 0; } .pos,.distance { font-style: italic; font-weight: normal; } #colour-picker { background: #fafafa; width: 171px; padding: 5px; border: 1px solid #666; border-radius: 10px; box-shadow: 5px 5px 5px rgba(0,0,0,0.3); list-style-type: none; margin: 0; position: absolute; } #colour-picker li { display: inline-block; margin: 2px; width: 13px; height: 13px; padding: 0; cursor: pointer; border: 1px solid #aaa; } #colour-picker li:hover { border-color: #000; } .olMap .fmControlLoading { top: auto; bottom: 7px; left: 102px; right: auto; } .fp-map-label { position: absolute; background-color: #fff; z-index: 1010; border: 1px solid #000; border-radius: 5px; padding: 3px 6px; opacity: .7; font-weight: bold; } .type-select { position: absolute; bottom: .5em; right: 1em; } /********* z-index **************/ /* jQuery popup has a z-index of 100 */ /* OpenLayers Controls have z-index: 1008 (inside the map viewport) */ .fp-map-disabled-cover { z-index: 10001; } .messages { z-index: 10002; } #colour-picker { z-index: 1500; } #map .fp-popup { z-index: 1007; } .fp-toolbox { z-index: 1020; }