Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <body><style type="text/css">
- @import url(https://fonts.googleapis.com/css?family=Allura|Parisienne|Calligraffitti|Charm|Philosopher);
- ::-webkit-scrollbar-thumb:vertical { background:#4e004e;border-radius:20px;box-shadow: 0px 0px 0px #000; }
- ::-webkit-scrollbar-thumb:horizontal { background:red;border-radius:20px;box-shadow: 0px 0px 0px #000; }
- ::-webkit-scrollbar { width:0px;height:3px; background:#040;border-radius:20px; }
- body { background-size:827%; background-image:url( https://i.imgur.com/AgnZpAj.png );
- background-repeat:no-repeat;width:827%; }
- .clouds {position:fixed; left:0%; bottom:0%; width:100%; height:40%; display:inline; overflow: visible; pointer-events:none;
- opacity: 0.9; background:transparent url('https://i.imgur.com/geosgmp.png') repeat top center; z-index:0;
- -moz-animation:move-scrolling-front 800s linear infinite; -ms-animation:move-scrolling-front 800s linear infinite;
- -o-animation:move-scrolling-front 800s linear infinite; -webkit-animation:move-scrolling-front 800s linear infinite;
- animation:move-scrolling-front 800s linear infinite; } @keyframes move-scrolling-front{ from{background-position:0% 0%}
- to{background-position:300% 0%}} @-webkit-keyframes move-scrolling-front{from{background-position:0% 0%}
- to{background-position:300% 0%}} @-moz-keyframes move-scrolling-front{from{background-position:0% 0%}
- to{background-position:300% 0%}} @-ms-keyframes move-scrolling-front{from{background-position:0% 0%}
- to{background-position:300% 0%}}
- </style>
- <div id="1" class="genealogy"> </style> <style type="text/css">
- #box1 { width:20%; height:8%; position:fixed; overflow:hidden; border-radius:500px; color:#daf;
- transition:7s ease; background:#040; border:solid 6px #059;
- font-family:calligraffitti, times; font-size:40px; letter-spacing:1px; text-align:center;
- line-height:60px; padding:1px; box-shadow:0px 0px 18px 4px #cbf; left:0.6%; top:4%; }
- #box1:hover { width:99%; height:97.7%; transition:7s ease; left:0%; top:0%; z-index:1; background:#040;
- border-radius:20px; border:solid 7px #059; box-shadow:0px 0px 20px 30px #daf;
- overflow:auto; color:transparent; padding:1px; font-size:20px; line-height:0px; }
- </style> <div id="box1"> Lore <div class="clouds"> </div>
- <div style="color:#daf;font-family:calligraffitti, arial;font-size:164px;
- text-align:center;margin-top:200px;line-height:50px;letter-spacing:10px;">
- <h3> Ali-Jhaa </h3><p><br>The family Lore</div>
- <div style="color:#9df;font-family:calligraffitti, arial;font-style:italic;font-size:48px;line-height:68px;
- padding:80px 60px 40px 45px;text-align:left;"> <li> ... <p><br>
- </div></div>
- <div id="2" class="genealogy"> </style> <style type="text/css">
- #box2 { width:20%; height:8%; position:fixed; overflow:hidden; border-radius:500px; color:#daf;
- transition:7s ease; background:#040; border:solid 6px #059;
- font-family:calligraffitti, times; font-size:40px; letter-spacing:1px; text-align:center;
- line-height:60px; padding:1px; box-shadow:0px 0px 18px 4px #cbf; left:78.2%; top:4%; }
- #box2:hover { width:99%; height:97.7%; transition:7s ease; left:0%; top:0%; z-index:1;opacity:1;
- background-size:100% 100%; background-image:url( https://i.imgur.com/y6zbfvj.png ); background-repeat:no-repeat;
- border-radius:20px; border:solid 7px #059; box-shadow:0px 0px 20px 30px #daf;
- overflow:auto; font-weight:none; color:transparent; padding:1px; font-size:20px; line-height:0px; }
- </style> <div id="box2"> Inlaws <div class="clouds"> </div>
- <img src=" https://i.imgur.com/pdk62x5.png " style="width:100%;height:3600px;opacity:1;margin-top:542px;"> </div></div>
- <div id="3" class="genealogy"> </style> <style type="text/css">
- #box3 { width:20%; height:8%; position:fixed; overflow:hidden; border-radius:500px; color:#daf;
- transition:7s ease; background:#040; border:solid 6px #059;
- font-family:calligraffitti, times; font-size:40px; letter-spacing:1px; text-align:center;
- line-height:60px; padding:1px; box-shadow:0px 0px 18px 4px #cbf; left:0.6%; top:70%; }
- #box3:hover { width:98.1%; height:95.9%; transition:7s ease; left:0%; top:0%; z-index:1;
- border-radius:20px; border:solid 17px #059; box-shadow:0px 0px 20px 30px #059;
- overflow:auto; color:transparent; padding:1px; font-size:20px; line-height:0px; }
- </style> <div id="box3"> Ali Jhaa <div class="clouds"> </div>
- <img src=" https://i.imgur.com/Y9PBRLd.png " style="width:100%;"> </div></div>
- <div id="4" class="genealogy"> </style> <style type="text/css">
- #box4 { width:20%; height:8%; position:fixed; overflow:hidden; border-radius:500px; color:#daf;
- transition:7s ease; background:#040; border:solid 6px #059;
- font-family:calligraffitti, times; font-size:40px; letter-spacing:1px; text-align:center;
- line-height:60px; padding:1px; box-shadow:0px 0px 18px 4px #cbf; left:26.5%; top:70%; }
- #box4:hover { width:99%; height:97.7%; transition:7s ease; left:0%; top:0%; z-index:1;background:#040;
- border-radius:20px; border:solid 7px #059; box-shadow:0px 0px 20px 30px #daf;
- overflow:auto; font-weight:none; color:transparent; padding:1px; font-size:20px; line-height:0px; }
- </style> <div id="box4"> Timeline <div class="clouds"> </div>
- </div>
- <div id="5" class="genealogy"> </style> <style type="text/css">
- #box5 { width:20%; height:8%; position:fixed; overflow:hidden; border-radius:500px; color:#daf;
- transition:7s ease; background:#040; border:solid 6px #059;
- font-family:calligraffitti, times; font-size:40px; letter-spacing:1px; text-align:center;
- line-height:60px; padding:1px; box-shadow:0px 0px 18px 4px #cbf; left:52.5%; top:70%; }
- #box5:hover { width:97.2%; height:94.7%; transition:7s ease; left:0%; top:0%; z-index:1;background:#040;
- border-radius:20px; border:solid 17px #059; box-shadow:0px 0px 20px 30px #daf;
- overflow:auto; font-weight:none; color:transparent; padding:1px; font-size:20px; line-height:0px; }
- </style> <div id="box5"> Updates <div class="clouds"> </div>
- </div>
- <div id="6" class="genealogy"> </style> <style type="text/css">
- #box6 { width:20%; height:8%; position:fixed; overflow:hidden; border-radius:500px; color:#daf;
- transition:7s ease; background:#040; border:solid 6px #059;
- font-family:calligraffitti, times; font-size:40px; letter-spacing:1px; text-align:center;
- line-height:60px; padding:1px; box-shadow:0px 0px 18px 4px #cbf; left:78.2%; top:70%; }
- #box6:hover { width:97.2%; height:94.7%; transition:7s ease; left:0%; top:0%; z-index:1;background:#040;
- border-radius:20px; border:solid 17px #059; box-shadow:0px 0px 20px 30px #daf;
- overflow:auto; font-weight:none; color:transparent; padding:1px; font-size:20px; line-height:0px; }
- </style> <div id="box6"> Images <div class="clouds"> </div>
- <div style="font-size:244px;font-style:italic;text-align:center;
- letter-spacing:9px;color:#089;margin-top:320px;"> Ali-Jhaa </div>
- <div style="font-size:64px;font-style:italic;line-height:86px;text-align:left;padding:0px 60px 40px 40px;
- letter-spacing:1px;color:#09b;margin-top:360px;"> Caption
- <center><img src=" x " style="width:100%;margin-top:80px;border-radius:20px;
- border:5px solid #059;box-shadow:0px 0px 40px 4px #cbf;"></center> </div></div>
- <div id="7" class="genealogy"> </style> <style type="text/css">
- #box7 { width:20%; height:8%; position:fixed; overflow:hidden; border-radius:500px; color:#daf;
- transition:7s ease; background:#040; border:solid 6px #059;
- font-family:calligraffitti, times; font-size:40px; letter-spacing:1px; text-align:center;
- line-height:60px; padding:1px; box-shadow:0px 0px 18px 4px #cbf; left:0.6%; top:85%; }
- #box7:hover { width:99%; height:97.7%; transition:7s ease; left:0%; top:0%; z-index:1; background:#040;
- border-radius:20px; border:solid 7px #059; box-shadow:0px 0px 20px 30px #daf;
- overflow:auto; color:transparent; padding:1px; font-size:20px; line-height:0px; }
- </style> <div id="box7"> Overview <div class="clouds"> </div>
- <img src=" https://i.imgur.com/egaMyvR.jpg " style="width:100%;margin-top:5px;"> </div>
- <div id="8" class="genealogy"> </style> <style type="text/css">
- #box8 { width:20%; height:8%; position:fixed; overflow:hidden; border-radius:500px; color:#daf;
- transition:7s ease; background:#040; border:solid 6px #059;
- font-family:calligraffitti, times; font-size:40px; letter-spacing:1px; text-align:center;
- line-height:60px; padding:1px; box-shadow:0px 0px 18px 4px #cbf; left:78.2%; top:85%; }
- #box8:hover { width:99%; height:97.7%; transition:7s ease; left:0%; top:0%; z-index:1; background:#040;
- border-radius:20px; border:solid 7px #059; box-shadow:0px 0px 20px 30px #daf;
- overflow:auto; color:transparent; padding:1px; font-size:20px; line-height:0px; }
- </style> <div id="box8"> Background <div class="clouds"> </div>
- <img src=" https://i.imgur.com/1tffTYT.png " style="width:100%;margin-top:5px;"> </div></div>
- <div id="end" class="genealogy"></style><style type="text/css">
- #boxend {left:41%;top:1%;opacity:1;font-size:46px;font-family:calligraffitti, sans-serif;color:#daf;opacity:1;position:fixed;}
- </style><div id="boxend"> Ali-Jhaa 5/24/20 </div></div></script></body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement