Twins (Two Images, Two Tabs)

<style>
.pfor {
 display: none;}
#profile {

 border: transparent;}

body {
background-color#EEE7E6;
background-image: url();
background-size: 100% 100%;
background-repeat:no-repeat;
}


#title{
vertical-align: center;
text-transform: none;
color:#AD5C57;
font-size:12px;
font-family:Harrington;
text-align: center;
position: absolute;
right: 50px;
bottom: 8px;
margin: 1px;
z-index:1;}


 .circle{
border-radius:150px;
-webkit-transition: all 0.8s ease-out;
-moz-transition: all 0.8s ease-out;
-o-transition: all 0.8s ease-out;
}

a {
 color: #DCDCDC;
 text-decoration: none;
 transition: all 0.5s ease-in-out;
 -moz-transition: all 0.5s ease-in-out;
 -webkit-transition: all 0.5s ease-in-out;}
a:hover {
 color: #666666;
 text-decoration: line-through;
 transition: all 0.5s ease-in-out;
 -moz-transition: all 0.5s ease-in-out;
 -webkit-transition: all 0.5s ease-in-out;}

b {
font-family:Georgia;
font-size:22px;
line-height:12px;
color: #DB7093;
font-weight:bold;
}

i{
color: #FFB6C1;
font-weight: light;
letter-spacing: -1px;
font-style: italic;
font-weight: normal;
}

u{
color: #6495ED;
font-weight: light;
}

big{
font-family:Georgia;
font-style:bold;
color: #5B6FD4;
font-size:22px;
line-height:12px;
}


h1{
font-size: 18px;
width: 100%;
font-family: Georgia;
font-weight: normal;
line-height: 12px;
text-transform: None;
text-align: left;
border-bottom: 1px solid #5B6FD4;
}

h1:first-letter{
color: #5B6FD4;
font-size: 22px;
font-weight: bold;
}

h2{
font-size: 18px;
width: 100%;
font-family: Georgia;
font-weight: normal;
line-height: 12px;
text-transform: None;
text-align: left;
border-bottom: 1px solid #DB7093;
}

h2:first-letter{
color: #DB7093;
font-size: 22px;
font-weight: bold;
}



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

::-webkit-scrollbar-track {
 -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
 border-radius: 10px;
}

::-webkit-scrollbar-thumb {
 border-radius: 10px;
 -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}


.navbar1 a {
 display: block;
 width: 2.5%;
 margin-top: 2px;
 padding-top: 2px;
 padding-bottom: 2px;
 color: #cccccc;
 text-decoration: none;
 font-family: Rockwell;
 Font-size: 10px;
 transition: all 0.5s ease-in-out;
 -moz-transition: all 0.5s ease-in-out;
 -webkit-transition: all 0.5s ease-in-out;}



.abox {background-color:#000000; opacity: .9; color: #DCDCDC; font-size: 18px; font-family: Poor Richard; text-align: justify; position: absolute; width:400; height:332; left: 350; top:130; letter-spacing:0px; line-height: 12px; padding: 50px; margin: 1px; overflow:auto; border-radius:180px; border:8px ridge #DCDCDC;}

.navbar { Position: absolute; Height: 50px; Width: 99.4%; Left: 0; Top: 0; padding: 4px; z-index: 100;}

.link1 {Position: absolute; top:230; Left: 65px; background-color:#6495ED; border-radius:50px; Border: outset 2px #F6CECE; Height: 150px; Width: 10px; transition: 0.8s; -moz-transition: 0.8s; webkit-transition: 0.8s; -o-transition: 0.8s;}

.link2 {Position: absolute; top:230; Left: 381px; background-color:#6495ED; border-radius:50px; Border: outset 2px #F6CECE; Height: 150px; Width: 10px; transition: 0.8s; -moz-transition: 0.8s; webkit-transition: 0.8s; -o-transition: 0.8s;}

.link3 {Position: absolute; top:230; right: 381px; background-color:#FFB6C1; border-radius:50px; Border: outset 2px #F6CECE; Height: 150px; Width: 10px; transition: 0.8s; -moz-transition: 0.8s; webkit-transition: 0.8s; -o-transition: 0.8s;}

.link4 {Position: absolute; top:230; right: 65px; background-color:#FFB6C1; border-radius:50px; Border: outset 2px #F6CECE; Height: 150px; Width: 10px; transition: 0.8s; -moz-transition: 0.8s; webkit-transition: 0.8s; -o-transition: 0.8s;}

.link1:hover {Background-color: #4169E1; Height: 200px; transition: 0.8s; -moz-transition: 0.8s; webkit-transition: 0.8s; -o-transition: 0.8s;}
.link2:hover {Background-color: #4169E1; Height: 200px; transition: 0.8s; -moz-transition: 0.8s; webkit-transition: 0.8s; -o-transition: 0.8s;}
.link3:hover {Background-color: #DB7093; Height: 200px; transition: 0.8s; -moz-transition: 0.8s; webkit-transition: 0.8s; -o-transition: 0.8s;}
.link4:hover {Background-color: #DB7093; Height: 200px; transition: 0.8s; -moz-transition: 0.8s; webkit-transition: 0.8s; -o-transition: 0.8s;}




.slide {Position: fixed; Height: 555555; Width: 555555; Top: -100px; Left: 75; Z-index: -1; Opacity: 0; transition: 1.5s; -moz-transition: 1.5s; webkit-transition: 1.5s; -o-transition: 1.5s;}

.slide:target {
top: -20px;
opacity: 1;
 Z-index: 1;
transition: 1.5s;
 -moz-transition: 1.5s;
 webkit-transition: 1.5s;
 -o-transition: 1.5s;}



#image1 {
 position:fixed;
 left:80;
 top:100;
 width:300;
 height:471;
}






#NAME{
 position: fixed;
 top: 65px;
 left: 90px;
 height: 30px;
 width: 400px;
 font-family: Informal Roman;
 font-size: 32px;
 color: #4169E1;
 }






#image2 {
 position:fixed;
 right:80;
 top:100;
 width:300;
 height:471;
}





#NAME2{
 position: fixed;
 top: 65px;
 right: -20px;
 height: 30px;
 width: 400px;
 font-family: Harrington;
 font-size: 26px;
 color: #DB7093;
 }


</style>

<div id="image1"><img src="IMAGE URL" class="circle"></div>
<div id="NAME">
NAME
</div>


<div id="image2"><img src="IMAGE URL" class="circle"></div>
<div id="NAME2">
NAME
</div>


<div class="navbar">
<a class="link1" href="#1"></a>
<a class="link2" href="#2"></a>
<a class="link3" href="#3"></a>
<a class="link4" href="#4"></a>
</div>

<div id="1" class="slide">
<div class="abox">
<center><h1>Name</h1><br></center>
<u>Race</u>. <font style=float:right>afb</font><br><br>
<u>Gender</u>. <font style=float:right>afb</font><br><br>
<u>Height</u>. <font style=float:right>afb</font><br><br>
<u>Weight</u>. <font style=float:right>afb</font><br><br>
<u>Hair Color</u>. <font style=float:right>afb</font><br><br>
<u>Eye Color</u>. <font style=float:right>af</font><br><br>
<u>Family</u>. <font style=float:right>afg</font><br><br>
<u>Residence</u>. <font style=float:right>fga</font><br><br>
<h1>Personality <big>T</big>raits.</h1><br><br>
Do Not Remove Credit

</div></div>


<div id="title">
@Coded by <a href="https://pastebin.com/u/Toxicandii" target="_blank">Toxicandii</a>
</div>

<div id="3" class="slide">
<div class="abox">
<center><h2>Name</h2></center>
<i>Race</i>. <font style=float:right>afb</font><br><br>
<i>Gender</i>. <font style=float:right>adfb</font><br><br>
<i>Height</i>. <font style=float:right>afb.</font><br><br>
<i>Weight</i>. <font style=float:right>afb</font><br><br>
<i>Hair Color</i>. <font style=float:right>afbe</font><br><br>
<i>Eye Color</i>. <font style=float:right>afb</font><br><br>
<i>Family</i>. <font style=float:right>fb</font><br><br>
<i>Residence</i>. <font style=float:right>afb</font><br><br>
<h2>Personality <b>T</b>raits.</h2><br>

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