#glMap,
#glDesigner,
#glDesigner .gaialight,
#glMessages {
  width: 100%;
  box-sizing: border-box;
}

.gaialight {
  width: 100%;
  min-width: 400px;
  height: 600px;
}

@media (min-width: 1101px) {
  #glMap,
  #glDesigner,
  #glMessages {
    width: calc(100% - 30px);
  }
  .gaialight {
    height: 700px;
  }
  .gaialight.no-overlay-switcher.no-overview,
  .gaialight.no-controls {
    height: 550px;
  }
}

@media (max-width: 1100px) {
  #glMap,
  #glDesigner,
  #glMessages {
    width: calc(100% - 20px);
  }
  .gaialight {
    height: 600px;
  }
  .gaialight.no-overlay-switcher.no-overview,
  .gaialight.no-controls {
    height: 450px;
  }
  .gaialight-map .ol-control {
    font-size: 80%;
  }
}

@media (max-width: 1023px) {
  #glMap,
  #glDesigner,
  #glMessages {
    width: 100%;
  }
  .gaialight {
    height: 510px;
  }
  .gaialight.no-overlay-switcher.no-overview,
  .gaialight.no-controls {
    height: 360px;
  }
  .gaialight-map .ol-control {
    font-size: 66.67%;
  }
  .gaialight-map .ol-control.background-switcher .layer-menu {
    font-size: 125%;
  }
}

#glMap.fullscreen {
  width: 100%;
}