API tools faq
paste
lindsayloo

Theme Nine: Wavelength (+)

lindsayloo
Dec 23rd, 2014
250
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 25.02 KB | None | 0 0
raw download clone embed print report
  1. <!---
  2.  
  3. THEME NINE : WAVELENGTH (RESPONSIVE)
  4. BY CASOWL
  5. DO NOT, UNDER ANY CIRCUMSTANCES, REMOVE (OR MOVE) THE CREDIT
  6. SERIOUSLY, DON'T DO IT, OKAY? I WILL FIND OUT
  7. YOU CAN EDIT AS MUCH AS YOU WANT, BUT DO NOT REDISTRIBUTE OR USE AS A BASE CODE. IF YOU NEED A BASE CODE, I CAN GIVE YOU THE ONE I USED
  8. IF YOU NEED HELP WITH ANYTHING, COME ASK ME AT casowl.tumblr.com/talk
  9.  
  10. SPECIAL NOTE:
  11. THIS THEME IS RESPONSIVE, WHICH MEANS THAT IT CHANGES TO ACCOMMODATE FOR DIFFERENT SCREEN SIZES SO THAT IT LOOKS GOOD ON ALL DEVICES, EVEN MOBILE.
  12. TO DO THAT, I USED MEDIA QUERIES TO TELL THE PAGE TO CHANGE LAYOUT WHEN THE SCREEN GETS DOWN TO A CERTAIN SIZE.
  13. THE MEDIA QUERIES ARE THE PARTS OF THE CODE THAT START WITH "@media," AND I ADVISE YOU NOT TO MESS WITH THEM UNLESS YOU REALLY KNOW WHAT YOU'RE DOING, YOU COULD SERIOUSLY SCREW SOMETHING UP.
  14.  
  15. ALSO, IF THERE ARE ANY BUGS OR GLITCHES IN THE THEME ON ANY DEVICE, WHETHER IT BE DESKTOP OR MOBILE, PLEASE LET ME KNOW SO THAT I CAN FIX IT. I'M NOT PERFECT, AND THEREFORE MY CODE WILL NOT ALWAYS BE PERFECT.
  16.  
  17. THANKS SO MUCH FOR USING MY THEME, IT MEANS A LOT TO ME <3
  18.  
  19. --->
  20.  
  21.  
  22.  
  23.  
  24.  
  25. <html>
  26.  
  27. <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
  28.  
  29. <head>
  30.  
  31. <title>{Title}</title>
  32. <link rel="shortcut icon" href="{Favicon}">
  33. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  34. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  35.  
  36. <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
  37.  
  38.  
  39.  
  40. </style>
  41.  
  42. <meta name="color:background" content=""/>
  43. <meta name="color:mobile background" content=""/>
  44. <meta name="color:text" content="#bbbbbb"/>
  45. <meta name="color:mobile text" content=""/>
  46. <meta name="color:bold text" content=""/>
  47. <meta name="color:mobile accent 1" content=""/>
  48. <meta name="color:mobile accent 2" content=""/>
  49. <meta name="color:link" content="#aaaaaa"/>
  50. <meta name="color:link hover" content="#f1f1f1"/>
  51. <meta name="color:info background" content=""/>
  52. <meta name="color:title" content=""/>
  53. <meta name="color:tags" content=""/>
  54. <meta name="color:tags hover" content=""/>
  55. <meta name="color:post background" content=""/>
  56. <meta name="color:sidebar links" content=""/>
  57. <meta name="color:home link" content=""/>
  58. <meta name="color:sidebar links hover" content=""/>
  59. <meta name="color:home link hover" content=""/>
  60. <meta name="color:sidebar links text" content=""/>
  61. <meta name="color:sidebar background" content=""/>
  62. <meta name="color:scrollbar" content=""/>
  63. <meta name="color:pagi" content=""/>
  64. <meta name="color:pagi hover" content=""/>
  65. <meta name="color:pre" content=""/>
  66.  
  67. <meta name="image:border image" content=""/>
  68.  
  69. <meta name="text:linkA" content="">
  70. <meta name="text:linkA url" content="/">
  71. <meta name="text:linkB" content="">
  72. <meta name="text:linkB url" content="/">
  73. <meta name="text:linkC" content="">
  74. <meta name="text:linkC url" content="/">
  75. <meta name="text:linkD" content="">
  76. <meta name="text:linkD url" content="/">
  77.  
  78.  
  79.  
  80.  
  81.  
  82. <style type="text/css">
  83.  
  84. #s-m-t-tooltip {
  85. max-width:140px;
  86. opacity:1;
  87. padding:3px;
  88. margin:10px;
  89. background-color:{color:post background};
  90. font-family:'calibri';
  91. font-size:8px;
  92. text-align:center;
  93. letter-spacing:1px;
  94. text-transform:uppercase;
  95. color:{color:text};
  96. z-index:1000;
  97. }
  98.  
  99. /* --- CURSOR --- */
  100.  
  101. html, body, a { cursor:url("http://i.imgur.com/2qleX.jpg"), auto; }a:hover{cursor:url("http://i.imgur.com/IepP2.jpg"), auto; }
  102.  
  103. ::-moz-selection { background: {color:text}; color: {color:background}; }
  104. ::selection { background: {color:text}; color: {color:background}; }
  105.  
  106. /* --- DON'T TOUCH --- */
  107.  
  108. pre {
  109. white-space: pre-wrap;
  110. white-space: -moz-pre-wrap;
  111. white-space: -pre-wrap;
  112. white-space: -o-pre-wrap;
  113. word-wrap: break-word;
  114. max-width:400px;
  115. display:block;
  116. background-color:{color:pre};
  117. color:{color:text};
  118. letter-spacing:1px;
  119. padding:5px;
  120. }
  121.  
  122. @media screen and (max-width:900px), handheld {
  123. pre {
  124. width:100%;
  125. padding:.5%;
  126. }
  127. }
  128.  
  129.  
  130.  
  131. /* --- FOLLOW BUTTON --- */
  132.  
  133. #tumblr_controls {
  134. position:fixed !important;
  135. -webkit-filter: invert(100%);
  136. }
  137.  
  138. /* --- SCROLLBAR --- */
  139.  
  140. ::-webkit-scrollbar-thumb{
  141. background-color: {color:scrollbar};
  142. height:auto;
  143. }
  144.  
  145. ::-webkit-scrollbar {
  146. height:10px;
  147. width:7px;
  148. background-color: {color:background};
  149. }
  150.  
  151.  
  152.  
  153. /* --- POSTS/BODY --- */
  154.  
  155. body {
  156. background:{color:background};
  157. color:{color:text};
  158. font-family:'calibri';
  159. font-size:11px;
  160. line-height:130%;
  161. }
  162.  
  163. @media screen and (max-width:900px), handheld {
  164. body {
  165. background:{color:mobile background};
  166. color:{color:mobile text};
  167. overflow-x:hidden;
  168. }
  169. }
  170.  
  171. a {
  172. text-decoration:none;
  173. color:{color:link};
  174. -webkit-transition: all 1s ease-in-out;
  175. -moz-transition: all 1s ease-in-out;
  176. -o-transition: all 1s ease-in-out;
  177. -ms-transition: all 1s ease-in-out;
  178. -transition: all 1s ease-in-out;
  179. }
  180.  
  181. @media screen and (max-width:900px), handheld {
  182. a {
  183. text-decoration:underline;
  184. color:{color:mobile text};
  185. }
  186. }
  187.  
  188. a:hover {
  189. color:{color:link hover};
  190. -webkit-transition: all 1s ease-in-out;
  191. -moz-transition: all 1s ease-in-out;
  192. -o-transition: all 1s ease-in-out;
  193. -ms-transition: all 1s ease-in-out;
  194. -transition: all 1s ease-in-out;
  195. }
  196.  
  197. strong {
  198. color:{color:bold text};
  199. }
  200.  
  201. @media screen and (max-width:900px), handheld {
  202. strong {
  203. color:{color:mobile text};
  204. }
  205. }
  206.  
  207. .posttitle {
  208. font-size:15px;
  209. text-transform:uppercase;
  210. padding:20px;
  211. margin-bottom:20px;
  212. margin-top:-20px;
  213. margin-left:-20px;
  214. margin-right:-20px;
  215. background-color:{color:info background};
  216. }
  217.  
  218. @media screen and (max-width:900px), handheld {
  219. .posttitle {
  220. width:100%;
  221. padding:2%;
  222. padding-bottom:0%;
  223. margin-left:-2%;
  224. margin-top:-2%;
  225. margin-bottom:0%;
  226. font-weight:bold;
  227. color:{color:mobile accent 1};
  228. background-color:{color:mobile background};
  229. }
  230. }
  231.  
  232. .quote {
  233. font-size:15px;
  234. padding:20px;
  235. margin-top:-20px;
  236. margin-left:-20px;
  237. margin-right:-20px;
  238. background-color:{color:info background};
  239. }
  240.  
  241. @media screen and (max-width:900px), handheld {
  242. .quote {
  243. width:100%;
  244. padding:2%;
  245. padding-bottom:0%;
  246. margin-left:-2%;
  247. margin-top:-2%;
  248. margin-bottom:0%;
  249. font-weight:bold;
  250. color:{color:mobile accent 1};
  251. background-color:{color:mobile background};
  252. }
  253. }
  254.  
  255. .linkpost a {
  256. font-size:15px;
  257. text-transform:uppercase;
  258. padding:20px;
  259. margin-bottom:20px;
  260. display:block;
  261. margin-top:-20px;
  262. margin-left:-20px;
  263. margin-right:-20px;
  264. background-color:{color:info background};
  265. color:{color:tags};
  266. -webkit-transition: all 1s ease-in-out;
  267. -moz-transition: all 1s ease-in-out;
  268. -o-transition: all 1s ease-in-out;
  269. -ms-transition: all 1s ease-in-out;
  270. -transition: all 1s ease-in-out;
  271. }
  272.  
  273. @media screen and (max-width:900px), handheld {
  274. .linkpost a {
  275. width:100%;
  276. padding:2%;
  277. margin-left:-2%;
  278. margin-top:1%;
  279. margin-bottom:0%;
  280. font-weight:bold;
  281. background-color:{color:mobile accent 2};
  282. color:{color:mobile background};
  283. }
  284. }
  285.  
  286. .linkpost a:hover {
  287. color:{color:info background};
  288. background-color:{color:tags};
  289. -webkit-transition: all 1s ease-in-out;
  290. -moz-transition: all 1s ease-in-out;
  291. -o-transition: all 1s ease-in-out;
  292. -ms-transition: all 1s ease-in-out;
  293. -transition: all 1s ease-in-out;
  294. }
  295.  
  296. blockquote {
  297. padding-left:10px;
  298. margin-left:10px;
  299. border-left:1px solid {color:post info};
  300. }
  301.  
  302.  
  303.  
  304. /* --- THIS IS THE STUFF THAT MAKES THE POSTS RESPONSIVE. DON'T TOUCH UNLESS YOU KNOW WHAT YOU'RE DOING --- */
  305.  
  306. @media screen and (max-width:900px), handheld {
  307. blockquote {
  308. padding-left:2%;
  309. margin-left:2%;
  310. }
  311. }
  312.  
  313. img {
  314. max-width:100%;
  315. }
  316.  
  317. .tumblr_audio_player {
  318. width:400px;
  319. }
  320.  
  321. @media screen and (max-width:900px), handheld {
  322. .tumblr_audio_player {
  323. width:100%;
  324. max-width:100%;
  325. }
  326. }
  327.  
  328. .videoWrapper {
  329. height:0px;
  330. position:relative;
  331. padding-bottom:56.25%;
  332. }
  333.  
  334. .videoWrapper iframe {
  335. width:100%;
  336. height:100%;
  337. top:0px;
  338. left:0px;
  339. position:absolute;
  340. }
  341.  
  342.  
  343.  
  344. /* --- SIDEBAR --- */
  345.  
  346. #sidebar {
  347. width:160px;
  348. padding:20px;
  349. padding-bottom:0px;
  350. text-align:center;
  351. background-color:{color:sidebar background};
  352. }
  353.  
  354. @media screen and (max-width:900px), handheld {
  355. #sidebar {
  356. width:100%;
  357. padding:0px;
  358. background-color:{color:mobile background};
  359. border-bottom:solid 1px {color:mobile accent 2};
  360. }
  361. }
  362.  
  363. #sidebarborder {
  364. position:fixed;
  365. padding:30px;
  366. margin-left:180px;
  367. margin-top:230px;
  368. width:auto;
  369. height:auto;
  370. background-image:url({image:border image});
  371. }
  372.  
  373. @media screen and (max-width:1040px) {
  374. #sidebarborder {
  375. margin-left:50px;
  376. }
  377. }
  378.  
  379. @media screen and (max-width:900px), handheld {
  380. #sidebarborder {
  381. padding:0px;
  382. left:0px;
  383. right:0px;
  384. margin-top:0px;
  385. width:100%;
  386. margin-top:-1%;
  387. margin-left:auto;
  388. margin-right:auto;
  389. position:relative;
  390. }
  391. }
  392.  
  393. .title {
  394. position:relative;
  395. font-size:20px;
  396. line-height:110%;
  397. font-family:'calibri';
  398. margin-left:auto;
  399. margin-right:auto;
  400. text-align:center;
  401. width:100%;
  402. margin-left:-20px;
  403. margin-top:-20px;
  404. padding:20px;
  405. letter-spacing:2px;
  406. color:{color:title};
  407. background-color:{color:info background};
  408. text-transform:uppercase;
  409. }
  410.  
  411. @media screen and (max-width:900px), handheld {
  412. .title {
  413. padding-top:2%;
  414. padding-bottom:0%;
  415. padding-left:0%;
  416. padding-right:0%;
  417. margin-left:0%;
  418. margin-top:2%;
  419. width:100%;
  420. letter-spacing:5px;
  421. background-color:{color:mobile background};
  422. color:{color:mobile accent 1};
  423. }
  424. }
  425.  
  426. @media screen and (max-width:650px) {
  427. .title {
  428. margin-top:32px;
  429. }
  430. }
  431.  
  432. .desc {
  433. position:relative;
  434. font-family:'calibri';
  435. line-height:130%;
  436. font-size:11px;
  437. font-style:normal;
  438. padding-top:10px;
  439. margin-left:auto;
  440. margin-right:auto;
  441. text-align:center;
  442. }
  443.  
  444. @media screen and (max-width:900px), handheld {
  445. .desc {
  446. padding-bottom:2%;
  447. padding-top:1%;
  448. }
  449. }
  450.  
  451. .links {
  452. position:relative;
  453. padding-top:20px;
  454. padding-bottom:20px;
  455. margin-top:15px;
  456. margin-left:-50px;
  457. background-color:{color:info background};
  458. width:260px;
  459. font-family:'calibri';
  460. text-align:center;
  461. text-transform:uppercase;
  462. }
  463.  
  464. @media screen and (max-width:900px), handheld {
  465. .links {
  466. width:100%;
  467. margin-left:0px;
  468. background-color:{color:mobile accent 2};
  469. padding-top:1%;
  470. padding-bottom:1%;
  471. margin-top:0%;
  472. bottom:0px;
  473. left:0px;
  474. position:fixed;
  475. display:block;
  476. z-index:100;
  477. }
  478. }
  479.  
  480. .links a {
  481. display:inline-block;
  482. position:relative;
  483. border:1px solid {color:sidebar links};
  484. background-color:{color:sidebar links};
  485. color:{color:sidebar links};
  486. margin:7.25px;
  487. margin-bottom:3px;
  488. max-width:12px;
  489. min-width:12px;
  490. height:12px;
  491. padding:3px;
  492. overflow:hidden;
  493. -moz-transition-duration:1s;
  494. -webkit-transition-duration:1s;
  495. -o-transition-duration:1s;
  496. }
  497.  
  498. @media screen and (max-width:900px), handheld {
  499. .links a {
  500. max-width:100%;
  501. text-decoration:none;
  502. border-radius:10%;
  503. padding:1%;
  504. border:0px solid {color:sidebar links};
  505. background-color:{color:mobile accent 1};
  506. color:{color:mobile accent 2};
  507. font-weight:bold;
  508. }
  509. }
  510.  
  511. .links a:hover {
  512. max-width:500px;
  513. border:1px solid {color:sidebar links hover};
  514. background-color:{color:sidebar links hover};
  515. color:{color:sidebar links text};
  516. -moz-transition-duration:1s;
  517. -webkit-transition-duration:1s;
  518. -o-transition-duration:1s;
  519. }
  520.  
  521. @media screen and (max-width:900px), handheld {
  522. .links a:hover {
  523. border:0px solid {color:sidebar links hover};
  524. }
  525. }
  526.  
  527. .homelink {
  528. display:inline;
  529. }
  530.  
  531. .homelink a {
  532. border:1px solid {color:home link};
  533. background-color:{color:home link};
  534. color:{color:home link};
  535. -moz-transition-duration:1s;
  536. -webkit-transition-duration:1s;
  537. -o-transition-duration:1s;
  538. }
  539.  
  540. @media screen and (max-width:900px), handheld {
  541. .homelink a {
  542. color:{color:mobile accent 2};
  543. background-color:{color:mobile accent 1};
  544. border:solid 0px {color:home link};
  545. }
  546. }
  547.  
  548. .homelink a:hover {
  549. border:1px solid {color:home link hover};
  550. background-color:{color:home link hover};
  551. color:{color:sidebar links text};
  552. }
  553.  
  554. @media screen and (max-width:900px), handheld {
  555. .links a:hover {
  556. border:solid 0px {color:home link hover};
  557. }
  558. }
  559.  
  560.  
  561.  
  562. /* --- MORE POSTS --- */
  563.  
  564. #allposts {
  565. padding:10px;
  566. width:440px;
  567. margin-left:500px;
  568. margin-bottom:60px;
  569. margin-top:-20px;
  570. font-size:11px;
  571. }
  572.  
  573. @media screen and (max-width:1040px) {
  574. #allposts {
  575. margin-left:370px;
  576. }
  577. }
  578.  
  579. @media screen and (max-width:900px), handheld {
  580. #allposts {
  581. margin-left:0%;
  582. margin-right:0%;
  583. position:relative;
  584. padding:0%;
  585. margin-top:0%;
  586. margin-bottom:20%;
  587. width:100%;
  588. }
  589. }
  590.  
  591. #individualposts {
  592. width:400px;
  593. padding:20px;
  594. background-color:{color:post background};
  595. }
  596.  
  597. @media screen and (max-width:900px), handheld {
  598. #individualposts {
  599. width:96%;
  600. max-width:400px;
  601. margin-left:auto;
  602. margin-right:auto;
  603. margin-top:8%;
  604. padding:2%;
  605. margin-bottom:8%;
  606. background-color:{color:mobile background};
  607. }
  608. }
  609.  
  610. @media screen and (max-width:400px) {
  611. #individualposts {
  612. margin-bottom:10%;
  613. }
  614. }
  615.  
  616. #postborder {
  617. width:440px;
  618. height:auto;
  619. padding:30px;
  620. margin-top:60px;
  621. background-image:url({image:border image});
  622. }
  623.  
  624. @media screen and (max-width:900px), handheld {
  625. #postborder {
  626. background-image:none;
  627. background-color:{color:mobile background};
  628. width:100%;
  629. padding:0%;
  630. margin-top:0%;
  631. }
  632. }
  633.  
  634.  
  635.  
  636. /* --- PAGINATION --- */
  637.  
  638. .pagi {
  639. text-align:center;
  640. width:480px;
  641. margin-left:510px;
  642. margin-top:-50px;
  643. font-size:10px;
  644. text-transform:uppercase;
  645. font-weight:bold;
  646. font-family:'calibri';
  647. }
  648.  
  649. @media screen and (max-width:900px), handheld {
  650. .pagi {
  651. width:100%;
  652. margin-left:0%;
  653. margin-top:-16%;
  654. margin-bottom:10%;
  655. }
  656. }
  657.  
  658. @media screen and (max-width:550px) {
  659. .pagi {
  660. margin-bottom:12%;
  661. }
  662. }
  663.  
  664. @media screen and (max-width:400px) {
  665. .pagi {
  666. margin-bottom:14%;
  667. }
  668. }
  669.  
  670. .pagi a {
  671. text-decoration:none;
  672. color:{color:link};
  673. }
  674.  
  675. .pagi a:hover {
  676. color:{color:link hover};
  677. }
  678.  
  679.  
  680.  
  681. /* --- POST INFO --- */
  682.  
  683. #details {
  684. text-align:center;
  685. text-transform:uppercase;
  686. margin-top:20px;
  687. margin-bottom:-20px;
  688. font-size:10px;
  689. padding:10px;
  690. background-color:{color:info background};
  691. width:480px;
  692. margin-left:-50px;
  693. }
  694.  
  695. @media screen and (max-width:900px), handheld {
  696. #details {
  697. width:101%;
  698. padding:1%;
  699. padding-left:0%;
  700. margin-left:0%;
  701. margin-bottom:-2%;
  702. margin-top:0%;
  703. letter-spacing:1px;
  704. font-size:9px;
  705. text-align:left;
  706. background-color:{color:mobile background};
  707. }
  708. }
  709.  
  710. #details a {
  711. color:{color:tags};
  712. padding-bottom:2px;
  713. padding-left:2px;
  714. padding-right:2px;
  715. -moz-transition-duration:1s;
  716. -webkit-transition-duration:1s;
  717. -o-transition-duration:1s;
  718. }
  719.  
  720. @media screen and (max-width:900px), handheld {
  721. #details a {
  722. padding:0%;
  723. color:{color:mobile link};
  724. }
  725. }
  726.  
  727. #details a:hover {
  728. color:{color:tags hover};
  729. -moz-transition-duration:1s;
  730. -webkit-transition-duration:1s;
  731. -o-transition-duration:1s;
  732. }
  733.  
  734. #tags {
  735. font-family:'calibri';
  736. font-style:normal;
  737. }
  738.  
  739. #tags a {
  740. display:inline-block;
  741. padding:3px;
  742. text-align:left;
  743. text-transform:normal;
  744. color:{color:tags};
  745. -webkit-transition: all 1s ease-in-out;
  746. -moz-transition: all 1s ease-in-out;
  747. -o-transition: all 1s ease-in-out;
  748. -ms-transition: all 1s ease-in-out;
  749. -transition: all 1s ease-in-out;
  750. }
  751.  
  752. @media screen and (max-width:900px), handheld {
  753. #tags a {
  754. padding:0%;
  755. color:{color:mobile link};
  756. }
  757. }
  758.  
  759. #tags a:hover {
  760. color:{color:tags hover};
  761. -webkit-transition: all 1s ease-in-out;
  762. -moz-transition: all 1s ease-in-out;
  763. -o-transition: all 1s ease-in-out;
  764. -ms-transition: all 1s ease-in-out;
  765. -transition: all 1s ease-in-out;
  766. }
  767.  
  768.  
  769.  
  770. /* --- ASKS --- */
  771.  
  772. .question {
  773. padding:20px;
  774. margin-bottom:20px;
  775. margin-top:-20px;
  776. margin-left:-20px;
  777. margin-right:-20px;
  778. background-color:{color:info background};
  779. }
  780.  
  781. @media screen and (max-width:900px), handheld {
  782. .question {
  783. width:96%;
  784. padding:0%;
  785. padding-bottom:1%;
  786. margin-bottom:0%;
  787. background-color:{color:mobile background};
  788. border-bottom:solid 1px {color:mobile accent 2};
  789. margin-top:0%;
  790. margin-left:0%;
  791. }
  792. }
  793.  
  794.  
  795.  
  796. /* --- NOTES --- */
  797.  
  798. ol.notes {
  799. padding: 20px;
  800. width:460px;
  801. margin-top:-5px;
  802. background-color:{color:info background};
  803. list-style-type:none;
  804. }
  805.  
  806. @media screen and (max-width:900px), handheld {
  807. ol.notes {
  808. padding:0%;
  809. padding-top:2%;
  810. padding-bottom:2%;
  811. width:100%;
  812. margin-top:0%;
  813. background-color:{color:mobile background};
  814. }
  815. }
  816.  
  817. ol.notes li.note {
  818. text-align:center;
  819. border-top: solid 1px {color:background};
  820. padding:10px;
  821. width:440px;
  822. }
  823.  
  824. @media screen and (max-width:900px), handheld {
  825. ol.notes li.note {
  826. padding:2%;
  827. width:96%;
  828. border-top:solid 1px {color:mobile accent};
  829. }
  830. }
  831.  
  832. ol.notes li.note:first-child {
  833. border-top:none;
  834. padding-top:0px;
  835. }
  836.  
  837. ol.notes li.note:last-child {
  838. padding-bottom:0px;
  839. }
  840.  
  841. ol.notes li.note a {
  842. color:{color:tags};
  843. }
  844.  
  845. @media screen and (max-width:900px), handheld {
  846. ol.notes li.note a {
  847. color:{color:mobile link};
  848. }
  849. }
  850.  
  851. ol.notes li.note a:hover {
  852. color:{color:tags hover};
  853. }
  854.  
  855. ol.notes li.note img.avatar {
  856. display:none;
  857. }
  858.  
  859. ol.notes li.note span.action {
  860. font-weight: normal;
  861. }
  862.  
  863. ol.notes li.note .answer_content {
  864. font-weight: normal;
  865. }
  866.  
  867. ol.notes li.note blockquote {
  868. border-left:1px solid {color:text};
  869. }
  870.  
  871. @media screen and (max-width:900px), handheld {
  872. ol.notes li.note blockquote {
  873. border-left:1px solid {color:mobile text};
  874. }
  875. }
  876.  
  877. li.note.more_notes_link_container {
  878. background-color:{color:background};
  879. border-bottom:10px {color:background} solid;
  880. }
  881.  
  882. @media screen and (max-width:900px), handheld {
  883. li.note.more_notes_link_container {
  884. background-color:{color:mobile background};
  885. border-bottom:0px {color:background} solid;
  886. }
  887. }
  888.  
  889. a.more_notes_link {
  890. text-transform:uppercase;
  891. letter-spacing:1px;
  892. color:{color:link};
  893. }
  894.  
  895. @media screen and (max-width:900px), handheld {
  896. a.more_notes_link {
  897. color:{color:mobile link};
  898. }
  899. }
  900.  
  901. a.more_notes_link:hover {
  902. color:{color:link hover};
  903. }
  904.  
  905.  
  906.  
  907. /* --- CREDIT -DON'T TOUCH- --- */
  908.  
  909. #notouchy {
  910. position:fixed;
  911. bottom:10px;
  912. right:10px;
  913. font-size:8px;
  914. font-family:'calibri';
  915. letter-spacing:3px;
  916. padding:5px;
  917. border:solid 1px {color:scrollbar};
  918. color:{color:scrollbar};
  919. background-color:{color:background};
  920. -webkit-transition: all 1s ease-in-out;
  921. -moz-transition: all 1s ease-in-out;
  922. -o-transition: all 1s ease-in-out;
  923. -ms-transition: all 1s ease-in-out;
  924. -transition: all 1s ease-in-out;
  925. }
  926.  
  927. @media screen and (max-width:900px) {
  928. #notouchy {
  929. top:1%;
  930. left:1%;
  931. padding:3px;
  932. height:14px;
  933. width:20px;
  934. }
  935. }
  936.  
  937. #notouchy:hover {
  938. border:solid 1px {color:background};
  939. color:{color:background};
  940. background-color:{color:scrollbar};
  941. -webkit-transition: all 1s ease-in-out;
  942. -moz-transition: all 1s ease-in-out;
  943. -o-transition: all 1s ease-in-out;
  944. -ms-transition: all 1s ease-in-out;
  945. -transition: all 1s ease-in-out;
  946. }
  947.  
  948.  
  949.  
  950. {CustomCSS}
  951.  
  952. </style>
  953.  
  954. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  955. <script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  956. <script>
  957. (function($){
  958. $(document).ready(function(){
  959. $("a[title]").style_my_tooltips({
  960. tip_follows_cursor:true,
  961. tip_delay_time:90,
  962. tip_fade_speed:600,
  963. attribute:"title"
  964. });
  965. });
  966. })(jQuery);
  967. </script>
  968.  
  969.  
  970.  
  971. </head>
  972. <body>
  973.  
  974.  
  975.  
  976. <div id="sidebarborder">
  977. <div id="sidebar">
  978. <div class="title">{Title}</div>
  979. <div class="desc">
  980. {Description}
  981. </div>
  982. <div class="links">
  983. {block:IfLinkA}
  984. <a href="{text:linkA url}">{text:linkA}</a>
  985. {/block:IfLinkA}
  986. {block:IfLinkB}
  987. <a href="{text:linkB url}">{text:linkB}</a>
  988. {/block:IfLinkB}
  989. <div class="homelink">
  990. <a href="/">HOME</a>
  991. </div>
  992. {block:IfLinkC}
  993. <a href="{text:linkC url}">{text:linkC}</a>
  994. {/block:IfLinkC}
  995. {block:IfLinkD}
  996. <a href="{text:linkD url}">{text:linkD}</a>
  997. {/block:IfLinkD}
  998. </div>
  999. </div>
  1000. </div>
  1001.  
  1002. <div id="allposts">{block:Posts}<div id="postborder"><div id="individualposts">
  1003.  
  1004. {block:Text}
  1005. {block:Title}
  1006. <div class="posttitle">{Title}</div>
  1007. {/block:Title}{Body}
  1008. {/block:Text}
  1009.  
  1010. {block:Photo}
  1011. {LinkOpenTag}<img src="{PhotoURL-400}">{LinkCloseTag}
  1012. {block:Caption}
  1013. {Caption}
  1014. {/block:Caption}</p>
  1015. {/block:Photo}
  1016.  
  1017. {block:Link}
  1018. <div class="linkpost"><a href="{URL}" {Target}>{Name}</a></div>
  1019. {block:Description}
  1020. {Description}
  1021. {/block:Description}
  1022. {/block:Link}
  1023.  
  1024. {block:Quote}
  1025. <div class="quote">"{Quote}"</div>
  1026. {block:Source}
  1027. </br>
  1028. — {Source}
  1029. {/block:Source}</p>
  1030. {/block:Quote}
  1031.  
  1032. {block:Photoset}
  1033. {Photoset}
  1034. {block:Caption}
  1035. {Caption}
  1036. {/block:Caption}</p>
  1037. {/block:Photoset}
  1038.  
  1039. {block:Audio}
  1040. {AudioEmbed}<br>
  1041. {block:Caption}
  1042. {Caption}
  1043. {/block:Caption}
  1044. {/block:ExternalAudio}</p>
  1045. {/block:Audio}
  1046.  
  1047. {block:Video}
  1048. <div class="videoWrapper">
  1049. {VideoEmbed-400}
  1050. </div>
  1051. {block:Caption}
  1052. {Caption}
  1053. {/block:Caption}
  1054. {/block:Video}
  1055.  
  1056. {block:Chat}
  1057. {block:Title}
  1058. <div class="posttitle">{Title}</div></p>
  1059. {/block:Title}
  1060. {block:Lines}
  1061. {block:Label}
  1062. <b><strong>{Label}</strong></b>
  1063. {/block:Label}
  1064. {Line}<br>
  1065. {/block:Lines}</p>
  1066. {/block:Chat}
  1067.  
  1068. {block:Answer}
  1069. <div class="question"><font style="text-transform:uppercase">{Asker}:</font></br>{Question}</div>
  1070. {Answer}
  1071. {/block:Answer}
  1072.  
  1073. <div id="details">
  1074. {block:Date}<a href="{Permalink}" target="_blank">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a>{/block:Date}
  1075. {block:RebloggedFrom} / <a href="{ReblogParentURL}" target="_blank">↩</a>{/block:RebloggedFrom}
  1076. {block:ContentSource} / <a href="{SourceURL}" target="_blank">©</a> {/block:ContentSource}
  1077. {block:NoteCount} / <a href="{Permalink}" target="_blank">{NoteCount}</a>{/block:NoteCount} / <a href="{ReblogURL}" target="_blank">↪</a>{block:HasTags}<div id="tags">{block:Tags} >> <a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}
  1078. </div></div></div>
  1079. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1080. {/block:Posts}</div></div></div>
  1081.  
  1082. {block:Pagination}<div class="pagi">
  1083. {block:PreviousPage}<a href="{PreviousPage}">prev</a> - {/block:PreviousPage}{block:NextPage}<a href="{NextPage}">next</a>{/block:NextPage}
  1084. </div>{/block:Pagination}</p>
  1085.  
  1086. </div>
  1087.  
  1088. <!--- THIS IS THE CREDIT, DON'T TOUCH! --->
  1089.  
  1090. <a href="http://casowl.tumblr.com" target="_blank"><div id="notouchy">LSR</div></a>
  1091.  
  1092.  
  1093. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Public Pastes
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!