#splashscreen {
  position: fixed;
  z-index: 1000;
  width: 100%;
  height: 100%;
  background-image: url('splash_blur_w_logo2.jpg');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  text-align: center;
}
@font-face {
  font-family:'Armata';
  src: url('Armata-Regular.ttf') format('truetype'),
       url('Armata-Regular.woff') format('woff');
}
#splashscreen .panel-wrapper{
  width:40%;
  height: auto;
  top:30%;
  left:30vw;
  position: absolute;
  display: flex;
  flex-direction: column;
  text-align: center;
}

.fbutton{
  background-image: url('full-screen-icon-png-29.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 50px;
  height: 50px;
  position: fixed;
  padding: 1vh;
  bottom: 5vh;
  z-index: 10000000000000000;
  opacity: 0.7;
}
.fbutton:hover{
  opacity: 1;
}


#va-logo{
  background-image: url('va-blue.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 128px;
  height: 128px;
  position: fixed;
  padding: 10px;
}

#splashscreen .panel{
  width: 100%;
  height: auto;
  background-color: transparent;
  float:none;
  position: relative;
  margin: 0;
  text-align: center;
  padding: 0vh;
}

#splashscreen .panel p{
  color:white;
  text-align: justify;
  text-justify: inter-word;
  font-size: 2vh;
  font-family: 'Armata', Fallback, sans-serif;
}
.startbutton {
    background-color: #fff; /* Green */
    opacity: 0.7;
    border: none;
    color: black;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    width: 10%;
    left: 45%;
    height: auto;
    bottom: 10%;
    z-index: 99999999999999;
    position: absolute;
    cursor: pointer;
}
.startbutton:hover{
  opacity: 1;
}
#loadbar {
  position: fixed;
  z-index: 2000;
  min-height: 30px;
  height: auto;
  bottom: 0;
  background-color: rgba(100,255,100,1);
}

#ibutton{
  background-image: url('xbox-menu.png');
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 25px;
  height: 25px;
  display: block;
  top: 0;
  left: 0;
  position: fixed;
  z-index: 1001;
  opacity: 0.7;
  text-align: center;
  padding: 2px;
}
#ibutton:hover,#dbutton:hover{
  opacity: 1;
  cursor:cell;
}
#dbutton{
  width: 65px;
  height: 30px;
  display: block;
  overflow: hidden;
  top: 0;
  left: 45px;
  position: fixed;
  z-index: 1000;
  background: #fff;
  opacity: 0.7;
  text-align: left;
}
canvas{
  height:100vh;
  width: 100vw;
  left:0;
  top:0;
  margin: 0;
  padding: 0;
}

body{
 width: 100%;
 height: 100%;
 overflow: hidden;
 position: fixed;
 left: 0;
 top: 0;
}

@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (   min--moz-device-pixel-ratio: 2),
only screen and (     -o-min-device-pixel-ratio: 2/1),
only screen and (        min-device-pixel-ratio: 2),
only screen and (                min-resolution: 192dpi),
only screen and (                min-resolution: 2dppx) {

  /* Retina-specific stuff here */
  canvas{
    min-height: 100%;
  }

}

@media only screen and (max-width: 800px) {
  #splashscreen .panel-wrapper{
    width:90%;
    height: 100%;
    top:30vh;
    left:5vw;
    position: absolute;
  }
  #va-logo{
    width:40px;
    height: 40px;
    left: 48vw;
    top:5px;

  }
}
