body, html {
  margin: 0px;
  padding: 0px;
  background-color: black;
  font-family: Times;
  font-weight: bold;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

body::-webkit-scrollbar { 
    display: none; 
}

#rings {
  height: 100%;
  width: 100%;
}

svg, #main {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
}

#content {
  position: fixed;
  left: 250px;
  top: 0px;
  width: calc(100% - 250px);
  height: 100%;

}

/* different width and top padding for mobiles */
@media only screen and (max-device-width: 480px) {
  #content {
    width: calc(100% + 230px);
    left: 10px;
    top: 400px;
    height: calc(100% - 400px);
    -webkit-overflow-scrolling: touch;
    overflow-y: scroll;
  }
}

iframe {
  width:100%;
  height:100%
}

circle {
  stroke: white;
  fill: transparent;
}

path {
  stroke: white;
  fill: transparent;
}

text, text a {
  font-family: TexGyrScholaRegular;
  fill: white;
}

#logo path, #logo rect, #logo circle {
  fill: white;
  stroke: transparent;
  cursor: pointer;
}

a:hover text, a.selected text, #logo:hover path, #logo:hover rect {
  fill: #ee7395;
}

.videoBgWrapper {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;
}

.videoBg{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

@media (min-aspect-ratio: 16/9) {
  .videoBg{
    width: 100%;
    height: auto;
  }
}

@media (max-aspect-ratio: 16/9) {
  .videoBg {
    width: auto;
    height: 100%;
  }
}