Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <!---------------
- THEME #8 - "AVENGER" by OLYMPIAN THEMES
- Rules and Regulations:
- #1: Please DO NOT commit thievery and steal this theme/page. I've worked hard on in so I'd appreciate if you didn't.
- #2: DO NOT redistribute this theme/page,
- #3: You can customize to your liking, just make sure that your theme/page is readable and credible for your viewers.
- ---------------->
- <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
- <title>{Title}</title>
- <meta charset="utf-8">
- <meta name="description" content="{MetaDescription}" />
- <link rel="shortcut icon" href="{Favicon}" />
- <link rel="alternate" type="application/rss+xml" href="{RSS}"/>
- <link href='http://fonts.googleapis.com/css?family=Roboto+Condensed' rel='stylesheet' type='text/css'>
- <link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,300italic,400italic' rel='stylesheet' type='text/css'>
- <link href='http://fonts.googleapis.com/css?family=Raleway:400,700,800,900,500' rel='stylesheet' type='text/css'>
- <link href='http://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
- {block:IfInfiniteScroll}<script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>{/block:IfInfiniteScroll}
- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
- <script>
- $(document).ready(function() {
- // Show or hide the sticky footer button
- $(window).scroll(function() {
- if ($(this).scrollTop() > 200) {
- $('.go-top').fadeIn(200);
- } else {
- $('.go-top').fadeOut(200);
- }
- });
- // Animate the scroll to top
- $('.go-top').click(function(event) {
- event.preventDefault();
- $('html, body').animate({scrollTop: 0}, 300);
- })
- });
- </script>
- <meta name="if:Infinite Scroll" content="">
- <meta name="text:Link 1" content="">
- <meta name="text:Link 1 URL" content="">
- <meta name="text:Link 2" content="">
- <meta name="text:Link 2 URL" content="">
- <meta name="text:Link 3" content="">
- <meta name="text:Link 3 URL" content="">
- <meta name="text:Link 4" content="">
- <meta name="text:Link 4 URL" content="">
- <meta name="color:Accent" content="#a9d6d6">
- <meta name="color:Post BG" content="#ffffff">
- <meta name="color:Borders" content="#ffffff">
- <meta name="color:Background" content="#202020">
- <meta name="color:Post Color" content="#EEEEEE">
- <meta name="color:Description BG" content="#FFFFFF">
- <meta name="color:Nav Link Text" content="#FFFFFF">
- <meta name="color:Body Text" content="#877b76">
- </head>
- <style type="text/css">
- body {
- margin: 0px;
- list-style: none;
- background-color: {color:Background};
- background-attachment: fixed;
- background-image:url('');
- font-family: 'Lora', sans-serif;
- font-size: 10px;
- color: {color:Body Text};
- }
- a {
- text-decoration: none;
- color: black;
- }
- b,i,strong,em {
- color: {color:Accent};
- }
- ::-webkit-scrollbar-thumb:vertical {
- background-color: {color:Accent};
- height: 10px;
- border-bottom: 2px solid #FFF;
- border-top: 2px solid #FFF;
- }
- ::-webkit-scrollbar-thumb:horizontal {
- background-color: {color:Accent};
- height: 7px!important;
- }
- ::-webkit-scrollbar {
- background-color: #FFF;
- height: 10px;
- width: 12px;
- }
- ::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment{
- display:block;
- height:15px;
- width: 12px;
- background-color: {color:Accent};
- }
- header {
- width: 100%;
- border-top: 5px solid {color:Borders};
- border-bottom: 5px solid {color:Borders};
- background-color: {color:Background};
- position: fixed;
- height: 48px;
- z-index: 1;
- }
- #icon img {
- position: fixed;
- border-left: 5px solid {color:Borders};
- border-right: 5px solid {color:Borders};
- background-color: #AAA;
- margin-left: 235px;
- width: 48px;
- height: 48px;
- float: left;
- }
- .title {
- background-color: {color:Borders};
- padding: 16px 20px 22px 20px;
- float: left;
- width: 550px;
- font-family: raleway;
- font-size: 12px;
- text-transform: uppercase;
- margin-left: 300px;
- text-align: center;
- color: {color:Accent};
- z-index: 3000;
- position: absolute;
- letter-spacing: 5px;
- }
- #desc {
- display: block;
- text-align: center;
- background-color: {color:Description BG};
- margin-bottom: 20px;
- padding: 10px;
- }
- #desc a {
- color: {color:Accent};
- }
- #posts {
- width: 540px;
- padding: 25px;
- background: {color:Post BG};
- display: inline-block;
- margin-left: 300px;
- height: 100%;
- margin-top: 80px;
- margin-bottom: 150px;
- }
- .go-top {
- position: fixed;
- bottom: 2em;
- right: 2em;
- text-decoration: none;
- color: #877b76;
- font-family: 'Raleway';
- font-weight: 700;
- font-size: 12px;
- padding: 1em;
- display: none;
- width: 80px;
- text-align: center;
- text-transform: uppercase;
- opacity: 0.5;
- -webkit-transition: all 0.2s ease-in-out;
- -moz-transition: all 0.2s ease-in-out;
- -o-transition: all 0.2s ease-in-out;
- -ms-transition: all 0.2s ease-in-out;
- transition: all 0.2s ease-in-out;
- }
- .go-top:hover {
- opacity: 1;
- }
- .go-top img {
- width: 80px;
- margin: auto;
- height: 80px;
- background-color: {color:Accent};
- border-radius: 5px;
- -webkit-transition: all 0.2s ease-in-out;
- -moz-transition: all 0.2s ease-in-out;
- -o-transition: all 0.2s ease-in-out;
- -ms-transition: all 0.2s ease-in-out;
- transition: all 0.2s ease-in-out;
- }
- #nav {
- display: inline-block;
- width: 200px;
- height: 300px;
- position: fixed;
- margin-left: 20px;
- margin-top: 80px;
- }
- #nav a {
- background-color: {color:Accent};
- color: {color:Nav Link Text};
- display: inline-block;
- padding: 3px 3px 4px 2px;
- width: 14px;
- font-family: calibri;
- text-align: center;
- border: 2px solid #FFF;
- text-transform: uppercase;
- margin-right: 4px;
- -webkit-transition: all 0.2s ease-in-out;
- -moz-transition: all 0.2s ease-in-out;
- -o-transition: all 0.2s ease-in-out;
- -ms-transition: all 0.2s ease-in-out;
- transition: all 0.2s ease-in-out;
- }
- #nav a:hover {
- background-color: {color:Nav Link Text};
- color: {color:Accent};
- border: 2px solid {color:Accent};
- }
- .section {
- display: inline-block;
- background-color: transparent;
- width: 200px;
- margin-top: 4px;
- font-family: raleway;
- text-transform: uppercase;
- padding-bottom: -2px;
- color: {color:Accent};
- -webkit-transition: all 0.2s ease-in-out;
- -moz-transition: all 0.2s ease-in-out;
- -o-transition: all 0.2s ease-in-out;
- -ms-transition: all 0.2s ease-in-out;
- transition: all 0.2s ease-in-out;
- }
- .section:hover {
- background-color: {color:Accent};
- color: {color:Nav Link Text};
- }
- #entries {
- background-color: {color:Post Color};
- width: 500px;
- height: 100%;
- padding: 20px;
- }
- blockquote {
- border-left: 2px solid {color:Accent};
- max-width: 450px;
- padding: 2px 7px;
- margin: auto;
- }
- blockquote img {
- max-width: 400px;
- }
- blockquote blockquote {
- max-width: 400px;
- }
- .ttitle {
- padding: 20px;
- font-family: Lato;
- font-size: 20px;
- text-transform: uppercase;
- font-weight: 600;
- color: #FFFFFF;
- width: 500px;
- background-color: {color:Accent};
- display: block;
- margin-top: -20px;
- margin-left: -20px;
- }
- #entries a {
- color: {color:Accent};
- -webkit-transition: all 0.2s ease-in-out;
- -moz-transition: all 0.2s ease-in-out;
- -o-transition: all 0.2s ease-in-out;
- -ms-transition: all 0.2s ease-in-out;
- transition: all 0.2s ease-in-out;
- }
- #entries a:hover {
- opacity: 0.6;
- }
- #player {
- display: block;
- width: 100%;
- height: auto;
- padding: 7px 0px;
- background-color: {color:Accent};
- z-index: 1;
- margin-top: 10px;
- }
- .album img {
- width: 60px;
- height: 60px;
- border: 5px solid #EEEEEE;
- position: absolute;
- z-index: 2;
- margin-top: -27px;
- float: left;
- margin-left: 30px;
- }
- #audio {
- margin-bottom: 00px;
- }
- .track {
- margin-left: 110px;
- font-family: Lato;
- font-weight: 600;
- text-transform: uppercase;
- letter-spacing: 2px;
- color: #FFFFFF;
- }
- .button {
- width: 25px;
- height: 28px;
- overflow: hidden;
- z-index: 1000;
- }
- .music {
- background-color: #FFF;
- position: absolute;
- padding: 12px 14px 10px 13px;
- z-index: 1000;
- margin: 5px 28px 0px 39px;
- margin-top: -17px;
- opacity: 0.3;
- webkit-transition: all 0.3s ease-in-out;
- -moz-transition: all 0.3s ease-in-out;
- -o-transition: all 0.3s ease-in-out;
- -ms-transition: all 0.3s ease-in-out;
- transition: all 0.3s ease-in-out;
- }
- .music:hover {
- opacity: 0.5;
- }
- .info {
- margin-left: 110px;
- margin-top: 3px;
- }
- .chat .convo li {
- list-style: none;
- text-align: justify;
- margin-top: 5px;
- }
- .chat h4 {
- font-family: 'Lato';
- font-size: 20px;
- text-align: center;
- display: block;
- color: #a9d6d6;
- text-transform: uppercase;
- }
- .line_odd .label {
- color: {color:Accent};
- text-transform: uppercase;
- border-bottom: 1px dotted #AAA;
- padding: 2px;
- }
- .line_even .label {
- color: #BBB;
- text-transform: uppercase;
- border-bottom: 1px dotted #AAA;
- padding: 2px;
- }
- .quo {
- padding: 20px;
- display: block;
- width: 500px;
- margin-left: -20px;
- margin-top: -20px;
- background-color: {color:Accent};
- color: #FFFFFF;
- font-family: 'Lato';
- font-size: 16px;
- font-style: italic;
- }
- .sou {
- text-align: center;
- display: block;
- margin-top: 10px;
- }
- .link a {
- display: block;
- background-color: #FFFFFF;
- padding: 20px;
- font-family: 'Raleway';
- font-size: 16px;
- text-align: center;
- text-transform: uppercase;
- font-weight: 700;
- color: #a9d6d6;
- }
- .question {
- display: block;
- padding: 10px;
- background-color: {color:Accent};
- color: {color:Body Text};
- text-align: center;
- }
- .question a {
- color: #FFFFFF;
- }
- .answer {
- display: block;
- }
- {block:IfNotInfiniteScroll}
- .previous a {
- font-family: Lato;
- font-size: 48px;
- color: #FFFFFF;
- font-weight: 600;
- float: left;
- margin-left: 190px;
- margin-top: -10px;
- }
- .next a {
- font-family: Lato;
- font-size: 48px;
- color: #FFFFFF;
- font-weight: 600;
- float: right;
- margin-right: 420px;
- margin-top: -10px;
- }
- {/block:IfNotInfiniteScroll}
- #stamp {
- display: block;
- width: 520px;
- margin-top: 10px;
- padding: 10px;
- text-align: center;
- font-style: italic;
- letter-spacing: 2px;
- }
- #stamp a {
- color: {color:Accent};
- webkit-transition: all 0.3s ease-in-out;
- -moz-transition: all 0.3s ease-in-out;
- -o-transition: all 0.3s ease-in-out;
- -ms-transition: all 0.3s ease-in-out;
- transition: all 0.3s ease-in-out;
- }
- #stamp a:hover {
- color: #FFFFFF;
- }
- #tags {
- display: block;
- margin-bottom: 20px;
- padding: 10px;
- width: 520px;
- color: #CCCCCC;
- text-align: center;
- }
- #tags a {
- color: {color:Accent};
- font-style: italic;
- letter-spacing: 1px;
- text-transform: lowercase;
- }
- </style>
- <body>
- <header>
- <div id="icon"><img src="{PortraitURL-48}" /></div>
- {block:IfNotInfiniteScroll}
- {block:Pagination}<div class="previous">{block:PreviousPage}<a href="{PreviousPage}">«</a>{/block:PreviousPage}</div>{/block:Pagination}
- {/block:IfNotInfiniteScroll}
- <a href="/"><div class="title">{Title}</div></a>
- {block:IfNotInfiniteScroll}
- {block:Pagination}<div class="next">{block:NextPage}<a href="{NextPage}">»</a>{/block:NextPage}</div>{/block:Pagination}
- {/block:IfNotInfiniteScroll}
- </header>
- <div id="posts">
- {block:Posts}
- <div id="stamp">
- Posted {block:Date}<a href="{Permalink}">{TimeAgo}</a>{/block:Date} {block:NoteCount}with <a href="{Permalink}">{NoteCountWithLabel}</a>{/block:NoteCount} {block:RebloggedFrom}from <a href="{ReblogParentURL}">{ReblogParentName}{/block:RebloggedFrom}
- </div>
- <div id="entries">
- {block:Text}
- {block:Title}<div class="ttitle">{Title}</div>{/block:Title}
- {Body}
- {/block:Text}
- {block:Photo}
- <center><img src="{PhotoURL-500}" /></center>
- {block:Caption}{Caption}{block:Caption}
- {/block:Photo}
- {block:Photoset}
- {Photoset-500}
- {block:Caption}{Caption}{block:Caption}
- {/block:Photoset}
- {block:Video}
- {Video-500}
- {block:Caption}{Caption}{block:Caption}
- {/block:Video}
- {block:Audio}
- <div id="audio">
- <div id="player">
- <div class="music"><div class="button">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div></div>
- <div class="album">{block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}</div>
- {block:TrackName}<div class="track">{TrackName}</div>{/block:TrackName}
- </div>
- <div class="info">{block:PlayCount}{PlayCount}{/block:PlayCount}{block:Artist} - {Artist}{/block:Artist}{block:Album} - {Album}{/block:Album}</div>
- </div>
- {/block:Audio}
- {block:Chat}
- <div class="chat">
- {block:Title}<h4>{Title}</h4>{/block:Title}
- <ul class="convo">
- {block:Lines}<li class="line_{Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label}
- {Line}</li>{/block:Lines}
- </ul>
- </div>
- {/block:Chat}
- {block:Quote}
- <div class="quo">{Quote}</div>
- <div class="sou">{Source}</div>
- {/block:Quote}
- {block:Link}
- <div class="link"><a href="{URL}">{Name}</a></div>
- {block:Description}{Description}{/block:Description}
- {/block:Link}
- {block:Answer}
- <div class="question">{Asker}: {Question}</div>
- <div class="answer">{Answer}</div>
- {/block:Answer}
- <!-- {block:ContentSource}
- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
- width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
- {/block:SourceLogo}
- {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}
- {/block:ContentSource} -->
- </div>
- {block:HasTags}
- <div id="tags">
- {block:Tags}
- #<a href="{TagURL}">{Tag}</a>
- {/block:Tags}
- </div>
- {/block:HasTags}
- {/block:Posts}
- {block:PostNotes}<div id="notes">{PostNotes}</div>{/block:PostNotes}
- </div>
- <div id="nav">
- <div id="desc">{Description}</div>
- <div class="section"><a href="/">I</a> Home</div>
- <div class="section"><a href="/ask">II</a> Message</div>
- <div class="section"><a href="{text:Link 1 URL}">III</a> {text:Link 1}</div>
- <div class="section"><a href="{text:Link 2 URL}">IV</a> {text:Link 2}</div>
- <div class="section"><a href="{text:Link 3 URL}">V</a> {text:Link 3}</div>
- <div class="section"><a href="{text:Link 4 URL}">VI</a> {text:Link 4}</div>
- <div class="section"><a href="http://olympianthemes.tumblr.com">VII</a> Theme</div>
- </div>
- </div>
- <a href="#" class="go-top"><img src="http://static.tumblr.com/kamm2qy/ppMmrcqdn/up_button.png" />Back to Top</a>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement