/* Colors: 001011, fcfdff, 930D7B, 1a8184  */
html,button {
  font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
  font-size:20px !important;
}
body{
  background-color:#001011;
  overflow-x: hidden; 
  overflow-y: hidden;
}
div{
  margin:0;
}
input{
  font-size:18px;
  padding:0.5em;
  border:1px solid;
}
button {
  padding-left:1em;
  padding-right:1em;
  border:none;
  transition-duration:0.2s;
}
#header{
  background:#fcfdff;
  display:flex;
  justify-content: space-between;
  padding:1em;
  margin-bottom:0.5em;
}
#header span{
  font-size:30px;
}
#loginButton{
  background-color:#930D7B;
  color:white;
}
#loginButton:hover{
  filter: brightness(85%);
}
.modal{
  position:absolute;
/*   background-color:#eee; */
/*   background: radial-gradient(#F7EBEC 70%, #ccc 124%); */
  background: radial-gradient(#fcfdff 70%, #ccc 124%);
  overflow: auto;
  z-index:1;
  width: min-content;
  padding:0.5em;
  -webkit-animation: animatezoom 0.6s;
  animation: animatezoom 0.6s;
  
  display:none;
}
#loginForm{
  right: 0;
  margin: 0.4em
}
@-webkit-keyframes animatezoom {
    from {-webkit-transform: scale(0)} 
    to {-webkit-transform: scale(1)}
}
    
@keyframes animatezoom {
    from {transform: scale(0)} 
    to {transform: scale(1)}
}
#loginControls{
  margin-top:1em;
  text-align: center;
}
#loginControls button{
  background-color:#1a8184;
/*   color:#F7EBEC; */
  color:#fcfdff;
}
#loginControls button:hover{
  filter: brightness(85%);
}
#main{
/*   display:flex;
  flex-direction:column;
  justify-content:flex-start;
  align-items: center;
  height:100vh; */
}
#map{
  height: calc(100% - 96px);
/*   position:relative;
  height: calc(100% - 96px);
  width:100%; */
}

/* #mainImage{
  border-radius:50%;
  transform: scaleY(0.7);
  width: min-content;
} */