Advertisement
toukenx3

#Theme 4 by killuaxx // updated version

Oct 21st, 2015
5,499
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 30.29 KB | None
  1. <!-- Theme made by killuaxx ( http://killuaxx.tumblr.com/ )-->
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  4. <html>
  5. <head>    
  6.  
  7. <title> {Title} {block:PostTitle} - {PostTitle} {/block:PostTitle} </title>
  8.  
  9. <link rel="shortcut icon" href="{Favicon}" />
  10.  
  11. <link href="https://netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet">
  12.  
  13. <link href='https://fonts.googleapis.com/css?family=Raleway:400,300,100' rel='stylesheet' type='text/css'>    
  14.  
  15. <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.0.min.js"></script>
  16.  
  17. <link rel="stylesheet" type="text/css" href="http://static.tumblr.com/ssbvfru/3yXnvjgmo/tooltipster.css" />
  18.  
  19.  
  20. <meta name="text:Sidebar Title" content="Suspendisse eget imperdiet arcu."/>
  21. <meta name="text:About Me Title" content="✘ about me"/>
  22. <meta name="text:Link 1" content="" />
  23. <meta name="text:Link 1 Name" content="" />
  24. <meta name="text:Link 2" content="" />
  25. <meta name="text:Link 2 Name" content="" />
  26. <meta name="text:Link 3" content="" />
  27. <meta name="text:Link 3 Name" content="" />
  28. <meta name="text:Link 4" content="" />
  29. <meta name="text:Link 4 Name" content="" />
  30.  
  31. <meta name="if:1 Column" content="0"/>
  32. <meta name="if:2 Columns" content="1"/>
  33. <meta name="if:Grayscale Icon" content="0"/>
  34. <meta name="if:Grayscale Posts" content="1"/>
  35. <meta name="if:About Me Title" content="1"/>  
  36. <meta name="if:Description" content="1"/>  
  37. <meta name="if:Post Borders" content="0"/>  
  38.  
  39. <meta name="image:Icon" content="http://i.imgur.com/Upz1Lzl.jpg"/>
  40. <meta name="image:Background" content=""/>
  41. <meta name="image:Post Box Background" content=""/>
  42.  
  43. <meta name="color:Background" content="#313131"/>
  44. <meta name="color:Main Colour 1" content="#00a9ec"/>
  45. <meta name="color:Main Colour 2" content="#ed9b01"/>
  46. <meta name="color:Text" content="#2b2b2b"/>
  47. <meta name="color:Icon Border" content="#FFFFFF"/>
  48. <meta name="color:Top Navigation Text" content="#e8e8e8"/>
  49. <meta name="color:Sidebar Text" content="#e8e8e8"/>
  50. <meta name="color:Sidebar Links" content="#e8e8e8"/>
  51. <meta name="color:Sidebar Links on Hover" content="#e8e8e8"/>
  52. <meta name="color:A Link" content="#00a9ec"/>
  53. <meta name="color:A Link on Hover" content="#7bdbff"/>
  54. <meta name="color:Post Box Background" content="#FFFFFF"/>
  55. <meta name="color:Post Info" content="#aeaeae"/>
  56. <meta name="color:Post Title Background" content="#efefef"/>
  57. <meta name="color:Post Title Border" content="#c0c0c0"/>
  58. <meta name="color:Ask Background" content="#efefef"/>
  59. <meta name="color:Ask Border" content="#c0c0c0"/>
  60. <meta name="color:Pagination Text" content="#e8e8e8"/>
  61. <meta name="color:Pagination Background on Hover" content="#353534"/>
  62. <meta name="color:Pagination Current Text" content="#FFFFFF"/>
  63. <meta name="color:Pagination Current Text Background" content="#3c3c3c"/>
  64. <meta name="color:Scrollbar" content="#535353"/>
  65. <meta name="color:Tooltip Text" content="#efefef"/>
  66. <meta name="color:Tooltip Background" content="#1b1b1b"/>
  67. <meta name="color:Post Border" content="#555555
  68. "/>
  69.  
  70. <meta name="font:Main Font" content="Arial, Helvetica, sans-serif"/>
  71. <meta name="font:Post Info" content="'Raleway', sans-serif"/>
  72.  
  73.  
  74. <style>
  75.  
  76.  
  77. ::-webkit-scrollbar {
  78. width: 4px;
  79. margin:0px;
  80. padding:0px;
  81. height: 1px;
  82. }
  83.  
  84.  
  85. ::-webkit-scrollbar-thumb {
  86. background-color:{color:Scrollbar};    
  87. -webkit-border-radius: 1ex;  
  88. }
  89.  
  90.  
  91. body {
  92. background: {color:Background} url('{image:Background}') fixed repeat;
  93. word-wrap: break-word;  
  94. }
  95.  
  96.  
  97. h1 {
  98. border-top: solid 1px {color:Post Title Border};
  99. background-color: {color:Post Title Background};
  100. font-family: {font:Main Font} ;
  101. margin-top:0px;
  102. text-align: center;
  103. color:{color:Text};
  104. font-weight:normal;
  105. margin-bottom:0px;
  106. padding-top:0px;
  107. padding-left:0px;
  108. padding-right:0px;
  109. text-transform:uppercase;
  110. padding-bottom:4px;
  111. font-size:24px;
  112. }
  113.  
  114.    
  115. h2 {
  116. font-family:  {font:Main Font};
  117. text-align: justify;
  118. color:{color:Text};  
  119. padding:0px;
  120. font-weight:normal;
  121. font-size:19px;
  122. margin-top: 5px;
  123. margin-bottom:8px;
  124. }
  125.  
  126.  
  127. .content img {
  128. transition:  .9s ease-out;
  129. -moz-transition:  .9s ease-out;
  130. -webkit-transition: .9s ease-out;
  131. -o-transition: .9s ease-out;
  132. max-width:100%;
  133. height:auto;
  134.  margin:6px 0px;
  135. text-align: center;
  136. margin-left:auto;
  137. margin-right:auto;
  138. }
  139.  
  140.  
  141. .content img:hover {
  142. transition:  .9s ease-out;
  143. -moz-transition:  .9s ease-out;
  144. -webkit-transition: .9s ease-out;
  145. -o-transition: .9s ease-out;
  146. }
  147.  
  148.  
  149. .side {
  150. position:fixed;
  151. left:23px;
  152. width:204px;
  153. height:400px;
  154. top:100px;
  155. z-index:8;
  156. }
  157.  
  158.  
  159. h3:first-letter {
  160. color:{color:Main Colour 2};
  161. text-align: justify;
  162. font-size: 27px;
  163. font-weight: normal;
  164. margin:0px;
  165. padding:0px;
  166. text-transform: uppercase;
  167. font-family: {font:Main Font} ;
  168. line-height: 12px;
  169. }
  170.  
  171.  
  172. h3 {
  173. color:{color:Sidebar Text};
  174. text-align: justify;
  175. font-size: 12px;
  176. font-weight: normal;
  177. text-transform: uppercase;
  178. margin:0 auto;
  179. padding:0px;
  180. line-height: 12px;
  181. width:178px;
  182. font-family: {font:Main Font};
  183. letter-spacing:2px;
  184. }
  185.  
  186.  
  187. .sideicon {
  188. transition:  .9s ease-out;
  189. -moz-transition:  .9s ease-out;
  190. -webkit-transition: .9s ease-out;
  191. -o-transition: .9s ease-out;
  192. width:170px;
  193. height:170px;
  194. padding:0px;
  195. border-radius: 10px;
  196. margin-top:8px;
  197. margin-bottom:10px;
  198. border: solid 4px {color:Icon Border} ;
  199. {block:IfGrayscaleIcon}
  200.  filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  201. -webkit-filter: grayscale(100%);
  202. filter: grayscale(100%);
  203. filter: gray;
  204. {/block:IfGrayscaleIcon}
  205. }
  206.  
  207.  
  208. .sideicon:hover {
  209. transition:  .9s ease-out;
  210. -moz-transition:  .9s ease-out;
  211. -webkit-transition: .9s ease-out;
  212. -o-transition: .9s ease-out;
  213. filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  214. -webkit-filter: grayscale(0%);
  215. filter: grayscale(0%);
  216. filter: gray;
  217. }
  218.  
  219.  
  220. .sideline1 {
  221. float:left;
  222. width:7px;
  223. margin-top:8px;
  224. margin-right:9px;
  225. background-color:{color:Main Colour 1};
  226. height:177px;
  227. border-radius: 10px;
  228. }
  229.  
  230.  
  231. .sideline2 {
  232. float:right;
  233. margin-top:8px;
  234. border-radius: 10px;
  235. width:7px;
  236. background-color:{color:Main Colour 1};
  237. height:177px;
  238. }
  239.  
  240.  
  241. .aboutme {
  242. color:{color:Sidebar Text};
  243. text-align: justify;
  244. margin-left:7px;
  245. font-size: 14px;
  246. padding-top:7px;
  247. width:179px;
  248. border-left:solid 5px {color:Main Colour 2};
  249. padding-left:10px;
  250. padding-bottom:5px;
  251. margin-bottom:3px;
  252. font-weight: normal;
  253. text-transform: uppercase;
  254. font-family: {font:Main Font} ;
  255. letter-spacing:2px;
  256. }
  257.  
  258.  
  259. .description {
  260. width:170px;
  261. margin:0 auto;
  262. color:{color:Sidebar Text};
  263. text-align: justify;
  264. font-size: 14px;
  265. font-weight: normal;
  266. padding:0px;
  267. font-family: {font:Main Font} ;
  268. letter-spacing:2px;
  269. max-height:146px;
  270. overflow-y:auto;
  271. margin-bottom:15px;
  272. }
  273.        
  274.  
  275. .over {
  276. position:fixed;
  277. height:130px;
  278. position: fixed;
  279. overflow:auto;
  280. background:inherit;
  281. top:0px;
  282. width:100%;
  283. left:0px;
  284. z-index:4;
  285. right:0px;
  286. }
  287.  
  288.  
  289. A:link.postinfo  {
  290. font-size: 8px;
  291. color:{color:Post Info};
  292. font-family:  {font:Post Info};  
  293. letter-spacing: 3px;
  294. text-transform: uppercase;
  295. text-align: right;
  296. transition:  .8s ease-in;
  297. -moz-transition:  .8s ease-in;
  298. -webkit-transition: .8s ease-in;
  299. -o-transition: .8s ease-in;
  300. }
  301.  
  302.  
  303. A:visited.postinfo {
  304. color:{color:Post Info};
  305. text-decoration:none;
  306. }
  307.  
  308.  
  309. A:hover.postinfo {
  310. transition:  .4s ease-in;
  311. -moz-transition:  .4s ease-in;
  312. -webkit-transition: .4s ease-in;
  313. -o-transition: .4s ease-in;
  314. cursor:help;
  315. color:{color:Post Info};
  316. text-decoration:none;
  317. padding-left:10px;
  318. -webkit-border-radius: 3px;
  319. -moz-border-radius: 3px;
  320. border-radius: 3px;
  321. border-left:solid 10px {color:Main Colour 2};
  322. }
  323.  
  324.  
  325. A.active.postinfo {
  326. color:{color:Post Info};
  327. text-decoration:none;
  328. }
  329.  
  330.  
  331. .nav {
  332. width:170px;
  333. margin-left:auto;
  334. margin-right:auto;
  335. }
  336.  
  337. {block:If2Columns}
  338.  
  339. .pagination {
  340. width:80px;
  341. display:block;  
  342. z-index:9;
  343. position:fixed;
  344. top:311px;
  345. left:1170px;
  346. }
  347.  
  348.  
  349. .containbox {
  350. width:440px;
  351. overflow:hidden;
  352. margin:0px;
  353. padding:0px;
  354. float:left;
  355. }
  356.  
  357.  
  358. .container {
  359. position: absolute;
  360. top:130px;  
  361. z-index:3;
  362. overflow:hidden;
  363. width:890px;
  364. left:270px;
  365. padding-bottom:30px !important;
  366. text-align:justify;
  367. }
  368.  
  369. {/block:If2Columns}
  370.  
  371. {block:If1Column}
  372.  
  373. .container {
  374. position: absolute;
  375. top:130px;  
  376. z-index:3;
  377. overflow:hidden;
  378. width:420px;
  379. padding-bottom:30px;
  380. left:277px;
  381. text-align:justify;
  382. }
  383.  
  384.  
  385. .pagination {
  386. width:80px;
  387. display:block;  
  388. z-index:9;
  389. position:fixed;
  390. top:360px;
  391. left:740px;
  392. }
  393.  
  394.  
  395. .containbox {
  396. width:440px;
  397. overflow:hidden;
  398. margin:0px;
  399. padding:0px;
  400. }
  401.  
  402. {/block:If1Column}
  403.  
  404. .current_page {
  405.  transition:  .3s ease-in;
  406. -moz-transition:  .3s ease-in;
  407. -webkit-transition: .3s ease-in;
  408. -o-transition: .3s ease-in;
  409. display:block;
  410. padding:10px;
  411. color:{color:Pagination Current Text};
  412. width:40px;
  413. height:40px;
  414. margin-bottom:10px;
  415. text-align: center;
  416. font-size: 15px;
  417. font-weight: normal;
  418. font-family: {font:Main Font};
  419. text-transform: uppercase;
  420. border-radius: 28px 28px 28px 28px;
  421. -moz-border-radius: 28px 28px 28px 28px;
  422. -webkit-border-radius: 28px 28px 28px 28px;
  423. background-color:{color:Pagination Current Text Background};
  424. }
  425.  
  426.  
  427. A:link.jump_page {
  428.  transition:  .3s ease-in;
  429. -moz-transition:  .3s ease-in;
  430. -webkit-transition: .3s ease-in;
  431. -o-transition: .3s ease-in;
  432. display:block;
  433. padding:10px;
  434. color:{color:Pagination Text};
  435. width:40px;
  436. height:40px;
  437. margin-bottom:10px;
  438. text-align: center;
  439. font-size: 15px;
  440. font-weight: normal;
  441. font-family: {font:Main Font};
  442. text-decoration:none;
  443. text-transform: uppercase;
  444. border-radius: 28px 28px 28px 28px;
  445. -moz-border-radius: 28px 28px 28px 28px;
  446. -webkit-border-radius: 28px 28px 28px 28px;
  447. }
  448.  
  449.  
  450. A:visited.jump_page {
  451. color:{color:Pagination Text};
  452. text-decoration:none;
  453. }
  454.  
  455.  
  456. A:hover.jump_page{
  457. transition:  .1s ease-in;
  458. -moz-transition:  .1s ease-in;
  459. -webkit-transition: .1s ease-in;
  460. -o-transition: .1s ease-in;
  461. color:{color:Pagination Text};
  462. background-color:{color:Pagination Background on Hover};
  463. }
  464.  
  465.  
  466. A.active.jump_page {
  467. color:{color:Pagination Text};
  468. text-decoration:none;
  469. }
  470.  
  471.  
  472. A:link.page {
  473.  transition:  .3s ease-in;
  474. -moz-transition:  .3s ease-in;
  475. -webkit-transition: .3s ease-in;
  476. -o-transition: .3s ease-in;
  477. display:block;
  478. padding:10px;
  479. color:{color:Pagination Text};
  480. width:40px;
  481. height:40px;
  482. margin-bottom:10px;  
  483. text-align: center;
  484. font-size: 15px;
  485. font-weight: normal;
  486. font-family: {font:Main Font};
  487. text-decoration:none;
  488. text-transform: uppercase;
  489. border-radius: 28px 28px 28px 28px;
  490. -moz-border-radius: 28px 28px 28px 28px;
  491. -webkit-border-radius: 28px 28px 28px 28px;
  492. }
  493.  
  494.  
  495. A:visited.page {
  496. color:{color:Pagination Text};
  497. text-decoration:none;
  498. }
  499.  
  500.  
  501. A:hover.page{
  502. transition:  .1s ease-in;
  503. -moz-transition:  .1s ease-in;
  504. -webkit-transition: .1s ease-in;
  505. -o-transition: .1s ease-in;
  506. color:{color:Pagination Text};
  507. background-color:{color:Pagination Background on Hover};
  508. }
  509.  
  510.  
  511. A.active.page {
  512. color:{color:Pagination Text};
  513. text-decoration:none;
  514. }
  515.  
  516.  
  517. A:link.navi {
  518. transition:  .3s ease-in;
  519. -moz-transition:  .3s ease-in;
  520. -webkit-transition: .3s ease-in;
  521. -o-transition: .3s ease-in;
  522. display:block;
  523. color:{color:Sidebar Links};
  524. text-align: center;
  525. font-size: 13px;
  526. font-weight: normal;
  527. font-family: {font:Main Font};
  528. letter-spacing:4px;
  529. text-decoration:none;
  530. padding:7px 0px;
  531. text-transform: uppercase;
  532. margin-bottom:0px;
  533. }
  534.  
  535.  
  536. A:visited.navi {
  537. color:{color:Sidebar Links};
  538. text-decoration:none;
  539. }
  540.  
  541.  
  542. A:hover.navi {
  543. transition:  .7s ease-in;
  544. -moz-transition:  .7s ease-in;
  545. -webkit-transition: .7s ease-in;
  546. -o-transition: .7s ease-in;
  547. color:{color:Sidebar Links on Hover};
  548. letter-spacing: 7px;
  549. border-radius: 10px;
  550. background-color:{color:Main Colour 2};
  551. }
  552.  
  553.  
  554. A.active.navi {
  555. color:{color:Sidebar Links};
  556. text-decoration:none;
  557. }
  558.  
  559.  
  560. .mainnav {
  561. background-color:{color:Main Colour 1};
  562. position:fixed;
  563. top:0px;
  564. width:100%;
  565. left:0px;
  566. z-index:5;  
  567. }
  568.  
  569.  
  570. .tooltipster-default {
  571. border-bottom: solid 3px {color:Main Colour 1};
  572. border-radius: 5px;
  573. background: {color:Tooltip Background};
  574. color: {color:Tooltip Text} ;
  575. }
  576.  
  577.  
  578. .tooltipster-punk .tooltipster-content {
  579. font-family: {font:Main Font};
  580. font-size: 15px;
  581. line-height: 16px;
  582. padding: 8px 10px;
  583. }
  584.  
  585.  
  586. .tooltipster-default .tooltipster-content {
  587. font-family: {font:Main Font};
  588. text-transform:lowercase;
  589. font-size: 15px;
  590. line-height: 16px;
  591. text-align: left;
  592. max-width:200px;
  593. word-spacing: 9px;
  594. padding: 8px 10px;
  595. overflow: hidden;
  596. }
  597.  
  598.  
  599. .tooltipster-icon {
  600. cursor: help;
  601. margin-left: 4px;
  602. }
  603.  
  604.  
  605. a:link {
  606. color:{color:A Link};
  607. text-decoration:none;
  608. }
  609.  
  610.  
  611. a:visited {
  612. color:{color:A Link};
  613. text-decoration:none;
  614. }
  615.  
  616.  
  617. a:hover {
  618. transition:  .9s ease-out;
  619. -moz-transition:  .9s ease-out;
  620. -webkit-transition: .9s ease-out;
  621. -o-transition: .9s ease-out;
  622. color:{color:A Link on Hover};
  623. cursor:pointer;
  624. text-decoration:none;
  625. }  
  626.  
  627.  
  628. a:active {
  629. color:{color:A Link};
  630. text-decoration:none;
  631. }
  632.  
  633.  
  634.  
  635. A:link.mainnavi {
  636. transition:  .3s ease-in;
  637. -moz-transition:  .3s ease-in;
  638. -webkit-transition: .3s ease-in;
  639. -o-transition: .3s ease-in;
  640. color:{color:Top Navigation Text};
  641. text-align: left;
  642. display:inline-block;
  643. font-size: 15px;
  644. padding:24px;
  645. font-weight: normal;
  646. font-family: {font:Main Font};
  647. margin:0px 10px;
  648. letter-spacing:4px;
  649. text-decoration:none;
  650. text-transform: uppercase;
  651. }
  652.  
  653.  
  654. A:visited.mainnavi {
  655. color:{color:Top Navigation Text};
  656. text-decoration:none;
  657. }
  658.  
  659.  
  660. A:hover.mainnavi {
  661. transition:  .7s ease-in;
  662. -moz-transition:  .7s ease-in;
  663. -webkit-transition: .7s ease-in;
  664. -o-transition: .7s ease-in;
  665. color:{color:Main Colour 1};
  666. border-radius: 10px;
  667. background-color:{color:Top Navigation Text};
  668. }
  669.  
  670.  
  671. A.active.mainnavi {
  672. color:{color:Top Navigation Text};
  673. text-decoration:none;
  674. }
  675.    
  676.  
  677. .contentx {
  678. width:400px;
  679. margin:0 auto;
  680. font-family: {font:Main Font};
  681. color:{color:Text};
  682. text-align: justify;
  683. }
  684.  
  685.  
  686. #ask_form {
  687. height:260px;
  688. }
  689.  
  690.  
  691. .contentbox {
  692. transition:  .2s ease-out;
  693. -moz-transition:  .2s ease-out;
  694. -webkit-transition: .2s ease-out;
  695. -o-transition: .2s ease-out;
  696. width:420px;
  697. overflow:hidden;
  698. padding-top:10px;
  699. padding-bottom:10px;
  700. height:auto;
  701. {block:IfPostBorders}
  702. border:solid 1px {color:Post Border};
  703. {/block:IfPostBorders}
  704. background: {color:Post Box Background} url('{image:Post Box Background}') repeat;
  705. }
  706.  
  707.  
  708. .contentbox:hover {
  709. transition:  .0s ease-out;
  710. -moz-transition:  .0s ease-out;
  711. -webkit-transition: .0s ease-out;
  712. -o-transition: .0s ease-out;
  713. cursor:default;
  714. -webkit-box-shadow: 0px 0px 15px -2px rgba(255,255,255,1);
  715. -moz-box-shadow: 0px 0px 15px -2px rgba(255,255,255,1);
  716. box-shadow: 0px 0px 15px -2px rgba(255,255,255,1);
  717. }
  718.  
  719.  
  720. .contentboxx {
  721. transition:  .2s ease-out;
  722. -moz-transition:  .2s ease-out;
  723. -webkit-transition: .2s ease-out;
  724. -o-transition: .2s ease-out;
  725. width:420px;
  726. overflow-y:auto;
  727. padding-top:10px;
  728. padding-bottom:10px;
  729. max-height:400px;
  730. {block:IfPostBorders}
  731. border:solid 1px {color:Post Border};
  732. {/block:IfPostBorders}
  733. background: {color:Post Box Background} url('{image:Post Box Background}') repeat;
  734. }
  735.  
  736.  
  737. .contentboxx:hover {
  738. transition:  .0s ease-out;
  739. -moz-transition:  .0s ease-out;
  740. -webkit-transition: .0s ease-out;
  741. -o-transition: .0s ease-out;
  742. cursor:default;
  743. -webkit-box-shadow: 0px 0px 15px -2px rgba(255,255,255,1);
  744. -moz-box-shadow: 0px 0px 15px -2px rgba(255,255,255,1);
  745. box-shadow: 0px 0px 15px -2px rgba(255,255,255,1);
  746. }
  747.  
  748.  
  749. .content {
  750. width:400px;
  751. margin:0 auto;
  752. font-family: {font:Main Font};
  753. color:{color:Text};
  754. text-align: justify;
  755. }
  756.  
  757.  
  758. .uppercase {
  759. text-transform:uppercase;
  760. font-size:13px;
  761. }  
  762.      
  763.  
  764. .askbg {
  765. border-top: solid 2px {color:Ask Border};
  766. background-color: {color:Ask Background};
  767. word-wrap: break-word;
  768. padding-right:12px;
  769. overflow:hidden;
  770. font-family: {font:Main Font};
  771. color:{color:Text};
  772. text-align: justify;
  773. font-size:13px;
  774. padding:10px 10px;
  775. margin-top:0px;
  776. margin-left:0px;
  777. margin-right:0px;
  778. margin-bottom:8px;
  779. padding-left:10px;
  780. }  
  781.  
  782.  
  783. p {
  784. color:{color:Text};
  785. text-align: justify;
  786. padding:0px;
  787. font-size:13px;
  788. margin-top: 5px;
  789. margin-bottom:8px;
  790. font-weight: normal;
  791. font-family: {font:Main Font};
  792. text-decoration:none;
  793. }
  794.  
  795.  
  796. blockquote {
  797. border-left: solid 2px #c0c0c0;
  798. clear:both;
  799. color:{color:Text};
  800. text-align: justify;
  801. font-size: 15px;
  802. font-weight: normal;
  803. padding-top:0px;
  804. padding-bottom:0px;
  805. margin:0 ;
  806. padding-left:10px;
  807. font-family: {font:Main Font};
  808. text-decoration:none;
  809. }  
  810.  
  811.  
  812. .linkage {
  813. font-size:20px;
  814. font-family: {font:Main Font};
  815. text-align:justify;
  816. }
  817.  
  818.  
  819. .quote {
  820. font-size:17px;
  821. font-family: {font:Main Font};
  822. text-align:justify;
  823. font-weight:normal;
  824. color:{color:Text};
  825. }
  826.  
  827.  
  828. .quotation {
  829. color:{color:Text};
  830. font-size:17px;
  831. font-weight:bold;
  832. font-family: {font:Main Font};
  833. margin:0px 5px;
  834. }
  835.  
  836.  
  837. .dash {
  838. margin-right:3px;
  839. color:{color:Text};
  840.    
  841. }
  842.  
  843. .source {
  844.     b
  845. }
  846.  
  847.  
  848. .blogbg a {
  849. width:420px;
  850. margin-top:4px;
  851. clear:both;
  852. font-size: 8px;
  853. color:{color:Post Info};
  854. font-family:  {font:Post Info};  
  855. letter-spacing: 3px;
  856. text-transform: uppercase;
  857. text-align: right;
  858. transition:  .8s ease-in;
  859. -moz-transition:  .8s ease-in;
  860. -webkit-transition: .8s ease-in;
  861. -o-transition: .8s ease-in;
  862. text-decoration:none;
  863. margin-bottom:20px;
  864. }
  865.  
  866.  
  867. .blogbg a:hover {
  868. width:420px;
  869. margin-top:4px;
  870. clear:both;
  871. font-size: 8px;
  872. color:{color:Post Info};
  873. font-family: {font:Post Info} ;  
  874. letter-spacing: 3px;
  875. text-transform: uppercase;
  876. text-align: right;
  877. transition:  .8s ease-in;
  878. -moz-transition:  .8s ease-in;
  879. -webkit-transition: .8s ease-in;
  880. -o-transition: .8s ease-in;
  881. text-decoration:none;
  882. margin-bottom:20px;
  883. }
  884.  
  885.  
  886. .blogicon {
  887. cursor:help;
  888. }
  889.  
  890.  
  891. .blogbg, .postinfo {
  892. width:420px;
  893. margin-top:4px;
  894. clear:both;
  895. font-size: 8px;
  896. color:{color:Post Info};
  897. font-family:  {font:Post Info};  
  898. letter-spacing: 3px;
  899. text-transform: uppercase;
  900. text-align: right;
  901. transition:  .8s ease-in;
  902. -moz-transition:  .8s ease-in;
  903. -webkit-transition: .8s ease-in;
  904. -o-transition: .8s ease-in;
  905. text-decoration:none;
  906. margin-bottom:20px;
  907. }
  908.  
  909.  
  910. #youtube_iframe {
  911. width:100%;
  912. height:220px;
  913. {block:IfGrayscalePosts}
  914. filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  915. -webkit-filter: grayscale(100%);
  916. filter: grayscale(100%);
  917. filter: gray;
  918. {/block:IfGrayscalePosts}
  919. }
  920.  
  921.  
  922. #youtube_iframe:hover {
  923. transition:  .9s ease-out;
  924. -moz-transition:  .9s ease-out;
  925. -webkit-transition: .9s ease-out;
  926. -o-transition: .9s ease-out;
  927. filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  928. -webkit-filter: grayscale(0%);
  929. filter: grayscale(0%);
  930. filter: gray;
  931. }  
  932. {block:IfGrayscalePosts}
  933.  
  934.  
  935. .screen {
  936. transition:  .9s ease-out;
  937. -moz-transition:  .9s ease-out;
  938. -webkit-transition: .9s ease-out;
  939. -o-transition: .9s ease-out;
  940. width:400px;
  941. height:auto;  
  942. filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  943. -webkit-filter: grayscale(100%);
  944. filter: grayscale(100%);
  945. filter: gray;
  946. }  
  947.  
  948.  
  949. .screen:hover {
  950. filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  951. -webkit-filter: grayscale(0%);
  952. filter: grayscale(0%);
  953. filter: gray;
  954. }  
  955.  
  956.  
  957. .gray img {
  958. filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  959. -webkit-filter: grayscale(100%);
  960. filter: grayscale(100%);
  961. filter: gray;
  962. }
  963.  
  964.  
  965. .gray img:hover {  
  966. transition:  .9s ease-out;
  967. -moz-transition:  .9s ease-out;
  968. -webkit-transition: .9s ease-out;
  969. -o-transition: .9s ease-out;
  970. filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  971. -webkit-filter: grayscale(0%);
  972. filter: grayscale(0%);
  973. filter: gray;
  974. }  
  975.  
  976.  
  977. .grayscale {
  978. transition:  .9s ease-out;
  979. -moz-transition:  .9s ease-out;
  980. -webkit-transition: .9s ease-out;
  981. -o-transition: .9s ease-out;
  982. filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  983. -webkit-filter: grayscale(100%);
  984. filter: grayscale(100%);
  985. filter: gray;
  986. }      
  987.  
  988.  
  989. .grayscale:hover {  
  990. transition:  .9s ease-out;
  991. -moz-transition:  .9s ease-out;
  992. -webkit-transition: .9s ease-out;
  993. -o-transition: .9s ease-out;
  994. filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
  995. -webkit-filter: grayscale(0%);
  996. filter: grayscale(0%);
  997. filter: gray;
  998. }  
  999.  
  1000. {/block:IfGrayscalePosts}
  1001.  
  1002. .albumicon {
  1003. width:110px;
  1004. padding-right:10px;
  1005. float:Left;
  1006. height:110px;
  1007. }
  1008.  
  1009.  
  1010. .audioplayer {
  1011. width:100px;
  1012. overflow:hidden;
  1013. }
  1014.  
  1015.  
  1016. .audioinfo {
  1017. margin-top:14px;
  1018. }
  1019.  
  1020.  
  1021. .caption {
  1022. clear:both;
  1023. }
  1024.  
  1025.  
  1026. .chat ul {
  1027. list-style: none;
  1028. margin: 0;
  1029. padding: 0;
  1030. }
  1031.  
  1032.  
  1033. .chat li {
  1034. color:{color:Text};
  1035. text-align: justify;
  1036. font-size:13px;
  1037. border-bottom: dashed 1px   {color:Text};
  1038. font-weight: normal;
  1039. font-family: {font:Main Font};
  1040. margin:0px;
  1041. padding:3px;
  1042. text-decoration:none;
  1043. }
  1044.  
  1045.  
  1046. .note {
  1047. width:390px;
  1048. margin: 0 auto;
  1049. }
  1050.  
  1051.  
  1052. ol.notes {
  1053. padding: 0px;
  1054. font-size: 11px;        
  1055. font-weight:300;
  1056. font-family:   {font:Main Font};
  1057. letter-spacing:1px;
  1058. text-align:left;  
  1059. color {color:Notes};
  1060. text-align:justify;
  1061. list-style-type: none;
  1062. border-bottom: solid 1px #ccc;
  1063. }
  1064.  
  1065.  
  1066. ol.notes li.note {
  1067. font-size: 11px;        
  1068. color:{color:Notes};
  1069. font-family:  {font:Main Font};
  1070. list-style-type: none;
  1071. }
  1072.  
  1073.  
  1074. ol.notes li.note img.avatar {
  1075. vertical-align: -4px;
  1076. margin-right: 10px;
  1077. width: 16px;
  1078. display:none;
  1079. list-style-type: none;
  1080. height: 16px;
  1081. }  
  1082.  
  1083.  
  1084. ol.notes li.note span.action {
  1085. font-weight: normal;
  1086. }
  1087.  
  1088.  
  1089. ol.notes li.note .answer_content {
  1090. font-weight: normal;
  1091. }
  1092.  
  1093.  
  1094. ol.notes li.note   {
  1095. list-style-type: none;
  1096. }
  1097.  
  1098.  
  1099. ol.notes li.note {
  1100. list-style-type: none;
  1101. text-decoration: none;
  1102. }
  1103.  
  1104.  
  1105. </style>
  1106. </head>
  1107. <body>
  1108.  
  1109.  
  1110.  
  1111. <div class="mainnav">
  1112. <a href="{BlogURL}" class="mainnavi"> Home </a>
  1113. <a href="/ask" class="mainnavi"> Message </a>
  1114. <a href="/archive" class="mainnavi"> Archive </a>
  1115. {block:SubmissionsEnabled}
  1116. <a href="/submit" class="mainnavi"> Submit </a>
  1117. {/block:SubmissionsEnabled}
  1118. <a href="http://killuaxx.tumblr.com/" class="mainnavi" target="blank"> Theme </a>
  1119.  
  1120.  
  1121. </div>  
  1122.  
  1123.  
  1124.                                      
  1125.  
  1126. <div class="side">  
  1127.     <h3> {text:Sidebar Title}   </h3>
  1128.  
  1129.  <div class="sideline1">  </div>
  1130.  
  1131.     <div class="icon">
  1132.     <img src="{image:Icon}" class="sideicon">  
  1133.   <div class="sideline2">  </div>
  1134. </div>
  1135.  
  1136.  
  1137. {block:IfAboutMeTitle}
  1138.  
  1139.     <div class="aboutme"> {text:About Me Title} </div>
  1140.    
  1141.     {/block:IfAboutMeTitle}
  1142.  
  1143. {block:IfDescription}
  1144.  
  1145. <div class="description">
  1146. {Description}
  1147. </div>
  1148. {/block:IfDescription}
  1149.  
  1150.  
  1151. <div class="nav">
  1152.  
  1153.  
  1154. {block:ifLink1}
  1155. <a href="{text:Link 1}" class="navi">{text:Link 1 Name} </a>
  1156. {/block:ifLink1}
  1157.  
  1158. {block:ifLink2}
  1159. <a href="{text:Link 2}" class="navi">{text:Link 2 Name} </a>
  1160. {/block:ifLink2}
  1161.  
  1162. {block:ifLink3}
  1163. <a href="{text:Link 3}" class="navi">{text:Link 3 Name} </a>
  1164. {/block:ifLink3}
  1165.  
  1166. {block:ifLink4}
  1167. <a href="{text:Link 4}" class="navi">{text:Link 4 Name} </a>
  1168. {/block:ifLink4}
  1169.  
  1170. </div>  </div>
  1171.  
  1172.    
  1173.  
  1174.  
  1175.  
  1176. <div class="pagination">
  1177. {block:Pagination}
  1178. {block:PreviousPage} <a href="{PreviousPage}" class="page">&uarr;   </a>{/block:PreviousPage}
  1179.  
  1180. {block:JumpPagination length="3"}
  1181.  
  1182. {block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}
  1183.  
  1184. {block:JumpPage} <a class="jump_page" href="{URL}">{PageNumber}</a>{/block:JumpPage}
  1185.  
  1186. {/block:JumpPagination}
  1187.  
  1188. {block:NextPage}<a href="{NextPage}" class="page"> &darr;   </a>{/block:NextPage}
  1189. {/block:Pagination}
  1190.  
  1191. </div>
  1192.  
  1193. <div class="over"> </div>
  1194.  
  1195. <div class="container">
  1196.  
  1197.  
  1198.  
  1199. <!-- Post -->
  1200.  
  1201. {block:Posts}
  1202.  
  1203.  
  1204. <div class="containbox">
  1205. <div class="contentbox">
  1206. <div class="content gray">
  1207.  
  1208. {block:Text}
  1209. <div class="text size">
  1210. {block:Title}<h1>{Title}</h1>
  1211. {/block:Title}  
  1212. {Body} </div>  
  1213. {/block:Text}
  1214.                  
  1215.                  
  1216. {block:Photo}
  1217. <div class="post photo">
  1218. <img src="{PhotoURL-400}" alt="{PhotoAlt}"/>
  1219. </div>
  1220.                  
  1221.                          
  1222. {/block:Photo}{block:Panorama}
  1223. <li class="post grayscale">
  1224. {LinkOpenTag} <img src="{PhotoURL-Panorama}" alt="{PhotoAlt}"/> {LinkCloseTag}
  1225. </li>
  1226. {/block:Panorama}
  1227.                
  1228.                
  1229. {block:Photoset}
  1230. <div class="photoset grayscale">
  1231. {Photoset-400} </div>
  1232. {/block:Photoset}
  1233.                    
  1234. {block:Quote}
  1235. <div class="quote">
  1236. <span class="quotation">&ldquo;</span>{Quote}<span class="quotation">&rdquo;</span>
  1237. </div>
  1238.  
  1239. {block:Source}
  1240. <div class="source"><p><span class="dash"></span><i>{Source}</i></p></div>
  1241. {/block:Source}                        
  1242. {/block:Quote}
  1243.  
  1244. {block:Link}
  1245. <div class="linkage">
  1246. <a href="{URL}" class="link" {Target}>{Name}</a><br>
  1247. <div class="linex"></div>
  1248.    
  1249. {block:Description}
  1250.  <div class="descriptionx">{Description}</div>
  1251. {/block:Description}
  1252. </div>
  1253. {/block:Link}
  1254.  
  1255. {block:Chat}
  1256.  
  1257.  
  1258. <div class="chat">
  1259. {block:Title}<h1>{Title}</h1>
  1260. {/block:Title}  
  1261.  
  1262.     <ul>
  1263.         {block:Lines}<li class="{Alt}">{block:Label} <b>{Label} </b> </a> {/block:Label}{Line}</li>{/block:Lines}
  1264.     </ul>
  1265. </div>
  1266. {/block:Chat}
  1267.  
  1268.  
  1269. {block:Video}
  1270. <div class="post video grayscale">{Video-400}</div>  
  1271.  
  1272. {/block:Video}
  1273.                  
  1274. {block:Audio}
  1275. <div class="audio">
  1276. <div class="audiocontain2"> <div class="audiocontain"> <div class="audioplayer">{AudioPlayerGrey} </div>      
  1277. {block:AlbumArt}<img src="{AlbumArtURL}" class="albumicon">{/block:AlbumArt}
  1278. </div>  </div>
  1279. <div class="audioinfo"> {block:Artist} <p class="audiotext"> <strong>Artist:</strong> {Artist}</p>
  1280. {/block:Artist}
  1281. {block:Album}<p class="audiotext"><strong>Album:</strong>
  1282. {Album}</p>
  1283. {/block:Album}
  1284. {block:TrackName} <p class="audiotext"><strong>Track Name:</strong>
  1285. {TrackName}</p>
  1286. {/block:TrackName}
  1287. <div class="line"> </div>
  1288. </div> </div>
  1289. {/block:Audio}
  1290.  
  1291.                    
  1292. {block:Answer}
  1293. <div class="askbg">
  1294.  
  1295. <b>  
  1296. <span class="uppercase">
  1297.  
  1298. {Asker}
  1299.  
  1300.  
  1301. asked:  </span>
  1302. </b>
  1303. {Question}
  1304. </div>
  1305.  
  1306. <div class="answer">
  1307. <blockquote>
  1308. {Answer}     </blockquote> </div>
  1309. {/block:Answerer}
  1310. {/block:Answer}
  1311.  
  1312.  
  1313.  
  1314. {block:Caption}
  1315. <div class="caption"> {Caption} </div>
  1316. {/block:Caption}
  1317.  
  1318. </div></div>
  1319.        
  1320.                  
  1321.                  
  1322.  {block:Date}
  1323. <div class="blogbg">
  1324. <a href="{Permalink}" class="postinfo">Posted {TimeAgo} - {NoteCountWithLabel} </a> /
  1325.  
  1326.  
  1327. {block:Submission}  
  1328. <a href="{SubmitterURL}" class="infocolor tooltip" title="{Submitter}">Submitter</a>  <span class="textsize">/</span>
  1329. {/block:Submission}
  1330.  
  1331.  
  1332. <a href="{ReblogURL}">
  1333. <span class="glyphicon glyphicon-refresh blogicon tooltip" title="reblog" aria-hidden="true"></span>    </a>
  1334.  
  1335. <span class="glyphicon glyphicon-tags blogicon tooltip" {block:HasTags}title="
  1336. {block:Tags}#{Tag} {/block:Tags}" {/block:HasTags} aria-hidden="true"></span>
  1337.  
  1338. </div>
  1339. </div>  
  1340.  
  1341.  
  1342. {/block:Date}
  1343.  
  1344. <!-- {block:NoRebloggedFrom}
  1345. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  1346. {/block:NoRebloggedFrom} -->
  1347.  
  1348. {block:ContentSource}<!-- {SourceURL}
  1349. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  1350. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1351. {/block:ContentSource}
  1352.  
  1353.  
  1354.  
  1355.        
  1356. {block:PostNotes}
  1357.  
  1358.  
  1359.  
  1360.  
  1361. <div class="containbox">
  1362. <div class="contentboxx">
  1363. <div class="contentx gray">
  1364.                    <div class="note">
  1365.  
  1366.  <h1> Post Notes</h1>
  1367.  
  1368.                  
  1369.                  
  1370.  
  1371.                
  1372.                
  1373.  
  1374.  
  1375.  {PostNotes-64}
  1376.  
  1377.  
  1378.  
  1379. </div>
  1380.  
  1381.  
  1382.  
  1383.                    
  1384.  
  1385.  
  1386.  
  1387.  
  1388.  
  1389.  
  1390. </div></div>
  1391.        
  1392.                  
  1393.        
  1394. </div>  
  1395.  
  1396.  
  1397.  
  1398.  
  1399. {/block:PostNotes}  
  1400.            
  1401.            
  1402.            
  1403.            
  1404. {/block:Posts}
  1405.  
  1406.  
  1407. <!--  End Post -->
  1408.  
  1409.  
  1410.  
  1411.  
  1412.  
  1413.    
  1414.  
  1415.  
  1416.  
  1417.  
  1418.  
  1419.  
  1420.  
  1421.  </div>  </div>     </div>        </div>          
  1422.  </div>        </div>          
  1423.      
  1424.    
  1425.  
  1426.  
  1427.  
  1428.   <script>
  1429.         $(document).ready(function() {
  1430.             $('.tooltip').tooltipster();
  1431.     theme: 'tooltipster-punk'
  1432.  
  1433.         });
  1434.     </script>
  1435.  
  1436.  
  1437.      
  1438.  
  1439.  <script>
  1440.         $("#youtube_iframe").removeAttr("width");
  1441.                 $("#youtube_iframe").removeAttr("height");
  1442.  
  1443.  
  1444.  </script>
  1445.  
  1446.  <script>
  1447.              $("#youtube_iframe").addClass("intro");
  1448.  
  1449.  </script>  
  1450.  
  1451.  
  1452.   <script src="https://cdnjs.cloudflare.com/ajax/libs/masonry/3.3.2/masonry.pkgd.js"></script>  
  1453.  
  1454.  
  1455.   <script src="http://static.tumblr.com/ssbvfru/9UWnwhlvu/imagesloaded.pkgd.min.js"></script>  
  1456.  
  1457.    
  1458.    
  1459.     <script>
  1460.        
  1461.         // init Masonry
  1462. var $grid = $('.container').masonry({
  1463.   // options...
  1464. });
  1465. // layout Masonry after each image loads
  1466. $grid.imagesLoaded().progress( function() {
  1467.   $grid.masonry('layout');
  1468. });
  1469.  
  1470.  
  1471.     </script>
  1472.    
  1473.  
  1474. <script>
  1475.  
  1476.  
  1477. $('.container').masonry({
  1478.   // options
  1479.   itemSelector: '.containbox',
  1480.   columnWidth: 440
  1481. });
  1482.  
  1483.  </script>
  1484.  
  1485.  
  1486.    
  1487.   <script type="text/javascript" src="http://static.tumblr.com/ssbvfru/6evnve6gw/jquery.tooltipster.min.js"></script>
  1488.  
  1489.  
  1490.  
  1491.  
  1492.  
  1493. </body>
  1494.  
  1495.  
  1496. </html>
Advertisement
RAW Paste Data Copied
Advertisement