body {
    padding: 0;
    margin: 0
}

#unity-container {
position: fixed;
    width: 100%;
    height: 100%;
}

#unity-canvas {
    width: 100%;
    height: 100%;
    background: #080808
}

#unity-loading-bar {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

#unity-logo {
	display: flex;
	align-items: center;
    justify-content: center;
	width: auto;
    height: calc(min(18vh, 18vw));
    background: url('ui_princewalk_apng.png') no-repeat center;
	background-size: contain;
}

#unity-progress-bar-empty {
	display: flex;
	margin-top: -2.5vh;
    height: calc(min(4.5vh, 4.5vw));
	background: url('ui_loadingborder.png') no-repeat center;
    background-size: contain;
    overflow: hidden;
    border: 1px;
}

#unity-progress-bar-border {
    position: absolute;
	width: 100%;
    height: calc(min(4.5vh, 4.5vw));
	background: url('ui_loadingborder.png') no-repeat center;
    background-size: contain;
    overflow: hidden;
    border-radius: calc(min(5vh, 5vw));
}

#unity-progress-bar-full {
    position: relative;
    top: calc(min(0.65vh, 0.65vw));
    height: calc(min(3.3vh, 3.3vw));
    background: url('ui_loadingfill.png') no-repeat center;
    background-size: cover;
    overflow: hidden;
    border-radius: calc(min(5vh, 5vw));
    scale: 0.97;
}

#unity-warning {
    position: absolute;
    left: 50%;
    top: 5%;
    transform: translate(-50%);
    background: white;
    padding: 10px;
    display: none
}

.loading-animation::after {
    content: "...";
    animation: ellipsis 1s infinite steps(3);
    display: inline-block;
}

@keyframes ellipsis {
    0% {
        content: ".";
    }

    33% {
        content: "..";
    }

    66% {
        content: "...";
    }

}

.container {
    display: flex;
    flex-direction: row;
    color: white;
    font-family: Arial, Helvetica, sans-serif;
	width: calc(min(35vh, 35vw));
    font-size: calc(min(4vh, 4vw));
}

.text {
    margin-top: auto;
	margin-left: calc(min(0.65vh, 0.65vw));
    display: inline-block;
    margin-right: 10px;
}

#loading {
    display: inline-block;
}

#orientation-lock {
    position: fixed;
    top: 0; left: 0;
    width: 100vw; height: 100vh;
    background: rgba(0,0,0,0.7);
    z-index: 9999;
    display: none;
 }
    #orientation-lock .orientation-message {
      position: absolute;
      top: 50%; left: 50%;
      transform: translate(-50%, -50%);
      color: #fff;
      font-size: 2em;
      text-align: center;
      padding: 1em;
    }
