Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <html>
- <!----
- © hunterthemes.tumblr.com | Page #2 - All in one #2, vol.3 (v.2)
- * Do not redistribute this page and claim it as your own.
- * Do not remove the credit or move it to another page.
- * Minor changes to this page are allowed.
- ---->
- <!-- GOOGLE FONTS -->
- <link href='http://fonts.googleapis.com/css?family=Poiret+One' rel='stylesheet' type='text/css'>
- <link href='http://fonts.googleapis.com/css?family=Nova+Slim' rel='stylesheet' type='text/css'>
- <link href="https://fonts.googleapis.com/css?family=Rozha+One" rel="stylesheet">
- <link href="https://fonts.googleapis.com/css?family=Almendra" rel="stylesheet">
- <link href='http://fonts.googleapis.com/css?family=Baumans' rel='stylesheet' type='text/css'>
- <style type="text/css">
- /* CSS */
- /*-- GENERAL --*/
- body {
- margin: 0;
- padding: 0;
- width: 100%;
- height: 100%;
- color: #333;
- font-family:Helvetica, Arial, sans-serif;
- font-size: 11px;
- line-height: 13px;
- /*-- CHANGE BACKGROUND COLOR OF MENU SECTION --*/
- background-color: #ffffff;
- /*-- YOU CAN UPLOAD BACKGROUND IMAGE --*/
- background-image:url();
- background-attachment: fixed;
- background-repeat: repeat;
- }
- h1{
- color: #E8BED9;
- font-family: Baumans;
- font-size: 20px;
- line-height: 30px;
- padding:5px 10px;
- }
- h2{
- font-family:Helvetica, Arial, sans-serif;
- font-size: 11px;
- line-height: 13px;
- }
- a {
- color: #333333;
- text-decoration: none;
- }
- a:hover {
- text-decoration: none;
- color: #bbb;
- }
- b, strong {color: #222;}
- i, em {color: #777;}
- /* Tumblr controls */
- iframe.tmblr-iframe {
- top:0px!important;
- right:40px!important;
- opacity:0.8;
- transform:scale(0.6);
- transform-origin:100% 0;
- -webkit-transform:scale(0.8);
- -webkit-transform-origin:100% 0;
- -o-transform:scale(0.8);
- -o-transform-origin:100% 0;
- -moz-transform:scale(0.8);
- -moz-transform-origin:100% 0;
- -ms-transform:scale(0.8);
- -ms-transform-origin:100% 0;
- z-index:100000!important;
- filter:invert(1);
- -webkit-filter:invert(1);
- -o-filter:invert(1);
- -moz-filter:invert(1);
- -ms-filter:invert(1);
- }
- iframe.tmblr-iframe:hover {
- opacity:1!important;}
- /*-- Webkit scrollbar --*/
- ::-webkit-scrollbar {
- width: 9px;
- height: 0px;
- }
- ::-webkit-scrollbar-button:start:decrement,
- ::-webkit-scrollbar-button:end:increment {
- height: 0px;
- display: block;
- background-color: #ddd;
- }
- ::-webkit-scrollbar-track-piece {
- background-color: #ddd;
- }
- ::-webkit-scrollbar-thumb:vertical {
- height: 0px;
- background-color: #52704c;
- border: 4px solid #ddd;
- }
- /*-- TOOLTIPS --*/
- #s-m-t-tooltip {
- margin:24px 14px 7px 12px;
- padding: 5px;
- max-width: 250px;
- color: #333;
- background: #fff;
- border: 1px solid #bbbeee;
- font-size: 12px;
- line-height: 15px;
- z-index: 100000;
- }
- /* Fix */
- iframe, img, embed, object, video {
- max-width: 100%;
- border: none;
- }
- input, textarea, select, a { outline: none; }
- /*------ CONTAINER -----*/
- #container{
- position:absolute;
- width:100%;
- height:100%;
- left:0;
- top:0;
- }
- /*-- Avatar --*/
- #avatar {
- position:absolute;
- left:20px;
- top:20px;
- width:70px;
- height:70px;
- border-radius:50px;
- border:5px solid #f5f5f5;
- z-index:10000;
- }
- #avatar img {
- width:100%;
- height:100%;
- border-radius:100px;
- }
- /* Blog title */
- #blogtitle{
- margin-left:120px;
- margin-top:10px;
- height:30px;
- padding:20px;
- font-family:Baumans;
- font-size:35px;
- line-height:35px;
- color:#52704c;
- letter-spacing:2px;
- }
- /* Main icons */
- #mainlinks{
- margin-top:0px;
- margin-bottom:35px;
- margin-left:130px;
- }
- #mainlinks a{
- color: #333;
- font-size:12px;
- }
- #mainlinks i{
- color: #333;
- font-size:15px;
- margin-left:5px;
- margin-right:5px;
- }
- #mainlinks a:hover, #mainlinks a:hover i{
- color:#52704c;
- -webkit-transition: all 0.5s ease-in-out;
- -moz-transition: all 0.6s ease-in-out;
- -o-transition: all 0.5s ease-in-out;
- transition: all 0.6s ease-in-out;
- }
- /*-- ABOUT --*/
- #about{
- width: -moz-calc(100% - 240px);
- width: -webkit-calc(100% - 240px);
- width: -o-calc(100% - 240px);
- width: calc(100% - 240px);
- padding: 70px 120px;
- height:auto;
- font-size:15px;
- line-height:25px;
- color:#333;
- border-top:1px solid #f5f5f5;
- /* background color of about section */
- background: #f5f5f5;
- }
- #about h1{
- margin:0px;
- margin-bottom:25px;
- font-size:30px;
- line-height:40px;
- color:#52704c;
- }
- /*-- F.A.Q. --*/
- #faq{
- width: -moz-calc(100% - 240px);
- width: -webkit-calc(100% - 240px);
- width: -o-calc(100% - 240px);
- width: calc(100% - 240px);
- padding: 70px 120px;
- height:auto;
- font-size:15px;
- line-height:25px;
- color: #333;
- border-top:1px solid #f5f5f5;
- /* background color of faq section */
- background:#fff;
- }
- #faq h1{
- margin:0px;
- margin-bottom:25px;
- font-size:30px;
- line-height:40px;
- color:#52704c;
- }
- #faq b{
- color:#52704c;
- background: #f5f5f5;
- padding:3px 6px;
- }
- .question{
- font-size:20px;
- line-height:30px;
- list-style:none;
- }
- .answer{
- margin-top:5px;
- font-size:15px;
- line-height:25px;
- list-style:none;
- border-bottom:1px solid #f5f5f5;
- }
- /*-- NAVIGATION --*/
- #navigation{
- width: -moz-calc(100% - 240px);
- width: -webkit-calc(100% - 240px);
- width: -o-calc(100% - 240px);
- width: calc(100% - 240px);
- padding: 70px 120px;
- height:auto;
- font-size:15px;
- line-height:25px;
- color:#bbb;
- border-top:1px solid #f5f5f5;
- /* background color of links section */
- background: #f5f5f5;
- }
- #navigation h1{
- margin:0px;
- margin-bottom:25px;
- font-size:30px;
- line-height:40px;
- color:#52704c;
- }
- #links{
- width:450px;
- float:left;
- }
- #tags{
- margin-left:450px;
- width:450px;
- }
- /* Style of the links and tags */
- #navigation a{
- display:inline-block;
- margin-left:20px;
- margin-top:5px;
- margin-bottom:5px;
- width:100px;
- padding:5px 8px;
- font-size:15px;
- overflow:hidden;
- color:#333;
- border-bottom:1px solid #f5f5f5;
- }
- #links a:hover{
- border-bottom:1px solid #333;
- color: #52704c;
- -webkit-transition: all 0.5s ease-in-out;
- -moz-transition: all 0.6s ease-in-out;
- -o-transition: all 0.5s ease-in-out;
- transition: all 0.6s ease-in-out;
- }
- #tags a:hover{
- box-shadow: inset 200px 0 0 0 #fff;
- color: #52704c;
- -webkit-transition: all 0.5s ease-in-out;
- -moz-transition: all 0.6s ease-in-out;
- -o-transition: all 0.5s ease-in-out;
- transition: all 0.6s ease-in-out;
- }
- /*-- BLOGROLL --*/
- #blogroll{
- width: -moz-calc(100% - 240px);
- width: -webkit-calc(100% - 240px);
- width: -o-calc(100% - 240px);
- width: calc(100% - 240px);
- padding: 70px 120px;
- height:auto;
- font-size:15px;
- line-height:25px;
- color: #f5f5f5;
- border-top:1px solid #f5f5f5;
- /* background color of faq section */
- background:#fff;
- }
- #blogrollin{
- max-height:280px;
- overflow-y:auto;
- }
- #blogroll h1{
- margin:0px;
- margin-bottom:25px;
- font-size:30px;
- line-height:40px;
- color: #52704c;
- }
- #blogroll img {
- margin:5px;
- max-width: 38px;
- max-height: 38px;
- border:2px solid #f5f5f5;
- opacity:0.8;
- }
- #blogroll img:hover {
- border:2px solid #52704c;
- opacity:1;
- }
- /*-- CREDIT --*/
- #credit {
- position:fixed;
- right: 10px;
- top: 5px;
- width: 30px;
- z-index: 10000;
- }
- /* END CSS */
- {CustomCSS}
- </style>
- <script type="text/javascript"
- src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
- <!-- Font awesome script -->
- <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
- <!-- Style my tooltips script -->
- <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
- <script src="jquery.style-my-tooltips.js"></script>
- <script type="text/javascript" src="http://static.tumblr.com/imovwvl/dJWl20ley/jqueryformasonry.js"></script>
- <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
- <script>
- (function($){
- $(document).ready(function(){
- $("[title]").style_my_tooltips({
- tip_follows_cursor:true,
- tip_delay_time:200,
- tip_fade_speed: 300
- }
- );
- });
- })(jQuery);
- </script>
- </head>
- <meta charset="utf-8">
- <title>{Title}</title>
- <link rel="shortcut icon" href="{Favicon}">
- <link rel="alternate" type="application/rss+xml" href="{RSS}">
- <meta name="viewport" content="width=device-width, initial-scale=1">
- <!-- HTML -->
- <body>
- <!-- MAIN CONTAINER -->
- <div id="container">
- <!-- AVATAR -->
- <div id="avatar"><img src="http://static.tumblr.com/a134320be8c640fa109d305c337700f6/6dvmes1/X08o724zv/tumblr_static_2of6vh1m282scoos4wcg8ws80.jpg"></div>
- <!-- BLOG TITLE -->
- <div id="blogtitle">All in one page #2</div>
- <!-- MAIN ICONS -->
- <div id="mainlinks">
- <a href="/"><i class="fa fa-home"></i> INDEX /</a>
- <a href="/ask"><i class="fa fa-envelope"></i> ASK /</a>
- <a href="/submit"><i class="fa fa-pencil"></i> SUBMIT /</a>
- <a href="/archive"><i class="fa fa-clock-o"></i> ARCHIVE </a>
- </div>
- <div id="about">
- <h1>- About </h1>
- Lorem ipsum dolor sit <b>amet</b>, consectetuer adipiscing elit. Aliquam nisi lorem, pulvinar id, commodo feugiat, vehicula et, <i>mauris</i>. Aliquam mattis porta urna. Maecenas dui neque, rhoncus sed, vehicula vitae, auctor at, nisi. Aenean id massa ut lacus molestie porta. Curabitur sit amet quam id libero suscipit venenatis.
- <p>Donec placerat mauris commodo dolor. Nulla tincidunt. Nulla vitae augue.
- Suspendisse ac pede. Cras <u>tincidunt</u> pretium felis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Pellentesque porttitor mi id felis. Maecenas nec augue. Praesent a quam pretium leo congue accumsan.
- </div>
- <!--End about-->
- <!-- F.A.Q. -->
- <div id="faq">
- <h1>- Frequenly asked questions </h1>
- <li class="question"> <b>1.</b> Lorem ipsum dolor sit amet? </li>
- <li class="answer"> Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </li><br>
- <li class="question"> <b>2.</b> Lorem ipsum dolor sit amet? </li>
- <li class="answer"> Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </li><br>
- <li class="question"> <b>3.</b> Lorem ipsum dolor sit amet? </li>
- <li class="answer"> Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </li><br>
- <li class="question"> <b>4.</b> Lorem ipsum dolor sit amet? </li>
- <li class="answer"> Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </li><br>
- <li class="question"> <b>5.</b> Lorem ipsum dolor sit amet? </li>
- <li class="answer"> Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </li><br>
- </div>
- <!--End faq-->
- <div id="navigation">
- <!-- LINKS -->
- <h1>- Navigation</h1>
- <div id="links">
- <a href="http://">- Link 01 </a>
- <a href="http://">- Link 02 </a>
- <a href="http://">- Link 03 </a>
- <a href="http://">- Link 04 </a>
- <a href="http://">- Link 05 </a>
- <a href="http://">- Link 06 </a>
- <a href="http://">- Link 07 </a>
- <a href="http://">- Link 08 </a>
- <a href="http://">- Link 09 </a>
- </div>
- <!--End links-->
- <div id="tags">
- <a href="http://">#tag01 </a>
- <a href="http://">#tag02 </a>
- <a href="http://">#tag03 </a>
- <a href="http://">#tag04 </a>
- <a href="http://">#tag05 </a>
- <a href="http://">#tag06 </a>
- <a href="http://">#tag07 </a>
- <a href="http://">#tag08 </a>
- <a href="http://">#tag09 </a>
- </div>
- <!--End tags-->
- </div>
- <!--End navigation-->
- <!-- BLOGROLL-->
- <div id="blogroll">
- <h1>- Following </h1>
- <div id="blogrollin">
- <center>
- {block:Following}
- {block:Followed}
- <a title="{FollowedName}" href="{FollowedURL}">
- <img src="{FollowedPortraitURL-128}" /></a>
- {/block:Followed}
- {/block:Following}
- </center>
- </div>
- <!--End blogrollin-->
- </div>
- <!--End blogroll-->
- </div>
- <!--End container-->
- <!-- CREDIT (DO NOT REMOVE) -->
- <div id="credit"><a href="https://www.hunterthemes.tumblr.com">
- <img src="https://66.media.tumblr.com/b29d8873c09628252057b9408a7c4a88/tumblr_plbuq65td51uo5urho1_100.png" title="theme by hunter themes"></a></div>
- </body>
- </html>
- <!-- END HTML -->
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement