html,
body,
#cesiumContainer {
  margin: 0;
  padding: 0;
  overflow: hidden;
}
#LayerContainer {
  width: 300px;
  position: absolute;
  background-color: white;
  color: black;
  z-index: 9999;
  top: 10px;
  left: 60px;
  border-radius: 5px;
  border: 2px solid gainsboro;
}
#layerPanelHeader {
  padding: 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 18px;
  font-weight: 600;
}
#layerPanel {
  overflow: auto;
  padding: 10px;
}
#layerPanelContainer {
  padding-top: 8px;
}
#divider {
  height: 2px;
  width: 100%;
  background-color: gainsboro;
}
#branding {
    position: absolute;
    bottom: 10px;
    left: 10px;
    display: flex;
    align-items: center;
    background: rgba(42, 42, 42, 0.8);
    padding: 10px;
    border-radius: 5px;
    color: white;
}
#branding img { 
    height: 40px; margin-right: 10px; 
}
#menuIcon {
  position: absolute;
  z-index: 999999;
  top: 10px;
  left: 10px;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  background-color: white;
  font-weight: 600;
  font-size: 18px;
  padding: 5px;
  cursor: pointer;
  border: 3px solid #5252de;
  display: flex;
  align-items: center;
  justify-content: center;
}
#measurementIcon {
  position: absolute;
  z-index: 999999;
  top: 60px;
  left: 10px;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  background-color: White;
  color: black;
  font-weight: 600;
  font-size: 18px;
  padding: 5px;
  cursor: pointer;
  border: 3px solid gainsboro;
  display: flex;
  align-items: center;
  justify-content: center;
}
#tilesetCompare {
  position: absolute;
  z-index: 999999;
  top: 110px;
  left: 10px;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  background-color: white;
  font-weight: 600;
  font-size: 18px;
  padding: 5px;
  cursor: pointer;
  border: 3px solid gainsboro;
  display: flex;
  align-items: center;
  justify-content: center;
}
#polygonIcon {
  position: absolute;
  z-index: 999999;
  top: 160px;
  left: 10px;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  background-color: white;
  font-weight: 600;
  font-size: 18px;
  padding: 5px;
  cursor: pointer;
  border: 3px solid gainsboro;
  display: flex;
  align-items: center;
  justify-content: center;
}
#share {
  position: absolute;
  z-index: 999999;
  top: 210px;
  left: 10px;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  background-color: white;
  font-weight: 600;
  font-size: 18px;
  padding: 5px;
  cursor: pointer;
  border: 3px solid gainsboro;
  display: flex;
  align-items: center;
  justify-content: center;
}
#topView {
  position: absolute;
  z-index: 999999;
  top: 260px;
  left: 10px;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  background-color: white;
  font-weight: 600;
  font-size: 18px;
  padding: 5px;
  cursor: pointer;
  border: 3px solid gainsboro;
  display: flex;
  align-items: center;
  justify-content: center;
}
#snapshot {
  position: absolute;
  z-index: 999999;
  top: 310px;
  left: 10px;
  width: 40px;
  height: 40px;
  border-radius: 5px;
  background-color: white;
  font-weight: 600;
  font-size: 18px;
  padding: 5px;
  cursor: pointer;
  border: 3px solid gainsboro;
  display: flex;
  align-items: center;
  justify-content: center;
}
.hide_icon {
  float: right;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: flex;
  background-color: rgba(34, 34, 44, 0.15);
  justify-content: center;
  align-items: center;
  cursor: pointer;
}
.check {
  color: #4287f5;
  cursor: pointer;
}

.uncheck {
  color: white;
  cursor: pointer;
}
#slider {
  display: none;
  position: absolute;
  left: 50%;
  top: 0px;
  background-color: #d3d3d3;
  width: 5px;
  height: 100%;
  z-index: 999999;
}

#left_part {
  display: none;
  position: absolute;
  background-color: white;
  color: black;
  left: 30%;
  top: 0px;
  z-index: 999999;
}

#right_part {
  display: none;
  position: absolute;
  background-color: white;
  color: black;
  right: 30%;
  top: 0px;
  z-index: 999999;
}
#left_select,
#right_select {
  background-color: white;
  color: black;
}
#sliderIcon {
  position: absolute;
  z-index: 100000000;
  width: 28px;
  height: 28px;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  top: 50%;
  right: -12px;
}

#slider:hover {
  cursor: ew-resize;
}
.layerDiv {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  padding-right: 5px;
  margin-bottom: 8px;
}
.layer {
  width: 100%;
  display: flex;
  align-items: center;
  margin-bottom: 6px;
  margin-left: 6px;
}
.layerTitle {
  width: 90%;
  font-size: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-family: sans-serif;
}
.zoom {
  width: 18px;
  height: 16px;
  margin-left: 20px;
}
.navigation-controls {
  top: 145px !important;
  bottom: unset !important;
}

.compass {
  top: 50px !important;
  bottom: unset !important;
}