drcomalfoy

THEME 3: BITCHCRAFT (no header)

Mar 18th, 2016
3,400
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 17.10 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <title>{Title}</title>  
  5.        
  6. <!----------
  7.    
  8.    Theme 3: Bitchcraft
  9.    created by merc / drcomalfoy
  10.    
  11.    >> inspired by my bitchcraft skin
  12.    >> jcink version: http://skinnedbymerc01.jcink.net
  13.    
  14. ---------->
  15.  
  16. <script type='text/javascript' src='//files.jcink.net/html/jquery-1.7.2.min.js'></script>
  17. <link href='https://fonts.googleapis.com/css?family=Montserrat:400,700' rel='stylesheet' type='text/css'>
  18. <link href='https://fonts.googleapis.com/css?family=Passion+One' rel='stylesheet' type='text/css'>
  19.        
  20.         <meta name="color:Background" content="#fbfbfb" />
  21.         <meta name="color:Topbar" content="#ffffff" />
  22.         <meta name="color:Topbar Text" content="#000000" />
  23.         <meta name="color:Topbar Scrolled" content="#000000" />
  24.         <meta name="color:Topbar Scrolled Text" content="#ffffff" />
  25.        
  26.         <meta name="color:Title Color" content="#000000" />
  27.         <meta name="color:Description Color" content="#696969" />
  28.         <meta name="text:Subtitle" content="WELCOME TO THE PACKS" />
  29.         <meta name="text:Box Outline Offset" content: "2px" />
  30.        
  31.         <meta name="text:Link 1 Text" content: "Index" />
  32.         <meta name="text:Link 1 Url" content: "/" />
  33.         <meta name="text:Link 2 Text" content: "Message" />
  34.         <meta name="text:Link 2 Url" content: "/ask" />
  35.         <meta name="text:Link 3 Text" content: "Link" />
  36.         <meta name="text:Link 3 Url" content: "/" />
  37.         <meta name="text:Link 4 Text" content: "Link" />
  38.         <meta name="text:Link 4 Url" content: "/" />
  39.         <meta name="text:Link 5 Text" content: "Link" />
  40.         <meta name="text:Link 5 Url" content: "/" />
  41.         <meta name="text:Link 6 Text" content: "Archive" />
  42.         <meta name="text:Link 6 Url" content: "/archive" />
  43.  
  44.         <style>
  45.        
  46. ::-webkit-scrollbar-thumb:vertical {
  47.     background-color: #191919;
  48.     height: 10px;
  49.     border: 3px solid #fbfbfb;
  50.     width: 5px;
  51. }
  52. ::-webkit-scrollbar {
  53.     width: 9px;
  54.     border: 4px solid #fbfbfb;
  55.     background-color: #191919;
  56. }
  57.  
  58.            
  59. body {
  60.     margin: 0px;
  61.     background-color: {color:Background};
  62.     cursor: url(http://31.media.tumblr.com/tumblr_lqs4idHqTZ1qfoi4t.png), auto;
  63.  
  64. }
  65. a {
  66.     text-decoration: none;
  67.     color: #191919;
  68. }
  69. #wrapper .right a.tumblr_blog {
  70.     padding: 2px;
  71.     font-family: montserrat;
  72.     font-size: 7px;
  73.     text-transform: uppercase;
  74. }
  75.  
  76. #merc_topbar {
  77.     font-family: montserrat;
  78.     font-size: 15px;
  79.     font-weight: bold;
  80.     text-transform: uppercase;
  81.     letter-spacing: 1px;
  82.     top: 0px;
  83.     width: calc(100% - 80px);
  84.     padding: 40px;
  85.     background-color: {color:Topbar};
  86.     left: 0px;
  87.     right: 0px;
  88.     text-align: center;
  89.     color: {color:Topbar Text};
  90.     position: fixed;
  91.     -moz-transition: all 0.9s ease-in-out;
  92.     -webkit-transition: all 0.9s ease-in-out;
  93.     -o-transition: all 0.9s ease-in-out;
  94.     z-index: 3;
  95. }
  96. #merc_topbar.topedit {
  97.     color: {color:Topbar Scrolled Text};
  98.     background-color: {color:Topbar Scrolled};
  99. }
  100. #merc_topbar .linkbar_left {
  101.     width: 250px;
  102.     border-bottom: 1px solid #fff;
  103.     font-size: 8px;
  104.     letter-spacing: 1px;
  105.     font-family: montserrat;
  106.     float: left;
  107.     padding: 2px;
  108.     left: 0px;
  109.     text-align: center;
  110.     word-spacing: 50px;
  111. }
  112. #merc_topbar .linkbar_right {
  113.     width: 250px;
  114.     border-bottom: 1px solid #fff;
  115.     font-size: 8px;
  116.     letter-spacing: 1px;
  117.     font-family: montserrat;
  118.     float: right;
  119.     padding: 2px;
  120.     left: 0px;
  121.     text-align: center;
  122.     word-spacing: 50px;
  123. }
  124. #merc_topbar a {
  125.     color: #000;
  126.     text-decoration: none;
  127. }
  128. #merc_topbar.topedit a { color: #fff; }
  129.  
  130. #wrapper {
  131.     margin: 25px auto;
  132.     width: 1100px;
  133.     padding: 50px;
  134.     margin-top: 100px;
  135. }
  136. #wrapper .left {
  137.     width: 200px;
  138.     float: left;
  139.     padding: 10px;
  140. }
  141. #wrapper .right {
  142.     width: 650px;
  143.     margin-left: 30%;
  144.     padding: 10px;
  145. }
  146. #wrapper .right .posts {
  147.     margin-top: 25px;
  148.     width: 500px;
  149. }
  150. #wrapper .left .box {
  151.     padding: 20px;
  152.     background-color: #fff;
  153.     outline: 1px solid #f7f7f7;
  154.     outline-offset: {text:Box Outline Offset};
  155.     margin-top: 25px;
  156. }
  157. #wrapper .left .box h1 {
  158.     color: {color:Title Color};
  159.     font-family: montserrat;
  160.     font-weight: bold;
  161.     font-size: 10px;
  162.     letter-spacing: 1px;
  163. }
  164. #wrapper .left .box .desc {
  165.     line-height: 115%;
  166.     font-size: 10px;
  167.     font-family: trebuchet ms, calibri, arial;
  168.     text-align: justify;
  169.     color: {color:Description Color};
  170.     padding-left: 3px;
  171.     padding-right: 3px;
  172. }
  173. #wrapper .left .box .desc2 {
  174.     line-height: 155%;
  175.     font-size: 7px;
  176.     text-transform: Uppercase;
  177.     font-weight: bold;
  178.     letter-spacing: 1px;
  179.     font-family: trebuchet ms, calibri, arial;
  180.     text-align: justify;
  181.     color: {color:Description Color};
  182.     padding-left: 3px;
  183.     padding-right: 3px;
  184. }
  185. #wrapper .left .box .desc2 b {
  186.     border-bottom: 1px solid #efefef;
  187. }
  188. #wrapper .left .box .affbox {
  189.     width: 174px;
  190.     line-height: 150%;
  191.     height: 40px;
  192. }
  193. #wrapper .left .box .affbox img {
  194.     float: left;
  195.     width: 30px;
  196.     height: 30px;
  197.     background-image:url(http://placehold.it/30x30/191919/ffffff);
  198.     outline: 1px solid #efefef;
  199.     outline-offset: 2px;
  200.     text-align: center;
  201.     margin-right: 10px;
  202. }
  203. #wrapper .left .box .affbox .affname {
  204.     font-family: trebuchet ms, calibri, arial;
  205.     font-size: 7px;
  206.     font-weight: bold;
  207.     letter-spacing: 1px;
  208.     padding-top: 3px;
  209.     text-transform: uppercase;
  210.    
  211. }
  212. #wrapper .left .box .affbox .affname a {
  213.     color: #000;
  214.     text-decoration: none;
  215.     -moz-transition: all 0.2s ease-in-out;
  216.     -webkit-transition: all 0.2s ease-in-out;
  217.     -o-transition: all 0.2s ease-in-out;
  218.     font-style: normal;
  219. }
  220. #wrapper .left .box .affbox .affname a:hover {
  221.     font-style: italic;
  222.     padding-left: 20px;
  223. }
  224.  
  225. /*** POST STUFFS ***/
  226. #wrapper .right .posts li {
  227.     list-style: disc;
  228. }
  229.  
  230. #wrapper .right .posts blockquote {
  231.     border-left: 1px solid {color:text};
  232.     padding-left: 10px;
  233.     margin: 10px;
  234. }
  235. #wrapper .right .postnotes {
  236.     line-height: 200%;
  237.     text-align: center;
  238.     margin-top: 20px;
  239.     list-style: none;
  240.     margin-left: -25px
  241. }
  242.  
  243. #wrapper .right .postnotes ol.notes {
  244.     list-style-type: none;
  245.     font-family: trebuchet ms;
  246.     font-size: 7px;
  247.     font-weight: bold;
  248.     text-transform: Uppercase;
  249.     letter-spacing: 1px;
  250. }
  251.  
  252. #wrapper .right .pnotes {
  253.     list-style-type: none;
  254.     font-family: trebuchet ms;
  255.     font-size: 7px;
  256.     font-weight: bold;
  257.     text-transform: Uppercase;
  258.     letter-spacing: 1px;
  259. }
  260.  
  261. #wrapper .right .pnotes li {
  262.     list-style-type: none;
  263. }
  264. #wrapper .right .pnotes img {
  265.     display: none;
  266. }
  267. #wrapper .right .postnotes li {
  268.     list-style-type: none;
  269. }
  270.  
  271. #wrapper .right .postnotes img.avatar {
  272.     width: 0px;
  273.     height: 0px;
  274. }
  275.  
  276. #wrapper .right h1 {
  277.    
  278.     font-size: 15px;
  279.     font-family: montserrat;
  280.     line-height: 125%;
  281.     text-align: left;
  282. }
  283.  
  284. /*EDIT QUOTE POSTS*/
  285.  
  286. #wrapper .right h2 {
  287.     text-align: center;
  288.     font-size: 15px;
  289.     font-style: italic;
  290.     font-family: montserrat;
  291.     line-height: 125%;
  292. }
  293. #wrapper .right h2::after {
  294.     content: '"';
  295.     color: #f7f7f7;
  296.     font-family: passion one;
  297.     font-weight: bold;
  298.     font-size: 40px;
  299. }
  300. #wrapper .right .ask {
  301.     background-color: #fff;
  302.     padding: 20px;
  303.     text-align: center;
  304.     outline: 1px solid #f7f7f7;
  305.     outline-offset: 2px;
  306. }
  307. #wrapper .right .ask .asker {
  308.     font-family: trebuchet ms;
  309.     font-size: 7px;
  310.     font-weight: bold;
  311.     letter-spacing: 1px;
  312.     text-align: right;
  313.     color: #cccccc;
  314.     text-transform: Uppercase;
  315. }
  316. #wrapper .right .ask .asker a {
  317.     color: #696969;
  318.     font-family: montserrat;
  319.     text-decoration: none;
  320.     padding-right: 20px;
  321.     font-style: italic;
  322. }
  323. #wrapper .right .ask .question {
  324.     text-align: justify;
  325.     font-family: trebuchet ms;
  326.     font-size: 9px;
  327.     line-height: 125%;
  328.     color: #696969;
  329.     padding: 10px;
  330.     margin-bottom: 10px;
  331.     background-color: #f7f7f7;
  332. }
  333. #wrapper .right .answer {
  334.     font-family: trebuchet ms, calirbi, arial;
  335.     font-size: 10px;
  336.     text-align: justify;
  337.     padding-right: 20px;
  338.     padding-left: 20px;
  339.     color: #696969;
  340. }
  341. #wrapper .right .conv {
  342.     background-color: #fff;
  343.     padding: 20px;
  344.     outline: 1px solid #f7f7f7;
  345.     outline-offset: 2px;
  346.     font-family: trebuchet ms;
  347.     font-size: 9px;
  348.     line-height: 135%;
  349.     color: #696969;
  350. }        
  351. #wrapper .right .conv .line {
  352.     border-bottom: 1px solid #efefef;
  353.     padding: 2px;
  354. }
  355. #wrapper .right .conv span {
  356.     font-weight: bold;
  357.     font-size: 7px;
  358.     text-transform: uppercase;
  359.     letter-spacing: 1px;
  360.     color: #191919;
  361. }
  362. #wrapper .right .ptext {
  363.     background-color: #fff;
  364.     padding: 20px;
  365.     font-family: trebuchet ms, calibri, arial;
  366.     font-size: 10px;
  367.     line-height: 125%;
  368.     outline: 1px solid #f7f7f7;
  369.     outline-offset: 2px;
  370.     margin-top: 2px;
  371. }
  372. #wrapper .right .ptext img {
  373.     max-width: 100%;
  374.     height: auto;
  375. }
  376. #wrapper .right .ptext .source {
  377.     font-family: trebuchet ms;
  378.     font-size: 7px;
  379.     letter-spacing: 1px;
  380.     font-weight: bold;
  381.     text-transform: uppercase;
  382.     margin-left: 50px;
  383. }
  384. #wrapper .right .ptext .source::before {
  385.     content: "";
  386.     width: 25px;
  387.     height: 1px;
  388.     background-color: #efefef;
  389.     float: left;
  390.     margin-right: 5px;
  391.     margin-top: 5px;
  392. }
  393. #wrapper .right .postinfo {
  394.     position: absolute;
  395.     margin-left: 520px;
  396.     float: right;
  397.     font-family: trebuchet ms;
  398.     font-size: 7px;
  399.     font-weight: bold;
  400.     text-transform: uppercase;
  401.     letter-spacing: 1px;
  402.     margin-top: 25px;
  403.     color: #696969;
  404.     width: 150px;
  405.     padding: 10px;
  406.     opacity: .6;
  407.     z-index: 1;
  408. }
  409. #wrapper .pagination {
  410.     font-family: montserrat;
  411.     font-size: 8px;
  412.     text-transform: uppercase;
  413.     letter-spacing: 1px;
  414.     padding: 20px;
  415.     font-weight: bold;
  416. }
  417. #credit {
  418.     float: right;
  419.     position: fixed;
  420.     bottom: 40px;
  421.     right: 30px;
  422.     font-weight: bold;
  423.     letter-spacing: 1px;
  424.     background-color: #fff;
  425.     font-family: montserrat;
  426.     text-transform: uppercase;
  427.     font-size: 8px;
  428.     -webkit-transition-duration:.8s;
  429.     -moz-transition-duration:.8s;
  430.     -o-transition-duration:.8s;
  431.     -ms-transition-duration:.8s;
  432. }
  433.  
  434. #credit a {
  435.     color: #191919;
  436.     padding: 10px;
  437.     background-color: #fff;
  438. }
  439.  
  440. #credit a:hover {   background-color:#fff; color: #191919; }
  441.  
  442.  
  443.             /* Custom CSS */
  444.             {CustomCSS}
  445.         </style>
  446.        
  447.         <script>
  448. $(document).ready (function () {
  449.     $(window).scroll (function () {
  450.         var sT = $(this).scrollTop();
  451.             if (sT >= 250) {
  452.                 $('#merc_topbar').addClass('topedit')
  453.             }else {
  454.                 $('#merc_topbar').removeClass('topedit')
  455.             }
  456.     })
  457. })
  458.         </script>
  459.        
  460.        
  461. <script>
  462. $(function(){ // document ready
  463.  
  464.  if (!!$('.pagination').offset()) { // make sure ".sticky" element exists
  465.  
  466.    var stickyTop = $('.pagination').offset().top; // returns number
  467.  
  468.    $(window).scroll(function(){ // scroll event
  469.  
  470.      var windowTop = $(window).scrollTop(); // returns number
  471.  
  472.      if (stickyTop < windowTop){
  473.       $('.pagination').css({ position: 'fixed', top: 100 });
  474.     }
  475.     else {
  476.       $('.pagination').css('position','static');
  477.     }
  478.  
  479.   });
  480.  
  481. }
  482.  
  483. });
  484. </script>
  485.        
  486.     </head>
  487.     <body>
  488.    
  489.    
  490. <div id="credit"><a href="http://dransy.co.vu/">merc</a></div>
  491.  
  492.    
  493. <div id="merc_topbar">
  494.     <div class="linkbar_right">
  495.         <a href="{text:Link 4 Url}">{text:Link 4 Text}</a>
  496.         <a href="{text:Link 5 Url}">{text:Link 5 Text}</a>
  497.         <a href="{text:Link 6 Url}">{text:Link 6 Text}</a>
  498.     </div>
  499.     <div class="linkbar_left">
  500.         <a href="{text:Link 1 Url}">{text:Link 1 Text}</a>
  501.         <a href="{text:Link 2 Url}">{text:Link 2 Text}</a>
  502.         <a href="{text:Link 3 Url}">{text:Link 3 Text}</a>
  503.     </div>
  504.     {Title}
  505. </div>
  506.    
  507. <div id="wrapper">
  508.     <div class="left">
  509.         <div class="box">
  510.             <h1>{text:Subtitle}</h1>
  511.             <div class="desc">{description}</div>
  512.         </div>
  513.         <div class="box">
  514.             <h1>AFFILIATES</h1>
  515.            
  516.             <!--- COPY AND PASTE THIS FOR A NEW AFFILIATE --->
  517.             <div class="affbox">
  518.                 <img src="http://placehold.it/30x30/191919/ffffff" />
  519.                 <div class="affname"><a href="/">Affiliate One</a></div>
  520.             </div>
  521.             <!--- END COPY PASTE --->
  522.            
  523.             <div class="affbox">
  524.                 <img src="http://placehold.it/30x30/191919/ffffff" />
  525.                 <div class="affname"><a href="/">Affiliate Two</a></div>
  526.             </div>
  527.            
  528.             <div class="affbox">
  529.                 <img src="http://placehold.it/30x30/191919/ffffff" />
  530.                 <div class="affname"><a href="/">Affiliate Three</a></div>
  531.             </div>
  532.            
  533.         </div>
  534.        
  535.         <div class="box">
  536.             <h1>ABOUT THE BLOG</h1>
  537.             <div class="desc2">
  538.                 <b>Established:</b> ##, Month 2016<br />
  539.                 <b>Online:</b> 163 Viewing<br />
  540.                 <b>Visits:</b> 1234 Visits
  541.             </div>
  542.         </div>
  543.        
  544.         <div class="box">
  545.             <h1>DISCLAIMER</h1>
  546.             <div class="desc2">
  547.                 This is where you write your disclaimer.
  548.             </div>
  549.         </div>
  550.        
  551.             <!--PAGINATION-->
  552. {block:Pagination}
  553.     <div class="pagination">
  554.         {block:PreviousPage}
  555.         <a href="{PreviousPage}">
  556.             <div class="pagibutton">Previous</div></a>
  557.         {/block:PreviousPage}
  558.         {block:NextPage}
  559.         <a href="{NextPage}">
  560.             <div class="pagibutton">Next</div></a>
  561.         {/block:NextPage}
  562.     </div>
  563. {/block:Pagination}
  564.        
  565.        
  566.     </div>
  567.     <div class="right">
  568.         {block:Posts}
  569.        
  570.         <div class="postinfo">
  571.         <a href="{Permalink}">{NoteCountWithLabel}</a><br />
  572.         {block:Date}
  573.             {MonthNumberWithZero}
  574.             {DayOfMonthWithZero}
  575.             {Year}<br />
  576.         {/block:Date}
  577.             {block:HasTags}
  578.                 {block:Tags}
  579.                     #<a href="/tagged/{TAG}">{TAG}</a>
  580.                 {/block:Tags}
  581.             {/block:HasTags}
  582.            
  583.            
  584.      {block:PermalinkPage}
  585.         {block:RebloggedFrom}<a href="{ReblogParentURL}">VIA {ReblogParentName} </a><br /><a href="{ReblogRootURL}">SOURCE {ReblogRootName}</a>{/block:RebloggedFrom}
  586.      {/block:PermalinkPage}
  587.         </div>
  588.        
  589.             <div class="posts">
  590.     {block:Text}
  591.     <div class="ptext">
  592.     {block:Title}<h1>{Title}</h1>{/block:Title}
  593.     {Body}
  594.     </div>
  595.     {/block:Text}
  596.                
  597.                  
  598.     {block:Answer}
  599.     <div class="ask">
  600.         <div class="question">{Question}</div>
  601.         <div class="asker">sent in by {Asker}</div>
  602.         <div class="answer">{Answer}</div>
  603.     </div>
  604.     {/block:Answer}
  605.      
  606.     {block:Quote}
  607.     <div class="ptext">
  608.     <h2>{Quote}</h2>
  609.     {block:Source}<div class="source">{Source}</div>{/block:Source}  
  610.     </div>
  611.     {/block:Quote}
  612.      
  613.     {block:Link}
  614.     <div class="ptext">
  615.     <h1><a href="{URL}">{Name}</a></h1>
  616.     {block:Description}{Description}{/block:Description}
  617.     </div>
  618.     {/block:Link}
  619.      
  620.     {block:Chat}
  621.     {block:Title}<h1>{Title}</h1>{/block:Title}
  622.     <div class="conv">
  623.         {block:Lines}<div class="line">
  624.             {block:Label}<span class="label">{Label}</span>{/block:Label}
  625.         {Line}</div>{/block:Lines}
  626.     </div>
  627.     {/block:Chat}
  628.      
  629.     {block:Photo}
  630.     {LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}">{LinkCloseTag}
  631.      
  632.     {block:Caption}
  633.     <div class="ptext">{Caption}</div>
  634.     {/block:Caption}
  635.     {/block:Photo}
  636.      
  637.     {block:Photoset}
  638.     {Photoset-500}
  639.     {block:Caption}<div class="ptext">{Caption}</div>{/block:Caption}
  640.     {/block:Photoset}
  641.      
  642.     {block:Audio}
  643.     <div class="ptext">
  644.     <div class="playbox"><div class="playbutton">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div></div>
  645.     {block:Caption}{Caption}{/block:Caption}
  646.     </div>
  647.     {/block:Audio}
  648.      
  649.     {block:Video}
  650.     {Video-500}
  651.     {block:Caption}<div class="ptext">{Caption}</div>{/block:Caption}
  652.     {/block:Video}
  653.             </div>
  654.            
  655.         {/block:Posts}
  656.          {block:NoRebloggedFrom}
  657. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  658. {/block:NoRebloggedFrom}
  659. {block:ContentSource}<!-- {SourceURL}
  660. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  661. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  662. {/block:ContentSource}
  663.  
  664.        
  665.         {block:PermalinkPage}
  666.         <div class="pnotes">{block:PostNotes}{PostNotes}{/block:PostNotes}</div>
  667.      {/block:PermalinkPage}
  668.        
  669.     </div>
  670. </div>
  671.    
  672.     </body>
  673. </html>
Advertisement
Add Comment
Please, Sign In to add comment