/* CSS files add styling rules to your content */

html {
  background: rgb(251,242,238);
background: linear-gradient(148deg, rgba(251,242,238,1) 0%, rgba(251,249,238,1) 100%);
}

body {
  font-family: azo-sans-web, helvetica, arial, sans-serif;
margin: 2em;
  
}

h1 {
  font-weight: 700;
  color: black;
}

.glitchButton * {
  z-index: 10000;
}

.heading {
  font-weight: 900;
  letter-spacing: 2px;
  color: rgba(118, 11, 11, 1.00);
  text-shadow: 2px 2px 0 rgba(199, 209, 203, 1.00);
}



footer .small-logo { height: 50px; width: auto; }

#lmec-logo {
  height: 2.5em;
  margin-right: 5px;
  width: auto;
}

#svg {
  width: 100%;
  height: 80vh;
}

.precinct-outline {
  stroke: rgb(173, 173, 173);
  stroke-width: 0.5px;
  fill: none;
}

#pie-svg {
  height: 200px;
  width: 200px;
}

#bottom-map {
  padding: 20px;
}

#overall-results-holder {
  /* height: 200px; */
  padding-top: 25px;
  display: inline-block;
  vertical-align: top;
  font-size: 1.6em;
}

#result-box {
  display: none;
  position: fixed;
  background-color: rgba(200,200,200,0.8);
  padding: 10px;
  border-radius: 3px;
  box-shadow: 1px 1px 1px #333;

}

#metadata-box {
  position: absolute;
  top: 5px;
  left: 5px;
  border-radius: 4px;
  border: 1px solid rgba(5,5,5,0.8);
  background-color: rgba(20,20,20,0.5);
  font-size: 0.8em;
  font-weight: 600;
  padding: 3px 6px;
  color: white;
  
}

.circle {
  cursor: pointer;
  stroke-width: 2px;
  fill-opacity: 0.5;
}

.result {
  color: white;
  border-radius: 2px;
  padding: 2px 4px;
}

.result-Wu {
  background-color: rgb(39, 100, 25);
}

.result-Essaibi-George {
  background-color: rgb(142, 1, 82);
}

.result-Mayor-Write-in {
  background-color: rgb(30,30,30);
}

@media only screen and (max-width: 450px) {
  #overall-results-holder {
    font-size: 1.0em;
  }
}