Advertisement
nofacesface

Flora (Night)

Mar 29th, 2014
2,112
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 30.03 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:Background" content="#1d1c20" />
  11.  
  12. <meta name="color:Link" content="#68847c"/>
  13. <meta name="color:Hover" content="#ffe4dc" />
  14.  
  15. <meta name="color:Pagination Leaf" content="#fefefe" />
  16. <meta name="color:Pagination" content="#68847c" />
  17.  
  18. <meta name="color:Blog Title" content="#313131"/>
  19.  
  20. <meta name="color:Navigation Icon" content="#313131" />
  21. <meta name="color:Navigation Icon Hover" content="#ffe4dc" />
  22. <meta name="color:Navigation BG" content="#fefefe" />
  23. <meta name="color:Navigation BG Hover" content="#313131" />
  24.  
  25. <meta name="color:Description" content="#313131" />
  26. <meta name="color:Music Note" content="#313131" />
  27.  
  28. <meta name="color:Scroll" content="#4e625a" />
  29.  
  30. <meta name="color:Sidebar Image BG" content="#313131" />
  31.  
  32. <meta name="color:Underline" content="#86303a" />
  33. <meta name="color:Bold" content="#fefefe" />
  34. <meta name="color:Bold BG" content="#313131" />
  35. <meta name="color:Italic" content="#8fa994" />
  36. <meta name="color:Post Title" content="#ffe4dc" />
  37.  
  38. <meta name="color:Text" content="#fefefe" />
  39. <meta name="color:Blockquote" content="#313131" />
  40.  
  41. <meta name="color:Permalink Icon" content="#ffe4dc" />
  42. <meta name="color:Permalink Icon Hover" content="#e4785b" />
  43.  
  44. <meta name="color:Pagination" content="86303a" />
  45.  
  46. <meta name="image:Background" content="http://static.tumblr.com/cbjpgjf/ndQn29rgl/dark_wood.png" />
  47.  
  48. <meta name="image:Header Image" content="http://static.tumblr.com/cbjpgjf/J2sn29rfo/sdfghjkjhc.png" />
  49.  
  50. <meta name="text:Music Code" content="" />
  51.  
  52. <meta name="text:Link One URL" content="/" />
  53. <meta name="text:Link One Title" content="refresh" />
  54. <meta name="text:Link Two URL" content="/ask" />
  55. <meta name="text:Link Two Title" content="whisper" />
  56. <meta name="text:Link Three URL" content="/archive" />
  57. <meta name="text:Link Three Title" content="past" />
  58. <meta name="text:Link Four URL" content="/submit" />
  59. <meta name="text:Link Four Title" content="submit" />
  60.  
  61. <meta name="if:caption" content="1"/>
  62. <meta name="if:photoeffect" content="0"/>
  63. <meta name="if:music" content="1"/>
  64. <meta name="if:pagination" content="0"/>
  65. <meta name="if:infinitescroll" content="1"/>
  66. <meta name="if:posttype2" content="0"/>
  67. <meta name="if:posttype1" content="1"/>
  68.  
  69.  
  70. <title>{Title}{block:PostTitle} - {PostTitle}{/block:PostTitle}</title> {block:Description}<meta name=""
  71. content="{MetaDescription}" />{/block:Description}
  72. <link rel="shortcut icon" href="{Favicon}">
  73.  
  74.  <script language="JavaScript" src="http://dl.dropbox.com/u/3173073/GothicDarkness/qTip.js" type="text/JavaScript"></script>
  75.  
  76. <style>
  77.     div#qTip {
  78.     padding: 6px;
  79.     display: none;
  80.     font-style: none;
  81.     text-align: center;
  82.     position: absolute;
  83.     font-family: calibri;
  84.     font-size:9px;
  85.     line-height:10px;
  86.     z-index: 99999999999;
  87.     background-color: rgba(0,0,0,0.7);
  88.     color: {color:Text};
  89.     text-transform:uppercase;
  90.     letter-spacing: 3px;
  91.    
  92.     }
  93.     </style>
  94.    
  95.  
  96. <style type="text/css">
  97.  
  98. @import url(http://weloveiconfonts.com/api/?family=fontawesome);
  99.  
  100. /* fontawesome */
  101. [class*="fontawesome-"]:before {
  102.   font-family: 'FontAwesome', sans-serif;
  103. }
  104.  
  105. #tumblr_controls {
  106. position: fixed !important;
  107. }
  108.  
  109. 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;}
  110.  
  111. 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;}
  112.  
  113.  
  114.  
  115. ::-webkit-scrollbar {width: 3px;height:5px; background: transparent;}
  116. ::-webkit-scrollbar-thumb {background: {color:Scroll};}
  117.  
  118.  
  119.  
  120. /* GENERAL */
  121.  
  122. body{
  123. cursor:crosshair;
  124. margin:0px;
  125. font-family: consolas;
  126. font-style: oblique;
  127. text-transform: lowercase;
  128. font-size: 10px;
  129. letter-spacing: 1px;
  130. line-height: 12px;
  131. color: {color:text};
  132. background-color: {color:Background};
  133. background-image: url({image:Background});
  134. margin: 0;
  135. word-wrap: break-word;
  136. background-attachment: fixed;
  137. overflow-x: hidden;}
  138.  
  139. a:link, a:active, a:visited {
  140. text-decoration: none;
  141. color: {color:Link};
  142. cursor: help;
  143. -webkit-transition: all 0.7s ease;
  144. transition: all 0.7s ease;
  145. -moz-transition: all 0.7s ease;
  146. -o-transition: all 0.7s ease;}
  147.  
  148. a:hover { color: {color:Hover};}
  149.  
  150. a.class1 { color:{color:Navigation Icon}; cursor: help;}
  151. a.class1:link  
  152. a.class1:active
  153. a.class1:visited {
  154. text-decoration: none;
  155. color: {color:Navigation Icon};
  156. -webkit-transition: all 0.7s ease;
  157. transition: all 0.7s ease;
  158. -moz-transition: all 0.7s ease;
  159. -o-transition: all 0.7s ease;}
  160.  
  161. a.class1:hover{ color: {color:Navigation Icon Hover};}
  162.  
  163. a.class2 { color:{color:Permalink Icon}; cursor: help;}
  164. a.class2:link  
  165. a.class2:active
  166. a.class2:visited {
  167. text-decoration: none;
  168. color: {color:Permalink Icon};
  169. -webkit-transition: all 0.7s ease;
  170. transition: all 0.7s ease;
  171. -moz-transition: all 0.7s ease;
  172. -o-transition: all 0.7s ease;}
  173.  
  174. a.class2:hover{ color: {color:Permalink Icon Hover};}
  175.  
  176. /* POSTS */
  177.  
  178. #content{
  179. position: relative;
  180. margin-top:30px;
  181. margin-left: auto;
  182. margin-right: auto;
  183. {block:ifposttype1}
  184. width: 250px;
  185. {/block:ifposttype1}
  186. {block:ifposttype2}
  187. width: 400px;
  188. {/block:ifposttype2}
  189. padding-right: 20px ;}
  190.    
  191. .entry{
  192. position: relative;
  193. {block:ifposttype1}
  194. width: 250px;
  195. {/block:ifposttype1}
  196. {block:ifposttype2}
  197. width: 400px;
  198. {/block:ifposttype2}
  199. margin: 10px 10px;
  200. background: #111;
  201. padding: 20px;
  202. -webkit-transition: all 0.7s ease-in-out;
  203. -moz-transition: all 0.7s ease-in-out;
  204. -o-transition: all 0.7s ease-in-out;
  205. -ms-transition: all 0.7s ease-in-out;
  206. transition: all 0.7s ease-in-out;
  207. {block:ifphotoeffect}  
  208. opacity: 1;
  209. -webkit-filter: grayscale(100%);
  210. {/block:ifphotoeffect}}
  211.  
  212. .entry img{
  213. max-width:100%;
  214. opacity: 1px;}
  215.  
  216. {block:IndexPage}
  217. .entry:hover {
  218. -webkit-filter:none;
  219. opacity: .8;}
  220. {/block:IndexPage}
  221.  
  222. /* SIDEBAR */
  223.  
  224. #center {
  225. {block:ifposttype1}
  226. width: 250px;
  227. {/block:ifposttype1}
  228. {block:ifposttype2}
  229. width: 400px;
  230. {/block:ifposttype2}
  231. height: 110px;
  232. margin-left: auto;
  233. margin-right: auto;
  234. position: relative;
  235. z-index: 999;}
  236.  
  237. #sidebar {
  238. position:fixed;
  239. margin-left:0px;
  240. {block:ifposttype1}
  241. width: 290px;
  242. {/block:ifposttype1}
  243. {block:ifposttype2}
  244. width: 440px;
  245. {/block:ifposttype2}
  246. height: 20px;
  247. top:110px;
  248. z-index: 999;}
  249.  
  250. .top {
  251. overflow: hidden;
  252. position: absolute;
  253. margin-top:10px;
  254. margin-left:0px;
  255. {block:ifposttype1}
  256. width: 290px;
  257. {/block:ifposttype1}
  258. {block:ifposttype2}
  259. width: 440px;
  260. {/block:ifposttype2}
  261. height:90px;
  262. border-radius: 3px;
  263. background: rgba(0,0,0,.7);}
  264.  
  265. .hibiscus {
  266. position: absolute;
  267. width: 68px;
  268. height: 68px;
  269. margin-left:11px;
  270. margin-top: 11px;
  271. opacity: 1;
  272. border-top-left-radius: 900px;
  273. border-bottom-left-radius: 900px;
  274. border-bottom-right-radius: 900px;
  275. background: {color:Sidebar Image BG};
  276. -webkit-transition: opacity .7s linear;
  277. -webkit-transition: all .7s ease-in-out;
  278. -moz-transition: all .7s ease-in-out;
  279. -o-transition: all .7s ease-in-out;}
  280.  
  281. .flora {
  282. position: absolute;
  283. overflow: hidden;
  284. width: 60px;
  285. height: 60px;
  286. margin-left:4px;
  287. margin-top: 4px;
  288. opacity: 1;
  289. border-top-left-radius: 900px;
  290. border-bottom-left-radius: 900px;
  291. border-bottom-right-radius: 900px;
  292. -webkit-transition: opacity .7s linear;
  293. -webkit-transition: all .7s ease-in-out;
  294. -moz-transition: all .7s ease-in-out;
  295. -o-transition: all .7s ease-in-out;}
  296.  
  297. .flora img {
  298. width: 100%;
  299. height: 60px;}
  300.  
  301. .alyssum {
  302. position: absolute;
  303. margin-left: 78px;
  304. margin-top: 0px;
  305. {block:ifposttype1}
  306. width: 190px;
  307. {/block:ifposttype1}
  308. {block:ifposttype2}
  309. width: 340px;
  310. {/block:ifposttype2}
  311. height: 70px;
  312. overflow: auto;}
  313.  
  314. .description {
  315. text-align: justify;
  316. color: {color:Description};
  317. font-family: consolas;
  318. font-style: normal;
  319. font-size: 10px;
  320. letter-spacing: 1px;
  321. line-height: 14px;
  322. padding: 5px;
  323. text-transform: lowercase;
  324. margin-top: 0px;}
  325.  
  326. .bouquet {
  327. position: absolute;
  328. {block:ifposttype1}
  329. width: 160px;
  330. {/block:ifposttype1}
  331. {block:ifposttype2}
  332. width: 310px;
  333. {/block:ifposttype2}
  334. height: 20px;
  335. background-color: rgba(0,0,0,0.7);
  336. margin: 0px;
  337. overflow: hidden;}
  338.  
  339. .blogtitle {
  340. color: {color:Blog Title};
  341. text-align: center;
  342. font-family: calibri;
  343. font-size: 11px;
  344. font-style: normal;
  345. text-transform: none;
  346. padding: 5px;
  347. line-height: 12px;
  348. text-transform: uppercase;
  349. letter-spacing: 6px;}
  350.  
  351. /* MUSIC PLAYER */
  352.  
  353. .melody {
  354. background-color: rgba(0,0,0,0.6);
  355. overflow: hidden;
  356. position:absolute;
  357. height: 50px;
  358. width: 50px;
  359. border-top-left-radius: 200px;
  360. border-bottom-left-radius: 200px;
  361. border-bottom-right-radius: 200px;
  362. margin-top: 10px;
  363. margin-left: 10px;
  364. z-index: 9999;}
  365.  
  366. .reverberate {
  367. position:absolute;
  368. height: 14px;
  369. width: 14px;
  370. margin-top: 0px;
  371. margin-left: 0px;
  372. padding: 18px;
  373. font-size: 13px;
  374. font-style: normal;
  375. color: {color:Music Note};
  376. -webkit-transition: opacity .7s linear;
  377. -webkit-transition: all .7s ease-in-out;
  378. -moz-transition: all .7s ease-in-out;
  379. -o-transition: all .7s ease-in-out;}
  380.  
  381. .melody:hover .reverberate {
  382. margin-top: -50px;}
  383.  
  384. .harmony {
  385. overflow: hidden;
  386. position:absolute;
  387. height: 50px;
  388. width: 20px;
  389. margin-top: 50px;
  390. margin-left: 15px;
  391. -webkit-transition: opacity .7s linear;
  392. -webkit-transition: all .7s ease-in-out;
  393. -moz-transition: all .7s ease-in-out;
  394. -o-transition: all .7s ease-in-out;}
  395.  
  396. .melody:hover .harmony {
  397. margin-top: 0px;}
  398.  
  399. .rhythm {
  400. position:absolute;
  401. height: 25px;
  402. width: 30px;
  403. margin-top: 18px;
  404. margin-left: -20px;}
  405.  
  406. /* NAVIGATION */
  407.  
  408. .rose {
  409. position: absolute;
  410. {block:ifposttype1}
  411. margin-left: 180px;
  412. {/block:ifposttype1}
  413. {block:ifposttype2}
  414. margin-left: 330px;
  415. {/block:ifposttype2}
  416. margin-top: 0px;
  417. height: 20px;
  418. width: 110px;
  419. background: none;}
  420.  
  421. .parent:hover > div { opacity: .1 ;}
  422.  
  423. .parent:hover > div:hover {
  424. opacity: 1.0;
  425. background: {color:Navigation BG Hover};}
  426.  
  427. .petal_one, .petal_two, .petal_three, .petal_four {
  428. opacity: 1;  
  429. position: absolute;
  430. height: 18px;
  431. width: 18px;
  432. padding: 1px;
  433. background: {color:Navigation BG};
  434. border-radius: 2px;
  435. margin-top: 0px;
  436. -webkit-transition: opacity .5s linear;
  437. -webkit-transition: all .5s ease-in-out;
  438. -moz-transition: all .5s ease-in-out;
  439. -o-transition: all .5s ease-in-out;}
  440.  
  441. .petal_one:hover, .petal_two:hover, .petal_three:hover, .petal_four:hover { opacity: .5;}
  442.  
  443. .petal_one { margin-left: 0px;}
  444.  
  445. .petal_two { margin-left: 30px;}
  446.  
  447. .petal_three { margin-left: 60px;}
  448.  
  449. .petal_four { margin-left: 90px;}
  450.  
  451. .icons {
  452. font-style: normal;
  453. text-align: center;
  454. font-size: 11px;
  455. padding: 0px;
  456. line-height: 20px;
  457. word-spacing: 10px;}
  458.  
  459. /* TITLES */
  460.  
  461. .title {
  462. text-align: center;
  463. font-family:calibri;
  464. padding: 10px;
  465. font-style: normal;
  466. font-size:11px;
  467. line-height: 17px;
  468. letter-spacing: 5px;
  469. text-transform: uppercase;
  470. color: {color:Post Title};}
  471.  
  472. .quote {
  473. background: {color:Post BG};
  474. padding:25px;
  475. font-size:10px;
  476. letter-spacing: 0px;
  477. text-transform:none;
  478. color: {color:Text};}
  479.  
  480. .source {
  481. font-size:8px;
  482. letter-spacing: 2px;
  483. text-align:right; }
  484.  
  485. /* PERMALINKS */
  486.  
  487. .like_button {
  488. position:relative;
  489. display:inline-block;
  490. cursor:pointer!important;
  491. overflow:hidden;}
  492. .like_button iframe {
  493. position:absolute;
  494. top:0;
  495. left:0;
  496. width:100%;
  497. height:100%;
  498. opacity:0;}
  499. .like_button::before {
  500. content:'♥';
  501. color: {color:Permalink Icon};
  502. font-family:'calibri'!important;
  503. text-transform:lowercase!important;
  504. position:relative;
  505. font-size:13px;
  506. margin-top: 2px;
  507. -webkit-transition: all 0.5s ease-in-out;
  508. -moz-transition: all 0.5s ease-in-out;
  509. -o-transition: all 0.5s ease-in-out;
  510. -ms-transition: all 0.5s ease-in-out;
  511. transition: all 0.5s ease-in-out;}
  512. .like_button:hover::before, .like_button.liked::before {
  513. color: {color:Permalink Icon Hover};
  514. cursor:pointer!important;
  515. -webkit-transition: all 0.5s ease-in-out;
  516. -moz-transition: all 0.5s ease-in-out;
  517. -o-transition: all 0.5s ease-in-out;
  518. -ms-transition: all 0.5s ease-in-out;
  519. transition: all 0.5s ease-in-out;}
  520.  
  521. .entry:hover #perma  {
  522. opacity:1;
  523. -webkit-transition: all 0.9s ease;
  524. -moz-transition: all 0.9s ease;
  525. height: 100%;}
  526.  
  527. #perma {
  528. top: 0;
  529. left:0;
  530. z-index:999;
  531. text-align: center;
  532. position: absolute;
  533. background: rgba(0,0,0,0.7);
  534. {block:ifposttype1}
  535. width: 290px;
  536. {/block:ifposttype1}
  537. {block:ifposttype2}
  538. width: 440px;
  539. {/block:ifposttype2}
  540. height: 100%;
  541. opacity:0;
  542. -webkit-transition: all 0.9s ease;
  543. -moz-transition: all 0.9s;}
  544.  
  545. .posies {
  546. top: 0%;
  547. margin-left:auto;
  548. margin-right: auto;
  549. z-index:999;
  550. position: relative;
  551. background: none;
  552. opacity:1;
  553. -webkit-transition: all 0.9s ease;
  554. -moz-transition: all 0.9s;}
  555.  
  556. .entry:hover .posies { top: 50%;}
  557.  
  558. .poppies {
  559. margin-top: 0px;
  560. margin-left:auto;
  561. margin-right: auto;
  562. z-index:999;
  563. position: relative;
  564. background: none;
  565. width: 100px;
  566. height: 20px;
  567. opacity:1;  
  568. text-align: center;
  569. word-spacing: 5px;
  570. font-size: 13px;
  571. font-style: normal;}
  572.  
  573. .entry:hover #txtperma  {
  574. opacity:1;
  575. -webkit-transition: all 0.9s ease;
  576. -moz-transition: all 0.9s ease;
  577. height: 25px;}
  578.  
  579. #txtperma {
  580. overflow: hidden;
  581. bottom: 0;
  582. left:0;
  583. z-index:999;
  584. text-align: center;
  585. position: absolute;
  586. background: rgba(0,0,0,0.7);
  587. {block:ifposttype1}
  588. width: 290px;
  589. {/block:ifposttype1}
  590. {block:ifposttype2}
  591. width: 440px;
  592. {/block:ifposttype2}
  593. height: 25px;
  594. opacity:0;
  595. -webkit-transition: all 0.7s ease;
  596. -moz-transition: all 0.7s;}
  597.  
  598. .txtposies {
  599. top: 50px;
  600. margin-left:auto;
  601. margin-right: auto;
  602. z-index:999;
  603. position: relative;
  604. opacity:1;
  605. -webkit-transition: all 0.9s ease;
  606. -moz-transition: all 0.9s;}
  607.  
  608. .entry:hover .txtposies { top: 5px;}
  609.  
  610. .txtpoppies {
  611. margin-top: 0px;
  612. margin-left: auto;
  613. margin-right: auto;
  614. z-index:999;
  615. position: relative;
  616. background: none;
  617. width: 100px;
  618. height: 5px;
  619. opacity:1;  
  620. text-align: center;
  621. word-spacing: 5px;
  622. font-size: 13px;
  623. font-style: normal;}
  624.  
  625. #permalink {
  626. {block:PermalinkPage}
  627. text-align:center;
  628. margin-top:15px;
  629. padding:10px;
  630. font-size:11px;
  631. letter-spacing: 2px;
  632. text-transform:lowercase;
  633. color: {color:Text};
  634. {/block:PermalinkPage}}
  635.  
  636. .tags { padding: 10px;}
  637.  
  638. /* PAGINATION */
  639.  
  640. .stem {
  641. position: fixed;
  642. z-index: 9999;
  643. {block:ifposttype1}
  644. width: 290px;
  645. {/block:ifposttype1}
  646. {block:ifposttype2}
  647. width: 440px;
  648. {/block:ifposttype2}
  649. height: 20px;
  650. bottom: -30px;
  651. border: 2px;
  652. margin-left: 10px;
  653. background: rgba(0,0,0,0.7);
  654. -webkit-transition: all 0.7s ease;
  655. -moz-transition: all 0.7s;
  656. }
  657.  
  658. #content:hover .stem {
  659. bottom: 10px;
  660. }
  661.  
  662. .paginwrapper {
  663.     background-color: none;
  664.     position: relative;
  665.     margin-left: auto;
  666.     margin-right: auto;
  667.     height: 20px;
  668.     width: 150px;
  669.     margin-top: 5px;
  670.     z-index: 999;
  671.   -webkit-transition: all 0.7s ease;
  672. -moz-transition: all 0.7s;
  673. }
  674.  
  675. .current_page, .jump_page:hover {
  676. padding: 5px;
  677. color: {color:Pagination Leaf};
  678. font-size:9px;
  679. text-decoration:none;
  680. font-family: consolas;
  681. font-style: normal;
  682. text-align: center;
  683. }
  684.  
  685. .jump_page {
  686. padding: 5px;
  687. color: {color:Pagination};
  688. font-size:9px;
  689. text-decoration:none;
  690. font-family: consolas;
  691. font-style: normal;
  692. text-align: center;
  693. }
  694.  
  695. /* AUDIO */
  696.  
  697. .newplayerbutton {
  698. position: relative;
  699. width: 28px;
  700. height: 27px;
  701. overflow: hidden;}
  702.            
  703. .playerbuttonhug {
  704. position: absolute;
  705. top: -11px;
  706. left: -10px;}
  707.  
  708. .tumblr_audio_player {
  709. border: none;
  710. padding: 0px;
  711. margin-top: 0px;
  712. margin-left: 11px;
  713. height: 50px;
  714. width: 250px;}
  715.  
  716. .playerbuttonbg {
  717. position: absolute;
  718. left: 20px;
  719. top: 20px;
  720. width: 28px;
  721. height: 28px;
  722. background-color: #ffffff;
  723. padding: 10px;
  724. opacity: .4;
  725. filter: alpha(opacity=40);
  726. -moz-opacity: 0.4;
  727. -khtml-opacity: 0.4;
  728. transition: opacity .7s ease-in-out;
  729. -moz-transition: opacity .7s ease-in-out;
  730. -webkit-transition: opacity .7s ease-in-out;}
  731.            
  732. .playerbuttonbg:hover {
  733. opacity: .9;
  734. filter: alpha(opacity=100);
  735. -moz-opacity: 1;
  736. -khtml-opacity: 1;}
  737.  
  738. .audioimgwrapper {
  739. position: absolute;
  740. left: 5px;
  741. top: 5px;
  742. overflow: hidden;
  743. width: 78px;
  744. height: 78px;}
  745.            
  746. .audioimgwrapper img {
  747. width: 100%;
  748. height: auto;}
  749.            
  750. .trackdetails {
  751. display:inline-block;
  752. margin-left: 100px;
  753. top: 10px;
  754. width: 140px;
  755. min-height: 85px; }
  756.            
  757. .audiowrapper {
  758. padding: 5px;
  759. position: relative;
  760. display:inline-block;
  761. width: 210px;}
  762.  
  763. /* TEXT */
  764.  
  765. i, em { color:{color:Italic};}
  766.  
  767. b, strong {
  768. color:{color:Bold};
  769. letter-spacing: 3px;}
  770.  
  771. ul,ol {
  772. margin-top: 0px;
  773. margin-left: 25px;
  774. padding: 5px;}
  775.  
  776. p {
  777. margin-top:5px;
  778. padding: 5px;
  779. }
  780.    
  781. u {
  782. text-decoration:none;
  783. color: {color:Underline};
  784. letter-spacing: 1px;
  785. border-bottom:1px solid {color:Underline};}
  786.  
  787. blockquote {
  788. border-left: 2px solid {color:Blockquote};
  789.     margin: 3px;
  790.     padding: 2px 5px;
  791. }
  792.  
  793. .text {
  794.     padding: 5px
  795.     text-align: justify;
  796. }
  797.  
  798. .answer {
  799. margin-top: 0px;
  800. padding: 5px;}
  801.  
  802. /* MISC */
  803.  
  804. #warning {
  805. z-index: -10000;
  806. position: fixed;
  807. top: 0;left: 0;
  808. width: 100%;
  809. height: 100%;
  810. background-color: rgba(255,255,255,0.8);
  811. color: #000;
  812. text-align: center;
  813. text-transform: uppercase;
  814. padding-top: 250px;
  815. font-family: consolas;
  816. font-size: 13px;
  817. letter-spacing: 4px;
  818. opacity: 0;
  819. {block:ifposttype1}{block:ifposttype2}
  820. opacity: 1;z-index:10000;
  821. {/block:ifposttype2}{/block:ifposttype1}
  822. {block:ifnotposttype1}{block:ifnotposttype2}
  823. opacity: 1;z-index:10000;
  824. {/block:ifnotposttype2}{/block:ifnotposttype1}}
  825.  
  826. .c img {
  827. padding-left: 2.5px;
  828. padding-top: 2px;
  829. border-radius: 250px;
  830. opacity: 0;
  831. width:25px;
  832. height: 25px;
  833. -webkit-transition: 0.5s ease;transition: 0.5s ease;
  834. -o-transition: 0.5s ease;-moz-transition: 0.5s ease;}
  835.  
  836. .c {
  837. z-index: 99999;
  838. overflow: hidden;
  839. position:fixed;
  840. right:7px;
  841. bottom:7px;
  842. background-color: rgba(255,255,255,0.2);
  843. width: 30px;
  844. height: 30px;
  845. border-radius: 250px;}
  846.  
  847. .c img:hover {  opacity: 1;}
  848.  
  849. .l .odd {
  850. display:block;
  851. padding:5px;}
  852.  
  853. .l .even {
  854. display:block;
  855. background: rgba(0,0,0,0.7);
  856. padding:5px;}
  857.  
  858. #s-m-t-tooltip {
  859. display:inline-block;
  860. position:absolute;
  861. max-width:300px;
  862. margin:15px;
  863. padding:3px 10px 3px 10px;
  864. z-index:99;
  865. border:1px solid #AAA;
  866. border-radius:10px;
  867. border-top-left-radius:0px;
  868. background:#000;}
  869.  
  870. ::selection {color: {color:Hover};}
  871. ::-moz-selection {color: {color:Hover};}
  872. ::-webkit-selection {color: {color:Hover};}
  873.  
  874. img { margin-bottom:-3px;}
  875.  
  876. /* POSTNOTES */
  877.  
  878. ol.notes a { letter-spacing:2px;}
  879.  
  880. ol.notes {
  881. list-style:none;
  882. font-size: 10px;
  883. letter-spacing: 2px;
  884. line-height: 20px;
  885. margin-top:20px;
  886. text-transform:none;}
  887.  
  888. ol.notes li.note img.avatar {
  889. vertical-align:-5px;
  890. margin-right:5px;
  891. width:15px;
  892. padding:4px;}
  893.  
  894. ol.notes li.note {margin:5px 0px 10px -20px;}
  895. ol.notes li.note span.action {font-style: normal;}
  896. ol.notes li.note .answer_content {font-weight: normal;}
  897. ol.notes li.note blockquote {padding:4px 10px;margin: 10px 0px 0px 25px;}
  898.  
  899. </style>
  900.  
  901. <div class="c">
  902. <a href="http://nff-themes.tumblr.com">
  903. <img src="http://static.tumblr.com/cbjpgjf/hmgmwsd81/yyylamo.png">
  904. </a>
  905. </div>
  906.  
  907. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
  908.  
  909. <script type="text/javascript">
  910. $(document).ready(function() {    
  911.     $(window).scroll(function() {        
  912.         navigationx.scroll();    
  913.         });
  914.         });  
  915.         var navigationx = {    
  916.             settings : {        
  917.                 offsetx: 110,
  918.                 },    
  919.                 scroll : function() {        
  920.                     var scroll_top = $(window).scrollTop(); // current vertical position from the top          
  921. if( scroll_top > navigationx.settings.offsetx ) {            
  922.     $('#sidebar').css({ 'position': 'fixed', 'top': '10' + 'px' });        
  923.     } else {            
  924.         $('#sidebar').css({ 'position': 'absolute', 'top': navigationx.settings.offsetx + 'px' });        
  925.         }    
  926.         }
  927.         };
  928. </script>
  929.  
  930. </head>
  931. <body>
  932.  
  933. <div id="warning">please select only one post size</div>
  934.  
  935. <div id="center">
  936. <div class="top">
  937.  
  938. <div class="hibiscus">
  939.  
  940. {block:ifmusic}
  941. <div class="melody">
  942. <div class="reverberate">
  943. <span class="fontawesome-music"></span>
  944. </div><!--reverberate-->
  945. <div class="harmony">
  946. <div class="rhythm">
  947. {text:Music Code}
  948. </div><!--rhythm-->    
  949. </div><!--harmony-->
  950. </div><!--melody-->
  951.     {/block:ifmusic}
  952.    
  953. <div class="flora"><img src="{image:Header Image}"></div>
  954. <div class="alyssum">
  955. <div class="description">{Description}</div>
  956. </div>
  957. </div>
  958. </div>
  959.  
  960. <div id="sidebar">
  961. <div class="bouquet">
  962. <div class="blogtitle">{Title}</div>    
  963. </div>
  964.  
  965. <div class="rose">
  966. <section class="parent">
  967.  
  968. <div class="petal_one">
  969. <a href="{text:Link One URL}" title="{text:Link One Title}" class="class1"><div class="icons">
  970. <span class="fontawesome-home"></span>
  971. </div>
  972. </a>
  973. </div>
  974.  
  975. <div class="petal_two">
  976. <a href="{text:Link Two URL}" title="{text:Link Two Title}" class="class1">
  977. <div class="icons">
  978. <span class="fontawesome-envelope"></span>
  979. </div>
  980. </a>
  981. </div>
  982.  
  983. <div class="petal_three">
  984. <a href="{text:Link Three URL}" title="{text:Link Three Title}" class="class1" >
  985. <div class="icons">
  986. <span class="fontawesome-calendar"></span>
  987. </div>
  988. </a>
  989. </div>
  990.  
  991. <div class="petal_four">
  992. <a href="{text:Link Four URL}" title="{text:Link Four Title}" class="class1" >
  993. <div class="icons">
  994. <span class="fontawesome-comment"></span>
  995. </div>
  996. </a>
  997. </div>
  998.  
  999. </section>
  1000. </div>
  1001.  
  1002. </div>
  1003. </div>
  1004. </div>
  1005.  
  1006. <div id="content">
  1007.  
  1008. {block:ifpagination}
  1009. {block:indexpage}
  1010. <div class="stem">
  1011.     <div class="paginwrapper">
  1012. {block:PreviousPage}<a href="{PreviousPage}" class="jump_page class2"><span class="fontawesome-chevron-left"></span></a>{/block:PreviousPage}
  1013. {block:JumpPagination length="5"}
  1014. {block:CurrentPage}<span class="current_page"><span class="fontawesome-leaf"></span>{/block:CurrentPage}
  1015. {block:JumpPage}<a class="jump_page class2" href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  1016. {block:NextPage}<a href="{NextPage}" class="jump_page class2"><span class="fontawesome-chevron-right"></span></a>{/block:NextPage}
  1017.  </div>
  1018. </div>
  1019. {/block:indexpage}
  1020. {/block:ifpagination}
  1021.  
  1022. {block:Posts}
  1023.  
  1024. <div class="entry">
  1025.  
  1026. {block:Text}
  1027. {block:IndexPage}
  1028. <div id="txtperma">
  1029. <div class="txtposies">
  1030. <div class="txtpoppies">
  1031. <a href="{ReblogURL}" target="_blank" class="class2"><span class="fontawesome-retweet"></span></a>
  1032. <a href="{Permalink}" class="class2"><span class="fontawesome-link"></span></a>
  1033. {LikeButton}
  1034. </div>    
  1035. </div>
  1036. </div>
  1037. {/block:IndexPage}
  1038. {block:Title}
  1039. <div class="title">{Title}</div>{/block:Title}
  1040. <div class="text">{Body}</div>
  1041. {/block:Text}
  1042.  
  1043. {block:Link}
  1044. {block:IndexPage}
  1045. <div id="txtperma">
  1046. <div class="txtposies">
  1047. <div class="txtpoppies">
  1048. <a href="{ReblogURL}" target="_blank" class="class2"><span class="fontawesome-retweet"></span></a>
  1049. <a href="{Permalink}" class="class2"><span class="fontawesome-link"></span></a>
  1050. {LikeButton}
  1051. </div>    
  1052. </div>
  1053. </div>
  1054. {/block:IndexPage}
  1055. <a href="{URL}"><div class="title">
  1056. {Name} <span class="fontawesome-caret-right"></span>
  1057. </div></a>
  1058. {block:Description}
  1059. <div class="text">{Description}</div>
  1060. {/block:Description}
  1061. {/block:Link}
  1062.  
  1063. {block:Photo}
  1064. {block:IndexPage}
  1065. <div id="perma">
  1066. <div class="posies">
  1067. <div class="poppies">
  1068. <a href="{ReblogURL}" target="_blank" class="class2"><span class="fontawesome-retweet"></span></a>
  1069. <a href="{Permalink}" class="class2"><span class="fontawesome-link"></span></a>
  1070. {LikeButton}
  1071. </div>    
  1072. </div>
  1073. </div>
  1074. {/block:IndexPage}
  1075. <a href="{Permalink}">
  1076. {block:IndexPage}
  1077. {block:ifposttype1}
  1078. <center><img src="{PhotoURL-250}"></a></center>
  1079. {/block:ifposttype1}
  1080. {block:ifposttype2}
  1081. <center><img src="{PhotoURL-400}"></a></center>
  1082. {/block:ifposttype2}
  1083. {/block:IndexPage}
  1084. {block:PermalinkPage}
  1085. {block:ifposttype1}
  1086. <center><img src="{PhotoURL-250}"></a></center>
  1087. {/block:ifposttype1}
  1088. {block:ifposttype2}
  1089. <center><img src="{PhotoURL-400}"></a></center>
  1090. {/block:ifposttype2}
  1091. {/block:PermalinkPage}
  1092. {block:ifCaption}{block:Caption}
  1093. <div class="text">{Caption}</div>
  1094. {/block:Caption}{/block:ifCaption}
  1095. {/block:Photo}
  1096.  
  1097. {block:Photoset}
  1098. {block:IndexPage}
  1099. <div id="perma">
  1100. <div class="posies">
  1101. <div class="poppies">
  1102. <a href="{ReblogURL}" target="_blank" class="class2"><span class="fontawesome-retweet"></span></a>
  1103. <a href="{Permalink}" class="class2"><span class="fontawesome-link"></span></a>
  1104. {LikeButton}
  1105. </div>    
  1106. </div>
  1107. </div>
  1108. {/block:IndexPage}
  1109. {block:IndexPage}
  1110. <center>
  1111. {block:ifposttype1}
  1112. {Photoset-250}
  1113. {/block:ifposttype1}
  1114. {block:ifposttype2}
  1115. {Photoset-400}
  1116. {/block:ifposttype2}
  1117. </center>
  1118. {/block:IndexPage}
  1119. {block:PermalinkPage}
  1120. {block:ifposttype1}
  1121. <center>{Photoset-250}</center>
  1122. {/block:ifposttype1}
  1123. {block:ifposttype2}
  1124. <center>{Photoset-400}</center>
  1125. {/block:ifposttype2}
  1126. {/block:PermalinkPage}
  1127. {block:ifCaption}{block:Caption}<div class="text">{Caption}</div>{/block:Caption}{/block:ifCaption}
  1128. {/block:Photoset}
  1129.  
  1130. {block:Quote}
  1131. {block:IndexPage}
  1132. <div id="txtperma">
  1133. <div class="txtposies">
  1134. <div class="txtpoppies">
  1135. <a href="{ReblogURL}" target="_blank" class="class2"><span class="fontawesome-retweet"></span></a>
  1136. <a href="{Permalink}" class="class2"><span class="fontawesome-link"></span></a>
  1137. {LikeButton}
  1138. </div>    
  1139. </div>
  1140. </div>
  1141. {/block:IndexPage}
  1142. <div class="quote">{Quote}<div class="source">{Source}</div></div>
  1143. {/block:Quote}
  1144.  
  1145. {block:Chat}
  1146. {block:IndexPage}
  1147. <div id="txtperma">
  1148. <div class="txtposies">
  1149. <div class="txtpoppies">
  1150. <a href="{ReblogURL}" target="_blank" class="class2"><span class="fontawesome-retweet"></span></a>
  1151. <a href="{Permalink}" class="class2"><span class="fontawesome-link"></span></a>
  1152. {LikeButton}
  1153. </div>    
  1154. </div>
  1155. </div>
  1156. {/block:IndexPage}
  1157. {block:Title}<div class="title">{Title}</div>{/block:Title}
  1158. {block:Lines}
  1159. <div class="l {Alt}"><div class="{Alt} user_{UserNumber}">
  1160. {block:Label}<i>{Label} </i>{/block:Label}
  1161. {Line}</div></div>{/block:Lines}
  1162. {/block:Chat}
  1163.  
  1164. {block:AudioPlayer}
  1165. {block:IndexPage}
  1166. <div id="txtperma">
  1167. <div class="txtposies">
  1168. <div class="txtpoppies">
  1169. <a href="{ReblogURL}" target="_blank" class="class2"><span class="fontawesome-retweet"></span></a>
  1170. <a href="{Permalink}" class="class2"><span class="fontawesome-link"></span></a>
  1171. {LikeButton}
  1172. </div>    
  1173. </div>
  1174. </div>
  1175. {/block:IndexPage}
  1176.  
  1177. <div class="audiowrapper">
  1178. {block:AlbumArt}
  1179. <div class="audioimgwrapper"><img src="{AlbumArtURL}"></div>
  1180. {/block:AlbumArt}
  1181.  
  1182. <div class="playerbuttonbg">
  1183. <div class="newplayerbutton">
  1184. <div class="playerbuttonhug">
  1185. {AudioPlayerWhite}
  1186. </div>
  1187. </div>
  1188. </div>
  1189.        
  1190. <div class="trackdetails">
  1191.            
  1192. {block:TrackName}<i>TITLE:</i> {TrackName}{/block:TrackName}
  1193. <br><br>
  1194. {block:Artist}<i>ARTIST:</i> {Artist}{/block:Artist}
  1195. <br><br>
  1196. {block:Album}<i>ALBUM:</i> {Album}{/block:Album}
  1197. <br><br>
  1198. <i>PLAYS:</i> {PlayCountWithLabel}
  1199. </div>
  1200. </div>
  1201. {block:Caption}<div class="text">{Caption}</div>{/block:Caption}
  1202. {/block:AudioPlayer}
  1203.    
  1204. {block:Video}
  1205. {block:IndexPage}
  1206. <div id="txtperma">
  1207. <div class="txtposies">
  1208. <div class="txtpoppies">
  1209. <a href="{ReblogURL}" target="_blank" class="class2"><span class="fontawesome-retweet"></span></a>
  1210. <a href="{Permalink}" class="class2"><span class="fontawesome-link"></span></a>
  1211. {LikeButton}
  1212. </div>    
  1213. </div>
  1214. </div>
  1215. {/block:IndexPage}
  1216. {block:IndexPage}
  1217. {block:ifposttype1}
  1218. <center>{Video-250}</center>
  1219. {/block:ifposttype1}
  1220. {block:ifposttype2}
  1221. <center>{Video-400}</center>
  1222. {/block:ifposttype2}
  1223. {/block:IndexPage}
  1224. {block:PermalinkPage}
  1225. {block:ifposttype1}
  1226. <center>{Video-250}</center>
  1227. {/block:ifposttype1}
  1228. {block:ifposttype2}
  1229. <center>{Video-400}</center>
  1230. {/block:ifposttype2}
  1231. {/block:PermalinkPage}
  1232. {block:ifCaption}{block:Caption}
  1233. <div class="text">{Caption}</div>
  1234. {/block:Caption}{/block:ifCaption}
  1235. {/block:Video}
  1236.  
  1237. {block:Answer}
  1238. {block:IndexPage}
  1239. <div id="txtperma">
  1240. <div class="txtposies">
  1241. <div class="txtpoppies">
  1242. <a href="{ReblogURL}" target="_blank" class="class2"><span class="fontawesome-retweet"></span></a>
  1243. <a href="{Permalink}" class="class2"><span class="fontawesome-link"></span></a>
  1244. {LikeButton}
  1245. </div>    
  1246. </div>
  1247. </div>
  1248. {/block:IndexPage}
  1249. <table style="padding-bottom:2px;margin-bottom:5px;">
  1250. <tr>
  1251. <td style="vertical-align:top;padding-right:15px; width:55px;"><img src="{AskerPortraitURL-64}" style="border-top-left-radius: 500px; border-bottom-left-radius: 500px; border-bottom-right-radius: 500px;"></td>
  1252. <td style="vertical-align:top;"><strong>{Asker} asked:</strong> {Question}</td>
  1253. </tr>
  1254. </table>
  1255. {Answer}
  1256. {/block:Answer}
  1257.  
  1258. {block:PermalinkPage}
  1259.  
  1260. <div id="permalink">
  1261. {block:Date}
  1262. <a href="{Permalink}">{Month} {DayOfMonth}</a>{/block:Date}
  1263. {block:NoteCount} |
  1264. <a href="{Permalink}">{NoteCount}%</a>{block:NoteCount}
  1265. {block:RebloggedFrom}
  1266. | <a href="{ReblogParentURL}" title="{ReblogParentName}" ><span class="fontawesome-reply"></span></a> | <a href="{ReblogRootURL}" title="{ReblogRootName}" >origin</a>
  1267. {/block:RebloggedFrom}
  1268.  
  1269. <div class="tags">
  1270. {block:HasTags}
  1271. Tagged:
  1272. {block:Tags}
  1273. <a href="{TagURL}">#{Tag}</a>
  1274. {/block:Tags}
  1275. {/block:HasTags}
  1276. </div>
  1277.    
  1278. </div>
  1279. {/block:PermalinkPage}
  1280.  
  1281. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1282.  
  1283. </div>
  1284. {/block:Posts}
  1285. </div>
  1286.  
  1287. {block:ifinfinitescroll}
  1288. {block:indexpage}
  1289. <script type="text/javascript" src="http://static.tumblr.com/d0qlne1/DiAl6ekb7/jquery-1.4.2.min.js"></script>
  1290.  
  1291. <script type="text/javascript" src="http://codysherman.com/tools/infinite-scrolling/code"></script>
  1292. <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>
  1293. {/block:indexpage}
  1294. {/block:ifinfinitescroll}
  1295.  
  1296.  
  1297. </body>
  1298. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement