#root {
  x-max-width: 1280px;
  x-margin: 0 auto;
  x-padding: 2rem;
  x-text-align: center;
}

.logo {
  height: 6em;
  padding: 1.5em;
  will-change: filter;
}
.logo:hover {
  filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.react:hover {
  filter: drop-shadow(0 0 2em #61dafbaa);
}

@keyframes logo-spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

@media (prefers-reduced-motion: no-preference) {
  a:nth-of-type(2) .logo {
    animation: logo-spin infinite 20s linear;
  }
}

.css-f2zdh9 {
  min-height: 69px;
}

.card {
  padding: 2em;
}

.read-the-docs {
  color: #888;
}

html, body {
  height: 100%;
}

#editor {
  background-color: white;
  display: none;
}

#editGeodiv {
  display: block;
  width: 135px;
  height: 112px;
}

#inputGeo {
  width: 94px;
  height: 10px;
  margin-top: 10px; 
  margin-left: 9px;
  padding: 10px;
}

#saveGeo {
  position: absolute;
  top: 65%;
  left: 12px;
  padding: 8px;
}

#removeGeo {
  position: absolute;
  top: 65%;
  left: 65px;
  padding: 8px;
}

.keystable {
  height: calc(-6rem + 100vh);
  width: calc(-18rem + 100vw);
}

html {
    --vxg-cb0: 255,255,255;
    --vxg-cb1: 39,50,73;
    --vxg-cb2: 100,166,206;
    --vxg-ct0: 50,64,103;
    --vxg-ct1: 255,255,255;
    --vxg-ct2: 162,207,250;
    --vxg-ci0: 46,122,193;

}

body {
    margin: 0;
    padding: 0;
}


.QBasicSide * {
    xcolor: white !important;
    xbackground-color: rgb(var(--vxg-cb1));

}


.QBasicSide ul {
    height: 100vh;
}


.QBasicMain {
    background-color: #f4f6fc !important;
    height: 100vh;
    margin: 0;
    padding-top: 4rem;
    padding-left: 15rem; 
}


.QMuiDataGrid-columnHeaderTitle {
    font-weight: bold !important;
}

.QMuiPaper-root {
    width: 50vw;
}