Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html>
- <head>
- <script src="//ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
- <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.6.5/dat.gui.min.js"></script>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/4.11.0/d3.min.js"></script>
- <script src="https://roleplay.chat/jquery.tooltipster.js?v=8"></script>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.3/TweenMax.min.js"></script>
- <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/87/three.js"></script>
- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/7.0.0/normalize.min.css">
- <link href="https://roleplay.chat/tooltipster.css" rel="stylesheet" type="text/css">
- <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">
- <script defer>
- window.onload = function() {
- };
- </script>
- <style>
- </style>
- </head>
- <body>
- //
- <style type="text/css">
- @import url(https://fonts.googleapis.com/css?family=Coda);
- @import url(https://fonts.googleapis.com/css?family=Karla);
- @import url(https://fonts.googleapis.com/css?family=Squada+One);
- body { background-color: #CD3E40; background-image: url(http://www.wallpapersin4k.org/wp-content/uploads/2017/04/Red-And-Blue-Wallpapers-8.jpg); background-attachment: fixed; background-position: center center; background-repeat: no repeat; background-size: cover;}
- .main-image {
- position: absolute;
- height: 480px;
- width: 250px;
- perspective: 700px;
- z-index: 3;
- top: 42px;
- left: 330px;
- animation: grym 3s 1;
- -webkit-animation: grym 3s 1;
- }
- .flipH .strawberry{transform: rotateY(-180deg);}
- .flipV .strawberry{transform: rotateX(180deg);}
- .flipH:hover .card{ transform: rotateY(180deg); }
- .flipV:hover .card{ transform: rotateX(-180deg); }
- .card, .tooth, .strawberry{
- height:100%;
- width:100%;
- border-radius:100%;
- backface-visibility: hidden;
- transition: all 1.5s;
- transform-style: preserve-3d;
- backface-visibility: hidden;
- position:absolute;
- opacity: 1;
- }
- a { background: #b29494; padding: 2px 5px 2px 5px; font-size: 9px; border-radius: 5px; font-family: karla; color: #fff; letter-spacing: .2; text-decoration: none;}
- *{cursor: url('http://media.tumblr.com/7c3edb626c8cf9435c5c0b2d6acceffd/tumblr_inline_mh67v6xNXM1rdqsqf.png'), default;}
- a:hover {cursor: url(http://cur.cursors-4u.net/others/oth-6/oth589.cur), progress !important; color: #fff; text-decoration: line-through; }
- ::-webkit-scrollbar-track {background-color:;}
- ::-webkit-scrollbar-thumb {background-color:;}
- ::-webkit-scrollbar {width:2px;height:5px;}
- b, strong { background: #DAE6E4; padding: 2px 2px 2px 2px; font-size: 9px; border-radius: 2px; font-family: karla; color: #07698A; letter-spacing: .2; }
- i {color: #5067A6;}
- U {color: #A16403;}
- .container { background-image:url('https://i.imgur.com/FbXrE9X.png'); background-attachment: absolute; background-position: center center; background-repeat: repeat; background-size: cover; position: absolute; top: 280px; left: 370px; height: 240px; width: 720px; border: 1px solid #07698A; border-radius: 10px 120px 120px 10px; overflow: hidden; z-index: 1000; z-index: 1;}
- .img { position: absolute; top: 42px; left: 330px; height: 480px; width: 250px; background-image: url("g"); background-size: 100% 100%; background-position: center center; overflow: hidden; z-index: 2;}
- .ooc { position: fixed; background-color: #F2F2F2; border: 1px #07698A solid; overflow: auto; width: 400; height: 190; top: 290px; left: 570; padding: 3px; text-align: justify; font-size: 11px; font-family: 'karla', sans-serif; color: #8a8790; line-height: 15px; z-index: 3;}
- .abox { background-color: #F2F2F2; color: #8a8790; font-size: 11px; font-family: 'karla', sans-serif; text-align: justify; position: absolute; width: 400; height: 190; left: 570; top: 290; line-height: 15px; padding: 3px; overflow:auto; border: 1px solid #07698A; z-index: 3;}
- .quote { position:fixed; top: 233px; left: 595px; text-align: left; font-family: 'Squada One'; text-shadow: -1px 0px 0px #4E7785, 0px 1px 0px #4E7785, 1px 0px 0px #4E7785, 0px -1px 0px #4E7785; font-size: 50px; color: #6ADDE6; z-index:999; text-align: center;}
- .navbar {Background-color: transparent; Position: absolute; left: 570px; top: 500px; z-index: 3000; }
- .link1 {Position: absolute; Border: solid 1px #000; Height: 10px; Width: 70px; background-image:url('http://www.pixeden.com/media/k2/galleries/93/004-subtle-light-pattern-background-texture.jpg'); border: 1px solid #07698A; border-radius: 0;}
- .link2 {Position: absolute; Left: 108px; Border: solid 1px #000; Height: 10px; Width: 70px; background-image:url('http://www.pixeden.com/media/k2/galleries/93/004-subtle-light-pattern-background-texture.jpg'); border: 1px solid #07698A; border-radius: 0;}
- .link3 {Position: absolute; Left: 218px; Border: solid 1px #000; Height: 10px; Width: 70px; background-image:url('http://www.pixeden.com/media/k2/galleries/93/004-subtle-light-pattern-background-texture.jpg'); border: 1px solid #07698A; border-radius: 0;}
- .link4 {Position: absolute; Left: 327px; Border: solid 1px #000; Height: 10px; Width: 70px; background-image:url('http://www.pixeden.com/media/k2/galleries/93/004-subtle-light-pattern-background-texture.jpg'); border: 1px solid #07698A; border-radius: 0;}
- .link1:hover {Background-color: #d3895a; -webkit-transition: background-color 1s ease-in-out; -moz-transition: background-color 1s ease-in-out; -o-transition: background-color 1s ease-in-out; transition: background-color 1s ease-in-out;}
- .link2:hover {Background-color: #d3895a; -webkit-transition: background-color 1s ease-in-out; -moz-transition: background-color 1s ease-in-out; -o-transition: background-color 1s ease-in-out; transition: background-color 1s ease-in-out;}
- .link3:hover {Background-color: #d3895a; -webkit-transition: background-color 1s ease-in-out; -moz-transition: background-color 1s ease-in-out; -o-transition: background-color 1s ease-in-out; transition: background-color 1s ease-in-out;}
- .link4:hover {Background-color: #d3895a; -webkit-transition: background-color 1s ease-in-out; -moz-transition: background-color 1s ease-in-out; -o-transition: background-color 1s ease-in-out; transition: background-color 1s ease-in-out;}
- h1 { font-family: coda; font-size: 10px; color: #CC5252; text-transform: uppercase; letter-spacing: 5px; border-bottom: 2px solid #CC5252; background: transparent; text-align: right; margin-right: 3px; margin-left: 3px; line-height: 17px; margin-top: 1px;}
- .slide {Position: fixed; Height: 555555; Width: 555555; Top: 0px; Left: 0px; Z-index: -1; Opacity: 0; transition: 0.8s; -moz-transition: 0.8s; webkit-transition: 0.8s; -o-transition: 0.8s;}
- .slide:target {Left: 0; Opacity: 1; Z-index: 1000; transition: 0.8s; -moz-transition: 0.8s; webkit-transition: 0.8s; -o-transition: 0.8s;}
- .credit { position: fixed; Bottom: 10px; Right: 10px; height: 25px; width: 25px; background-color: #111; border: 1px solid #222; font-size: 15px; font-family: karla; text-align: justify; color: #ccc; z-index: 7000; text-align: center; line-height: 25px;}
- </style>
- <div id="content">
- <div class="main-image flipH flipper">
- <div class="card">
- <div class="tooth">
- <img src="https://i.imgur.com/5NN7l6e.pngg" height="100%";>
- </div>
- <div class="strawberry">
- <img src="https://i.imgur.com/dmAZAMJ.png" height="100%">
- </div>
- </div>
- </div>
- <div id="quote">
- <center></center>
- <div class="quote">Android 21</div>
- <div class="container"></div>
- <div class="img"></div>
- <div class="ooc">
- <h1>Dossier</h1>
- <b>Name:</b> <i>Android 21</i><br>
- <b>Age:</b> <i>21</i> (<span title="Really 47">Allegedly</span>)<br>
- <b>Sex:</b> <i>Female</i><br>
- <b>Orientation:</b> <i>Pansexual</i><br>
- <b>Material Status:</b> <i>Single, married to science.</i><br>
- <b>Height:</b> <i>Five foot, five inches</i><br>
- <b>Eye Color</b> <i>Blue</i><br>
- <b>Hair </b> <i>Auburn </i><br>
- <b>Theme </b> <i><a target="_blank" href="https://soundcloud.com/fm-attack/images-of-you">Music</a> </i><br>
- <b>Gallery </b> <i><a target="_blank" href="https://imgur.com/a/vFoyW">Click here</a> </i><br>
- </div>
- <div class="navbar">
- <a class="link1" href="#1"></a>
- <a class="link2" href="#2"></a>
- <a class="link3" href="#3"></a>
- <a class="link4" href="#4"></a>
- </div>
- <div id="1" class="slide">
- <div class="abox">
- <h1>History</h1>
- Coming Soon
- </div></div>
- <div id="2" class="slide">
- <div class="abox">
- <h1>Persons of Interest</h1></center><br>
- </center><br>
- <a target="_blank"href="https://roleplay.chat/profile.php?user=Son+Goku "><img src="https://68.media.tumblr.com/8f413722ec4cd644a050072b21a098f3/tumblr_om64anmAML1uuj1vto1_500.gif" height="75" width="75" align="left" border="3"></a>
- <center><b>-Son Goku-</b><br> <i> Neutral </i><br> Rather annoying...wont stay out of my lab</center><br><br><br><br>
- <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
- <center><b>- Name -</b><br> <i>foe/friend/neutral</i><br> small note.</center><br><br><br><br>
- <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
- <center><b>- Name -</b><br> <i>foe/friend/neutral</i><br> small note.</center><br><br><br><br>
- <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
- <center><b>- Name -</b><br> <i>foe/friend/neutral</i><br> small note.</center><br><br><br><br>
- <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
- <center><b>- Name -</b><br> <i>foe/friend/neutral</i><br> small note.</center><br><br><br><br>
- <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
- <center><b>- Name -</b><br> <i>foe/friend/neutral</i><br> small note.</center><br><br><br><br>
- <a target="_blank" href="PROFILE LINK HERE"><img src="IMAGE LINK HERE" height="75" width="75" align="left" border="3"></a>
- <center><b>- Name -</b><br> <i>foe/friend/neutral</i><br> small note.</center><br><br><br><br></div></div>
- <div id="3" class="slide">
- <div class="abox">
- <h1>Out of Character</h1>
- <li>IC =/= OOC</li>
- <li>No auto pairing.</li>
- <li>Play the character as I see fit, if you don't agree there are other 21's running around.</li>
- <li>Fairly PM friendly.</li>
- <li>If I don't reply means I'm away or busy. Best to leave me mail when this happens if you need to reach me.</li>
- </i>
- </div></div>
- <div class="credit"><a target="_blank" href="http://abadbitchcodes.tumblr.com/" target="_blank">©</div>
- </body>
- </html>
Add Comment
Please, Sign In to add comment