Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <style>
- @import url('https://fonts.googleapis.com/css?family=Alex+Brush|Alike|Allan|Audiowide');
- body {
- background-image: url("https://i.imgur.com/HlgqL0a.png");
- background-attachment: fixed;
- background-position: top;
- color: black;
- background-color:#c2e4ce;
- font-family: "Alike";
- font-size: 16px;
- }
- #credit {
- Position: fixed; bottom: 10px; left: 10px;
- font-family: "Audiowide";
- font-size: 14px;
- z-index: 99;
- text-shadow: 2px 0 0 #4C9DCC, -2px 0 0 #4C9DCC, 0 2px 0 #4C9DCC, 0 -2px 0 #4C9DCC, 1px 1px #4C9DCC, -1px -1px 0 #4C9DCC, 1px -1px 0 #4C9DCC, -1px 1px 0 #4C9DCC;
- }
- #LeftPic{
- position: fixed; left: -940px; right: 0px; top: -240px; bottom: 0px; margin: auto;
- height: 200px;
- border: solid 10px gray;
- z-index: 2;
- }
- #RightPic{
- position: fixed; left: 0px; right: -940px; top: 0px; bottom: -240px; margin: auto;
- border: solid 10px black;
- height: 200px;
- z-index: 2;
- }
- #FrameTopLeft{
- position: fixed; left: -500px; right: 0px; top: -500px; bottom: 0px; margin: auto;
- width: 450px;
- height: 10px;
- background-color: gray;
- z-index: 1;
- }
- #FrameTopRight{
- position: fixed; left: 0px; right: -500px; top: -500px; bottom: 0px; margin: auto;
- width: 450px;
- height: 10px;
- background-color: black;
- z-index: 1;
- }
- #FrameLeft{
- position: fixed; left: -940px; right: 0px; top: 0px; bottom: 0px; margin: auto;
- width: 10px;
- height: 500px;
- background-color: gray;
- z-index: 1;
- }
- #FrameRight{
- position: fixed; left: 0px; right: -940px; top: 0px; bottom: 0px; margin: auto;
- width: 10px;
- height: 500px;
- background-color: black;
- z-index: 1;
- }
- #FrameBottomLeft{
- position: fixed; left: -500px; right: 0px; top: 0px; bottom: -500px; margin: auto;
- width: 450px;
- height: 10px;
- background-color: gray;
- z-index: 1;
- }
- #FrameBottomRight{
- position: fixed; left: 0px; right: -500px; top: 0px; bottom: -500px; margin: auto;
- width: 450px;
- height: 10px;
- background-color: black;
- z-index: 1;
- }
- #BoxBG{
- position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; margin: auto;
- width: 420px;
- height: 570px;
- background-image: linear-gradient(to right, gray , black);
- z-index: 2;
- }
- #Quote {
- position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; margin: auto;
- width: 390px;
- height: 540px;
- color: black;
- z-index: 5;
- font-size: 30px;
- font-family: "Alex Brush";
- background-image: url("https://i.imgur.com/Z7nU0yR.png");
- }
- #tab {
- position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; margin: auto;
- width: 370px;
- height: 520px;
- padding: 10px;
- background-color: white;
- background-image: url("");
- overflow: auto;
- z-index: 15;
- display: none;
- }
- /* Background pattern from Toptal Subtle Patterns */
- #Stats:target #tab, #Personality:target #tab, #Abilities:target #tab, #History:target #tab, #OOC:target #tab {
- display: block;
- z-index: 99;
- }
- #Navigation {
- position: fixed; left: -940px; right: 0px; top: 0px; bottom: -240px; margin: auto;
- width: 200px;
- padding: 0 100 0 100;
- height: 220px;
- z-index: 15;
- text-align: center;
- }
- #Friends {
- position: fixed; left: 0px; right: -940px; top: -240px; bottom: 0px; margin: auto;
- width: 200px;
- height: 220px;
- padding: 0 100 0 100;
- z-index: 15;
- text-align: center;
- overflow: auto;
- }
- #NaviBox {
- width: 200px;
- height: 25px;
- background-color: gray;
- margin: 0px;
- margin-bottom: 14px;
- font-size: 20px;
- }
- #FriendBox {
- width: 200px;
- height: 25px;
- background-color: black;
- margin: 0px;
- margin-bottom: 14px;
- font-size: 20px;
- }
- a.credit:link {color:#f0f0f0; font-family: "Audiowide"; font-size: 16px; text-decoration:none;}
- a.credit:visited {color:#f0f0f0;}
- a.credit:hover {color:#6f52be;}
- a.nav:link {color:#f0f0f0; text-decoration:none; font-family: "Allan";
- -webkit-transition: 0.5s linear;
- -moz-transition: 0.5s linear;
- -o-transition: 0.5s linear;
- transition: 0.5s linear;
- }
- a.nav:visited {color:#f0f0f0;}
- a.nav:hover {color:#0c8dbc;}
- a {color: gray; text-decoration:none; font-family: "Allan";
- -webkit-transition: 0.5s linear;
- -moz-transition: 0.5s linear;
- -o-transition: 0.5s linear;
- transition: 0.5s linear;
- }
- a:visited {color: gray;}
- a:hover {color:#0c8dbc;}
- b {color: gray;}
- h1, h2, h3 {
- text-align: center;
- font-family: "Allan";
- margin: 0px;
- padding: 5px;
- }
- ::-webkit-scrollbar {
- width: 5px;
- height: 1px;
- }
- ::-webkit-scrollbar-track {
- border-radius: 5px;
- }
- ::-webkit-scrollbar-thumb {
- background: transparent;
- }
- </style>
- <body>
- <div id="FrameTopLeft"></div>
- <div id="FrameTopRight"></div>
- <div id="FrameLeft"></div>
- <div id="FrameRight"></div>
- <div id="FrameBottomLeft"></div>
- <div id="FrameBottomRight"></div>
- <div id="BoxBG"></div>
- <div id="Navigation">
- <div id="NaviBox"><a class="nav" href="#Stats">Stats</a></div>
- <div id="NaviBox"><a class="nav" href="#Personality">Personality</a></div>
- <div id="NaviBox"><a class="nav" href="#Abilities">Inventory</a></div>
- <div id="NaviBox"><a class="nav" href="#History">History</a></div>
- <div id="NaviBox"><a class="nav" href="#OOC">Out of Character</a></div>
- <div id="NaviBox"><a class="nav" href="#Back">Back</a></div>
- </div>
- <div id="Friends">
- <div id="FriendBox"><a class="nav" target="_blank" href="FRIENDLINKHERE" title="FRIENDDESCRIPTIONHERE">Friend Name</a></div>
- <div id="FriendBox"><a class="nav" target="_blank" href="FRIENDLINKHERE" title="FRIENDDESCRIPTIONHERE">Friend Name</a></div>
- <div id="FriendBox"><a class="nav" target="_blank" href="FRIENDLINKHERE" title="FRIENDDESCRIPTIONHERE">Friend Name</a></div>
- <div id="FriendBox"><a class="nav" target="_blank" href="FRIENDLINKHERE" title="FRIENDDESCRIPTIONHERE">Friend Name</a></div>
- <div id="FriendBox"><a class="nav" target="_blank" href="FRIENDLINKHERE" title="FRIENDDESCRIPTIONHERE">Friend Name</a></div>
- <div id="FriendBox"><a class="nav" target="_blank" href="FRIENDLINKHERE" title="FRIENDDESCRIPTIONHERE">Friend Name</a></div>
- <div id="FriendBox"><a class="nav" target="_blank" href="FRIENDLINKHERE" title="FRIENDDESCRIPTIONHERE">Friend Name</a></div>
- <div id="FriendBox"><a class="nav" target="_blank" href="FRIENDLINKHERE" title="FRIENDDESCRIPTIONHERE">Friend Name</a></div>
- <div id="FriendBox"><a class="nav" target="_blank" href="FRIENDLINKHERE" title="FRIENDDESCRIPTIONHERE">Friend Name</a></div>
- <div id="FriendBox"><a class="nav" target="_blank" href="FRIENDLINKHERE" title="FRIENDDESCRIPTIONHERE">Friend Name</a></div>
- <div id="FriendBox"><a class="nav" target="_blank" href="FRIENDLINKHERE" title="FRIENDDESCRIPTIONHERE">Friend Name</a></div>
- </div>
- <img id="LeftPic" src="http://i.picpar.com/E7kf.png" alt="left picture"></div>
- <img id="RightPic" src="http://i.picpar.com/H7kf.gif" alt="right picture"></div>
- <div id="Quote">
- <div style="display: table; width: 390px; height: 540px; overflow: hidden;">
- <div style="display: table-cell; vertical-align: middle; text-align: center;">
- My mind remains my pain, <br>
- I'm tied down to this chain
- </div></div></div>
- <div id="Stats">
- <div id="tab">
- <h1>Stats</h1>
- <b>Name:</b><span style=float:right>Skye Rose</span><br>
- <b>Alias:</b><span style=float:right>The wondering rose</span><br>
- <b>Age:</b><span style=float:right>26</span><br>
- <b>Race:</b><span style=float:right>Human</span><br>
- <b>Sexuality:</b><span style=float:right>Bisexual</span><br>
- <b>Status:</b><span style=float:right><a target="_blank" href="Insert link here">Single</a></span><br>
- <b>Occupation:</b><span style=float:right>Pianoist and singer</span><br>
- <b>Voice:</b><span style=float:right><a target="_blank" href="https://www.youtube.com/watch?v=cIlghWDd7RU">♥</a></span><br>
- <b>Likes:</b><span style=float:right>Piano, Ink, Piercings, ECT.</span><br>
- <b>Dislikes:</b><span style=float:right>Vore, Rape/Force, Incest, Anal, She-males, ECT.</span>
- </div></div>
- <div id="Personality">
- <div id="tab">
- <h1>Personality</h1>
- Intelligent, Artistic, Caring, Gentle, Nuturing, Has a temper (When provoked)
- </div></div>
- <div id="Abilities">
- <div id="tab">
- <h1>Inventory</h1>
- <a href="http://i.picpar.com/M7kf.jpg" target="_blank"><img src="http://i.picpar.com/M7kf.jpg" width="75" height="75" border="1px solid"></a>
- <a href="http://i.picpar.com/N7kf.jpg" target="_blank"><img src="http://i.picpar.com/N7kf.jpg" width="75" height="75" border="1px solid"></a>
- <a href="http://i.picpar.com/O7kf.jpg" target="_blank"><img src="http://i.picpar.com/O7kf.jpg" width="75" height="75" border="1px solid"></a>
- <a href="http://i.picpar.com/P7kf.jpg" target="_blank"><img src="http://i.picpar.com/P7kf.jpg" width="75" height="75" border="1px solid"></a>
- </div></div>
- <div id="History">
- <div id="tab">
- <h1>History</h1>
- Will tell another time.
- </div></div>
- <div id="OOC">
- <div id="tab">
- <h1>Out of Character</h1>
- <li>Dont force me things I dont like.</li>
- <li>Dont be afraid to say hello.</li>
- <li>Ic =/= OOC</li>
- <li>Happily Married IRL.</li>
- <li>Story before smut!!!</li>
- <li>Once mated, sex with ONLY mate. </li>
- <li>SEX IS EARNED!!!</li>
- <li> Not my own art, will take down at request. </li>
- </div></div>
- <div id="credit"><a class="credit" href="https://roleplay.chat/profile.php?user=Spaceman+Codes">Spaceman</a></div>
- </body>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement