Advertisement
winters-th

Opulence

Jun 27th, 2014
782
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 17.17 KB | None | 0 0
  1. <html>
  2.  
  3. <!--
  4.  
  5. [ O P U L E N C E ] by winters-th.tumblr.com
  6. DO NOT STEAL, DISTRIBUTE OR CLAIM IT AS YOUR OWN.
  7. DO NOT MOVE OR REMOVE THE CREDIT.
  8.  
  9. -->
  10.  
  11. <head>
  12.  
  13. <script type="text/javascript"
  14. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  15.  
  16. <script type="text/javascript">
  17.  
  18. function showDiv(idInfo) {
  19. var sel = document.getElementById('divLinks').getElementsByTagName('div');
  20. for (var i=0; i<sel.length; i++) {
  21. sel[i].style.display = 'none';
  22. }
  23. document.getElementById('container'+idInfo).style.display = 'block';
  24. }
  25. </script>
  26.  
  27. <title>{Title}</title>
  28. <link rel="shortcut icon" href="{Favicon}">
  29. <link rel="altertnate" type="application/rss+xml" href="{RSS}">
  30. <meta http-equiv="x-dns-prefetch-control" content="off"/>
  31.  
  32. <link href='http://fonts.googleapis.com/css?family=Josefin+Slab:400,600' rel='stylesheet' type='text/css'>
  33.  
  34.  
  35. <!-- META -->
  36.  
  37. <meta name="color:Body Color" content="#505050"/>
  38. <meta name="color:Bold" content="#000"/>
  39. <meta name="color:Links" content="#000"/>
  40. <meta name="color:Links Hover" content="#619db0"/>
  41.  
  42. <meta name="color:Header Bg" content="#000"/>
  43. <meta name="color:Header Links Color" content="#fff"/>
  44. <meta name="color:Header Links Color Hover" content="#619db0"/>
  45.  
  46. <meta name="color:Ring Color" content="#000"/>
  47. <meta name="color:Ring Hover" content="#619db0"/>
  48. <meta name="color:Container Links" content="#000"/>
  49. <meta name="color:Container Links Bg" content="#f6f6f6"/>
  50. <meta name="color:Container Links Border" content="#fff"/>
  51. <meta name="color:Container Links Hover" content="#619db0"/>
  52. <meta name="color:Container Links Bg Hover" content="#fff"/>
  53. <meta name="color:Container Links Border Hover" content="#619db0"/>
  54.  
  55. <meta name="color:Info Links" content="#000"/>
  56. <meta name="color:Info Links Hover" content="#619db0"/>
  57.  
  58. <meta name="color:Scrollbar" content="#eee"/>
  59. <meta name="color:Scrollbar Bg" content="transparent"/>
  60.  
  61. <meta name="color:Header2 Bg" content="#e4f1f5"/>
  62.  
  63. <meta name="image:Icon" content="https://31.media.tumblr.com/185322edc6284ded3e3693fc7db166fe/tumblr_inline_n7sda8eXSF1shmcpe.png"/>
  64. <meta name="image:Header Pic" content="https://31.media.tumblr.com/de2428c9bfad460f60a18bbfcce66485/tumblr_n7rxz2z0A61tf66lgo1_1280.png"/>
  65.  
  66. <meta name="text:Link 1 URL" content=""/>
  67. <meta name="text:Link 1 Title" content=""/>
  68. <meta name="text:Link 2 URL" content="">
  69. <meta name="text:Link 2 Title" content=""/>
  70. <meta name="text:Link 3 URL" content=""/>
  71. <meta name="text:Link 3 Title" content=""/>
  72. <meta name="text:Link 4 URL" content=""/>
  73. <meta name="text:Link 4 Title" content=""/>
  74. <meta name="text:Link 5 URL" content=""/>
  75. <meta name="text:Link 5 Title" content=""/>
  76. <meta name="text:Link 6 URL" content=""/>
  77. <meta name="text:Link 6 Title" content=""/>
  78. <meta name="text:Link 7 URL" content=""/>
  79. <meta name="text:Link 7 Title" content=""/>
  80. <meta name="text:Link 8 URL" content=""/>
  81. <meta name="text:Link 8 Title" content=""/>
  82.  
  83. <meta name="text:Second Container" content=""/>
  84. <meta name="text:Fourth Container" content=""/>
  85.  
  86.  
  87. <style type="text/css">
  88.  
  89. @font-face { font-family: silkscreen; src: url('http://static.tumblr.com/1kdckk4/9yjlolf0w/slkscr.ttf'); }
  90.  
  91. /* SCROLLBAR */
  92. ::-webkit-scrollbar-thumb {
  93. height:auto;
  94. background-color:{color:Scrollbar};
  95. }
  96.  
  97. ::-webkit-scrollbar-corner {
  98. background:{color:Scrollbar};
  99. }
  100.  
  101. ::-webkit-scrollbar {
  102. height:4px;
  103. width:4px;
  104. background-color:{color:Scrollbar Bg};
  105. }
  106.  
  107. /* BODY */
  108.  
  109. body {
  110. font-size: 12px;
  111. font-family: Calibri;
  112. color: {color:Body Color};
  113. margin: auto;
  114. }
  115.  
  116. b, strong {
  117. color: {color:Bold};
  118. }
  119.  
  120. a {
  121. color: {color:Links};
  122. text-decoration: none;
  123. -moz-transition-duration: 0.5s;
  124. -o-transition-duration: 0.5s;
  125. -webkit-transition-duration: 0.5s;
  126. transition-duration: 0.5s;}
  127.  
  128. a:hover {
  129. color: {color:Links Hover};
  130. -moz-transition-duration: 0.5s;
  131. -o-transition-duration: 0.5s;
  132. -webkit-transition-duration: 0.5s;
  133. transition-duration: 0.5s;}
  134.  
  135. small {font-size: 11px}
  136.  
  137. big {font-size: bigger}
  138.  
  139. .contain {
  140. background-color: white;
  141. width: 550px;
  142. margin-left: auto;
  143. margin-right: auto;
  144. position: relative;
  145. height: 335px;
  146. overflow: hidden;
  147. top: -15px;
  148. }
  149.  
  150. .header {
  151. width: 100%;
  152. height: 130px;
  153. background-color: {color:Header Bg};
  154. margin-left: auto;
  155. margin-right: auto;
  156. position: fixed;
  157. vertical-align: middle;
  158. line-height: 130px;
  159. -moz-transition-duration: 0.5s;
  160. -o-transition-duration: 0.5s;
  161. -webkit-transition-duration: 0.5s;
  162. transition-duration: 0.5s;
  163. z-index: 2000;
  164. }
  165.  
  166. .headcon {
  167. text-align: justify;
  168. min-width: 574px;
  169. max-width: 600px;
  170. margin: 0 auto;
  171. height: 130px;
  172. }
  173.  
  174. .headcon a {
  175. font-family: Josefin Slab;
  176. display: inline-block;
  177. letter-spacing: 1px;
  178. color: {color:Header Links Color};
  179. font-size: 13px;
  180. text-transform: uppercase;
  181. margin-left: 35px;
  182. margin-right: 35px;
  183. position: relative;
  184. text-align: center;
  185. top: -25px;
  186. -webkit-transition: all 0.4s ease-in-out;
  187. -moz-transition: all 0.4s ease-in-out;
  188. -o-transition: all 0.4s ease-in-out;
  189. -ms-transition: all 0.4s ease-in-out;
  190. transition: all 0.4s ease-in-out;
  191. text-shadow: 1px 1px 2px rgba(71,80,23,0.3);
  192. }
  193.  
  194. .headcon:first-child a {
  195. -webkit-border-radius: 15px 15px 0px 0px;
  196. -moz-border-radius: 15px 15px 0px 0px;
  197. border-radius: 15px 15px 0px 0px;
  198. }
  199. .headcon:last-child a {
  200. -webkit-border-radius: 0px 0px 15px 15px;
  201. -moz-border-radius: 0px 0px 15px 15px;
  202. border-radius: 0px 0px 15px 15px;
  203. }
  204.  
  205. .headcon:hover a {
  206. text-shadow: 0px 0px 10px #fff;
  207. color: transparent;
  208. }
  209.  
  210. .headcon a:hover {
  211. background: transparent;
  212. text-shadow: 1px 1px 10px rgba(71,80,23,0.6);
  213. color: {color:Header Links Color Hover};
  214. }
  215.  
  216. .headcon img {
  217. top: 17px;
  218. border: 10px solid white;
  219. text-align: center;
  220. position: relative;
  221. display: inline-block;
  222. width: 75px;
  223. }
  224.  
  225. .header2 {
  226. width: 100%;
  227. height: 250px;
  228. background: no-repeat 80% 100%;
  229. background-image: url('{image:Header Pic}');
  230. background-color: {color:Header2 Bg};
  231. top: 130px;
  232. position: relative;
  233. }
  234.  
  235. .postcol {
  236. width: 540px;
  237. margin-left: auto;
  238. margin-right: auto;
  239. position: relative;
  240. z-index: 850;
  241. top: 150px;
  242. }
  243.  
  244. .posts {
  245. width: 500px;
  246. margin-bottom: 20px;
  247. padding: 20px;
  248. display: inline-block;
  249. background-color: #fff;
  250. vertical-align: top;
  251. text-align: justify;
  252. }
  253.  
  254. .posts blockquote {border-left: 1px solid #505050; padding-left: 15px;}
  255.  
  256. .posts img, .posts li, .posts blockquote {max-width: 100%;}
  257.  
  258. .title {color: black; font-family: Calibri; font-weight: 900; margin-bottom: 10px; font-size: 12px; text-transform: uppercase; text-align: center; letter-spacing: 1px; padding: 5px;}
  259.  
  260. .links {color: black; font-family: Calibri; font-weight: 900; margin-bottom: 10px; font-size: 18px; text-transform: uppercase; text-align: center; letter-spacing: 1px; padding: 5px;}
  261.  
  262. .links a {color: black; text-decoration: none; border-bottom: 1px dotted black;}
  263.  
  264. .links a:hover {color: #505050;}
  265.  
  266. .question {background-color: transparent; min-height: 50px;}
  267.  
  268. .question img {
  269. margin: 0 auto;
  270. border-radius: 40px;
  271. }
  272.  
  273. .questionq {background-color: #eee; padding: 15px; width: 470px; text-align: center;}
  274.  
  275. .askr {color: black;}
  276.  
  277. .askr a {color: #619db0;}
  278.  
  279. .quote {width: 80%; margin: auto; font-size: 14px; text-align: center; font-family: MS Trebuchet; text-transform: uppercase; letter-spacing: 2px; font-weight: 900;}
  280.  
  281. .source {text-align: right; font-size: 11px; font-family: helvetica; text-align: center; text-transform: lowercase; margin-top: -15px; font-weight: 100;}
  282.  
  283. .chat li {list-style: none; padding: 5px;}
  284.  
  285. .chat .label {text-transform: uppercase;}
  286.  
  287. .line_odd .label {color: black;}
  288. .line_even .label {color: black;}
  289.  
  290. .line_odd::first-letter {color:{color:Links}; font-weight: 900; font-style: italic;}
  291.  
  292. .line_even::first-letter {color:{color:Links Hover}; font-weight: 900; font-style: italic;}
  293.  
  294. .info {
  295. margin-top:-2px;
  296. font-size: 7pt;
  297. text-transform: uppercase;
  298. text-align: center;
  299. border-top: 1px solid #505050;
  300. padding: 7px;
  301. background: transparent;
  302. font-family: calibri;
  303. color:#505050;
  304. max-width: 600px;
  305. opacity: 0;
  306. -moz-transition-duration: 0.4s;
  307. -o-transition-duration: 0.4s;
  308. -webkit-transition-duration: 0.4s;
  309. transition-duration: 0.4s;
  310. }
  311.  
  312. .info a {
  313. color:{color:Info Links};
  314. }
  315.  
  316. .info a:hover {
  317. color:{color:Info Links Hover};
  318. }
  319.  
  320. .posts:hover .info {
  321. opacity: 1;
  322. -moz-transition-duration: 0.4s;
  323. -o-transition-duration: 0.4s;
  324. -webkit-transition-duration: 0.4s;
  325. transition-duration: 0.4s;
  326. }
  327.  
  328. .cover {position: absolute; z-index: 1; width: 84px; border-radius: 84px;}
  329.  
  330. .container {width: 800px; margin: auto;}
  331.  
  332. .playbutton {
  333. width: 20px;
  334. height: 30px;
  335. overflow: hidden;
  336. position: relative;
  337. z-index: 1000;
  338. margin: 15px 24px 13px 16px;
  339. }
  340.  
  341. .playbox {
  342. background-color: #000;
  343. position: absolute;
  344. z-index: 1000;
  345. margin-top: 13px;
  346. margin-left: 12px;
  347. -webkit-border-radius: 100px;
  348. -moz-border-radius: 100px;
  349. border-radius: 100px;
  350. opacity: 0.5;
  351. }
  352.  
  353. .cr {
  354. bottom: 10px;
  355. right: 10px;
  356. position: fixed;
  357. font-family: Silkscreen;
  358. font-size: 9px;
  359. letter-spacing: 1px;
  360. color: {color:Info Links Hover};
  361. }
  362.  
  363. .cr:hover {
  364. color: {color:Info Links};
  365. }
  366.  
  367. .audio {
  368. background-color:#eee;
  369. color:#000;
  370. text-transform:uppercase;
  371. font-family: Calibri;
  372. font-size: 11px;
  373. height:auto;
  374. padding: 10px 0px 10px 25px;
  375. width:401px;
  376. margin-top: -1px;
  377. margin-bottom:-7px;
  378. margin-left:70px;
  379. text-align:left;
  380. -webkit-border-top-right-radius: 50px;
  381. -webkit-border-bottom-right-radius: 50px;
  382. -moz-border-radius-topright: 50px;
  383. -moz-border-radius-bottomright: 50px;
  384. border-top-right-radius: 50px;
  385. border-bottom-right-radius: 50px;
  386. }
  387.  
  388. .song {
  389. background-color:transparent;
  390. color:#000;
  391. text-transform:uppercase;
  392. font-family: Calibri;
  393. font-size: 11px;
  394. height:10px;
  395. padding: 0px 0px 5px 5px;
  396. width:401px;
  397. margin-top: -21px;
  398. margin-bottom:-7px;
  399. margin-left:99px;
  400. text-align:left;
  401. border-left: 2px solid #ddd;
  402. }
  403.  
  404. .playcount {
  405. background-color:transparent;
  406. font-size:7px;
  407. font-family:baskerville;
  408. color:black;
  409. text-transform:uppercase;
  410. height:10px;
  411. padding:6px 0px 5px 0px;
  412. width:401px;
  413. margin-left:99px;
  414. margin-top:10px;
  415. text-align:center;
  416. }
  417.  
  418. #pagination {
  419. width:auto;
  420. font-family:Helvetica;
  421. font-size:10px;
  422. font-style:none;
  423. text-transform:uppercase;
  424. text-align: center;
  425. margin: 10px auto 35px auto;
  426. }
  427.  
  428. #linkdiv {
  429. top: 200px;
  430. left: 500px;
  431. position: relative;
  432. width: 80px;
  433. }
  434.  
  435. #container1 {
  436. display: block;
  437. height:130px;
  438. overflow:auto;
  439. width: 400px;
  440. position: relative;
  441. left: 330px;
  442. top: 13px;
  443. background: white;
  444. padding: 10px;
  445. text-align: justify;
  446. }
  447.  
  448.  
  449. #container2, #container3, #container4 {
  450. display:none;
  451. height:130px;
  452. overflow:auto;
  453. width: 400px;
  454. position: relative;
  455. left: 330px;
  456. top: 13px;
  457. background: white;
  458. padding: 10px;
  459. text-align: justify;
  460. }
  461.  
  462. #container3 a {
  463. color: {color:Container Links};
  464. display: block;
  465. background: {color:Container Links Bg};
  466. text-align: center;
  467. width: 174px;
  468. float: left;
  469. margin: 5px;
  470. padding: 5px;
  471. border: 1px solid;
  472. border-color: {color:Container Links Border};
  473. }
  474.  
  475. #container3 a:hover {
  476. color: {color:Container Links Hover};
  477. background: {color:Container Links Bg Hover};
  478. border: 1px solid;
  479. border-color: {color:Container Links Border Hover};
  480. }
  481.  
  482. .rings {
  483. width: 10px;
  484. height: 10px;
  485. display: inline-block;
  486. background: transparent;
  487. border-radius: 10px;
  488. border: 3px solid;
  489. border-color: {color: Ring Color};
  490. color: {color:Ring Color};
  491. -moz-transition-duration: 0.5s;
  492. -o-transition-duration: 0.5s;
  493. -webkit-transition-duration: 0.5s;
  494. transition-duration: 0.5s;
  495. }
  496.  
  497. .rings:hover {
  498. border-color: {color: Ring Hover};
  499. color: {color:Ring Hover};
  500. -moz-transition-duration: 0.5s;
  501. -o-transition-duration: 0.5s;
  502. -webkit-transition-duration: 0.5s;
  503. transition-duration: 0.5s;
  504. }
  505.  
  506. </style>
  507. </head>
  508.  
  509. <body>
  510.  
  511. <div class="header"><div class="headcon">
  512.  
  513. <a href="/">Home</a>
  514.  
  515. <a href="/ask">Ask</a>
  516.  
  517. <img src="{image:Icon}">
  518.  
  519. <a href="/archive">Archive</a>
  520.  
  521. <a href="http://winters-th.tumblr.com">Theme</a>
  522.  
  523. </div></div>
  524.  
  525. <div class="header2">
  526.  
  527. <div id="linkdiv">
  528. <a href="#" onclick="showDiv('1');return false"><span class="rings">&nbsp;</span></a>
  529. <a href="#" onclick="showDiv('2');return false"><span class="rings">&nbsp;</span></a>
  530. <a href="#" onclick="showDiv('3');return false"><span class="rings">&nbsp;</span></a>
  531. <a href="#" onclick="showDiv('4');return false"><span class="rings">&nbsp;</span></a>
  532. </div>
  533. <p>
  534.  
  535. <div id="divLinks">
  536. <div id="container1">{Description}</div>
  537.  
  538. <div id="container2">{text:Second Container}</div>
  539.  
  540. <div id="container3">
  541.  
  542. <a href="{text:Link 1 URL}">{text:Link 1 Title}</a>
  543. <a href="{text:Link 2 URL}">{text:Link 2 Title}</a>
  544. <a href="{text:Link 3 URL}">{text:Link 3 Title}</a>
  545. <a href="{text:Link 4 URL}">{text:Link 4 Title}</a>
  546. <a href="{text:Link 5 URL}">{text:Link 5 Title}</a>
  547. <a href="{text:Link 6 URL}">{text:Link 6 Title}</a>
  548. <a href="{text:Link 7 URL}">{text:Link 7 Title}</a>
  549. <a href="{text:Link 8 URL}">{text:Link 8 Title}</a>
  550. </div>
  551.  
  552. <div id="container4">{text:Fourth Container}</div>
  553. </div>
  554.  
  555. </div>
  556.  
  557. <div class="container">
  558.  
  559. <div class="postcol">
  560.  
  561. {block:Posts}
  562.  
  563. <div class="posts">
  564. {block:Text}
  565. {block:Title}<div class="title">{Title}</div>{/block:Title}
  566. {Body}
  567. {/block:Text}
  568.  
  569. {block:Answer}
  570. <div class="question">
  571. <center><img src="{AskerPortraitURL-48}"></center><br>
  572. <span class="askr"><center>{Asker}</center></span><br><div class="questionq">{Question}</div>
  573. </div><br>
  574. {Answer}
  575. {/block:Answer}
  576.  
  577. {block:Quote}
  578. <div class="quote">
  579. <div class="quotetext_{Length}">โ€œ{Quote}โ€</div><br>
  580. {block:Source}<div class="source">{Source}</div>{/block:Source}
  581. </div>
  582. {/block:Quote}
  583.  
  584. {block:Link}
  585. <h2 class="links"><a href="{URL}">{Name}</a></h2>
  586. {block:Description}{Description}{/block:Description}
  587. {/block:Link}
  588.  
  589. {block:Chat}
  590. {block:Title}<h2 class="title">{Title}</h2>{/block:Title}
  591. <ul class="chat">{block:Lines}<li class="line_{Alt}">{block:Label}<span class="label">{Label}</span>{/block:Label}
  592. {Line}</li>{/block:Lines}</ul>
  593. {/block:Chat}
  594.  
  595. {block:Photo}
  596. {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}">{LinkCloseTag}<br>
  597.  
  598. {block:Caption}{Caption}{/block:Caption}
  599. {/block:Photo}
  600.  
  601. {block:Photoset}
  602. {Photoset-500}
  603. {block:Caption}{Caption}{/block:Caption}
  604. {/block:Photoset}
  605.  
  606. {block:Audio}
  607.  
  608. <div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}</div></div><img src="http://static.tumblr.com/liul60i/IcMmdl9id/nmusic2.png" class="cover">
  609. {block:AlbumArt}<img src="{AlbumArtURL}" class="cover">{/block:AlbumArt}<br>
  610.  
  611. <div class="audio">{block:TrackName}{TrackName}{/block:TrackName}<br><br>{block:Artist}{Artist}{/block:Artist} -
  612. {PlayCountWithLabel}</div><br><br>
  613.  
  614. {block:Caption}{Caption}{/block:Caption}
  615. {/block:Audio}<br>
  616.  
  617. {block:Video}
  618. {Video-500}
  619. {block:Caption}{Caption}{/block:Caption}
  620. {/block:Video}
  621.  
  622. <div class="info">
  623. {block:Date}
  624. <a href="{Permalink}">{ShortDayOfWeek}, {ShortMonth} {DayOfMonth}</a>
  625. {/block:Date} {block:RebloggedFrom} <a href="{ReblogParentURL}">via</a>{/block:RebloggedFrom} {block:ContentSource}<a href="{SourceURL}"><a href="{SourceURL}">source</a>{/block:ContentSource}{block:RebloggedFrom} <a href="{ReblogParentURL}" target="_blank"></a>{/block:RebloggedFrom}<br> {NoteCountWithLabel}<Br>
  626. {block:HasTags} {block:Tags} <font style="color:black">#</font><a href="{TagURL}"><i>{Tag}</i></a> {/block:Tags} {/block:HasTags}
  627. </div>
  628. </div>
  629.  
  630.  
  631. {block:PostNotes}{PostNotes}{/block:PostNotes}
  632. {/block:Posts}
  633.  
  634. {block:Pagination}<div id="pagination">
  635. {block:PreviousPage}<a href="{PreviousPage}">ยซ</a>&nbsp;&nbsp;{/block:PreviousPage}
  636. {block:JumpPagination length="5"}
  637. {block:CurrentPage}<span class="current_page" style="border-bottom: 1px solid black">{PageNumber}</span>&nbsp;&nbsp;{/block:CurrentPage}
  638. {block:JumpPage}<a class="jump_page" href="{URL}">{PageNumber}</a>&nbsp;&nbsp;{/block:JumpPage}
  639. {/block:JumpPagination}
  640. {block:NextPage}<a href="{NextPage}">ยป</a>{/block:NextPage}
  641. </div>
  642. {/block:Pagination}
  643.  
  644. </div>
  645. {/block:Posts}
  646.  
  647. </div>
  648.  
  649. <a href="http://winters-th.tumblr.com" class="cr">winters-th</a>
  650.  
  651. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement