Advertisement
nofacesface

Kou! Theme

Nov 19th, 2013
16,921
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 29.66 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3.  
  4. <!--THEME BY NO-FACES-FACE
  5. steal and I'll find you and punch you in the throat (◡‿◡✿)
  6. -->
  7.  
  8. <head>
  9.  
  10. <meta name="color:Link" content="#000"/>
  11. <meta name="color:Navigation Title" content="#f59bb9"/>
  12. <meta name="color:Navigation Title BG" content="#e6427a"/>
  13. <meta name="color:Navigation Circle Hover" content="#bc2055"/>
  14. <meta name="color:Navigation Circle" content="#000"/>
  15. <meta name="color:Blog Title" content="#000"/>
  16. <meta name="color:Blog Title Hover" content="#000"/>
  17. <meta name="color:Lines" content="#acacac"/>
  18. <meta name="color:Background" content="#000" />
  19. <meta name="color:Text" content="#000" />
  20. <meta name="color:Underline" content="#ec6593" />
  21. <meta name="color:Bold" content="#7d052e" />
  22. <meta name="color:Italic" content="#d7507e" />
  23. <meta name="color:Description" content="#000" />
  24. <meta name="color:Scroll" content="#000" />
  25. <meta name="color:Hover" content="#000" />
  26. <meta name="color:Permalink" content="#000" />
  27. <meta name="color:Title Shadow" content="#f59bb9" />
  28. <meta name="color:Links Shadow" content="#b12051" />
  29. <meta name="color:Post Title" content="#ec6593" />
  30. <meta name="color:Permahover" content="#bc2055" />
  31.  
  32.  
  33. <style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-9/cur817.cur), progress !important;}</style>
  34.  
  35.  
  36. <meta name="image:circle" content="http://static.tumblr.com/cbjpgjf/O7hmwl923/tumblr_murokkjoxl1sjf6c1o1_250.gif"/>
  37. <meta name="image:Background" content="http://static.tumblr.com/cbjpgjf/QOzmwl91f/tumblr_lxwynw0pdg1r9g6hvo4_250.png" />
  38.  
  39. <meta name="text:Link 1" content="/" />
  40. <meta name="text:Link 1 Title" content="refresh" />
  41. <meta name="text:Link 2" content="/ask" />
  42. <meta name="text:Link 2 Title" content="whisper" />
  43. <meta name="text:Link 3" content="/archive" />
  44. <meta name="text:Link 3 Title" content="past" />
  45. <meta name="text:Link 4" content="/submit" />
  46. <meta name="text:Link 4 Title" content="submit" />
  47.  
  48.  
  49. <meta name="if:caption" content="1"/>
  50. <meta name="if:photoeffect" content="0"/>
  51. <meta name="if:posttype3" content="0"/>
  52. <meta name="if:posttype2" content="1"/>
  53. <meta name="if:posttype1" content="0"/>
  54. <meta name="if:infinitescroll" content="1"/>
  55.  
  56. <title>{Title}{block:PostTitle} - {PostTitle}{/block:PostTitle}</title> {block:Description}<meta name=""
  57. content="{MetaDescription}" />{/block:Description}
  58. <link rel="shortcut icon" href="{Favicon}">
  59.  
  60. <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>
  61.  
  62. <style>
  63. div#qTip {
  64. padding: 4px;
  65. display: none;
  66. text-align: center;
  67. position: absolute;
  68. font-family: consolas;
  69. font-size:8px;
  70. line-height:10px;
  71. z-index: 1000;
  72. background-color: rgba(255,255,255,0.6);
  73. color: {color:Text};
  74. text-transform:uppercase;
  75. letter-spacing: 3px;
  76.  
  77. }
  78. </style>
  79.  
  80.  
  81. <style type="text/css">
  82.  
  83. #tumblr_controls {
  84. position: fixed !important;
  85. }
  86.  
  87. iframe#tumblr_controls { white-space:nowrap; -webkit-filter: invert(100%); -moz-filter: invert(100%); -o-filter: invert(100%); -ms-filter: invert(100%); filter: invert(100%); opacity:0.2; 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;}
  88.  
  89. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.2s linear;opacity: 1;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  90.  
  91.  
  92.  
  93. ::-webkit-scrollbar {width: 5px;height:5px; background: #fff;}
  94. ::-webkit-scrollbar-thumb {background:{color:Scroll};}
  95.  
  96.  
  97.  
  98. /* GENERAL */
  99.  
  100. @font-face {
  101. font-family: "body";
  102. src: url('http://static.tumblr.com/cbjpgjf/wPKmv5fe4/slkscr.ttf');
  103. }
  104.  
  105.  
  106. body{
  107. margin:0px;
  108. font-family: body;
  109. font-size: 8px;
  110. letter-spacing:0px;
  111. line-height: 11px;
  112. color: {color:text};
  113. }
  114.  
  115.  
  116.  
  117. body {
  118. background-color: {color:Background};
  119.  
  120. background-image: url({image:Background});
  121. margin: 0;
  122. word-wrap: break-word;
  123. background-attachment: fixed;
  124. overflow-x: hidden;
  125.  
  126. }
  127.  
  128.  
  129. a:link, a:active, a:visited{text-decoration: none;color: {color:Link};
  130. -webkit-transition: all 0.7s ease;transition: all 0.7s ease;
  131. -moz-transition: all 0.7s ease;-o-transition: all 0.7s ease;}
  132.  
  133. a:hover{text-shadow:2px 0 .2px {color:Links Shadow}; color: {color:Hover}; letter-spacing: 2px;}
  134.  
  135. a.class1 {color: {color:Blog Title};}
  136. a.class1:link
  137. a.class1:active
  138. a.class1:visited{text-decoration: none;color: {color:Link};
  139. -webkit-transition: all 0.5s ease;transition: all 0.5s ease;
  140. -moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;}
  141. a.class1:hover{
  142. text-shadow:2px 0 .2px {color:Title Shadow}; color: {color:Blog Title Hover}; letter-spacing: 5px;}
  143.  
  144.  
  145. /* POSTS */
  146.  
  147.  
  148. #content{
  149. position: relative;
  150. margin-top:10px;
  151. {block:ifposttype3}
  152. width:600px;
  153. margin-left:40px;
  154. margin-top: 35px;
  155. {/block:ifposttype3}
  156. {block:ifposttype2}
  157. width:300px;
  158. margin-left:120px;
  159. margin-top: 35px;
  160. {/block:ifposttype2}
  161. {block:ifposttype1}
  162. width:500px;
  163. margin-left:70px;
  164. margin-top: 35px;
  165. {/block:ifposttype1}
  166.  
  167. }
  168. .entry{
  169. {block:ifposttype3}
  170. width: 250px;
  171. {/block:ifposttype3}
  172. {block:ifposttype2}
  173. width: 250px;
  174. {/block:ifposttype2}
  175. {block:ifposttype1}
  176. width: 400px;
  177. {/block:ifposttype1}
  178. margin: 2px 2px;
  179. padding: 10px;
  180. padding: 5px;
  181. opacity: .9;
  182. -webkit-transition: all 0.4s ease-in-out;
  183. -moz-transition: all 0.4s ease-in-out;
  184. -o-transition: all 0.4s ease-in-out;
  185. -ms-transition: all 0.4s ease-in-out;
  186. transition: all 0.4s ease-in-out;}
  187.  
  188.  
  189.  
  190.  
  191. .entry img{max-width:100%;
  192. opacity: 1px;
  193. -webkit-transition: opacity 0.6s linear;
  194. -webkit-transition: all 0.6s ease-in-out;
  195. -moz-transition: all 0.6s ease-in-out;
  196. -o-transition: all 0.6s ease-in-out;}
  197.  
  198.  
  199. .entry {
  200. {block:ifphotoeffect}
  201. opacity: 1;
  202. -webkit-filter: grayscale(100%);
  203. {/block:ifphotoeffect} }
  204.  
  205. .entry:hover {
  206. opacity: 1;
  207. -webkit-filter:none;
  208. -webkit-transition: opacity 0.6s linear;
  209. -webkit-transition: all 0.6s ease-in-out;
  210. -moz-transition: all 0.6s ease-in-out;
  211. -o-transition: all 0.6s ease-in-out;
  212. }
  213.  
  214.  
  215.  
  216. /* SIDEBAR */
  217.  
  218. .container {
  219. width: 300px;
  220. height: 140px;
  221. padding: 5px;
  222. position: fixed;
  223. {block:ifposttype1}
  224. margin-left: 550px;
  225. {/block:ifposttype1}
  226. {block:ifposttype2}
  227. margin-left: 500px;
  228. {/block:ifposttype2}
  229. {block:ifposttype3}
  230. margin-left: 600px;
  231. {/block:ifposttype3}
  232. margin-top: 230px;
  233. z-index: 999;}
  234.  
  235. .circle {
  236. z-index: 10;
  237. overflow:hidden;
  238. width: 120px;
  239. height: 120px;
  240. border-radius: 500px;
  241. background-color: rgba(255,255,255,0.7);
  242. position: fixed;
  243. margin-left: 5px;
  244. margin-top: 10px; }
  245.  
  246. .circle img {
  247. border-radius: 500px;
  248. width: 100%;
  249. height: 120px;
  250. }
  251.  
  252. .titlebox {
  253. overflow: hidden;
  254. width: 150px;
  255. height: 50px;
  256. position: fixed;
  257. margin-left: 140px;
  258. margin-top: 30px;
  259. -webkit-transition: opacity 0.6s linear;
  260. -webkit-transition: all 0.6s ease-in-out;
  261. -moz-transition: all 0.6s ease-in-out;
  262. -o-transition: all 0.6s ease-in-out;
  263. }
  264.  
  265. .container:hover .titlebox {
  266. margin-top: -6px;
  267. }
  268.  
  269. .blogtitle {
  270. -webkit-transition: all 0.7s ease 0s;
  271. -moz-transition: all 0.7s ease 0s;
  272. -o-transition: all 0.7s ease 0s;
  273. transition: all 0.7s ease 0s;
  274. text-align: left;
  275. color: {color:Blog Title};
  276. font-family: consolas;
  277. font-size: 14px;
  278. letter-spacing: 4px;
  279. text-transform: uppercase;
  280. margin-top: 30px;
  281. padding: 5px;
  282. }
  283.  
  284. .descbox {
  285. overflow: hidden;
  286. width: 143px;
  287. height: 0px;
  288. position: fixed;
  289. margin-left: 145px;
  290. margin-top: 80px;
  291. -webkit-transition: opacity 0.6s linear;
  292. -webkit-transition: all 0.6s ease-in-out;
  293. -moz-transition: all 0.6s ease-in-out;
  294. -o-transition: all 0.6s ease-in-out;
  295. }
  296.  
  297. .container:hover .descbox {
  298. height: 40px;
  299. }
  300.  
  301. .description {
  302. text-align: left;
  303. color: {color:Description};
  304. font-family: body;
  305. font-size: 8px;
  306. letter-spacing: 2px;
  307. text-transform: none;
  308. margin-top: 0px;
  309. }
  310.  
  311.  
  312. /* NAVIGATION */
  313.  
  314. .navigationtitle {
  315. text-align: center;
  316. font-family: consolas;
  317. font-size: 11px;
  318. text-transform: uppercase;
  319. margin-top: 15px;
  320. color: {color:Navigation Title};
  321. letter-spacing: 5px;
  322. }
  323.  
  324.  
  325.  
  326. .line {
  327. width: 1px;
  328. height: 120px;
  329. background-color: {color:Lines};
  330. position: fixed;
  331. margin-left: 135px;
  332. margin-top: 10px; }
  333.  
  334. .line2 {
  335. width: 0px;
  336. height: 1px;
  337. background-color: {color:Lines};
  338. position: fixed;
  339. margin-left: 135px;
  340. margin-top: 60px;
  341. -webkit-transition: opacity 0.6s linear;
  342. -webkit-transition: all 0.6s ease-in-out;
  343. -moz-transition: all 0.6s ease-in-out;
  344. -o-transition: all 0.6s ease-in-out;}
  345.  
  346. .container:hover .line2 {
  347. width: 50px;
  348. }
  349.  
  350. .circle1 {
  351. opacity: 0;
  352. position: fixed;
  353. border-radius: 500px;
  354. height: 12px;
  355. width: 12px;
  356. background-color: {color:Navigation Circle};
  357. margin-top: 54px;
  358. margin-left: 211px;
  359. -webkit-transition: opacity .4s linear;
  360. -webkit-transition: all .4s ease-in-out;
  361. -moz-transition: all .4s ease-in-out;
  362. -o-transition: all .4s ease-in-out;
  363. }
  364.  
  365. .container:hover .circle1 {
  366. opacity: 1;
  367. -webkit-transition: opacity .8s linear;
  368. -webkit-transition: all .8s ease-in-out;
  369. -moz-transition: all .8s ease-in-out;
  370. -o-transition: all .8s ease-in-out;
  371. }
  372.  
  373. .circle1:hover {
  374. background-color: {color:Navigation Circle Hover};
  375. }
  376.  
  377. .l1 {
  378. width: 0px;
  379. height: 1px;
  380. background-color: {color:Lines};
  381. position: fixed;
  382. margin-left: 180px;
  383. margin-top: 60px;
  384. -webkit-transition: opacity 0.4s linear;
  385. -webkit-transition: all 0.4s ease-in-out;
  386. -moz-transition: all 0.4s ease-in-out;
  387. -o-transition: all 0.4s ease-in-out;
  388. }
  389.  
  390. div.both1:hover .l1 {
  391. width: 31px ;
  392. }
  393.  
  394. .navbox1 {
  395. z-index: 0;
  396. opacity: 0;
  397. width: 100px;
  398. height: 40px;
  399. opacity: 0;
  400. position: fixed;
  401. margin-left: 15px;
  402. margin-top: 50px;
  403. overflow: hidden;
  404. -webkit-transition: opacity 0.4s linear;
  405. -webkit-transition: all 0.4s ease-in-out;
  406. -moz-transition: all 0.4s ease-in-out;
  407. -o-transition: all 0.4s ease-in-out;
  408. }
  409.  
  410. .both1:hover .navbox1 {
  411. z-index:99;
  412. opacity: 1;
  413. }
  414.  
  415. .circle2 {
  416. opacity: 0;
  417. position: fixed;
  418. border-radius: 500px;
  419. height: 12px;
  420. width: 12px;
  421. background-color: {color:Navigation Circle};
  422. margin-top: 54px;
  423. margin-left: 234px;
  424. -webkit-transition: opacity .4s linear;
  425. -webkit-transition: all .4s ease-in-out;
  426. -moz-transition: all .4s ease-in-out;
  427. -o-transition: all .4s ease-in-out;
  428. }
  429.  
  430. .container:hover .circle2 {
  431. opacity: 1;
  432. -webkit-transition: opacity .8s linear;
  433. -webkit-transition: all .8s ease-in-out;
  434. -moz-transition: all .8s ease-in-out;
  435. -o-transition: all .8s ease-in-out;
  436. }
  437.  
  438. .circle2:hover {
  439. background-color: {color:Navigation Circle Hover};
  440. }
  441.  
  442. .l2{
  443. z-index: -2;
  444. width: 0px;
  445. height: 1px;
  446. background-color: {color:Lines};
  447. position: fixed;
  448. margin-left: 180px;
  449. margin-top: 60px;
  450. -webkit-transition: opacity 0.4s linear;
  451. -webkit-transition: all 0.4s ease-in-out;
  452. -moz-transition: all 0.4s ease-in-out;
  453. -o-transition: all 0.4s ease-in-out;
  454. }
  455.  
  456. div.both2:hover .l2 {
  457. width: 54px ;
  458. }
  459.  
  460. .navbox2 {
  461. z-index: 0;
  462. opacity: 0;
  463. width: 100px;
  464. height: 40px;
  465. opacity: 0;
  466. position: fixed;
  467. margin-left: 15px;
  468. margin-top: 50px;
  469. overflow: hidden;
  470. -webkit-transition: opacity 0.4s linear;
  471. -webkit-transition: all 0.4s ease-in-out;
  472. -moz-transition: all 0.4s ease-in-out;
  473. -o-transition: all 0.4s ease-in-out;
  474. }
  475.  
  476. .both2:hover .navbox2 {
  477. z-index:99;
  478. opacity: 1;
  479. }
  480.  
  481. .circle3 {
  482. opacity: 0;
  483. position: fixed;
  484. border-radius: 500px;
  485. height: 12px;
  486. width: 12px;
  487. background-color: {color:Navigation Circle};
  488. margin-top: 54px;
  489. margin-left: 257px;
  490. -webkit-transition: opacity .4s linear;
  491. -webkit-transition: all .4s ease-in-out;
  492. -moz-transition: all .4s ease-in-out;
  493. -o-transition: all .4s ease-in-out;
  494. }
  495.  
  496. .container:hover .circle3 {
  497. opacity: 1;
  498. -webkit-transition: opacity .8s linear;
  499. -webkit-transition: all .8s ease-in-out;
  500. -moz-transition: all .8s ease-in-out;
  501. -o-transition: all .8s ease-in-out;
  502. }
  503.  
  504. .circle3:hover {
  505. background-color: {color:Navigation Circle Hover};
  506. }
  507.  
  508. .l3{
  509. z-index: -2;
  510. width: 0px;
  511. height: 1px;
  512. background-color: {color:Lines};
  513. position: fixed;
  514. margin-left: 180px;
  515. margin-top: 60px;
  516. -webkit-transition: opacity 0.4s linear;
  517. -webkit-transition: all 0.4s ease-in-out;
  518. -moz-transition: all 0.4s ease-in-out;
  519. -o-transition: all 0.4s ease-in-out;
  520. }
  521.  
  522. div.both3:hover .l3 {
  523. width: 77px ;
  524. }
  525.  
  526. .navbox3 {
  527. z-index: 0;
  528. opacity: 0;
  529. width: 100px;
  530. height: 40px;
  531. opacity: 0;
  532. position: fixed;
  533. margin-left: 15px;
  534. margin-top: 50px;
  535. overflow: hidden;
  536. -webkit-transition: opacity 0.4s linear;
  537. -webkit-transition: all 0.4s ease-in-out;
  538. -moz-transition: all 0.4s ease-in-out;
  539. -o-transition: all 0.4s ease-in-out;
  540. }
  541.  
  542. .both3:hover .navbox3 {
  543. z-index:99;
  544. opacity: 1;
  545. }
  546.  
  547.  
  548. .circle4 {
  549. opacity: 0;
  550. position: fixed;
  551. border-radius: 500px;
  552. height: 12px;
  553. width: 12px;
  554. background-color: {color:Navigation Circle};
  555. margin-top: 54px;
  556. margin-left: 280px;
  557. -webkit-transition: opacity .4s linear;
  558. -webkit-transition: all .4s ease-in-out;
  559. -moz-transition: all .4s ease-in-out;
  560. -o-transition: all .4s ease-in-out;
  561. }
  562.  
  563. .container:hover .circle4 {
  564. opacity: 1;
  565. -webkit-transition: opacity .8s linear;
  566. -webkit-transition: all .8s ease-in-out;
  567. -moz-transition: all .8s ease-in-out;
  568. -o-transition: all .8s ease-in-out;
  569. }
  570.  
  571. .circle4:hover {
  572. background-color: {color:Navigation Circle Hover};
  573. }
  574.  
  575. .l4{
  576. z-index: -2;
  577. width: 0px;
  578. height: 1px;
  579. background-color: {color:Lines};
  580. position: fixed;
  581. margin-left: 180px;
  582. margin-top: 60px;
  583. -webkit-transition: opacity 0.4s linear;
  584. -webkit-transition: all 0.4s ease-in-out;
  585. -moz-transition: all 0.4s ease-in-out;
  586. -o-transition: all 0.4s ease-in-out;
  587. }
  588.  
  589. div.both4:hover .l4 {
  590. width: 100px ;
  591. }
  592.  
  593. .navbox4 {
  594. z-index: 0;
  595. opacity: 0;
  596. width: 100px;
  597. height: 40px;
  598. opacity: 0;
  599. position: fixed;
  600. margin-left: 15px;
  601. margin-top: 50px;
  602. overflow: hidden;
  603. -webkit-transition: opacity 0.4s linear;
  604. -webkit-transition: all 0.4s ease-in-out;
  605. -moz-transition: all 0.4s ease-in-out;
  606. -o-transition: all 0.4s ease-in-out;
  607. }
  608.  
  609. .both4:hover .navbox4 {
  610. z-index:99;
  611. opacity: 1;
  612. }
  613.  
  614.  
  615. /* TITLES */
  616.  
  617. .title a{color: {color:Link};}
  618. .title {font-family:consolas;
  619. font-size:13px;
  620. font-style:none;
  621. letter-spacing: 4px;
  622. text-transform: uppercase;
  623. margin:0px 0px 0px 0px;
  624. color:#000;
  625. color: {color:Post Title};};
  626. }
  627.  
  628. .quote {
  629. padding:10px;
  630. font-size:9px;
  631. letter-spacing: 0px;
  632. text-transform:none;
  633. color: {color:Text};}
  634.  
  635. .source {
  636. font-size:8px;
  637. letter-spacing: 2px;
  638. text-align:right;
  639. font-style:none;
  640. font-weight:none;
  641. text-transform:none;}
  642.  
  643. .answer {margin:10px;}
  644.  
  645. /* PERMALINKS */
  646.  
  647.  
  648. .entry:hover .perma {
  649. opacity:1;
  650. z-index:999;
  651. -webkit-transition: all 0.9s ease;
  652. -moz-transition: all 0.9s ease;}
  653.  
  654. {block:PermalinkPage}
  655. {block:ifnotposttype1}
  656. width:250px;
  657. {/block:ifnotposttype1}
  658. {block:ifposttype1}
  659. width:400px;
  660. {/block:ifposttype1}
  661.  
  662. {/block:PermalinkPage}
  663.  
  664. .perma a {
  665. color:{color:Link};
  666. font-size:9px;
  667. font-family: consolas;
  668. text-transform:normal;}
  669.  
  670. .perma a:hover {
  671. color:{color:Hover};
  672. }
  673.  
  674.  
  675. .perma {
  676. {block:ifposttype1}
  677. margin-left:400px;
  678. {/block:ifposttype1}
  679. {block:ifposttype2}
  680. margin-left:250px;
  681. {/block:ifposttype2}
  682. {block:ifposttype3}
  683. margin-left:215px;
  684. {/block:ifposttype3}
  685. text-transform: normal;
  686. position:absolute;
  687. font-size: 9px;
  688. text-transform: uppercase;
  689. line-height:10px;
  690. text-align:center;
  691. margin-top:0px;
  692. width: 20px;
  693. height: 35px;
  694. opacity:0;
  695. padding: 8px;
  696. -webkit-transition: all 0.9s ease;
  697. -moz-transition: all 0.9s;
  698. }
  699.  
  700. .permanumber {
  701. opacity: .9;
  702. position: absolute;
  703. margin-top: 0px;
  704. margin-left: 5px;
  705. height: 14px;
  706. width: 14px;
  707. border-radius: 500px;
  708. -webkit-transition: all 0.9s ease;
  709. -moz-transition: all 0.9s;
  710. background-color: {color:permalink};
  711.  
  712. }
  713.  
  714. {block:ifnotposttype3}
  715.  
  716. .permanumberline {
  717. background-color: {color:Lines};
  718. position: absolute;
  719. margin-top: 7px;
  720. margin-left: -13px;
  721. height: 1px;
  722. width: 0px;
  723. opacity: 1;
  724. overflow:hidden;
  725. -webkit-transition: all 0.4s ease;
  726. -moz-transition: all 0.4s;
  727.  
  728. }
  729.  
  730. .permanumber:hover .permanumberline {
  731. width: 13px;}
  732. {/block:ifnotposttype3}
  733.  
  734. .permanumber:hover {
  735. opacity: 1;
  736. background-color: {color:Permahover};}
  737.  
  738.  
  739.  
  740. .permareblog {
  741. opacity: .9;
  742. border-radius: 500px;
  743. position: absolute;
  744. margin-top: 20px;
  745. margin-left: 5px;
  746. height: 14px;
  747. width: 14px;
  748. -webkit-transition: all 0.9s ease;
  749. -moz-transition: all 0.9s;
  750. background-color: {color:permalink};
  751.  
  752. }
  753.  
  754. {block:ifnotposttype3}
  755. .permareblogline {
  756. background-color: {color:Lines};
  757. position: absolute;
  758. margin-top: 7px;
  759. margin-left: -13px;
  760. height: 1px;
  761. width: 0px;
  762. opacity: 1;
  763. overflow:hidden;
  764. -webkit-transition: all 0.4s ease;
  765. -moz-transition: all 0.4s;
  766.  
  767. }
  768.  
  769. .permareblog:hover .permareblogline {
  770. width: 13px;
  771.  
  772. }
  773. {/block:ifnotposttype3}
  774.  
  775. .permareblog:hover {
  776. opacity: 1;
  777. background-color: {color:Permahover};
  778. }
  779.  
  780. #permalink{
  781. {block:PermalinkPage}
  782. text-align:center;
  783. margin-top:10px;
  784. padding:0px;
  785. font-size:8px;
  786. text-transform:lowercase;
  787. color: #000;
  788. {/block:PermalinkPage}
  789. }
  790.  
  791. /*PAGINATION*/
  792.  
  793. #paginwrapper {
  794. opacity: 0;
  795. position: fixed;
  796. height: 50px;
  797. width: 150px;
  798. margin-top: 112px;
  799. margin-left: 108px;
  800. z-index: 999;
  801. -webkit-transition: opacity 0.6s linear;
  802. -webkit-transition: all 0.6s ease-in-out;
  803. -moz-transition: all 0.6s ease-in-out;
  804. -o-transition: all 0.6s ease-in-out;
  805. }
  806.  
  807. .jump_page {
  808. padding: 8px;
  809. background-color: none;
  810. color: {color:Text};
  811. font-size:10px;
  812. text-decoration:none;
  813. }
  814.  
  815. .current_page, .jump_page:hover {
  816. padding: 8px;
  817. background-color: none;
  818. color: {color:Hover};
  819. font-size:10px;
  820. }
  821.  
  822. .container:hover #paginwrapper {
  823. opacity:1;
  824. margin-top: 122px;
  825. }
  826.  
  827. /* AUDIO */
  828.  
  829. .artcover {position:absolute;}
  830. .artcover img {width:70px;height:70px;float:left;}
  831. .audioplayer {width:20px;padding:3px 5px 5px 3px;overflow:hidden;}
  832. .audioinfo {margin-left:75px;border-left:2px solid {color:Lines};padding:5px;}
  833. .i{display:block;padding:6px 3px;line-height:8px;}
  834. .player{position:absolute;background:#FFF;width:30px;height:30px;
  835. opacity:0.45;padding:20px;overflow:hidden;
  836. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  837. -o-transition: 0.5s ease;-moz-transition: 0.5s ease;}
  838. .player:hover{opacity:0.75;}
  839.  
  840. /* TEXT */
  841.  
  842. i, em{color:{color:Italic};}
  843. b{color:{color:Bold}; letter-spacing: 1px;}
  844. b, strong{color:{color:Title}; letter-spacing: 2px;}
  845. ul,ol{margin:0px;margin-left:-10px;}
  846. p{padding:0px;margin:10px;}
  847. u{text-decoration:none;color: {color:Underline}; letter-spacing: 1px;
  848. border-bottom:1px solid {color:Underline};}
  849. blockquote {margin:2px; margin-left:10px;
  850. padding:2px;border-left:1px solid {color:Lines};}
  851.  
  852. /* MISC */
  853.  
  854. #warning {
  855. z-index: -10000;
  856. position: fixed;
  857. top: 0;left: 0;
  858. width: 100%;
  859. height: 100%;
  860. background-color: rgba(255,255,255,0.8);
  861. color: #000;
  862. text-align: center;
  863. text-transform: uppercase;
  864. padding-top: 250px;
  865. font-family: consolas;
  866. font-size: 13px;
  867. letter-spacing: 4px;
  868. opacity: 0;
  869. {block:ifposttype1}
  870. {block:ifposttype3}opacity: 1;z-index:10000;{/block:ifposttype3}
  871. {block:ifposttype2}opacity: 1;z-index:10000;{/block:ifposttype2}
  872. {block:ifposttype2}{block:ifposttype3}opacity: 1;z-index:10000;{/block:ifposttype3}{/block:ifposttype2}
  873. {/block:ifposttype1}
  874. {block:ifposttype2}{block:ifposttype3}opacity: 1;z-index:10000;{/block:ifposttype3}{/block:ifposttype2}
  875. {block:ifnotposttype1}{block:ifnotposttype2}{block:ifnotposttype3}opacity: 1;z-index:10000;{/block:ifnotposttype3}{/block:ifnotposttype2}{/block:ifnotposttype1}
  876. }
  877.  
  878. .c img{
  879. padding-left: 2.5px;
  880. padding-top: 2px;
  881. border-radius: 500px;
  882. opacity: 0;
  883. width:25px;
  884. height: 25px;
  885. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  886. -o-transition: 0.5s ease;-moz-transition: 0.5s ease;}
  887.  
  888. .c{overflow: hidden; position:fixed;right:7px;bottom:7px; background-color: rgba(0,0,0,0.3);
  889. width: 30px; height: 30px; border-radius: 500px;}
  890.  
  891.  
  892. .c img:hover{
  893. opacity: 1;
  894. }
  895.  
  896.  
  897. .popup_block{
  898. display:none;
  899. padding:20px;
  900. float:left;
  901. position:fixed;
  902. top:50%;left:50%;
  903. z-index: 99999;}
  904.  
  905. img.btn_close {float: right;margin: -20 -20px 0 0;}
  906. *html #fade {position: absolute;}
  907. *html .popup_block {position: absolute;}
  908. #fade {display:none;background:#fff;position:fixed;left:0;top:0;
  909. width:100%;height:100%;opacity:0.8;z-index:9999;}
  910.  
  911. .l .odd{display:block;padding:5px 5px;}
  912. .l .even{display:block;background: rgba(255,255,255,0.6);padding:5px 5px;}
  913.  
  914. #s-m-t-tooltip{display:inline-block;position:absolute;max-width:300px;
  915. margin:15px;padding:3px 10px 3px 10px;z-index:99;border:1px solid #AAA;
  916. border-radius:10px;border-top-left-radius:0px;background:#000;}
  917.  
  918. ::selection {color: {color:Hover};}
  919. ::-moz-selection {color: {color:Hover};}
  920. ::-webkit-selection{color: {color:Hover};}
  921.  
  922. img{ margin-bottom:-3px;}
  923.  
  924. /* POSTNOTES */
  925.  
  926. ol.notes a{letter-spacing:1px;}
  927. ol.notes {
  928. list-style:none;
  929. font-size:8px;
  930. margin-top:20px;
  931. text-transform:none;}
  932.  
  933. ol.notes li.note img.avatar {
  934. vertical-align:-5px;
  935. margin-right:5px;
  936. width:20px;
  937. padding:4px;
  938. border:1px solid {color:Lines};}
  939.  
  940. ol.notes li.note {margin:5px 0px 10px -20px;}
  941. ol.notes li.note span.action {font-style: normal;}
  942. ol.notes li.note .answer_content {font-weight: normal;}
  943. ol.notes li.note blockquote {padding:4px 10px;margin: 10px 0px 0px 25px;}
  944.  
  945. </style>
  946.  
  947. {block:indexpage}
  948. {block:ifposttype3}
  949. <script type="text/javascript" src="http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js"></script>
  950.  
  951. <script src="http://static.tumblr.com/twte3d7/H8Glm663z/masonry.js"></script>
  952. <script type="text/javascript">
  953. $(window).load(function () {
  954. $('#content').masonry({
  955. itemSelector : ".posts",
  956. },
  957. function() { $('#content').masonry({ appendedContent: $(this) }); }
  958. );
  959. });
  960. </script>
  961. {/block:ifposttype3}
  962. {block:ifnotposttype3}{block:ifinfinitescroll}
  963. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  964. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script> <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script> <script type="text/javascript" charset="utf-8"> var $j = jQuery.noConflict(); $j(function() { if (navigator.platform == "iPad" || navigator.platform == "iPhone") return; $j("img").lazyload({ placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif", effect: "fadeIn", }); }); </script>
  965. {/block:ifinfinitescroll}{/block:ifnotposttype3}
  966. {/block:indexpage}
  967.  
  968.  
  969. </head>
  970. <body>
  971.  
  972. <div id="warning">please select only one post size</div>
  973.  
  974.  
  975. <div class="container">
  976.  
  977. <div class="circle"><a href="/"><img src="{image:circle}"></a></div>
  978. <div class="titlebox">
  979. <div class="blogtitle"><a href="/" class="class1">{Title}</a></div>
  980. </div>
  981. <div class="descbox"><div style="overflow:auto; width: 146px; height: 40px;">
  982. <div class="description">{Description}</div>
  983. </div>
  984. </div>
  985.  
  986. <div class="both1">
  987. <a href="{text:Link 1}"><div class="circle1"></div></a>
  988. <div class="l1"></div>
  989. <div class="navbox1">
  990. <div class="navigationtitle">{text:Link 1 Title}</div>
  991. </div>
  992. </div>
  993.  
  994. <div class="both2">
  995. <a href="{text:Link 2}"><div class="circle2"></div></a>
  996. <div class="l2"></div>
  997. <div class="navbox2">
  998. <div class="navigationtitle">{text:Link 2 Title}</div>
  999. </div>
  1000. </div>
  1001.  
  1002. <div class="both3">
  1003. <a href="{text:Link 3}"><div class="circle3"></div></a>
  1004. <div class="l3"></div>
  1005. <div class="navbox3">
  1006. <div class="navigationtitle">{text:Link 3 Title}</div>
  1007. </div>
  1008. </div>
  1009.  
  1010. <div class="both4">
  1011. <a href="{text:Link 4}"><div class="circle4"></div></a>
  1012. <div class="l4"></div>
  1013. <div class="navbox4">
  1014. <div class="navigationtitle">{text:Link 4 Title}</div>
  1015. </div>
  1016. </div>
  1017.  
  1018.  
  1019. <div class="line"></div>
  1020. <div class="line2"></div>
  1021.  
  1022. {block:ifnotinfinitescroll}
  1023. {block:Pagination}
  1024.  
  1025. <div id="paginwrapper">
  1026. {block:PreviousPage}<a href="{PreviousPage}" class="jump_page class2">←</a>{/block:PreviousPage}
  1027. {block:JumpPagination length="0"}
  1028. {block:CurrentPage}<span class="current_page">{PageNumber}</span>{/block:CurrentPage}
  1029. {block:JumpPage}<a class="jump_page class2" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  1030. {block:NextPage}<a href="{NextPage}" class="jump_page class2">→</a>{/block:NextPage}
  1031.  
  1032. </div>
  1033. {/block:Pagination}
  1034. {/block:ifnotinfinitescroll}
  1035.  
  1036. </div><!--container-->
  1037.  
  1038. <div id="content">
  1039. {block:Posts}
  1040.  
  1041. <div class="entry">
  1042.  
  1043. {block:IndexPage}
  1044.  
  1045. <div class="perma">
  1046. <a href="{Permalink}" title="{NoteCount}"><div class="permanumber"><div class="permanumberline"></div></div></a>
  1047.  
  1048. <a href="{ReblogURL}" title="reblog" target="_blank"><div class="permareblog"><div class="permareblogline"></div></div></a>
  1049.  
  1050. </span></div>
  1051.  
  1052. {/block:IndexPage}
  1053.  
  1054. {block:Text}
  1055. <div class="title">{Title}</div>{Body}
  1056. {/block:Text}
  1057.  
  1058. {block:Link}
  1059. <a href="{URL}"><span class="title">{Name} &hearts;</span></a>
  1060. {block:Description}{Description}{/block:Description}
  1061. {/block:Link}
  1062.  
  1063. {block:Photo}
  1064. <a href="{Permalink}">
  1065. {block:IndexPage}
  1066. {block:ifposttype1}<center><img src="{PhotoURL-400}"></center>{/block:ifposttype1}
  1067. {block:ifposttype2}<center><img src="{PhotoURL-250}"></center>{/block:ifposttype2}
  1068. {block:ifposttype3}<center><img src="{PhotoURL-250}"></center>{/block:ifposttype3}
  1069. {/block:IndexPage}
  1070. {block:PermalinkPage}
  1071. {block:ifnotposttype1}<center><img src="{PhotoURL-250}"></center>{/block:ifnotposttype1}
  1072. {block:ifposttype1}<center><img src="{PhotoURL-400}"></center>{/block:ifposttype1}
  1073. {/block:PermalinkPage}
  1074. {block:ifCaption}{block:Caption}{Caption}{/block:Caption}{/block:ifCaption}
  1075. {/block:Photo}
  1076.  
  1077. {block:Photoset}
  1078. {block:IndexPage}
  1079. {block:ifposttype1}{Photoset-400}{/block:ifposttype1}
  1080. {block:ifposttype2}{Photoset-250}{/block:ifposttype2}
  1081. {block:ifposttype3}{Photoset-250}{/block:ifposttype3}
  1082. {/block:IndexPage}
  1083. {block:PermalinkPage}
  1084. {block:ifnotposttype1}{Photoset-250}{/block:ifnotposttype1}
  1085. {block:ifposttype1}{Photoset-400}{/block:ifposttype1}
  1086. {/block:PermalinkPage}
  1087. {block:ifCaption}{block:Caption}{Caption}{/block:Caption}{/block:ifCaption}
  1088. {/block:Photoset}
  1089.  
  1090. {block:Quote}
  1091. <div class="quote">{Quote}<div class="source">{Source}</div></div>
  1092. {/block:Quote}
  1093.  
  1094. {block:Chat}
  1095. <div class="title">{Title}</div>{block:Lines}
  1096. <div class="l {Alt}"><div class="{Alt} user_{UserNumber}">
  1097. {block:Label}<b>{Label} </b>{/block:Label}
  1098. {Line}</div></div>{/block:Lines}
  1099. {/block:Chat}
  1100.  
  1101. {block:Audio}
  1102. {block:AlbumArt}
  1103. <div class="artcover"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}
  1104. <div class="player"><div class="audioplayer">{AudioPlayerWhite}</div></div>
  1105. <div class="audioinfo">
  1106. <div class="i"><b>TITLE:</b>
  1107. <span{block:TrackName} style="display:none;"{block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}</div>
  1108.  
  1109. <div class="i"><b>ARTIST:</b>
  1110. <span{block:Artist} style="display:none;"{block:Artist}>Unknown</span> {block:Artist}{Artist}{/block:Artist}</div>
  1111.  
  1112. <div class="i"><b>PLAYS:</b>
  1113. <span{block:PlayCount} style="display: none;"{block:PlayCount}>Unknown</span> {block:PlayCount}{PlayCount}{/block:PlayCount}</div></div>
  1114. {block:ifCaption}{block:Caption}{Caption}{/block:Caption}{/block:ifCaption}{/block:Audio}
  1115.  
  1116. {block:Video}
  1117. {block:IndexPage}
  1118. {block:ifposttype1}{Video-400}{/block:ifposttype1}
  1119. {block:ifposttype2}{Video-250}{/block:ifposttype2}
  1120. {block:ifposttype3}{Video-250}{/block:ifposttype3}
  1121. {/block:IndexPage}
  1122. {block:PermalinkPage}
  1123. {block:ifnotposttype1}{Video-250}{/block:ifnotposttype1}
  1124. {block:ifposttype1}{Video-400}{/block:ifposttype1}
  1125. {/block:PermalinkPage}
  1126. {block:ifCaption}{block:Caption}{Caption}{/block:Caption}{/block:ifCaption}
  1127. {/block:Video}
  1128.  
  1129. {block:Answer}
  1130. <div class="quote">{Question} → <b>{Asker}</b></div>
  1131. <div class="answer">{Answer}</div>
  1132. {/block:Answer}
  1133.  
  1134. <div id="permalink">
  1135. <div class="tags">
  1136. {block:IfShowTags}
  1137. {block:HasTags}
  1138. {block:Tags}<span style="{color:post border};"</span>
  1139. <a href="{TagURL}">#{Tag}</a>
  1140. {/block:Tags}
  1141. {/block:HasTags}
  1142. {/block:IfShowTags}
  1143. </div></div>
  1144. {/block:IndexPage}
  1145.  
  1146. {block:PermalinkPage}
  1147. <div id="permalink">
  1148. {block:Date}posted
  1149. <a href="{Permalink}">{Month} {DayOfMonthWithZero}</a>{/block:Date}
  1150. {block:NoteCount}with
  1151. <a href="{Permalink}">{NoteCountWithLabel}</a>{block:NoteCount}
  1152. {block:RebloggedFrom}
  1153. | via: <a href="{ReblogParentURL}">{ReblogParentName}</a> source: <a href="{ReblogRootURL}">{ReblogRootName}</a>
  1154. {/block:RebloggedFrom}
  1155.  
  1156. <div class="tags">
  1157. {block:HasTags}
  1158. Tagged:
  1159. {block:Tags}<a href="{TagURL}">#{Tag}</a>
  1160. {/block:Tags}
  1161. {/block:HasTags}
  1162. </div></div>
  1163. {/block:PermalinkPage}
  1164.  
  1165. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1166.  
  1167. </div>
  1168. {/block:Posts}
  1169. </div>
  1170.  
  1171.  
  1172. <div class="c">
  1173. <a href="http://nff-themes.tumblr.com"><img src="http://static.tumblr.com/cbjpgjf/hmgmwsd81/yyylamo.png"></a>
  1174. </div>
  1175.  
  1176.  
  1177.  
  1178.  
  1179. </body>
  1180. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement