API tools faq
paste
Advertisement
sartasticthemes

Theme3 "Touch"

sartasticthemes
Aug 26th, 2014
698
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 30.52 KB | None | 0 0
raw download clone embed print report
  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.  
  4. <!--
  5.  
  6. Theme by sartasticthemes.tumblr.com. Please don't remove the credit, it's no shame to use a finished theme. :) If you want to know how to make your own theme, ask me instead of stealing mine.
  7.  
  8. -->
  9.  
  10. <head>
  11.  
  12. <title>{Title}</title>
  13. <link rel="shortcut icon" href="{Favicon}">
  14.  
  15. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  16.  
  17. {block:Description}
  18. <meta name="description" content="{MetaDescription}" />
  19. {/block:Description}
  20.  
  21. <meta name="color:background" content="#ffffff"/>
  22. <meta name="color:header" content="#6fbfd6"/>
  23. <meta name="color:border header" content="#f8867b"/>
  24. <meta name="color:linkshover" content="#f8867b"/>
  25. <meta name="color:navi squares" content="#000000"/>
  26. <meta name="color:navi squares hover" content="#f8867b"/>
  27. <meta name="color:text" content="#000000"/>
  28. <meta name="color:posts" content="#ffffff"/>
  29. <meta name="color:box1" content="#bbebf8"/>
  30. <meta name="color:box2" content="#9cd7e7"/>
  31. <meta name="color:box3" content="#6fbfd6"/>
  32. <meta name="color:box4" content="#39a3c1"/>
  33.  
  34. <meta name="image:header" content="http://static.tumblr.com/16024c40532ed3351f743de6f1f963d3/qzk7sj0/a4lnawww1/tumblr_static_b3byr0vo968ss4ggs4w4gg8cc.jpg"/>
  35. <meta name="image:border header" content="http://static.tumblr.com/22b12f222ff2b05ddf5fb920c13820dd/qzk7sj0/4fHnaxaw5/tumblr_static_49v2vuovuu04wwg0w48cwkk4o.jpg"/>
  36.  
  37. <meta name="text:Ask box title" content="Ask box title"/>
  38. <meta name="text:url" content="example WITHOUT tumblr.com"/>
  39.  
  40. <meta name="text:link3url" content="/navi"/>
  41. <meta name="text:link3name" content="navigation"/>
  42.  
  43. <meta name="text:link4url" content="/tags"/>
  44. <meta name="text:link4name" content="tags"/>
  45.  
  46. <meta name="text:link5url" content="/about"/>
  47. <meta name="text:link5name" content="all about me"/>
  48.  
  49.  
  50.  
  51. <link href='http://fonts.googleapis.com/css?family=Roboto+Condensed:400,700' rel='stylesheet' type='text/css'>
  52.  
  53. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  54. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
  55. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  56.  
  57. <script>
  58. $(document).ready(function() {
  59. //
  60. $('a.poplight[href^=#]').click(function() {
  61. var popID = $(this).attr('rel'); //Get Popup Name
  62. var popURL = $(this).attr('href'); //Get Popup href to define size
  63. var query= popURL.split('?');
  64. var dim= query[1].split('&');
  65. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  66. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  67. var popMargTop = ($('#' + popID).height() + 80) / 2;
  68. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  69. //Apply Margin to Popup
  70. $('#' + popID).css({
  71. 'margin-top' : -popMargTop,
  72. 'margin-left' : -popMargLeft
  73. });
  74. $('body').append('<div id="fade"></div>');
  75. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  76. return false;
  77. });
  78. $('a.close, #fade').live('click', function() {
  79. $('#fade , .popup_block').fadeOut(function() {
  80. $('#fade, a.close').remove(); //fade them both out
  81. });
  82. return false;
  83. });
  84. });
  85. </script>
  86.  
  87. <script>
  88. (function($){
  89. $(document).ready(function(){
  90. $("[title]").style_my_tooltips({
  91. tip_follows_cursor:true,
  92. tip_delay_time:200,
  93. tip_fade_speed:300
  94. }
  95. );
  96. });
  97. })(jQuery);
  98. </script>
  99.  
  100.  
  101.  
  102.  
  103. <style type="text/css">
  104.  
  105. iframe#tumblr_controls {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;width:250px;}
  106. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: 1;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  107.  
  108.  
  109. #s-m-t-tooltip {
  110. margin:15px 15px 15px 10px;
  111. max-width:300px;
  112. padding:3px 8px;
  113. border:1px solid #e6e6e6;
  114. background:#ffffff;
  115. color:#000000;
  116. font-size:8px;
  117. text-transform:uppercase;
  118. box-shadow:1px 1px 3px rgba(0,0,0,.1);
  119. z-index:999999999999999999999999999999999999999999999999999999999999999999999999999999999999 !important;
  120. }
  121.  
  122.  
  123.  
  124.  
  125. /* ---------------------------- BASICS ---------------------------- */
  126.  
  127.  
  128. body {
  129. margin-left:0px;
  130. margin-top:0px;
  131. background-color: {color:background};
  132. color:{color:text};
  133. font-family:verdana;
  134. font-size:9px;
  135. line-height:100%;
  136. }
  137.  
  138. a {
  139. color:{color:text};
  140. text-decoration:none;
  141. -webkit-transition: all 0.6s ease-out;
  142. -moz-transition: all 0.6s ease-out;
  143. transition: all 0.6s ease-out;
  144. }
  145.  
  146. a:hover {
  147. color:{color:linkshover};
  148. text-shadow:0 0 2px #999999;
  149. -webkit-transition: all 0.4s ease-out;
  150. -moz-transition: all 0.4s ease-out;
  151. transition: all 0.4s ease-out;
  152. }
  153.  
  154. img {
  155. border:none;
  156. }
  157.  
  158. blockquote {
  159. padding-left:10px;
  160. border-left:1px solid #c7c7c7;
  161. }
  162.  
  163. /* -------------------------- HEADER --------------------------
  164. Including: Description, Title, Pagination, Navigation & Updates - */
  165.  
  166.  
  167. #header {
  168. position:absolute;
  169. top:0px;
  170. height:211px;
  171. width:100%;
  172. background-color:transparent;
  173. }
  174.  
  175. #headerpic {
  176. margin:0 auto;
  177. height:211px;
  178. max-width:1277px;
  179. background-color:{color:header};
  180. background-image:url('{image:header}')
  181. }
  182.  
  183.  
  184. #sidebar {
  185. position:relative;
  186. top:150px;
  187. height:110px;
  188. width:100%;
  189. background:transparent;
  190. }
  191.  
  192. #titlebar {
  193. position:absolute;
  194. top:8px;
  195. width:100%;
  196. padding-bottom:9px;
  197. border-bottom:solid 1px #e6e6e6;
  198. background:transparent;
  199. text-align:center;
  200. z-index:999;
  201. }
  202.  
  203. .title {
  204. margin:0 auto;
  205. max-width:241px;
  206. padding:10px 5px;
  207. background:#ffffff;
  208. color:#000000;
  209. box-shadow: 0px 0px 8px #ffffff;
  210. font-family: 'Roboto Condensed', sans-serif;
  211. font-size:20px;
  212. font-weight:bold;
  213. text-transform:uppercase;
  214. text-align:center;
  215. word-spacing:2px;
  216. letter-spacing:0px;
  217. z-index:1000 !important;
  218. }
  219.  
  220. #desc {
  221. position:absolute;
  222. top:0px;
  223. height:175px;
  224. width:100%;
  225. color:#000000;
  226. font-family:verdana;
  227. font-size:9px;
  228. text-align:block;
  229. text-align:center;
  230. opacity:1;
  231. z-index:9999;
  232. }
  233.  
  234. #description {
  235. margin:0 auto;
  236. height:180px;
  237. max-width:200px;
  238. padding:35px 25px 0px 25px;
  239. background-color:#ffffff;
  240. border-right:solid 1px #e6e6e6;
  241. border-left:solid 1px #e6e6e6;
  242. opacity:0;
  243. z-index:9999;
  244. -webkit-transition: all 0.6s ease-out;
  245. -moz-transition: all 0.6s ease-out;
  246. transition: all 0.6s ease-out;
  247. }
  248.  
  249. #desc:hover #description {
  250. opacity:0.9;
  251. -webkit-transition: all 0.4s ease-out;
  252. -moz-transition: all 0.4s ease-out;
  253. transition: all 0.4s ease-out;
  254. }
  255.  
  256. .header {
  257. position:absolute;
  258. margin-top:165px;
  259. width:100%;
  260. height:85px;
  261. background:{color:background};
  262. border-bottom:solid 1px #e6e6e6;
  263. z-index:1000;
  264. }
  265.  
  266. #headerwrapper {
  267. width:100%;
  268. height:20px;
  269. }
  270.  
  271. .sticky {
  272. position:fixed;
  273. top:-165px;
  274. z-index:1000;
  275. }
  276.  
  277. #underhead {
  278. position:absolute;
  279. top:0px;
  280. height:46px;
  281. width:100%;
  282. background-color:transparent;
  283. }
  284.  
  285. #underheadpic {
  286. margin:0 auto;
  287. height:46px;
  288. max-width:1277px;
  289. background-color:{color:border header};
  290. background-image:url('{image:border header}');
  291. }
  292.  
  293. #navigation {
  294. margin-top:60px;
  295. width:100%;
  296. background:transparent;
  297. text-align:center;
  298. }
  299.  
  300. #navigation a {
  301. margin:15px;
  302. padding:0px 6px 0px 6px;
  303. background:{color:navi squares};
  304. -webkit-transition: all 0.6s ease-out;
  305. -moz-transition: all 0.6s ease-out;
  306. transition: all 0.6s ease-out;
  307. }
  308.  
  309. #navigation a:hover {
  310. background-color:{color:navi squares hover};
  311. border-radius:10px;
  312. -moz-border-radius:10px;
  313. -webkit-border-radius:10px;
  314. text-shadow:none;
  315. -webkit-transition: all 0.4s ease-out;
  316. -moz-transition: all 0.4s ease-out;
  317. transition: all 0.4s ease-out;
  318. }
  319.  
  320. #leftpagination a {
  321. position:absolute;
  322. margin:-3px 0px 0px 0px;
  323. right:200px;
  324. padding:4px 5px;
  325. background-color:#e6e6e6;
  326. color:{color:text};
  327. font-size:8px;
  328. text-align:center;
  329. text-transform:uppercase;
  330. }
  331.  
  332. #rightpagination a {
  333. position: absolute;
  334. margin:-3px 0px 0px 0px;
  335. right:150px;
  336. padding:4px 5px;
  337. background-color:#e6e6e6;
  338. color:{color:text};
  339. font-size:8px;
  340. text-align:center;
  341. text-transform:uppercase;
  342. }
  343.  
  344.  
  345. #leftpagination a:hover, #rightpagination a:hover {
  346. background-color:{color:background};
  347. }
  348.  
  349.  
  350. /* --------------- PLEASE DON'T TOUCH THE FOLLOWING --------------- */
  351.  
  352. #required {
  353. position:fixed;
  354. bottom:10px;
  355. right:15px;
  356. width:20px;
  357. height:20px;
  358. }
  359.  
  360. #required img {
  361. max-width:15px;
  362. max-height:15px;
  363. padding:3px;
  364. border: 1px solid #afafaf;
  365. background-color:white;
  366. -webkit-transition: all 0.4s ease-in-out;
  367. -moz-transition: all 0.4s ease-in-out;
  368. -o-transition: all 0.4s ease-in-out;
  369. }
  370.  
  371. #required img:hover {
  372. border: 1px solid #afafaf;
  373. border-radius:10px;
  374. -webkit-transition: all 0.4s ease-in-out;
  375. -moz-transition: all 0.4s ease-in-out;
  376. -o-transition: all 0.4s ease-in-out;
  377. }
  378.  
  379.  
  380. /* ---------------------------- POSTS ---------------------------- */
  381.  
  382. #postmargin {
  383. width:100%;
  384. padding:400px 0px 100px 0px;
  385. }
  386.  
  387. .posts {
  388. margin:0 auto;
  389. margin-top:100px;
  390. width:400px;
  391. padding:40px 30px 40px 30px;
  392. background-color:{color:posts};
  393. }
  394.  
  395. .posts img {
  396. max-width:100%;
  397. }
  398.  
  399. .posts iframe {
  400. max-width:100%;
  401. }
  402.  
  403. #quote {
  404. margin-bottom:5px;
  405. font-size:15px;
  406. line-height:15px;
  407. }
  408.  
  409. #link {
  410. padding-bottom:10px;
  411. font-family: 'Roboto Condensed', sans-serif;
  412. font-size:15px;
  413. text-align:center;
  414. text-transform:uppercase;
  415. line-height:110%;
  416. }
  417.  
  418. #permalink {
  419. padding-top:10px;
  420. font-family:arial;
  421. line-height:100%;
  422. opacity:0;
  423. -webkit-transition: all 0.6s ease-out;
  424. -moz-transition: all 0.6s ease-out;
  425. transition: all 0.6s ease-out;
  426. }
  427.  
  428. .posts:hover #permalink {
  429. opacity:1;
  430. -webkit-transition: all 0.4s ease-out;
  431. -moz-transition: all 0.4s ease-out;
  432. transition: all 0.4s ease-out;
  433. }
  434.  
  435. .captions {
  436. padding-top:5px;
  437. padding-left:5px;
  438. }
  439.  
  440. .music {
  441. height:100px;
  442. padding:15px;
  443. background-color:#e6e6e6;
  444. }
  445.  
  446. .album {
  447. position:relative;
  448. float:right;
  449. z-index:1;
  450. }
  451.  
  452. .audioinfo {
  453. position:absolute;
  454. max-width:280px;
  455. height:100px;
  456. float:left;
  457. padding-left:10px;
  458. background:transparent;
  459. border-left:2px solid #000000;
  460. text-align:block;
  461. text-transform:uppercase;
  462. line-height:350%;
  463. letter-spacing:0px;
  464. -webkit-transition: all 0.4s ease-out;
  465. -moz-transition: all 0.4s ease-out;
  466. transition: all 0.4s ease-out;
  467. }
  468.  
  469. .music:hover .audioinfo {
  470. letter-spacing:5px;
  471. -webkit-transition: all 0.6s ease-out;
  472. -moz-transition: all 0.6s ease-out;
  473. transition: all 0.6s ease-out;
  474. }
  475.  
  476. .playbox {
  477. position:absolute;
  478. margin-top:37px;
  479. margin-left:308px;
  480. z-index:9;
  481. }
  482.  
  483. .playbutton {
  484. position: relative;
  485. width: 27px;
  486. height: 21px;
  487. padding-bottom:6px;
  488. overflow:hidden;
  489. -webkit-transition: all 0.4s ease-out;
  490. -moz-transition: all 0.4s ease-out;
  491. transition: all 0.4s ease-out;
  492. }
  493.  
  494.  
  495. .playbutton:hover {
  496. border-radius: 30px;
  497. -moz-border-radius: 30px;
  498. -webkit-border-radius: 30px;
  499. -webkit-transition: all 0.6s ease-out;
  500. -moz-transition: all 0.6s ease-out;
  501. transition: all 0.6s ease-out;
  502. }
  503.  
  504. #dating {
  505. height:auto;
  506. width:100%;
  507. margin-top:10px;
  508. padding-top:10px;
  509. padding-bottom:10px;
  510. background-color:{color:background};
  511. border-bottom:solid 1px #e6e6e6;
  512. font-size:8px;
  513. text-transform:uppercase;
  514. text-align:center;
  515. }
  516.  
  517. #tags {
  518. height:auto;
  519. width:100%;
  520. padding-top:10px;
  521. padding-bottom:10px;
  522. background-color:transparent;
  523. font-size:7px;
  524. word-spacing:1px;
  525. text-transform:uppercase;
  526. text-align:center;
  527. line-height:160%;
  528. -webkit-transition: all 0.6s ease-out;
  529. -moz-transition: all 0.6s ease-out;
  530. transition: all 0.6s ease-out;
  531. }
  532.  
  533. #tags a {
  534. padding:2px 5px 2px 5px;
  535. background-color:#ffffff;
  536. opacity:0.4;
  537. }
  538.  
  539. #tags a:hover {
  540. padding:2px 5px 2px 5px;
  541. opacity:1;
  542. }
  543.  
  544. #questions {
  545. min-height:75px;
  546. padding:15px;
  547. background-color:#e6e6e6;
  548. text-align:left;
  549. }
  550.  
  551. .port img {
  552. float:right;
  553. }
  554.  
  555. #ask {
  556. width:290px;
  557. height:auto;
  558. background:transparent;
  559. text-align:left;
  560. line-height:120%;
  561. }
  562.  
  563. #answers {
  564. width:290px;
  565. padding-top:5px;
  566. padding-left:10px;
  567. background:transparent;
  568. text-align:left;
  569. }
  570.  
  571. /* ----------------------- UPDATES TAB & ASK ----------------------- */
  572.  
  573. /* ------- BOX 1 ------- */
  574.  
  575. #box {
  576. position:absolute;
  577. top:58px;
  578. left:20px;
  579. width:10px;
  580. height:0px;
  581. padding:0px 1px 0px 1px;
  582. background:{color:background};
  583. border-top:12px solid {color:box1};
  584. z-index:9999999;
  585. -webkit-transition: all 0.8s ease-out;
  586. -moz-transition: all 0.8s ease-out;
  587. transition: all 0.8s ease-out;
  588. }
  589.  
  590. #box:hover {
  591. height:10px;
  592. width:85px;
  593. background:{color:background};
  594. border-top:solid 12px {color:linkshover};
  595. }
  596.  
  597. #box:hover #cont {
  598. width:80px;
  599. height:auto;
  600. background:{color:background};
  601. opacity:1;
  602. }
  603.  
  604. #cont {
  605. position:fixed;
  606. width:0px;
  607. height:0px;
  608. padding:2px;
  609. overflow:hidden;
  610. background:{color:background};
  611. font-size:10px;
  612. text-align:center;
  613. z-index:9;
  614. opacity:0;
  615. -webkit-transition: all 0.8s ease-out;
  616. -moz-transition: all 0.8s ease-out;
  617. transition: all 0.8s ease-out;
  618. }
  619.  
  620. /* ------- BOX 2 ------- */
  621.  
  622. #box2 {
  623. position:absolute;
  624. top:58px;
  625. left:32px;
  626. width:10px;
  627. height:0px;
  628. padding:0px 1px 0px 1px;
  629. background:{color:background};
  630. border-top:12px solid {color:box2};
  631. z-index:999999;
  632. -webkit-transition: all 0.8s ease-out;
  633. -moz-transition: all 0.8s ease-out;
  634. transition: all 0.8s ease-out;
  635. }
  636.  
  637. #box2:hover {
  638. height:auto;
  639. width:85px;
  640. background:{color:background};
  641. border-top:solid 12px {color:linkshover};
  642. }
  643.  
  644. #box2:hover #cont2 {
  645. width:80px;
  646. height:auto;
  647. background:{color:background};
  648. border:0px solid #fff;
  649. opacity:1;
  650. }
  651.  
  652. #cont2 {
  653. position:fixed;
  654. width:0px;
  655. height:0px;
  656. padding:2px;
  657. overflow:hidden;
  658. background:{color:background};
  659. font-size:10px;
  660. text-align:center;
  661. z-index:9;
  662. opacity:0;
  663. -webkit-transition: all 0.8s ease-out;
  664. -moz-transition: all 0.8s ease-out;
  665. transition: all 0.8s ease-out;
  666. }
  667.  
  668. /* ------- BOX 3 ------- */
  669.  
  670. #box3 {
  671. position:absolute;
  672. top:58px;
  673. left:44px;
  674. width:10px;
  675. height:0px;
  676. padding:0px 1px 0px 1px;
  677. background:{color:background};
  678. border-top:12px solid {color:box3};
  679. z-index:99999;
  680. -webkit-transition: all 0.8s ease-out;
  681. -moz-transition: all 0.8s ease-out;
  682. transition: all 0.8s ease-out;
  683. }
  684.  
  685. #box3:hover {
  686. height:auto;
  687. width:85px;
  688. background:{color:background};
  689. border-top:solid 12px {color:linkshover};
  690. }
  691.  
  692. #box3:hover #cont3 {
  693. width:80px;
  694. height:auto;
  695. background:{color:background};
  696. opacity:1;
  697. }
  698.  
  699. #cont3 {
  700. position:fixed;
  701. width:0px;
  702. height:0px;
  703. padding:2px;
  704. overflow:hidden;
  705. background:{color:background};
  706. font-size:10px;
  707. text-align:center;
  708. z-index:99999;
  709. opacity:0;
  710. -webkit-transition: all 0.8s ease-out;
  711. -moz-transition: all 0.8s ease-out;
  712. transition: all 0.8s ease-out;
  713. }
  714.  
  715.  
  716.  
  717. /* ------- BOX 4 ------- */
  718.  
  719. #box4 {
  720. position:absolute;
  721. top:58px;
  722. left:56px;
  723. width:10px;
  724. height:0px;
  725. padding:0px 1px 0px 1px;
  726. background:{color:background};
  727. border-top:12px solid {color:box4};
  728. z-index:9999;
  729. -webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;
  730. }
  731.  
  732. #box4:hover {
  733. height:auto;
  734. width:85px;
  735. background:{color:background};
  736. border-top:solid 12px {color:linkshover};
  737. }
  738.  
  739. #box4:hover #cont4 {
  740. width:80px;
  741. height:auto;
  742. background:{color:background};
  743. opacity:1;
  744. }
  745.  
  746. #cont4 {
  747. position:fixed;
  748. width:0px;
  749. height:0px;
  750. padding:2px;
  751. overflow:hidden;
  752. background:{color:background};
  753. font-size:10px;
  754. text-align:center;
  755. z-index:9;
  756. opacity:0;
  757. -webkit-transition: all 0.8s ease-out;
  758. -moz-transition: all 0.8s ease-out;
  759. transition: all 0.8s ease-out;
  760. }
  761.  
  762. /* ------- ASK BOX ------- */
  763.  
  764. #box1{
  765. color:#000000;
  766. font-family: 'Roboto Condensed', sans-serif;
  767. font-size:20px;
  768. text-align:center;
  769. font-weight:bold;
  770. text-transform:uppercase;
  771. letter-spacing:-1px;
  772. word-spacing:2px;
  773. }
  774.  
  775. #box1 a {
  776. color:{color:navi squares hover};
  777. }
  778.  
  779. .popup_block {
  780. position:fixed;
  781. float:left;
  782. top:40%;
  783. left:53%;
  784. height:auto;
  785. background:transparent;
  786. font-size:14px;
  787. text-align:center;
  788. line-height:95%;
  789. display:none;
  790. z-index: 99999;
  791. }
  792.  
  793. .dabox {
  794. border:4px double #ebebeb;
  795. -webkit-box-shadow: 0px 0px 20px #a8a8a8;
  796. -moz-box-shadow: 0px 0px 20px #a8a8a8;
  797. box-shadow: 0px 0px 20px #a8a8a8;
  798. }
  799.  
  800. img.btn_close {float: right;margin: -20 -20px 0 0;}
  801. *html #fade {position: absolute;}
  802. *html .popup_block {position: absolute;}
  803. #fade {display:none;background:#ffffff;position:fixed;left:0;top:0;
  804. width:100%;height:100%;opacity:0.9;z-index:9999;}
  805.  
  806.  
  807.  
  808.  
  809.  
  810. {CustomCSS}</style></head><body>
  811.  
  812. <div id="header">
  813. <div id="headerpic"></div>
  814. </div>
  815.  
  816. <div id="desc">
  817. <div id="description">
  818. {description}
  819. </div>
  820. </div>
  821.  
  822. <div class="header">
  823. <div id="headerWrapper">
  824. <div id="underhead">
  825. <div id="underheadpic"></div>
  826. </div>
  827.  
  828. <div id="titlebar">
  829. <div class="title">
  830. {title}
  831. </div>
  832. </div>
  833.  
  834. <div id="leftpagination">
  835. {block:Pagination}
  836. {block:PreviousPage}
  837. <a href="{PreviousPage}" class="jump_page">back</a>
  838. {/block:PreviousPage}
  839. {/block:Pagination}
  840. </div>
  841. <div id="rightpagination">
  842. {block:Pagination}
  843. {block:NextPage}
  844. <a href="{NextPage}" class="jump_page">next</a>
  845. {/block:NextPage}
  846. {/block:Pagination}
  847. </div>
  848.  
  849.  
  850. <!------------ Navigation START --------------->
  851.  
  852. <div id="navigation">
  853. <a href="/" title="home"></a>
  854. <a href="#?w=450" rel="box1" class="poplight" title="ask"></a>
  855. <a href="{text:link3url}" title="{text:link3name}"></a>
  856. <a href="{text:link4url}" title="{text:link4name}"></a>
  857. <a href="{text:link5url}" title="{text:link5name}"></a>
  858. </div>
  859. </div>
  860.  
  861. <!------------ Navigation END --------------->
  862.  
  863.  
  864.  
  865.  
  866. <!------------ UPDATES TAB --------------->
  867.  
  868. <div id="box">
  869. <div id="cont">
  870. <br>
  871. <div style="padding-top:1px; text-transform:uppercase; line-height:10px; text-align:center; opacity:0.8;font-size:8px">
  872. <div style="font-size:10px;letter-spacing:2px;padding-bottom:1px;border-bottom:1px solid #000000">
  873.  
  874. <!------------ 1. Tab name from here --------------->
  875.  
  876. TAB NAME
  877.  
  878. <!------------ to here --------------->
  879.  
  880. </div>
  881. <br>
  882.  
  883. <!------------ 1. tab content from here --------------->
  884.  
  885. FIRST TAB CONTENT YAY
  886. <br><br>
  887. Make it as long as you want!
  888. <br><br>
  889.  
  890. <!------------ to here --------------->
  891. </div>
  892. </div>
  893. </div>
  894.  
  895. <div id="box2">
  896. <div id="cont2">
  897. <br>
  898. <div style="padding-top:1px; text-transform:uppercase; line-height:10px; text-align:center; opacity:0.8;font-size:8px">
  899. <div style="font-size:10px;letter-spacing:2px;padding-bottom:1px;border-bottom:1px solid #000000">
  900.  
  901. <!------------ 2. tab name from here --------------->
  902.  
  903. Second tab
  904.  
  905. <!------------ to here --------------->
  906.  
  907. </div>
  908. <br>
  909.  
  910. <!------------ 2. tab content from here --------------->
  911.  
  912. Same, make it as long as you want!
  913.  
  914. <!------------ to here --------------->
  915.  
  916. </div>
  917. </div>
  918. </div>
  919.  
  920. <div id="box3">
  921. <div id="cont3">
  922. <br>
  923. <div style="padding-top:1px; text-transform:uppercase; line-height:10px; text-align:center; opacity:0.8;font-size:8px">
  924. <div style="font-size:10px;letter-spacing:2px;padding-bottom:1px;border-bottom:1px solid #000000">
  925.  
  926. <!------------ 3. tab name from here --------------->
  927.  
  928. Third
  929.  
  930. <!------------ to here --------------->
  931.  
  932. </div>
  933. <br>
  934.  
  935. <!------------ 3. tab name from here --------------->
  936.  
  937. Content third tab
  938.  
  939. <!------------ to here --------------->
  940.  
  941. </div>
  942. </div>
  943. </div>
  944.  
  945. <div id="box4">
  946. <div id="cont4">
  947. <br>
  948. <div style="padding-top:1px; text-transform:uppercase; line-height:10px; text-align:center; opacity:0.8;font-size:8px">
  949. <div style="font-size:10px;letter-spacing:2px;padding-bottom:1px;border-bottom:1px solid #000000">
  950.  
  951. <!------------ 4. tab name from here --------------->
  952.  
  953. Last tab
  954.  
  955. <!------------ to here --------------->
  956.  
  957. </div>
  958. <br>
  959.  
  960. <!------------ 4. tab content from here --------------->
  961.  
  962. fourth tab <br>
  963. line breaks with < br > without spaces
  964. <br><br>
  965. two < br > in a row for a new paragraph
  966.  
  967. <!------------ to here --------------->
  968.  
  969. </div>
  970. </div>
  971. </div>
  972. </div>
  973.  
  974. <!------------ END UPDATES TAB --------------->
  975.  
  976. <script>
  977. var header = document.querySelector('.header');
  978. var origOffsetY = header.offsetTop;
  979. function onScroll(e) {
  980. window.scrollY >= origOffsetY ? header.classList.add('sticky') :
  981. header.classList.remove('sticky');}
  982. document.addEventListener('scroll', onScroll);
  983. </script>
  984.  
  985. <div id="postmargin">
  986. {block:Posts}
  987.  
  988. <div class="posts">
  989.  
  990. {block:ContentSource}
  991. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  992. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  993. {/block:SourceLogo}
  994. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  995. {/block:ContentSource}
  996.  
  997. {block:Text}
  998. <div id="link">
  999. {block:Title}{Title}{/block:Title}
  1000. </div>
  1001. <div class="caption">{Body}</div>
  1002. {/block:Text}
  1003.  
  1004. {block:Photo}
  1005. {LinkOpenTag}<img src="{PhotoURL-400}" width="400">{LinkCloseTag}
  1006. {block:Caption}
  1007. <div class="caption">{Caption}</div>
  1008. {/block:Caption}
  1009. {/block:Photo}
  1010.  
  1011. {block:Photoset}
  1012. {Photoset-400}
  1013. {block:Caption}
  1014. <div class="caption">{Caption}</div>
  1015. {/block:Caption}
  1016. {/block:Photoset}
  1017.  
  1018. {block:Quote}
  1019. <div id="quote">
  1020. {Quote}
  1021. </div>
  1022. {block:Source} —{Source}{/block:Source}
  1023. {/block:Quote}
  1024.  
  1025. {block:Link}
  1026. <div id="link">
  1027. <a href="{URL}" {Target}>{Name}</a>
  1028. </div>
  1029. {block:Description}<div class="caption">{Description}</div>
  1030. {/block:Description}
  1031. {/block:Link}
  1032.  
  1033. {block:Chat}
  1034. {block:Title}<t>{Title}</t>{/block:Title}
  1035. {block:Lines}
  1036. {block:Label}<b>{Label}</b>{/block:Label} {Line}<br>
  1037. {/block:Lines}
  1038. {/block:Chat}
  1039.  
  1040. {block:Audio}
  1041. <div class="music">
  1042. <div class="playbox">
  1043. <div class="playbutton">
  1044. {block:AudioPlayer}
  1045. {AudioPlayerWhite}
  1046. {/block:AudioPlayer}
  1047. </div>
  1048. </div>
  1049. {block:AlbumArt}
  1050. <img src="{AlbumArtURL}" width="100" class="album">
  1051. {/block:AlbumArt}
  1052.  
  1053. <div class="audioinfo">
  1054. {block:TrackName}{TrackName}{/block:TrackName}
  1055. {block:Artist}<br>{Artist}{/block:Artist}
  1056. {block:Album}<br>{Album}{/block:Album}
  1057. </div>
  1058. </div>
  1059. {/block:Audio}
  1060.  
  1061. {block:Video}
  1062. {Video-500}
  1063. {block:Caption}
  1064. <div class="caption">{Caption}</div>
  1065. {/block:Caption}
  1066. {/block:Video}
  1067.  
  1068. {block:Answer}
  1069. <div id="questions">
  1070. <div class="port">
  1071. <a href="{AskerURL}"><img src="{AskerPortraitURL-64}"></a>
  1072. </div>
  1073. <div id="ask">{Question}</div>
  1074. </div>
  1075. <div id="answers">
  1076. {Answer}
  1077. </div>
  1078. {/block:Answer}
  1079.  
  1080. <div id="permalink">
  1081. <div id="dating">
  1082.  
  1083. {block:Date}
  1084. <a href="{Permalink}">{Month} {DayOfMonth}{DayOfMonthSuffix}</a>
  1085. {/block:Date}
  1086.  
  1087. {block:NoteCount}
  1088. • <a href="{Permalink}">{NoteCount}N</a>
  1089. {/block:NoteCount}
  1090.  
  1091. {block:RebloggedFrom}
  1092. • <a href="{ReblogRootURL}">org</a>
  1093. • <a href="{ReblogParentURL}">via</a>
  1094. • <a href="{ReblogURL}" target="_blank" class="details">Reblog</a> {/block:RebloggedFrom}
  1095. </div>
  1096.  
  1097. {block:HasTags}
  1098. <div id="tags">
  1099. {block:Tags}
  1100. <a href="{TagURL}">{Tag}</a>
  1101. {/block:Tags}
  1102. </div>
  1103. {/block:HasTags}
  1104.  
  1105. </div>
  1106. </div>
  1107. {/block:Posts}
  1108. </div>
  1109.  
  1110.  
  1111.  
  1112. </body>
  1113.  
  1114. <div id="required"><a href="http://sartasticthemes.tumblr.com"><img src="http://static.tumblr.com/qzk7sj0/sDQnaxu52/password.jpg"></a></div>
  1115.  
  1116.  
  1117. <!------------ ASK BOX --------------->
  1118.  
  1119. <div id="box1" class="popup_block">
  1120.  
  1121. <p>{text:Ask box title}</p>
  1122.  
  1123. <br><br><br>
  1124.  
  1125. <div style="font-family:verdana;font-size:9px;font-weight:normal">
  1126.  
  1127.  
  1128. <!------------ Any additional text from here --------------->
  1129.  
  1130. Anything else you want to say maybe a <a href="/">link</a> to your faq.
  1131.  
  1132. <!------------ to here --------------->
  1133.  
  1134. </div><br><br>
  1135.  
  1136. <div class="dabox">
  1137. <p><iframe frameborder="0" scrolling="no" width="100%" height="190" src="http://www.tumblr.com/ask_form/{text:url}.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"></iframe><!--[if IE]><script type="text/javascript">document.getElementById('ask_form').allowTransparency=true;</script><![endif]--></p>
  1138. </div>
  1139. </div>
  1140.  
  1141. </div></div></div></div></div></div></div></div></div></div>
  1142.  
  1143. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!