Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <style>
- .lovely {
- position: fixed;
- right: 3px;
- bottom: 3px;
- }
- .lovely a {
- font-family: calibri;
- font-size: 9px;
- text-transform: uppercase;
- color: #a1a1a1;
- letter-spacing: 0px;
- text-decoration: none;
- -webkit-transition: all .5s ease-in-out;
- -moz-transition: .5s ease-in-out;
- }
- .lovely a:hover {
- color: #000;
- }
- </style>
- <div class="lovely">
- <a href="http://loveatelier.tumblr.com/sites">R</a>
- </div>
- <BODY oncontextmenu="return false" onselectstart="return false" ondragstart="return false">
- <style>
- .clearfix { margin-top: -125px; }
- br { line-height: 0px; }
- td td td br { line-height: auto; }
- table, tr, td { background-color: transparent !important; }
- table table { visibility: hidden; }
- table table table, table.blurbs td.text, span.orangetext15, #footerWarpper { display: none; }
- div table,table.blurbs,table.blurbs table {visibility: visible;display: table;_display: inline;}
- div div table div, div.clearfix a, input { display: none; }
- div.clearfix table div div, #footerWarpper { display: block; }
- body {
- background-color: #0b0b0b;
- }
- .container {
- background-color: #0b0b0b;
- width: 550px;
- height: 400px;
- margin: auto;
- position: absolute;
- top: 0px;
- left: 0;
- bottom: 0;
- right: 0;
- }
- .leftcont {
- background-color: #151515;
- width: 50%;
- height: 100%;
- position: absolute;
- float: left;
- }
- .nav {
- background-color: transparent;
- width: 175px;
- height: 30px;
- margin-top: 10px;
- margin-left: 395px;
- position: absolute;
- }
- .nav a {
- display: inline-block;
- text-align: center;
- width: 30px;
- height: 15px;
- background-color: #2a7c77;
- color: #ffffff;
- font-family: Calibri;
- font-size: 5px;
- text-transform: uppercase;
- letter-spacing: 1px;
- line-height: 15px;
- text-decoration: none;
- margin-right: 5px;
- -webkit-transition: all 0.4s ease-in-out;
- -moz-transition: all 0.4s ease-in-out;
- -o-transition: all 0.4s ease-in-out;
- transition: all 0.4s ease-in-out;
- }
- .nav a:hover {
- letter-spacing: 2px;
- }
- [data-tooltip] {
- position: relative;
- z-index: 2;
- cursor: pointer;
- }
- [data-tooltip]:before,
- [data-tooltip]:after {
- visibility: hidden;
- -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
- filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=0);
- opacity: 0;
- pointer-events: none;
- bottom: 40px;
- }
- [data-tooltip]:before {
- position: absolute;
- left: 0px;
- margin-bottom: 0px;
- margin-left: 0px;
- padding: 0px;
- width: 30px;
- height: 15px;
- background-color: #2b292e;
- color: #ffffff;
- font-family: Calibri;
- font-size: 5px;
- text-transform: uppercase;
- content: attr(data-tooltip);
- text-align: center;
- letter-spacing: 1px;
- line-height: 15px;
- -webkit-transition: all 0.4s ease-in-out;
- -moz-transition: all 0.4s ease-in-out;
- -o-transition: all 0.4s ease-in-out;
- transition: all 0.4s ease-in-out;
- }
- [data-tooltip]:hover:before,
- [data-tooltip]:hover:after {
- visibility: visible;
- -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
- filter: progid: DXImageTransform.Microsoft.Alpha(Opacity=100);
- opacity: 1;
- bottom: 0px;
- }
- .heading {
- background-color: #151515;
- width: 300px;
- height: 100px;
- margin-top: 70px;
- position: absolute;
- }
- .heading h1 {
- font-family: "Oswald", sans-serif;
- font-size: 35px;
- color: #ebebeb;
- margin: 0px 0px 0px 20px;
- padding: 0px 0px 0px 0px;
- }
- .heading h2 {
- font-family: "Oswald", sans-serif;
- font-size: 30px;
- color: #ebebeb;
- margin: -10px 0px 0px 20px;
- padding: 0px 0px 0px 0px;
- -webkit-animation-name: fadeInRight;
- animation-name: fadeInRight;
- -webkit-animation-duration: 1.5s;
- animation-duration: 1.5s;
- -webkit-animation-fill-mode: both;
- animation-fill-mode: both;
- }
- .leftpara {
- background-color: transparent;
- width: 275px;
- height: 190px;
- margin: 150px 0px 0px 0px;
- position: absolute;
- }
- .tabs input[type="radio"] {
- position: absolute;
- top: -9999px;
- left: -9999px;
- }
- .tabs {
- width: 300px;
- float: none;
- list-style: none;
- position: relative;
- padding: 0;
- margin-top: -36px;
- margin-left: 155px;
- }
- .tabs li {
- float: left;
- }
- .tabs label {
- text-align: center;
- display: inline-block;
- padding: 0px;
- background-color: #2a7c77;
- color: #ffffff;
- font-size: 7px;
- line-height: 19px;
- letter-spacing: 0px;
- width: 22px;
- height: 20px;
- margin-right: 10px;
- text-transform: uppercase;
- font-family: calibri;
- position: relative;
- -webkit-transition: all 0.4s ease-in-out;
- -moz-transition: all 0.4s ease-in-out;
- -o-transition: all 0.4s ease-in-out;
- transition: all 0.4s ease-in-out;
- }
- .tabs label:hover {
- background-color: #2b292e;
- color: #ffffff;
- }
- [id^="tab"]:checked + label {
- background: #2b292e;
- color: #ffffff;
- }
- [id^="tab"]:checked ~ [id^="tab-content"] {
- display: block;
- }
- .tab-content {
- z-index: 2;
- display: none;
- color: #a2a2a2;
- font-family: calibri;
- font-size: 10px;
- letter-spacing: 1px;
- word-spacing: 1px;
- width: 240px;
- padding: 5px;
- height: 140px;
- text-transform: normal;
- text-align: justify;
- position: absolute;
- top: 55px;
- left: -145px;
- overflow: auto;
- -webkit-animation-duration: 1.5s;
- -o-animation-duration: 1.5s;
- -moz-animation-duration: 1.5s;
- animation-duration: 1.5s;
- }
- .musicbox {
- background-color: #transparent;
- width: 255px;
- height: 40px;
- margin-left: 10px;
- margin-top: 360px;
- }
- .player {
- position: absolute;
- overflow: hidden;
- width: 17px;
- margin-top: 8px;
- margin-left: 5px;
- }
- .songtitle {
- background-color: #transparent;
- position: absolute;
- width: 220px;
- margin-top: 11px;
- margin-left: 35px;
- }
- .rightcont {
- background-color: transparent;
- width: 50%;
- height: 100%;
- position: relative;
- float: right;
- opacity: .7;
- -webkit-transition: all 0.7s ease-in-out;
- -moz-transition: all 0.7s ease-in-out;
- -o-transition: all 0.7s ease-in-out;
- transition: all 0.7s ease-in-out;
- }
- .rightcont:hover {
- opacity: 0.9;
- }
- .quotestuff {
- background-color: transparent;
- width: 250px;
- height: 150px;
- position: absolute;
- z-index: 2;
- margin-left: 13px;
- margin-top: 285px;
- -webkit-animation-name: fadeInRight;
- animation-name: fadeInRight;
- -webkit-animation-duration: 1.5s;
- animation-duration: 1.5s;
- -webkit-animation-fill-mode: both;
- animation-fill-mode: both;
- }
- .quotestuff h1 {
- font-family: calibri;
- text-transform: uppercase;
- text-align: center;
- font-size: 7px;
- letter-spacing: 1.5px;
- font-weight: lighter;
- color: #ebebeb;
- margin: 0px 0px 0px 0px;
- padding: 0px 0px 0px 0px;
- }
- .quotestuff h2 {
- font-family: "Oswald", sans-serif;
- text-transform: uppercase;
- font-size: 25px;
- letter-spacing: 3px;
- text-align: center;
- color: #ebebeb;
- margin: 0px 0px 0px 0px;
- padding: 0px 0px 0px 0px;
- -webkit-animation-name: fadeInTop;
- animation-name: fadeInTop;
- -webkit-animation-duration: 1.5s;
- animation-duration: 1.5s;
- -webkit-animation-fill-mode: both;
- animation-fill-mode: both;
- }
- .quotestuff h3 {
- font-family: calibri;
- text-transform: uppercase;
- text-align: center;
- font-size: 7px;
- letter-spacing: 1.5px;
- font-weight: lighter;
- color: #ebebeb;
- margin: 0px 0px 0px 0px;
- padding: 0px 0px 0px 0px;
- }
- .rightimg {
- position: absolute;
- z-index: 1;
- }
- @keyframes fadeInDown {
- from {
- opacity: 0;
- transform: translate3d(0, -100%, 0);
- }
- to {
- opacity: 1;
- transform: none;
- }
- }
- .fadeInDown {
- animation-name: fadeInDown;
- }
- ::-webkit-scrollbar {
- width: 2px;
- height: 10px;
- padding-top: 40px;
- }
- ::-webkit-scrollbar-track {
- background-color: #141216;
- }
- ::-webkit-scrollbar-thumb {
- background-color: #2a7c77;
- height: 30px;
- width: 2px;
- }
- ::-webkit-scrollbar-track-piece {
- height: 30px;
- width: 30px;
- padding-left: 10px;
- }
- ::-moz-selection,
- ::selection {
- background-color: #2a7c77;
- color: #fff;
- }
- ::selection {
- background-color: #2a7c77;
- color: #fff;
- }
- b {
- font-family: "Oswald", sans-serif;
- font-size: 9px;
- text-transform: uppercase;
- font-weight: bold;
- color: #2a7c77;
- }
- i {
- font-family: georgia;
- font-size: 11px;
- color: #2a7c64;
- letter-spacing: -0.5px;
- text-transform: lowercase;
- }
- @-webkit-keyframes fadeInRight {
- 0% {
- opacity: 0;
- -webkit-transform: translate3d(100%, 0, 0);
- transform: translate3d(100%, 0, 0);
- }
- 100% {
- opacity: 1;
- -webkit-transform: none;
- transform: none;
- }
- }
- @-webkit-keyframes fadeInTop {
- 0% {
- -webkit-transform: translateY(-50px);
- transform: translateY(-50px);
- opacity: 0;
- }
- 100% {
- -webkit-transform: translateY(0);
- transform: translateY(0);
- opacity: 1;
- }
- }
- @keyframes fadeInTop {
- 0% {
- -webkit-transform: translateY(-50px);
- transform: translateY(-50px);
- opacity: 0;
- }
- 100% {
- -webkit-transform: translateY(0);
- transform: translateY(0);
- opacity: 1;
- }
- }
- </style>
- <style>figure{margin:0}.tmblr-*****{position:absolute}.tmblr-*****.hide{display:none}.tmblr-*****--amp-cta-button{visibility:hidden;position:fixed;bottom:10px;left:50%;transform:translateX(-50%);z-index:100}.tmblr-*****--amp-cta-button.tmblr-*****--loaded{visibility:visible;animation:*****-app-cta-transition .2s ease-out}</style><link href="https://fonts.googleapis.com/css?family=Oswald" rel="stylesheet">
- <div class="container">
- <div class="leftcont">
- <div class="nav">
- <center>
- <a href="/" data-tooltip="home">BACK</a>
- <a href="/" data-tooltip="msg">DMW</a>
- <a href="/" data-tooltip="cmt">CALL</a>
- </center>
- </div>
- <div class="heading">
- <h1>SHIKAMARU</h1>
- <h2>NARA</h2>
- </div>
- <div class="leftpara">
- <ul class="tabs">
- <li>
- <input type="radio" checked name="tabs" id="tab1">
- <label for="tab1">01</label>
- <div id="tab-content1" class="tab-content animated fadeInDown">
- <b>Shikamaru</b> can suck my balls, love <b>Ino</b>. You should probably put your basic info here.<br><br>
- </div>
- </li>
- <li>
- <input type="radio" name="tabs" id="tab2">
- <label for="tab2">02</label>
- <div id="tab-content2" class="tab-content animated fadeInDown">
- <b>Shikamaru</b> can suck my balls, love <b>Ino</b>. You should probably put your background story here.
- </div>
- </li>
- <li>
- <input type="radio" name="tabs" id="tab3">
- <label for="tab3">03</label>
- <div id="tab-content3" class="tab-content animated fadeInDown">
- <b>Shikamaru</b> can suck my balls, love <b>Ino</b>. You should probably put your rules and contant stuff here.
- </div>
- </li>
- </ul>
- </div>
- <div class="musicbox">
- <div class="player">
- <object type="application/x-shockwave-flash" data="https://flash-mp3-player.net/medias/player_mp3_mini.swf" width="200" height="20">
- <param name="movie" value="https://flash-mp3-player.net/medias/player_mp3_mini.swf" />
- <param name="bgcolor" value="#151515" />
- <param name="FlashVars" value="mp3=http://k003.kiwi6.com/hotlink/cl9vgcy155/soldier.mp3&bgcolor=151515&loadingcolor=2a7c77&buttoncolor=2a7c77&slidercolor=2a7c77" />
- </object></div>
- <div class="songtitle">
- <marquee behavior=scroll scrollamount="4" onmouseover="this.stop();" onmouseout="this.start();"> <b>SOLDIER BATTLE - η³ε δΈζ΄</b></marquee>
- </div>
- </div>
- </div>
- <div class="rightcont">
- <div class="quotestuff">
- <div style="width: 210px; border: solid 0.1px #ebebeb; padding: 20px; 0px 20px 0px;">
- <h1>that's what i'll be, & when i come home</h1>
- <h2>a <font color="#2a7c77">hero</font>, yeah</h2>
- <h3>they'll be damn proud of me</h3>
- </div>
- </div>
- <div class="rightimg">
- <img src="https://i.imgur.com/YUqmBBi.png">
- </div>
- </div>
- </div>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement