Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!--
- ABOUT #1: STEP - BY SUR SOUTHCODES.TUMBLR.COM
- - modify as you like but please keep the credit intact <3
- - 90% of the credit actually goes to jae simplethemes.tumblr.com
- -->
- <!DOCTYPE html>
- <head>
- <title>{Title}</title>
- <link rel="shortcut icon" href="{favicon}">
- <link rel="alternate" type="application/rss+xml" href="{RSS}">
- <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
- <style type="text/css">
- ::-webkit-scrollbar{
- height:2px;
- width:4px;
- background:inherit;
- }
- ::-webkit-scrollbar-thumb{
- background:#ddd;
- border-radius:2px;
- -webkit-border-radius:2px;
- }
- #s-m-t-tooltip{
- max-width:300px;
- margin-top:25px;
- margin-left:15px;
- z-index:999999;
- letter-spacing:1px;
- text-transform:uppercase;
- font-size:8px;
- border: solid 1px #dcdee2;
- background-color:#fcfcfc;
- color:#818284;
- padding:1px 3px 1px 3px;
- }
- body {
- color:#000;
- font-size:12px;
- font-family: 'Lato', sans-serif;
- margin:0;
- padding:0;
- height:100%;
- width:100%;
- background-color:#fefefe;
- /* DELETE THIS LINE IF YOU WANT A BACKGROUND IMAGE
- background: url('BACKGROUND IMAGE URL');
- background-attachment: fixed;
- background-size: cover; /*DELETE THIS LINE IF YOU WANT A REPEATED IMAGE*/
- /* DELETE THIS LINE IF YOU WANT A BACKGROUND IMAGE */
- }
- a{
- color:#8c8c8c;
- text-decoration:none;
- -moz-transition-duration: 0.6s;
- -o-transition-duration: 0.6s;
- -webkit-transition-duration: 0.6s;
- transition-duration: 0.6s;
- }
- a:hover{
- color:#000;
- letter-spacing:1px;
- -moz-transition-duration: 0.6s;
- -o-transition-duration: 0.6s;
- -webkit-transition-duration: 0.6s;
- transition-duration: 0.6s;
- }
- #smaller-border {
- height: 1px;
- width: 100px;
- background-color: #ccc;
- margin:auto;
- }
- span.boxtitle {
- font-weight:bold;
- text-transform:uppercase;
- }
- .container {
- opacity:.97;
- border-radius:8px;
- background:#fff;
- width:655px;
- border: solid 1px #e9e9e9;
- position:absolute;
- left:50%;
- top:50%;
- -webkit-transform: translateX(-50%) translateY(-50%);
- -moz-transform: translateX(-50%) translateY(-50%);
- -ms-transform: translateX(-50%) translateY(-50%);
- transform: translateX(-50%) translateY(-50%);
- }
- .image img{
- width:150px;
- height:150px;
- margin-top:-100px;
- margin-left:10px;
- border-radius:100px;
- padding:16px;
- }
- .title {
- float:right;
- font-size:30px;
- font-weight:bold;
- letter-spacing:1.5px;
- margin:-35px 10px;
- }
- .sidebar {
- display:inline-block;
- margin:0 0 15px 20px;
- width:225px;
- }
- .about {
- text-align:center;
- line-height:33px;
- letter-spacing:.5px;
- font-size:13px;
- margin-bottom:10px;
- }
- .links {
- margin-top:20px;
- text-align:center;
- line-height:23px;
- }
- .box1 {
- width:60px;
- margin-right:20px;
- vertical-align:top;
- display:inline-block;
- }
- .box2 {
- width:60px;
- margin-right:20px;
- vertical-align:top;
- display:inline-block;
- }
- .box3 {
- width:60px;
- vertical-align:top;
- display:inline-block;
- }
- .quotes {
- width:347px;
- vertical-align:top;
- margin: -60px 30px 5px 30px;
- display:inline-block;
- letter-spacing:.5px;
- text-align:center;
- line-height:22px;
- }
- .extras {
- padding:7px;
- border-top: solid 1px #e9e9e9;
- background:#fbfbfb;
- border-radius:8px;
- }
- .extraslink {
- font-size:12px;
- letter-spacing:.5px;
- text-align:center;
- line-height:18px;
- width:615px;
- margin:auto;
- }
- .extraslink a{
- padding-right:15px;
- padding-left:15px;
- }
- .extraslink a:first-child{
- padding-left:0px;
- }
- .extraslink a:last-child{
- padding-right:0px;
- }
- .credit {
- position:fixed;
- padding:5px;
- bottom:0;
- right:0;
- font-size:10px;
- }
- </style>
- </head>
- <!-- tooltips -->
- <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
- <script src="http://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:30,
- tip_fade_speed:300,
- attribute:"title"
- });
- });
- })(jQuery);
- </script>
- <!-- tooltips -->
- <body>
- <div class="container">
- <div class="title">Title;</div>
- <div class="image"><a href="/"><img src="SIDEBAR IMAGE URL"/></a></div>
- <div class="sidebar">
- <div class="about">
- <span class="boxtitle">titled</span>: info<br>
- <span class="boxtitle">title</span>: info<br>
- <span class="boxtitle">title</span>: info<br>
- <span class="boxtitle">title</span>: info
- </div>
- <div id="smaller-border"></div>
- <div class="links">
- <div class="box1">
- <span class="boxtitle">box 1</span><br>
- <a href="LINK">link 1</a><br>
- <a href="LINK">link 2</a>
- </div>
- <div class="box2">
- <span class="boxtitle">box 2</span><br>
- <a href="LINK">link 1</a><br>
- <a href="LINK">link 2</a>
- </div>
- <div class="box3">
- <span class="boxtitle">box 3</span><br>
- <a href="LINK">link 1</a><br>
- <a href="LINK">link 2</a>
- </div>
- </div>
- </div>
- <div class="quotes">
- <p><i>« quote »</i><br>— <a href="LINK" title="hello">Ipse dixit</a></p>
- <p><i>« quote »</i><br>— <a href="LINK">Ipse dixit</a></p>
- <p><i>« quote »</i><br>— <a href="LINK">Ipse dixit</a></p>
- </div>
- <div class="extras">
- <div class="extraslink">
- <a href="LINK">link 1</a>
- <a href="LINK">link 2</a>
- <a href="LINK">link 3</a>
- <a href="LINK">link 4</a>
- <a href="LINK">link 5</a>
- </div>
- </div>
- </div>
- <!-- keep intact <3 -->
- <div class="credit"><a href="http://southcodes.tumblr.com" title="southcodes">×</a></div>
- </body>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement