Advertisement
ohmy-klaus

Theme 7 by ohmyklaus

Sep 14th, 2012
4,081
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 15.16 KB | None | 0 0
  1.  
  2. <!-- #7 Allons-y
  3. by ohmyklaus.tumblr.com
  4.  
  5. ######## ## ## ## ## ## ##
  6. ######## ## ## ### ### ## ##
  7. ## ## ######## #### #### ## ##
  8. ## ## ######## ## #### ## ####
  9. ######## ## ## ## ## ## ##
  10. ######## ## ## ## ## ##
  11.  
  12. DO NOT REMOVE THE CREDIT!
  13. DO NOT CLAIM AS YOUR OWN! -->
  14.  
  15.  
  16.  
  17. <html><head>
  18.  
  19. <meta name="image:Side Image 200x150px" content=""/>
  20.  
  21. <meta name="color:Background" content="#352a3a"/>
  22. <meta name="color:Font" content="#e5deea"/>
  23. <meta name="color:Links" content="#b097bd"/>
  24. <meta name="color:Border" content="#413546"/>
  25.  
  26. <meta name="color:Side Background" content="#4b3e50"/>
  27. <meta name="color:Nav Links" content="#f0eef1"/>
  28. <meta name="color:Nav Background 1" content="#54475a"/>
  29. <meta name="color:Nav Background 2" content="#5e5164"/>
  30. <meta name="color:Nav Background 3" content="#685b6f"/>
  31.  
  32. <meta name="text:Link 1 URL" content="/" />
  33. <meta name="text:Link 1 Title" content="refresh" />
  34. <meta name="text:Link 2 URL" content="/ask" />
  35. <meta name="text:Link 2 Title" content="message" />
  36. <meta name="text:Link 3 URL" content="/" />
  37. <meta name="text:Link 3 Title" content="link" />
  38. <meta name="text:Link 4 URL" content="/" />
  39. <meta name="text:Link 4 Title" content="link" />
  40. <meta name="text:Link 5 URL" content="/" />
  41. <meta name="text:Link 5 Title" content="link" />
  42.  
  43. <title>{Title}</title>
  44. <link rel="shortcut icon" href="{Favicon}">
  45.  
  46.  
  47. <style type="text/css">
  48.  
  49. /* --- BASICS --- */
  50.  
  51. body {
  52. font-family: Calibri;
  53. font-size: 10px;
  54. line-height: 100%;
  55. text-align: justify;
  56. color: {color:Font};
  57. background-color: {color:Background}; }
  58.  
  59. a:link, a:visited, a:active {
  60. font-family: Calibri;
  61. font-size: 10px;
  62. color: {color:Links};
  63. -webkit-transition-duration: .90s; }
  64.  
  65. a:hover {
  66. color: {color:Font};
  67. -webkit-transition-duration: .90s; }
  68.  
  69. b, strong {
  70. color: {color:Font}; }
  71.  
  72. blockquote {
  73. margin-left: 0px;
  74. padding-left:4px;
  75. border-left: 4px solid {color:Bold}; }
  76.  
  77. #title {
  78. font-family: Calibri;
  79. font-size: 20px;
  80. margin-top: 5px;
  81. margin-bottom: 5px;
  82. padding-bottom: 4px;
  83. font-size: 16px;
  84. text-align: center; }
  85.  
  86. #link {
  87. font-family: Calibri;
  88. font-size: 20px;
  89. margin-top: 5px;
  90. padding-bottom: 0px;
  91. font-size: 16px;
  92. text-align: center; }
  93.  
  94. h1 {
  95. font-family: Calibri;
  96. font-size: 20px;
  97. line-height: 15px;
  98. letter-spacing: 0px;
  99. text-transform: none;
  100. font-weight: normal;
  101. text-align: left;
  102. margin-top: 0px;
  103. margin-bottom: 0px;
  104. padding: 0px;
  105. color: {color:Links}; }
  106.  
  107.  
  108. /* --- QUOTE --- */
  109.  
  110. #quote {
  111. margin: 0px 0px;
  112. font-family: Calibri;
  113. font-size: 16px; }
  114.  
  115. #source {
  116. padding-top: 5px;
  117. padding-left: 20px; }
  118.  
  119.  
  120. /* --- AUDIO --- */
  121.  
  122. #audio {
  123. padding: 0px; }
  124.  
  125. .qu {
  126. opacity: 0.7;
  127. font-family: Calibri;
  128. font-size: 25px;
  129. font-weight: bold;
  130. line-height: 33px;}
  131.  
  132. .ote {
  133. opacity: 0.9;
  134. margin-top: -34px;
  135. text-indent: 15px; }
  136.  
  137. .audio {
  138. background-color :white;
  139. display: block; }
  140.  
  141.  
  142. /* --- QUESTION --- */
  143.  
  144. .asker {
  145. width: 485px;
  146. padding: 5px;
  147. text-transform: normal;
  148. line-height: 100%;
  149. font-weight: normal;
  150. color:{color:Font}; }
  151.  
  152. .asker img {
  153. float: left;
  154. padding: 0px 7px 0px 0px; }
  155.  
  156. .asker a {
  157. margin: 0;
  158. padding: 0;
  159. line-height: 100%;
  160. font-weight: bold;
  161. text-transform: normal;
  162. color: {color:Links}; }
  163.  
  164. .asker a:hover {
  165. margin: 0;
  166. padding: 0;
  167. font-weight: bold;
  168. text-transform: normal;
  169. color: {color:Font}; }
  170.  
  171. .question {
  172. font-size: 8px;
  173. font-weight: normal;
  174. text-transform: none;
  175. color:{color:Font};
  176. background-color: {color:Border}; }
  177.  
  178. .answer {
  179. padding-top: 0px;
  180. padding-left: 5px;
  181. padding-right: 5px; }
  182.  
  183. .answer img {
  184. max-width: 500px; }
  185.  
  186. img a {
  187. border: none;
  188. width:100%; }
  189.  
  190.  
  191. /* --- CHAT --- */
  192.  
  193. .user_1 .label {color:{color:link}; font-weight:bold;}
  194. .user_2 .label {color:{color:link}; font-weight:bold;}
  195. .user_3 .label {color:{color:link}; font-weight:bold;}
  196. .user_4 .label {color:{color:link}; font-weight:bold;}
  197. .user_5 .label {color:{color:link}; font-weight:bold;}
  198. .user_6 .label {color:{color:link}; font-weight:bold;}
  199. .user_7 .label {color:{color:link}; font-weight:bold;}
  200. .user_8 .label {color:{color:link}; font-weight:bold;}
  201. .user_9 .label {color:{color:link}; font-weight:bold;}
  202. .user_10 .label {color:{color:link}; font-weight:bold;}
  203. .user_11 .label {color:{color:link}; font-weight:bold;}
  204. .user_12 .label {color:{color:link}; font-weight:bold;}
  205. .user_13 .label {color:{color:link}; font-weight:bold;}
  206. .user_14 .label {color:{color:link}; font-weight:bold;}
  207. .user_15 .label {color:{color:link}; font-weight:bold;}
  208. .user_16 .label {color:{color:link}; font-weight:bold;}
  209. .user_17 .label {color:{color:link}; font-weight:bold;}
  210. .user_18 .label {color:{color:link}; font-weight:bold;}
  211. .user_19 .label {color:{color:link}; font-weight:bold;}
  212. .user_20 .label {color:{color:link}; font-weight:bold;}
  213.  
  214. ul.chat, .chat ol, .chat li {
  215. margin:0px;
  216. padding:0px;
  217. list-style:none;}
  218.  
  219.  
  220. /* --- SCROLLBAR --- */
  221.  
  222. ::-webkit-scrollbar-thumb:vertical {
  223. height:10px;
  224. background-color: {color:Border}; }
  225.  
  226. ::-webkit-scrollbar-thumb:horizontal {
  227. height:10px;
  228. background-color: {color:Border}; }
  229.  
  230. ::-webkit-scrollbar {
  231. height: 10px;
  232. width: 10px;
  233. background-color: {color:Background}; }
  234.  
  235.  
  236. /* --- PERMALINK NOTES PAGE --- */
  237.  
  238. #perma-notes {
  239. position: absolute;
  240. margin-top: 0px;
  241. margin-left: 0px;
  242. margin-bottom: 50px;
  243. width: 460px;
  244. padding: 20px 30px;
  245. background-color: {color:Background};
  246. -webkit-transition: 0.4s linear; }
  247.  
  248. #perma-notes img {
  249. width: 0px;
  250. height: 0px; }
  251.  
  252. ol.notes, .notes li {
  253. margin: 0px 0px 0px 0px;
  254. width: 480px;
  255. padding: 2px;
  256. text-align: left;
  257. color: {color:Font}; }
  258.  
  259. ol.notes, .notes li a {
  260. text-align: left;
  261. color: {color:Links}; }
  262.  
  263. ol.notes, .notes li a:hover {
  264. color: {color:Font}; }
  265.  
  266.  
  267. /* --- POSTS --- */
  268.  
  269. #entries {
  270. position: absolute;
  271. top: 0px;
  272. margin-left: 270px;
  273. width: 520px;
  274. padding: 30px 30px 30px 30px;
  275. background-color: {color:Background};
  276. z-index: 1000; }
  277.  
  278. #posts {
  279. overflow: hidden;
  280. margin-top: 0px;
  281. margin-bottom: 40px;
  282. padding: 10px 10px 8px 10px;
  283. font-size: 10px;
  284. background-color: {color:Background};
  285. -webkit-transition: 0.4s linear; }
  286.  
  287. #posts:hover {
  288. background-color: {color:Border}; }
  289.  
  290. #posts:hover #info {
  291. background-color: {color:Border}; }
  292.  
  293.  
  294. /* --- INFO --- */
  295.  
  296. #info {
  297. position: absolute;
  298. opacity: 1;
  299. margin-top: -39px;
  300. margin-left: 0px;
  301. width: 500px;
  302. padding: 2px 10px 2px 10px;
  303. font-size: 10px;
  304. line-height:100%;
  305. text-align: left;
  306. color: {color:Links};
  307. background-color: {color:Background};
  308. -webkit-transition: 0.4s linear; }
  309.  
  310. #info a {
  311. color: {color:Links}; }
  312.  
  313. #info a:hover {
  314. color: {color:Font};
  315. -webkit-transition: 0.4s linear; }
  316.  
  317.  
  318. /* --- SIDEBAR --- */
  319.  
  320. #center {
  321. margin-left: auto;
  322. margin-right: auto;
  323. width: 900px; }
  324.  
  325. #position {
  326. position: fixed;
  327. top: 155px;
  328. margin-left: -40px;
  329. width: 200px;
  330. z-index:2000; }
  331.  
  332. #sidebar {
  333. margin-left: 0px;
  334. margin-top: 0px;
  335. width: 200px;
  336. height: 150px;
  337. font-size: 10px;
  338. color: {color:Font}; }
  339.  
  340. #sidebar:hover #description {
  341. opacity: 1;
  342. display: block; }
  343.  
  344. #sideimg {
  345. margin-left: -2000px;
  346. margin-top: 0px;
  347. padding: 0px;
  348. Background: {color:Side Background}; }
  349.  
  350. #sideimg img {
  351. width: 200px;
  352. height: 150px;
  353. border-top: 0px solid {color:Border};
  354. border-left: 2005px solid {color:Border};
  355. border-right: 100px solid {color:Border}; }
  356.  
  357. #description {
  358. position: fixed;
  359. opacity: 1;
  360. overflow: hidden;
  361. margin-top: 10px;
  362. margin-left: -2000px;
  363. width: 200px;
  364. padding: 9px 70px 3000px 2005px;
  365. text-align: center;
  366. color: {color:Font};
  367. background-color: {color:Side Background};
  368. -webkit-transition-duration: .90s;
  369. z-index:3000;}
  370.  
  371.  
  372. /* --- BORDER --- */
  373.  
  374.  
  375. #left {
  376. position: fixed;
  377. top: 0px;
  378. margin-left: -1735px;
  379. width: 2000px;
  380. height: 100%;
  381. background-color: {color:Side Background};
  382. border-right: 5px solid {color:Border};
  383. z-index: 1002; }
  384.  
  385.  
  386. /* --- NAVIGATION --- */
  387.  
  388. #nav {
  389. position: fixed;
  390. top: 155px;
  391. margin-left: 165px;
  392. z-index: 2002; }
  393.  
  394. #nav-a, #nav-b, #nav-c, #nav-d, #nav-e {
  395. position: fixed;
  396. margin-left: 0px;
  397. -webkit-transition-duration: .90s; }
  398.  
  399. #nav-a {
  400. margin-top: 0px;
  401. background: {color:Nav Background 1}; }
  402. #nav-b {
  403. margin-top: 30px;
  404. background: {color:Nav Background 2}; }
  405. #nav-c {
  406. margin-top: 60px;
  407. background: {color:Nav Background 3}; }
  408. #nav-d {
  409. margin-top: 90px;
  410. background: {color:Nav Background 2}; }
  411. #nav-e {
  412. margin-top: 120px;
  413. background: {color:Nav Background 1}; }
  414.  
  415. .links {
  416. display: block;
  417. width: 100px;
  418. padding: 10px 0px 10px 0px;
  419. font-size: 8px;
  420. font-family: Calibri;
  421. text-transform: uppercase;
  422. letter-spacing: 1px;
  423. text-align: center;
  424. color: {color:Nav Links};
  425. -webkit-transition-duration: .60s; }
  426. .links a, a {
  427. text-decoration: none;
  428. text-transform: none;
  429. color: {color:Nav Links}; }
  430. .links:hover {
  431. letter-spacing: 3px;
  432. color: {color:Nav Links};
  433. background: {color:Border};
  434. -webkit-transition-duration: .60s; }
  435.  
  436.  
  437. /* --- PAGES --- */
  438.  
  439. #next {
  440. position: fixed;
  441. bottom: 0px;
  442. margin-left: 865px;
  443. width: 15px;
  444. padding-bottom: 30px;
  445. background-color: {color:Border};
  446. -webkit-transition-duration: .90s; }
  447.  
  448. #prev {
  449. position: fixed;
  450. bottom: 30px;
  451. margin-left: 850px;
  452. width: 15px;
  453. padding-right: 2000px;
  454. background-color: {color:Side Background};
  455. -webkit-transition-duration: .90s; }
  456.  
  457. .pages {
  458. display: block;
  459. width: 15px;
  460. padding: 1px 0px 4px 0px;
  461. font-size: 20px;
  462. text-align: center;
  463. color: {color:Links};
  464. background: none;
  465. -webkit-transition-duration: .90s; }
  466. .pages a, a {
  467. text-decoration: none;
  468. text-transform: none;
  469. color: {color:Font}; }
  470. .pages:hover {
  471. color: {color:Font};
  472. background-color: {color:Nav Background 1}; }
  473.  
  474.  
  475. /* --- CREDIT --- */
  476.  
  477. #credit {
  478. position: fixed;
  479. bottom: 7px;
  480. right: 20px;
  481. width: 6px;
  482. height: 8px;
  483. padding: 3px 5px 5px 5px;
  484. font-family: Calibri;
  485. font-size: 10px;
  486. letter-spacing: 1px;
  487. text-align:center;
  488. text-transform: uppercase;
  489. color: {color:Font};
  490. overflow: hidden;
  491. -webkit-transition-duration: .60s;
  492. z-index: 10000; }
  493.  
  494. #credit a {
  495. color: {color:Font}; }
  496.  
  497. #credit b {
  498. font-style: italic;
  499. font-weight: bold;
  500. color: {color:Links}; }
  501.  
  502. #credit:hover {
  503. width: 28px;
  504. -webkit-transition-duration: .60s; }
  505.  
  506.  
  507. </style></head>
  508.  
  509. <body>
  510.  
  511. <!-- DO NOT REMOVE !!! --><div id="credit">
  512. <a href="http://ohmyklaus.tumblr.com/tagged/themes">
  513. <b>t</b>heme</a></div> <!-- DO NOT REMOVE !!! -->
  514.  
  515.  
  516. <div id="center">
  517.  
  518. {block:Pagination}{block:PreviousPage}<div id="prev"><center>
  519. <a href="{PreviousPage}"> <div class="pages">«</div></a>
  520. </center></div>{/block:PreviousPage}{/block:Pagination}
  521.  
  522. {block:Pagination}{block:PreviousPage}<div id="next"><center>
  523. <a href="{NextPage}"> <div class="pages">»</div></a>
  524. </center></div>{/block:PreviousPage}{/block:Pagination}
  525.  
  526. <div id="left"><br></div>
  527.  
  528. <div id="nav">
  529. <div id="nav-a"><a href="{text:Link 1 URL}">
  530. <div class="links">{text:Link 1 Title}</div></a></div>
  531. <div id="nav-b"><a href="{text:Link 2 URL}">
  532. <div class="links">{text:Link 2 Title}</div></a></div>
  533. <div id="nav-c"><a href="{text:Link 3 URL}">
  534. <div class="links">{text:Link 3 Title}</div></a></div>
  535. <div id="nav-d"><a href="{text:Link 4 URL}">
  536. <div class="links">{text:Link 4 Title}</div></a></div>
  537. <div id="nav-e"><a href="{text:Link 5 URL}">
  538. <div class="links">{text:Link 5 Title}</div></a></div>
  539. </div>
  540.  
  541. <div id="position">
  542. <div id="sidebar">
  543.  
  544. <div id="sideimg">
  545. <img src="{image:Side Image 200x150px}" width="200px">
  546. </div>
  547.  
  548. <div id="description">
  549. {description}</div>
  550.  
  551. </div></div>
  552.  
  553.  
  554. <div id="entries">
  555. {block:Posts}
  556. <div id="posts">
  557.  
  558. {block:Title}
  559. <h1>{Title}&nbsp;</h1>
  560. {/block:Title}
  561.  
  562. {block:Text}
  563. {Body}
  564. {/block:Text}
  565.  
  566. {block:Quote}
  567. <div id="quote">
  568. <i>{Quote}</i>
  569. </div>
  570. {block:Source}
  571. <div id="source">
  572. - {Source}
  573. </div>{/block:Source}
  574. {/block:Quote}
  575.  
  576. {block:Link}
  577. <a href="{URL}" class="link" {Target}><h1>{Name}&nbsp;</h1></a>
  578. {block:Description}{Description}{/block:Description}
  579. {/block:Link}
  580.  
  581. {block:Photo}
  582. {LinkOpenTag}
  583. <img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
  584. {LinkCloseTag}<br>
  585. {block:Caption}
  586. {Caption}
  587. {/block:Caption}
  588. {/block:Photo}
  589.  
  590. {block:Photoset}
  591. {Photoset-500}
  592. {block:Caption}
  593. {Caption}
  594. {/block:Caption}
  595. {/block:Photoset}
  596.  
  597. {block:Chat}
  598. <ul class="chat">
  599. {block:Lines}
  600. <li class="user_{UserNumber}">
  601. {block:Label}
  602. <span class="label">{Label}</span>
  603. {/block:Label}
  604. &nbsp;{Line}</li>
  605. {/block:Lines}</ul>
  606. {/block:Chat}
  607.  
  608. {block:Video}
  609. {Video-500}
  610. {block:Caption}
  611. {Caption}
  612. {/block:Caption}
  613. {/block:Video}
  614.  
  615. {block:Answer}
  616. <div class="asker">
  617. <img src="{AskerPortraitURL-24}"><b>{Asker}</b> asked:
  618. <div class="questions">
  619. {Question}
  620. </div></div>
  621. <div class="answer">
  622. {Answer}
  623. </div>
  624. {/block:Answer}
  625.  
  626. {block:Audio}
  627. <div id="audio">
  628. {block:AlbumArt}
  629. <img src="{AlbumArtURL}"
  630. width="55px" height="55px"
  631. align="left" style="margin-right:10px" />
  632. {/block:AlbumArt}
  633. {block:TrackName}
  634. Song: <b>{TrackName}</b><br>
  635. {/block:TrackName}
  636. {block:Artist}
  637. Artist: <b>{Artist}</b><br><br>
  638. {/block:Artist}
  639. {AudioPlayerBlack}<br>
  640. </div>
  641. {block:Caption}
  642. {Caption}
  643. {/block:Caption}
  644. {/block:Audio}
  645.  
  646. </div>
  647.  
  648. <div id="info">
  649. {block:Date}
  650. posted
  651. <a href="{Permalink}">{TimeAgo}</a>
  652. {/block:Date}
  653. {block:NoteCount}
  654. with <a href="{Permalink}">{NoteCount} notes</a>
  655. {/block:NoteCount}
  656. {block:RebloggedFrom}
  657. » via <a href="{ReblogParentURL}">
  658. <a href="{ReblogParentURL}">{ReblogParentName}</a>
  659. {/block:RebloggedFrom}
  660. {block:ContentSource}
  661. » <a href="{SourceURL}">©</a>
  662. {/block:ContentSource}
  663.  
  664. {block:HasTags}<br> tags:
  665. {block:Tags} # <a href="/tagged/{Tag}">{Tag}</a>{/block:Tags}
  666. {/block:HasTags} <br>
  667. </div>
  668.  
  669. {/block:Posts}
  670.  
  671. {block:PostNotes}
  672. <div id="perma-notes">{PostNotes}</div>
  673. {/block:PostNotes}
  674.  
  675. </div>
  676.  
  677. </body>
  678. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement