Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <!-- octomoosey @ tumblr -->
- <html xmlns="https://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
- <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=Oswald' rel='stylesheet' type='text/css'>
- <link href='https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz' rel='stylesheet' type='text/css'>
- <style type="text/css">
- ::-webkit-scrollbar{
- height:3px;
- width:3px;
- background:inherit;}
- ::-webkit-scrollbar-thumb {
- background:#EDA600;} /*change the color of the scrollbar */
- ::-webkit-scrollbar-track {
- background:transparent;}
- body {
- background:#000; /*change the color of the main background */
- margin:0px;
- font-family: 'Oswald', sans-serif; /*change the custom font */
- font-size:10px;
- line-height:150%;}
- a {
- text-decoration: none;
- color: #EDA600; /*change the color of the general links */
- -webkit-transition: all 0.7s ease;
- transition: all 0.7s ease;
- -moz-transition: all 0.7s ease;
- -o-transition: all 0.7s ease;}
- a:hover {
- color: #fff;} /*change the color of the general links hover */
- #header {
- position:absolute;
- top:0px;
- left: 50%;
- margin-left: -250px;
- margin-bottom:50px;
- width:500px;}
- #header img {
- max-width:500px;}
- #container {
- position:absolute;
- background-color:#fff; /*change the background color of the textblock */
- color:#000; /*change the text color */
- top:150px;
- left: 50%;
- margin-left: -250px;
- margin-bottom:50px;
- letter-spacing:1px;
- width:500px;
- padding:0px;}
- #maintitle {
- color:#000; /*change the color of the main title text */
- padding:8px;
- text-align:left;
- letter-spacing:3px;
- font-size:30px;
- line-height:30px;
- text-transform:uppercase;
- font-family: 'Yanone Kaffeesatz', sans-serif;}
- #nav {
- float:right;
- font-size:10px;
- margin-top:10px;}
- #nav a {
- color:#EDA600; /*change the color of navigation at the top of the page */
- -webkit-transition: all 0.7s ease;
- transition: all 0.7s ease;
- -moz-transition: all 0.7s ease;
- -o-transition: all 0.7s ease;}
- #nav a:hover{
- color: #fff;} /*change the color of the navigation hover */
- #title {
- background-color:#000; /*change the color of section title background */
- color:#fff; /*change the color of the section title text */
- padding:8px;
- text-align:right;
- font-size:20px;
- font-family: 'Yanone Kaffeesatz', sans-serif;}
- #box1 {
- padding:10px;}
- #box1 span {
- float:right;}
- #box1 img {
- float:left;
- max-height:80px;
- max-width:80px;
- margin-right:0px;
- margin-bottom:10px;}
- #dhtmltooltip{
- text-align:center;
- position: absolute;
- width: 100px;
- color:#333; /*change the color of the hover info text */
- border: 1px solid #333; /*change the color of the hover info border */
- padding: 2px;
- background-color: #fff; /*change the color of the hover info background */
- visibility: hidden;
- z-index: 100;
- -webkit-border-radius: 5px;
- -moz-border-radius: 5px;
- border-radius: 5px;}
- /*do not delete credit section */
- #credit {
- bottom:5px;
- right:0px;
- opacity:1;
- position:fixed;
- padding:1px;}
- {CustomCSS}</style></head><body>
- <div id="header">
- <!-- add the url of your header image here -->
- <img src="https://36.media.tumblr.com/f40373b422cc92fd5e8f841b5cacd03a/tumblr_inline_nvjqmw1goZ1ro20i7_540.png"></div>
- <div id="container">
- <!-- change the main title here here -->
- <div id="maintitle">don't call me sammy
- <!-- add more links here to the top section if needed -->
- <div id="nav">
- <a href="/">home</a>
- <a href="/ask">ask</a>
- <a href="/submit">submit</a>
- <a href="https://www.tumblr.com/dashboard">dash</a>
- </div>
- </div>
- <!-- to add more boxes for content copy everything from here to the start of the next section title-->
- <!-- change the section title here -->
- <div id="title">basic statistics</div>
- <!-- add your content within the 'box1' div. if you want to get the 'split' effect with text on the left and the right of the box - put any right hand text inside 'span' tags as shown below -->
- <div id="box1">
- name <span>samuel dean winchester</span> <br>
- height <span>6.4"</span> <br>
- build <span>muscular - toned</span> <br>
- age <span>31</span> <br>
- species <span>human</span> <br>
- job/role <span>hunter/vessel</span> <br>
- </div>
- <!-- change the section title here -->
- <div id="title">philosophy</div>
- <div id="box1">
- <i>Your bones don't break, mine do. That's clear. Your cells react to bacteria and viruses differently than mine. You don't get sick, I do. That's also clear. But for some reason, you and I react the exact same way to water. We swallow it too fast, we choke. We get some in our lungs, we drown. However unreal it may seem, we are connected, you and I. We're on the same curve, just on opposite ends.</i>
- </div>
- <!-- change the section title here -->
- <div id="title">biography</div>
- <div id="box1">
- Your bones don't break, mine do. That's clear. Your cells react to bacteria and viruses differently than mine. You don't get sick, I do. That's also clear. But for some reason, you and I react the exact same way to water. We swallow it too fast, we choke. We get some in our lungs, we drown. <p>However unreal it may seem, we are connected, you and I. We're on the same curve, just on opposite ends.
- Your bones don't break, mine do. That's clear. Your cells react to bacteria and viruses differently than mine. You don't get sick, I do. That's also clear. But for some reason, you and I react the exact same way to water. We swallow it too fast, we choke. We get some in our lungs, we drown. However unreal it may seem, we are connected, you and I. We're on the same curve, just on opposite ends.
- </div>
- <!-- change the section title here -->
- <div id="title">family</div>
- <div id="box1">
- <!-- to customise the icons, links and hover information - add in the url to the first line ( where the icon will link to ). then in the 'onmouseover' section after 'ddrivetip' add in the description or information that will appear on hover - make sure not to delete the apostrophes or brackets. then add in the icon image url to the last section. copy and paste more sections to add more links -->
- <a href="https://octomoosey.tumblr.com/"
- onMouseover="ddrivetip('octomoosey - you can even put a longer description here if you like')";
- onMouseout="hideddrivetip()">
- <img src="https://40.media.tumblr.com/bd60ea352c82f12b5eabdea2574ba414/tumblr_inline_npixhd60sd1ro20i7_100.jpg"></a>
- <a href="https://octomoosey.tumblr.com/"
- onMouseover="ddrivetip('blog name - the box will resize to hold all of your content automatically')";
- onMouseout="hideddrivetip()">
- <img src="https://40.media.tumblr.com/c6ec19ff79810bb9850a009f7dcf8a2c/tumblr_inline_npiyi533y41ro20i7_100.jpg"></a>
- <a href="https://octomoosey.tumblr.com/"
- onMouseover="ddrivetip('another blog name')";
- onMouseout="hideddrivetip()">
- <img src="https://40.media.tumblr.com/c586a61b1ad082b20ec68f101ea70b8d/tumblr_inline_npiyje913H1ro20i7_100.jpg"></a>
- <a href="https://octomoosey.tumblr.com/"
- onMouseover="ddrivetip('octomoosey')";
- onMouseout="hideddrivetip()">
- <img src="https://40.media.tumblr.com/d4be09a708700aeeb6a749c2869bd110/tumblr_inline_npiykfdGZx1ro20i7_100.jpg"></a>
- <a href="https://octomoosey.tumblr.com/"
- onMouseover="ddrivetip('blog name')";
- onMouseout="hideddrivetip()">
- <img src="https://40.media.tumblr.com/f66842b2128a8cdac428dfda8d0f44e6/tumblr_inline_npiykiBcC51ro20i7_100.jpg"></a>
- <a href="https://octomoosey.tumblr.com/"
- onMouseover="ddrivetip('another blog name')";
- onMouseout="hideddrivetip()">
- <img src="https://41.media.tumblr.com/86c22f0ee320d301e38fc07808ebed25/tumblr_inline_npizfslRsk1ro20i7_100.jpg"></a>
- </div>
- </div>
- <div id="dhtmltooltip"></div>
- <script type="text/javascript">
- /***********************************************
- * Cool DHTML tooltip script- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
- * Please keep this notice intact
- * Visit Dynamic Drive at https://www.dynamicdrive.com/ for full source code
- ***********************************************/
- var offsetxpoint=-50 //Customize x offset of tooltip
- var offsetypoint=20 //Customize y offset of tooltip
- var ie=document.all
- var ns6=document.getElementById && !document.all
- var enabletip=false
- if (ie||ns6)
- var tipobj=document.all? document.all["dhtmltooltip"] : document.getElementById? document.getElementById("dhtmltooltip") : ""
- document.body.appendChild(tipobj)
- function ietruebody(){
- return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
- }
- function ddrivetip(thetext, thecolor, thewidth){
- if (ns6||ie){
- if (typeof thewidth!="undefined") tipobj.style.width=thewidth+"px"
- if (typeof thecolor!="undefined" && thecolor!="") tipobj.style.backgroundColor=thecolor
- tipobj.innerHTML=thetext
- enabletip=true
- return false
- }
- }
- function positiontip(e){
- if (enabletip){
- var curX=(ns6)?e.pageX : event.clientX+ietruebody().scrollLeft;
- var curY=(ns6)?e.pageY : event.clientY+ietruebody().scrollTop;
- var rightedge=ie&&!window.opera? ietruebody().clientWidth-event.clientX-offsetxpoint : window.innerWidth-e.clientX-offsetxpoint-20
- var bottomedge=ie&&!window.opera? ietruebody().clientHeight-event.clientY-offsetypoint : window.innerHeight-e.clientY-offsetypoint-20
- var leftedge=(offsetxpoint<0)? offsetxpoint*(-1) : -1000
- if (rightedge<tipobj.offsetWidth)
- tipobj.style.left=ie? ietruebody().scrollLeft+event.clientX-tipobj.offsetWidth+"px" : window.pageXOffset+e.clientX-tipobj.offsetWidth+"px"
- else if (curX<leftedge)
- tipobj.style.left="5px"
- else
- tipobj.style.left=curX+offsetxpoint+"px"
- if (bottomedge<tipobj.offsetHeight)
- tipobj.style.top=ie? ietruebody().scrollTop+event.clientY-tipobj.offsetHeight-offsetypoint+"px" : window.pageYOffset+e.clientY-tipobj.offsetHeight-offsetypoint+"px"
- else
- tipobj.style.top=curY+offsetypoint+"px"
- tipobj.style.visibility="visible"
- }
- }
- function hideddrivetip(){
- if (ns6||ie){
- enabletip=false
- tipobj.style.visibility="hidden"
- tipobj.style.left="-1000px"
- tipobj.style.backgroundColor=''
- tipobj.style.width=''
- }
- }
- document.onmousemove=positiontip
- </script>
- <div id="credit"><a href="https://octomoosey.tumblr.com/"
- onMouseover="ddrivetip('theme by octomoosey')";
- onMouseout="hideddrivetip()">
- <img src="https://31.media.tumblr.com/ce8b580be9fa9afaa442fdb216c9b293/tumblr_inline_nj1tziQKpe1ronkfd.png"></a></div>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement