Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <style>
- @import url('https://fonts.googleapis.com/css?family=Cute+Font|Special+Elite|Unica+One');
- body {
- background-image: url("https://pngimage.net/wp-content/uploads/2018/06/sis-efekti-png-6.png");
- background-attachment: fixed;
- background-position: top;
- color: #f6a905;
- background-color:#F9E956;
- font-family: "Special Elite";
- font-size: 12px;
- }
- #credit {
- Position: fixed; bottom: 10px; left: 10px;
- font-family: "Cute Font";
- font-size: 18px;
- text-shadow: 2px 0 0 #F6A905, -2px 0 0 #F6A905, 0 2px 0 #F6A905, 0 -2px 0 #F6A905, 1px 1px #F6A905, -1px -1px 0 #F6A905, 1px -1px 0 #F6A905, -1px 1px 0 #F6A905;
- z-index: 99;
- }
- #nav1 {
- position: fixed; left: -1000px; right: 0px; top: -450px; bottom: 0px; margin: auto;
- height: 150px;
- width: 150px;
- border: 10px solid #F6A905;
- border-radius: 50%;
- -webkit-border-radius: 50%;
- -moz-border-radius: 50%;
- z-index: 2;
- }
- #nav2 {
- position: fixed; left: -650px; right: 0px; top: -450px; bottom: 0px; margin: auto;
- height: 150px;
- width: 150px;
- border: 10px solid #F6A905;
- border-radius: 50%;
- -webkit-border-radius: 50%;
- -moz-border-radius: 50%;
- z-index: 2;
- }
- #nav3 {
- position: fixed; left: -300px; right: 0px; top: -450px; bottom: 0px; margin: auto;
- height: 150px;
- width: 150px;
- border: 10px solid #F6A905;
- border-radius: 50%;
- -webkit-border-radius: 50%;
- -moz-border-radius: 50%;
- z-index: 2;
- }
- #nav4 {
- position: fixed; left: 0px; right: -50px; top: -450px; bottom: 0px; margin: auto;
- height: 150px;
- width: 150px;
- border: 10px solid #F6A905;
- border-radius: 50%;
- -webkit-border-radius: 50%;
- -moz-border-radius: 50%;
- z-index: 2;
- }
- #nav5 {
- position: fixed; left: 0px; right: -400px; top: -450px; bottom: 0px; margin: auto;
- height: 150px;
- width: 150px;
- border: 10px solid #F6A905;
- border-radius: 50%;
- -webkit-border-radius: 50%;
- -moz-border-radius: 50%;
- z-index: 2;
- }
- #nav6 {
- position: fixed; left: 0px; right: -750px; top: -450px; bottom: 0px; margin: auto;
- height: 150px;
- width: 150px;
- border: 10px solid #F6A905;
- border-radius: 50%;
- -webkit-border-radius: 50%;
- -moz-border-radius: 50%;
- z-index: 2;
- }
- #mainpic {
- position: fixed; left: -800px; right: 0px; top: 0px; bottom: -185px; margin: auto;
- height: 400px;
- border: 8px solid #F6A905;
- z-index: 2;
- }
- #mainpic2 {
- position: fixed; left: -800px; right: 0px; top: 0px; bottom: -185px; margin: auto;
- height: 400px;
- border: 8px solid #F6A905;
- z-index: 3;
- opacity: 0;
- }
- #mainpic2:hover {
- opacity: 1;
- }
- #tab { position: fixed; left: 0px; right: 0px; top: 0px; bottom: 0px; margin: auto;
- height: 360px;
- width: 490px;
- z-index:2;
- visibility: hidden;
- }
- #OOC #tab {
- visibility: visible;
- }
- #OOC:target #tab, #Stats:target #tab, #About:target #tab, #Abilities:target #tab, #History:target #tab, #Friends:target #tab {
- visibility: visible;
- z-index: 99;
- }
- #header {
- position: fixed; left: 0px; right: 0px; top: -145px; bottom: 0px; margin: auto;
- width: 300px;
- height: 25px;
- padding: 10px;
- border: 8px solid #F6A905;
- background-color: #f8ec7e;
- background-image: url("https://www.transparenttextures.com/patterns/nice-snow.png");
- font-family: 'Unica One';
- font-size: 16px;
- }
- #box {
- position: fixed; left: 0px; right: 0px; top: 0px; bottom: -240px; margin: auto;
- width: 400px;
- height: 230px;
- padding: 10px;
- border: 8px solid #f6a905;
- background-color: #F8EC7E;
- background-image: url("https://www.transparenttextures.com/patterns/nice-snow.png");
- overflow: auto;
- }
- .friendpic {
- border: 5px solid #f6a905;
- width: 100px;
- height: 100px;
- margin: 5px;
- pointer-events: auto;
- }
- #bordertop {
- position: fixed; left: 0px; right: 0px; top: 0px; bottom: -55px; margin: auto;
- border-top: 8px solid #f6a905;
- border-left: 8px solid #f6a905;
- height: 500px;
- width: 1200px;
- z-index: 1;
- }
- #borderbottom {
- position: fixed; left: -200px; right: 0px; top: 0px; bottom: -55px; margin: auto;
- border-bottom: 8px solid #f6a905;
- height: 500px;
- width: 1000px;
- z-index: 1;
- }
- #title {
- position: fixed; left: 0px; right: -800px; top: 0px; bottom: -100px; margin: auto;
- line-height: normal;
- font-size: 100px;
- height: 300px;
- width: 300px;
- z-index: 1;
- }
- a.credit:link {color:#f0f0f0;}
- a.credit:visited {color:#f0f0f0;}
- a.credit:hover {color:#FCD0A8;}
- a.credit {text-decoration:none;}
- a {text-decoration: none; color: white;}
- a:visited {color: white;}
- a:hover {color: red;}
- b {color:#E26C00;}
- h1, h2, h3 {
- text-align: center;
- margin: 0px;
- padding: 0px;
- font-family: "Unica One";
- }
- ::-webkit-scrollbar {
- width: 2px;
- height: 1px;
- }
- ::-webkit-scrollbar-track {
- border-radius: 4px;
- }
- ::-webkit-scrollbar-thumb {
- background: #FF7028;
- }
- </style>
- <body>
- <div id="bordertop"></div>
- <div id="borderbottom"></div>
- <a href="#OOC"><img id="nav1" src="https://i.pinimg.com/564x/24/19/d0/2419d047cb4460c05735ab2666b7af52.jpg"></div></a>
- <a href="#Stats"><img id="nav2" src="https://i.pinimg.com/564x/d9/63/30/d963309baea5ecff8d9db3d860f4101b.jpg"></div></a>
- <a href="#About"><img id="nav3" src="https://media.giphy.com/media/2ekc49Kd3tqow/giphy.gif"></div></a>
- <a href="#Abilities"><img id="nav4" src="https://media.giphy.com/media/2nwha0bnvjOJq/giphy.gif"></div></a>
- <a href="#History"><img id="nav5" src="https://i.pinimg.com/originals/ef/c1/57/efc157c900cd54004058782608c99b7f.jpg"></div></a>
- <a href="#Friends"><img id="nav6" src="https://i.pinimg.com/564x/7b/9b/78/7b9b787b84f62e71eb59fea70e91812b.jpg"></div></a>
- <img id="mainpic" src="https://i.pinimg.com/564x/d2/cf/68/d2cf68a0a4a3e9382c4187c1c3ef211e.jpg" />
- <img id="mainpic2" src="https://i.pinimg.com/564x/8e/69/25/8e69252468716399218c2be0077f5b76.jpg" />
- <div id="title">'O Ke <br>Keike<br>Ikaika</div>
- <div id="OOC">
- <div id="tab">
- <div id="header">
- <h1>Out of Character</h1>
- </div>
- <div id="box">
- <b>01.</b> Raaaawr!<br>
- <b>02.</b> I'm a scary dragon, hear me roar!<br>
- <b>03.</b> Fightfightfightfight.<br>
- <b>04.</b> Maika'i is super cool, I wish I was as stronk as her...<br>
- <b>05.</b> Ice types rule! Dragons are still pretty cool, though.<br>
- <b>06.</b> My eyes are up here, bro.<br>
- <b>07.</b> I'm a tall ass lady, do you feel short yet?<br>
- <b>08.</b> Battle-ready armor mode activate; you better watch out.<br>
- <b>09.</b> Double D threat level.<br>
- <b>10.</b> I'll take you out twice as hard.
- </div>
- </div></div>
- <div id="Stats">
- <div id="tab">
- <div id="header">
- <h1>Stats</h1>
- </div>
- <div id="box">
- <b>Given Name:</b><font style=float:right>Info</font><br><br>
- <b>Nickname(s):</b><font style=float:right>Info</font><br><br>
- <b>Age:</b><font style=float:right>Info</font><br><br>
- <b>D.o.B.:</b><font style=float:right>Info</font><br><br>
- <b>P.o.B.:</b><font style=float:right>Info</font><br><br>
- <b>Gender:</b><font style=float:right>Info</font><br><br>
- <b>Occupation:</b><font style=float:right>Info</font><br><br>
- <b>Alignment:</b><font style=float:right>Info</font><br><br>
- <b>Orientation:</b><font style=float:right>Info</font><br><br>
- <b>Marital:</b><font style=float:right>Info</font><br><br>
- <b>Species:</b><font style=float:right>Info</font><br><br>
- <b>Race:</b><font style=float:right>Info</font><br><br>
- <b>Hair Color:</b><font style=float:right>Info</font><br><br>
- <b>Eye Color:</b><font style=float:right>Info</font><br><Br>
- <b>Height:</b><font style=float:right>Info</font><br><br>
- <b>Weight:</b><font style=float:right>Info</font>
- </div>
- </div></div>
- <div id="About">
- <div id="tab">
- <div id="header">
- <h1>Gijinka Stats</h1>
- </div>
- <div id="box">
- You're gonna wanna double-space all of your stats because empty space in boxes looks silly...
- </div>
- </div></div>
- <div id="Abilities">
- <div id="tab">
- <div id="header">
- <h1>Skills</h1>
- </div>
- <div id="box">
- Probably these too!<br>
- <b>Skill Name:</b> Skill description....<br>
- <b>Skill Name:</b> Skill description....<br>
- <b>Skill Name:</b> Skill description....<br>
- <b>Skill Name:</b> Skill description....<br>
- <b>Skill Name:</b> Skill description....<br>
- <b>Skill Name:</b> Skill description....<br>
- <b>Skill Name:</b> Skill description....<br>
- <b>Skill Name:</b> Skill description....<br>
- <b>Skill Name:</b> Skill description....<br>
- <b>Skill Name:</b> Skill description....<br>
- <b>Skill Name:</b> Skill description....<br>
- </div>
- </div></div>
- <div id="History">
- <div id="tab">
- <div id="header">
- <h1>History</h1>
- </div>
- <div id="box">
- Lorem ipsum dolor sit amet...
- </div>
- </div></div>
- <div id="Friends">
- <div id="tab">
- <div id="header">
- <h1>Friends</h1>
- </div>
- <div id="box">
- <center>
- <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
- <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
- <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
- <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
- <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
- <a target="_blank" href="https://roleplay.chat/profile.php?user=USERHERE"><img src="PICHERE" class="friendpic" title="DESCRIPTION OF FRIEND HERE"></a>
- </center>
- </div>
- </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