Advertisement
nofacesface

Flora (Day)

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