body {
font-family: 'Lato', sans-serif;
}
html, input, textarea, button {
-webkit-font-smoothing: antialiased;
}
input:focus,
select:focus,
textarea:focus,
button:focus {
outline: none;
}
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
/* Proximity map */
proximity-map {
position: relative;
display: block;
width: 1000px;
height: 600px;
padding-top: 40px;
padding-right: 326px;
}
proximity-map.readOnly {
padding-top: 0px;
}
proximity-map name-container {
display: block;
border-radius: 5px;
background: rgba(102, 102, 102, .1);
padding: 6px;
margin: 0 0 6px 0;
}
proximity-map name-container > input-container {
padding-left: 64px;
}
proximity-map name-container > input-container > p {
width: 64px;
}
proximity-map name-container > div {
background: rgba(255, 255, 255, .8);
height: 100%;
width: 100%;
display: block;
border-radius: 5px;
padding: 6px;
}
proximity-map period-container {
display: block;
border-radius: 5px;
padding: 6px;
min-height: 54px;
margin: 0 0 6px 0;
background-color: rgba(102, 102, 102, .1);
}
proximity-map period-container m-dropdown menu-items {
max-height: 400px;
overflow-y: auto;
}
proximity-map input-container {
height: 42px;
z-index: 40;
background: rgba(255, 255, 255, .8);
padding: 6px 6px 6px 98px;
position: relative;
display: block;
border-radius: 5px;
}
proximity-map input-container > p {
display: block;
height: 42px;
width: 92px;
padding: 0 8px;
margin: 0;
position: absolute;
top: 0;
left: 0;
line-height: 42px;
text-align: right;
color: #333;
}
proximity-map input[type=text],
proximity-map input[type=number] {
font-size: 16px;
display: block;
height: 100%;
width: 100%;
background: transparent;
padding: 0 4px;
line-height: 1.4;
border: none;
border-bottom: 1px solid rgba(102,102,102,.6);
border-radius: 0px;
color: inherit;
}
proximity-map input:focus {
border-bottom: 1px solid rgb(139, 195, 74);
}
proximity-map > map-container {
display: block;
position: relative;
height: 100%;
width: 100%;
z-index: 30;
}
proximity-map gui-modules {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
proximity-map gui-modules > drawing-controls {
display: block;
position: relative;
border-radius: 5px;
background: rgba(102, 102, 102, .1);
z-index: 40;
height: 34px;
overflow: hidden;
margin: 0 0 6px 0;
}
proximity-map drawing-controls > control-element {
display: inline-block;
vertical-align: middle;
line-height: 22px;
padding: 6px 12px;
text-align: center;
border-right: 1px solid rgba(102,102,102,.6);
}
proximity-map drawing-controls > control-element:hover {
background: rgba(139, 195, 74, .1);
}
proximity-map drawing-controls > control-element:active {
background: rgba(139, 195, 74, .5);
}
proximity-map drawing-controls > control-element.active {
background: rgba(139, 195, 74, .3);
}
proximity-map drawing-controls > control-element > p {
margin: 0;
cursor: pointer;
color: #333;
font-weight: 600;
}
proximity-map drawing-controls > control-element > input {
width: 100%;
border-radius: 3px;
border: 1px solid rgba(102,102,102,.6);
padding: 3px;
}
proximity-map drawing-controls > control-element > input:focus {
border-color: rgb(139, 195, 74);
}
proximity-map gui-modules > side-panel {
display: block;
position: absolute;
right: 0;
width: 320px;
z-index: 40;
}
proximity-map gui-modules > side-panel > * {
display: block;
margin: 0 0 6px 0;
background: rgba(102, 102, 102, .1);
padding: 6px;
overflow-y: auto;
border-radius: 5px;
}
proximity-map gui-modules > side-panel > * > * {
display: block;
margin: 0 0 6px 0;
}
proximity-map gui-modules > side-panel > * > h3 {
color: #333;
text-align: center;
font-weight: 600;
}
proximity-map gui-modules > side-panel > control-opts > multi-select-container > * {
display: block;
margin: 0 0 6px 0;
padding: 6px;
background: rgba(255, 255, 255, .8);
}
proximity-map gui-modules > side-panel > control-opts > multi-select-container > multi-select {
cursor: pointer;
}
proximity-map gui-modules > side-panel > control-opts > multi-select-container > .active {
background: rgba(62, 188, 37, .8);
border-radius: 5px;
}
proximity-map node-list { max-height: 412px; }
proximity-map node-list > node {
display: block;
position: relative;
cursor: pointer;
padding: 6px 40px 6px 6px;
background: rgba(102,102,102,.1);
min-height: 34px;
}
proximity-map node-list > node.focused {
background: rgba(139, 195, 74, .3);
}
proximity-map node-list > node > p {
margin: 0;
line-height: 1.4;
font-size: 16px;
padding: 0 4px;
}
proximity-map node-list > node > address {
display: block;
font-size: 12px;
font-style: italic;
color: #666;
padding: 0 4px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
}
proximity-map node-list > node > remove {
position: absolute;
top: 0;
right: 0;
width: 34px;
height: 34px;
background-image: url("../images/trash.png");
background-color: #d62f2f;
background-position: 50%;
background-size: 50%;
background-repeat: no-repeat;
border-radius: 3px;
}
proximity-map .coButton {
background: rgba(139, 195, 74, .6);
padding: 10px 16px;
font-size: 16px;
font-weight: 600;
line-height: 1.4;
border-radius: 6px;
display: inline-block;
color: #fff;
}
proximity-map .coButton:hover {
background: rgba(139, 195, 74, .8);
}
proximity-map .coButton:focus {
background: rgba(139, 195, 74, 1);
}
.manageProximity save-container {
padding: 24px 0;
display: block;
}
/* End proximity map */