Advertisement
b0rn-to-be-wild

Enjoy the ride

Feb 17th, 2015
364
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 37.18 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3.  
  4. <!----
  5.  
  6. © borntobewildthemes.tumblr.com | "Enjoy the ride"
  7.  
  8. Base Code by @neonbikethemes.tumblr.com
  9.  
  10. + Please do not redistribute this theme or remove credits.
  11. + You are allowed to make changes as long as you keep our credits.
  12. + If you have any questions or concerns, just contact us.
  13. + Thanks for using our theme! We hope that you enjoy it!
  14.  
  15. ---->
  16.  
  17. <html>
  18. <head>
  19.  
  20. {block:Description}
  21. <meta name="description" content="{MetaDescription}" />
  22. {/block:Description}
  23. <meta charset="utf-8">
  24. <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  25. <title>{Title}{block:TagPage} - {Tag} {/block:TagPage} {block:SearchPage} - {lang:Search results for SearchQuery}{/block:SearchPage}{block:PostSummary}- {PostSummary} {/block:PostSummary}</title>
  26. <link rel="shortcut icon" href="{Favicon}">
  27. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  28.  
  29. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  30. <script>
  31. $(document).ready(function(){
  32. $(".post").click(function(){
  33. $(".posts").slideToggle(100);
  34. });
  35. });
  36. </script>
  37.  
  38. <!--Google fonts-->
  39. <link href='http://fonts.googleapis.com/css?family=Kaushan+Script:400,400italic,700,700italic|Arimo+2:400,400italic,700,700italic|Great+Vibes:400italic,700italic,400,700|Roboto:400,400italic,700,700italic|Clicker+Script:400,700|Share:400,400italic,700,700italic' rel='stylesheet' type='text/css'>
  40.  
  41. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
  42.  
  43. <meta name="image:Portrait" content="1"/>
  44. <meta name="image:Background" content="1"/>
  45.  
  46. <meta name="color:Background" content="#fff"/>
  47. <meta name="color:Link" content="#333"/>
  48. <meta name="color:Icon" content="#332824"/>
  49. <meta name="color:Text" content="#333"/>
  50. <meta name="color:Bold" content="#eee"/>
  51. <meta name="color:Italic" content="#777"/>
  52. <meta name="color:Hover" content="#777"/>
  53. <meta name="color:Blog Title" content="#332824"/>
  54. <meta name="color:Post borders" content="#777"/>
  55. <meta name="color:Borders" content="#777"/>
  56. <meta name="color:Scrollbar" content="#332824"/>
  57. <meta name="color:Post background" content="#fff"/>
  58. <meta name="color:Header link" content="#656563"/>
  59. <meta name="color:Header link background" content="#000"/>
  60. <meta name="color:Description" content="#656563"/>
  61. <meta name="color:Music player text" content="#333"/>
  62. <meta name="color:Music player background" content="#eee"/>
  63. <meta name="color:Search bar background" content="#eee"/>
  64. <meta name="color:Icon background" content="#eee"/>
  65.  
  66. <meta name="select:Header transparency color" content="0,0,0" title="black">
  67. <meta name="select:Header transparency color" content="238,238,238" title="gray">
  68. <meta name="select:Header transparency color" content="255,255,255" title="white">
  69. <meta name="select:Header transparency color" content="255,168,212" title="pink">
  70. <meta name="select:Header transparency color" content="127,88,242" title="purple">
  71. <meta name="select:Header transparency color" content="184,168,255" title="indigo">
  72. <meta name="select:Header transparency color" content="184,208,255" title="blue">
  73. <meta name="select:Header transparency color" content="103,173,90" title="green">
  74. <meta name="select:Header transparency color" content="33,209,297" title="turquoise">
  75. <meta name="select:Header transparency color" content="226,229,23" title="yellow">
  76. <meta name="select:Header transparency color" content="112,38,11" title="brown">
  77.  
  78. <meta name="select:Header transparency" content="1" title="opaque">
  79. <meta name="select:Header transparency" content=".9" title=".9">
  80. <meta name="select:Header transparency" content=".8" title=".8">
  81. <meta name="select:Header transparency" content=".7" title=".7">
  82. <meta name="select:Header transparency" content=".6" title=".6">
  83. <meta name="select:Header transparency" content=".5" title=".5">
  84. <meta name="select:Header transparency" content=".4" title=".4">
  85. <meta name="select:Header transparency" content=".3" title=".3">
  86. <meta name="select:Header transparency" content=".2" title=".2">
  87. <meta name="select:Header transparency" content=".1" title=".1">
  88. <meta name="select:Header transparency" content=".0" title="transparent">
  89.  
  90. <meta name="select:Description transparency color" content="0,0,0" title="black">
  91. <meta name="select:Description transparency color" content="238,238,238" title="gray">
  92. <meta name="select:Description transparency color" content="255,255,255" title="white">
  93. <meta name="select:Description transparency color" content="255,168,212" title="pink">
  94. <meta name="select:Description transparency color" content="127,88,242" title="purple">
  95. <meta name="select:Description transparency color" content="184,168,255" title="indigo">
  96. <meta name="select:Description transparency color" content="184,208,255" title="blue">
  97. <meta name="select:Description transparency color" content="103,173,90" title="green">
  98. <meta name="select:Description transparency color" content="33,209,297" title="turquoise">
  99. <meta name="select:Description transparency color" content="226,229,23" title="yellow">
  100. <meta name="select:Description transparency color" content="112,38,11" title="brown">
  101.  
  102. <meta name="select:Description transparency" content="1" title="opaque">
  103. <meta name="select:Description transparency" content=".9" title=".9">
  104. <meta name="select:Description transparency" content=".8" title=".8">
  105. <meta name="select:Description transparency" content=".7" title=".7">
  106. <meta name="select:Description transparency" content=".6" title=".6">
  107. <meta name="select:Description transparency" content=".5" title=".5">
  108. <meta name="select:Description transparency" content=".4" title=".4">
  109. <meta name="select:Description transparency" content=".3" title=".3">
  110. <meta name="select:Description transparency" content=".2" title=".2">
  111. <meta name="select:Description transparency" content=".1" title=".1">
  112. <meta name="select:Description transparency" content=".0" title="transparent">
  113.  
  114. <meta name="select:Post transparency color" content="0,0,0" title="black">
  115. <meta name="select:Post transparency color" content="238,238,238" title="gray">
  116. <meta name="select:Post transparency color" content="255,255,255" title="white">
  117. <meta name="select:Post transparency color" content="255,168,212" title="pink">
  118. <meta name="select:Post transparency color" content="127,88,242" title="purple">
  119. <meta name="select:Post transparency color" content="184,168,255" title="indigo">
  120. <meta name="select:Post transparency color" content="184,208,255" title="blue">
  121. <meta name="select:Post transparency color" content="103,173,90" title="green">
  122. <meta name="select:Post transparency color" content="33,209,297" title="turquoise">
  123. <meta name="select:Post transparency color" content="226,229,23" title="yellow">
  124. <meta name="select:Post transparency color" content="112,38,11" title="brown">
  125.  
  126. <meta name="select:Post transparency" content="1" title="opaque">
  127. <meta name="select:Post transparency" content=".9" title=".9">
  128. <meta name="select:Post transparency" content=".8" title=".8">
  129. <meta name="select:Post transparency" content=".7" title=".7">
  130. <meta name="select:Post transparency" content=".6" title=".6">
  131. <meta name="select:Post transparency" content=".5" title=".5">
  132. <meta name="select:Post transparency" content=".4" title=".4">
  133. <meta name="select:Post transparency" content=".3" title=".3">
  134. <meta name="select:Post transparency" content=".2" title=".2">
  135. <meta name="select:Post transparency" content=".1" title=".1">
  136. <meta name="select:Post transparency" content=".0" title="transparent">
  137.  
  138. <meta name="text:Tab 1 Title" content="Tab 1 Title" />
  139. <meta name="text:Tab 2 Title" content="Tab 2 Title" />
  140. <meta name="text:Tab 3 Title" content="Tab 3 Title" />
  141. <meta name="text:Tab 4 Title" content="Tab 4 Title" />
  142. <meta name="text:Tab 5 Title" content="Tab 5 Title" />
  143.  
  144. <meta name="text:About" content="About me" />
  145.  
  146. <meta name="select:Title Font" content="Kaushan Script" title="Kaushan Script">
  147. <meta name="select:Title Font" content="Great Vibes" title="Great Vibes">
  148. <meta name="select:Title Font" content="Arimo" title="Arimo">
  149. <meta name="select:Title Font" content="Roboto" title="Roboto">
  150. <meta name="select:Title Font" content="Clicker Script" title="Clicker Script">
  151.  
  152. <meta name="select:Link Font" content="Arimo" title="Arimo">
  153. <meta name="select:Link Font" content="Kaushan Script" title="Kaushan Script">
  154. <meta name="select:Link Font" content="Great Vibes" title="Great Vibes">
  155. <meta name="select:Link Font" content="Roboto" title="Roboto">
  156. <meta name="select:Link Font" content="Clicker Script" title="Clicker Script">
  157.  
  158. <meta name="font:Body font" content="Helvetica"/>
  159.  
  160. <meta name="if:Show Navigation Icons" content="1"/>
  161. <meta name="if:Show Music Player" content="1"/>
  162. <meta name="if:Show Search" content="1" />
  163. <meta name="if:Show Captions" content="1" />
  164. <meta name="if:Show Tags" content="1" />
  165.  
  166. <meta name="if:Facebook" content="0" />
  167. <meta name="if:Twitter" content="0" />
  168. <meta name="if:Youtube" content="0" />
  169. <meta name="if:Flickr" content="0" />
  170. <meta name="if:Googleplus" content="0" />
  171.  
  172. <meta name="text:Facebook url" content="" />
  173. <meta name="text:Twitter url" content="" />
  174. <meta name="text:Youtube url" content="" />
  175. <meta name="text:Flickr url" content="" />
  176. <meta name="text:Googleplus url" content="" />
  177.  
  178. <meta name="text:Link One" content="link One"/>
  179. <meta name="text:Link Two" content="link Two"/>
  180. <meta name="text:Link Three" content="link Three"/>
  181. <meta name="text:Link Four" content="link Four"/>
  182. <meta name="text:Link Five" content="link Five"/>
  183. <meta name="text:Link Six" content="link Six"/>
  184.  
  185. <meta name="text:Link One Url" content="link One Url"/>
  186. <meta name="text:Link Two Url" content="link Two Url"/>
  187. <meta name="text:Link Three Url" content="link Three Url"/>
  188. <meta name="text:Link Four Url" content="link Four Url"/>
  189. <meta name="text:Link Five Url" content="link Five Url"/>
  190. <meta name="text:Link Six Url" content="link Six Url"/>
  191.  
  192. <meta name="text:Song title 1" content="Song title 1"/>
  193. <meta name="text:Song title 2" content="Song title 2"/>
  194. <meta name="text:Song title 3" content="Song title 3"/>
  195. <meta name="text:Song title 4" content="Song title 4"/>
  196. <meta name="text:Song title 5" content="Song title 5"/>
  197.  
  198. <!-- IMPORTED SCRIPTS - DON'T REMOVE -->
  199.  
  200. <script language="javascript" type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
  201.  
  202. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
  203.  
  204. <script src="http://static.tumblr.com/wgijwsy/Ebfm2v4gy/jquery.masonry.min.js"></script>
  205.  
  206. <!-- TOOLTIP SCRIPT (REMOVE ONYL IF YOU WANT STANDARD BROWSER TOOLTIPS) -->
  207.  
  208. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  209. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  210. <script>
  211. (function($){
  212. $(document).ready(function(){
  213. $("a[title]").style_my_tooltips({
  214. tip_follows_cursor:true,
  215. tip_delay_time:90,
  216. tip_fade_speed:600,
  217. attribute:"title"
  218. });
  219. });
  220. })(jQuery);
  221. </script>
  222.  
  223.  
  224. <style type="text/css">
  225.  
  226. /* ---------------------------- GENERAL ----------------------------- */
  227.  
  228. /* -------- BASICS ------- */
  229.  
  230. body{
  231. color:{color:Text};
  232. font-family:{font:Body font};
  233. line-height:17px;
  234. font-size:14px;
  235. text-align:left;
  236. background-color: {color:Background};
  237. background-image:url({image:Background});
  238. background-attachment: fixed;
  239. background-repeat: repeat;
  240. background-position: center;
  241. overflow:auto;
  242. overflow-x:hidden;
  243. padding:0;
  244. margin:0;
  245. }
  246.  
  247. h1{
  248. color:{color:Title};
  249. font-family:{select:Title Font};
  250. font-size:20px;
  251. line-height: 25px;
  252. font-weight: normal;
  253. border-bottom:1px solid {color:Info border};
  254. }
  255.  
  256. h2{
  257. line-height:17px;
  258. font-size:14px;
  259. }
  260.  
  261. a:link, a:active, a:visited{
  262. font-family:{select:Link Font};
  263. -webkit-transition: color 0.3s ease-out;
  264. -moz-transition: color 0.3s ease-out;
  265. text-decoration:none;
  266. transition: color 0.3s ease-out;
  267. color:{color:Link};
  268. }
  269.  
  270. a:hover {
  271. color: {color:Hover};
  272. }
  273.  
  274. b {
  275. font-weight:bold;
  276. color:{color:Bold};}
  277.  
  278. p.italic {
  279. font-style:italic;
  280. color:{color:Italic};}
  281.  
  282. blockquote{
  283. padding:0px 0px 2px 5px;
  284. margin:0px 0px 2px 10px;
  285. border-left: 1px solid {color:Borders};
  286. }
  287.  
  288. blockquote p, ul{
  289. margin:0px;
  290. padding:0px;
  291. }
  292.  
  293. a img{border: 0px;}
  294.  
  295.  
  296. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  297.  
  298. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  299. .user_7 .label, .user_8 .label, .user_9 .label {color:{color:text};}
  300.  
  301. .notes img{
  302. width:15px;
  303. position:relative;
  304. top:3px;
  305. margin-right:5px;
  306. border:1px solid {color:Borders};
  307. border-radius:60px;
  308. }
  309.  
  310. <--ses-->
  311. small{font-size: 90%;}
  312.  
  313. big{font-size: 110%;}
  314.  
  315. /* Selection */
  316.  
  317. ::-moz-selection {
  318. background: {color:text};
  319. color: {color:background};
  320. }
  321.  
  322. ::selection {
  323. background: {color:text};
  324. color: {color:background};
  325. }
  326.  
  327. /* Webkit scrollbar */
  328.  
  329. ::-webkit-scrollbar-thumb {
  330. background: {color:Scrollbar};
  331. height: auto;
  332. border: 2px solid {color:Borders};
  333. }
  334.  
  335. ::-webkit-scrollbar {
  336. height:10px;
  337. width:10px;
  338. background: {color:Scrollbar};
  339. height: auto;
  340. border: 4px solid {color:Borders};
  341. }
  342.  
  343. /* Tooltips */
  344.  
  345. #s-m-t-tooltip {
  346. max-width:300px;
  347. z-index:10000;
  348. margin:24px 14px 7px 12px;
  349. padding:8px;
  350. color:{color:Link};
  351. background:rgba({select:Post transparency color}, {select:Post transparency});
  352. font-size:12px;
  353. line-height:16px;
  354. border:1px solid {color:Borders};
  355. }
  356.  
  357. /* Tab 2 */
  358.  
  359. #bigcon{
  360. width:100%;
  361. margin-top:20px;
  362. margin-left:auto;
  363. margin-right:auto;
  364. }
  365.  
  366. .tabcontent {
  367. margin-top:70px;
  368. margin-left:auto;
  369. margin-right:auto;
  370. width: 523px;
  371. text-align:center;
  372. margin-bottom:50px;
  373. }
  374.  
  375. #posts {
  376. position:static;
  377. margin-left:auto;
  378. margin-right:auto;
  379. width: 553px;
  380. margin-top:100px;
  381. padding-left:30px;
  382. overflow:hidden;
  383. text-align:center;
  384. margin-bottom:10px;
  385. }
  386.  
  387. #entry {
  388. float:left;
  389. display: block;
  390. margin-top:20px;
  391. margin-left:auto;
  392. margin-right:auto;
  393. overflow:hidden;
  394. text-align:left;
  395. width:500px;
  396. padding:10px;
  397. border:2px solid {color:Post borders};
  398. background:rgba({select:Post transparency color}, {select:Post transparency});
  399. }
  400.  
  401. #entry p img, #entry blockquote img { max-width: 100%; }
  402.  
  403. /* Tab 3 */
  404.  
  405. .about {
  406. margin-left:auto;
  407. margin-right:auto;
  408. width: 523px;
  409. max-height:290px;
  410. padding:10px;
  411. height:auto;
  412. overflow:hidden;
  413. overflow-y:auto;
  414. text-align:center;
  415. border:2px solid {color:Post borders};
  416. background:rgba({select:Post transparency color}, {select:Post transparency});
  417. }
  418.  
  419. .about h1{
  420. font-size:30px;
  421. line-height:35px;
  422. border-bottom:2px solid {color:Post borders};
  423. }
  424.  
  425. .about a i{
  426. font-size:15px;
  427. padding:5px;
  428. color:{color:Icon};
  429. border:2px solid {color:Post borders};
  430. }
  431.  
  432. .links {
  433. margin-left:auto;
  434. margin-right:auto;
  435. width: 523px;
  436. padding:10px;
  437. margin-top:10px;
  438. height:auto;
  439. overflow:hidden;
  440. text-align:center;
  441. margin-bottom:10px;
  442. border:2px solid {color:Post borders};
  443. background:rgba({select:Post transparency color}, {select:Post transparency});
  444. }
  445.  
  446. .links a{
  447. display:inline-block;
  448. color:{color:Link};
  449. font-size:13px;
  450. padding:6px;
  451. text-align:center;
  452. letter-spacing:1px;
  453. text-transform:lowercase
  454. margin-top:5px;
  455. margin-bottom:5px;
  456. width:240px;
  457. border:2px solid {color:Post borders};
  458. -webkit-transition: all 0.4s ease-in-out;
  459. -moz-transition: all 0.4s ease-in-out;
  460. -o-transition: all 0.4s ease-in-out;
  461. -ms-transition: all 0.4s ease-in-out;
  462. transition: all 0.4s ease-in-out;
  463. }
  464.  
  465. .portrait {
  466. width:100px;
  467. height:100px;
  468. border:2px solid {color:Post borders};
  469. margin:10px;
  470. float:left;
  471. }
  472.  
  473. /* Tab 4 */
  474.  
  475. #grouptitle {
  476. padding:5px;
  477. text-align:center;
  478. font-style:italic;
  479. font-family:{select:Title Font};
  480. font-size:25px;
  481. color:{color:Link};
  482. opacity:0.8;
  483. font-size:15px;
  484. width:160px;
  485. margin-left:8px;
  486. margin-top:20px;
  487. border:2px solid {color:Post borders};
  488. background:rgba({select:Header transparency color}, {select:Header transparency});
  489. }
  490.  
  491. #grouplinks {
  492. width:160px;
  493. padding:5px;
  494. margin-left:10px;
  495. background:rgba({select:Post transparency color}, {select:Post transparency});
  496. }
  497.  
  498. #grouplinks a {
  499. display:block;
  500. color:{color:Link};
  501. font-size:13px;
  502. padding:6px;
  503. text-align:center;
  504. letter-spacing:1px;
  505. text-transform:lowercase
  506. margin-top:5px;
  507. margin-bottom:5px;
  508. border:2px solid {color:Post borders};
  509. -webkit-transition: all 0.4s ease-in-out;
  510. -moz-transition: all 0.4s ease-in-out;
  511. -o-transition: all 0.4s ease-in-out;
  512. -ms-transition: all 0.4s ease-in-out;
  513. transition: all 0.4s ease-in-out;
  514. }
  515.  
  516. #grouplinks a:hover, .links a:hover, .about i:hover {
  517. background:{color:Post borders};
  518. color:{color:Hover};
  519. }
  520.  
  521. /* Tab 5 */
  522.  
  523. #tab5{
  524. margin-top:10px;
  525. }
  526.  
  527. .blogroll{
  528. margin-left:auto;
  529. margin-right:auto;
  530. width: 523px;
  531. height:auto;
  532. max-height:480px;
  533. padding:10px;
  534. overflow:hidden;
  535. overflow-y:auto;
  536. text-align:center;
  537. margin-bottom:20px;
  538. margin-top:10px;
  539. border:2px solid {color:Post borders};
  540. background:rgba({select:Post transparency color}, {select:Post transparency});
  541. }
  542.  
  543. .blogroll img{
  544. width:50px;
  545. margin:5px;
  546. border:3px solid {color:Post borders};
  547. opacity:0.8;
  548. }
  549.  
  550. .blogroll img:hover{
  551. opacity:1;
  552. border:5px solid {color:Hover};
  553. -webkit-transition: all .5s ease;
  554. -moz-transition: all .5s ease;
  555. -o-transition: all .5s ease;
  556. transition: all .5s ease;
  557. }
  558.  
  559. /* Music player */
  560.  
  561. #musicplayer {
  562. text-align:center;
  563. position:fixed;
  564. right:55px;
  565. top:65px;
  566. color:{color:Music player text};
  567. background:{color:Music player background};
  568. width:35px;
  569. min-height:32px;
  570. line-height:27px;
  571. border:1px solid {color:Borders};
  572. z-index:100000000;
  573. }
  574.  
  575. #musicplayer:hover{
  576. width:170px;
  577. -webkit-transition: all .7s ease;
  578. -moz-transition: all .7s ease;
  579. -o-transition: all .7s ease;
  580. transition: all .7s ease;
  581. overflow-y:visible;
  582. }
  583.  
  584. #music {
  585. position:absolute;
  586. margin-left:37px;
  587. margin-top:0px;
  588. width:10px;
  589. height:33px;
  590. overflow:hidden;
  591. z-index: 9999;
  592. }
  593.  
  594. #musicplayer:hover #music{
  595. width:132px;
  596. border-left:1px solid {color:Borders};
  597. }
  598.  
  599. #music:hover{
  600. height:auto;
  601. -webkit-transition: all .7s ease;
  602. -moz-transition: all .7s ease;
  603. -o-transition: all .7s ease;
  604. transition: all .7s ease;
  605. }
  606.  
  607. #musicicon {
  608. margin-top:-1px;
  609. height:32px;
  610. line-height:14px;
  611. margin:0;
  612. width:35px;
  613. }
  614.  
  615. /* Search */
  616.  
  617. #search {
  618. text-align:center;
  619. position:fixed;
  620. right:100px;
  621. top:65px;
  622. background:{color:Search bar background};
  623. width:35px;
  624. height:32px;
  625. border:1px solid {color:Borders};
  626. z-index:100000000;
  627. overflow:hidden;
  628. }
  629.  
  630. #search:hover {
  631. width:170px;
  632. -webkit-transition: all .7s ease;
  633. -moz-transition: all .7s ease;
  634. -o-transition: all .7s ease;
  635. transition: all .7s ease;
  636. }
  637.  
  638. .search-icon{
  639. position:absolute;
  640. margin-left:7px;
  641. margin-top:6px;
  642. z-index:10000;
  643. }
  644.  
  645. .search-icon i{
  646. color:{color:Icon};
  647. padding:2.5px;
  648. font-size:16px;
  649. }
  650.  
  651. /* Main icons */
  652.  
  653. .icons{
  654. position:fixed;
  655. width:135px;
  656. height:30px;
  657. right:141px;
  658. top:65px;
  659. }
  660.  
  661. .icons i{
  662. color:{color:Icon};
  663. width:35px;
  664. height:32px;
  665. line-height:33px;
  666. margin-left:4px;
  667. font-size:16px;
  668. text-align:center;
  669. border:1px solid {color:Borders};
  670. background:{color:Icon background};
  671. }
  672.  
  673. .icons i:hover{
  674. color:{color:Hover};
  675. }
  676.  
  677. /* Credits */
  678.  
  679. #credits {
  680. position:fixed;
  681. right:10px;
  682. top:65px;
  683. z-index:100000;
  684. }
  685.  
  686. #credits img{
  687. border:1px solid {color:Borders};
  688. }
  689.  
  690. /* ----------------------------- HEADER STUFF ---------------------------*/
  691.  
  692. #header{
  693. position:fixed;
  694. top:0px;
  695. padding:10px;
  696. text-align:center;
  697. width:100%;
  698. height:35px;
  699. background:rgba({select:Header transparency color}, {select:Header transparency});
  700. z-index:100000000;
  701. }
  702.  
  703. .blogtitle{
  704. margin:auto;
  705. margin-top:240px;
  706. width:70%;
  707. padding:10px;
  708. margin-bottom:300px;
  709. text-align:center;
  710. background:rgba({select:Description transparency color}, {select:Description transparency});
  711. }
  712.  
  713. .blogtitle h1{
  714. font-size:35px;
  715. line-height:40px;
  716. letter-spacing:1px;
  717. color:{color:Blog title};
  718. font-family:{select:Title Font};
  719. border-bottom:1px solid {color:Borders};
  720. }
  721.  
  722. .description{
  723. margin:auto;
  724. margin-top:-20px;
  725. padding:10px;
  726. text-align:center;
  727. color:{color:Description};
  728. }
  729.  
  730. #navbar{
  731. display:inline-block;
  732. text-align:center;
  733. }
  734.  
  735. /* ------------------------------ TABS ------------------------------ */
  736.  
  737. .tabs {
  738. width:100%;
  739. margin-left:0px;
  740. display:inline-block;
  741. }
  742.  
  743. /* Clearfix */
  744. .tab-links:after {
  745. display:block;
  746. clear:both;
  747. content:'';
  748. }
  749.  
  750. .tab-links li {
  751. margin-right:5px;
  752. display:inline-block;
  753. list-style:none;
  754. text-transform:uppercase;
  755. }
  756.  
  757. .tab-links a {
  758. padding:7px;
  759. display:inline-block;
  760. color:{color:Header link};
  761. transition:all linear 0.15s;
  762. border-bottom:1px solid transparent;
  763. }
  764.  
  765. .tab-links a:hover {
  766. border-bottom:1px solid {color:Text};
  767. text-decoration:none;
  768. }
  769.  
  770. li.active a, li.active a:hover {
  771. background:transparent;
  772. color:{color:Header background};
  773. border-bottom:1px solid {color:Header link background};
  774. background:{color:Header link background};
  775. -webkit-transition: all .3s;
  776. -moz-transition: all .3s;
  777. -o-transition: all .3s;
  778. -ms-transition: all .3s;
  779. transition: all .3s;
  780. }
  781.  
  782. .tab-content {
  783. }
  784.  
  785. .tab {
  786. display:none;
  787. }
  788.  
  789. .tab.active {
  790. display:block;
  791. }
  792.  
  793. /* -------------------------- POST TYPES -------------------------- */
  794.  
  795. /* Quote posts */
  796.  
  797. .quote {
  798. font-size:25px;
  799. line-height:30px;
  800. font-family:{select:Title Font};
  801. color:{color:Italic};
  802. height:auto;
  803. margin-top:15px;
  804. margin-bottom:5px;
  805. padding:10px;
  806. text-align:center;
  807. letter-spacing:1px;
  808. }
  809.  
  810. .source {
  811. font-size:12px;
  812. line-height:23px;
  813. font-family:{select:Title Font};
  814. color:{color:Italic};
  815. height:auto;
  816. margin-top:15px;
  817. margin-bottom:5px;
  818. text-align:right;
  819. letter-spacing:1px;
  820. }
  821.  
  822. /* Chat Posts*/
  823.  
  824. .chat .line{
  825. margin:0 0 -1px;
  826. color: {color:Text};
  827. padding:2px;
  828. border-top:1px dashed {color:Borders};
  829. border-bottom:1px dashed {color:Borders};
  830. }
  831.  
  832. .label {
  833. font-weight:none;
  834. color:{color:Bold};
  835. font-size:15px;
  836. }
  837.  
  838. /* Link Posts */
  839.  
  840. #linktitle {
  841. width:490px;
  842. padding:5px;
  843. border:2px {color:Borders} solid;
  844. }
  845.  
  846. .linktexttitle a{
  847. font-family:{select:Link Font};
  848. font-size:20px;
  849. line-height:20px;
  850. text-align:center;
  851. color:{color:Link};
  852. font-weight:bold;
  853. }
  854.  
  855. .linkdescription {
  856. padding:5px;
  857. margin:0px;
  858. text-align:left;}
  859.  
  860. /*Ask Posts*/
  861.  
  862. .question{
  863. width:100%;
  864. height:24px;
  865. line-height:24px;
  866. margin-bottom:4px;
  867. border-bottom:1px solid {color:Borders};
  868. }
  869.  
  870. .question img{
  871. border:3px solid {color:Borders};
  872. margin-right:4px;
  873. }
  874.  
  875. .answer{
  876. margin-top:15px;
  877. width:490px;
  878. padding:5px;
  879. background:{color:Borders};
  880. }
  881.  
  882. /*Audio*/
  883.  
  884. .album img{
  885. max-width:65px;
  886. margin-left:5px;
  887. float:left;
  888. margin-top:0px;
  889. z-index:10;
  890. border: 5px solid {color:Borders};
  891. }
  892.  
  893. .audio{
  894. position:absolute;
  895. width:185px;
  896. min-height:90px;
  897. margin-left:80px;
  898. float:left;
  899. padding:5px;
  900. margin-top:-5px;
  901. z-index:10;
  902. font-size:12px;
  903. overflow:hidden;
  904. }
  905.  
  906. .play{
  907. position:absolute;
  908. margin:30px;
  909. max-width:25px;
  910. max-height:25px;
  911. overflow:hidden;
  912. opacity:0.7;
  913. }
  914.  
  915. /* Extras */
  916.  
  917. .like_and_reblog_buttons {
  918. float:right;
  919. margin-top:-28px;
  920. margin-bottom:0px;
  921. z-index:200000;
  922. border: 0px solid #e8e8e8;
  923. border-radius: 3px;
  924. margin-left:400px;
  925. list-style: none;
  926. }
  927.  
  928. .like_and_reblog_buttons li {
  929. float:right;
  930. margin: 5px 5px;
  931. height: 15px;
  932. }
  933.  
  934. .like_and_reblog_buttons li:first-child {
  935. border-right: 0px solid #e8e8e8;
  936. }
  937.  
  938. .info {
  939. float:center;
  940. padding:5px;
  941. margin-top:10px;
  942. margin-left:0px;
  943. text-align:center;
  944. font-size:15px;
  945. line-height:20px;
  946. width:490px;
  947. height:20px;
  948. border-top:2px solid {color:Borders};
  949. }
  950.  
  951. .info i{
  952. color:{color:Icon};
  953. }
  954.  
  955. .info a {
  956. font-size:15px;
  957. color:{color:Link};
  958. }
  959.  
  960. .info a:hover {
  961. {color:Hover}
  962. transition-duration: 0.6s;
  963. -moz-transition-duration: 0.6s;
  964. -webkit-transition-duration: 0.6s;}
  965.  
  966. /* ------------------------- PAGINATION ------------------------- */
  967.  
  968. #pagination{
  969. width:100%;
  970. margin-top:0px;
  971. text-align:center;
  972. }
  973.  
  974. .pagibutton{
  975. position:relative;
  976. display:inline-block;
  977. background:rgba({select:Post transparency color}, {select:Post transparency});
  978. padding:10px;
  979. }
  980.  
  981.  
  982. /* --------------------------- Custom CSS -------------------------- */
  983. {CustomCSS}
  984. </style>
  985. </head>
  986. <body>
  987.  
  988.  
  989. <div id="bigcon">
  990.  
  991.  
  992. <!--Header-->
  993.  
  994. <div id="header">
  995.  
  996. <div id="navbar">
  997. <div class="tabs">
  998. <ul class="tab-links">
  999. <li class="active" style="margin-left:-30px">
  1000. <a href="/">{text:Tab 1 Title}</a></li>
  1001. <li><a href="#posts">{text:Tab 2 Title}</a></li>
  1002. <li><a href="#tab3">{text:Tab 3 Title}</a></li>
  1003. <li><a href="#tab4">{text:Tab 4 Title}</a></li>
  1004. <li><a href="#tab5">{text:Tab 5 Title}</a></li>
  1005. </ul>
  1006. </div>
  1007. </div>
  1008.  
  1009. </div>
  1010.  
  1011.  
  1012. <!-- --------------------------- TABS -------------------------- -->
  1013.  
  1014.  
  1015. <div class="tabs">
  1016.  
  1017.  
  1018. <!-- --------------------------- TAB 1 -------------------------- -->
  1019.  
  1020. <div class="tab-content">
  1021. <div id="tab1" class="tab active">
  1022.  
  1023. <div class="blogtitle">
  1024. <h1>{Title}</h1>
  1025. <div class="description">{description}</div>
  1026. </div>
  1027.  
  1028. <div id="posts">
  1029.  
  1030. {block:Posts}
  1031. <div id="entry">
  1032.  
  1033. {block:Text}
  1034. {block:Title}
  1035. <a href="{Permalink}">
  1036. <h1>{Title}</h1></a>
  1037. {/block:Title}
  1038. {Body}
  1039. {/block:Text}
  1040.  
  1041. {block:Photo}
  1042. {block:IndexPage}
  1043. <img src="{PhotoURL-500}"
  1044. width="500"/></a>{/block:IndexPage}
  1045. {block:PermalinkPage}
  1046. <a href="{permalink}">
  1047. <img src="{PhotoURL-500}"
  1048. width="500"/></a>{/block:PermalinkPage}
  1049. {/block:Photo}
  1050.  
  1051. {block:Photoset}
  1052. {Photoset-500}
  1053. {/block:Photoset}
  1054.  
  1055. {block:Quote}
  1056. <div class="quote">
  1057. "{Quote}"{block:Source}
  1058. <div class="source">-{Source}
  1059. </div>{/block:Source}</div>
  1060. {/block:Quote}
  1061.  
  1062. {block:Link}
  1063. <div id="linktitle">
  1064. <div class="linktexttitle">
  1065. <a href="{URL}"
  1066. class="linkpost"
  1067. target="_blank">
  1068. {Name} &raquo;</a></div></div>
  1069. {block:Description}
  1070. <div class="linkdescription">{Description}</div>
  1071. {/block:Description}
  1072. {/block:Link}
  1073.  
  1074. {block:Chat}
  1075. {block:Title}<h1>{Title}</h1>{/block:Title}
  1076. {block:Lines}<div class="chat"><div class="line {Alt}">
  1077. <div class="{Alt} user_{UserNumber}">
  1078. {block:Label}
  1079. <span class="label">
  1080. <span style="text-transform:uppercase;
  1081. letter-spacing:1px">
  1082. <b>{Label}</b>
  1083. </span></span>
  1084. {/block:Label}
  1085. {Line}</div>
  1086. </div></div>
  1087. {/block:Lines}
  1088. {/block:Chat}
  1089.  
  1090. {block:Audio}
  1091. <div class="album">{block:AlbumArt}<img src="{AlbumArtURL}">
  1092. {block:AlbumArt}
  1093. <div class="play">
  1094. {AudioPlayerWhite}
  1095. </div>
  1096. </div>
  1097. <div class="audio">
  1098. {block:TrackName}<i class="fa fa-microphone"></i> {TrackName}{/block:TrackName}
  1099. {block:Artist}<br><i class="fa fa-user"></i> {Artist}{/block:Artist}
  1100. {block:Album}<br><i class="fa fa-music"></i> {Album}{/block:Album}
  1101. {block:PlayCount}<br><i class="fa fa-heart"></i> {PlayCount}{/block:PlayCount}</div>
  1102. <br><br><br><br><br>
  1103. {/block:Audio}
  1104.  
  1105. {block:Video}
  1106. {VideoEmbed-500}
  1107. {/block:Video}
  1108.  
  1109. {block:Answer}
  1110. <div class="question">
  1111. <img src="{AskerPortraitURL-48}"
  1112. align="left">
  1113. {Asker}</div>
  1114. {Question}&nbsp;
  1115. <div class="answer">
  1116. {Answer}</div>
  1117. {/block:Answer}
  1118.  
  1119. {block:IndexPage}
  1120. {block:IfShowCaptions}
  1121. {block:Caption}
  1122. <h2>{Caption}</h2>
  1123. {/block:Caption}
  1124. {/block:IfShowCaptions}
  1125. {/block:IndexPage}
  1126.  
  1127. {block:IfShowTags}
  1128. {block:HasTags}<br>
  1129. {block:Tags}
  1130. <a href="{TagURL}">
  1131. <i class="fa fa-tag"></i>
  1132. {Tag}</a> &nbsp;
  1133. {/block:Tags}
  1134. {/block:HasTags}
  1135. {/block:IfShowTags}
  1136.  
  1137. {block:Date}
  1138. <div class="info">
  1139. <a href="{Permalink}">
  1140. <i class="fa fa-clock-o"></i>
  1141. {TimeAgo}</a>
  1142. {block:NoteCount}
  1143. <i class="fa fa-heart-o"></i>
  1144. {NoteCountWithLabel}
  1145. {/block:NoteCount}
  1146. </div>
  1147.  
  1148. <ul class="like_and_reblog_buttons">
  1149. <li>{ReblogButton size="15"}</li>
  1150. <li>{LikeButton size="15"}</li>
  1151. </ul>
  1152. </div>
  1153. {/block:Date}
  1154.  
  1155. {block:PermalinkPage}
  1156. {block:Caption}
  1157. {Caption}
  1158. {/block:Caption}
  1159. <br>
  1160. {block:PostNotes}
  1161. {PostNotes}
  1162. {/block:PostNotes}
  1163. </div>
  1164.  
  1165. {/block:PermalinkPage}
  1166.  
  1167. {/block:Posts}<br>
  1168. </div>
  1169.  
  1170. <!--PAGINATION-->
  1171. {block:Pagination}
  1172. <center>
  1173. <div class="pagination">
  1174. {block:PreviousPage}
  1175. <a href="{PreviousPage}#tab2">
  1176. <div class="pagibutton">Previous</div></a>
  1177. {/block:PreviousPage}
  1178. {block:NextPage}
  1179. <a href="{NextPage}#tab2">
  1180. <div class="pagibutton">Next</div></a>
  1181. {/block:NextPage}
  1182. </div>
  1183. </center><br>
  1184. {/block:Pagination}
  1185.  
  1186. </div>
  1187.  
  1188. </div>
  1189.  
  1190. <!-- -------------------------- TAB 3 -------------------------- -->
  1191.  
  1192. <div id="tab3" class="tab">
  1193. <div class="tabcontent"><br>
  1194.  
  1195. <div class="about">
  1196. <img src="{image:Portrait}"
  1197. class="portrait" />
  1198. <div align="justify">
  1199. <span><h1>About me</h1></span>
  1200. {Text:About}
  1201. </div> </div>
  1202.  
  1203. <div class="links">
  1204. <a href="{text:Link One Url}">{text:Link One}</a>
  1205. <a href="{text:Link Two Url}">{text:Link Two}</a>
  1206. <a href="{text:Link Three Url}">{text:Link Three}</a>
  1207. <a href="{text:Link Four Url}">{text:Link Four}</a>
  1208. <a href="{text:Link Five Url}">{text:Link Five}</a>
  1209. <a href="{text:Link Six Url}">{text:Link Six}</a>
  1210. </div>
  1211.  
  1212. <div class="about">
  1213. {block:IfFacebook}<a href="{text:Facebook url}" target = "_blank"><i class="fa fa-facebook"> </i></a>{/block:IfFacebook}
  1214. {block:IfTwitter}<a href="{text:Twitter url}"><i class="fa fa-twitter"></i></a>{/block:IfTwitter}
  1215. {block:IfYoutube}<a href="{text:YouTube url}"><i class="fa fa-youtube"></i></a>{/block:IfYoutube}
  1216. {block:IfFlickr}<a href="{text:Flickr url}"><i class="fa fa-flickr"></i></a>{/block:IfFlickr}
  1217. {block:IfPinetrest}<a href="{text:Pinterest url}"><i class="fa fa-pinetrest"></a>{/block:IfPinetrest}
  1218. {block:IfGoogleplus}<a href="{text:Googleplus url}"><i class="fa fa-google-plus"></i></a>{/block:IfGoogleplus}
  1219. </div>
  1220.  
  1221. </div>
  1222. </div>
  1223.  
  1224. <!-- -------------------------- TAB 4 -------------------------- -->
  1225.  
  1226. <div id="tab4" class="tab">
  1227. <div class="tabcontent">
  1228. <div style="margin-left:0px;">
  1229. <table id="all" border="0" cellpadding="0" cellspacing="0">
  1230.  
  1231. <td><div id="grouptitle"><big>Group</div>
  1232. <div id="grouplinks">
  1233.  
  1234. <a href="/">Link</a>
  1235.  
  1236. <a href="/">Link</a>
  1237.  
  1238. <a href="/">Link</a>
  1239.  
  1240. <a href="/">Link</a>
  1241.  
  1242. <a href="/">Link</a>
  1243.  
  1244. </div></td>
  1245.  
  1246.  
  1247. <td><div id="grouptitle"><big>Group</div>
  1248. <div id="grouplinks">
  1249.  
  1250. <a href="/">Link</a>
  1251.  
  1252. <a href="/">Link</a>
  1253.  
  1254. <a href="/">Link</a>
  1255.  
  1256. <a href="/">Link</a>
  1257.  
  1258. <a href="/">Link</a>
  1259.  
  1260. </div></td>
  1261.  
  1262. <td><div id="grouptitle"><big>Group</div>
  1263. <div id="grouplinks">
  1264.  
  1265. <a href="/">Link</a>
  1266.  
  1267. <a href="/">Link</a>
  1268.  
  1269. <a href="/">Link</a>
  1270.  
  1271. <a href="/">Link</a>
  1272.  
  1273. <a href="/">Link</a>
  1274.  
  1275. </div></td>
  1276.  
  1277. <tr>
  1278.  
  1279. <td><div id="grouptitle"><big>Group</div>
  1280. <div id="grouplinks">
  1281.  
  1282. <a href="/">Link</a>
  1283.  
  1284. <a href="/">Link</a>
  1285.  
  1286. <a href="/">Link</a>
  1287.  
  1288. <a href="/">Link</a>
  1289.  
  1290. <a href="/">Link</a>
  1291.  
  1292. </div></td>
  1293.  
  1294.  
  1295. <td><div id="grouptitle"><big>Group</div>
  1296. <div id="grouplinks">
  1297.  
  1298. <a href="/">Link</a>
  1299.  
  1300. <a href="/">Link</a>
  1301.  
  1302. <a href="/">Link</a>
  1303.  
  1304. <a href="/">Link</a>
  1305.  
  1306. <a href="/">Link</a>
  1307.  
  1308. </div></td>
  1309.  
  1310. <td><div id="grouptitle"><big>Group</div>
  1311. <div id="grouplinks">
  1312.  
  1313. <a href="/">Link</a>
  1314.  
  1315. <a href="/">Link</a>
  1316.  
  1317. <a href="/">Link</a>
  1318.  
  1319. <a href="/">Link</a>
  1320.  
  1321. <a href="/">Link</a>
  1322.  
  1323. </div></td>
  1324.  
  1325. <tr>
  1326.  
  1327. </table>
  1328. </div>
  1329.  
  1330. </div>
  1331.  
  1332. </div>
  1333.  
  1334. <!-- -------------------------- TAB 5 -------------------------- -->
  1335.  
  1336. <div id="tab5" class="tab">
  1337. <div class="tabcontent"><br>
  1338. <div class="blogroll">
  1339. {block:Following}
  1340. {block:Followed}
  1341. <a target="_blank" href="{FollowedURL}" title="{FollowedName}">
  1342. <img src="{FollowedPortraitURL-96}" /></a>
  1343. {/block:Followed}
  1344. {/block:Following}
  1345. </div>
  1346. </div>
  1347. </div>
  1348.  
  1349. <!-- END OF TABS -->
  1350.  
  1351. </div>
  1352. </div>
  1353. </div>
  1354. </div>
  1355. </div>
  1356.  
  1357.  
  1358. <!-- TABS/ALL-INN-ONE SCRIPTS DO NOT REMOVE!!! -->
  1359.  
  1360. <script>
  1361. $(document).ready(function() {
  1362. $('.tabs .tab-links a').on('click', function(e) {
  1363. var currentAttrValue = $(this).attr('href');
  1364.  
  1365. // Show/Hide Tabs
  1366. $('.tabs ' + currentAttrValue).fadeIn(600).siblings().hide();
  1367.  
  1368. // Change/remove current tab to active
  1369. $(this).parent('li').addClass('active').siblings().removeClass('active');
  1370.  
  1371. e.preventDefault();
  1372. });
  1373. });
  1374. </script>
  1375.  
  1376. <script>
  1377. $(document).ready(function() {
  1378. $('#filterOptions li a').click(function() {
  1379. // fetch the class of the clicked item
  1380. var ourClass = $(this).attr('class');
  1381.  
  1382. // reset the active class on all the buttons
  1383. $('#filterOptions li').removeClass('active');
  1384. // update the active state on our clicked button
  1385. $(this).parent().addClass('active');
  1386.  
  1387. if(ourClass == 'all') {
  1388. // show all our items
  1389. $('#ourHolder').children('div.item').show();
  1390. }
  1391. else {
  1392. // hide all elements that don't share ourClass
  1393. $('#ourHolder').children('div:not(.' + ourClass + ')').hide();
  1394. // show all elements that do share ourClass
  1395. $('#ourHolder').children('div.' + ourClass).show();
  1396. }
  1397. return false;
  1398. });
  1399. });
  1400. </script>
  1401.  
  1402.  
  1403. {block:IfShowSearch}
  1404. <div id="search">
  1405. <div class="search-icon">
  1406. <i class="fa fa-search fa"></i>
  1407. </div>
  1408. <form action="/search" method="get">
  1409. <input type="text" name="q" value="Search..." style="width:110px; padding-left:10px; height:19px; border:1px solid transparent; background:transparent; color:{color:Sidebar text}; font-size: 12px;margin-top:5px; margin-left:25px;"/>
  1410. </form>
  1411. </div>
  1412. {/block:IfShowSearch}
  1413. <!--Search bar ends-->
  1414.  
  1415. {block:IfShowMusicPlayer}
  1416.  
  1417. <div id="musicplayer">
  1418.  
  1419. <div id="music">
  1420. <center>
  1421.  
  1422. <!--Replace this part with your billy music player code-->
  1423. <embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=false&f0=http://www.sheepproductions.com/mfc/done.mp3&t0=Done&f1=http://www.sheepproductions.com/mfc/justified.mp3&t1=Justified&f2=http://www.sheepproductions.com/mfc/shesaid.mp3&t2=She Said&total=3" quality="high" wmode="transparent" width="200" height="10" name="billy" align="middle" type="application/x-shockwave-flash" />
  1424. <!---->
  1425.  
  1426. </center>
  1427.  
  1428. </div>
  1429.  
  1430. <div id="musicicon"><br>
  1431. <img src="http://media.tumblr.com/tumblr_m7w2izzY0j1r6o8v2.gif">
  1432. </div>
  1433.  
  1434. </div>
  1435.  
  1436. {/block:IfShowMusicPlayer}
  1437.  
  1438. {block:IfShowNavigationIcons}
  1439. <div class="icons">
  1440. <a href="/ask" title="Ask"><i class="fa fa-envelope"></i></a>
  1441. <a href="/submit" title="Submit"><i class="fa fa-pencil"></i></a>
  1442. <a href="/archive" title="Archive"><i class="fa fa-clock-o"></i></a>
  1443. </div>
  1444. {/block:IfShowNavigationIcons}
  1445.  
  1446. <a href="http://borntobewildthemes.tumblr.com" title="theme ENJOY THE RIDE by borntobewildthemes"><div id="credits">
  1447. <img src="http://i57.tinypic.com/301g6eg.jpg"></div></a>
  1448.  
  1449. </body>
  1450. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement