Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!-----------------------------------------------------------------------
- About Page [05]: Deceit
- Made by glenthemes
- Initial release: 2018/08/11
- Last updated: 2022/09/14
- TERMS OF USE:
- 1) Do not remove the theme credit.
- 2) Do not repost/redistribute my themes.
- 3) Do not take parts of the code and use it as your own.
- 4) Do not use my themes as a base code.
- 5) Do not mix my themes together.
- Please stick to the TOU! Make 9S proud.
- ------------------------------------------------------------------------>
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="//www.w3.org/1999/xhtml" xml:lang="en" lang="en">
- <head>
- <title>{Title}</title>
- <link rel="shortcut icon" href="{Favicon}">
- <!--------------------JAVASCRIPTS-------------------->
- <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
- <script src="//static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
- <script>
- (function($){
- $(document).ready(function(){
- $("a[title]").style_my_tooltips({
- tip_follows_cursor:true,
- tip_delay_time:0,
- tip_fade_speed:250,
- attribute:"title"
- });
- });
- })(jQuery);
- </script>
- <script src ="//static.tumblr.com/2pnwama/HGEpacv22/hearts.js"></script>
- <link href="//fonts.googleapis.com/css?family=Inconsolata|Quicksand:400,500|Source+Code+Pro|Unica+One" rel="stylesheet">
- <!-------------------------------------------------------------------->
- <style type="text/css">
- /*-------------------TOOLTIPS--------------------*/
- #s-m-t-tooltip {
- padding: 3.5px 9px;
- margin: 26px 9px 0px 15px;
- background-color: #333; /* tooltip background color */
- font-family: quicksand;
- font-size: 9px;
- text-transform: uppercase;
- letter-spacing:1px;
- color: #eee; /* tooltip text color */
- z-index:99999999999999999999999999998!important;
- max-width: 40vw;
- -webkit-transition: all 0.3s ease-in-out;
- -moz-transition: all 0.3s ease-in-out;
- -o-transition: all 0.3s ease-in-out;
- }
- /*--------------------TUMBLR CONTROLS--------------------*/
- iframe#tumblr_controls, .iframe-controls--desktop {
- top:7px!important;
- right:7px!important;
- position:fixed!important;
- /* delete the next 2 lines to have white tumblr controls */
- filter:invert(100%) hue-rotate(180deg);
- -webkit-filter:invert(100%) hue-rotate(180deg);
- transform:scale(0.7,0.7);
- -webkit-transform:scale(0.7,0.7);
- transform-origin:100% 0;
- z-index:999999!important;
- }
- /*--------------------TEXT HIGHLIGHT--------------------*/
- ::selection {
- background:#fafafa;
- color:#555;
- }
- ::-moz-selection {
- background:#fafafa;
- color:#555;
- }
- /*--------------------BASICS--------------------*/
- body {
- background-color:#fdfdfd; /* background color */
- background-image:url(''); /* background image URL */
- background-attachment:fixed;
- background-repeat:repeat;
- color:#888; /* body text color */
- cursor:normal;
- font-family:source code pro;
- line-height:1.6em;
- font-size:12px;
- text-align:left;
- overflow:hidden;
- }
- blockquote {
- padding-left:10px;
- margin-left:5px;
- border-left:1px solid;
- border-color:#aaa;
- margin:10px;
- }
- a {
- color:#000;
- text-decoration:none;
- -webkit-transition: all 0.4s ease-in-out;
- -moz-transition: all 0.4s ease-in-out;
- -o-transition: all 0.4s ease-in-out;
- }
- b, strong {
- font-weight:bold;
- color:#555;
- }
- pre, code {
- white-space:pre-wrap;
- display:block;
- }
- hr {
- width:70%;
- border-width:0px;
- height:1px;
- background-color:#bbb;
- }
- /*--------------------EVERYTHING--------------------*/
- /* best not to touch this section */
- #wrappy {
- position:fixed;
- top:50%;left:50%;
- transform:translate(-50%,-50%);
- width:calc(200px + 40px + 200px + 100px + 500px);
- /* yorha icon + gap1 + bars + gap2 + bio box */
- display:flex;
- }
- /*--------------------LEFT CONTENT--------------------*/
- #left {
- -webkit-align-self:center;
- align-self:center;
- }
- #topwrap1 {display:flex;}
- /*----LEFT IMAGE----*/
- #yorha {
- vertical-align:middle;
- -webkit-align-self:center;
- align-self:center;
- width:200px; /* please do not make it larger */
- }
- #sbstats {
- -webkit-align-self:center;
- align-self:center;
- margin-left:40px;
- }
- /*----STATISTICS BARS----*/
- .statbar {
- margin-top:15px;
- width:calc(200px - 1px);
- height:8px;
- background-color:#fbfbfb; /* empty color */
- border:0.5px solid #222; /* whole bar border */
- overflow:hidden;
- }
- .statbar:first-child {margin-top:0px;}
- .statfill {
- margin-top:0px;
- margin-left:0px;
- height:inherit;
- background-color:#222; /* fill color */
- }
- .bar-label {
- margin-top:8px;
- font-family:source code pro;
- font-size:8px;
- text-transform:uppercase;
- color:#999; /* bar label text color */
- line-height:1em;
- }
- /*----STATISTICS TABLE----*/
- #stat-table {
- margin-top:20px;
- font-family:source code pro;
- font-size:9px;
- text-transform:uppercase;
- letter-spacing:0.5px;
- color:#999; /* statistics table text color */
- line-height:1.5em;
- }
- #stat-table table {
- margin:-6px -17px;
- border-spacing:17px 6px;
- }
- #stat-table tr {
- vertical-align:top;
- }
- /*----CUSTOM LINKS----*/
- #c-title {
- /* best not to touch the next 2/3 lines */
- margin-top:30px;
- width:calc((200px + 40px + 200px) - 24px);
- /* leftwidth - leftright padding - border */
- background-color:#f9f9f9; /* custom links title background color */
- padding:12px;
- font-family:quicksand;
- text-transform:uppercase;
- letter-spacing:2px;
- font-weight:500;
- font-size:11px;
- color:#aaa6ac; /* custom links title color */
- line-height:1em;
- text-align:center;
- }
- /* best not to touch this section */
- #c-links {
- margin-top:12px;
- margin-left:-2px;
- width:calc(100% + 6px);
- }
- #c-links a {
- /* best not to touch the next 3 lines */
- display:inline-block;
- margin:5px 2px;
- width:calc(25% - 6px - (4px * 6));
- background-color:#f9f9f9; /* custom links background color */
- padding:6px 10px;
- font-family:quicksand;
- text-transform:uppercase;
- letter-spacing:2px;
- font-weight:500;
- font-size:9px;
- color:#aaa6ac; /* custom links text color */
- text-align:center;
- }
- #c-links a:hover {
- background-color:#f4f4f4; /* custom links background hover color */
- }
- /*--------------------RIGHT--------------------*/
- /* best not to touch the first 3 sections */
- #right {
- -webkit-align-self:center;
- align-self:center;
- }
- #righteo {
- margin-left:100px;
- width:500px;
- }
- #titlewrap {
- display:flex;
- line-height:1em;
- margin-bottom:-1px;
- }
- /*----BIOGRAPHY TITLE----*/
- #maintitle {
- font-family:unica one;
- text-transform:uppercase;
- letter-spacing:2px;
- font-weight:500;
- font-size:20px;
- color:#555; /* biography box title color */
- text-align:left;
- }
- /* flashing text input underline */
- .input {
- margin-top:1em;
- margin-left:0.5ch;
- width:10px;
- height:1.5px;
- background-color:#555; /* flashing input line color */
- animation: flashing 1s step-start 0s infinite;
- -webkit-animation: flashing 1s step-start 0s infinite;
- -moz-animation: flashing 1s step-start 0s infinite;
- }
- @keyframes flashing {
- 50% {opacity:0;}
- }
- @-webkit-keyframes flashing {
- 50% {opacity:0;}
- }
- @-moz-keyframes flashing {
- 50% {opacity:0;}
- }
- /*----BIOGRAPHY BOX----*/
- #mainbox {
- margin-top:20px;
- height:400px; /* box height */
- padding:25px;
- background-color:#fafafa; /* box background color */
- border:1px solid #f2f2f2; /* box border */
- }
- .sbimage {
- float:right;
- margin-left:25px;
- height:100%;
- }
- .bio {
- max-height:100%;
- padding-right:10px;
- overflow:auto;
- font-family:inconsolata;
- font-size:12px;
- color:#aaa; /* biography text color */
- line-height:1.9em;
- text-align:justify;
- }
- .bio a {
- padding-bottom:1px;
- border-bottom:1px solid #ddd; /* biography links bottom border */
- color:#333; /* biography links color */
- }
- /*----BIOGRAPHY BULLET POINTS----*/
- .bullet-line {
- display:flex;
- margin-bottom:5px;
- }
- .bullet-line:last-of-type {margin-bottom:0px;}
- .bio .cursor {
- -webkit-align-self:center;
- align-self:center;
- width:22px; /* width of bullet point icon */
- }
- .bullet-text {
- margin-left:12px;
- }
- .bullet-text name {
- text-transform:uppercase;
- letter-spacing:1px;
- color:#222; /* bullet point label color */
- }
- .bio::-webkit-scrollbar {
- background-color:#fafafa; /* biography scrollbar background color */
- height:13px;
- width:13px;
- }
- .bio::-webkit-scrollbar-thumb {
- background-color:#ccc; /* biography scrollbar color */
- border:6px solid #fafafa; /* biography scrollbar background color */
- }
- .bio::-webkit-scrollbar-track {
- background-color:#fafafa; /* biography scrollbar background color */
- }
- .bio p:last-child {margin-bottom:0px;}
- /*--------------------MUSIC PLAYER--------------------*/
- #glenjamin {
- position:fixed;
- bottom:0;margin-bottom:20px;
- left:0;margin-left:20px;
- display:flex;
- z-index:2;
- }
- .buttoms {cursor:pointer;}
- .playy, .pausee {
- font-size:13px;
- color:#111; /* audio buttons color */
- }
- .pausee {
- display:none;
- margin-right:1.5px;
- }
- .sonata {
- margin-left:10px;
- color:#111; /* music icon color */
- }
- .labeltext {
- margin-left:8px;
- font-family:courier new;
- font-size:9px;
- color:#111; /* music text color */
- }
- /*---------------CREDIT. PLEASE DO NOT REMOVE---------------*/
- #glencred {
- position:fixed;
- bottom:0;margin-bottom:20px;
- right:0;margin-right:20px;
- font-family:quicksand;
- text-transform:uppercase;
- letter-spacing:2px;
- font-weight:500;
- font-size:8px;
- color:#999; /* credit link color */
- z-index:10;
- }
- </style>
- </head>
- <body>
- <!---- CREDIT. PLESAE DO NOT REMOVE! THANKS! ---->
- <a id="glencred" href="//glenthemes.tumblr.com" title="page by glenthemes">glenthemes</a>
- <!---- MUSIC PLAYER ---->
- <div id="glenjamin">
- <div class="buttoms" onclick="kaishi();">
- <a title="play music"><div class="playy">►</div></a>
- <a title="pause music"><div class="pausee">❚❚</div></a>
- </div><!--please do not delete this line-->
- <div class="sonata">♫</div>
- <!--music name-->
- <div class="labeltext">Fortress of Lies</div>
- </div><!--please do not delete this line-->
- <!-- music track URL -->
- <!-- put the music link between "" of src="" -->
- <!-- tutorial: linktr.ee/direct_file_links -->
- <audio id="tune" src="https://rhizo.gitlab.io/nier/Fortress_of_Lies.mp3" onended="restart();" type="audio"></audio>
- <div id="wrappy">
- <div id="left">
- <div id="topwrap1">
- <!---- LEFT SIDEBAR IMAGE ---->
- <img id="yorha" src="//78.media.tumblr.com/3da643846a21e88a3860ed0998436e02/tumblr_pd5bleZa0f1qg2f5co4_r1_540.png">
- <!---- STATISTICS BARS ---->
- <div id="sbstats">
- <!---- ONE BAR ---->
- <div class="statbar">
- <div class="statfill" style="width:70%"></div>
- </div>
- <div class="bar-label">> Lv. 99</div>
- <!---- ONE BAR ---->
- <div class="statbar">
- <div class="statfill" style="width:30%"></div>
- </div>
- <div class="bar-label">> 999,999 EXP</div>
- <!---- STATISTICS BARS ---->
- <div id="stat-table">
- <table>
- <tbody>
- <tr>
- <td>Vitals:</td>
- <td>Green</td>
- </tr>
- <tr>
- <td>Black Box Temp.:</td>
- <td>Normal</td>
- </tr>
- <tr>
- <td>Remaining Energy:</td>
- <td>100%</td>
- </tr>
- <tr>
- <td>System Check:</td>
- <td>Complete</td>
- </tr>
- </tbody>
- </table>
- </div><!--stat-table-->
- </div><!--sbstats--><!--please do not delete this line-->
- </div><!--topwrap1--><!--please do not delete this line-->
- <!---- CUSTOM LINKS TITLE ---->
- <div id="c-title">systems directory</div>
- <!---- CUSTOM LINKS ---->
- <div id="c-links">
- <a href="/">link one</a>
- <a href="/">link two</a>
- <a href="/">link three</a>
- <a href="/">link four</a>
- <a href="/">link five</a>
- <a href="/">link six</a>
- <a href="/">link seven</a>
- <a href="/">link eight</a>
- </div>
- </div><!--left--><!--please do not delete this line-->
- <div id="right">
- <div id="righteo">
- <div id="titlewrap">
- <!-- biography box title -->
- <div id="maintitle">YoRHa No.9 Type S</div>
- <div class="input"></div>
- </div><!--please do not delete this line-->
- <div id="mainbox">
- <!--biography box sidebar image-->
- <img class="sbimage" src="//78.media.tumblr.com/09c8bc923af499dcf667365c738d9981/tumblr_pd5bleZa0f1qg2f5co5_r1_400.png">
- <div class="bio">
- here lies your text
- <p>
- <!---- ONE BULLET POINT ---->
- <div class="bullet-line">
- <img class="cursor" src="https://static.tumblr.com/snld4jp/3Dsri7q7g/select_cursor_svg.svg">
- <div class="bullet-text">
- <name>Age:</name> 2-3 years
- </div><!--please do not delete this line-->
- </div><!--please do not delete this line-->
- <!---- ONE BULLET POINT ---->
- <div class="bullet-line">
- <img class="cursor" src="https://static.tumblr.com/snld4jp/3Dsri7q7g/select_cursor_svg.svg">
- <div class="bullet-text">
- <name>Race:</name> YoRHa Android
- </div><!--please do not delete this line-->
- </div><!--please do not delete this line-->
- <!---- ONE BULLET POINT ---->
- <div class="bullet-line">
- <img class="cursor" src="https://static.tumblr.com/snld4jp/3Dsri7q7g/select_cursor_svg.svg">
- <div class="bullet-text">
- <name>Occupation:</name> YoRHa Scanning Unit
- </div><!--please do not delete this line-->
- </div><!--please do not delete this line-->
- <p>
- Your biography text goes here!
- </div><!--bio->
- </div><!--mainbox-->
- </div><!--righteo--><!--please do not delete this line-->
- </div><!--right--><!--please do not delete this line-->
- </div><!--wrappy--><!--please do not delete this line-->
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement