SHARE
TWEET

Theme 7 by ohmyklaus

ohmy-klaus Sep 14th, 2012 (edited) 3,837 Never
  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>
RAW Paste Data
Top