Advertisement
b0rn-to-be-wild

- Carpe Diem -

Jun 17th, 2015
1,516
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 35.41 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  4.  
  5.  
  6. <!----
  7.  
  8. © borntobewildthemes.tumblr.com | "Carpe Diem"
  9.  
  10. + Please do not redistribute this theme or remove credits.
  11. + You are allowed to make changes as long as you keep our credits.
  12. + If you have any questions or concerns, just contact us.
  13. + Thanks for using our theme! We hope that you enjoy it!
  14.  
  15. ---->
  16.  
  17.  
  18. <html>
  19. <head>
  20.  
  21. <!--Google fonts-->
  22.  
  23. <link href='http://fonts.googleapis.com/css?family=Dosis' rel='stylesheet' type='text/css'>
  24.  
  25. <link href='http://fonts.googleapis.com/css?family=Baumans' rel='stylesheet' type='text/css'>
  26.  
  27. <link href='http://fonts.googleapis.com/css?family=Syncopate' rel='stylesheet' type='text/css'>
  28.  
  29. <link href='http://fonts.googleapis.com/css?family=Julius+Sans+One' rel='stylesheet' type='text/css'>
  30.  
  31. <link href='http://fonts.googleapis.com/css?family=Poiret+One' rel='stylesheet' type='text/css'>
  32.  
  33. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">
  34.  
  35. <meta name="viewport" content="width=device-width, initial-scale=1">
  36.  
  37. <!-- DEFAULT VARIABLES -->
  38. <meta name="image:Background" content=""/>
  39. <meta name="image:Header background" content=""/>
  40. <meta name="image:Avatar" content=""/>
  41.  
  42. <meta name="color:Background" content="#fff" />
  43. <meta name="color:Container background" content="#fff" />
  44. <meta name="color:Menu background" content="#fff" />
  45. <meta name="color:Menu icon" content="#000" />
  46. <meta name="color:Menu icon background" content="#eee" />
  47. <meta name="color:Blog title" content="#000" />
  48. <meta name="color:Blog title background" content="#fff" />
  49. <meta name="color:Search box background" content="#eee" />
  50. <meta name="color:Music player background" content="#eee" />
  51. <meta name="color:Header background" content="#fff" />
  52. <meta name="color:Popup navigation link" content="#000" />
  53. <meta name="color:Post background" content="#fff" />
  54. <meta name="color:Info background" content="#fff" />
  55. <meta name="color:Title" content="#000" />
  56. <meta name="color:Text" content="#eee" />
  57. <meta name="color:Icon" content="#000" />
  58. <meta name="color:Link" content="#000" />
  59. <meta name="color:Hover" content="#eee" />
  60. <meta name="color:Borders" content="#eee" />
  61. <meta name="color:Description" content="#000" />
  62. <meta name="color:Italic" content="#bbb" />
  63. <meta name="color:Bold" content="#333" />
  64. <meta name="color:Scrollbar" content="#fff"/>
  65.  
  66. <meta name="select:Title Font" content="Dosis" title="Dosis">
  67. <meta name="select:Title Font" content="Baumans" title="Baumans">
  68. <meta name="select:Title Font" content="Poiret One" title="Poiret One">
  69. <meta name="select:Title Font" content="Julius Sans One" title="Julius Sans One">
  70. <meta name="select:Title Font" content="Syncopate" title="Syncopate">
  71.  
  72. <meta name="select:Title font size" content="20px" title="20px">
  73. <meta name="select:Title font size" content="22px" title="22px">
  74. <meta name="select:Title font size" content="25px" title="25px">
  75. <meta name="select:Title font size" content="27px" title="27px">
  76. <meta name="select:Title font size" content="30px" title="30px">
  77.  
  78. <meta name="font:Body font" content="Helvetica"/>
  79. <meta name="select:Body font size" content="12px" title="12px">
  80. <meta name="select:Body font size" content="13px" title="13px">
  81. <meta name="select:Body font size" content="14px" title="14px">
  82. <meta name="select:Body font size" content="15px" title="15px">
  83. <meta name="select:Body font size" content="16px" title="16px">
  84.  
  85. <meta name="text:Link One Title" content="Link one" />
  86. <meta name="text:Link One Url" content="http://"/>
  87. <meta name="text:Link Two Title" content="Link two"/>
  88. <meta name="text:Link Two Url" content="http://"/>
  89. <meta name="text:Link Three Title" content="Link three" />
  90. <meta name="text:Link Three Url" content="http://" />
  91. <meta name="text:Link Four Title" content="Link four" />
  92. <meta name="text:Link Four Url" content="http://" />
  93. <meta name="text:Link Five Title" content="Link five" />
  94. <meta name="text:Link Five Url" content="http://" />
  95.  
  96. <meta name="if:Two Columns" content="0" />
  97. <meta name="if:Container Transparent" content="0" />
  98. <meta name="if:Show Menu" content="1" />
  99. <meta name="if:Show Header" content="1" />
  100. <meta name="if:Show Topbar" content="1" />
  101. <meta name="if:Show Avatar" content="1" />
  102. <meta name="if:Show Navigation Icons" content="1" />
  103. <meta name="if:Show Music Player" content="1" />
  104. <meta name="if:Show Search Box" content="1" />
  105. <meta name="if:Show Info On Hover" content="1" />
  106. <meta name="if:Show Captions" content="1" />
  107. <meta name="if:Show Tags" content="1" />
  108.  
  109. <style>
  110.  
  111. /* ---------------------------- GENERAL ----------------------------- */
  112.  
  113. /* -------- BASICS ------- */
  114.  
  115. body {
  116. margin:0;
  117. padding:0;
  118. width:100%;
  119. height:100%;
  120. color:{color:text};
  121. font-family:{font:Body font};
  122. font-size:{select:Body font size};
  123. line-height: -moz-calc({select:Body font size} + 3px);
  124. line-height: -webkit-calc({select:Body font size} + 3px);
  125. line-height: -o-calc({select:Body font size} + 3px);
  126. line-height: calc({select:Body font size} + 3px);
  127. background-color: {color:Background};
  128. background-image:url({image:Background});
  129. background-attachment: fixed;
  130. background-repeat: repeat;
  131. }
  132.  
  133. /* Paragraph */
  134.  
  135. p {margin-top:5px; margin-bottom:5px;}
  136.  
  137. <--ses-->
  138. small{font-size: 90%;}
  139.  
  140. big{font-size: 110%;}
  141.  
  142. /* Title */
  143.  
  144. h1{
  145. color:{color:Title};
  146. font-family:{select:Title Font};
  147. font-size:{select:Title font size};
  148. line-height: -moz-calc({select:Title font size} + 3px);
  149. line-height: -webkit-calc({select:Title font size} + 3px);
  150. line-height: -o-calc({select:Title font size} + 3px);
  151. line-height: calc({select:Title font size} + 3px);
  152. border-bottom:1px solid {color:Borders};
  153. }
  154.  
  155. /* Captions */
  156.  
  157. h2{
  158. font-family:{font:Body font};
  159. font-size:{select:Body font size};
  160. line-height: -moz-calc({select:Body font size} + 3px);
  161. line-height: -webkit-calc({select:Body font size} + 3px);
  162. line-height: -o-calc({select:Body font size} + 3px);
  163. line-height: calc({select:Body font size} + 3px);
  164. font-weight:normal;
  165. }
  166.  
  167. /* Links */
  168.  
  169. a:link, a:active, a:visited{
  170. -webkit-transition: all .7s ease;
  171. -moz-transition: all .7s ease;
  172. -o-transition: all .7s ease;
  173. transition: all .7s ease;
  174. color:{color:Link};
  175. text-decoration:none;
  176. }
  177.  
  178. a:hover{
  179. color:{color:Hover};
  180. -webkit-transition: all 0.8s ease-in-out;
  181. -moz-transition: all 0.8s ease-in-out;
  182. -o-transition: all 0.8s ease-in-out;
  183. -ms-transition: all 0.8s ease-in-out;
  184. transition: all 0.8s ease-in-out;
  185. }
  186.  
  187. a img{border: 0px;}
  188.  
  189. ul, ol, li{ margin:5px 10px; padding:0px;}
  190.  
  191. /* Bold and italic */
  192.  
  193. b, strong {color:{color:Bold};}
  194. i, em {color:{color:Italic};}
  195.  
  196. /* Blockquote */
  197.  
  198. blockquote{
  199. padding:0px 0px 2px 5px;
  200. margin:0px 0px 2px 10px;
  201. border-left: 1px solid {color:Borders};
  202. }
  203.  
  204. /* Text selection */
  205.  
  206. ::-moz-selection {
  207. background: {color:Borders};
  208. color: {color:Scrollbar};
  209. }
  210.  
  211. ::selection {
  212. background: {color:Borders};
  213. color: {color:Scrollbar};
  214. }
  215.  
  216. /* Webkit scrollbar */
  217.  
  218. ::-webkit-scrollbar {
  219. width: 10px;
  220. height: 10px;
  221. }
  222.  
  223. ::-webkit-scrollbar-button {
  224. width: 0px;
  225. height: 0px;
  226. }
  227.  
  228. ::-webkit-scrollbar-thumb {
  229. background: {color:Scrollbar};
  230. border: 2px solid {color:Borders};
  231. border-radius: 0px;
  232. }
  233.  
  234. ::-webkit-scrollbar-track {
  235. background: {color:Scrollbar};
  236. border: 4px solid {color:Borders};
  237. border-radius: 0px;
  238. }
  239.  
  240. ::-webkit-scrollbar-corner {
  241. background: transparent;
  242. }
  243.  
  244. /* Tooltips */
  245.  
  246. #s-m-t-tooltip {
  247. max-width:300px;
  248. z-index:10000000;
  249. margin:24px 14px 7px 12px;
  250. padding:8px;
  251. color:{color:Link};
  252. background:{color:Post background};
  253. border:1px solid {color:Borders};
  254. font-size:13px;
  255. line-height:16px;
  256. }
  257.  
  258. /* Tumblr controls */
  259.  
  260. .iframe-controls--desktop {
  261. top:5px!important;
  262. right:10px!important;
  263. opacity:.9!important;
  264. position:fixed!important;
  265. white-space:nowrap!important;
  266. filter: invert(1);
  267. -webkit-filter: invert(1);
  268. -moz-filter: invert(1);
  269. -o-filter: invert(1);
  270. -ms-filter: invert(1);
  271. z-index:10000!important;
  272. }
  273.  
  274. /* Post notes style */
  275.  
  276. .notes img{
  277. width:15px;
  278. height:15px;
  279. position:relative;
  280. margin-top:3px;
  281. margin-right:5px;
  282. border:1px solid {color:Borders};
  283. border-radius:60px;
  284. }
  285.  
  286. .notes li{
  287. list-style:none;
  288. }
  289.  
  290. /* ----------------------- MAIN CONTAINER ----------------------------- */
  291.  
  292. #container{
  293. width:600px;
  294. min-height:300px;
  295. margin-left:auto;
  296. margin-right:auto;
  297. margin-top:80px;
  298. margin-bottom:0;
  299. padding-bottom:20px;
  300. background:{color:Container background};
  301. {block:IfContainerTransparent}
  302. background:transparent;
  303. {/block:IfContainerTransparent}
  304. }
  305.  
  306. /* -------- POSTS AND ENTRIES ------- */
  307.  
  308. #posts {
  309. margin-left:auto;
  310. margin-right:auto;
  311. width:600px;
  312. height:auto;
  313. {block:ifTwoColumns}
  314. width:600px;
  315. {/block:ifTwoColumns}
  316. padding-bottom:30px;
  317. z-index:1;
  318. }
  319.  
  320. .entry{
  321. width: 500px;
  322. margin-top:15px;
  323. margin-bottom:15px;
  324. margin-left:40px;
  325. height: auto;
  326. padding:10px;
  327. {block:ifTwoColumns}
  328. width:250px;
  329. margin-left:20px;
  330. {/block:ifTwoColumns}
  331. {block:PermalinkPage}
  332. width:500px;
  333. margin-left:40px;
  334. {block:PermalinkPage}
  335. border:1px solid {color:Borders};
  336. background:{color:Post background};
  337. }
  338.  
  339. .entry p img, .entry blockquote img { max-width: 100%; }
  340.  
  341. /* ----------------------- MENU ----------------------------- */
  342.  
  343. #menu{
  344. position:fixed;
  345. top:0;
  346. width:100%;
  347. height:70px;
  348. z-index:1000;
  349. }
  350.  
  351. #menuin{
  352. background:{color:Menu background};
  353. width:600px;
  354. height:70px;
  355. margin-left:auto;
  356. margin-right:auto;
  357. }
  358.  
  359. /* Blog title */
  360.  
  361. .blogtitle {
  362. position:fixed;
  363. margin-left:108px;
  364. top:10px;
  365. color:{color:Blog title};
  366. background:{color:Blog title background};
  367. padding:10px;
  368. font-size:{select:Title font size};
  369. font-family:{select:Title Font};
  370. width:470px;
  371. height:27px;
  372. line-height:28px;
  373. letter-spacing:2px;
  374. border-top:1px solid {color:Borders};
  375. border-bottom:1px solid {color:Borders};
  376. z-index:1;
  377. {block:IfNotShowNavigationIcons}
  378. margin-left:32px;
  379. width:546px;
  380. {/block:IfNotShowNavigationIcons}
  381. }
  382.  
  383. /* Navigation Icons */
  384.  
  385. #icons {
  386. position:fixed;
  387. top:5px;
  388. margin-left:-4px;
  389. width:80px;
  390. text-align:center;
  391. }
  392.  
  393. #icons i {
  394. padding:4px 8px;
  395. margin-top:5px;
  396. margin-left:3px;
  397. width:10px;
  398. font-size:12px;
  399. color:{color:Menu icon};
  400. background:{color:Menu icon background};
  401. border:1px solid {color:Borders};
  402. vertical-align:middle;
  403. }
  404.  
  405. #icons i:hover, .close i:hover{
  406. color:{color:Hover};
  407. background:{color:Borders};
  408. }
  409.  
  410. /* Music Player */
  411.  
  412. #musicplayer {
  413. position:absolute;
  414. text-align:center;
  415. right:48px;
  416. top:7px;
  417. color:{color:Music player text};
  418. background:{color:Music player background};
  419. width:35px;
  420. min-height:32px;
  421. line-height:17px;
  422. z-index:100000000;
  423. overflow:hidden;
  424. border:1px solid {color:Borders};
  425. }
  426.  
  427. #musicplayer:hover{
  428. width:170px;
  429. -webkit-transition: all .7s ease;
  430. -moz-transition: all .7s ease;
  431. -o-transition: all .7s ease;
  432. transition: all .7s ease;
  433. }
  434.  
  435. #music {
  436. position:absolute;
  437. margin-left:37px;
  438. margin-top:0px;
  439. width:10px;
  440. height:33px;
  441. overflow:hidden;
  442. z-index: 9999;
  443. }
  444.  
  445. #musicplayer:hover #music{
  446. width:132px;
  447. border-left:1px solid {color:Borders};
  448. }
  449.  
  450. #music:hover{
  451. height:auto;
  452. -webkit-transition: all .7s ease;
  453. -moz-transition: all .7s ease;
  454. -o-transition: all .7s ease;
  455. transition: all .7s ease;
  456. }
  457.  
  458. #musicicon {
  459. height:32px;
  460. line-height:32px;
  461. margin:0;
  462. width:35px;
  463. }
  464.  
  465. /* Search */
  466.  
  467. #search {
  468. position:absolute;
  469. text-align:center;
  470. right:7px;
  471. top:7px;
  472. background:{color:Search box background};
  473. width:35px;
  474. height:32px;
  475. z-index:100000000;
  476. overflow:hidden;
  477. border:1px solid {color:Borders};
  478. }
  479.  
  480. #search:hover {
  481. width:170px;
  482. -webkit-transition: all .7s ease;
  483. -moz-transition: all .7s ease;
  484. -o-transition: all .7s ease;
  485. transition: all .7s ease;
  486. }
  487.  
  488. .search-icon{
  489. position:absolute;
  490. margin-left:3px;
  491. width:32px;
  492. height:32px;
  493. margin-top:0px;
  494. z-index:10000;
  495. border-right:1px solid {color:Borders};
  496. }
  497.  
  498. .search-icon i, #musicicon i {
  499. color:{color:Icon};
  500. padding:2.5px;
  501. font-size:16px;
  502. }
  503.  
  504. /* Extra links */
  505.  
  506. .navigation{
  507. position:fixed;
  508. top:10px;
  509. margin-left:105px;
  510. width:400px;
  511. height:47px;
  512. border:1px solid {color:Borders};
  513. border-right:1px solid transparent;
  514. border-left:1px solid transparent;
  515. z-index:100;
  516. {block:IfNotShowNavigationIcons}
  517. margin-left:32px;
  518. {/block:IfNotShowNavigationIcons}
  519. background:{color:Menu background};
  520. display:none;
  521. }
  522.  
  523. /* Bars */
  524.  
  525. .close{
  526. position:absolute;
  527. top:10px;
  528. margin-left:74px;
  529. width:26px;
  530. height:47px;
  531. line-height:47px;
  532. font-size:15px;
  533. text-align:center;
  534. color:{color:Menu icon};
  535. background:{color:Menu icon background};
  536. border:1px solid {color:Borders};
  537. cursor:pointer;
  538. }
  539.  
  540. #nav-icon1 {
  541. max-width: 18px;
  542. max-height: 10px;
  543. min-width: 18px;
  544. min-height: 10px;
  545. position: relative;
  546. margin: 13px auto;
  547. -webkit-transform: rotate(0deg);
  548. -moz-transform: rotate(0deg);
  549. -o-transform: rotate(0deg);
  550. transform: rotate(0deg);
  551. -webkit-transition: .5s ease-in-out;
  552. -moz-transition: .5s ease-in-out;
  553. -o-transition: .5s ease-in-out;
  554. transition: .5s ease-in-out;
  555. cursor: pointer;
  556. }
  557.  
  558. #nav-icon1 span {
  559. display: block;
  560. position: absolute;
  561. height: 2px;
  562. width: 100%;
  563. background: {color:Menu icon};
  564. opacity: 1;
  565. left: 0;
  566. -webkit-transform: rotate(0deg);
  567. -moz-transform: rotate(0deg);
  568. -o-transform: rotate(0deg);
  569. transform: rotate(0deg);
  570. -webkit-transition: .25s ease-in-out;
  571. -moz-transition: .25s ease-in-out;
  572. -o-transition: .25s ease-in-out;
  573. transition: .25s ease-in-out;
  574. }
  575.  
  576. #nav-icon1 span:nth-child(1) {
  577. top: 5px;
  578. }
  579.  
  580. #nav-icon1 span:nth-child(2) {
  581. top: 11px;
  582. }
  583.  
  584. #nav-icon1 span:nth-child(3) {
  585. top: 17px;
  586. }
  587.  
  588. #nav-icon1.open span:nth-child(1) {
  589. top: 10px;
  590. -webkit-transform: rotate(135deg);
  591. -moz-transform: rotate(135deg);
  592. -o-transform: rotate(135deg);
  593. transform: rotate(135deg);
  594. }
  595.  
  596. #nav-icon1.open span:nth-child(2) {
  597. opacity: 0;
  598. left: -60px;
  599. }
  600.  
  601. #nav-icon1.open span:nth-child(3) {
  602. top: 10px;
  603. -webkit-transform: rotate(-135deg);
  604. -moz-transform: rotate(-135deg);
  605. -o-transform: rotate(-135deg);
  606. transform: rotate(-135deg);
  607. }
  608.  
  609. /* Extra links */
  610.  
  611. .navigationlinks{
  612. position:absolute;
  613. height: 32px;
  614. overflow:hidden;
  615. margin:8px;
  616. background:{color:Blog title background};
  617. }
  618.  
  619. .navigationlinks a{
  620. display:inline-block;
  621. font-size:15px;
  622. color:{color:Popup navigation link};
  623. padding:5px;
  624. height:25px;
  625. max-width:27px;
  626. line-height:25px;
  627. overflow:hidden;
  628. border-right:1px solid {color:Borders};
  629. }
  630.  
  631. .navigationlinks a:hover{
  632. width:auto;
  633. max-width:300px;
  634. color:{color:Hover};
  635. }
  636.  
  637. /* ----------------------- HEADER ----------------------------- */
  638.  
  639. #header {
  640. margin-top:-10px;
  641. margin-left:auto;
  642. margin-right:auto;
  643. padding: 10px;
  644. width:580px;
  645. height:200px;
  646. border-top:1px solid {color:Borders};
  647. border-bottom:1px solid {color:Borders};
  648. background:{color:Header background};
  649. background-image:url({image:Header background});
  650. background-size:cover;
  651. z-index:1000;
  652. }
  653.  
  654. /* ----------------------- TOPBAR ----------------------------- */
  655.  
  656. #topbar{
  657. margin-left:auto;
  658. margin-right:auto;
  659. padding: 10px;
  660. width:580px;
  661. height:70px;
  662. border-top:1px solid {color:Borders};
  663. border-bottom:1px solid {color:Borders};
  664. }
  665.  
  666. /* Avatar */
  667.  
  668. .avatar {
  669. position:absolute;
  670. margin:-10px;
  671. width:90px;
  672. height:90px;
  673. border-right:1px solid {color:Borders};
  674. }
  675.  
  676. .avatar img {
  677. width:65px;
  678. height:65px;
  679. border:2px solid {color:Borders};
  680. margin:10px;
  681. }
  682.  
  683. /* Description */
  684.  
  685. .description{
  686. position:absolute;
  687. margin-top:-5px;
  688. height:75px;
  689. padding-right:10px;
  690. margin-left:100px;
  691. width:480px;
  692. {block:IfNotShowavatar}
  693. margin-left:0px;
  694. width:580px;
  695. {/block:IfNotShowavatar}
  696. overflow-y:auto;
  697. text-align:justify;
  698. color:{color:Description};
  699. }
  700.  
  701. /* ----------------------- POST STYLES ----------------------------- */
  702.  
  703. /* Quote posts */
  704.  
  705. .quote {
  706. font-family:{select:Title Font};
  707. font-size:{select:Title font size};
  708. line-height: -moz-calc({select:Title font size} + 3px);
  709. line-height: -webkit-calc({select:Title font size} + 3px);
  710. line-height: -o-calc({select:Title font size} + 3px);
  711. line-height: calc({select:Title font size} + 3px);
  712. color:{color:Italic};
  713. height:auto;
  714. margin:10px;
  715. padding:5px;
  716. text-align:center;
  717. letter-spacing:1px;
  718. }
  719.  
  720. .source {
  721. font-family:{font:Body font};
  722. font-size:{select:Body font size};
  723. line-height:130%;
  724. height:auto;
  725. margin-top:10px;
  726. margin-left:10px;
  727. margin-right:10px;
  728. margin-bottom:5px;
  729. padding:5px;
  730. text-align:right;
  731. letter-spacing:1px;
  732. }
  733.  
  734. /* Link posts */
  735.  
  736. #linktitle{
  737. font-family:{select:Title Font};
  738. font-size:{select:Title font size};
  739. line-height:130%;
  740. width:96%;
  741. padding:2%;
  742. border:1px solid {color:Borders};
  743. }
  744.  
  745. #linktitle a{
  746. color:{color:Link};
  747. }
  748.  
  749. #linktitle i{
  750. color:{color:Icon};
  751. }
  752.  
  753. /* Chat posts */
  754.  
  755. .chat .line {
  756. color: {color:Text};
  757. padding:2px;
  758. }
  759.  
  760. .label {
  761. color:{color:Bold};
  762. font-size:15px;
  763. font-family:{select:Title Font};
  764. padding-right:2px;
  765. }
  766.  
  767. /* Audio posts */
  768.  
  769. #audiocon{
  770. width:100%;
  771. height:auto;
  772. min-height:75px;
  773. overflow:hidden;
  774. margin-bottom:10px;
  775. }
  776.  
  777. .album{
  778. width:65px;
  779. height:65px;
  780. background-image:url(http://i61.tinypic.com/s6k3zb.jpg);
  781. border: 5px solid {color:Borders};
  782. }
  783.  
  784. .album img{
  785. max-width:65px;
  786. margin-left:0px;
  787. float:left;
  788. margin-top:0px;
  789. z-index:10;
  790. }
  791.  
  792. .audio{
  793. position:absolute;
  794. max-width:325px;
  795. margin-left:80px;
  796. float:left;
  797. margin-top:0;
  798. z-index:10;
  799. font-size:12px;
  800. overflow:hidden;
  801. }
  802.  
  803. .audio i{
  804. color:{color:Icon};
  805. border:1px solid {color:Borders};
  806. padding:2px;
  807. width:12px;
  808. height:12px;
  809. font-size:12px;
  810. margin-bottom:1px;
  811. text-align:center;
  812. }
  813.  
  814. .play{
  815. position:absolute;
  816. margin:20px;
  817. max-width:25px;
  818. max-height:25px;
  819. overflow:hidden;
  820. opacity:0.8;
  821. }
  822.  
  823. /* Ask Posts */
  824.  
  825. .bubble {
  826. position: relative;
  827. height:auto;
  828. margin:5px;
  829. padding:5px;
  830. border: 1px solid {color:Borders};
  831. z-index:1;
  832. min-height:50px;
  833. }
  834.  
  835. .asker img {
  836. float:left;
  837. border:1px solid {color:Borders};
  838. margin-right:5px;
  839. z-index:2000;
  840. border-radius:100%;
  841. }
  842.  
  843. /* ----------------------- POST INFO ----------------------------- */
  844.  
  845.  
  846. #postinfo{
  847. margin-top:10px;
  848. width:500px;
  849. {block:IfTwoColumns}
  850. width:250px;
  851. {/block:IfTwoColumns}
  852. {block:IndexPage}
  853. {block:IfShowInfoOnHover}
  854. display:none;
  855. height:0;
  856. {/block:IfShowInfoOnHover}
  857. {/block:IndexPage}
  858. {block:PermalinkPage}
  859. margin-top:10px;
  860. width:500px;
  861. height:auto;
  862. {/block:PermalinkPage}
  863. z-index:1000;
  864. }
  865.  
  866. .entry:hover #postinfo{
  867. {block:IndexPage}
  868. {block:IfShowInfoOnHover}
  869. height:auto;
  870. display:block;
  871. bottom:0px;
  872. left:0px;
  873. padding-left:15px;
  874. padding-right:15px;
  875. position:absolute;
  876. background:{color:Info background};
  877. opacity:0.9;
  878. color:{color:Link};
  879. border-top:1px solid {color:Borders};
  880. {/block:IfShowInfoOnHover}
  881. {/block:IndexPage}
  882. }
  883.  
  884. .entry:hover #postinfo{
  885. {block:IndexPage}
  886. {block:IfShowInfoOnHover}
  887. height:auto;
  888. display:block;
  889. bottom:0px;
  890. left:0px;
  891. padding-left:10px;
  892. padding-right:10px;
  893. position:absolute;
  894. background:{color:Info background};
  895. opacity:0.9;
  896. color:{color:Link};
  897. border-top:1px solid {color:Borders};
  898. {/block:IfShowInfoOnHover}
  899. {/block:IndexPage}
  900. }
  901.  
  902. #postinfo a {
  903. font-size:12px;
  904. }
  905.  
  906. .info {
  907. height:28px;
  908. line-height:20px;
  909. float:center;
  910. padding-top:5px;
  911. margin-top:0px;
  912. margin-bottom:5px;
  913. font-size:12px;
  914. width:500px;
  915. color:{color:Link};
  916. {block:ifTwoColumns}
  917. width:250px;
  918. {/block:ifTwoColumns}
  919. {block:PermalinkPage}
  920. width:500px;
  921. {/block:PermalinkPage}
  922. color:{color:Link};
  923. border-top:1px solid {color:Borders};
  924. text-transform:lowercase;
  925. {block:IfShowInfoOnHover}
  926. border:none;
  927. {/block:IfShowInfoOnHover}
  928. }
  929.  
  930. .info i{
  931. color:{color:Icon};
  932. }
  933.  
  934. /* Like reblog and permalink buttons */
  935.  
  936. .plrbuttons {
  937. float:right;
  938. margin-left:300px;
  939. margin-top:-22px;
  940. {block:ifTwoColumns}
  941. margin-left:180px;
  942. {/block:ifTwoColumns}
  943. {block:PermalinkPage}
  944. margin-left:300px;
  945. {block:PermalinkPage}
  946. z-index:200000;
  947. list-style: none;
  948. padding:5px;
  949. padding-bottom:2px;
  950. }
  951.  
  952. .plrbuttons i {
  953. float:left;
  954. display:inline-block;
  955. margin-left:5px;
  956. list-style:none;
  957. color:#cccccc;
  958. font-size:15px;
  959. }
  960.  
  961. .plrbuttons li:first-child {
  962. border-right: 0px solid #e8e8e8;
  963. }
  964.  
  965. /* Tags */
  966.  
  967. .tags {
  968. margin-top:5px;
  969. display:inline;
  970. width:100%;
  971. }
  972.  
  973. .tags i{
  974. color:{color:Icon};
  975. display:inline;
  976. }
  977.  
  978. /* ----------------------- PAGINATION ----------------------------- */
  979.  
  980. .pagination{
  981. font-family:{font:Body font};
  982. margin-top:0px;
  983. margin-bottom:10px;
  984. margin-left:auto;
  985. margin-right:auto;
  986. width:100%;
  987. height:25px;
  988. line-height:25px;
  989. overflow:hidden;
  990. text-align:center;
  991. }
  992.  
  993. .pagination a, .current_page{
  994. font-size:15px;
  995. padding:2px 7px;
  996. width:20px;
  997. height:20px;
  998. line-height:20px;
  999. margin-left:5px;
  1000. margin-right:5px;
  1001. color:{color:Menu icon};
  1002. background:{color:Menu icon background};
  1003. text-align:center;
  1004. }
  1005.  
  1006. .pagination i{
  1007. color:{color:Icon};
  1008. }
  1009.  
  1010.  
  1011. /* ----------------------- CREDITS ----------------------------- */
  1012.  
  1013. #credits {
  1014. position:fixed;
  1015. right:10px;
  1016. bottom:5px;
  1017. z-index:100000;
  1018. }
  1019.  
  1020. </style>
  1021.  
  1022. <!--Important sripts-->
  1023.  
  1024. <script type="text/javascript"
  1025. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  1026.  
  1027. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  1028.  
  1029. <script>
  1030. $(document).ready(function(){
  1031. $(".close").click(function(){
  1032. $(".navigation").slideToggle(1);
  1033. });
  1034. });
  1035. </script>
  1036.  
  1037. <script>
  1038. $(document).ready(function(){
  1039. $('#nav-icon1').click(function(){
  1040. $(this).toggleClass('open');
  1041. });
  1042. });
  1043. </script>
  1044.  
  1045. <script type="text/javascript"
  1046. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  1047.  
  1048. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  1049. <script src="jquery.style-my-tooltips.js"></script>
  1050.  
  1051. <link href="style-my-tooltips.css" rel="stylesheet" type="text/css" />
  1052. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  1053. <script src="jquery.style-my-tooltips.js"></script>
  1054.  
  1055. <script type="text/javascript" src="http://static.tumblr.com/imovwvl/dJWl20ley/jqueryformasonry.js"></script>
  1056.  
  1057. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  1058. <script>
  1059. (function($){
  1060. $(document).ready(function(){
  1061. $("[title]").style_my_tooltips({
  1062. tip_follows_cursor:true,
  1063. tip_delay_time:200,
  1064. tip_fade_speed:300
  1065. }
  1066. );
  1067. });
  1068. })(jQuery);
  1069. </script>
  1070.  
  1071. {block:IndexPage}
  1072. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  1073. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  1074.  
  1075. <script type="text/javascript">
  1076. $(window).load(function(){
  1077. var $wall = $('#posts');
  1078. $wall.imagesLoaded(function(){
  1079. $wall.masonry({
  1080. itemSelector: '.entry, .entry_photo',
  1081. isAnimated : false
  1082. });
  1083. });
  1084.  
  1085. $wall.infinitescroll({
  1086. navSelector : '#pagination',
  1087. nextSelector : '#pagination a',
  1088. itemSelector : '.entry, .entry_photo',
  1089. bufferPx : 2000,
  1090. debug : false,
  1091. errorCallback: function() {
  1092. $('#infscr-loading').fadeOut('normal');
  1093. }},
  1094. function( newElements ) {
  1095. var $newElems = $( newElements );
  1096. $newElems.hide();
  1097. $newElems.imagesLoaded(function(){
  1098. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  1099. });
  1100. }); $('#posts').show(500);
  1101. });
  1102. </script>
  1103. {/block:IndexPage}
  1104.  
  1105. <meta charset="utf-8">
  1106. <title>{Title}{block:TagPage} - {Tag} {/block:TagPage} {block:SearchPage} - {lang:Search results for SearchQuery}{/block:SearchPage}{block:PostSummary}- {PostSummary} {/block:PostSummary}</title>
  1107. {block:Description}
  1108. <meta name="description" content="{MetaDescription}" />
  1109. {/block:Description}
  1110. <link rel="shortcut icon" href="{Favicon}">
  1111. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  1112.  
  1113. </head>
  1114.  
  1115. <body>
  1116.  
  1117. {block:IfShowMenu}
  1118. <div id="menu">
  1119.  
  1120. <div id="menuin">
  1121.  
  1122. <div class="close"><div id="nav-icon1">
  1123. <span></span>
  1124. <span></span>
  1125. <span></span>
  1126. </div></div>
  1127.  
  1128. <div class="navigation">
  1129.  
  1130.  
  1131. <div class="navigationlinks">
  1132. <center>
  1133.  
  1134. <a href="{text:Link One Url}">01. {text:Link One Title}</a>
  1135.  
  1136. <a href="{text:Link Two Url}">02. {text:Link Two Title}</a>
  1137.  
  1138. <a href="{text:Link Three Url}">03. {text:Link Three Title}</a>
  1139.  
  1140. <a href="{text:Link Four Url}">04. {text:Link Four Title}</a>
  1141.  
  1142. <a href="{text:Link Five Url}">05. {text:Link Five Title}</a>
  1143.  
  1144. </center>
  1145. </div>
  1146. <!--End navigationlinks-->
  1147. </div>
  1148. <!--End navigation-->
  1149.  
  1150. <div class="blogtitle">{Title}
  1151.  
  1152. <!--Music player starts-->
  1153. {block:IfShowMusicPlayer}
  1154. <div id="musicplayer">
  1155.  
  1156. <div id="music">
  1157. <center>
  1158.  
  1159. <!--Replace this part with your billy music player code-->
  1160. <embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=false&f0=http://www.sheepproductions.com/mfc/done.mp3&t0=Done&f1=http://www.sheepproductions.com/mfc/justified.mp3&t1=Justified&f2=http://www.sheepproductions.com/mfc/shesaid.mp3&t2=She Said&total=3" quality="high" wmode="transparent" width="200" height="10" name="billy" align="middle" type="application/x-shockwave-flash" />
  1161. <!---->
  1162.  
  1163. </center>
  1164. </div>
  1165.  
  1166. <div id="musicicon">
  1167. <i class="fa fa-music fa"></i>
  1168. </div>
  1169.  
  1170. </div>
  1171. {/block:IfShowMusicPlayer}
  1172. <!--Music player ends-->
  1173.  
  1174. <!--Search box starts-->
  1175. {block:IfShowSearchBox}
  1176. <div id="search">
  1177. <div class="search-icon">
  1178. <i class="fa fa-search fa"></i>
  1179. </div>
  1180. <form action="/search" method="get">
  1181. <input type="text" name="q" value="Search..." style="width:110px; padding-left:10px; height:19px; border:1px solid transparent; background:transparent; color:{color:Link}; font-size: 12px; margin-top:5px; margin-left:25px;"/>
  1182. </form>
  1183. </div>
  1184. {/block:IfShowSearchBox}
  1185. <!--Search box ends-->
  1186.  
  1187. </div>
  1188.  
  1189. {block:IfShowNavigationIcons}
  1190. <div id="icons">
  1191. <a href="/" title="Index"><i class="fa fa-home"></i></a>
  1192. <a href="/ask" title="Ask"><i class="fa fa-envelope"></i></a>
  1193. <a href="/submit" title="Submit"><i class="fa fa-pencil"></i></a>
  1194. <a href="/archive" title="Archive"><i class="fa fa-clock-o"></i></a>
  1195. </div>
  1196. {/block:IfShowNavigationIcons}
  1197.  
  1198. </div>
  1199. <!--End menuin-->
  1200.  
  1201. </div>
  1202. <!--End menu-->
  1203. {/block:IfShowMenu}
  1204.  
  1205. <div id="container">
  1206.  
  1207. {block:IfShowHeader}
  1208. <div id="header"></div>
  1209. {/block:IfShowHeader}
  1210.  
  1211. {block:IfShowTopbar}
  1212. <div id="topbar">
  1213.  
  1214. {block:IfShowavatar}
  1215. <div class="avatar">
  1216. <a href="/"><img src="{image:Avatar}"></a>
  1217. </div>
  1218. {/block:IfShowavatar}
  1219.  
  1220. <div class="description">{Description}</div>
  1221.  
  1222. </div>
  1223. <!--End topbar-->
  1224. {/block:IfShowTopbar}
  1225.  
  1226. <div id="posts">
  1227.  
  1228. {block:Posts}
  1229.  
  1230. <div class="entry">
  1231.  
  1232. <!--Hide via and source in captions-->
  1233.  
  1234. <!-- {block:NoRebloggedFrom}
  1235. {block:RebloggedFrom}
  1236. {ReblogParentName}
  1237. {/block:RebloggedFrom}
  1238. {/block:NoRebloggedFrom} -->
  1239.  
  1240. {block:ContentSource}
  1241. <!-- {SourceURL}
  1242. {block:SourceLogo}
  1243. <img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  1244. {/block:SourceLogo}
  1245. {block:NoSourceLogo}
  1246. {SourceLink}
  1247. {/block:NoSourceLogo} -->
  1248. {/block:ContentSource}
  1249.  
  1250. {block:Text}
  1251. {block:Title}
  1252. <a href="{Permalink}">
  1253. <h1>{Title}</h1></a>
  1254. {/block:Title}
  1255. {Body}
  1256. {/block:Text}
  1257.  
  1258. {block:Photo}
  1259. {block:IndexPage}
  1260. {block:ifNotTwoColumns}
  1261. <a href="{permalink}">
  1262. <img src="{PhotoURL-500}"
  1263. width="500"/></a>
  1264. {/block:ifNotTwoColumns}
  1265. {block:ifTwoColumns}
  1266. <a href="{permalink}">
  1267. <img src="{PhotoURL-250}"
  1268. width="250"/></a>
  1269. {/block:ifTwoColumns}
  1270. {/block:IndexPage}
  1271. {block:PermalinkPage}
  1272. <img src="{PhotoURL-500}"
  1273. width="500"/></a>
  1274. {/block:PermalinkPage}
  1275. {/block:Photo}
  1276.  
  1277. {block:Photoset}
  1278. {block:IndexPage}
  1279. {block:ifNotTwoColumns}
  1280. {Photoset-500}
  1281. {/block:ifNotTwoColumns}
  1282. {block:ifTwoColumns}
  1283. {Photoset-250}
  1284. {/block:ifTwoColumns}
  1285. {/block:IndexPage}
  1286. {block:PermalinkPage}
  1287. {Photoset-500}
  1288. {/block:PermalinkPage}
  1289. {/block:Photoset}
  1290.  
  1291. {block:Quote}
  1292. <div class="quote">
  1293. " {Quote} "
  1294. {block:Source}
  1295. <div class="source">-{Source}
  1296. </div>{/block:Source}</div>
  1297. {/block:Quote}
  1298.  
  1299. {block:Link}
  1300. <a href="{URL}"
  1301. class="linkpost"
  1302. target="_blank">
  1303. <h1><i class="fa fa-link"></i>
  1304. {Name} &raquo;</h1></a>
  1305. {block:Description}
  1306. {Description}
  1307. {/block:Description}
  1308. {/block:Link}
  1309.  
  1310. {block:Chat}
  1311. {block:Title}<h1>{Title}</h1>{/block:Title}
  1312. <div class="chat">
  1313. {block:Lines}
  1314. <div class="chat"><div class="line {Alt}">
  1315. <div class="{Alt} user_{UserNumber}">
  1316. {block:Label}
  1317. <span class="label">
  1318. {Label}</span>
  1319. {/block:Label}
  1320. {Line}</div>
  1321. </div></div>
  1322. {/block:Lines}
  1323. </div>
  1324. {/block:Chat}
  1325.  
  1326. {block:Audio}
  1327. <div id="audiocon">
  1328. <div class="audio">
  1329. {block:TrackName}<i class="fa fa-microphone"></i> {TrackName}{/block:TrackName}
  1330. {block:Artist}<br><i class="fa fa-user"></i> {Artist}{/block:Artist}
  1331. {block:Album}<br><i class="fa fa-music"></i> {Album}{/block:Album}
  1332. {block:PlayCount}<br><i class="fa fa-heart"></i> {PlayCount}{/block:PlayCount}<br></div>
  1333. <div class="album">
  1334. {block:AlbumArt}
  1335. <img src="{AlbumArtURL}">
  1336. {/block:AlbumArt}
  1337. <div class="play">
  1338. {AudioPlayerWhite}
  1339. </div>
  1340. </div>
  1341. </div>
  1342. {/block:Audio}
  1343.  
  1344. {block:Video}
  1345. {block:IndexPage}
  1346. {block:ifNotTwoColumns}
  1347. {Video-500}
  1348. {/block:ifNotTwoColumns}
  1349. {block:ifTwoColumns}
  1350. {Video-250}
  1351. {/block:ifTwoColumns}
  1352. {/block:IndexPage}
  1353. {block:PermalinkPage}
  1354. {Video-500}
  1355. {/block:PermalinkPage}
  1356. {/block:Video}
  1357.  
  1358. {block:Answer}
  1359. <div class="bubble">
  1360. <div class="asker">
  1361. <img src="{AskerPortraitURL-48}">
  1362. </div>
  1363. <span></span>{Asker}:
  1364. {Question}</div>
  1365. {Answer}
  1366. {/block:Answer}
  1367.  
  1368. {block:IndexPage}
  1369. {block:IfShowCaptions}
  1370. {block:Caption}
  1371. <h2>{Caption}</h2>
  1372. {/block:Caption}
  1373. {/block:IfShowCaptions}
  1374. {/block:IndexPage}
  1375. {block:PermalinkPage}
  1376. {block:Caption}
  1377. <h2>{Caption}</h2>
  1378. {/block:Caption}
  1379. {/block:PermalinkPage}
  1380.  
  1381. {block:Date}
  1382. <div id="postinfo">
  1383.  
  1384. <div class="info">
  1385. <i class="fa fa-clock-o"></i>
  1386. {ShortMonth} {DayOfMonthWithZero}
  1387. {block:NoteCount}
  1388. <i class="fa fa-heart-o"></i>
  1389. {NoteCount}
  1390. {/block:NoteCount}
  1391.  
  1392. {block:RebloggedFrom}
  1393. <i>//</i>
  1394. <a href="{ReblogParentURL}" title="{ReblogParentName}" target="_blank">VIA</a>
  1395. {/block:RebloggedFrom}
  1396. {block:RebloggedFrom}
  1397. <i>//</i>
  1398. <a href="{ReblogRootURL}" title="Source: {ReblogRootName}">src</a>
  1399. {/block:RebloggedFrom}
  1400.  
  1401. <div class="plrbuttons">
  1402. <a href="{Permalink}">
  1403. <i class="fa fa-external-link"></i></a>
  1404. <i>{LikeButton size="15"}</i>
  1405. <i>{ReblogButton size="15"}</i>
  1406. </div>
  1407.  
  1408. </div>
  1409. <!--End info -->
  1410.  
  1411. {block:IndexPage}
  1412. {block:IfShowTags}
  1413. {block:HasTags}
  1414. {block:Tags}
  1415. <a href="{TagURL}">
  1416. <i class="fa fa-tag"></i> {Tag}</a>
  1417. {/block:Tags}
  1418. {/block:HasTags}
  1419. {/block:IfShowTags}
  1420. {/block:IndexPage}
  1421. {block:PermalinkPage}
  1422. {block:HasTags}
  1423. {block:Tags}
  1424. <a href="{TagURL}">
  1425. <i class="fa fa-tag"></i>
  1426. {Tag}</a> &nbsp;
  1427. {/block:Tags}
  1428. {/block:HasTags}
  1429. {/block:PermalinkPage}
  1430.  
  1431. </div>
  1432. <!--End post info-->
  1433. {/block:Date}
  1434.  
  1435. <!-- Permalink page -->
  1436. {block:PermalinkPage}
  1437. <div class="notes">
  1438.  
  1439. {block:PermalinkPagination}
  1440. <center><br>
  1441. {block:PreviousPost}
  1442. <a href="{PreviousPost}"> &laquo; Previous Post – </a>
  1443. {/block:PreviousPost}
  1444.  
  1445. {block:NextPost}
  1446. <a href="{NextPost}">Next Post &raquo;</a>
  1447. {/block:NextPost}
  1448. </center>
  1449. {/block:PermalinkPagination} <br>
  1450.  
  1451. {block:PostNotes}<br>
  1452. <div style="text-align:left; max-height: 500px; width:500px; overflow: auto; overflow-x: hidden;">
  1453. {PostNotes}</div>
  1454. {/block:PostNotes}</div>
  1455. <br><br>
  1456.  
  1457. {/block:PermalinkPage}
  1458.  
  1459. </div>
  1460.  
  1461. {/block:Posts}
  1462.  
  1463. </div>
  1464.  
  1465. <!--End posts-->
  1466.  
  1467. {block:Pagination}
  1468. <div class="pagination">
  1469. {block:PreviousPage}
  1470. <a href="{PreviousPage}" class="jump_page">&laquo;</a>
  1471. {/block:PreviousPage}
  1472. {block:JumpPagination length="4"}
  1473. {block:CurrentPage}
  1474. <span class="current_page">{PageNumber}</span>
  1475. {/block:CurrentPage}
  1476. {block:JumpPage}
  1477. <a class="jump_page" href="{URL}">
  1478. {PageNumber}</a>
  1479. {/block:JumpPage}
  1480. {/block:JumpPagination}
  1481. {block:NextPage}
  1482. <a href="{NextPage}" class="jump_page">&raquo;</a>
  1483. {/block:NextPage}
  1484. </div>
  1485. {/block:Pagination}
  1486.  
  1487. </div>
  1488.  
  1489. <!--End container-->
  1490.  
  1491. </body>
  1492.  
  1493. <a href="http://borntobewildthemes.tumblr.com" title="Theme CARPE DIEM by borntobewildthemes"><div id="credits">
  1494. <img src="http://i57.tinypic.com/301g6eg.jpg"></div></a>
  1495.  
  1496.  
  1497. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement