body {
   text-align: center;
}

.webgl-content {
   position: relative;
}

.webgl-content * {
   border: 0;
   margin: 0;
   padding: 0;
}

.centered {
   position: relative;
   left: 50%;
   transform: translateX(-50%);
}

#unity-container {
   margin-left: auto;
   margin-right: auto;
   z-index: -1;
}

.loader {
   background-color: aliceblue;
}

.loader .progressbar {
   background-color: steelblue;
   border: 2px black solid;
   border-radius: 10px;

   position: absolute;
   width: 50%;
   height: 75px;

   left: 50%;
   top: 50%;
   transform: translate(-50%, -50%);
}

.loader .fill {
   background-color: skyblue;
   border-radius: 10px;
   height: 100%;
}


.wolfContainer {
   display: none;
   position: fixed;    
   left: 0; 
   top: 0;
   width: 100%;
   height: 100%; 
   background-color: rgba(0, 0, 0, 0.5);
 }

 .wolfContent {
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   margin: auto;
   border: 0px;
   width: 1200px;
   height: 800px;    
 }

 
 .wolfContainer {
   display: none;
   position: fixed;    
   left: 0; 
   top: 0;
   width: 100%;
   height: 100%; 
   background-color: rgba(0, 0, 0, 0.5);
 }

 .wolfContent {
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   margin: auto;
   border: 0px;
   width: 1200px;
   height: 800px;    
 }