Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!---------------------------------------------------------------------
- Nᴀᴠɪɢᴀᴛɪᴏɴ Pᴀɢᴇ #1; ᴍᴀᴅᴇ ʙʏ Kʏᴜɴɢsᴀᴛɪᴏɴᴀʟ
- <ᴋʏᴜɴɢsᴀᴛɪᴏɴᴀʟ.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ>
- ᴘʟᴇᴀsᴇ ᴅᴏ ɴᴏᴛ ʀᴇᴍᴏᴠᴇ ᴄʀᴇᴅɪᴛ.
- ғᴇᴇʟ ғʀᴇᴇ ᴛᴏ ᴀsᴋ ɪғ ʏᴏᴜ ʜᴀᴠᴇ
- ᴀɴʏ ǫᴜᴇsᴛɪᴏɴs!
- ---------------------------------------------------------------------->
- <html>
- <head><title>{Title}</title><link rel="shortcut icon" href="{Favicon}" />
- {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
- <style type="text/css">
- @font-face{font-family:bebas;src:url(http://static.tumblr.com/nnubjjk/gBon7uhde/bebasneue.otf);}
- ::-webkit-scrollbar{
- width:4px;
- height:4px;
- background-color:#fff;
- }
- ::-webkit-scrollbar-thumb{background-color:#000;}
- ::selection {color: #bbb; background: #f5f5f5; }
- ::-moz-selection {color: #bbb; background: #f5f5f5; }
- ::-webkit-selection {color: #bbb; background: #f5f5f5; }
- body{
- margin:0px;
- padding:0px;
- font-family:calibri;
- font-size:9px;
- color:#808080;
- background-color:#fff;
- background-image:url('http://static.tumblr.com/d40eae727a79de74c5b3c4cb5c8e9fd5/kucevlg/wLin7ybei/tumblr_static_36ptwx9v1yqsgg84g48w0scc8.png');
- background-repeat:repeat;
- background-attachment:fixed;
- word-wrap:break-word;
- }
- a, a:link, a:visited, a:active{
- cursor: pointer;
- text-decoration:none;
- color:#808080;
- -webkit-transition: all 0.3s ease-in-out;
- -moz-transition: all 0.3s ease-in-out;
- transition: all 0.3s ease-in-out;
- }
- a:hover{
- cursor:pointer;
- color:#f7f7f7;
- -webkit-transition: all 0.3s ease-in-out;
- -moz-transition: all 0.3s ease-in-out;
- transition: all 0.3s ease-in-out;
- }
- #sidebarimg{
- z-index:999;
- position:fixed;
- left:0;
- top:0;
- height:100%;
- width:350px;
- background-color:#000;
- background-image:url('http://static.tumblr.com/2e0b7c89eea68bb6fc0c5e975157c4d2/kucevlg/ysjn7yc51/tumblr_static_623gpj711xk4kc0kswgo8g44o.png');
- background-position:center;
- background-size:cover;
- -webkit-transition: all 0.5s ease-in-out;
- -moz-transition: all 0.5s ease-in-out;
- -o-transition: all 0.5s ease-in-out;
- }
- #bar{
- position:fixed;
- top:0px;
- height:100%;
- left:350px;
- width:20px;
- padding:10px;
- background:#000;
- }
- #sidebar{
- z-index:9999;
- position:fixed;
- left:0;
- top:0;
- height:100%;
- width:350px;
- opacity:1;
- -webkit-transition: all 0.5s ease-in-out;
- -moz-transition: all 0.5s ease-in-out;
- -o-transition: all 0.5s ease-in-out;
- }
- #title{
- width:220px;
- letter-spacing:1px;
- font-size:58px;
- font-family:bebas;
- text-transform:uppercase;
- margin-left:auto;
- margin-right:auto;
- margin-top:150px;
- text-align:center;
- color:#fff;
- z-index:999;
- }
- #title a{color:#fff;}
- #description{
- text-align:justify;
- font-family:calibri;
- font-size:10px;
- color:#fff;
- margin-left:auto;
- margin-right:auto;
- width:200px;
- padding:10px;
- border-top:1px solid #fff;
- border-bottom:1px solid #fff;
- }
- #navigation {
- margin-left:-8px;
- margin-top:230px;
- margin-bottom:10px;
- width:20px;
- text-align:center;
- }
- #navigation a{
- display:inline-block;
- z-index:9999999;
- width:20px;
- text-transform:uppercase;
- font-family:calibri;
- padding:5px;
- margin-top:1px;
- margin-left:5px;
- height:10px;
- border-top:none;
- border-right:none;
- font-size:11px;
- text-align:left;
- }
- #navigation a img{
- background:transparent;
- width:10px;
- margin-top:3px;
- margin-right:5px;
- float:left;
- padding:5px;
- opacity:1;
- border-radius:5px;
- background:transparent;
- -webkit-filter:invert(100%);
- -moz-filter:invert(100%);
- -o-filter:invert(100%);
- -ms-filter:invert(100%);
- filter:invert(100%);
- -webkit-transition: all 0.5s ease-in-out;
- -moz-transition: all 0.5s ease-in-out;
- -o-transition: all 0.5s ease-in-out;
- }
- #navigation a:hover {
- background:transparent;
- -webkit-transition: all 0.7s ease-in-out;
- -moz-transition: all 0.7s ease-in-out;
- -o-transition: all 0.7s ease-in-out;
- -ms-transition: all 0.7s ease-in-out;
- transition: all 0.7s ease-in-out;
- }
- #navigation a:hover img{
- background:transparent;
- -webkit-filter:invert(0%);
- -moz-filter:invert(0%);
- -o-filter:invert(0%);
- -ms-filter:invert(0%);
- filter:invert(0%);
- -webkit-transition: all 0.5s ease-in-out;
- -moz-transition: all 0.5s ease-in-out;
- -o-transition: all 0.5s ease-in-out;
- }
- #container{
- margin-top:50px;
- margin-left:450px;
- width:800px;
- height:500px;
- background:#fff;
- padding:30px;
- border:1px solid #e6e6e6;
- overflow:auto;
- }
- h3{
- font-family:bebas;
- color:#fff;
- background:#000;
- padding:5px;
- font-size:25px;
- letter-spacing:3px;
- text-align:center;
- margin-top:-2px;
- }
- #linkbox {
- float:left;
- width:200px;
- background:#fff;
- margin-bottom:60px;
- margin-right:60px;
- border:1px solid #e6e6e6;
- }
- #linkbox ul {
- width:190px;
- padding:0px 5px 5px 5px;
- list-style: none;
- }
- #linkbox li a {
- display:block;
- text-transform: uppercase;
- padding:5px;
- margin-bottom:2px;
- color:#a3a0a0;
- text-align:center;
- -moz-transition: border-color .2s ease-in-out;
- -webkit-transition: border-color .2s ease-in-out;
- transition: border-color .2s ease-in-out;
- -webkit-transition: all 0.7s ease-in-out;
- -moz-transition: all 0.7s ease-in-out;
- -o-transition: all 0.7s ease-in-out;
- -ms-transition: all 0.7s ease-in-out;
- transition: all 0.7s ease-in-out;
- }
- #linkbox li a:hover {
- background: rgba(250, 250, 250, 0);
- color:#f7f7f7;
- -moz-transition: border-color .2s ease-in-out;
- -webkit-transition: border-color .2s ease-in-out;
- transition: border-color .2s ease-in-out;
- -webkit-transition: all 0.7s ease-in-out;
- -moz-transition: all 0.7s ease-in-out;
- -o-transition: all 0.7s ease-in-out;
- -ms-transition: all 0.7s ease-in-out;
- transition: all 0.7s ease-in-out;
- }
- #s-m-t-tooltip {
- display:block;
- background:#000;
- font-size:8px;
- font-family:calibri;
- letter-spacing: 1px;
- color:#fff;
- text-align:center;
- text-transform:uppercase;
- margin-left:20px;
- padding:5px;
- max-width:200px;
- z-index:9999;
- }
- </style>
- <script type="text/javascript"
- src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
- <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
- <script>
- (function($){
- $(document).ready(function(){
- $("[title]").style_my_tooltips();
- });
- })(jQuery);
- </script>
- </head>
- <body>
- <div id="sidebar">
- <div id="title">Navigation</div>
- <div id="description">
- <!----------------------- DESCRIPTION GOES HERE: ------------------------>
- Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.
- <p><i>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</i>
- <p><b>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</b>
- <!----------------------------------------------------------------------->
- </div>
- </div>
- <div id="sidebarimg"></div>
- <div id="sidebarimg" style="background-image: url('http://i.imgur.com/q0s2pQR.jpg'); background-size: cover; background-position: center;">
- <div id="bar">
- <div id="navigation">
- <a href="/" title="home"><img src="http://static.tumblr.com/kucevlg/JMMn7uc1l/16.png"></a>
- <a href="/ask" title="message"><img src="http://static.tumblr.com/kucevlg/ZnXn7uc42/36.png"></a>
- <a href="/archive" title="archive"><img src="http://static.tumblr.com/kucevlg/aj2n7uc9j/2.png"></a>
- <a href="/" title="Link 1"><img src="http://static.tumblr.com/kucevlg/1Aqn7y99a/dribbble.png"></a>
- <a href="/" title="Link 2"><img src="http://static.tumblr.com/kucevlg/qWYn7y94o/bug.png"></a>
- <a href="/" title="Link 3"><img src="http://static.tumblr.com/kucevlg/N2An7y964/crop_tool.png"></a>
- <a href="/" title="Link 4"><img src="http://static.tumblr.com/kucevlg/3XTn7y9a4/export_box.png"></a>
- <a href="http://kyungsational.tumblr.com/" title="page by kyungsational"><img src="http://static.tumblr.com/kucevlg/vC8n7ue75/buzz-star-icon.png"></a>
- </div>
- </div>
- <div id="container">
- <div id="linkbox"><h3>TITLE</h3><ul>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- </ul></div>
- <div id="linkbox"><h3>TITLE</h3><ul>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- </ul></div>
- <div id="linkbox"><h3>TITLE</h3><ul>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- </ul></div>
- <div id="linkbox"><h3>TITLE</h3><ul>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- </ul></div>
- <div id="linkbox"><h3>TITLE</h3><ul>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- </ul></div>
- <div id="linkbox"><h3>TITLE</h3><ul>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- <li><a href="/">LINK</a></li>
- </ul></div>
- </div>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement