About Book

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Lora|Sofia" rel="stylesheet">

<style>

.credit{
    position: fixed;
    bottom: 8px;
    right: 16px;
    background-color:rgb(225,225,225, 0.2);}

body, html {
    margin: 0;
    background-color:black;  /*****Change background color*********/
    font-family: 'Lora', serif;
}


a{
    color:#841b2d
    font-size:30px;
}
#book{
    margin-top:45px;
    margin-left:140px;
    width:900px;
    position:absolute;
}


.book{
    position:absolute;
    margin-left: 300px;

    transform: rotate(1deg) scale(1) skew(1deg) translate(0px);
-webkit-transform: rotate(1deg) scale(1) skew(1deg) translate(0px);
-moz-transform: rotate(1deg) scale(1) skew(1deg) translate(0px);
-o-transform: rotate(1deg) scale(1) skew(1deg) translate(0px);
-ms-transform: rotate(1deg) scale(1) skew(1deg) translate(0px);

}

.book h1{
    color:#841b2d ;
    font-family: 'Sofia', cursive;
    margin-left:70px;
}

.book img{
    width:150px;
    height:auto;
    margin-left:30px;
    margin-top:120px;
    border-radius:30px;
}

.questions{
    position:absolute;
    height:400px;
    width: 300px;
    overflow-y:scroll;
    margin-left:330px;
    margin-top: -290px;

  }


::-webkit-scrollbar {width: 10px;}
::-webkit-scrollbar-track {box-shadow: inset 0 0 5px grey;
    border-radius: 5px;}
::-webkit-scrollbar-thumb {
    background:  #d0c8b0;
    border-radius: 5px}

::-webkit-scrollbar-thumb:hover {
    background:#ebd5b3;
}

.sidenav{

   display:block;
}

.sidenav a{
    position:absolute;
    color:white;
    margin-top: 150px;
     right:0;
    padding-right: 20px;
}
</style>
<body>

<div class="sidenav">
    <a href="/">Go home</a><br><br>
    <a href="uRl">Link</a>
</div>

<img id="book" src="https://78.media.tumblr.com/baf8216e1d388341b96a4846579a1f00/tumblr_pd5wjgRjLM1wd05tno1_540.png">

<div class="book">
    <img src="https://78.media.tumblr.com/e75b44eef29bbd2413928a9db59464a8/tumblr_pc91ldc71n1wd05tno7_250.png"> <!---Icon of author---->

<h1>About</h1>

Tumblr Name: <a href="URL OF THE BLOG">Tumblr Name</a><BR>
A03 NAme:<a href="URL OF A03">Ao3Name</a> <br>
Fic in progress <a href="URL OF FIC">Title of the fic</a>


<div class="questions">

   Sin autem ad adulescentiam perduxissent, dirimi tamen interdum contentione vel uxoriae condicionis vel commodi alicuius, quod idem adipisci uterque non posset. Quod si qui longius in amicitia provecti essent, tamen saepe labefactari, si in honoris contentionem incidissent; pestem enim nullam maiorem esse amicitiis quam in plerisque pecuniae cupiditatem, in optimis quibusque honoris certamen et gloriae; ex quo inimicitias maximas saepe inter amicissimos exstitisse.

Nec piget dicere avide magis hanc insulam populum Romanum invasisse quam iuste. Ptolomaeo enim rege foederato nobis et socio ob aerarii nostri angustias iusso sine ulla culpa proscribi ideoque hausto veneno voluntaria morte deleto et tributaria facta est et velut hostiles eius exuviae classi inpositae in urbem advectae sunt per Catonem, nunc repetetur ordo gestorum.

Cuius acerbitati uxor grave accesserat incentivum, germanitate Augusti turgida supra modum, quam Hannibaliano regi fratris filio antehac Constantinus iunxerat pater, Megaera quaedam mortalis, inflammatrix saevientis adsidua, humani cruoris avida nihil mitius quam maritus; qui paulatim eruditiores facti processu temporis ad nocendum per clandestinos versutosque rumigerulos conpertis leviter addere quaedam male suetos falsa et placentia sibi discentes, adfectati regni vel artium nefandarum calumnias insontibus adfligebant.

Altera sententia est, quae definit amicitiam paribus officiis ac voluntatibus. Hoc quidem est nimis exigue et exiliter ad calculos vocare amicitiam, ut par sit ratio acceptorum et datorum. Divitior mihi et affluentior videtur esse vera amicitia nec observare restricte, ne plus reddat quam acceperit; neque enim verendum est, ne quid excidat, aut ne quid in terram defluat, aut ne plus aequo quid in amicitiam congeratur.

Equitis Romani autem esse filium criminis loco poni ab accusatoribus neque his iudicantibus oportuit neque defendentibus nobis. Nam quod de pietate dixistis, est quidem ista nostra existimatio, sed iudicium certe parentis; quid nos opinemur, audietis ex iuratis; quid parentes sentiant, lacrimae matris incredibilisque maeror, squalor patris et haec praesens maestitia, quam cernitis, luctusque declarat.


</div>


</div>


<!-----------credit do not touch--------------->
<div class="credit">
      <a href="rupertthebunny"><img src=  https://image.ibb.co/ny04mx/rabbit.png style="height: 30px"></a>
</div>

</body>
</html>