Don't like ads? PRO users don't see any ads ;-)
Guest

Theme 003

By: hatterthemes on May 6th, 2012  |  syntax: None  |  size: 13.72 KB  |  hits: 45  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <!-- Theme 003 by hatterthemes -->
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4. <head>
  5.     <!-- DEFAULT VARIABLES -->
  6.     <meta name="color:Background1" content="#89c2f8" />
  7.     <meta name="color:Background2" content="#ffffff" />
  8.     <meta name="color:Titles" content="#ffffff" />
  9.     <meta name="color:Text" content="#000000" />
  10.     <meta name="color:Link" content="#000066" />
  11.     <meta name="color:LinkHover" content="#588297" />
  12.     <meta name="color:TopLinks" content="#ffffff" />
  13.     <meta name="color:Scrollbar" content="#bddbfd" />
  14.     <meta name="color:Selection" content="#bef7ad" />
  15.    
  16.     <meta name="image:SidebarImage" content="" />
  17.    
  18.     <meta name="text:Link1URL" content="http://" />
  19.     <meta name="text:Link1" content="" />
  20.     <meta name="text:Link2URL" content="http://" />
  21.     <meta name="text:Link2" content="" />
  22.     <meta name="text:Link3URL" content="http://" />
  23.     <meta name="text:Link3" content="" />
  24.     <meta name="text:Link4URL" content="http://" />
  25.     <meta name="text:Link4" content="" />
  26.    
  27.     <meta name="if:ShowDescription" content="1" />
  28.     <meta name="if:ShowSubmitLink" content="0" />
  29.     <meta name="if:ShowArchiveLink" content="1" />
  30.     <meta name="if:ShowLink1" content="1" />
  31.     <meta name="if:ShowLink2" content="1" />
  32.     <meta name="if:ShowLink3" content="1" />
  33.     <meta name="if:ShowLink4" content="1" />
  34.     <meta name="if:AudioPlayerWhite" content="0" />
  35.    
  36.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  37.     <title>{Title}{block:SearchPage}, Search results for: {SearchQuery}{/block:SearchPage}{block:PostSummary}, {PostSummary}{/block:PostSummary}</title>
  38.     {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  39.     <link rel="shortcut icon" href="{Favicon}" />
  40.     <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  41.     <link href='http://fonts.googleapis.com/css?family=Cedarville+Cursive' rel='stylesheet' type='text/css'>
  42.     <style type="text/css">
  43.    
  44. @font-face {font-family: 'RosarioRegular';src: url('Rosario-Regular-webfont.eot');src: url('Rosario-Regular-webfont.eot?#iefix') format('embedded-opentype'),url('Rosario-Regular-webfont.woff') format('woff'),url('Rosario-Regular-webfont.ttf') format('truetype'),url('Rosario-Regular-webfont.svg#RosarioRegular') format('svg');font-weight: normal;font-style: normal;}
  45.  
  46. @font-face {font-family: 'RosarioItalic';src: url('Rosario-Italic-webfont.eot');src: url('Rosario-Italic-webfont.eot?#iefix') format('embedded-opentype'),url('Rosario-Italic-webfont.woff') format('woff'),url('Rosario-Italic-webfont.ttf') format('truetype'),url('Rosario-Italic-webfont.svg#RosarioItalic') format('svg');font-weight: normal;font-style: normal;}
  47.  
  48. @font-face {font-family: 'RosarioBold';src: url('Rosario-Bold-webfont.eot');src: url('Rosario-Bold-webfont.eot?#iefix') format('embedded-opentype'),url('Rosario-Bold-webfont.woff') format('woff'),url('Rosario-Bold-webfont.ttf') format('truetype'),url('Rosario-Bold-webfont.svg#RosarioBold') format('svg');font-weight: normal;font-style: normal;}
  49.    
  50. @font-face {font-family: 'RosarioBoldItalic';src: url('Rosario-BoldItalic-webfont.eot');src: url('Rosario-BoldItalic-webfont.eot?#iefix') format('embedded-opentype'),url('Rosario-BoldItalic-webfont.woff') format('woff'),url('Rosario-BoldItalic-webfont.ttf') format('truetype'),url('Rosario-BoldItalic-webfont.svg#RosarioBoldItalic') format('svg');font-weight: normal;font-style: normal;}
  51.    
  52. body {
  53. background: {color:Background1};
  54. background: -webkit-gradient(linear, left top, left bottom, from({color:Background1}), to({color:Background2}));
  55. background: -moz-linear-gradient(top, {color:Background1}, {color:Background2});
  56. background-attachment:fixed;
  57. height:100%px;
  58. font-family:"rosario" arial sans-serif;
  59. font-size:13px;
  60. text-align:left;
  61. text-decoration:none;
  62. color:{color:Text};
  63. }
  64.  
  65. a {
  66. color:{color:Link};
  67. text-decoration:none!important;
  68. }
  69.  
  70. .leaves a:hover {
  71. color:{color:LinkHover};
  72. }
  73.  
  74. i,em {
  75. font-style:normal;
  76. }
  77.  
  78. b,strong {
  79. opacity:0.5;
  80. }
  81.  
  82. blockquote {
  83. border-left:2px solid {color:Link};
  84. opacity:0.3;
  85. padding-left:6px;
  86. padding-right:4px;
  87. margin-left:10px;
  88. }
  89.  
  90. blockquote:hover {
  91. opacity:0.8;
  92. transition:0.6s ease-in;
  93. }
  94.  
  95. h1 {
  96. font-style:normal;
  97. font-family:"Cedarville Cursive";
  98. font-size:30px;
  99. line-height:28px;
  100. color:{color:Titles};
  101. text-align:center;
  102. }
  103.  
  104. h2 {
  105. font-style:normal;
  106. font-family:"Cedarville Cursive";
  107. font-size:30px;
  108. line-height:28px;
  109. color:{color:LinkHover};
  110. }
  111.  
  112.  
  113. h4 {
  114. font-size:13px;
  115. }
  116.  
  117. #header {
  118. display:block;
  119. position:fixed;
  120. padding:10px;
  121. height:65px;
  122. width:auto;
  123. background-color:transparent!important;
  124. }
  125.  
  126. /* Let's get this party started */
  127. ::-webkit-scrollbar {
  128.     width: 4px;
  129.     height: 4px;
  130. }
  131.  
  132. /* Track */
  133. ::-webkit-scrollbar-track {
  134.     -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
  135.     -webkit-border-radius: 10px;
  136.     border-radius: 10px;
  137. }
  138.  
  139. /* Handle */
  140. ::-webkit-scrollbar-thumb {
  141.     -webkit-border-radius: 10px;
  142.     border-radius: 10px;
  143.     background: #cdcdcd;
  144.     -webkit-box-shadow: inset 0 0 6px {color:Scrollbar};
  145. }
  146. ::-webkit-scrollbar-thumb:window-inactive {
  147.     background: {color:Scrollbar};
  148. }
  149.  
  150. ::selection{
  151. background:{color:Selection};
  152. }
  153.  
  154. ::-moz-selection{
  155. background:{color:Selection};
  156. }
  157.  
  158.  
  159. iframe#tumblr_controls {
  160. top: 0% !important;
  161. right:0% !important;
  162. position: fixed !important;
  163. background-color:{color:Background2};
  164. opacity:0.5;
  165. }
  166.  
  167. iframe#tumblr_controls:hover {
  168. opacity:1.0;
  169. }
  170.  
  171. .theme {
  172. display:block;
  173. width:310px;
  174. height:10px;
  175. font-size:11px;
  176. top:147px !important;
  177. left:607px !important;
  178. position:fixed !important;
  179. text-align:center;
  180. background:{color:Background1};
  181. -webkit-border-bottom-right-radius:10px;
  182. -webkit-border-bottom-left-radius:10px;
  183. -moz-border-radius-bottomright:10px;
  184. -moz-border-radius-bottomleft:10px;
  185. -o-border-bottom-right-radius:10px;
  186. -o-border-bottom-left-radius:10px;
  187. opacity:0.5;
  188. }
  189.  
  190. .theme:hover {
  191. opacity:1;
  192. }
  193.  
  194. .theme a {
  195. color:{color:Background2};
  196. opacity:1;
  197. }
  198.  
  199. .headerlinks {
  200. height:60px;
  201. width:50px;
  202. background-color:transparent;
  203. border:4px double {color:TopLinks};
  204. -webkit-border-top-right-radius:50px;
  205. -webkit-border-bottom-left-radius:50px;
  206. -moz-border-radius-topright:50px;
  207. -moz-border-radius-bottomleft:50px;
  208. -o-border-top-right-radius:50px;
  209. -o-border-bottom-left-radius:50px;
  210. text-align:center;
  211. -webkit-transition: all 0.6s ease-out;
  212. -moz-transition:all 0.6s ease-out;
  213. -o-transition:all 0.6s ease-out;
  214. }
  215.  
  216. .headerlinks:hover {
  217. border:4px solid {color:TopLinks};
  218. -webkit-border-top-left-radius:50px;
  219. -webkit-border-top-right-radius:0px;
  220. -webkit-border-bottom-right-radius:50px;
  221. -webkit-border-bottom-left-radius:0px;
  222. -moz-border-radius-topright:0px;
  223. -moz-border-radius-topleft:50px;
  224. -moz-border-radius-bottomleft:0px;
  225. -moz-border-radius-bottomright:50px;
  226. -o-border-top-right-radius:0px;
  227. -o-border-top-left-radius:50px;
  228. -o-border-bottom-left-radius:0px;
  229. -o-border-bottom-right-radius:50px;
  230. -webkit-transition: all 0.6s ease-out;
  231. -moz-transition:all 0.6s ease-out;
  232. -o-transition:all 0.6s ease-out;
  233. -webkit-transform: rotate(360deg);
  234. -moz-transform: rotate(360deg);
  235. -o-transform: rotate(360deg);
  236. }
  237.  
  238. .headerlinks a {
  239. color:{color:TopLinks};
  240. font-family:"Cedarville Cursive";
  241. font-size:13px;
  242. }
  243.  
  244. .headerlinks a:hover {
  245. color:{color:Link};
  246. }
  247.  
  248. .turn {
  249. -webkit-transform: rotate(45deg);
  250. -moz-transform: rotate(45deg);
  251. -o-transform: rotate(45deg);
  252. -webkit-transition: all 0.6s ease-out;
  253. -moz-transition: all 0.6s ease-out;
  254. -o-transition: all 0.6s ease-out;
  255. }
  256.  
  257. .turn:hover {
  258. -webkit-transform: rotate(-45deg);
  259. -moz-transform: rotate(-45deg);
  260. -o-transform: rotate(-45deg);
  261. -webkit-transition: all 0.6s ease-out;
  262. -moz-transition: all 0.6s ease-out;
  263. -o-transition: all 0.6s ease-out;
  264. }
  265.  
  266. #sidebar {
  267.     width:300px;
  268.     height:150px;
  269.     position:fixed;
  270.     margin-left:600px;
  271.     margin-top:-10px;
  272.     overflow:hidden;
  273.     z-index:-1;
  274. }
  275.  
  276. #simg img {
  277.     height:150px;
  278.     -webkit-border-radius:10px;
  279.     -moz-border-radius:10px;
  280.     -o-border-radius:10px;
  281. }
  282.  
  283. .description{
  284. opacity:0.05;
  285. filter: alpha(opacity = 0);
  286. position:fixed;
  287. display:block;
  288. padding:5px;
  289. width:300px;
  290. height:140px;
  291. margin-top:-153px;
  292. color:{color:Text};
  293. overflow-y:scroll;
  294. background:{color:Background1};
  295. -webkit-transition: all 0.4s ease-out;
  296. -moz-transition: all 0.4s ease-out;
  297. -o-transition: all 0.4s ease-out;
  298. transition: all 0.4s ease-out;
  299. z-index:2;
  300. text-transform:italic;
  301. font-size:12px;
  302. }
  303.  
  304. .description big {
  305.     letter-spacing:2px;
  306. }
  307.  
  308. #simg:hover .description {
  309. opacity:0.8;
  310. filter: alpha(opacity = 90);
  311. -webkit-transition: all 0.4s ease-out;
  312. -moz-transition: all 0.4s ease-out;
  313. -o-transition: all 0.4s ease-out;
  314. transition: all 0.4s ease-out;
  315. }
  316.  
  317. #pagination {
  318. top:20px!important;
  319. right:10px!important;
  320. position:fixed!important;
  321. font-size:50px;
  322. font-family: "Cedarville Cursive";
  323. }
  324.  
  325. #pagination a,a:hover{
  326. color:{color:TopLinks};
  327. }
  328.  
  329. #trees{
  330. margin-left:20px;
  331. margin-top:133px;
  332. width:5560px;
  333. position:absolute;
  334. padding:3px;
  335. background-color: transparent;
  336. {block:permalinkpage}
  337. width:515px;
  338. background-color:transparent;
  339. {/block:permalinkpage}
  340. }
  341.  
  342.  
  343. .leaves {
  344. background-color:{color:Entry};
  345. padding:10px;
  346. float:left;
  347. width:515px;
  348. min-height:400px;
  349. max-height:auto;
  350. {block:IndexPage}
  351. {/block:IndexPage}
  352. {block:permalinkpage}
  353. width:505px;
  354. height:100%;
  355. margin-bottom:10px;
  356. {/block:permalinkpage}
  357. overflow:hidden;
  358. border-right:4px double {color:Background2};
  359. border-left:4px double {color:Background1};
  360. }
  361.  
  362. .chat li {
  363. list-style-type:none;
  364. border-top: 1px dashed {color:Link};
  365. border-bottom: 1px solid {color:Text};
  366. padding:2px;
  367. padding-left:25px;
  368. }
  369.  
  370. .roots {
  371. padding-left:5px;
  372. padding-top:30px;
  373. margin-bottom:30px;
  374. position:absolute;
  375. text-align:center;
  376. text-transform:lowercase;
  377. font-style:normal;
  378. font-size:9px;
  379. }
  380.  
  381. .roots a {
  382. color:{color:Background1};
  383. }
  384.  
  385. a.tags {
  386. color:{color:Titles};
  387. background-color:{color:Background1};
  388. -webkit-border-radius:10px;
  389. -moz-border-radius:10px;
  390. -o-border-radius:10px;
  391. padding:3px;
  392. opacity:0.3;
  393. }
  394.  
  395. a.tags:hover{
  396. opacity:1;
  397. color:{color:Background2};
  398. }
  399.  
  400. #questions {
  401. display:block;
  402. background:transparent!important;
  403. border-bottom:3px solid {color:Background1};
  404. text-transform:lowercase;
  405. }
  406.  
  407. .questions {
  408. font-size:10px;
  409. color:{color:Text};
  410. margin-left:300px;
  411. margin-top:-7px;
  412. width:auto;
  413. }
  414.  
  415. .caption {
  416. font-size:13px;
  417. }
  418.  
  419. </style>
  420. </head>
  421. <body>
  422. <div id="header">
  423.     <table class="tble" cellspacing="2px">
  424.     <tr>
  425.     <td class="headerlinks"><div class="turn"><a href="/">home</a></div></td>
  426.     <td class="headerlinks"><div class="turn"><a href="/ask" >ask</a></div></td>
  427.     {block:ifShowSubmitLink}<td class="headerlinks"><div class="turn"><a href="/submit">submit</a></div></td>{/block:ifShowSubmitLink}
  428.     {block:ifShowArchiveLink}<td class="headerlinks"><div class="turn"><a href="/archive">archive</a></div></td>{/block:ifShowArchiveLink}
  429.     {block:ifShowLink1}<td class="headerlinks"><div class="turn"><a href="{text:Link1URL}">{text:Link1}</a></div></td>{/block:ifShowLink1}
  430.     {block:ifShowLink2}<td class="headerlinks"><div class="turn"><a href="{text:Link2URL}">{text:Link2}</a></td>{/block:ifShowLink2}
  431.     {block:ifShowLink3}<td class="headerlinks"><div class="turn"><a href="{text:Link3URL}">{text:Link3}</a></td>{/block:ifShowLink3}
  432.     {block:ifShowLink4}<td class="headerlinks"><div class="turn"><a href="{text:Link4URL}">{text:Link4}</a></td>{/block:ifShowLink4}
  433.     </tr>
  434.     </table>
  435. </div>
  436.     <div id="sidebar">
  437.     <div id="simg"><center><img src="{image:sidebarimage}"></center><em><div class="description">{Description}</div></em>
  438.     </div>
  439.     <div class="theme"><a href="http://hatterthemes.tumblr.com">theme © hatterthemes</a></div>
  440. </div>
  441.  
  442. <div id="pagination">
  443. {block:PreviousPage}<a href="{PreviousPage}"><<</a>{/block:PreviousPage}{block:NextPage}<a href="{NextPage}">>></a>{/block:NextPage}</div>
  444.  
  445. <div id="trees">
  446.     {block:Posts}
  447.     <div class="leaves">
  448. {block:Title}<h1>{Title}</h1>{/block:Title}
  449. {block:Text}{Body}{/block:Text}
  450.    
  451. {block:Quote}<h1>"{Quote}"</h1><br />— {Source}{/block:Quote}
  452.  
  453. {block:Link}<a href="{URL}" class="link" {Target}><h2>{Name}</h2></a>
  454. {block:Description}<P>{Description}</p>{/block:Description}{/block:Link}
  455.  
  456. {block:Photo}<br /><center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}{/block:Photo}<br />
  457.  
  458. {block:Photoset}<center>{Photoset-500}</center>{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}{/block:Photoset}
  459.  
  460. {block:Chat}<div class="chat">{block:Lines}<li class="user_{UserNumber}">{block:Label}<span class="label"><b>{Label}</b></span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}</div>{/block:Chat}
  461.  
  462. {block:Video}<br />{Video-500}{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}{/block:Video}
  463.  
  464. {block:Answer}<div id="questions"><h2>"{Question}"</h2></div><div class="questions">wondered by {Asker}</div>
  465. {Answer}{/block:answer}
  466.  
  467. {block:Audio}<span class="audio"><center>{block:ifAudioPlayerWhite}{AudioPlayerWhite}{/block:ifAudioPlayerWhite}{block:ifNotAudioPlayerWhite}{AudioPlayerBlack}{/block:ifNotAudioPlayerWhite}</center></span>{block:Caption}<h4>{Caption}{/block:Caption}</h4>{/block:Audio}<br>
  468.  
  469. <div class="roots"><a href="{Permalink}">~ {TimeAgo}</a>  {block:HasTags}{block:Tags}<a class="tags"href="{TagURL}">{Tag}</a> {/block:Tags}{/block:HasTags} ~</div>
  470.  
  471.    
  472. </div>
  473. {/block:Posts}
  474. {block:PostNotes}{PostNotes}{/block:PostNotes}
  475. </div>
  476.  
  477. </body>
  478. </html>