For Boo

<style type="text/css">
.pfor { display: none; }
#profile { background-color: transparent; border: none; }
</style>

<style type="text/css">

body {

background-color: #000000;
background-image: url(http://wallpaper-download.net/wallpapers/styles/1440x900/public/random-wallpapers-blue-textured-background-wallpaper-31406.jpg?itok=4Mvysbqt);
background-attachment: fixed;
background-position: center center;
background-repeat: repeat;
background-size: auto;
font-family: Times New Roman;
font-variant: normal;
font-size: 70%;
color: #666666;}

#pictureone {


position: fixed;
left: 390px;
top: 0px;
margin: 25px;
opacity: 0.8;}


.Box2{
position:absolute;
top: 210px;
left:570px;
height: auto;
width:220px;
border-radius:0px;
overflow:hidden;

}



.Box3{
background-color: #ffffff;
position:absolute;
background-size: 100%;
bottom: 220px;
left:-300%;
height:200px;
width:400px;
border-radius:100px;
overflow:auto;
border:4px solid black;
opacity: 0.0px;
-webkit-transition: all 0.7s ease-in-out; -moz-transition: all 0.7s ease-in-out; -o-transition: all 0.7s ease-in-out; -ms-transition: all 0.7s ease-in-out; transition: all 0.7s ease-in-out;}

.Box3:target{left:480px; -webkit-transition: all 0.7s ease-in-out; -moz-transition: all 0.7s ease-in-out; -o-transition: all 0.7s ease-in-out; -ms-transition: all 0.7s ease-in-out; transition: all 0.7s ease-in-out; opacity: 1.0px;}

a.yum, a.yum:link, a.yum:active, a.yum:visited {
background-color: #FEFEFE;
display: circle;
margin: 3px;
font-family: consolas;
font-size: 10px;
height: 20px;
border: #000000
letter-spacing: 2px;
border-radius: 100%;
color: #000;
text-decoration: none;}


a.yum:hover {
display: circle;
margin: 3px;
height: 20px;
border: #000000
border-radius: 100%;
font-family: consolas;
font-size: 10px;
letter-spacing: 2px;
color: #000000;
text-decoration: none;
}



</style>

<div id="pictureone"><img src="https://i.imgur.com/NeuGpBO.png" class="image" width="500px;" height="300px;"></div>

<div class="Box2">



<a href="#one" title="Stats" class="yum"><img src="http://img08.deviantart.net/007f/i/2011/226/f/f/marksman_by_anermik-d46kb12.png" width="175" height="100"></a></a>
 <br>
<a href="#two" title="Powers" class="yum"><img src="http://img07.deviantart.net/f34b/i/2012/061/c/a/ebony_archer_by_anermik-d4m6ufz.jpg" width="175" height="100"></a></a>

  <br>
<a href="#four" title="Friends" class="yum"><img src="http://pre05.deviantart.net/3473/th/pre/f/2013/334/c/9/the_archer_by_ckrenz-d6w716p.jpg" width="175" height="100"></a></a>
  <br>
<a href="#five" title="History" class="yum"><img src="https://s-media-cache-ak0.pinimg.com/736x/cd/de/08/cdde08c835c3a1da96b6b7db44084a8d.jpg" width="175" height="100"></a></a>
  <br>

<a href="#" title="Reset" class="yum"><img src="http://img15.deviantart.net/ca72/i/2012/100/c/5/sunny_by_braciata-d4v3500.jpg" width="175" height="100"></a></a>
</div>