Advertisement
septaaa

05. Belong to sea theme

Mar 15th, 2014
3,018
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.82 KB | None | 0 0
  1. <!--
  2.  
  3. oOo oOo. o o .o.oo. oOo. Oo Ooo.
  4. 0 0 0 0 0 0 00 0 0 00 0 0
  5. 0 0 0 0 0 0 00 0 0 00 0 0
  6. 0 0 ooo' 0 0 00 ooo' 00 ooo'
  7. 0 0 0 0 0 00 0 00 0
  8. o00 0 0o0 00 0 00 0o.
  9. 05. belong to sea theme by septa (opurple@tumblr)
  10. DO NOT CROP CREDIT. but feel free to twinked (as long as you let the credit stay)
  11. //opurple.tumblr.com//
  12.  
  13.  
  14.  
  15. END
  16.  
  17. THEMES BY SEPTAAA
  18.  
  19. -->
  20.  
  21.  
  22.  
  23. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  24. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  25. <head><title>{Title}</title>
  26. <link rel="shortcut icon" href="{Favicon}">
  27. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  28. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  29.  
  30. <script src="http://static.tumblr.com/whx9ghv/lq0m3ktlh/modernizr.custom.34978.js"></script>
  31. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  32. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  33. <script>
  34. (function($){
  35. $(document).ready(function(){
  36. $("[title]").style_my_tooltips();
  37. });
  38. })(jQuery);
  39. </script>
  40.  
  41. <meta name="color:Background" content="#ffffff"/>
  42. <meta name="color:Text" content="#838282"/>
  43. <meta name="color:title" content="#ade2f2" />
  44. <meta name="color:title hover" content="729bc8" />
  45. <meta name="color:Link" content="#91bbe8"/>
  46. <meta name="color:linkhover" content="#4b83bf"/>
  47. <meta name="color:description text" content="#777777" />
  48. <meta name="color:description bg"content="#deeaf8" />
  49. <meta name="color:bold" content="#cecece" />
  50. <meta name="color:border" content="#c7d7e8" />
  51. <meta name="color:border post" content="#e6f2f5"/>
  52. <meta name="color:info" content="#f2f2f2" />
  53. <meta name="color:asker bg" content="#f5f5f5">
  54. <meta name="color:Scrollbar" content="#91dcd9" />
  55. <meta name="color:smtooltip" content="#fff"/>
  56. <meta name="color:smtooltip bg" content="#ade2f2"/>
  57.  
  58. <meta name="if:250px" content="0"/>
  59. <meta name="if:400px" content="0"/>
  60. <meta name="if:500px" content="1"/>
  61. <meta name="if:infiniteScroll" content="0"/>
  62. <meta name="if:Show Caption" content="0"/>
  63. <meta name="if:fade" content="0">
  64. <meta name="if:fadehover" content="0">
  65. <meta name="if:tinycursor" content="1" />
  66. <meta name="if:monochrome" content="0" />
  67. <meta name="if:notshowtitle" content="1"/>
  68. <meta name="if:showtags" content="0"/>
  69.  
  70. <meta name="image:sidebg" content=""/>
  71.  
  72. <meta name="text:title font size" content="40px" />
  73. <meta name="text:link 3 title" content="Link 3"/>
  74. <meta name="text:link 3" content="Link 3"/>
  75. <meta name="text:link 3 url" content="/"/>
  76. <meta name="text:link 4 title" content="Link 4"/>
  77. <meta name="text:link 4" content="Link 4"/>
  78. <meta name="text:link 4 url" content="/"/>
  79. <meta name="text:link 5 title" content="Link 5"/>
  80. <meta name="text:link 5" content="Link 5"/>
  81. <meta name="text:link 5 url" content="/"/>
  82.  
  83. <link href='http://fonts.googleapis.com/css?family=Parisienne' rel='stylesheet' type='text/css'>
  84.  
  85.  
  86.  
  87. <style type="text/css">
  88.  
  89. #s-m-t-tooltip {
  90. display: block;
  91. background: {color:smtooltip bg};
  92. font-size: 11px;
  93. font-family: calibri;
  94. letter-spacing: 1px;
  95. text-transform: lowercase;
  96. color: {color:smtooltip};
  97. text-align: center;
  98. margin-left: 18px;
  99. padding:5px 5px;
  100. border: 1px solid #fff;
  101. min-width: 40px;
  102. max-width: 200px;
  103. z-index: 99999;
  104. }
  105.  
  106. iframe#tumblr_controls {right:3px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  107.  
  108. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: 1;-webkit-transition: all 0.5s ease-out;-moz-transition: all 0.5s ease-out;transition: all 0.5s ease-out;}
  109.  
  110.  
  111. ::-webkit-scrollbar-thumb:vertical {background-color: {color:scrollbar}; }
  112. ::-webkit-scrollbar-thumb:horizontal {background-color: {color:scrollbar}; height:10px!important;}
  113. ::-webkit-scrollbar {background-color: {color:background}; height:10px; width: 7px;}
  114.  
  115.  
  116. {block:iffade}
  117. img {
  118. opacity:.75;
  119. transition:0.4s; -o-transition-transition:0.4s; -webkit-transition-duration:0.4s; -moz-transition-duration:0.4s;
  120. }
  121.  
  122. img:hover {
  123. opacity:1;
  124. transition:0.4s; -o-transition-transition:0.4s; -webkit-transition-duration:0.4s; -moz-transition-duration:0.4s;
  125. }
  126. {/block:iffade}
  127.  
  128.  
  129. {block:iffadehover}
  130. img {
  131. opacity:1;
  132. transition:0.4s; -o-transition-transition:0.4s; -webkit-transition-duration:0.4s; -moz-transition-duration:0.4s;
  133. }
  134.  
  135. img:hover {
  136. opacity:.75;
  137. transition:0.4s; -o-transition-transition:0.4s; -webkit-transition-duration:0.4s; -moz-transition-duration:0.4s;
  138. }
  139. {/block:iffadehover}
  140.  
  141.  
  142. {block:iftinycursor}
  143.  
  144. body, a, a:hover{
  145. cursor: url('http://cur.cursors-4u.net/others/oth-6/oth589.cur'), progress;
  146.  
  147. }
  148.  
  149.  
  150. {/block:iftinycursor}
  151.  
  152. body {
  153. background:{color:background};
  154. margin:0px;
  155. color:{color:text};
  156. font-family:helvetica, arial, sans-serif;
  157. letter-spacing:0px;
  158. font-size:10px;
  159. line-height:150%;
  160. }
  161.  
  162. a {
  163. color:{color:link};
  164. text-decoration: none;
  165. }
  166.  
  167. a:hover {
  168. color:{color:linkhover};
  169. transition-duration: 0.9s;
  170. -moz-transition-duration: 0.9s;
  171. -webkit-transition-duration: 0.9s;
  172. -o-transition-duration: 0.9s;
  173.  
  174.  
  175. }
  176.  
  177. img {
  178. border:none;
  179. }
  180.  
  181. blockquote {
  182. padding-left:5px;
  183. border-left:2px solid;
  184. }
  185.  
  186. blockquote blockquote {
  187. padding-left:5px;
  188. border-left:2px solid;
  189. }
  190.  
  191. h1 {
  192. font-size:15px;
  193. }
  194.  
  195. b, strong {
  196. color:{color:bold};
  197. font-weight:bold;
  198. }
  199.  
  200.  
  201. #entries {
  202. {block:if250px}
  203. margin-left:600px;
  204. {/block:if250px}
  205. padding:10px;
  206. {block:if400px}
  207. margin-left:550px;
  208. {/block:if400px}
  209. {block:if500px}
  210. margin-left:550px;
  211. {/block:if500px}
  212. margin-top:30px;
  213.  
  214. }
  215.  
  216. #post {
  217. {block:if250px}
  218. width:250px;
  219. {/block:if250px}
  220. {block:if400px}
  221. width:400px;
  222. {/block:if400px}
  223. {block:if500px}
  224. width:500px;
  225. {/block:if500px}
  226. padding-bottom:20px;
  227. margin-bottom:30px;
  228. border:2px solid{color:border post};
  229. background:#fff;
  230. padding:20px;
  231. {block:ifmonochrome}
  232. -webkit-filter:grayscale(100%);
  233. -webkit-transition: all 0.6s ease-in-out;
  234. {/block:ifmonochrome}/*monochrome hanya aktif/bisa berjalan hanya di google chrome dan lainnya tidak bisa*/
  235. }
  236. #post:hover {
  237. {block:ifmonochrome}
  238. -webkit-filter:grayscale(1%);
  239. -webkit-transition: all 0.6s ease-in-out;
  240. {/block:ifmonochrome} /*on firefox only*/
  241. }
  242.  
  243. #photo {
  244. {block:if250px}
  245. width:250px;
  246. {/block:if250px}
  247. {block:if400px}
  248. width:400px;
  249. {/block:if400px}
  250. {block:if500px}
  251. width:500px;
  252. {/block:if500px}
  253. }
  254. #photo img {
  255. {block:if250px}
  256. width:250px;
  257. {/block:if250px}
  258. {block:if400px}
  259. width:400px;
  260. {/block:if400px}
  261. {block:if500px}
  262. width:500px;
  263. {/block:if500px}
  264. }
  265. #photoset {
  266. {block:if250px}
  267. width:250px;
  268. {Photoset-250}
  269. {/block:if250px}
  270. {block:if400px}
  271. width:400px;
  272. {Photoset-400}
  273. {/block:if400px}
  274. {block:if500px}
  275. width:500px;
  276. {Photoset-500}
  277. {/block:if500px}
  278.  
  279. }
  280.  
  281. #photoset img {
  282. {block:if250px}
  283. width:250px;
  284. {Photoset-250}
  285. {/block:if250px}
  286. {block:if400px}
  287. width:400px;
  288. {Photoset-400}
  289. {/block:if400px}
  290. {block:if500px}
  291. width:500px;
  292. {Photoset-500}
  293. {/block:if500px}
  294.  
  295. }
  296. #gambarku {
  297. width:300px;
  298. height:auto;
  299. bottom:20px;
  300. position:fixed;
  301. left:20px;
  302. opacity:.9;
  303. }
  304. #sidebar {
  305. width:150px;
  306. height:100%;
  307. position:fixed;
  308. padding-top:300px;
  309. padding-right:40px;
  310. border-right:1px solid{color:border};
  311. left:320px;
  312. top:0px;
  313. {block:ifmonochrome}
  314. -webkit-filter:grayscale(100%);
  315. -webkit-transition: all 0.6s ease-in-out;
  316. {/block:ifmonochrome}/*monochrome hanya aktif/bisa berjalan hanya di google chrome dan lainnya tidak bisa*/
  317. }
  318. #sidebar:hover{
  319. {block:ifmonochrome}
  320. -webkit-filter:grayscale(1%);
  321. -webkit-transition: all 0.6s ease-in-out;
  322. {/block:ifmonochrome} /*on firefox only*/
  323. }
  324. #title{
  325. width:150px;
  326. font-family:'Parisienne', cursive;
  327. text-align:right;
  328. font-size:{text:title font size};
  329. margin-top:30px;
  330. margin-left:20px;
  331. letter-spacing:-2px;
  332. font-weight: bold;
  333. border-bottom:3px dashed{color:title hover};
  334. position:absolute;
  335. padding-right:15px;
  336.  
  337. }
  338. #title a{
  339. width:150px;
  340. line-height:80%;
  341. color:{color:title};
  342. text-shadow: 1px 0 .1px #335555, 0px 0 .2px #ccc;
  343. -webkit-transition: all 0.7s ease-in;
  344. -moz-transition: all 0.7s ease;
  345. -o-transition: all 0.7s ease-in;
  346.  
  347. }
  348.  
  349. #title a:hover{
  350. color:{color:title hover};text-shadow: 25px 0 .25px transparent, -25px 0 .25px transparent;
  351. -webkit-transition: all 0.4s ease;
  352. -moz-transition: all 0.4s ease;
  353. -o-transition: all 0.4s ease;
  354. }
  355.  
  356.  
  357.  
  358.  
  359. #links {
  360. margin-top:0px;
  361. margin-left:20px;
  362. width:150px;
  363. font-size:10px;
  364. text-align:right;
  365. font-family:helvetica;
  366. text-transform:lowercase;
  367. letter-spacing:0px;
  368.  
  369. }
  370.  
  371. #links a {
  372. background:{color:bg link};
  373. padding:2px;
  374. color:{color:link};
  375. margin-top:0px;
  376. transition-duration: 0.9s; -moz-transition-duration: 0.9s; -webkit-transition-duration: 0.9s; -o-transition-duration: 0.9s;
  377. }
  378.  
  379. #links a:hover {
  380. text-decoration:none;
  381. color: {color:linkhover};
  382. transition-duration: 0.9s;
  383. -moz-transition-duration: 0.9s; -webkit-transition-duration: 0.9s; -o-transition-duration: 0.9s;
  384.  
  385.  
  386. }
  387.  
  388. #description {
  389. width:150px;
  390. font-size:11px;
  391. font-family:arial;
  392. letter-spacing:0px;
  393. margin-left:10px;
  394. color:{color:description text};
  395. text-align:center;
  396. line-height:100%;
  397. margin-top:10px;
  398. text-align:justify;
  399. background:{color:description bg};
  400. border-top:3px dashed{color:border};
  401. opacity:.8;
  402. padding:15px;
  403.  
  404. }
  405.  
  406. #pagination {
  407. padding:10px 30px 10px 30px;
  408. {block:if250px}
  409. width:250px;
  410. {/block:if250px}
  411. {block:if400px}
  412. width:400px;
  413. {/block:if400px}
  414. {block:if500px}
  415. width:500px;
  416. {/block:if500px}
  417. {block:if250px}
  418. margin-left:600px;
  419. {/block:if250px}
  420. {block:if400px}
  421. margin-left:550px;
  422. {/block:if400px}
  423. {block:if500px}
  424. margin-left:550px;
  425. {/block:if500px}
  426. bottom:0px;
  427. position:fixed;
  428. font-size:12px;
  429. background:#fff;
  430. opacity:.8;
  431. text-transform:uppercase;
  432. text-align:center;
  433.  
  434. }
  435.  
  436. #info {
  437. {block:if250px}
  438. width:240px;
  439. {/block:if250px}
  440. {block:if400px}
  441. width:390px;
  442. {/block:if400px}
  443. {block:if500px}
  444. width:490px;
  445. {/block:if500px}
  446. padding:5px;
  447. {block:if250px}
  448. font-size:8px;
  449. {/block:if250px}
  450. font-size:10px;
  451. color:{color:link};
  452. margin-top:10px;
  453. margin-bottom:5px;
  454. text-transform:uppercase;
  455. letter-spacing:1px;
  456. font-style:italic;
  457. text-align:center;
  458. background:{color:info};
  459. padding-top:10px;
  460. padding-bottom:10px;
  461.  
  462. }
  463.  
  464. /*Ada beberapa bagian yang sensitif, jika ingin mengubah mungkin bisa merusak bagan. jadi hati-hati^^
  465. There are some parts that are sensitive, if you want to change the chart may be damaging. so be careful^^*/
  466.  
  467. #question {
  468. padding:5px;
  469. margin-left:6px;
  470. text-align:center;
  471. color:{color:text};
  472. line-height:150%;
  473. background-color:{color:asker bg};
  474. }
  475.  
  476. #question-image img {
  477. width:20px;
  478. height:20px;
  479. margin-left:6px;
  480. margin-bottom:0px;
  481. text-align:center;
  482. padding:5px;
  483. background-color:{color:asker bg};
  484. border:1px solid {color:border};
  485. border-radius:90%;
  486. }
  487.  
  488. #answer {
  489. text-align:center;
  490. padding:10px;
  491. color:{color:text};
  492. }
  493.  
  494. #quote {
  495. font-family:'times new roman';
  496. font-size: 20px;
  497. letter-spacing:-1px;
  498. font-style:italic;
  499. text-align:center;
  500. line-height: 108%;
  501. }
  502.  
  503. #tags {
  504. margin-top:10px;
  505. font-size:8px;
  506. text-align:right;
  507. letter-spacing:1px;
  508. padding:2px;
  509.  
  510.  
  511. }
  512.  
  513.  
  514.  
  515. #opurple {
  516. position:fixed;
  517. bottom:5px;
  518. right:15px;
  519. font-size:8px;
  520. padding:5px;
  521. text-transform:uppercase;
  522. color:{color:link};
  523. background:{color:border};
  524. border:1px solid {color:border}; padding: 2px 3px 2px 3px;}
  525. #opurple:hover {
  526. color:{color:linkhover};
  527. text-decoration:underline;
  528. transition-duration: 0.9s;
  529. -moz-transition-duration: 0.9s; -webkit-transition-duration: 0.9s; -o-transition-duration: 0.9s;
  530.  
  531. }
  532.  
  533. #date {
  534. text-align:right;
  535. display:inline-block; padding: 2px 10px 3px;
  536. background:{color:info};
  537. }
  538.  
  539.  
  540. {CustomCSS}
  541. #scrollToTop:link,
  542. #scrollToTop:visited {
  543. display: none;
  544. position: fixed;
  545. bottom: 10px;
  546. right: 35px;
  547. font-size:30px;
  548. }
  549.  
  550. </style>
  551.  
  552.  
  553. {block:ifInfiniteScroll}
  554. <script type="text/javascript" src="http://codysherman.tumblr.com/tools/infinite-scrolling/code"></script>{/block:ifInfiniteScroll}
  555.  
  556. </head>
  557.  
  558. <body>
  559.  
  560.  
  561. <div id="sidebar">
  562.  
  563. <div id="links">
  564. <a href="/" title="home">home</a>
  565. <a href="/ask" title="message">ask</a>
  566. <a href="{text:link 3 url}" title="{text:link 3}">{text:link 3 title}</a>
  567. <a href="{text:link 4 url}" title="{text:link 4}">{text:link 4 title}</a>
  568. <a href="{text:link 5 url}" title="{text:link 5}">{text:link 5 title}</a>
  569. </div>
  570. <div id="description">{Description}</div>
  571. <div id="title">{block:ifnotshowtitle}<a href="/">{title}</a>{/block:ifnotshowtitle}</div></div>
  572.  
  573. {block:ifnotInfiniteScroll}
  574. {block:indexpage}<div id="pagination"> {block:PreviousPage}
  575. <a href="{PreviousPage}">less —</a>
  576. {/block:PreviousPage}
  577. {CurrentPage} of {TotalPages}
  578. {block:NextPage}
  579. <a href="{NextPage}">— more</a>
  580. {/block:NextPage}</div>
  581. {/block:indexpage}
  582. {/block:ifnotInfiniteScroll}
  583.  
  584. {block:ifInfiniteScroll}
  585. <!--source back to top to tumbling.net-->
  586. <script type="text/javascript" src="http://static.tumblr.com/ikeq9mi/DfYl6o46t/scrolltotop.min.js"></script>
  587. <a href="javascript:;" id="scrollToTop" rel="nofollow" title="Go to Top">▲</a>
  588. {/block:ifInfiniteScroll}
  589.  
  590. <!--APAPUN kalian boleh mengedit tema saya. tapi sekali lagi, JANGAN HAPUS KODE DIBAWAH INI!PENTING
  591. EVERYTHING you could twinked my theme. but once again, PLEASE DO NOT CROP THIS CODE BELOW!IMPORTANT!!!-->
  592.  
  593. <div id="opurple"><a href="http://opurple.tumblr.com" title="theme by opurple"> o p </a></div>
  594.  
  595.  
  596. <div id="gambarku"><img style="width:300px; height:auto;" alt="" src="{image:sidebg}"/></div>
  597.  
  598. <Div class = "autopagerize_page_element">
  599. <div id="entries">{block:Posts}<div id="post">
  600.  
  601. {block:Text}<p style="font-family:cambria; text-align:center; font-size:25px; border-bottom:2px solid{color:border post}; margin-top:-10px; line-height:100%; letter-spacing:0px;">{block:Title}{Title}{/block:Title}</p>{Body}{/block:Text}
  602.  
  603. <div id="photo">
  604. {block:Photo}{LinkOpenTag}<img src="{PhotoURL-500}">{LinkCloseTag}{/block:Photo} </div>
  605. <div id="photoset">
  606. {block:Photoset}{Photoset}{/block:Photoset}{/block:indexpage}{/block:Photoset}
  607. </div>
  608.  
  609. {block:Quote}
  610. <div id="quote">❝ {Quote} ❞<br><small><small><p style="text-align:right;">—{Source}</small></small></p></div>
  611. {/block:Quote}
  612.  
  613. {block:Link}<p style="font-family:cambria; text-align:center; font-size:25px; border-bottom:2px solid{color:border post}; margin-top:-10px; line-height:100%; letter-spacing:0px;"><a href="{URL}" {Target}>{Name}</a></p>{block:Description}{Description}{/block:Description}{/block:Link}
  614.  
  615. {block:Chat}<p style="font-family:cambria; text-align:center; font-size:25px; border-bottom:2px solid{color:border post}; margin-top:-10px; line-height:100%; letter-spacing:0px;">{block:Title}{Title}</center>{/block:Title}</p>{block:Lines}{block:Label}<b>{Label}</b>{/block:Label} {Line}<br>{/block:Lines}{/block:Chat}
  616.  
  617. {block:Audio}{AudioPlayerWhite}{/block:Audio}
  618.  
  619. {block:Video}
  620. {block:IndexPage}{block:If400px}{video-400}{/block:If400px}{block:If250px}{video-250}{/block:If250px}{block:If500px}{video-500}{/block:If500px}{/block:IndexPage}{/block:Video}
  621.  
  622. {block:Answer}<div id="question"><div id="question-image"><img src="{AskerPortraitURL-16}"></div> {Asker}: {Question}</div><div id="answer">{Answer}</div>{/block:answer}
  623.  
  624.  
  625. {block:IfShowCaption}{block:Caption}<div style="margin-top:5px; padding:10px; font-size:12px; ">{Caption}</div>{/block:Caption}{/block:IfShowCaption}
  626.  
  627. {block:IfNotShowCaption}{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{block:PermalinkPage}{/block:IfNotShowCaption}{/block:Photo}
  628.  
  629. {block:Date}<div id="info"><div id="date">{ShortMonth}-{DayOfMonthWithZero}</div> <a href="{Permalink}">{24Hour}:{Minutes}</a>{block:NoteCount} <a href="{Permalink}" title="{notecountwithlabel}">{NoteCount}</a>{/block:NoteCount}{block:RebloggedFrom} <a href="{ReblogParentURL}">VIA</a>{/block:RebloggedFrom}
  630. {block:ContentSource} <a href="{SourceURL}">ORI</a>{/block:ContentSource} <a href="{ReblogURL}" title="reblog" target=_blank class=details>reblog</a></div>{/block:Date}
  631. {block:HasTags}
  632. <div id="tags">
  633. {block:Tags}{block:ifshowtags}<a href="{TagURL}"> {Tag},</a>{/block:ifshowtags}{/block:Tags}</div>
  634. {/block:HasTags}
  635. {block:PostNotes}{PostNotes}{/block:PostNotes}
  636. </div>
  637.  
  638. {/block:Posts}
  639. </Div>
  640.  
  641. <!-- HOPE YOU LIKE MY WORK!!^^ -->
  642.  
  643. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement