Advertisement
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 type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.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>
- <script type="text/javascript">
- $(document).ready(function() {
- // Tooltip only Text
- $('.masterTooltip').hover(function(){
- // Hover over code
- var title = $(this).attr('title');
- $(this).data('tipText', title).removeAttr('title');
- $('<p class="tooltip"></p>')
- .text(title)
- .appendTo('body')
- .fadeIn('slow');
- }, function() {
- // Hover out code
- $(this).attr('title', $(this).data('tipText'));
- $('.tooltip').remove();
- }).mousemove(function(e) {
- var mousex = e.pageX + 20; //Get X coordinates
- var mousey = e.pageY + 10; //Get Y coordinates
- $('.tooltip')
- .css({ top: mousey, left: mousex })
- });
- });
- </script>
- <style>
- @import url('https://fonts.googleapis.com/css?family=Staatliches|Open Sans Condensed|Kumar One Outline');
- @import url('https://fonts.googleapis.com/css?family=Arizonia|Stalinist+One|Racing+Sans+One|Molle:400i|Barlow+Condensed');
- body {background-color: #ffd2d8;}
- /* The typing effect */
- @keyframes typing {
- from { width: 0 }
- to { width: 100% }
- }
- /* The typewriter cursor effect */
- @keyframes blink-caret {
- from, to { border-color: transparent }
- 50% { border-color: white}
- }
- .mainbox {position: fixed; background-color: #CF9FFF; width: 500px; height: 200px; border: 10px solid; border-color: #FFB4BF; margin: auto; left: 0px; right: 0px; top: 360px; bottom: 0px; background-size: 100%; z-index:4; border-radius:20px; box-shadow: 1px 1px 10px #;}
- .mainbox2 {position: fixed; background-color: #A389FF; width: 540px; height: 240px; border: 0px solid; border-color: #fff; margin: auto; left: 0px; right: 0px; top: 360px; bottom: 0px; background-size: 100%; z-index:4; border-radius:30px; box-shadow: 1px 1px 10px #;}
- .box2 {position: fixed; background-color: #CF9FFF; width: 250px; height: 150px; border: 10px solid; border-color: #FFB4BF; margin: auto; left: 250px; right: 0px; top: -90px; bottom: 0px; background-size: 100%; z-index:4; border-radius:20px; box-shadow: 1px 1px 10px #;}
- .outbox2 {position: fixed; background-color: #A389FF; width: 290px; height: 190px; border: 0px solid; border-color: #fff; margin: auto; left: 250px; right: 0px; top: -90px; bottom: 0px; background-size: 100%; z-index:4; border-radius:30px; box-shadow: 1px 1px 10px #;}
- .mainimg {position: absolute; width: 182px; height: 180px; border: 10px solid ; border-color: #FFB4BF; top: -235px; left: 0px; background: url(https://i.imgur.com/1BhF0VI.png); background-size: 100%; z-index:5;border-radius:600px; background-color:#CF9FFF}
- .ring {position: absolute; width: 202px; height: 200px; border: 10px solid ; border-color: #A389FF; top: -245px; left: -10px; background-size: 100%; z-index:5;border-radius:600px }
- .stripe1 {position: fixed; background-color: #FFB4BF; width: 260px; height: 18px; border: 0px solid; border-color: #fff; margin: auto; left: 240px; right: 0px; top:-200px; bottom: 0px; background-size: 100%; z-index:4; border-radius:0px; box-shadow: 1px 1px 10px #;}
- .stripe2 {position: fixed; background-color: #FFB4BF; width: 500px; height: 18px; border: 0px solid; border-color: #fff; margin: auto; left: 0px; right: 0px; top: 205px; bottom: 0px; background-size: 100%; z-index:4; border-radius:0px; box-shadow: 1px 1px 10px #;}
- .title { letter-spacing: 10; z-index: 10; position: fixed; left: -150px; bottom: 520px; font-family: 'Molle', cursive; font-size: 60px; color: #A389FF; position: absolute; width: 800px; letter-spacing:0px;
- -webkit-transform: rotate(-15deg);
- -moz-transform: rotate(-15deg);
- -o-transform: rotate(-15deg);
- -ms-transform: rotate(-15deg);
- transform: rotate(-15deg);}
- .xoxo { letter-spacing: 10; z-index: 10; position: fixed; left: 0px; bottom: 520px; font-family: 'Molle', cursive; font-size: 60px; color: #FFB4BF; position: absolute; width: 800px; letter-spacing: 0px;
- -webkit-transform: rotate(-15deg);
- -moz-transform: rotate(-15deg);
- -o-transform: rotate(-15deg);
- -ms-transform: rotate(-15deg);
- transform: rotate(-15deg);}
- .ooc { letter-spacing: 1; z-index: 10; position: fixed; left: 58px; bottom: -4px; font-family: 'Molle', cursive; font-size: 18px; color: #A389FF; position: absolute; width: 220px;}
- .stat{ letter-spacing: 1; z-index: 10; position: fixed; left: 200px; bottom: -4px; font-family: 'Molle', cursive; font-size: 18px; color: #A389FF; position: absolute; width: 220px;}
- .words {position: absolute; bottom: 1px; left: 17px; margin: auto;
- opacity:1;
- height: 110px;
- width: 225px;
- padding: 0px;
- text-align: justify;
- font-size: 12px;
- overflow: auto;
- text-ident: 10px;
- color: #ffffff;
- font-family: Barlow Condensed;
- }
- b {
- font-family: Staatliches;
- color: #ffd8ec;
- font-weight: bold;
- font-size: 12px;
- text-transform: uppercase;
- font-weight: 100;
- text-shadow: 0px 0px 0px #000;}
- ::-webkit-scrollbar {
- width: 4px;
- }
- /* Track */
- ::-webkit-scrollbar-track {
- background: #;
- }
- /* Handle */
- ::-webkit-scrollbar-thumb {
- background: #;
- }
- /* Handle on hover */
- ::-webkit-scrollbar-thumb:hover {
- background: #;
- }
- .put{position: absolute; bottom: 10px; left: 35px; margin: auto;
- opacity:1;
- height: 155px;
- width: 900px;
- padding: 0px;
- text-align: center;
- font-size: 12px;
- overflow: auto;
- text-indent: 0px;
- color: #e7e7e7;
- font-family: Barlow Condensed;
- z-index:0;overflow:auto transition: all 0.9s ease-in-out;
- -webkit-transition: all 0.4s ease-in-out;
- -moz-transition: all 0.4s ease-in-out;
- -o-transition: all 0.4s ease-in-out;
- -ms-transition: all 0.4s ease-in-out;}
- p{
- font-family: 'Barlow Condensed';
- font-size: 12px;
- letter-spacing: 0px;
- word-spacing: 0px;
- color: #e7e7e7;
- text-align: justify;
- line-height: 0px;
- margin: 0px 0px 0px 1px;}
- p.td {
- text-align: right;
- font-family: Barlow Condensed;
- margin-left: 295px;
- font-size: 16px;
- line-height: 1px;
- color: #ffffff; }
- td {
- text-align: left;
- line-height: 30px; }
- strong {
- font-family: Staatliches;
- color: #ffd8ec;
- font-weight: bold;
- font-size: 18px;
- text-transform: uppercase;
- font-weight: 100;
- text-shadow: 0px 0px 0px #000; }
- </style>
- </head>
- <body>
- <div class="mainbox2">
- <div class="mainbox">
- <div class="stripe2">
- <div class="stat">Statistics</div>
- </div>
- <div id="01" class="put">
- <table border="0" cellspacing="-10">
- <tr>
- <td><strong>Name</strong></td>
- <td>
- <p class="td">- -</p>
- </td>
- </tr><br>
- <tr>
- <td><strong>Moniker</strong></td>
- <td>
- <p class="td">- -</p>
- </td>
- </tr><br>
- <tr>
- <td><strong>Age</strong></td>
- <td>
- <p class="td">- -</p>
- </td>
- </tr>
- <tr>
- <td><strong>D.O.B.</strong></td>
- <td>
- <p class="td">- -</p>
- </td>
- </tr>
- <tr>
- <td><strong>Ethnicity</strong></td>
- <td>
- <p class="td">- -</p>
- </td>
- </tr>
- <tr>
- <td><strong>Gender</strong></td>
- <td>
- <p class="td">- -</p>
- </td>
- </tr>
- <tr>
- <td><strong>Build</strong></td>
- <td>
- <p class="td">- -</p>
- </td>
- </tr>
- <tr>
- <td><strong>Species</strong></td>
- <td>
- <p class="td">- -</p>
- </td>
- </tr>
- <tr>
- <td><strong>Abilities</strong></td>
- <td>
- <p class="td">- -</p>
- </td>
- </tr>
- <tr>
- <td><strong>Height</strong></td>
- <td>
- <p class="td">- -</p>
- </td>
- </tr>
- <tr>
- <td><strong>Orientation</strong></td>
- <td>
- <p class="td">- -</p>
- </td>
- </tr>
- <tr>
- <td><strong>Paramour</strong></td>
- <td>
- <p class="td">- - </p>
- </td>
- </tr>
- </table>
- </div>
- <div class="ring"></div>
- <div class="mainimg"></div>
- <div class="title">Cordelia</div>
- <div class="xoxo">xoxo</div>
- <div class="outbox2">
- <div class="box2">
- <div class="stripe1">
- <div class="ooc">Out of Character</div></div>
- <div class="words">
- <b>01.</b> - -<br><br>
- <b>02.</b> - - <br><br>
- <b>03.</b> - - <br><br>
- <b>04.</b> - - <br><br>
- <b>05.</b> - - <br><br>
- </div>
- </div>
- </div>
- </div>
- </div>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement