Bulwurk (ME) Code

<style>
@import url('https://fonts.googleapis.com/css?family=Cutive+Mono&display=swap');

body {
 background-color: #000;
 background-image: url('https://www.wallpaperflare.com/static/798/499/633/mass-effect-3-n7-font-background-wallpaper.jpg') ;
	background-position: fixed;
 background-size: 100%;
	background-repeat:no-repeat;
	background-position: left;
 	font-family: ;
	color: #7c7c7c;
 	text-shadow:0px 0px 3px #000;
}

#armor {
background-color:#;
margin:auto;
position: fixed;
color: #000;
transform: rotate(0deg);
left: 35%;
top: -5%;
opacity: 1;
z-index: -90;
}


#head {
background-color:#6e6e6e;
margin:auto;
position: fixed;
padding: 2px;
color: #000;
transform: rotate(0deg);
left: 62.5%;
top: 3%;
opacity: 1;
z-index:-9;
color: #b5a8b0;
 animation: head 1s forwards;
 animation-delay: 4s;
 animation-timing-function: linear;
 opacity: .0;
 z-index: -8;
}


.ring1 {
 position: fixed;
 bottom: 85%;
 left: 47%;
 animation: ring1 1s forwards;
 animation-delay: 3s;
 animation-timing-function: linear;
 opacity: 0;
 z-index: -8;
}

.ring2 {
 position: fixed;
 bottom: 60%;
 left: 30%;
 animation: ring2 1s forwards;
transform: rotate(150deg);
 animation-delay: 3s;
 animation-timing-function: linear;
 opacity: 0;
 z-index: -8;
}

#box {
background-color:#6e6e6e;
margin:auto;
position: fixed;
padding: 10px;
font-family: 'Cutive Mono', monospace;
color: #fff;
transform: rotate(0deg);
left: 13%;
top: 26%;
opacity: 0;
animation: box 1s forwards;
animation-delay: 4s;
}


::-webkit-scrollbar {
 width: 5px;
}

::-webkit-scrollbar-track {
 box-shadow: inset 0 0 5px grey;
 border-radius: 10px;
}

::-webkit-scrollbar-thumb {
 background: #26121E;
 border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
 background: #4f3d47;
}

@keyframes ring1 {
 0% { left: 7%; opacity: 0; }
 100% { left: 52%; transform: rotate(-20deg);opacity: 1; }

}

@keyframes ring2 {
 0% { left: -7%; opacity: 0; }
 100% { left: 30%; transform: rotate(150deg); opacity: 1; }

}

@keyframes head {
 0% { opacity: 1; }
 100% { opacity: 1; }

}

@keyframes box {
 0% { opacity: 0; }
 100% { opacity: 1; }

}


</style>
<body>

<div id="armor">
<img src="http://i.picpar.com/VUCd.png" height=";">

</div>

<div class="ring1">
<img src="http://i.picpar.com/ZUCd.png" width="200" ></div>
</div>

<div class="ring2">
<img src="http://i.picpar.com/ZUCd.png" width="300" ></div>
</div>


<div id="head">

<img src="https://i.pinimg.com/736x/7e/bf/0d/7ebf0dc76ddcb93ac113352f13089275.jpg" width="100" >
</div>

<div id="box">


<a name="one"></a>
<div style="width: 300px; height: 300px; overflow: auto; align="left">
Name: Edward Hemlock<br>
Moniker: Bulwark<br>
Rank: N7<br>
Class: <a target="_blank" href="http://masseffect.wikia.com/wiki/N7_Destroyer_Soldier">Soldier (N7 Destroyer)</a><br>
Weapons of Choice: <a target="_blank" href="http://masseffect.wikia.com/wiki/N7_Piranha">N7 Piranha</a>, <a target="_blank" href="http://masseffect.wikia.com/wiki/N7_Typhoon">N7 Typhoon</a><br>
Age: 35<br>
Height: 6'3"(without armor) 6'7"(with armor)<br>
Weight: 250lbs(without armor) 400(with armor)<br>
Hair: Black<br>
Eyes: Brown<br>
Marital Status: Single<br>
Orientation: Bi-sexual (female lean) <br><br>

Bio:<br>
------------------------------

</div>

</div>
</div>
</div>

</body>
</body>