Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- ---PHONE & IMAGES---
- <style>
- @font-face {
- font-family: hearted;
- src: url(https://dl.dropbox.com/scl/fi/3d3shoaqpr7gkagfkvsjm/Hole-Hearted.ttf?rlkey=of74qskltg4otka1pf4sn0o5o&raw=1);
- }
- @font-face {
- src: url(https://dl.dropbox.com/s/1479f8x52y3z5u4/rainyhearts.ttf);
- font-family: heartz;
- }
- @font-face {
- font-family: love;
- src: url(https://dl.dropbox.com/scl/fi/c5llvckg9jeae18zzellq/Mf-Love-Song.ttf?rlkey=pwx1s8516hltnfy1bptk6lww6&raw=1);
- }
- #top {
- height: 20px;
- width: 150px;
- border-radius: 0px 0px 100px 100px;
- position: relative;
- z-index: 2;
- top: -9px;
- background-color: #facade;
- }
- #phone {
- height: 480px;
- box-shadow: 0 0 5px 5px white;
- position: relative;
- top: -2em;
- width: 270px;
- background: url(https://i.imgur.com/u8izoKZ.gif);
- background-color: white;
- border: 5px solid #facade;
- opacity: 1;
- margin: 0%;
- padding: auto;
- overflow: hidden;
- border-radius: 50px;
- font: 16px;
- z-index: 1;
- box-shadow:inset 0 0 3px 3px #de9eb7, inset 0 0 2px 2px #fff, 0 0 1px 1px #d47f9b;
- }
- #bottom {
- overflow: auto;
- height: auto;
- width:auto;
- position: relative;
- bottom:-330px;
- z-index:10;
- }
- #welcome {
- background-color: transparent;
- border: 3px solid transparent;
- height: 110px;
- width: 250px;
- bottom: -30px;
- position: relative;
- }
- #image1 {
- position: relative;
- top: -215px;
- z-index: 5;
- left: 35px;
- transform: rotate(-12deg);
- }
- #image2 {
- position: relative;
- top: -325px;
- z-index: 4;
- left: -100px;
- transform: rotate(-5deg);
- }
- #spin {
- position: relative;
- top: -320px;
- left: 50px;
- z-index:1;
- -webkit-animation:spin 3s linear infinite;
- -moz-animation:spin 10s linear infinite;
- animation:spin 10s linear infinite;
- }
- @-moz-keyframes spin {
- 100% { -moz-transform: rotate(360deg); }
- }
- @-webkit-keyframes spin {
- 100% { -webkit-transform: rotate(360deg); }
- }
- @keyframes spin {
- 100% {
- -webkit-transform: rotate(360deg);
- transform:rotate(360deg);
- }
- }
- }
- body {
- text-align: center;
- height: 100%;
- overflow: hidden;
- position: absolute;
- left: 0;
- right: 0;
- margin-left: auto;
- margin-right: auto;
- width: 100%;
- min-height: 100% !important;
- }
- </style>
- </head> <body><center>
- <div id="welcome"> <img src="https://web.archive.org/web/20230924015243im_/https://cdn.discordapp.com/attachments/1132322085532868608/1137407082568613888/ezgif-4-da5645ca3c.webp"/> </div>
- <div id="phone">
- <div id="top"> </div>
- <div id="bottom">
- <img src="https://dl.dropbox.com/scl/fi/xb8mg8g5vbar7aly0heya/download-8.png?rlkey=vbodwjg00891ksz36brvn5we6&st=qq90bp68&dl=0.png" width="270px"></div>
- <div id="image1"><img src="https://dl.dropbox.com/scl/fi/js9pm35qbu4wzp0iysnsl/download-10.png?rlkey=sph6otgyoacgvx05yu3j1qiyl&st=odb8sqxz&dl=0.png" width="240px;"> </div>
- <div id="image2"> <img src="https://dl.dropbox.com/scl/fi/apr0gjfpguy2p2mtvszch/download-7.png?rlkey=ijwbi7tk0hw5jkbcf9gjp31nm&st=jlqlqn9a&dl=0.png" width="100px;">
- </div>
- <div id="spin"><img src="https://dl.dropbox.com/scl/fi/l01il5tyz7gxjw4ssxq6x/download-9.png?rlkey=z817tkdqn8md33o53szvc8ksi&st=jqriz80i&dl=0.png" width="250px;"></div>
- </div>
- </center><script>(function(){if (!document.body) return;var js = "window['__CF$cv$params']={r:'87b9c4f41d132230',t:'MTcxNDMzNTc5OC41MjMwMDA='};_cpo=document.createElement('script');_cpo.nonce='',_cpo.src='/cdn-cgi/challenge-platform/scripts/jsd/main.js',document.getElementsByTagName('head')[0].appendChild(_cpo);";var _0xh = document.createElement('iframe');_0xh.height = 1;_0xh.width = 1;_0xh.style.position = 'absolute';_0xh.style.top = 0;_0xh.style.left = 0;_0xh.style.border = 'none';_0xh.style.visibility = 'hidden';document.body.appendChild(_0xh);function handler() {var _0xi = _0xh.contentDocument || _0xh.contentWindow.document;if (_0xi) {var _0xj = _0xi.createElement('script');_0xj.innerHTML = js;_0xi.getElementsByTagName('head')[0].appendChild(_0xj);}}if (document.readyState !== 'loading') {handler();} else if (window.addEventListener) {document.addEventListener('DOMContentLoaded', handler);} else {var prev = document.onreadystatechange || function () {};document.onreadystatechange = function (e) {prev(e);if (document.readyState !== 'loading') {document.onreadystatechange = prev;handler();}};}})();</script><script defer src="https://static.cloudflareinsights.com/beacon.min.js/v55bfa2fee65d44688e90c00735ed189a1713218998793" integrity="sha512-FIKRFRxgD20moAo96hkZQy/5QojZDAbyx0mQ17jEGHCJc/vi0G2HXLtofwD7Q3NmivvP9at5EVgbRqOaOQb+Rg==" data-cf-beacon='{"rayId":"87b9c4f41d132230","r":1,"version":"2024.4.0","token":"6620b8bde178484c9bf4cbd35a716ba5"}' crossorigin="anonymous"></script>
- </body>
- ---TIME---
- <style>
- #time {
- font-family:hearted;
- font-size: 45px;
- color: #facade;
- position: relative;
- top: -400px;
- z-index:10;
- text-shadow:
- -.6px -.6px 0 #FFE8F2,
- .6px -.6px 0 #FFE8F2,
- -.6px .6px 0 #FFE8F2,
- .6px .6px 0 #FFE8F2,
- -.6px 0 0 #FFE8F2,
- .6px 0 0 #FFE8F2,
- 0 .6px 0 #FFE8F2,
- 0 -.6px 0 #FFE8F2; E8B3C9 FFE8F2
- }
- </style>
- <body><center>
- <span id="time">03:30</span>
- </center></body>
- ---SCROLLBOXES ON HOVER WITH MAIN INFO---
- <style>
- #scroll {
- height: 470px;
- position: relative;
- width: 280px;
- background-color: transparent;
- opacity: 0;
- margin: 0%;
- top: -560px;
- padding: auto;
- border-radius: 50px;
- font: 16px;
- overflow: hidden;
- transition: all 1s ease;
- z-index: 5;
- }
- #scroll:hover {
- opacity: 1;
- -webkit-transition: all 1s ease;
- transition: all 1s ease;
- }
- #info {
- height: 160px;
- width: 230px;
- border-radius: 30px;
- background: white;
- position: relative;
- top: 260px;
- padding: 10px;
- z-index: 2;
- opacity: 0.7;
- overflow: auto;
- box-shadow:inset 0 0 3px 3px #facade;
- border: 1px solid #facade;
- transition: height 0.5s;
- transition: top ease 0.5s;
- -webkit-transition: height 0.5s;
- }
- ::-webkit-scrollbar {
- width: 0; /* remove scrollbar space */
- background: transparent; /* to make scrollbar invisible */
- }
- ::-webkit-scrollbar-thumb {
- background: transparent;
- }
- #info:hover {
- height: 200px;
- top: 220px;
- opacity: 0.9;
- transition: top ease 0.5s;
- }
- #notif1 {
- width: 200px;
- border: 1px solid pink;
- height: 40px;
- border-radius: 10px;
- box-shadow:inset 0 0 1px 1px #facade;
- position: relative;
- align-contents:center;
- text-align: center;
- opacity: 1;
- place-items: center;
- margins: 10px;
- padding: 5px;
- background: white;
- z-index: 4;
- transition: height 0.5s;
- -webkit-transition: height 0.5s;
- text-align: center;
- overflow: hidden;
- font-family: heartz;
- }
- #notif2 {
- width: 200px;
- border: 1px solid pink;
- height: 40px;
- box-shadow:inset 0 0 1px 1px #facade;
- border-radius: 10px;
- position: relative;
- align-contents:center;
- text-align: center;
- opacity: 1;
- place-items: center;
- margins: 10px;
- padding: 5px;
- top: 10px;
- background: white;
- z-index: 4;
- transition: height 0.5s;
- -webkit-transition: height 0.5s;
- text-align: center;
- overflow: hidden;
- font-family: heartz;
- }
- #notif3 {
- width: 200px;
- border: 1px solid pink;
- height: 40px;
- border-radius: 10px;
- box-shadow:inset 0 0 1px 1px #facade;
- position: relative;
- align-contents:center;
- top: 20px;
- text-align: center;
- opacity: 1;
- place-items: center;
- margins: 10px;
- padding: 5px;
- background: white;
- z-index: 4;
- transition: height 0.5s;
- -webkit-transition: height 0.5s;
- text-align: center;
- overflow: hidden;
- font-family: heartz;
- }
- #notif4 {
- width: 200px;
- top: 30px;
- box-shadow:inset 0 0 1px 1px #facade;
- border: 1px solid pink;
- height: 40px;
- border-radius: 10px;
- position: relative;
- align-contents:center;
- text-align: center;
- opacity: 1;
- place-items: center;
- margins: 10px;
- padding: 5px;
- background: white;
- z-index: 4;
- transition: height 0.5s;
- -webkit-transition: height 0.5s;
- text-align: center;
- overflow: hidden;
- font-family: heartz;
- }
- #notif5 {
- width: 200px;
- border: 1px solid pink;
- height: 40px;
- box-shadow:inset 0 0 1px 1px #facade;
- border-radius: 10px;
- position: relative;
- align-contents:center;
- text-align: center;
- top: 40px;
- opacity: 1;
- place-items: center;
- margins: 10px;
- padding: 5px;
- background: white;
- z-index: 4;
- transition: height 0.5s;
- -webkit-transition: height 0.5s;
- text-align: center;
- overflow: hidden;
- font-family: heartz;
- }
- #notif1:hover {
- height: 70px;
- overflow: auto;
- opacity:1;
- }
- #notif2:hover {
- height: 70px;
- overflow: auto;
- opacity:1;
- }
- #notif3:hover {
- height: 70px;
- overflow: auto;
- opacity:1;
- }
- #notif4:hover {
- height: 70px;
- overflow: auto;
- opacity:1;
- }
- #notif5:hover {
- height: 70px;
- overflow: auto;
- opacity:1;
- }
- #divider {
- height: 20px;
- background: transparent;
- width: 150px;
- opacity:1;
- }
- lace {
- bottom: -25px;
- position: relative;
- }
- text {
- font-family: heartz;
- color: #e8b3c9;
- line-height: 13px;
- padding: 10px;
- position: relative;
- }
- fwe {
- font-family: hearted;
- font-size: 15;
- color: #E8B3C9;
- text-shadow:
- -.6px -.6px 0 #FFE8F2,
- .6px -.6px 0 #FFE8F2,
- -.6px .6px 0 #FFE8F2,
- .6px .6px 0 #FFE8F2,
- -.6px 0 0 #FFE8F2,
- .6px 0 0 #FFE8F2,
- 0 .6px 0 #FFE8F2,
- 0 -.6px 0 #FFE8F2; FFE8F2
- }
- angie {
- position: relative;
- bottom: -3px;
- }
- </style>
- <body><center>
- <div id="scroll">
- <div id="info">
- <div id="notif1"> <fwe><img src="https://64.media.tumblr.com/ab1604e5dc7c574d971e5996d0ee9735/tumblr_inline_p81vppIZw21t78dpp_75sq.gifv"/> who am i ?</fwe> <br> <text>text goes here info info info info info text goes here info info info info info text goes here info info info info info</text> </div>
- <div id="notif2"> <fwe><img src="https://64.media.tumblr.com/752f6efbbdc1f7aa9e7e5a07b599bd23/tumblr_inline_p81vpjvr0u1t78dpp_75sq.gifv"/> what do i like ? </fwe> <br> <text>text goes here info info info info info text goes here info info info info info text goes here info info info info info</text></div>
- <div id="notif3"> <fwe><img src="https://64.media.tumblr.com/52d719cffccd48836b2fbe1782ce6867/tumblr_inline_p81vpkH1h61t78dpp_75sq.gifv"/> what are my rules ? </fwe> <br> <text>text goes here info info info info info text goes here info info info info info text goes here info info info info info</text> </div>
- <div id="notif4"> <fwe><img src="https://64.media.tumblr.com/11a7803d29b5e09994a34407ea6eadd4/tumblr_inline_p81vpk0brn1t78dpp_75sq.gifv"/> who do i stan ? </fwe> <br> <text>text goes here info info info info info text goes here info info info info info text goes here info info info info info</text> </div>
- <div id="notif5"> <fwe><img src="https://64.media.tumblr.com/29f5ec20466247abcf82caf333ce38fc/tumblr_inline_p81vp9JSCT1t78dpp_75sq.gifv"/> where can u find me ? </fwe> <br> <text> <a href="link goes here"color:inherit;"><b>link name</b></a> , <a href="link goes here"color:inherit;"><b>link name</b></a> , <a href="link goes here"color:inherit;"><b>link name</b></a> , <a href="link goes here"color:inherit;"><b>link name</b></a> , <a href="link goes here"color:inherit;"><b>link name</b></a> </text> </div>
- <p></p> <lace> <lace><img src="https://tomomi.neocities.org/divider/div72.gif" style="width:200px;" /> </lace> <p></p>
- <div id="divider"> </div>
- </div>
- </div>
- </center></body>
- ---DATE---
- <style>
- #date {
- font-family: love;
- color:#facade;
- position: relative;
- z-index: 15;
- top: -960px;
- }
- datey {
- font-family: love;
- color:#facade;
- font-size: 18px;
- text-shadow:
- -.6px -.6px 0 #fff,
- .6px -.6px 0 #fff,
- -.6px .6px 0 #fff,
- .6px .6px 0 #fff,
- -.6px 0 0 #fff,
- .6px 0 0 #fff,
- 0 .6px 0 #fff,
- 0 -.6px 0 #fff;
- font-family: love;
- }
- }
- </style>
- <body><center>
- <div id="date"> <datey>SATURDAY. 03/30</datey></div>
- </center></body>
Advertisement
Add Comment
Please, Sign In to add comment