<!DOCTYPE html><html lang="en"><head><title>...</title><style>
@import url(https://fonts.googleapis.com/css?family=Allura|Montez|Grechen+Fuemen|Charm); body {background:#400;}
#front {position:fixed;top:0%;left:12%;background-size:100% 100%;background-image:url();
background-repeat:no-repeat;width:76%;height:100%;transition:2s;opacity:0.0;}
#front:hover {transition:7s;opacity:1;}
.clouds {position:fixed;bottom:0%;left:0%;width:100%;height:60%;display:inline;overflow:visible;pointer-events:none;
opacity:0.8;background:transparent url('https://i.imgur.com/geosgmp.png') repeat top center;z-index:0;
animation:move-scrolling-front 211s linear infinite;} @keyframes move-scrolling-front{from{background-position:0% 0%}
to{background-position:300% 0%}}
#box1, #box2, #box3, #box4 {position:fixed;left:0%;width:17%;height:7%;overflow:hidden;border-radius:4px;
transition:3s ease;background:#200;border:groove 11px #70f;font-family:"grechen fuemen";font-size:37px;line-height:59px;color:#a0f;text-align:center;} #box1 {top:11%;} #box2 {top:33%;} #box3 {top:55%;} #box4 { top:77%;}
#box1:hover, #box2:hover, #box3:hover, #box4:hover {width:98.5%;height:97.1%;left:0%;top:0.02%;
z-index:1;overflow:auto;border-radius:0px;color:transparent;line-height:40px;}
#name {position:fixed;width:98%;top:1%;font-size:114px;font-family:"grechen fuemen";text-align:center;color:#70f;}
.titles {font-family:"grechen fuemen";font-size:114px;color:#80f;margin-top:55px;text-align:center;}
.subtitles {font-family:"grechen fuemen";font-size:50px;color:#70f;text-align:center;margin-top:88px;line-height:70px;}
#table {width:100%;padding:120px 38px 40px 20px;font-family:"grechen fuemen";font-size:50px;
line-height:48px;color:#60f;text-align:justify;word-spacing:-5px;letter-spacing:-0.5px;}
.td {width:144px;height:88px;font-family:"grechen fuemen";font-size:50px;color:#f08;}
.bars {width:100.12%;margin:122px 0px 0px 0.1px;border-bottom:20px ridge #60f;
font-family:montez;font-size:50px;line-height:23px;color:#d09;}
#list {background:#000;list-style-type:square;margin:60px 33px -88px 33px;font-family:"grechen fuemen";font-size:33px;
font-weight:bold;line-height:33px;word-spacing:-3px;color:#60f;text-align:justify;}
.captions {padding:15px 7px 1px 7px;font-family:"grechen fuemen";font-size:44px;line-height:55px;color:#2dd;text-align:center;}
.text {padding:35px 44px 17px 44px;font-family:georgia;font-size:36px;font-style:italic;line-height:40px;
word-spacing:1.7px;letter-spacing:-2px;color:#60f;text-indent:55px;text-align:left;}
.center {display:block;margin-left:auto;margin-right:auto;border-radius:15px;box-shadow:0px 0px 22px 17px #f66;}
#cssvalidator {position:fixed;top:93%;left:0.9%;z-index:99;opacity:1;}
#htmlvalidator {position:fixed;top:93%;left:5.3%;z-index:99;opacity:1;}
#date {position:fixed;top:94%;left:81%;font-family:allura;font-size:20px;color:#08a;} </style>
<div id="front"></div><div id="name">...<div class="subtitles"><b>...</div>
<div id="box1">Lore<div class="clouds"></div><div class="titles">...</div><div class="subtitles">The family Lore</div>
<div class="text"><p>...<p style="margin-top:-22px;">...<p style="margin-top:-22px;">
<p>...<p style="margin-top:-22px;">...</div></div>
<div id="box2">...<div class="clouds"></div><div class="titles">...</div><div class="subtitles">...</div><table id="table">
<td class="td">Name: </td><td>...</td></tr><tr>
<td class="td">Parents: </td><td>...</td></tr><tr>
<td class="td">Children: </td><td>...</td></tr><tr>
<td class="td">Birth: </td><td>...</td></tr><tr>
<td class="td">Gender: </td><td>...</td></tr><tr>
<td class="td">Sexy: </td><td>...</td></tr><tr>
<td class="td">Further: </td><td>...</td></tr><tr>
<td class="td">Occupation: </td><td>...</td></tr><tr>
<td class="td">Residence: </td><td>...</td></tr><tr>
<td class="td">Height: </td><td>...</td></tr><tr>
<td class="td">Weight: </td><td>...</td></tr><tr>
<td class="td">Dominance: </td><td>...</td></tr><tr>
<td class="td">Missions: </td><td>...</td></tr><tr>
<td class="td">Eyes: </td><td>...</td></tr><tr>
<td class="td">Hair: </td><td>..</td></tr><tr>
<td class="td">Scars: </td><td>...</td></tr><tr>
<td class="td">Canines: </td><td>...</td></tr><tr>
<td class="td">Nails: </td><td>...</td></tr><tr>
<td class="td">Style: </td><td>...</td></tr><tr>
<td class="td">Pets: </td><td>...</td></tr><tr>
<td class="td">Pleasures: </td><td>...</td></tr> </table> </div>
<div id="box3">Timeline<div class="clouds"></div><div class="titles">...</div>
<div class="bars">Important Events </div> <ul id="list">
<li> 2021, November - ...</ul> <div class="bars">History</div>
<div class="captions">...</div><br> <img src=" x " style="width:44%;" alt="another" class="center">
<div class="text" style="font-size:44px;line-height:50px;">
<p>...<p style="margin-top:-44px;">...<p style="margin-top:-44px;">...<p style="margin-top:-44px;">...</div></div>
<div id="box4"> Images <div class="titles">...</div>
<div class="captions" style="margin-top:99px;">...<br></div>
<img src=" x " style="width:55%;margin-top:11px;" class="center" alt="photo">
<div class="captions" style="margin-top:99px;">...<br></div>
<img src=" x " style="width:55%;margin-top:11px;" class="center" alt="photo">
<div class="captions" style="margin-top:99px;">...<br></div>
<img src=" x " style="width:55%;margin-top:11px;" class="center" alt="photo">
<div class="captions" style="margin-top:99px;">...<br></div>
<img src=" x " style="width:40%;margin-top:11px;margin-bottom:77px;" class="center" alt="photo"></div></div>
<div id="date">11/9/21 Coded by Esther WayStone</div>
<div id="cssvalidator"><img src="http://jigsaw.w3.org/css-validator/images/vcss" style="width:66px;" alt="css" /></div>
<div id="htmlvalidator"><img src="http://jigsaw.w3.org/css-validator/images/vcss-blue" style="width:66px;" alt="html" /></div>
</html>
Comments