Sky_Blue

HUH WHUH theme

Jun 21st, 2020 (edited)
1,472
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 50.12 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <head>
  3.  
  4. <!-----
  5.  
  6. HUH WHUH THEME by @puella
  7.  
  8. this theme is for all the confused b*tches out there (have to censor b*tches bc pastebin doesn't like it :/)
  9.  
  10. note: the posts in the preview look wack but i prommy they're actually not when you save
  11.  
  12. revamped 6/28/21
  13.  
  14. ----->
  15.  
  16. {block:ifanimatedrainbowtitle}
  17. <script type="text/javascript">
  18. // <![CDATA[
  19. var speed=100; // speed colours change, 1 second = 1000
  20. var glow=0; // can be set from '0' for no glow, to 10
  21. var raincol=new Array("#ff0000", "#ff5500", "#ffaa00", "#ffff00", "#aaff00", "#55ff00", "#00ff00", "#00ff55", "#00ffaa", "#00ffff", "#00aaff", "#0055ff", "#0000ff", "#5500ff", "#aa00ff", "#ff00ff", "#ff00aa", "#ff0055"); // change the colours if you want to
  22. var alink="/"; // page to link text to (set to ="" for no link)
  23.  
  24. /****************************
  25. *    Rainbow Text Effect    *
  26. *(c)2003-13 mf2fm web-design*
  27. *  http://www.mf2fm.com/rv  *
  28. * DON'T EDIT BELOW THIS BOX *
  29. ****************************/
  30. var rainbow, raintxt, raincnt=0;
  31.  
  32. function addLoadEvent(funky) {
  33.  var oldonload=window.onload;
  34.  if (typeof(oldonload)!='function') window.onload=funky;
  35.  else window.onload=function() {
  36.    if (oldonload) oldonload();
  37.    funky();
  38.  }
  39. }
  40.  
  41. addLoadEvent(regenbogen);
  42.  
  43. function regenbogen() { if (document.getElementById) {
  44.  var i, rainbeau;
  45.  rainbow=document.getElementById("rainbow");
  46.  raintxt=rainbow.firstChild.nodeValue;
  47.  while (rainbow.childNodes.length) rainbow.removeChild(rainbow.childNodes[0]);
  48.  for (i=0; i<raintxt.length; i++) {
  49.    rainbeau=document.createElement("span");
  50.    rainbeau.setAttribute("id", "rain"+i);
  51.    rainbeau.appendChild(document.createTextNode(raintxt.charAt(i)));
  52.    if (alink) {
  53.      rainbeau.style.cursor="pointer";
  54.      rainbeau.onclick=function() { top.location.href=alink; }
  55.    }
  56.    rainbow.appendChild(rainbeau);
  57.  }
  58.  rainbow=setInterval ("raining()", speed);
  59. }}
  60.  
  61. function raining() {
  62.  var i, c;
  63.  for (i=0; i<raintxt.length; i++) {
  64.    c=raincol[(i+raincnt)%raincol.length];
  65.    document.getElementById("rain"+i).style.color=c;
  66.     if (glow) document.getElementById("rain"+i).style.textShadow=c+" 0px 0px "+glow+"px";
  67.  }
  68.  raincnt++;
  69. }
  70. // ]]>
  71. </script>
  72. {/block:ifanimatedrainbowtitle}
  73.  
  74. {block:ifhoverrainbowlinks}
  75. <script type='text/javascript'>
  76. //<![CDATA[
  77. var rate = 50;
  78. if (document.getElementById)
  79. window.onerror=new Function("return true")
  80.  
  81. var objActive; // The object which event occured in
  82. var act = 0; // Flag during the action
  83. var elmH = 0; // Hue
  84. var elmS = 128; // Saturation
  85. var elmV = 255; // Value
  86. var clrOrg; // A color before the change
  87. var TimerID; // Timer ID
  88. if (document.all) {
  89. document.onmouseover = doRainbowAnchor;
  90. document.onmouseout = stopRainbowAnchor;
  91. }
  92. else if (document.getElementById) {
  93. document.captureEvents(Event.MOUSEOVER | Event.MOUSEOUT);
  94. document.onmouseover = Mozilla_doRainbowAnchor;
  95. document.onmouseout = Mozilla_stopRainbowAnchor;
  96. }
  97. function doRainbow(obj)
  98. {
  99. if (act == 0) {
  100. act = 1;
  101. if (obj)
  102. objActive = obj;
  103. else
  104. objActive = event.srcElement;
  105. clrOrg = objActive.style.color;
  106. TimerID = setInterval("ChangeColor()",100);
  107. }
  108. }
  109. function stopRainbow()
  110. {
  111. if (act) {
  112. objActive.style.color = clrOrg;
  113. clearInterval(TimerID);
  114. act = 0;
  115. }
  116. }
  117. function doRainbowAnchor()
  118. {
  119. if (act == 0) {
  120. var obj = event.srcElement;
  121. while (obj.tagName != 'A' && obj.tagName != 'BODY') {
  122. obj = obj.parentElement;
  123. if (obj.tagName == 'A' || obj.tagName == 'BODY')
  124. break;
  125. }
  126. if (obj.tagName == 'A' && obj.href != '') {
  127. objActive = obj;
  128. act = 1;
  129. clrOrg = objActive.style.color;
  130. TimerID = setInterval("ChangeColor()",100);
  131. }
  132. }
  133. }
  134. function stopRainbowAnchor()
  135. {
  136. if (act) {
  137. if (objActive.tagName == 'A') {
  138. objActive.style.color = clrOrg;
  139. clearInterval(TimerID);
  140. act = 0;
  141. }
  142. }
  143. }
  144. function Mozilla_doRainbowAnchor(e)
  145. {
  146. if (act == 0) {
  147. obj = e.target;
  148. while (obj.nodeName != 'A' && obj.nodeName != 'BODY') {
  149. obj = obj.parentNode;
  150. if (obj.nodeName == 'A' || obj.nodeName == 'BODY')
  151. break;
  152. }
  153. if (obj.nodeName == 'A' && obj.href != '') {
  154. objActive = obj;
  155. act = 1;
  156. clrOrg = obj.style.color;
  157. TimerID = setInterval("ChangeColor()",100);
  158. }
  159. }
  160. }
  161. function Mozilla_stopRainbowAnchor(e)
  162. {
  163. if (act) {
  164. if (objActive.nodeName == 'A') {
  165. objActive.style.color = clrOrg;
  166. clearInterval(TimerID);
  167. act = 0;
  168. }
  169. }
  170. }
  171. function ChangeColor()
  172. {
  173. objActive.style.color = makeColor();
  174. }
  175. function makeColor()
  176. {
  177. // Don't you think Color Gamut to look like Rainbow?
  178. // HSVtoRGB
  179. if (elmS == 0) {
  180. elmR = elmV; elmG = elmV; elmB = elmV;
  181. }
  182. else {
  183. t1 = elmV;
  184. t2 = (255 - elmS) * elmV / 255;
  185. t3 = elmH % 60;
  186. t3 = (t1 - t2) * t3 / 60;
  187. if (elmH < 60) {
  188. elmR = t1; elmB = t2; elmG = t2 + t3;
  189. }
  190. else if (elmH < 120) {
  191. elmG = t1; elmB = t2; elmR = t1 - t3;
  192. }
  193. else if (elmH < 180) {
  194. elmG = t1; elmR = t2; elmB = t2 + t3;
  195. }
  196. else if (elmH < 240) {
  197. elmB = t1; elmR = t2; elmG = t1 - t3;
  198. }
  199. else if (elmH < 300) {
  200. elmB = t1; elmG = t2; elmR = t2 + t3;
  201. }
  202. else if (elmH < 360) {
  203. elmR = t1; elmG = t2; elmB = t1 - t3;
  204. }
  205. else {
  206. elmR = 0; elmG = 0; elmB = 0;
  207. }
  208. }
  209. elmR = Math.floor(elmR).toString(16);
  210. elmG = Math.floor(elmG).toString(16);
  211. elmB = Math.floor(elmB).toString(16);
  212. if (elmR.length == 1) elmR = "0" + elmR;
  213. if (elmG.length == 1) elmG = "0" + elmG;
  214. if (elmB.length == 1) elmB = "0" + elmB
  215. elmH = elmH + rate;
  216. if (elmH >= 360)
  217. elmH = 0;
  218. return '#' + elmR + elmG + elmB;
  219. }
  220. //]]>
  221. </script>
  222. {/block:ifhoverrainbowlinks}
  223.  
  224. <meta charset="utf-8">
  225. <meta https-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  226. {block:Description}
  227. <meta name="description" content="{MetaDescription}" />
  228. {/block:Description}
  229.    
  230. <title>{Title}</title>
  231.        
  232. <link rel="shortcut icon" href="{image:favicon}">
  233. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  234. <link rel="stylesheet" href="https://static.tumblr.com/qxrkgx6/RWPmgn2qa/normalize.min.css">
  235.  
  236. <script src="https://static.tumblr.com/qxrkgx6/LuRmgn2rm/modernizr-2.6.2.min.js"></script>
  237.  
  238. {block:ifsmoothscrolling}
  239. <script src="https://cdnjs.cloudflare.com/ajax/libs/smoothscroll/1.4.1/SmoothScroll.min.js"></script>
  240. {/block:ifsmoothscrolling}
  241.  
  242. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  243. <script src="https://static.tumblr.com/rtrqcib/VGGnlh8rf/jquery.style-my-tooltips.min.js"></script>
  244. <script>(function($){$(document).ready(function(){$("a[title]").style_my_tooltips({tip_follows_cursor:true,tip_delay_time:0,tip_fade_speed:0,attribute:"title"});});})(jQuery);</script>
  245.  
  246. <link href="https://fonts.googleapis.com/css?family=Kosugi+Maru|Short+Stack" rel="stylesheet">
  247.        
  248. <meta name="image:favicon" content=""/>
  249. <meta name="image:icon" content=""/>
  250. <meta name="image:background" content=""/>
  251. <meta name="image:inner post background" content=""/>
  252. <meta name="image:outer post background" content=""/>
  253. <meta name="image:inner sidebar background" content=""/>
  254. <meta name="image:outer sidebar background" content=""/>
  255. <meta name="image:footer background" content=""/>
  256. <meta name="image:pixel link 1" content=""/>
  257. <meta name="image:pixel link 2" content=""/>
  258. <meta name="image:pixel link 3" content=""/>
  259. <meta name="image:footer pixel" content=""/>
  260.  
  261. <meta name="color:background" content=""/>
  262. <meta name="color:footer background" content=""/>
  263. <meta name="color:inner post background" content=""/>
  264. <meta name="color:outer post background" content=""/>
  265. <meta name="color:inner sidebar background" content=""/>
  266. <meta name="color:outer sidebar background" content=""/>
  267. <meta name="color:inner border color" content=""/>
  268. <meta name="color:outer border color" content=""/>
  269. <meta name="color:gradient one" content=""/>
  270. <meta name="color:gradient two" content=""/>
  271. <meta name="color:text" content=""/>
  272. <meta name="color:title" content=""/>
  273. <meta name="color:title hover" content=""/>
  274. <meta name="color:title glow" content=""/>
  275. <meta name="color:title glow hover" content=""/>
  276. <meta name="color:title outline" content=""/>
  277. <meta name="color:title outline hover" content=""/>
  278. <meta name="color:links" content=""/>
  279. <meta name="color:links hover" content=""/>
  280. <meta name="color:links glow" content=""/>
  281. <meta name="color:links glow hover" content=""/>
  282. <meta name="color:links outline" content=""/>
  283. <meta name="color:links outline hover" content=""/>
  284. <meta name="color:box shadow" content=""/>
  285. <meta name="color:selection background" content=""/>
  286. <meta name="color:selection text" content=""/>
  287.  
  288. <meta name="if:scrolling desc" content=""/>
  289. <meta name="if:hover rainbow links" content=""/>
  290. <meta name="if:smooth scrolling" content="1"/>
  291. <meta name="if:redirect" content=""/>
  292. <meta name="if:animated rainbow title" content=""/>
  293. <meta name="if:static rainbow title" content=""/>
  294. <meta name="if:rainbow links" content=""/>
  295. <meta name="if:gradient links" content=""/>
  296. <meta name="if:gradient title" content=""/>
  297. <meta name="if:title glow" content=""/>
  298. <meta name="if:title outline" content=""/>
  299. <meta name="if:links glow" content=""/>
  300. <meta name="if:links outline" content=""/>
  301. <meta name="if:hover blur" content=""/>
  302. <meta name="if:captions" content=""/>
  303. <meta name="if:inner rainbow border" content=""/>
  304. <meta name="if:outer rainbow border" content=""/>
  305. <meta name="if:inner gradient border" content=""/>
  306. <meta name="if:outer gradient border" content=""/>
  307. <meta name="if:round borders" content=""/>
  308. <meta name="if:box shadow" content=""/>
  309. <meta name="if:grayscale icon" content=""/>
  310. <meta name="if:background cover" content=""/>
  311. <meta name="if:tags" content=""/>
  312. <meta name="if:inner post background cover" content=""/>
  313. <meta name="if:outer post background cover" content=""/>
  314. <meta name="if:inner sidebar background cover" content=""/>
  315. <meta name="if:outer sidebar background cover" content=""/>
  316. <meta name="if:fade in out" content="1"/>
  317.  
  318.  
  319. <meta name="select:outer border style" content="solid"/>
  320. <meta name="select:outer border style" content="dashed"/>
  321. <meta name="select:outer border style" content="dotted"/>
  322. <meta name="select:outer border style" content="double"/>
  323. <meta name="select:outer border style" content="inset"/>
  324. <meta name="select:outer border style" content="outset"/>
  325. <meta name="select:outer border style" content="groove"/>
  326. <meta name="select:outer border style" content="ridge"/>
  327. <meta name="select:inner border style" content="solid"/>
  328. <meta name="select:inner border style" content="dashed"/>
  329. <meta name="select:inner border style" content="dotted"/>
  330. <meta name="select:inner border style" content="double"/>
  331. <meta name="select:inner border style" content="inset"/>
  332. <meta name="select:inner border style" content="outset"/>
  333. <meta name="select:inner border style" content="groove"/>
  334. <meta name="select:inner border style" content="ridge"/>
  335.  
  336. <meta name="text:font size" content="30"/>
  337. <meta name="text:font" content=""/>
  338. <meta name="text:title size" content="50"/>
  339. <meta name="text:title" content=""/>
  340. <meta name="text:title font" content=""/>
  341. <meta name="text:description" content=""/>
  342. <meta name="text:description speed" content="10"/>
  343. <meta name="text:inner border width" content="3"/>
  344. <meta name="text:outer border width" content="3"/>
  345. <meta name="text:link 1" content=""/>
  346. <meta name="text:link 1 url" content=""/>
  347. <meta name="text:link 2" content=""/>
  348. <meta name="text:link 2 url" content=""/>
  349. <meta name="text:link 3" content=""/>
  350. <meta name="text:link 3 url" content=""/>
  351. <meta name="text:sidebar icon hover" content="hello :)"/>
  352. <meta name="text:next" content="→"/>
  353. <meta name="text:previous" content="←"/>
  354. <meta name="text:redirect" content=""/>        
  355.        
  356. <style type="text/css">
  357.  
  358. ::selection {
  359. background: {color:selection background};
  360. color:{color:selection text};
  361. }
  362.  
  363. ::-moz-selection {
  364. background: {color:selection background};
  365. color:{color:selection text};
  366. }
  367.  
  368. ::-webkit-scrollbar {
  369. width: 16px;
  370. height: 10px;
  371. }
  372.  
  373. ::-webkit-scrollbar-thumb {
  374. background-color: #fff;
  375. background-image: url(https://i.imgur.com/Qtm9Z60.png);
  376. border-top: 1px solid #bdbdbd;
  377. border-left: 1px solid #bdbdbd;
  378. border-right: 1px solid black;
  379. border-bottom: 1px solid black;
  380. }
  381.  
  382. ::-webkit-scrollbar-track {
  383. background-color: #fff;
  384. background-image: url(https://i.imgur.com/IGXGYKz.png);
  385. }
  386.  
  387. ::-webkit-scrollbar-button:vertical:increment {
  388. background-image: url(https://i.imgur.com/WhC8iy3.png);
  389. width: 14px;
  390. height: 16px;
  391. border-top: 1px solid #bdbdbd;
  392. border-left: 1px solid #bdbdbd;
  393. border-right: 1px solid black;
  394. border-bottom: 1px solid black;
  395. }
  396.  
  397. ::-webkit-scrollbar-button:vertical:decrement {
  398. background-image: url(https://i.imgur.com/fQ18mrR.png);
  399. border-top: 1px solid #bdbdbd;
  400. border-left: 1px solid #bdbdbd;
  401. border-right: 1px solid black;
  402. border-bottom: 1px solid black;
  403. width: 14px;
  404. height: 16px;
  405. }
  406.  
  407. #s-m-t-tooltip {
  408.     z-index:99999999999999999;
  409.     background: {color:inner sidebar background};
  410.     max-width: 300px;
  411.     margin: 20px;
  412.     padding: 5px;
  413.     color:{color:text};
  414.     border:{text:outer border width}px {select:outer border style} {color:outer border color};
  415.     {block:ifroundborders}
  416.     border-radius:5px;
  417.     {/block:ifroundborders}
  418.    
  419.     {block:ifouterrainbowborder}
  420.     border: {text:outer border width}px {select:outer border style} transparent;
  421.     border-image: linear-gradient(to top left, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  422.     border-image-slice: 1;
  423.     {block:ifroundborders}
  424.     border-radius:5px;
  425.     background-image:url(https://i.imgur.com/GK9LBut.gif), url();
  426.     {/block:ifroundborders}
  427.     {/block:ifouterrainbowborder}
  428.    
  429.     {block:ifoutergradientborder}
  430.     border: {text:outer border width}px {select:outer border style} transparent;
  431.     border-image: linear-gradient(to bottom right, {color:gradient one} 0%, {color:gradient two} 100%);
  432.     border-image-slice: 1;
  433.     {block:ifroundborders}
  434.     border-radius:5px;
  435.     background-image:url(https://i.imgur.com/GK9LBut.gif), url();
  436.     {/block:ifroundborders}
  437.     {/block:ifoutergradientborder}
  438. }
  439.  
  440. body {
  441.     margin:0px;
  442.     background:{color:background};
  443.     background-image: url('{image:background}');
  444.     {block:ifbackgroundcover}
  445.     background-size: cover;
  446.     {/block:ifbackgroundcover}
  447.     {block:ifnotbackgroundcover}
  448.     background-repeat:repeat;
  449.     {/block:ifnotbackgroundcover}
  450.     background-attachment:fixed;
  451.     font-family:{text:font};
  452.     font-size:{text:font size}px;
  453.     color:{color:text};
  454. }
  455.  
  456. p{
  457.     margin:0 0 0px 0;
  458.     padding:0;
  459. }
  460.  
  461. pre {
  462.     white-space: pre-wrap;
  463.     white-space: -moz-pre-wrap;
  464.     white-space: -pre-wrap;
  465.     white-space: -o-pre-wrap;
  466.     word-wrap: break-word;
  467. }
  468.  
  469. a{
  470.     text-decoration:none;
  471.     color:{color:links};
  472.     {block:ifnotrainbowlinks}
  473.     {block:ifnotgradientlinks}
  474.     color:{color:links};
  475.     {block:iflinksglow}
  476.     text-shadow:0 0 2px {color:links glow},0 0 2px {color:links glow},0 0 2px {color:links glow}, 0 0 1px {color:links glow};
  477.     {/block:iflinksglow}
  478.     {block:iflinksoutline}
  479.     text-shadow: -1px 0 {color:links outline}, 0 1px {color:links outline}, 1px 0 {color:links outline}, 0 -1px {color:links outline};
  480.     {/block:iflinksoutline}
  481.     transition:0.5s;
  482.     {/block:ifnotgradientlinks}
  483.     {/block:ifnotrainbowlinks}
  484.    
  485.     {block:ifrainbowlinks}
  486.     background-image: linear-gradient(to left, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  487.     -webkit-background-clip:text;
  488.     color:transparent;
  489.     {/block:ifrainbowlinks}
  490.    
  491.     {block:ifgradientlinks}
  492.     background-image: linear-gradient(to right, {color:gradient one} 0%, {color:gradient two} 100%);
  493.     -webkit-background-clip:text;
  494.     color:transparent;
  495.     {/block:ifgradientlinks}
  496.    
  497.     transition:0.5s;
  498. }
  499.  
  500. a:hover{
  501.     {block:ifnotrainbowlinks}
  502.     {block:ifnotgradientlinks}
  503.     color:{color:links hover};
  504.     {block:iflinksglow}
  505.     text-shadow:0 0 2px {color:links glow hover},0 0 2px {color:links glow hover},0 0 2px {color:links glow hover},0 0 1px {color:links glow hover};
  506.     {/block:iflinksglow}
  507.     {block:iflinksoutline}
  508.     text-shadow: -1px 0 {color:links outline hover}, 0 1px {color:links outline hover}, 1px 0 {color:links outline hover}, 0 -1px           {color:links outline hover};
  509.     {/block:iflinksoutline}
  510.     {block:ifnothoverrainbowlinks}
  511.     transition:0.5s;
  512.     {/block:ifnothoverrainbowlinks}
  513.     {/block:ifnotgradientlinks}
  514.     {/block:ifnotrainbowlinks}
  515.     {block:ifhoverblur}
  516.     -webkit-filter: blur(.9px);
  517.     {/block:ifhoverblur}
  518.     cursor:help;
  519.     {block:ifnotrainbowlinks}
  520.     {block:ifnotgradientlinks}
  521.     transition:0.5s;
  522.     {/block:ifnotgradientlinks}
  523.     {/block:ifnotrainbowlinks}
  524.     transition:0.5s;
  525. }
  526.  
  527. a.tumblr_blog{
  528.     display:inline-block;
  529.     margin-bottom:5px;
  530.     z-index:100;
  531.     position:relative;
  532. }
  533.  
  534. li{
  535.     margin-left:-15px;
  536. }
  537.  
  538. #wrapper{
  539.     width:980px;
  540.     margin:20px auto;
  541.     {block:iffadeinout}
  542.     animation: fadeEffect 1s;
  543.     {block:iffadeinout}
  544. }
  545.  
  546. @keyframes fadeEffect {
  547.   from {opacity: 0;}
  548.   to {opacity: 1;}
  549. }
  550.  
  551. #title{
  552.     max-width:290px;
  553.     text-align:center;
  554.     font-size:{text:title size}px;
  555.     font-family:{text:title font};
  556.     z-index:101;
  557.    
  558.     {block:ifstaticrainbowtitle}
  559.     background-image: linear-gradient(to left, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  560.     -webkit-background-clip:text;
  561.     color:transparent;
  562.     {/block:ifstaticrainbowtitle}
  563.    
  564.     {block:ifgradienttitle}
  565.     background-image: linear-gradient(to right, {color:gradient one} 0%, {color:gradient two} 100%);
  566.     -webkit-background-clip:text;
  567.     color:transparent;
  568.     {/block:ifgradienttitle}
  569.    
  570.     {block:ifnotstaticrainbowtitle}
  571.     {block:ifnotanimatedrainbowtitle}
  572.     {block:ifnotgradienttitle}
  573.     color:{color:title};
  574.     {block:iftitleglow}
  575.     text-shadow:0 0 2px {color:title glow},0 0 2px {color:title glow},0 0 2px {color:title glow}, 0 0 1px {color:title glow};
  576.     {/block:iftitleglow}
  577.     {block:iftitleoutline}
  578.     text-shadow: -1px 0 {color:title outline}, 0 1px {color:title outline}, 1px 0 {color:title outline}, 0 -1px {color:title outline};
  579.     {/block:iftitleoutline}
  580.     {/block:ifnotgradienttitle}
  581.     {/block:ifnotanimatedrainbowtitle}
  582.     {/block:ifnotstaticrainbowtitle}
  583. }
  584.  
  585. #title a{
  586.     {block:ifnotstaticrainbowtitle}
  587.     {block:ifnotanimatedrainbowtitle}
  588.     {block:ifnotgradienttitle}
  589.     color:{color:title};
  590.     {block:iftitleglow}
  591.     text-shadow:0 0 2px {color:title glow},0 0 2px {color:title glow},0 0 2px {color:title glow}, 0 0 1px {color:title glow};
  592.     {/block:iftitleglow}
  593.     {block:iftitleoutline}
  594.     text-shadow: -1px 0 {color:title outline}, 0 1px {color:title outline}, 1px 0 {color:title outline}, 0 -1px {color:title outline};
  595.     {/block:iftitleoutline}
  596.     {/block:ifnotgradienttitle}
  597.     {/block:ifnotanimatedrainbowtitle}
  598.     {/block:ifnotstaticrainbowtitle}
  599. }
  600.  
  601. #title a:hover{
  602.     {block:ifnotstaticrainbowtitle}
  603.     {block:ifnotanimatedrainbowtitle}
  604.     {block:ifnotgradienttitle}
  605.     color:{color:title hover};
  606.     {block:iftitleglow}
  607.     text-shadow:0 0 2px {color:title glow hover},0 0 2px {color:title glow hover},0 0 2px {color:title glow hover},0 0 1px {color:title glow hover};
  608.     {/block:iftitleglow}
  609.     {block:iftitleoutline}
  610.     text-shadow: -1px 0 {color:title outline hover}, 0 1px {color:title outline hover}, 1px 0 {color:title outline hover}, 0 -1px {color:title outline hover};
  611.     {/block:iftitleoutline}
  612.     {block:ifnothoverrainbowlinks}
  613.     transition:0.5s;
  614.     {/block:ifnothoverrainbowlinks}
  615.     {/block:ifnotgradienttitle}
  616.     {/block:ifnotanimatedrainbowtitle}
  617.     {/block:ifnotstaticrainbowtitle}
  618.     {block:ifhoverblur}
  619.     -webkit-filter: blur(.9px);
  620.     {/block:ifhoverblur}
  621.     cursor:help;
  622. }
  623.  
  624. #sidebarwrapper{
  625.     position:fixed;
  626.     display: flex;
  627.     flex-direction: column;
  628.     justify-content:center;
  629.     align-items: center;
  630.     gap:20px;
  631.     height:fit-content;
  632.     height:-moz-fit-content;
  633.     top: 0;
  634.     bottom: 0;
  635.     margin: auto;
  636. }
  637.  
  638. #sidebar{
  639.     width:200px;
  640.     text-align:center;
  641.     padding:20px;
  642.     {block:ifroundborders}
  643.     border-radius:5px;
  644.     {/block:ifroundborders}
  645.     border: {text:inner border width}px {select:inner border style} {color:inner border color};
  646.    
  647.     {block:ifinnerrainbowborder}
  648.     border-image: linear-gradient(to top left, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  649.     border-image-slice: 1;
  650.     {block:ifroundborders}
  651.     border-radius:5px;
  652.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:inner sidebar background});
  653.     background-attachment: fixed;
  654.     {/block:ifroundborders}
  655.     {block:ifnotroundborders}
  656.     background-image: url('{image:inner sidebar background}');
  657.     {/block:ifnotroundborders}
  658.     background-color:{color:inner sidebar background};
  659.     {block:ifinnersidebarbackgroundcover}
  660.     background-size: cover;
  661.     {/block:ifinnersidebarbackgroundcover}
  662.     {block:ifnotinnersidebarbackgroundcover}
  663.     background-repeat:repeat;
  664.     {/block:ifnotinnersidebarbackgroundcover}
  665.     background-attachment:fixed;
  666.     {/block:ifinnerrainbowborder}
  667.    
  668.     {block:ifinnergradientborder}
  669.     border-image: linear-gradient(to bottom right, {color:gradient one} 0%, {color:gradient two} 100%);
  670.     border-image-slice: 1;
  671.     {block:ifroundborders}
  672.     border-radius:5px;
  673.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:inner sidebar background});
  674.     background-attachment: fixed;
  675.     {/block:ifroundborders}
  676.     {block:ifnotroundborders}
  677.     background-image: url('{image:inner sidebar background}');
  678.     {/block:ifnotroundborders}
  679.     background-color:{color:inner sidebar background};
  680.     {block:ifinnersidebarbackgroundcover}
  681.     background-size: cover;
  682.     {/block:ifinnersidebarbackgroundcover}
  683.     {block:ifnotinnersidebarbackgroundcover}
  684.     background-repeat:repeat;
  685.     {/block:ifnotinnersidebarbackgroundcover}
  686.     background-attachment:fixed;
  687.     {/block:ifinnergradientborder}
  688.    
  689.     {block:ifnotinnerrainbowborder}
  690.     {block:ifnotinnergradientborder}
  691.     background-color:{color:inner sidebar background};
  692.     background-image: url('{image:inner sidebar background}');
  693.     {block:ifinnersidebarbackgroundcover}
  694.     background-size: cover;
  695.     {/block:ifinnersidebarbackgroundcover}
  696.     {block:ifnotinnersidebarbackgroundcover}
  697.     background-repeat:repeat;
  698.     {/block:ifnotinnersidebarbackgroundcover}
  699.     background-attachment:fixed;
  700.     {/block:ifnotinnergradientborder}
  701.     {/block:ifnotinnerrainbowborder}
  702.    
  703. }
  704.  
  705. #sidebarback{
  706.     padding:20px;
  707.     {block:ifroundborders}
  708.     border-radius:5px;
  709.     {/block:ifroundborders}
  710.     border: {text:outer border width}px {select:outer border style} {color:outer border color};
  711.     text-align:center;
  712.    
  713.     {block:ifouterrainbowborder}
  714.     border-image: linear-gradient(to top left, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  715.     border-image-slice: 1;
  716.     {block:ifroundborders}
  717.     border-radius:5px;
  718.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:outer sidebar background});
  719.     background-attachment: fixed;
  720.     {/block:ifroundborders}
  721.     {block:ifnotroundborders}
  722.     background-image: url('{image:outer sidebar background}');
  723.     {/block:ifnotroundborders}
  724.     background-color:{color:outer sidebar background};
  725.     {block:ifoutersidebarbackgroundcover}
  726.     background-size: cover;
  727.     {/block:ifoutersidebarbackgroundcover}
  728.     {block:ifnotoutersidebarbackgroundcover}
  729.     background-repeat:repeat;
  730.     {/block:ifnotoutersidebarbackgroundcover}
  731.     background-attachment:fixed;
  732.     {/block:ifouterrainbowborder}
  733.    
  734.     {block:ifoutergradientborder}
  735.     border-image: linear-gradient(to bottom right, {color:gradient one} 0%, {color:gradient two} 100%);
  736.     border-image-slice: 1;
  737.     {block:ifroundborders}
  738.     border-radius:5px;
  739.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:outer sidebar background});
  740.     background-attachment: fixed;
  741.     {/block:ifroundborders}
  742.     {block:ifnotroundborders}
  743.     background-image: url('{image:outer sidebar background}');
  744.     {/block:ifnotroundborders}
  745.     background-color:{color:outer sidebar background};
  746.     {block:ifoutersidebarbackgroundcover}
  747.     background-size: cover;
  748.     {/block:ifoutersidebarbackgroundcover}
  749.     {block:ifnotoutersidebarbackgroundcover}
  750.     background-repeat:repeat;
  751.     {/block:ifnotoutersidebarbackgroundcover}
  752.     background-attachment:fixed;
  753.     {/block:ifoutergradientborder}
  754.    
  755.     {block:ifnotouterrainbowborder}
  756.     {block:ifnotoutergradientborder}
  757.     background-color:{color:outer sidebar background};
  758.     background-image: url('{image:outer sidebar background}');
  759.     {block:ifoutersidebarbackgroundcover}
  760.     background-size: cover;
  761.     {/block:ifoutersidebarbackgroundcover}
  762.     {block:ifnotoutersidebarbackgroundcover}
  763.     background-repeat:repeat;
  764.     {/block:ifnotoutersidebarbackgroundcover}
  765.     background-attachment:fixed;
  766.     {/block:ifnotoutergradientborder}
  767.     {/block:ifnotouterrainbowborder}
  768.  
  769.     {block:ifboxshadow}
  770.     box-shadow: 10px 10px rgb({RGBcolor:box shadow}, .3);
  771.     {/block:ifboxshadow}
  772. }
  773.  
  774. #sidebar img{
  775.     width:200px;
  776.     height:200px;
  777.     box-sizing: border-box;
  778.     {block:ifroundborders}
  779.     border-radius:5px;
  780.     {/block:ifroundborders}
  781.     {block:ifgrayscaleicon}
  782.     filter: grayscale(100%);
  783.     {/block:ifgrayscaleicon}
  784.     z-index:100;
  785.     margin-bottom:-5px;
  786. }
  787.  
  788. #description{
  789.     width:200px;
  790.     text-align:center;
  791.     padding:20px;
  792.     {block:ifroundborders}
  793.     border-radius:5px;
  794.     {/block:ifroundborders}
  795.     border: {text:inner border width}px {select:inner border style} {color:inner border color};
  796.    
  797.     {block:ifinnerrainbowborder}
  798.     border-image: linear-gradient(to top left, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  799.     border-image-slice: 1;
  800.     {block:ifroundborders}
  801.     border-radius:5px;
  802.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:inner sidebar background});
  803.     background-attachment: fixed;
  804.     {/block:ifroundborders}
  805.     {block:ifnotroundborders}
  806.     background-image: url('{image:inner sidebar background}');
  807.     {/block:ifnotroundborders}
  808.     background-color:{color:inner sidebar background};
  809.     {block:ifinnersidebarbackgroundcover}
  810.     background-size: cover;
  811.     {/block:ifinnersidebarbackgroundcover}
  812.     {block:ifnotinnersidebarbackgroundcover}
  813.     background-repeat:repeat;
  814.     {/block:ifnotinnersidebarbackgroundcover}
  815.     background-attachment:fixed;
  816.     {/block:ifinnerrainbowborder}
  817.    
  818.     {block:ifinnergradientborder}
  819.     border-image: linear-gradient(to bottom right, {color:gradient one} 0%, {color:gradient two} 100%);
  820.     border-image-slice: 1;
  821.     {block:ifroundborders}
  822.     border-radius:5px;
  823.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:inner sidebar background});
  824.     background-attachment: fixed;
  825.     {/block:ifroundborders}
  826.     {block:ifnotroundborders}
  827.     background-image: url('{image:inner sidebar background}');
  828.     {/block:ifnotroundborders}
  829.     background-color:{color:inner sidebar background};
  830.     {block:ifinnersidebarbackgroundcover}
  831.     background-size: cover;
  832.     {/block:ifinnersidebarbackgroundcover}
  833.     {block:ifnotinnersidebarbackgroundcover}
  834.     background-repeat:repeat;
  835.     {/block:ifnotinnersidebarbackgroundcover}
  836.     background-attachment:fixed;
  837.     {/block:ifinnergradientborder}
  838.    
  839.     {block:ifnotinnerrainbowborder}
  840.     {block:ifnotinnergradientborder}
  841.     background-color:{color:inner sidebar background};
  842.     background-image: url('{image:inner sidebar background}');
  843.     {block:ifinnersidebarbackgroundcover}
  844.     background-size: cover;
  845.     {/block:ifinnersidebarbackgroundcover}
  846.     {block:ifnotinnersidebarbackgroundcover}
  847.     background-repeat:repeat;
  848.     {/block:ifnotinnersidebarbackgroundcover}
  849.     background-attachment:fixed;
  850.     {/block:ifnotinnergradientborder}
  851.     {/block:ifnotinnerrainbowborder}
  852.  
  853. }
  854.  
  855. #descriptionback{
  856.     padding:20px;
  857.     text-align:center;
  858.     {block:ifroundborders}
  859.     border-radius:5px;
  860.     {/block:ifroundborders}
  861.     border: {text:outer border width}px {select:outer border style} {color:outer border color};
  862.     text-align:center;
  863.    
  864.     {block:ifouterrainbowborder}
  865.     border-image: linear-gradient(to top left, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  866.     border-image-slice: 1;
  867.     {block:ifroundborders}
  868.     border-radius:5px;
  869.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:outer sidebar background});
  870.     background-attachment: fixed;
  871.     {/block:ifroundborders}
  872.     {block:ifnotroundborders}
  873.     background-image: url('{image:outer sidebar background}');
  874.     {/block:ifnotroundborders}
  875.     background-color:{color:outer sidebar background};
  876.     {block:ifoutersidebarbackgroundcover}
  877.     background-size: cover;
  878.     {/block:ifoutersidebarbackgroundcover}
  879.     {block:ifnotoutersidebarbackgroundcover}
  880.     background-repeat:repeat;
  881.     {/block:ifnotoutersidebarbackgroundcover}
  882.     background-attachment:fixed;
  883.     {/block:ifouterrainbowborder}
  884.    
  885.     {block:ifoutergradientborder}
  886.     border-image: linear-gradient(to bottom right, {color:gradient one} 0%, {color:gradient two} 100%);
  887.     border-image-slice: 1;
  888.     {block:ifroundborders}
  889.     border-radius:5px;
  890.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:outer sidebar background});
  891.     background-attachment: fixed;
  892.     {/block:ifroundborders}
  893.     {block:ifnotroundborders}
  894.     background-image: url('{image:outer sidebar background}');
  895.     {/block:ifnotroundborders}
  896.     background-color:{color:outer sidebar background};
  897.     {block:ifoutersidebarbackgroundcover}
  898.     background-size: cover;
  899.     {/block:ifoutersidebarbackgroundcover}
  900.     {block:ifnotoutersidebarbackgroundcover}
  901.     background-repeat:repeat;
  902.     {/block:ifnotoutersidebarbackgroundcover}
  903.     background-attachment:fixed;
  904.     {/block:ifoutergradientborder}
  905.    
  906.     {block:ifnotouterrainbowborder}
  907.     {block:ifnotoutergradientborder}
  908.     background-color:{color:outer sidebar background};
  909.     background-image: url('{image:outer sidebar background}');
  910.     {block:ifoutersidebarbackgroundcover}
  911.     background-size: cover;
  912.     {/block:ifoutersidebarbackgroundcover}
  913.     {block:ifnotoutersidebarbackgroundcover}
  914.     background-repeat:repeat;
  915.     {/block:ifnotoutersidebarbackgroundcover}
  916.     background-attachment:fixed;
  917.     {/block:ifnotoutergradientborder}
  918.     {/block:ifnotouterrainbowborder}
  919.  
  920.     {block:ifboxshadow}
  921.     box-shadow: 10px 10px rgb({RGBcolor:box shadow}, .3);
  922.     {/block:ifboxshadow}
  923.  
  924. }
  925.  
  926. #links{
  927.     text-align:center;
  928.     line-height:200%;
  929. }
  930.  
  931. #content{
  932.     float:right;
  933.     width:fit-content;
  934.     width:-moz-fit-content;
  935.     padding-bottom:50px;
  936. }
  937.  
  938. .post{
  939.     width:450px;
  940.     padding:20px;
  941.     {block:ifroundborders}
  942.     border-radius:5px;
  943.     {/block:ifroundborders}
  944.     border: {text:inner border width}px {select:inner border style} {color:inner border color};
  945.    
  946.     {block:ifinnerrainbowborder}
  947.     border-image: linear-gradient(to top left, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  948.     border-image-slice: 1;
  949.     {block:ifroundborders}
  950.     border-radius:5px;
  951.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:inner post background});
  952.     background-attachment: fixed;
  953.     {/block:ifroundborders}
  954.     {block:ifnotroundborders}
  955.     background-image: url('{image:inner post background}');
  956.     {/block:ifnotroundborders}
  957.     background-color:{color:inner post background};
  958.     {block:ifinnerpostbackgroundcover}
  959.     background-size: cover;
  960.     {/block:ifinnerpostbackgroundcover}
  961.     {block:ifnotinnerpostbackgroundcover}
  962.     background-repeat:repeat;
  963.     {/block:ifnotinnerpostbackgroundcover}
  964.     background-attachment:fixed;
  965.     {/block:ifinnerrainbowborder}
  966.    
  967.     {block:ifinnergradientborder}
  968.     border-image: linear-gradient(to bottom right, {color:gradient one} 0%, {color:gradient two} 100%);
  969.     border-image-slice: 1;
  970.     {block:ifroundborders}
  971.     border-radius:5px;
  972.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:inner post background});
  973.     background-attachment: fixed;
  974.     {/block:ifroundborders}
  975.     {block:ifnotroundborders}
  976.     background-image: url('{image:inner post background}');
  977.     {/block:ifnotroundborders}
  978.     background-color:{color:inner post background};
  979.     {block:ifinnerpostbackgroundcover}
  980.     background-size: cover;
  981.     {/block:ifinnerpostbackgroundcover}
  982.     {block:ifnotinnerpostbackgroundcover}
  983.     background-repeat:repeat;
  984.     {/block:ifnotinnerpostbackgroundcover}
  985.     background-attachment:fixed;
  986.     {/block:ifinnergradientborder}
  987.    
  988.     {block:ifnotinnerrainbowborder}
  989.     {block:ifnotinnergradientborder}
  990.     background-color:{color:inner post background};
  991.     background-image: url('{image:inner post background}');
  992.     {block:ifinnerpostbackgroundcover}
  993.     background-size: cover;
  994.     {/block:ifinnerpostbackgroundcover}
  995.     {block:ifnotinnerpostbackgroundcover}
  996.     background-repeat:repeat;
  997.     {/block:ifnotinnerpostbackgroundcover}
  998.     background-attachment:fixed;
  999.     {/block:ifnotinnergradientborder}
  1000.     {/block:ifnotinnerrainbowborder}
  1001.    
  1002.     word-wrap:break-word;
  1003. }
  1004.  
  1005. .postback{
  1006.     margin:50px auto;
  1007.     padding:20px;
  1008.     {block:ifroundborders}
  1009.     border-radius:5px;
  1010.     {/block:ifroundborders}
  1011.     border: {text:outer border width}px {select:outer border style} {color:outer border color};
  1012.    
  1013.     {block:ifouterrainbowborder}
  1014.     border-image: linear-gradient(to top left, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  1015.     border-image-slice: 1;
  1016.     {block:ifroundborders}
  1017.     border-radius:5px;
  1018.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:outer post background});
  1019.     background-attachment: fixed;
  1020.     {/block:ifroundborders}
  1021.     {block:ifnotroundborders}
  1022.     background-image: url('{image:outer post background}');
  1023.     {/block:ifnotroundborders}
  1024.     background-color:{color:outer post background};
  1025.     {block:ifouterpostbackgroundcover}
  1026.     background-size: cover;
  1027.     {/block:ifouterpostbackgroundcover}
  1028.     {block:ifnotouterpostbackgroundcover}
  1029.     background-repeat:repeat;
  1030.     {/block:ifnotouterpostbackgroundcover}
  1031.     background-attachment:fixed;
  1032.     {/block:ifouterrainbowborder}
  1033.    
  1034.     {block:ifoutergradientborder}
  1035.     border-image: linear-gradient(to bottom right, {color:gradient one} 0%, {color:gradient two} 100%);
  1036.     border-image-slice: 1;
  1037.     {block:ifroundborders}
  1038.     border-radius:5px;
  1039.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:outer post background});
  1040.     background-attachment: fixed;
  1041.     {/block:ifroundborders}
  1042.     {block:ifnotroundborders}
  1043.     background-image: url('{image:outer post background}');
  1044.     {/block:ifnotroundborders}
  1045.     background-color:{color:outer post background};
  1046.     {block:ifouterpostbackgroundcover}
  1047.     background-size: cover;
  1048.     {/block:ifouterpostbackgroundcover}
  1049.     {block:ifnotouterpostbackgroundcover}
  1050.     background-repeat:repeat;
  1051.     {/block:ifnotouterpostbackgroundcover}
  1052.     background-attachment:fixed;
  1053.     {/block:ifoutergradientborder}
  1054.    
  1055.     {block:ifnotouterrainbowborder}
  1056.     {block:ifnotoutergradientborder}
  1057.     background-color:{color:outer post background};
  1058.     background-image: url('{image:outer post background}');
  1059.     {block:ifouterpostbackgroundcover}
  1060.     background-size: cover;
  1061.     {/block:ifouterpostbackgroundcover}
  1062.     {block:ifnotouterpostbackgroundcover}
  1063.     background-repeat:repeat;
  1064.     {/block:ifnotouterpostbackgroundcover}
  1065.     background-attachment:fixed;
  1066.     {/block:ifnotoutergradientborder}
  1067.     {/block:ifnotouterrainbowborder}
  1068.  
  1069.  
  1070.     {block:ifboxshadow}
  1071.     box-shadow: 10px 10px rgb({RGBcolor:box shadow}, .3);
  1072.     {/block:ifboxshadow}
  1073.  
  1074. }
  1075.  
  1076. .post img{
  1077.     max-width:100%;
  1078.     height:auto;
  1079.     position:relative;
  1080.     z-index:100;
  1081.     {block:ifroundborders}
  1082.     border-radius:5px;
  1083.     {/block:ifroundborders}
  1084. }
  1085.  
  1086. .post img:hover{
  1087.     {block:ifhoverblur}
  1088.     -webkit-filter: blur(.9px);
  1089.     {/block:ifhoverblur}
  1090. }
  1091.  
  1092. .postback .footer{
  1093.     margin-top:20px;
  1094.     text-align:center;
  1095.     padding:10px;
  1096.     {block:ifroundborders}
  1097.     border-radius:5px;
  1098.     {/block:ifroundborders}
  1099.     border: {text:inner border width}px {select:inner border style} {color:inner border color};
  1100.    
  1101.     {block:ifinnerrainbowborder}
  1102. border-image: linear-gradient(to top left, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  1103.     border-image-slice: 1;
  1104.     {block:ifroundborders}
  1105.     border-radius:5px;
  1106.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:footer background});
  1107.     {/block:ifroundborders}
  1108.     {block:ifnotroundborders}
  1109.     background-image: url('{image:footer background}');
  1110.     {/block:ifnotroundborders}
  1111.     background-color:{color:footer background};
  1112.     {/block:ifinnerrainbowborder}
  1113.    
  1114.     {block:ifinnergradientborder}
  1115. border-image: linear-gradient(to bottom right, {color:gradient one} 0%, {color:gradient two} 100%);
  1116.     border-image-slice: 1;
  1117.     {block:ifroundborders}
  1118.     border-radius:5px;
  1119.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:footer background});
  1120.     {/block:ifroundborders}
  1121.     {block:ifnotroundborders}
  1122.     background-image: url('{image:footer background}');
  1123.     {/block:ifnotroundborders}
  1124.     background-color:{color:footer background};
  1125.     {/block:ifinnergradientborder}
  1126.    
  1127.     {block:ifnotinnerrainbowborder}
  1128.     {block:ifnotinnergradientborder}
  1129.     background-color:{color:footer background};
  1130.     background-image: url('{image:footer background}');
  1131.     {/block:ifnotinnergradientborder}
  1132.     {/block:ifnotinnerrainbowborder}
  1133. }
  1134.  
  1135. #nav{
  1136.     /* if ur reading this then u r gay lol */
  1137. }
  1138.  
  1139. video{
  1140.     max-width:100%;
  1141.     height:auto!important;
  1142. }
  1143.  
  1144. .video-container {
  1145.     overflow: hidden;
  1146. }
  1147.        
  1148. .video-container iframe,
  1149. .video-container object,
  1150. .video-container embed {
  1151.     position: center;
  1152.     max-width: 450px;
  1153.     max-height: 450px;
  1154. }
  1155.        
  1156. .video-wrapper {
  1157.     max-width: 450px;
  1158.     max-height: 450px;
  1159.  
  1160. }
  1161.  
  1162. .media{
  1163.     margin:0 0 -5px 0;
  1164.     text-align:center;
  1165.     position:relative;
  1166. }
  1167.  
  1168. .media:hover{
  1169.     {block:ifhoverblur}
  1170.     -webkit-filter: blur(.9px);
  1171.     {/block:ifhoverblur}
  1172. }
  1173.  
  1174. .title{
  1175.     font-size:{text:title size}px;
  1176.     font-weight:bold;
  1177.     margin:10px 0 10px 0;
  1178.     color:{color:text};
  1179. }
  1180.  
  1181. h1, h2, h3, h4, h5, h6{
  1182.     font-size:{text:title size};
  1183.     font-weight:bold;
  1184.     margin:10px 0 10px 0;
  1185.     color:{color:text};
  1186. }
  1187.  
  1188. .quote{
  1189.     font-weight:normal;
  1190.     font-size:{text:font size};
  1191.     font-style:italic;
  1192.     margin:0 0 10px 0;
  1193. }
  1194.  
  1195. .question{
  1196.     margin-bottom:10px;
  1197. }
  1198.  
  1199. .caption{
  1200.     margin-top:15px;
  1201.     z-index:100;
  1202.     position:relative;
  1203. }
  1204.  
  1205. .postnotes{
  1206.     width:450px;
  1207.     margin-top:20px;
  1208.     padding:20px;
  1209.     {block:ifroundborders}
  1210.     border-radius:5px;
  1211.     {/block:ifroundborders}
  1212.     border: {text:inner border width}px {select:inner border style} {color:inner border color};
  1213.    
  1214.     {block:ifinnerrainbowborder}
  1215. border-image: linear-gradient(to top left, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  1216.     border-image-slice: 1;
  1217.     {block:ifroundborders}
  1218.     border-radius:5px;
  1219.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:footer background});
  1220.     {/block:ifroundborders}
  1221.     {block:ifnotroundborders}
  1222.     background-image: url('{image:footer background}');
  1223.     {/block:ifnotroundborders}
  1224.     background-color:{color:footer background};
  1225.     {/block:ifinnerrainbowborder}
  1226.    
  1227.     {block:ifinnergradientborder}
  1228. border-image: linear-gradient(to bottom right, {color:gradient one} 0%, {color:gradient two} 100%);
  1229.     border-image-slice: 1;
  1230.     {block:ifroundborders}
  1231.     border-radius:5px;
  1232.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:footer background});
  1233.     {/block:ifroundborders}
  1234.     {block:ifnotroundborders}
  1235.     background-image: url('{image:footer background}');
  1236.     {/block:ifnotroundborders}
  1237.     background-color:{color:footer background};
  1238.     {/block:ifinnergradientborder}
  1239.    
  1240.     {block:ifnotinnerrainbowborder}
  1241.     {block:ifnotinnergradientborder}
  1242.     background-color:{color:footer background};
  1243.     background-image: url('{image:footer background}');
  1244.     {/block:ifnotinnergradientborder}
  1245.     {/block:ifnotinnerrainbowborder}
  1246. }
  1247.  
  1248. blockquote{
  1249.     margin:0px 0 10px 10px;
  1250.     padding:0 0 0 10px;
  1251.     border-radius:5px;
  1252.     border-left:dotted 0.5px {color:text};
  1253. }
  1254.  
  1255. blockquote img{
  1256.     {block:ifroundborders}
  1257.     border-radius:5px
  1258.     {/block:ifroundborders}
  1259. }
  1260.  
  1261. ol.notes{
  1262.     list-style-type:none;
  1263.     padding:0;
  1264.     margin:0;
  1265. }
  1266.  
  1267. ol.notes li.note img{
  1268.     width:16px;
  1269.     height:16px;
  1270.     margin-right:3px;
  1271. }
  1272.  
  1273. ol.notes li.note{
  1274.     margin:0px;
  1275. }
  1276.  
  1277. {block:iftags}
  1278. .tags {
  1279.     max-height:0px;
  1280.     max-width:470px;
  1281.     text-align:center;
  1282.     opacity:0;
  1283.     {block:ifroundborders}
  1284.     border-radius:5px;
  1285.     {/block:ifroundborders}
  1286.     border: {text:inner border width}px {select:inner border style} {color:inner border color};
  1287.    
  1288.     {block:ifinnerrainbowborder}
  1289. border-image: linear-gradient(to top left, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  1290.     border-image-slice: 1;
  1291.     {block:ifroundborders}
  1292.     border-radius:5px;
  1293.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:footer background});
  1294.     {/block:ifroundborders}
  1295.     {block:ifnotroundborders}
  1296.     background-image: url('{image:footer background}');
  1297.     {/block:ifnotroundborders}
  1298.     background-color:{color:footer background};
  1299.     {/block:ifinnerrainbowborder}
  1300.    
  1301.     {block:ifinnergradientborder}
  1302. border-image: linear-gradient(to bottom right, {color:gradient one} 0%, {color:gradient two} 100%);
  1303.     border-image-slice: 1;
  1304.     {block:ifroundborders}
  1305.     border-radius:5px;
  1306.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:footer background});
  1307.     {/block:ifroundborders}
  1308.     {block:ifnotroundborders}
  1309.     background-image: url('{image:footer background}');
  1310.     {/block:ifnotroundborders}
  1311.     background-color:{color:footer background};
  1312.     {/block:ifinnergradientborder}
  1313.    
  1314.     {block:ifnotinnerrainbowborder}
  1315.     {block:ifnotinnergradientborder}
  1316.     background-color:{color:footer background};
  1317.     background-image: url('{image:footer background}');
  1318.     {/block:ifnotinnergradientborder}
  1319.     {/block:ifnotinnerrainbowborder}
  1320.     z-index:100;
  1321.     -webkit-transition: all 0.7s ease;
  1322.     transition: all 0.7s ease;
  1323.     -moz-transition: all 0.7s ease;
  1324.     -o-transition: all 0.7s ease;
  1325. }
  1326.  
  1327. .postback:hover .tags{
  1328.     margin-top:20px;
  1329.     text-align:center;
  1330.     padding:10px;
  1331.     {block:ifroundborders}
  1332.     border-radius:5px;
  1333.     {/block:ifroundborders}
  1334.     border: {text:inner border width}px {select:inner border style} {color:inner border color};
  1335.    
  1336.     {block:ifinnerrainbowborder}
  1337. border-image: linear-gradient(to top left, #b827fc 0%, #2c90fc 25%, #b8fd33 50%, #fec837 75%, #fd1892 100%);
  1338.     border-image-slice: 1;
  1339.     {block:ifroundborders}
  1340.     border-radius:5px;
  1341.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:footer background});
  1342.     {/block:ifroundborders}
  1343.     {block:ifnotroundborders}
  1344.     background-image: url('{image:footer background}');
  1345.     {/block:ifnotroundborders}
  1346.     background-color:{color:footer background};
  1347.     {/block:ifinnerrainbowborder}
  1348.    
  1349.     {block:ifinnergradientborder}
  1350. border-image: linear-gradient(to bottom right, {color:gradient one} 0%, {color:gradient two} 100%);
  1351.     border-image-slice: 1;
  1352.     {block:ifroundborders}
  1353.     border-radius:5px;
  1354.     background-image:url(https://i.imgur.com/GK9LBut.gif), url({image:footer background});
  1355.     {/block:ifroundborders}
  1356.     {block:ifnotroundborders}
  1357.     background-image: url('{image:footer background}');
  1358.     {/block:ifnotroundborders}
  1359.     background-color:{color:footer background};
  1360.     {/block:ifinnergradientborder}
  1361.    
  1362.     {block:ifnotinnerrainbowborder}
  1363.     {block:ifnotinnergradientborder}
  1364.     background-color:{color:footer background};
  1365.     background-image: url('{image:footer background}');
  1366.     {/block:ifnotinnergradientborder}
  1367.     {/block:ifnotinnerrainbowborder}
  1368.     z-index:100;
  1369.     opacity:1;
  1370.     max-height:300px;
  1371.     -webkit-transition: all 0.7s ease;
  1372.     transition: all 0.7s ease;
  1373.     -moz-transition: all 0.7s ease;
  1374.     -o-transition: all 0.7s ease;
  1375. }
  1376.    
  1377. {/block:iftags}
  1378.  
  1379. {block:ifnotrainbowlinks}
  1380. {block:ifnotgradientlinks}
  1381. .heartbeat:hover{
  1382.     animation: heartbeat 1s infinite;
  1383. }
  1384.  
  1385. @keyframes heartbeat
  1386. {
  1387.   0%
  1388.   {
  1389.     transform: scale( .90 );
  1390.   }
  1391.   20%
  1392.   {
  1393.     transform: scale( 1 );
  1394.   }
  1395.   40%
  1396.   {
  1397.     transform: scale( .90 );
  1398.   }
  1399.   60%
  1400.   {
  1401.     transform: scale( 1 );
  1402.   }
  1403.   80%
  1404.   {
  1405.     transform: scale( .90 );
  1406.   }
  1407.   100%
  1408.   {
  1409.     transform: scale( .90 );
  1410.   }
  1411. }
  1412. {/block:ifnotgradientlinks}
  1413. {/block:ifnotrainbowlinks}
  1414.  
  1415. {CustomCSS}
  1416. </style>
  1417. </head>
  1418.  
  1419. <body>
  1420.  
  1421. {block:ifredirect}
  1422. {block:IndexPage}
  1423. <script type="text/javascript">
  1424.     var url = location.href;
  1425.     if (url == "{BlogURL}") {
  1426.         window.location = "{BlogURL}tagged/{text:redirect}";
  1427.     }
  1428. </script>
  1429. {/block:IndexPage}
  1430. {/block:ifredirect}
  1431.  
  1432. <div id="wrapper">
  1433.  
  1434. <div id="sidebarwrapper">
  1435.  
  1436. {block:ifanimatedrainbowtitle}
  1437. <div id="title"><span id="rainbow">{text:title}</span></div>
  1438. {/block:ifanimatedrainbowtitle}
  1439. {block:ifnotanimatedrainbowtitle}
  1440. <div id="title"><a href="/">{text:title}</a></div>
  1441. {/block:ifnotanimatedrainbowtitle}
  1442.  
  1443. <div id="sidebarback"><div id="sidebar">
  1444. <a title="{text:sidebar icon hover}" href="/"><img src="{image:icon}"></a>
  1445. </div>
  1446. </div>
  1447.  
  1448. <div id="descriptionback"><div id="description">
  1449. <marquee scrollamount="{text:description speed}">{text:description}</marquee>
  1450. </div></div>
  1451.  
  1452. <div id="links">
  1453. <p><img src="{image:pixel link 1}"> <a href="{text:link 1 url}">{text:link 1}</a> <img src="{image:pixel link 1}"></p>
  1454. <p><img src="{image:pixel link 2}"> <a href="{text:link 2 url}">{text:link 2}</a> <img src="{image:pixel link 2}"></p>
  1455. <p><img src="{image:pixel link 3}"> <a href="{text:link 3 url}">{text:link 3}</a> <img src="{image:pixel link 3}"></p>
  1456. </div>
  1457.  
  1458. </div>
  1459.  
  1460. <div id="content">
  1461. {block:Posts}
  1462.  
  1463. <div class="postback"><div class="post">
  1464.  
  1465. {block:Text}
  1466. {block:Title}
  1467. <div class="title">{Title}</div>
  1468. {/block:Title}
  1469. {Body}
  1470. {/block:Text}
  1471.  
  1472. {block:Photo}
  1473. <div class="media" style="z-index:100;">{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</div>
  1474. {block:ifcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifcaptions}
  1475. {/block:Photo}
  1476.  
  1477. {block:Photoset}
  1478. <div class="media" style="z-index:100;">{Photoset}</div>
  1479. {block:ifcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifcaptions}
  1480. {/block:Photoset}
  1481.  
  1482. {block:Quote}
  1483. <div class="quote">"{Quote}"</div>
  1484. {block:Source}
  1485. <div class="quotesource">{Source}</div>
  1486. {/block:Source}
  1487. {/block:Quote}
  1488.  
  1489. {block:Link}
  1490. <div class="title"><a href="{URL}">{Name}</a></div>
  1491. {block:Description}
  1492. <div class="description">{Description}</div>
  1493. {/block:Description}
  1494. {/block:Link}
  1495.  
  1496. {block:Chat}
  1497. {block:Title}
  1498. <div class="title">{Title}</div>
  1499. {/block:Title}
  1500.  
  1501. {block:Lines}
  1502. <div class="{Alt} user_{UserNumber}">
  1503. {block:Label}
  1504. <b>{Label}</b>{/block:Label}
  1505. &nbsp;{Line}
  1506. </div>
  1507. {/block:Lines}
  1508. {/block:Chat}
  1509.  
  1510. {block:Video}
  1511. <div class="media" style="margin-bottom:10px"><div class="video-wrapper">
  1512. <div class="video-container">{video-400}</div>
  1513. </div></div>
  1514. {block:ifcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifcaptions}
  1515. {/block:Video}
  1516.  
  1517. {block:Audio}
  1518. <div class="media" style="margin-bottom:-90px">
  1519. {block:AudioEmbed}<div class="video-wrapper"><div class="video-container">{AudioEmbed-500}</div></div>{/block:AudioEmbed}
  1520. </div>
  1521. {block:ifcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifcaptions}
  1522. {/block:Audio}
  1523.                
  1524. {block:Answer}
  1525. <div class="question" style="font-style:italic">{Asker}: {Question}</div>
  1526. <div class="caption">{Answer}</div>
  1527. {/block:Answer}
  1528.  
  1529. </div>
  1530.  
  1531. {block:PermalinkPage}
  1532. {block:Date}
  1533.  
  1534. <div class="footer">
  1535. <img src="{image:footer pixel}"> <a href="{Permalink}" title="{notecount}%">{24hourwithzero}:{minutes}</a> <img src="{image:footer pixel}">
  1536.  
  1537. <!-- {block:NoRebloggedFrom}
  1538. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  1539. {/block:NoRebloggedFrom} -->{block:ContentSource}<!-- {SourceURL}
  1540. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  1541. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1542. {/block:ContentSource}
  1543.  
  1544. </div>
  1545.  
  1546. {block:iftags}{block:HasTags}<div class="tags">{block:Tags}#<a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}{/block:iftags}
  1547.  
  1548. {block:NoteCount}
  1549. {block:PostNotes}<div class="postnotes">{PostNotes}</div>{/block:PostNotes}
  1550. {/block:NoteCount}
  1551. {/block:Date}
  1552. {/block:PermalinkPage}
  1553.  
  1554. {block:IndexPage}
  1555. {block:Date}
  1556. <div class="footer">
  1557. <img src="{image:footer pixel}"> <a href="{Permalink}" title="{notecount}%">{24hourwithzero}:{minutes}</a> <img src="{image:footer pixel}">
  1558.  
  1559. <!-- {block:NoRebloggedFrom}
  1560. {block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
  1561. {/block:NoRebloggedFrom} -->{block:ContentSource}<!-- {SourceURL}
  1562. {block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  1563. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  1564. {/block:ContentSource}
  1565.  
  1566. </div>
  1567.  
  1568. {block:iftags}{block:HasTags}<div class="tags">{block:Tags}#<a href="{TagURL}">{Tag}</a> {/block:Tags}</div>{/block:HasTags}{/block:iftags}
  1569. {/block:Date}
  1570. {/block:IndexPage}
  1571. </div>
  1572. {/block:Posts}
  1573.  
  1574. {block:Pagination}
  1575. <div id="nav">
  1576. <div style="float:left;">{block:PreviousPage}<a href="{PreviousPage}">{text:previous}</a>{/block:PreviousPage}</div>
  1577.  
  1578. <div style="float:right;">{block:NextPage}<a href="{NextPage}">{text:next}</a>{/block:NextPage}</div>
  1579. </div>
  1580. {/block:Pagination}
  1581. </div>
  1582. </div>
  1583.  
  1584. </div>
  1585.  
  1586.         <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
  1587.         <script>window.jQuery || document.write('<script src="https://static.tumblr.com/qxrkgx6/q6kmgn2w2/jquery-1.8.3.min.js"><\/script>')</script>
  1588.  
  1589. <a href="https://puella.tumblr.com" title="by @puella" style="position:fixed;left:12px;bottom:-12px;font-size:20px;"><div class="heartbeat"><3</div></a>
  1590.  
  1591.     </body>
  1592. </html>
Add Comment
Please, Sign In to add comment