Notes
Notes - notes.io |
<head>
<!-- network page 01
themes by ro (the49thname) / the49ththeme.tumblr.com
don't remove the credit, use as a base code, or claim as your own work.
edit as much as you want, and feel free to send me any queries/problems.
-->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<title>Network 01</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
<meta name="description" content="{MetaDescription}" />
<!-- fonts -->
<link href="https://fonts.googleapis.com/css?family=Roboto|Roboto+Condensed" rel="stylesheet">
<!-- jquery scripts -->
<script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<!-- font awesome script -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<!-- tooltip scripts -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/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:90,
tip_fade_speed:600,
attribute:"title"
});
});
})(jQuery);
</script>
<style type="text/css">
#tumblr_controls, .tmblr-iframe {display:none;!important;}
::-webkit-scrollbar-thumb {
z-index:9999999;
position:relative;
height:auto;
background-color:#7b0000; /* change scrollbar thumb colour */
}
::-webkit-scrollbar {
height:5px;
width:5px;
background-color:#7b0000; /* change scrollbar background colour */
}
/* basics */
body {
color:#7b0000; /* change text colour */
background-color:#7b0000; /* change background colour */
font-family:'Roboto', sans-serif;
font-size:10px; /* change font size */
margin:0;
line-height:14px;
letter-spacing:1px;
text-align:justify;
word-wrap:break-word;
background-image:url(''); /* add background image */
background-position:left top;
background-attachment:fixed;
background-repeat:repeat;
}
b, strong {color:#000;} /* change bold text colour */
i, em {color:#ccc;} /* change italic text colour */
u {color:#7b0000;text-transform:none;} /* change underline text colour */
a {
color:#ffb3b3; /* change link colour */
text-transform:uppercase;
text-decoration:none;
-moz-transition-duration:1s;
-webkit-transition-duration:1s;
-o-transition-duration:1s;
}
a:hover {
color:#000000; /* change link hover colour */
-moz-transition-duration:1s;
-webkit-transition-duration:1s;
-o-transition-duration:1s;
}
p {margin:10px;}
/* header */
#themecontainer {
top:0;
width:900px;
height:100%;
margin-left:auto;
margin-right:auto;
}
#hdr {
width:900px;
height:200px;
position:absolute;
top:0;
background:url('https://i.imgur.com/AbitMh2.png') top center; /* add/change header image */
-webkit-background-size:cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size:cover;
}
.nav {
position:absolute;
top:200px;
width:900px;
height:35px;
background-color:#000000; /* change navigation background colour */
text-align:center;
z-index:9999;
}
.nav-fixed {position:fixed;top:0;}
.nav a {
font-family:'Roboto Condensed', sans-serif;
font-size:14px;
text-transform:uppercase;
color:#fff; /* change navigation link colour */
display:inline-block;
padding:12px 8px;
-moz-transition-duration:1s;
-webkit-transition-duration:1s;
-o-transition-duration:1s;
}
.nav a:hover {
color:#fff; /* change navigation link hover colour */
-moz-transition-duration:1s;
-webkit-transition-duration:1s;
-o-transition-duration:1s;
}
/* posts */
#postcontainer {
position:relative;
top:235px;
width:100%;
overflow:hidden;
text-align:justify;
background-color:#ffffff; /* change container background colour */
}
#container {
width:750px;
height:100%;
margin:50px auto;
text-align:center;
}
.membercont {
width:150px;
margin:20px 15px;
display:inline-block;
}
.membericon {
width:150px;
height:150px;
opacity:1;
transition:all 0.5s ease-in-out;
-moz-transition:all 0.5s ease-in-out;
-webkit-transition:all 0.5s ease-in-out;
-o-transition:all 0.5s ease-in-out;
}
.membericon img {width:150px;height:150px;}
.memberdesc {
position:absolute;
width:150px;
height:150px;
overflow:auto;
padding:10px;
box-sizing:border-box;
color:#7b0000; /* change member description text colour */
text-align:center;
text-transform:uppercase;
z-index:9;
opacity:0;
transition-duration:0.5s;
-moz-transition-duration:0.5s;
-webkit-transition-duration:0.5s;
-o-transition-duration:0.5s;
}
.membercont:hover .memberdesc {
opacity:1;
transition:all 0.5s ease-in-out;
-moz-transition:all 0.5s ease-in-out;
-webkit-transition:all 0.5s ease-in-out;
-o-transition:all 0.5s ease-in-out;
}
.membercont:hover .membericon {
opacity:0.2;
transition:all 0.5s ease-in-out;
-moz-transition:all 0.5s ease-in-out;
-webkit-transition:all 0.5s ease-in-out;
-o-transition:all 0.5s ease-in-out;
}
.membertitle {
width:150px;
background-color:#7b0000; /* change member title background colour */
text-transform:uppercase;
padding:10px;
text-align:center;
box-sizing:border-box;
}
.membertitle a {
color:#fff; /* change member title link colour */
-moz-transition-duration:1s;
-webkit-transition-duration:1s;
-o-transition-duration:1s;
}
.membertitle a:hover {
color:#7b0000; /* change member title link hover colour */
-moz-transition-duration:1s;
-webkit-transition-duration:1s;
-o-transition-duration:1s;
}
/* extras */
#s-m-t-tooltip {
z-index:9999999999;
color:#fff; /* change tooltip text colour */
background:#7b0000; /* change tooltip background colour */
font-size:9px;
line-height:11px;
font-family:'Roboto Condensed', sans-serif;
text-align:left;
text-transform:uppercase;
max-width:150px;
word-wrap:break-word;
padding:2px 5px 2px 5px;
display:block;
margin:24px 14px 7px 12px;
}
::selection {
color:#fff; /* change selection text colour */
background:#7b0000; /* change selection background colour */
}
/* credit - do not remove, alter, or move to another page */
#credit {
position:fixed;
bottom:14px;
right:10px;
text-align:center;
z-index:9999999;
}
#credit a {
font-size:10px;
color:#f6f6f6;
background-color:#ccc;
padding:4px;
-moz-transition-duration:1s;
-webkit-transition-duration:1s;
-o-transition-duration:1s;
}
#credit a:hover {
color:#ccc;
background-color:#7b0000;
-moz-transition-duration:1s;
-webkit-transition-duration:1s;
-o-transition-duration:1s;
}
</style>
</head>
<body>
<div id="themecontainer">
<div id="hdr"></div>
<div class="nav">
<a href="/">Home</a>
<a href="/ask">Ask</a>
<a href="/archive">Archive</a>
<!-- you can edit your custom links here. just change LINK NO. URL to whatever your link url is, and change Link no. to whatever you want your link to be called. -->
<a href="/LINK 1 URL">Link 1</a>
<a href="/LINK 2 URL">Link 2</a>
<a href="/LINK 3 URL">Link 3</a>
</div>
<div id="postcontainer">
<div id="container">
<!-- here is where you can edit your member images, descriptions, and links. member icons need to be 150x150px in size. -->
<div class="membercont">
<div class="memberdesc">
</div>
<div class="membericon"><img src="https://i.imgur.com/m0J4uqd.png"></div>
<div class="MARGOTRPH"><a href="margotofrph.tumblr.com">Margotrph</a></div>
</div>
<div class="membercont">
<div class="memberdesc">
</div>
<div class="membericon"><img src="https://i.imgur.com/eG6UuIh.png"></div>
<div class="Vinyl Boulevard"><a href="vinilboulevard.tumblr.com">Vinyl Boulevard</a></div>
</div>
<div class="membercont">
<div class="memberdesc">
</div>
<div class="membericon"><img src="https://i.imgur.com/ei6SIrE.png"></div>
<div class="Roleanding"><a href="roleanding.tumblr.com">Roleanding</a></div>
</div>
<div class="membercont">
<div class="memberdesc">
</div>
<div class="membericon"><img src="https://i.imgur.com/IV8Q3co.png"></div>
<div class="Paola Designs"><a href="paola-designs.tumblr.com">Paola Designs</a></div>
</div>
<div class="membercont">
<div class="memberdesc">
</div>
<div class="membericon"><img src="https://i.imgur.com/XpEJrkv.png"></div>
<div class="membertitle"><a href="http://gallifreyps.tumblr.com/">Galli frey PS</a></div>
</div>
<div class="membercont">
<div class="memberdesc">
</div>
<div class="membericon"><img src="https://i.imgur.com/z7TwZCi.png"></div>
<div class="membertitle"><a href="MEMBER LINK GOES HERE">Member 6</a></div>
</div>
<div class="membercont">
<div class="memberdesc">
</div>
<div class="membericon"><img src="https://i.imgur.com/z7TwZCi.png"></div>
<div class="membertitle"><a href="MEMBER LINK GOES HERE">Member 7</a></div>
</div>
<div class="membercont">
<div class="memberdesc">
</div>
<div class="membericon"><img src="https://i.imgur.com/z7TwZCi.png"></div>
<div class="membertitle"><a href="MEMBER LINK GOES HERE">Member 8</a></div>
</div>
<!-- to add more members simply copy and paste the following section of code:
<div class="membercont">
<div class="memberdesc">
Member description.
</div>
<div class="membericon"><img src="IMG URL GOES HERE"></div>
<div class="membertitle"><a href="MEMBER LINK GOES HERE">Member</a></div>
</div>
and paste it just before the </div></div> just after these instructions -->
</div>
</div>
</div>
<!-- sticky navbar jquery -->
<script>
$(document).ready(function(){
$(window).bind('scroll', function(){
if($(window).scrollTop() > 200){
$('.nav').addClass('nav-fixed');
}
else{
$('.nav').removeClass('nav-fixed');
}
});
});
</script>
<div id="credit"><a href="http://the49thname.tumblr.com/" title="made by the49thname">49</a>
</div>
</body>
</html>
|
|
Notes.io is a web-based application for taking notes. You can take your notes and share with others people. If you like taking long notes, notes.io is designed for you. To date, over 8,000,000,000 notes created and continuing...
With notes.io;
- * You can take a note from anywhere and any device with internet connection.
- * You can share the notes in social platforms (YouTube, Facebook, Twitter, instagram etc.).
- * You can quickly share your contents without website, blog and e-mail.
- * You don't need to create any Account to share a note. As you wish you can use quick, easy and best shortened notes with sms, websites, e-mail, or messaging services (WhatsApp, iMessage, Telegram, Signal).
- * Notes.io has fabulous infrastructure design for a short link and allows you to share the note as an easy and understandable link.
Fast: Notes.io is built for speed and performance. You can take a notes quickly and browse your archive.
Easy: Notes.io doesn’t require installation. Just write and share note!
Short: Notes.io’s url just 8 character. You’ll get shorten link of your note when you want to share. (Ex: notes.io/q )
Free: Notes.io works for 12 years and has been free since the day it was started.
You immediately create your first note and start sharing with the ones you wish. If you want to contact us, you can use the following communication channels;
Email: [email protected]
Twitter: http://twitter.com/notesio
Instagram: http://instagram.com/notes.io
Facebook: http://facebook.com/notesio
Regards;
Notes.io Team
