API tools faq
paste
Advertisement
hunterthemes

- Theme #30

hunterthemes
Mar 4th, 2018
253
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 57.70 KB | None | 0 0
raw download clone embed print report
  1. <html> <meta charset="utf-8">
  2. <meta name="viewport" content="width=device-width, initial-scale=1">
  3. <link rel="shortcut icon" href="{Favicon}">
  4. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  5.  
  6. <!----
  7.  
  8. © hunterthemes.tumblr.com | Theme #30
  9.  
  10. * Do not redistribute this theme and claim it as your own.
  11. * Do not remove the credit or move it to another page.
  12. * Minor changes to this theme are allowed.
  13.  
  14. ---->
  15.  
  16. <!-- GOOGLE FONTS -->
  17.  
  18. <link href="https://fonts.googleapis.com/css?family=Abril+Fatface|Lato|Oswald|Quando|Teko" rel="stylesheet">
  19.  
  20. <!-- DEFAULT VARIABLES -->
  21.  
  22. <meta name="image:Background" content=""/>
  23. <meta name="image:Header background" content="" />
  24. <meta name="image:Avatar" content="" />
  25. <meta name="image:About background" content="" />
  26. <meta name="image:About image" content="" />
  27. <meta name="image:Project One image" content="" />
  28. <meta name="image:Project Two image" content="" />
  29. <meta name="image:Project Three image" content="" />
  30. <meta name="image:Project Four image" content="" />
  31. <meta name="image:Project Five image" content="" />
  32. <meta name="image:Member One image" content="" />
  33. <meta name="image:Member Two image" content="" />
  34. <meta name="image:Member Three image" content="" />
  35. <meta name="image:Member Four image" content="" />
  36. <meta name="image:Member Five image" content="" />
  37. <meta name="image:Member Six image" content="" />
  38. <meta name="image:Member Seven image" content="" />
  39. <meta name="image:Member Eight image" content="" />
  40. <meta name="image:Member Nine image" content="" />
  41.  
  42. <meta name="color:Background" content="#fffffF" />
  43. <meta name="color:Menu link" content="#333333" />
  44. <meta name="color:Main link" content="#333333" />
  45. <meta name="color:Profile background" content="#ffffff" />
  46. <meta name="color:Blog title" content="#000000" />
  47. <meta name="color:Avatar border" content="#ffffff" />
  48. <meta name="color:Description" content="#333333" />
  49. <meta name="color:Panel background" content="#ffffff" />
  50. <meta name="color:Panel text" content="#000000" />
  51. <meta name="color:Panel link" content="#2222222" />
  52. <meta name="color:Footer background" content="#ffffff" />
  53. <meta name="color:Footer text" content="#222222" />
  54. <meta name="color:Footer icon" content="#FFBB6B" />
  55. <meta name="color:Text" content="#4444444"/>
  56. <meta name="color:Bold" content="#bbbbbb"/>
  57. <meta name="color:Italic" content="#FFBB6B"/>
  58. <meta name="color:Link" content="#333333"/>
  59. <meta name="color:Hover" content="#dddddd"/>
  60. <meta name="color:Accent" content="#FFBB6B"/>
  61. <meta name="color:Borders" content="#333333"/>
  62. <meta name="color:Chat 1" content="#f8f8f8"/>
  63. <meta name="color:Chat 2" content="#cfcfcf"/>
  64. <meta name="color:Post buttons" content="#999999" />
  65. <meta name="color:Pagination" content="#ffffff" />
  66. <meta name="color:Scrollbar" content="#FFBB6B" />
  67.  
  68. <meta name="select:Entry background" content="255,255,255" title="white">
  69. <meta name="select:Entry background" content="0,0,0" title="black">
  70. <meta name="select:Entry background" content="238,238,238" title="gray">
  71. <meta name="select:Entry background" content="255,168,212" title="pink">
  72. <meta name="select:Entry background" content="127,88,242" title="purple">
  73. <meta name="select:Entry background" content="184,168,255" title="indigo">
  74. <meta name="select:Entry background" content="184,208,255" title="blue">
  75. <meta name="select:Entry background" content="103,173,90" title="green">
  76. <meta name="select:Entry background" content="33,209,297" title="turquoise">
  77. <meta name="select:Entry background" content="226,229,23" title="yellow">
  78. <meta name="select:Entry background" content="112,38,11" title="brown">
  79.  
  80. <meta name="select:Entry transparency" content="1" title="opaque">
  81. <meta name="select:Entry transparency" content=".9" title=".9">
  82. <meta name="select:Entry transparency" content=".8" title=".8">
  83. <meta name="select:Entry transparency" content=".7" title=".7">
  84. <meta name="select:Entry transparency" content=".6" title=".6">
  85. <meta name="select:Entry transparency" content=".5" title=".5">
  86. <meta name="select:Entry transparency" content=".4" title=".4">
  87. <meta name="select:Entry transparency" content=".3" title=".3">
  88. <meta name="select:Entry transparency" content=".2" title=".2">
  89. <meta name="select:Entry transparency" content=".1" title=".1">
  90. <meta name="select:Entry transparency" content=".0" title="transparent">
  91.  
  92. <meta name="select:Info background" content="255,255,255" title="white">
  93. <meta name="select:Info background" content="0,0,0" title="black">
  94. <meta name="select:Info background" content="238,238,238" title="gray">
  95. <meta name="select:Info background" content="255,168,212" title="pink">
  96. <meta name="select:Info background" content="127,88,242" title="purple">
  97. <meta name="select:Info background" content="184,168,255" title="indigo">
  98. <meta name="select:Info background" content="184,208,255" title="blue">
  99. <meta name="select:Info background" content="103,173,90" title="green">
  100. <meta name="select:Info background" content="33,209,297" title="turquoise">
  101. <meta name="select:Info background" content="226,229,23" title="yellow">
  102. <meta name="select:Info background" content="112,38,11" title="brown">
  103.  
  104. <meta name="select:Title font" content="Abril Fatface" title="Abril Fatface">
  105. <meta name="select:Title font" content="Lato" title="Lato">
  106. <meta name="select:Title font" content="Oswald" title="Oswald">
  107. <meta name="select:Title font" content="Quando" title="Quando">
  108. <meta name="select:Title font" content="Teko" title="Teko">
  109.  
  110. <meta name="select:Title font size" content="20px" title="20px">
  111. <meta name="select:Title font size" content="25px" title="25px">
  112. <meta name="select:Title font size" content="30px" title="30px">
  113. <meta name="select:Title font size" content="35px" title="35px">
  114. <meta name="select:Title font size" content="40px" title="40px">
  115.  
  116. <meta name="select:Blog title font size" content="60px" title="60px">
  117. <meta name="select:Blog title font size" content="65px" title="65px">
  118. <meta name="select:Blog title font size" content="70px" title="70px">
  119. <meta name="select:Blog title font size" content="75px" title="75px">
  120. <meta name="select:Blog title font size" content="80px" title="80px">
  121. <meta name="select:Blog title font size" content="85px" title="85px">
  122. <meta name="select:Blog title font size" content="90px" title="90px">
  123.  
  124. <meta name="font:Body font" content="Helvetica"/>
  125. <meta name="select:Body font size" content="12px" title="12px">
  126. <meta name="select:Body font size" content="13px" title="13px">
  127. <meta name="select:Body font size" content="14px" title="14px">
  128. <meta name="select:Body font size" content="15px" title="15px">
  129. <meta name="select:Body font size" content="16px" title="16px">
  130.  
  131. <meta name="if:Inverted Controls" content="0" />
  132. <meta name="if:Infinite Scrolling" content="0" />
  133. <meta name="if:Display Header" content="1" />
  134. <meta name="if:Header Background Stretch" content="1" />
  135. <meta name="if:Display Main Links" content="1" />
  136. <meta name="if:Display Avatar" content="1" />
  137. <meta name="if:Circular Avatar" content="1" />
  138. <meta name="if:Display Search Box" content="1" />
  139. <meta name="if:Display Navigation" content="1" />
  140.  
  141. <meta name="select:Post width" content="500" title="500px">
  142. <meta name="select:Post width" content="400" title="400px">
  143. <meta name="select:Post width" content="300" title="300px">
  144. <meta name="select:Post width" content="250" title="250px">
  145.  
  146. <meta name="select:Number of columns" content="1" title="1">
  147. <meta name="select:Number of columns" content="2" title="2">
  148. <meta name="select:Number of columns" content="3" title="3">
  149.  
  150. <meta name="if:Hover For Info" content="0" />
  151. <meta name="if:Display Captions" content="1" />
  152. <meta name="if:Display Tags" content="1" />
  153. <meta name="if:Audio Player #fff" content="0" />
  154.  
  155. <meta name="if:Display Link One" content="1" />
  156. <meta name="if:Display Link Two" content="1" />
  157. <meta name="if:Display Link Three" content="1" />
  158. <meta name="if:Display Link Four" content="1" />
  159. <meta name="if:Display Link Five" content="1" />
  160. <meta name="if:Display Link Six" content="1" />
  161.  
  162. <meta name="text:Link One Title" content="LINK" />
  163. <meta name="text:Link One Url" content="https://"/>
  164. <meta name="text:Link Two Title" content="LINK"/>
  165. <meta name="text:Link Two Url" content="https://"/>
  166. <meta name="text:Link Three Title" content="LINK" />
  167. <meta name="text:Link Three Url" content="https://" />
  168. <meta name="text:Link Four Title" content="LINK" />
  169. <meta name="text:Link Four Url" content="https://" />
  170. <meta name="text:Link Five Title" content="LINK" />
  171. <meta name="text:Link Five Url" content="https://" />
  172. <meta name="text:Link Six Title" content="LINK" />
  173. <meta name="text:Link Six Url" content="https://" />
  174.  
  175. <meta name="if:Display Tumblr" content="1" />
  176. <meta name="if:Display Facebook" content="1" />
  177. <meta name="if:Display Pinterest" content="1" />
  178. <meta name="if:Display Linkedin" content="1" />
  179. <meta name="if:Display Instagram" content="1" />
  180.  
  181. <meta name="text:Facebook url" content="https://" />
  182. <meta name="text:Pinterest url" content="https://" />
  183. <meta name="text:Instagram url" content="https://" />
  184. <meta name="text:Linkedin url" content="https://" />
  185. <meta name="text:Tumblr url" content="https://" />
  186.  
  187. <meta name="text:Project One" content="Project One"/>
  188. <meta name="text:Project One description" content="Add content here" />
  189. <meta name="text:Project Two" content="Project Two"/>
  190. <meta name="text:Project Two description" content="Add content here" />
  191. <meta name="text:Project Three" content="Project Three"/>
  192. <meta name="text:Project Three description" content="Add content here" />
  193. <meta name="text:Project Four" content="Project Four"/>
  194. <meta name="text:Project Four description" content="Add content here" />
  195. <meta name="text:Project Five" content="Project Five"/>
  196. <meta name="text:Project Five description" content="Add content here" />
  197.  
  198. <meta name="text:Member One" content="Member One"/>
  199. <meta name="text:Member Two" content="Member Two"/>
  200. <meta name="text:Member Three" content="Member Three"/>
  201. <meta name="text:Member Three Role" content="Group member / unit leader"/>
  202. <meta name="text:Member Four" content="Member Four"/>
  203. <meta name="text:Member Five" content="Member Five"/>
  204. <meta name="text:Member Six" content="Member Six"/>
  205. <meta name="text:Member Seven" content="Member Seven"/>
  206. <meta name="text:Member Eight" content="Member Eight"/>
  207. <meta name="text:Member Nine" content="Member Nine"/>
  208.  
  209. <meta name="text:Border radius" content="0px"/>
  210. <meta name="text:Stats" content="Add content here" />
  211. <meta name="text:Stats 2" content="Add content here" />
  212. <meta name="text:Blog title" content="BLOG TITLE" />
  213. <meta name="text:Subtitle" content="Add content here" />
  214. <meta name="text:About first label" content="AGE" />
  215. <meta name="text:About first text" content="23" />
  216. <meta name="text:About second label" content="GENDER" />
  217. <meta name="text:About second text" content="CIS MALE" />
  218. <meta name="text:About third label" content="FROM" />
  219. <meta name="text:About third text" content="SOUTH KOREA" />
  220. <meta name="text:About fourth label" content="OCCUPATION" />
  221. <meta name="text:About fourth text" content="IDOL" />
  222. <meta name="text:About fifth label" content="FACECLAIM" />
  223. <meta name="text:About fifth text" content="MOON TEAL" />
  224.  
  225. <meta name="text:About description" content="Add content here" />
  226. <meta name="text:Afilliates text" content="Add content here" />
  227.  
  228. <!-- END DEFAULT VARIABLES -->
  229.  
  230. <head>
  231.  
  232. <style type="text/css">
  233.  
  234. /* CSS */
  235.  
  236. /*-- GENERAL --*/
  237.  
  238. body {
  239. margin:0;
  240. padding:0;
  241. width:100%;
  242. height:100%;
  243. word-wrap:break-word;
  244. color:{color:Text};
  245. font-family:{font:Body font};
  246. font-size:{select:Body font size};
  247. line-height: calc({select:Body font size} + 5px);
  248. background-color: {color:Background};
  249. background-image:url({image:Background});
  250. background-attachment: fixed;
  251. background-repeat: repeat;
  252. }
  253.  
  254. /* Heading */
  255.  
  256. h1{
  257. margin:0;
  258. padding:0px;
  259. padding-bottom:5px;
  260. color:{color:Title};
  261. font-family:{select:Title font};
  262. font-size:{select:Title font size};
  263. line-height: calc({select:Title font size} + 5px);
  264. }
  265.  
  266. h2{
  267. font-family:{font:Body font};
  268. font-size:150%;
  269. font-weight:normal;
  270. }
  271.  
  272. /* Paragraph */
  273.  
  274. p {
  275. padding:0px 10px;
  276. }
  277.  
  278. p ul, p ol, p li {
  279. margin: 5px 10px;
  280. padding: 0px;
  281. }
  282.  
  283. /* Links */
  284.  
  285. a {
  286. color:{color:Link};
  287. text-decoration:none;
  288. -webkit-transition: all 0.6s ease;
  289. -moz-transition: all 0.6s ease;
  290. -o-transition: all 0.6s ease;
  291. transition: all 0.6s ease;
  292. }
  293.  
  294. a:hover {
  295. color:{color:Link Hover};
  296. }
  297.  
  298. /* Bold and italic */
  299.  
  300. b, strong {color:{color:Bold};}
  301.  
  302. i, em {color:{color:Italic};}
  303.  
  304. /* Blockquote */
  305.  
  306. blockquote{
  307. padding:0px 0px 2px 5px;
  308. margin:0px 0px 2px 10px;
  309. border-left: 1px dotted #555555;
  310. }
  311.  
  312. /* Tumblr controls */
  313.  
  314. iframe.tmblr-iframe {
  315. top:4px!important;
  316. right:3px!important;
  317. opacity:0.8;
  318. transform:scale(0.6);
  319. transform-origin:100% 0;
  320. -webkit-transform:scale(0.8);
  321. -webkit-transform-origin:100% 0;
  322. -o-transform:scale(0.8);
  323. -o-transform-origin:100% 0;
  324. -moz-transform:scale(0.8);
  325. -moz-transform-origin:100% 0;
  326. -ms-transform:scale(0.8);
  327. -ms-transform-origin:100% 0;
  328. z-index:100000!important;
  329. {block:ifInvertedControls}
  330. filter:invert(100%) hue-rotate(180deg);
  331. -webkit-filter:invert(100%) hue-rotate(180deg);
  332. -moz-filter:invert(100%) hue-rotate(180deg);
  333. -o-filter:invert(100%) hue-rotate(180deg);
  334. -ms-filter:invert(100%) hue-rotate(180deg);
  335. {/block:ifInvertedControls}
  336. }
  337.  
  338. iframe.tmblr-iframe:hover {
  339. opacity:1!important;}
  340.  
  341. /* Webkit scrollbar */
  342.  
  343. ::-webkit-scrollbar {
  344. width: 9px;
  345. height: 0px;
  346. }
  347.  
  348. ::-webkit-scrollbar-button:start:decrement,
  349. ::-webkit-scrollbar-button:end:increment {
  350. height: 0px;
  351. display: block;
  352. background-color: {color:Background};
  353. }
  354.  
  355. ::-webkit-scrollbar-track-piece {
  356. background-color: {color:Background};
  357. }
  358.  
  359. ::-webkit-scrollbar-thumb:vertical {
  360. height: 0px;
  361. background-color: {color:Scrollbar};
  362. border:4px solid {color:Background};
  363. }
  364.  
  365. /* Tooltips */
  366.  
  367. #s-m-t-tooltip {
  368. max-width: 300px;
  369. margin-left: 10px;
  370. margin-top: 10px;
  371. padding: 2px 4px;
  372. font-size: 11px;
  373. line-height: 15px;
  374. color: {color:Main link};
  375. background: {color:Menu background};
  376. border:1px solid {color:Borders};
  377. border-radius:{text:Border radius};
  378. z-index: 10000;
  379. }
  380.  
  381. /* Fix */
  382.  
  383. iframe, img, embed, object, video {
  384. max-width: 100%;
  385. border: none;
  386. }
  387.  
  388. input, textarea, select, a { outline: none; }
  389.  
  390. /* Placeholders */
  391.  
  392. ::-webkit-input-placeholder {color: inherit;}
  393. :-moz-placeholder {color: inherit; opacity:1;}
  394. ::-moz-placeholder {color: inherit; opacity:1;}
  395. :-ms-input-placeholder {color: inherit;}
  396. input:focus::-webkit-input-placeholder {color: transparent;}
  397. input:focus:-moz-placeholder {color: transparent;}
  398. input:focus::-moz-placeholder {color: transparent;}
  399. input:focus:-ms-input-placeholder { color: transparent;}
  400.  
  401. /*------ MENU-----*/
  402.  
  403. #menu{
  404. position:fixed;
  405. top:0px;
  406. left:0px;
  407. width:100%;
  408. height:50px;
  409. text-align:center;
  410. z-index:1000;
  411. padding:0;
  412. }
  413.  
  414. #menu a{
  415. margin:0px 10px;
  416. color:{color:Menu link};
  417. min-height:30px;
  418. line-height:55px;
  419. font-size:12px;
  420. padding:5px 15px;
  421. letter-spacing:2px;
  422. cursor:pointer;
  423. }
  424.  
  425. #menu a:hover{
  426. color:{color:Hover};
  427. -webkit-transition: all .7s ease;
  428. -moz-transition: all .7s ease;
  429. -o-transition: all .7s ease;
  430. transition: all .7s ease;
  431. }
  432.  
  433. .item-wrapper{ display:none; }
  434. .page-1{ display:block; }
  435.  
  436. /*------ HEADER -----*/
  437.  
  438. #header{
  439. position:absolute;
  440. top:0px;
  441. left:0px;
  442. width:100%;
  443. height:100%;
  444. background-image:url({image:Header background});
  445. background-position:center;
  446. background-repeat:repeat;
  447. {block:IfHeaderBackgroundStretch}
  448. background-size:cover;
  449. {/block:IfHeaderBackgroundStretch}
  450. z-index:100;
  451. }
  452.  
  453. /* Blog title */
  454.  
  455. #box{
  456. position:absolute;
  457. top:50%;
  458. left:50%;
  459. width:75vh;
  460. height:75vh;
  461. border:10px solid {color:Accent};
  462. -webkit-transform: translateX(-50%) translateY(-50%);
  463. -moz-transform: translateX(-50%) translateY(-50%);
  464. -ms-transform: translateX(-50%) translateY(-50%);
  465. transform: translateX(-50%) translateY(-50%);
  466. }
  467.  
  468. #blog_title{
  469. position:absolute;
  470. top:50%;
  471. left:50%;
  472. width:80vw;
  473. font-family:{select:Title font};
  474. font-size:{select:Blog title font size};
  475. color:{color:Blog Title};
  476. line-height:60px;
  477. letter-spacing:2px;
  478. text-align:center;
  479. font-weight:bold;
  480. -webkit-transform: translateX(-50%) translateY(-50%);
  481. -moz-transform: translateX(-50%) translateY(-50%);
  482. -ms-transform: translateX(-50%) translateY(-50%);
  483. transform: translateX(-50%) translateY(-50%);
  484. }
  485.  
  486. #blog_title span{
  487. color:{color:Accent};
  488. }
  489.  
  490. /* Stats */
  491.  
  492. #statsl, #statsr{
  493. position:absolute;
  494. top:50%;
  495. left:0px;
  496. color:{color:Blog Title};
  497. width:300px;
  498. -webkit-transform:translateY(-50%);
  499. -moz-transform:translateY(-50%);
  500. -ms-transform:translateY(-50%);
  501. transform:translateY(-50%);
  502. }
  503.  
  504. #statsr{
  505. margin-left:auto;
  506. right:0px;
  507. }
  508.  
  509. .statscl, .statscr{
  510. position:absolute;
  511. margin:0;
  512. font-size:10px;
  513. line-height:16px;
  514. letter-spacing:1px;
  515. text-align:center;
  516. text-transform:uppercase;
  517. -ms-transform: rotate(90deg);
  518. -webkit-transform: rotate(90deg);
  519. transform: rotate(90deg);
  520. }
  521.  
  522. .statscr{
  523. right:0px;
  524. -ms-transform: rotate(-90deg);
  525. -webkit-transform: rotate(-90deg);
  526. transform: rotate(-90deg);
  527. }
  528.  
  529. /*------ PROFILE -----*/
  530.  
  531. #profile{
  532. position:relative;
  533. margin-top:0px;
  534. margin-left:0px;
  535. width:100%;
  536. padding:50px 0px;
  537. background:{color:Profile background};
  538. color:{color:Description};
  539. text-align:center;
  540. overflow:hidden;
  541. z-index:10;
  542. }
  543.  
  544. /* Avatar */
  545.  
  546. #avatar{
  547. margin:auto;
  548. width:80px;
  549. height:80px;
  550. z-index:10000;
  551. {block:ifCircularAvatar}
  552. border-radius:100px;
  553. {/block:ifCircularAvatar}
  554. }
  555.  
  556. #avatar img{
  557. margin:auto;
  558. width:100%;
  559. height:100%;
  560. border:2px solid {color:Avatar border};
  561. {block:ifCircularAvatar}
  562. border-radius:100px;
  563. {/block:ifCircularAvatar}
  564. }
  565.  
  566. /* Profile title */
  567.  
  568. #profile_title {
  569. margin-top:15px;
  570. margin-left:auto;
  571. margin-right:auto;
  572. font-size:20px;
  573. line-height:30px;
  574. font-weight:bold;
  575. text-align:center;
  576. text-transform:uppercase;
  577. color:{color:Description};
  578. }
  579.  
  580. /* Subtitle */
  581.  
  582. .subtitle{
  583. margin-top:5px;
  584. margin-left:auto;
  585. margin-right:auto;
  586. width:400px;
  587. font-size:10px;
  588. line-height:16px;
  589. letter-spacing:1px;
  590. text-align:center;
  591. text-transform:uppercase;
  592. color:{color:Description};
  593. }
  594.  
  595. /* Main links */
  596.  
  597. #main_links{
  598. margin:15px auto;
  599. height:78px;
  600. line-height:40px;
  601. }
  602.  
  603. #main_links a{
  604. margin:10px;
  605. font-size:12px;
  606. line-height:16px;
  607. text-align:center;
  608. padding:5px 10px;
  609. letter-spacing:1px;
  610. color:{color:Profile background};
  611. background:{color:Accent};
  612. }
  613.  
  614. #main_links a:hover{
  615. color:{color:Hover};
  616. }
  617.  
  618. .divider{
  619. margin:auto;
  620. width:150px;
  621. height:1px;
  622. background:{color:Borders};
  623. }
  624.  
  625. /* Description */
  626.  
  627. .description{
  628. margin-top:15px;
  629. margin-left:auto;
  630. margin-right:auto;
  631. max-width: 400px;
  632. max-height:60px;
  633. overflow-y:auto;
  634. padding-right:10px;
  635. font-size:10px;
  636. line-height:16px;
  637. letter-spacing:1px;
  638. text-align:center;
  639. text-transform:uppercase;
  640. color:{color:Description};
  641. }
  642.  
  643. /*------ ABOUT -----*/
  644.  
  645. #about{
  646. position:fixed;
  647. top:0px;
  648. left:0px;
  649. width:100%;
  650. height:100%;
  651. background:{color:Panel background};
  652. z-index:10000;
  653. overflow:hidden;
  654. display:none;
  655. }
  656.  
  657. #about_panel{
  658. position:absolute;
  659. top:0px;
  660. left:0px;
  661. width:50%;
  662. height:100%;
  663. background-color:{color:Panel background};
  664. background-image:url({image:About background});
  665. background-size:cover;
  666. z-index:10000;
  667. }
  668.  
  669. #panelin{
  670. position:absolute;
  671. top:50%;
  672. left:50%;
  673. width:280px;
  674. font-size:12px;
  675. line-height:20px;
  676. letter-spacing:1px;
  677. text-align:right;
  678. color:{color:Panel text};
  679. -webkit-transform:translateX(-50%) translateY(-50%);
  680. -moz-transform:translateX(-50%) translateY(-50%);
  681. -ms-transform:translateX(-50%) translateY(-50%);
  682. transform:translateX(-50%) translateY(-50%);
  683. }
  684.  
  685. /* About title */
  686.  
  687. #about_title {
  688. margin-top:20px;
  689. margin-left:auto;
  690. margin-right:auto;
  691. font-size:20px;
  692. line-height:30px;
  693. font-weight:bold;
  694. text-align:center;
  695. text-transform:uppercase;
  696. color:{color:Panel text};
  697. }
  698.  
  699. /* About description */
  700.  
  701. #about_description{
  702. margin:20px auto;
  703. font-size:14px;
  704. line-height:20px;
  705. text-align:center;
  706. color:{color:Panel text};
  707. }
  708.  
  709. #panelin span{
  710. float:left;
  711. color:{color:Accent};
  712. letter-spacing:2px;
  713. font-weight:700;
  714. }
  715.  
  716. /* Search box */
  717.  
  718. #search_box{
  719. margin:10px auto;
  720. width:calc(100% - 20px);
  721. padding:10px;
  722. height:25px;
  723. border:1px solid {color:Borders};
  724. }
  725.  
  726. .search .query {
  727. float:left;
  728. width:calc(100% - 30px);
  729. height:20px;
  730. padding:2.5px 0px;
  731. border: 0;
  732. outline: 0;
  733. font-family: inherit;
  734. font-size: 13px;
  735. letter-spacing:2px;
  736. color: {color:Panel text};
  737. background-color: transparent;
  738. }
  739.  
  740. #search_box span{
  741. float:right;
  742. font-size:15px;
  743. width:20px;
  744. height:20px;
  745. padding:2.5px;
  746. color:{color:Accent};
  747. }
  748.  
  749. /* About image */
  750.  
  751. #about_image{
  752. position:absolute;
  753. top:0px;
  754. left:50%;
  755. width:50%;
  756. height:100%;
  757. background-color:{color:Panel background};
  758. background-image:url({image:About image});
  759. background-size:cover;
  760. z-index:10000;
  761. }
  762.  
  763. /*-- PROJECTS --*/
  764.  
  765. #projects{
  766. position:fixed;
  767. top:0px;
  768. left:0px;
  769. width:100%;
  770. height:100%;
  771. background:{color:Panel background};
  772. z-index:10000;
  773. overflow:hidden;
  774. display:none;
  775. }
  776.  
  777. /* Projects link box */
  778.  
  779. #projects_links{
  780. position:absolute;
  781. top:0px;
  782. left:0px;
  783. width:33%;
  784. height:100%;
  785. background:{color:Panel background};
  786. z-index:10000;
  787. }
  788.  
  789. /* Projects title */
  790.  
  791. .projects_title{
  792. margin-top:35px;
  793. margin-left:auto;
  794. margin-right:auto;
  795. width:70%;
  796. padding-bottom:20px;
  797. font-size:20px;
  798. line-height:20px;
  799. font-weight:bold;
  800. text-align:left;
  801. text-transform:uppercase;
  802. color:{color:Accent};
  803. border-bottom:1px solid {color:Borders};
  804. }
  805.  
  806. /* Projects icon */
  807.  
  808. #projects span{
  809. font-size:15px;
  810. padding:5px;
  811. }
  812.  
  813. /* Projects links */
  814.  
  815. .tabs ul{
  816. margin:auto;
  817. margin-top:20px;
  818. width:70%;
  819. padding:0px;
  820. }
  821.  
  822. /* Clearfix */
  823. .tab-links:after {
  824. display:block;
  825. clear:both;
  826. content:'';
  827. }
  828.  
  829. .tab-links li {
  830. list-style:none;
  831. }
  832.  
  833. .tab-links a {
  834. display:block;
  835. padding:10px;
  836. margin-top:0px;
  837. margin-left:0px;
  838. width: calc(100% - 30px);
  839. padding:15px 10px;
  840. color:{color:Panel link};
  841. border-bottom:1px solid {color:Borders};
  842. font-size:13px;
  843. font-weight:700;
  844. line-height:20px;
  845. text-align:left;
  846. text-transform:uppercase;
  847. overflow:hidden;
  848. }
  849.  
  850. .tab-links span{
  851. color:{color:Panel background};
  852. }
  853.  
  854. .tab-links a:hover, li.active a, li.active a:hover {
  855. padding:15px;
  856. width: calc(100% - 40px);
  857. background:{color:Accent};
  858. color:{color:Panel background};
  859. -webkit-transition: all .3s;
  860. -moz-transition: all .3s;
  861. -o-transition: all .3s;
  862. -ms-transition: all .3s;
  863. transition: all .3s;
  864. }
  865.  
  866. /* Projects panel */
  867.  
  868. .projects_panel{
  869. position:absolute;
  870. top:20px;
  871. left:33%;
  872. width:66%;
  873. height:calc(100% - 40px);
  874. background:{color:Panel background};
  875. overflow:hidden;
  876. z-index:100;
  877. }
  878.  
  879. /* Projects tabs */
  880.  
  881. .tab {
  882. display:inline-block;
  883. float:left;
  884. height:100%;
  885. width:calc(25% - 10px);
  886. border-right:10px solid {color:Panel background};
  887. overflow:hidden;
  888. }
  889.  
  890. .tab.active {
  891. width:calc(50% - 10px);
  892. }
  893.  
  894. .tab_hover{
  895. margin-top:0px;
  896. margin-left:0px;
  897. width:100%;
  898. height:100%;
  899. -moz-box-shadow: inset 0 0 500px {color:Accent};
  900. -webkit-box-shadow: inset 0 0 500px {color:Accent};
  901. box-shadow: inset 0 0 500px {color:Accent};
  902. opacity:1;
  903. z-index:100;
  904. }
  905.  
  906. .tab.active .tab_hover {
  907. position:absolute;
  908. top:25px;
  909. margin-left:25px;
  910. width:calc(50% - 65px);
  911. height:calc(100% - 50px);
  912. border:2px solid {color:Accent};
  913. -moz-box-shadow: none;
  914. -webkit-box-shadow: none;
  915. box-shadow: none;
  916. z-index:100;
  917. opacity:1;
  918. }
  919.  
  920. /* Tab title */
  921.  
  922. .tab h1{
  923. display:inline-block;
  924. margin-left:-19vh;
  925. margin-top:60vh;
  926. width:50vh;
  927. height:5vh;
  928. -moz-box-shadow: none;
  929. -webkit-box-shadow: none;
  930. box-shadow: none;
  931. text-align:left;
  932. text-transform:uppercase;
  933. letter-spacing:2px;
  934. font-size:12px;
  935. opacity:1;
  936. color:{color:Panel link};
  937. -ms-transform:rotate(-90deg);
  938. -webkit-transform: rotate(-90deg);
  939. transform:rotate(-90deg);
  940. }
  941.  
  942. .tab.active h1{
  943. display:none;
  944. }
  945.  
  946. /* Tab description */
  947.  
  948. .tab_description{
  949. position:absolute;
  950. top:50%;
  951. left:50%;
  952. color:{color:Panel text};
  953. font-size:15px;
  954. line-height:20px;
  955. text-align:center;
  956. color: #fff;
  957. text-shadow: 0.07em 0 #000, 0 0.07em #000, -0.07em 0 #000, 0 -0.07em #000;
  958. opacity:0;
  959. -webkit-transform: translateX(-50%) translateY(-50%);
  960. -moz-transform: translateX(-50%) translateY(-50%);
  961. -ms-transform: translateX(-50%) translateY(-50%);
  962. transform: translateX(-50%) translateY(-50%);
  963. }
  964.  
  965. .tab.active .tab_description{
  966. opacity:1;
  967. }
  968.  
  969. #tab1{
  970. background-image:url({image:Project One image});
  971. background-size:cover;
  972. }
  973.  
  974. #tab2{
  975. background-image:url({image:Project Two image});
  976. background-size:cover;
  977. }
  978.  
  979. #tab3{
  980. background-image:url({image:Project Three image});
  981. background-size:cover;
  982. }
  983.  
  984. #tab4{
  985. background-image:url({image:Project Four image});
  986. background-size:cover;
  987. }
  988.  
  989. #tab5{
  990. background-image:url({image:Project Five image});
  991. background-size:cover;
  992. }
  993.  
  994. /*-- AFILLIATES --*/
  995.  
  996. #afilliates{
  997. position:fixed;
  998. top:0px;
  999. left:0px;
  1000. width:100%;
  1001. height:100%;
  1002. background:{color:Panel background};
  1003. z-index:10000;
  1004. overflow:hidden;
  1005. display:none;
  1006. }
  1007.  
  1008. #afbox{
  1009. position:fixed;
  1010. top:50%;
  1011. left:50%;
  1012. width:910px;
  1013. height:530px;
  1014. background:{color:Panel background};
  1015. z-index:10000;
  1016. overflow:hidden;
  1017. -webkit-transform: translateX(-50%) translateY(-50%);
  1018. -moz-transform: translateX(-50%) translateY(-50%);
  1019. -ms-transform: translateX(-50%) translateY(-50%);
  1020. transform: translateX(-50%) translateY(-50%);
  1021. }
  1022.  
  1023. /* Affiliates title */
  1024.  
  1025. #affiliates_title {
  1026. position:absolute;
  1027. margin-top:0px;
  1028. right:0px;
  1029. width:180px;
  1030. height:530px;
  1031. color:{color:Panel text};
  1032. border-left:1px solid {color:Panel text};
  1033. }
  1034.  
  1035. #affiliates_titlein {
  1036. position:absolute;
  1037. top:50%;
  1038. right:-100%;
  1039. height:220px;
  1040. width:500px;
  1041. font-size:15px;
  1042. line-height:22px;
  1043. text-align:left;
  1044. color:{color:Panel text};
  1045. border-top:5px solid {color:Accent};
  1046. -ms-transform: translateY(-50%) rotate(-90deg);
  1047. -webkit-transform: translateY(-50%) rotate(-90deg);
  1048. transform: translateY(-50%) rotate(-90deg);
  1049. }
  1050.  
  1051. #affiliates_title h1 {
  1052. font-size:85px;
  1053. line-height:100%;
  1054. border:none;
  1055. }
  1056.  
  1057. #affiliates_titlein::first-letter{
  1058. color:{color:Accent}!important;
  1059. }
  1060.  
  1061. /* Affiliates icons */
  1062.  
  1063. #aficons{
  1064. position:absolute;
  1065. top:0px;
  1066. left:0px;
  1067. height:530px;
  1068. width:720px;
  1069. font-size:15px;
  1070. line-height:22px;
  1071. text-align:left;
  1072. color:{color:Description};
  1073. }
  1074.  
  1075. .aficon{
  1076. float:left;
  1077. display:inline-block;
  1078. width:170px;
  1079. height:170px;
  1080. margin-right:10px;
  1081. margin-bottom:10px;
  1082. background:#ddd;
  1083. }
  1084.  
  1085. .aficon img, .aficonbig img{
  1086. width:100%;
  1087. height:100%;
  1088. }
  1089.  
  1090. .afborder{
  1091. position:absolute;
  1092. margin-top:-166px;
  1093. margin-left:10px;
  1094. width:146px;
  1095. height:146px;
  1096. border:2px solid {color:Accent};
  1097. z-index:100;
  1098. }
  1099.  
  1100. .aficon:hover .afborder{
  1101. opacity:0;
  1102. }
  1103.  
  1104. .afhover{
  1105. position:absolute;
  1106. margin-top:-175px;
  1107. margin-left:0px;
  1108. height:170px;
  1109. width:170px;
  1110. background:rgba(0,0,0,0.7);
  1111. z-index:100;
  1112. opacity:0;
  1113. }
  1114.  
  1115. .afname{
  1116. position:absolute;
  1117. margin-top:65px;
  1118. margin-left:20px;
  1119. height:60px;
  1120. width:130px;
  1121. color:#eee;
  1122. text-align:center;
  1123. font-size:20px;
  1124. font-weight:700;
  1125. font-family:{select:Title font};
  1126. text-transform:uppercase;
  1127. z-index:100;
  1128. }
  1129.  
  1130. .afdivider{
  1131. margin-top:10px;
  1132. margin-left:auto;
  1133. margin-right:auto;
  1134. width:50px;
  1135. border:1px solid {color:Accent};
  1136. }
  1137.  
  1138. .aficon:hover .afhover{
  1139. opacity:1;
  1140. }
  1141.  
  1142. /* Afilliates big icon */
  1143.  
  1144. .aficonbig{
  1145. float:right;
  1146. display:inline-block;
  1147. width:350px;
  1148. height:350px;
  1149. margin-right:10px;
  1150. margin-bottom:10px;
  1151. background:#ddd;
  1152. }
  1153.  
  1154. .aficonbighover{
  1155. position:absolute;
  1156. margin-top:-335px;
  1157. margin-left:20px;
  1158. width:310px;
  1159. height:310px;
  1160. background: {color:Accent};
  1161. z-index:100;
  1162. opacity:0;
  1163. -webkit-box-shadow: 0px 10px 5px 5px rgba(0,0,0,0.19);
  1164. -moz-box-shadow: 0px 10px 5px 5px rgba(0,0,0,0.19);
  1165. box-shadow: 0px 10px 5px 5px rgba(0,0,0,0.19);
  1166. }
  1167.  
  1168. .afnamebig{
  1169. position:absolute;
  1170. margin-top:130px;
  1171. margin-left:40px;
  1172. height:50px;
  1173. width:230px;
  1174. color:#eee;
  1175. font-size:25px;
  1176. line-height:27px;
  1177. font-family:{select:Title font};
  1178. font-weight:700;
  1179. text-align:center;
  1180. text-transform:uppercase;
  1181. z-index:100;
  1182. }
  1183.  
  1184. .afnamebig span{
  1185. font-weight:400;
  1186. font-size:15px;
  1187. }
  1188.  
  1189. .aficonbig:hover .aficonbighover{
  1190. opacity:0.9;
  1191. }
  1192.  
  1193. /* Close buttons */
  1194.  
  1195. #close1, #close2, #close3{
  1196. position:absolute;
  1197. bottom:20px;
  1198. right:20px;
  1199. width:40px;
  1200. height:40px;
  1201. padding:5px;
  1202. line-height:50px;
  1203. text-align:center;
  1204. border:1px solid {color:Borders};
  1205. background:{color:Borders};
  1206. cursor:pointer;
  1207. z-index:10000;
  1208. }
  1209.  
  1210. #close1 span, #close2 span, #close3 span{
  1211. color:{color:Panel link};
  1212. font-size:20px;
  1213. }
  1214.  
  1215. #close1:hover, #close1:hover span, #close2:hover, #close2:hover span, #close3:hover, #close3:hover span{
  1216. color:{color:Hover};
  1217. }
  1218.  
  1219. /*-- FOOTER --*/
  1220.  
  1221. #footer{
  1222. margin-top:0px;
  1223. margin-left:0px;
  1224. width:calc(100% - 60px);
  1225. padding:20px 30px;
  1226. font-size:13px;
  1227. height:30px;
  1228. line-height:30px;
  1229. color:{color:Footer text};
  1230. background:{color:Footer background};
  1231. }
  1232.  
  1233. #footer a{
  1234. color:{color:Accent};
  1235. }
  1236.  
  1237. /* Footer avatar */
  1238.  
  1239. #footer_avatar{
  1240. float:left;
  1241. margin-top:-3px;
  1242. margin-right:20px;
  1243. width:30px;
  1244. height:30px;
  1245. z-index:10000;
  1246. {block:ifCircularAvatar}
  1247. border-radius:100px;
  1248. {/block:ifCircularAvatar}
  1249. }
  1250.  
  1251. #footer_avatar img{
  1252. margin:auto;
  1253. width:100%;
  1254. height:100%;
  1255. border:2px solid {color:Avatar border};
  1256. {block:ifCircularAvatar}
  1257. border-radius:100px;
  1258. {/block:ifCircularAvatar}
  1259. }
  1260.  
  1261. /* Social icons */
  1262.  
  1263. #socialicons{
  1264. float:right;
  1265. text-align:right;
  1266. height:30px;
  1267. line-height:30px;
  1268. }
  1269.  
  1270. #socialicons span {
  1271. margin-left:10px;
  1272. color:{color:Footer icon};
  1273. font-size:13px;
  1274. }
  1275.  
  1276. #socialicons span:hover{
  1277. color:{color:Hover};
  1278. }
  1279.  
  1280. /*----- MAIN CONTAINER -----*/
  1281.  
  1282. #container{
  1283. position:relative;
  1284. margin-top:0px;
  1285. margin-left:0px;
  1286. {block:HomePage}
  1287. position:absolute;
  1288. top:100%;
  1289. left:0%;
  1290. {/block:HomePage}
  1291. width:100%;
  1292. }
  1293.  
  1294. /*------ POSTS AND ENTRIES -----*/
  1295.  
  1296. #posts {
  1297. display:block;
  1298. position:relative;
  1299. margin-left:auto;
  1300. margin-right:auto;
  1301. margin-top:40px;
  1302. width:calc(({select:Post width}px + 72px) * {select:Number of columns})!important;
  1303. max-width:1116px!important;
  1304. {block:PermalinkPage}
  1305. width:572px!important;
  1306. {/block:PermalinkPage}
  1307. }
  1308.  
  1309. .entry {
  1310. float:left;
  1311. display: block;
  1312. margin:25px!important;
  1313. width: {select:Post width}px;
  1314. padding:10px;
  1315. padding-bottom:0;
  1316. background:rgba({select:Entry background}, {select:Entry transparency});
  1317. border: 1px solid {color:Borders};
  1318. {block:PermalinkPage}
  1319. width:500px;
  1320. margin:25px!important;
  1321. {/block:PermalinkPage}
  1322. }
  1323.  
  1324. .entry img { max-width: 100%; }
  1325.  
  1326. /* -------- RESPONSIVE DESIGN VALUES, editing is not recommended -------- */
  1327.  
  1328. @media only screen and (max-width: 900px) {
  1329.  
  1330. #posts {
  1331. display:block;
  1332. position:relative;
  1333. margin-left:auto;
  1334. margin-right:auto;
  1335. margin-top:40px;
  1336. padding-bottom:80px;
  1337. min-height:500px;
  1338. width:calc(({select:Post width}px + 72px) * {select:Number of columns})!important;
  1339. max-width:944px !important;
  1340. {block:PermalinkPage}
  1341. width:572px!important;
  1342. {/block:PermalinkPage}
  1343. }
  1344.  
  1345. }
  1346.  
  1347. @media only screen and (max-width: 600px) {
  1348.  
  1349. #posts {
  1350. display:block;
  1351. position:relative;
  1352. margin-left:auto;
  1353. margin-right:auto;
  1354. margin-top:40px;
  1355. padding-bottom:80px;
  1356. min-height:500px;
  1357. width:calc(({select:Post width}px + 72px) * {select:Number of columns})!important;
  1358. max-width:572px!important;
  1359. {block:PermalinkPage}
  1360. width:572px!important;
  1361. {/block:PermalinkPage}
  1362. }
  1363.  
  1364. }
  1365.  
  1366. /* -- POST STYLES -- */
  1367.  
  1368. /* Quote posts */
  1369.  
  1370. .quote {
  1371. margin:5px;
  1372. padding:10px;
  1373. font-family:{select:Title font};
  1374. font-size:200%;
  1375. line-height:130%;
  1376. color:{color:Italic};
  1377. height:auto;
  1378. text-align:center;
  1379. letter-spacing:1px;
  1380. }
  1381.  
  1382. .source {
  1383. margin-top:5px;
  1384. margin-bottom:10px;
  1385. font-family:{font:Body font};
  1386. font-size:15px;
  1387. height:25px;
  1388. line-height:25px;
  1389. text-align:left;
  1390. overflow:hidden;
  1391. }
  1392.  
  1393. .source span{
  1394. float:left;
  1395. margin-right:10px;
  1396. color:{color:Link};
  1397. padding:5px;
  1398. padding-right:10px;
  1399. font-size:15px;
  1400. border-right:1px solid {color:Borders};
  1401. }
  1402.  
  1403. /* Link posts */
  1404.  
  1405. #linktitle{
  1406. width:calc(100% - 10px);
  1407. color:{color:Title};
  1408. font-family:{select:Title font};
  1409. font-size:200%;
  1410. line-height:150%;
  1411. background:{color:Borders};
  1412. border-radius:{text:Border radius};
  1413. padding:5px;
  1414. {block:ifEntryBorderTransparent}
  1415. background:transparent;
  1416. border:1px solid transparent;
  1417. {/block:ifEntryBorderTransparent}
  1418. }
  1419.  
  1420. #linktitle a{
  1421. color:{color:Link};
  1422. }
  1423.  
  1424. #linktitle span{
  1425. color:{color:Icon};
  1426. }
  1427.  
  1428. #linktitle:hover{
  1429. color:{color:Hover};
  1430. }
  1431.  
  1432. /* Audio posts */
  1433.  
  1434. .album img{
  1435. float:left;
  1436. margin-top:0px;
  1437. width:70px;
  1438. height:70px;
  1439. margin-left:5px;
  1440. margin-right:10px;
  1441. float:left;
  1442. z-index:10;
  1443. border: 1px solid {color:Borders};
  1444. border-radius:100%;
  1445. }
  1446.  
  1447. .play{
  1448. position:absolute;
  1449. margin:22px 25px;
  1450. width:31px;
  1451. height:29px;
  1452. padding-top:2px;
  1453. line-height:31px;
  1454. overflow:hidden;
  1455. background:#fff;
  1456. border-radius:100%;
  1457. }
  1458.  
  1459. .audio{
  1460. width:160px;
  1461. min-height:80px;
  1462. margin-top:10px;
  1463. z-index:10;
  1464. font-size:12px;
  1465. line-height:25px;
  1466. overflow:hidden;
  1467. }
  1468.  
  1469. .audio h1{
  1470. font-size:20px;
  1471. border-bottom:1px solid transparent;
  1472. }
  1473.  
  1474. /* Ask posts */
  1475.  
  1476. .question{
  1477. width:100%;
  1478. height:auto;
  1479. line-height:20px;
  1480. color:{color:Answer};
  1481. }
  1482.  
  1483. .questionin{
  1484. margin-left:45px;
  1485. width:calc(100% - 65px);
  1486. min-height:24px;
  1487. line-height:24px;
  1488. padding:5px;
  1489. padding-left:10px;
  1490. padding-right:10px;
  1491. border:1px solid {color:Borders};
  1492. border-top-right-radius:{text:Border radius};
  1493. border-bottom-right-radius:{text:Border radius};
  1494. }
  1495.  
  1496. .question img{
  1497. width:28px;
  1498. padding:3px;
  1499. border:1px solid {color:Borders};
  1500. margin-right:4px;
  1501. border-top-left-radius:{text:Border radius};
  1502. border-bottom-left-radius:{text:Border radius};
  1503. }
  1504.  
  1505. .answer{
  1506. margin-top:5px;
  1507. width:calc(100% - 10px);
  1508. padding:5px;
  1509. }
  1510.  
  1511. /* Chat posts */
  1512.  
  1513. .chat ul {
  1514. display:block;
  1515. list-style:none;
  1516. margin-left:-40px;
  1517. }
  1518.  
  1519. /* Chat lines style */
  1520. .chat li {
  1521. padding:3px;
  1522. display:block;
  1523. }
  1524.  
  1525. /* Odd lines style */
  1526. .chat .odd {
  1527. color:{color:Chat 1};
  1528. }
  1529.  
  1530. /* Even lines style */
  1531. .chat .even {
  1532. color:{color:Chat 2};
  1533. }
  1534.  
  1535. /* -- POST INFO -- */
  1536.  
  1537. .info1 {
  1538. height:auto;
  1539. float:center;
  1540. margin-top:-10px;
  1541. margin-bottom:10px;
  1542. margin-left:-10px;
  1543. height:20px;
  1544. width:100%;
  1545. font-size:10px;
  1546. line-height:20px;
  1547. color:{color:Link};
  1548. background:rgba({select:Info background}, {select:Entry transparency});
  1549. border-bottom:1px solid {color:Borders};
  1550. border-top-left-radius:{text:Border radius};
  1551. border-top-right-radius:{text:Border radius};
  1552. padding:5px 10px;
  1553. {block:IndexPage}
  1554. {block:ifHoverForInfo}
  1555. opacity:0;
  1556. position:absolute;
  1557. {/block:ifHoverForInfo}
  1558. {/block:IndexPage}
  1559. overflow:hidden;
  1560. }
  1561.  
  1562. .entry:hover .info1{
  1563. {block:ifHoverForInfo}
  1564. opacity:1;
  1565. {/block:ifHoverForInfo}
  1566. }
  1567.  
  1568. .date{
  1569. float:right;
  1570. margin-top:0px;
  1571. width:100px;
  1572. text-align:right;
  1573. text-transform:lowercase;
  1574. }
  1575.  
  1576. /* Info 2 */
  1577.  
  1578. .info2 {
  1579. height:auto;
  1580. float:center;
  1581. margin-top:10px;
  1582. margin-left:-10px;
  1583. margin-bottom:0;
  1584. width:100%;
  1585. padding:5px 10px;
  1586. height:20px;
  1587. line-height:20px;
  1588. font-size:11px;
  1589. color:{color:Link};
  1590. background:rgba({select:Info background}, {select:Entry transparency});
  1591. border-top:1px solid {color:Borders};
  1592. border-bottom-left-radius:{text:Border radius};
  1593. border-bottom-right-radius:{text:Border radius};
  1594. {block:ifDisplayTags}
  1595. height:auto;
  1596. {/block:ifDisplayTags}
  1597. {block:IndexPage}
  1598. {block:ifHoverForInfo}
  1599. opacity:0;
  1600. position:absolute;
  1601. bottom:0;
  1602. {/block:ifHoverForInfo}
  1603. {/block:IndexPage}
  1604. {block:PermalinkPage}
  1605. border-radius:0;
  1606. {/block:PermalinkPage}
  1607. }
  1608.  
  1609. .entry:hover .info2{
  1610. {block:ifHoverForInfo}
  1611. opacity:1;
  1612. {/block:ifHoverForInfo}
  1613. }
  1614.  
  1615. .info1 a, .info2 a {
  1616. font-size:11px;
  1617. }
  1618.  
  1619. .info1 a:hover, .info2 a:hover{
  1620. color:{color:Hover};
  1621. }
  1622.  
  1623. .info1 b, .info2 b{
  1624. color:transparent;
  1625. margin-left:-5px;
  1626. }
  1627.  
  1628. /* Tags */
  1629.  
  1630. .tags{
  1631. margin-top:-10px;
  1632. margin-left:-5px;
  1633. }
  1634.  
  1635. .tags a{
  1636. margin:2px;
  1637. padding:3px 5px;
  1638. background:rgba({select:Entry background}, {select:Entry transparency});
  1639. }
  1640.  
  1641. /*-- PERMALINK, LIKE AND REBLOG BUTTONS --*/
  1642.  
  1643. .post_buttons {
  1644. width:45px;
  1645. height:19px;
  1646. margin-left:calc(100% - 70px);
  1647. margin-top:-20px;
  1648. padding-top:2px;
  1649. text-align:center;
  1650. z-index:100;
  1651. list-style: none;
  1652. {block:PermalinkPage}
  1653. padding-right:15px;
  1654. {/block:PermalinkPage}
  1655. }
  1656.  
  1657. .post_buttons span{
  1658. font-size:12px;
  1659. color:{color:Post buttons};
  1660. }
  1661.  
  1662. .perma{
  1663. position:absolute;
  1664. width:20px;
  1665. margin-left:-30px;
  1666. margin-top:-20px;
  1667. }
  1668.  
  1669. .rblg{
  1670. position:absolute;
  1671. margin-top:0px;
  1672. margin-left:-5px;
  1673. }
  1674.  
  1675. .like {
  1676. position: relative;
  1677. }
  1678.  
  1679. .like .like_button {
  1680. position: absolute;
  1681. margin-top: -21px;
  1682. margin-left:15px;
  1683. opacity: 0;
  1684. }
  1685.  
  1686. .like .like_button.liked {
  1687. opacity: 1;
  1688. }
  1689.  
  1690. /*-- PERMALINK PAGE --*/
  1691.  
  1692. .postnotes{
  1693. margin: 10px 0px;
  1694. width: 100%;
  1695. font-size: 12px;
  1696. color: {color:Text};
  1697. line-height:20px;
  1698. text-align:left;
  1699. overflow:hidden;
  1700. }
  1701.  
  1702. ol.notes {
  1703. display:block;
  1704. padding: 0px;
  1705. margin: 10px 0px;
  1706. width: 100%;
  1707. list-style-type: none;
  1708. }
  1709.  
  1710. ol.notes li.note {
  1711. padding: 10px;
  1712. border-bottom:1px solid {color:Borders};
  1713. }
  1714.  
  1715. ol.notes li.note img.avatar {
  1716. vertical-align: -5px;
  1717. margin-right: 10px;
  1718. width: 15px;
  1719. height: 15px;
  1720. }
  1721.  
  1722. li.more_notes_link_container {
  1723. text-transform: uppercase;
  1724. font-size: 12px;
  1725. }
  1726.  
  1727. /*-- PAGINATION --*/
  1728.  
  1729. #pager{
  1730. width:100%;
  1731. height:70px;
  1732. margin-top:20px;
  1733. margin-left:auto;
  1734. margin-right:auto;
  1735. }
  1736.  
  1737. #pagination{
  1738. margin:auto;
  1739. width:500px;
  1740. height:30px;
  1741. text-align:center;
  1742. {block:ifInfiniteScrolling}
  1743. display:none;
  1744. {/block:ifInfiniteScrolling}
  1745. }
  1746.  
  1747. .pagicon, .next, .load-more{
  1748. display:inline;
  1749. }
  1750.  
  1751. .pagicon a, .next, .load-more{
  1752. font-size:12px;
  1753. padding:10px;
  1754. margin:10px;
  1755. color:{color:Pagination};
  1756. background:rgba({select:Entry background}, {select:Entry transparency});
  1757. border:1px solid {color:Borders};
  1758. border-radius:{text:Border radius};
  1759. }
  1760.  
  1761. .pagicon a:hover, .next:hover, .load-more:hover{
  1762. color:{color:Hover};
  1763. }
  1764.  
  1765. .pagicon span, .next span, .load-more span{
  1766. color:{color:Accent};
  1767. font-size:15px;
  1768. margin:5px;
  1769. text-decoration:none;
  1770. }
  1771.  
  1772. .pagicon:hover span, .next:hover span, .load-more:hover span{
  1773. color:{color:Hover};
  1774. }
  1775.  
  1776. /* -- INFINITE SCROLLING -- */
  1777.  
  1778. #infscr-loading {
  1779. display:none!important;
  1780. }
  1781.  
  1782. #iscroll{
  1783. margin:auto;
  1784. width:500px;
  1785. height:30px;
  1786. text-align:center;
  1787. }
  1788.  
  1789. {block:ifLoadMore}
  1790. .load-more{
  1791. height:40px;
  1792. }
  1793. {/block:ifLoadMore}
  1794.  
  1795. /* END CSS */
  1796.  
  1797. {CustomCSS}
  1798.  
  1799. </style>
  1800.  
  1801. </head>
  1802.  
  1803. <title>{Title}
  1804. {block:SearchPage} - {lang:Search results for SearchQuery}{/block:SearchPage}
  1805. {block:TagPage} - {Tag} {/block:TagPage}
  1806. {block:PostSummary}- {PostSummary} {/block:PostSummary}</title>
  1807. {block:Description}<meta name="description" content="{MetaDescription}" />
  1808. {/block:Description}
  1809.  
  1810. <!-- HTML -->
  1811.  
  1812. <body>
  1813.  
  1814. <div id="menu">
  1815. <a href="/"> INDEX</a> /
  1816. <a onclick="toggle_visibility('about');"> ABOUT</a> /
  1817. <a onclick="toggle_visibility('projects');"> PROJECTS</a> /
  1818. <a onclick="toggle_visibility('afilliates');"> AFILLIATES</a> /
  1819. <a href="https://hunterthemes.tumblr.com"> CREDIT</a>
  1820. </div>
  1821. <!--End Menu-->
  1822.  
  1823. {block:HomePage}
  1824. <div class="item-wrapper page-{CurrentPage}"></div>
  1825.  
  1826. {block:ifDisplayHeader}
  1827. <div id="header">
  1828.  
  1829. <div id="box"></div>
  1830. <div id="blog_title">{text:Blog title}</div>
  1831.  
  1832. <div id="statsl">
  1833. <div class="statscl">{text:Stats}</div>
  1834. </div>
  1835. <!--End statsl-->
  1836.  
  1837. <div id="statsr">
  1838. <div class="statscr">{text:Stats 2}</div>
  1839. </div>
  1840. <!--End statsr-->
  1841.  
  1842. </div>
  1843. <!--End Header-->
  1844. {/block:ifDisplayHeader}
  1845.  
  1846. </div>
  1847. <!--End item-wrapper -->
  1848. {/block:HomePage}
  1849.  
  1850. <div id="about">
  1851. <div id="about_panel">
  1852. <div id="panelin">
  1853.  
  1854. <div id="about_title">ABOUT</div><br>
  1855.  
  1856. <span> {text:About first label} </span> {text:About first text} <br>
  1857. <span> {text:About second label} </span> {text:About second text} <br>
  1858. <span> {text:About third label} </span> {text:About third text} <br>
  1859. <span> {text:About fourth label} </span> {text:About fourth text} <br>
  1860. <span> {text:About fifth label} </span> {text:About fifth text} <br>
  1861.  
  1862. <div id="about_description">
  1863. {text:About description}
  1864. </div>
  1865. <!--End description-->
  1866.  
  1867. <div id="search_box">
  1868. <form action="/search" method="get" class="search">
  1869. <input type="text" name="q" value="{SearchQuery}" class="query" placeholder="SEARCH"> <span class="sf sf-search-o"></span>
  1870. </form>
  1871. </div>
  1872. <!-- End search_box -->
  1873.  
  1874. </div>
  1875. <!--End panelin-->
  1876. </div>
  1877. <!--End about_panel-->
  1878.  
  1879. <div id="about_image"></div>
  1880.  
  1881. <div id="close1"><a onclick="toggle_visibility('about');"> <span class="sf sf-cross-o"></span></a></div>
  1882.  
  1883. </div>
  1884. <!--End about-->
  1885.  
  1886. <div id="projects">
  1887.  
  1888. <div id="projects_links">
  1889.  
  1890. <div class="tabs">
  1891.  
  1892. <div class="projects_title"><span class="sf sf-navigation-o"></span> PROJECTS</div>
  1893.  
  1894. <ul class="tab-links">
  1895. <li class="active"><a href="/"> <span> – </span> SHOW ALL </a></li>
  1896. <li><a id="linkone" href="#tab1"> <span> – </span> {text:Project One}</a></li>
  1897. <li><a id="linktwo" href="#tab2"> <span> – </span> {text:Project Two}</a></li>
  1898. <li><a id="linkthree" href="#tab3"> <span> – </span> {text:Project Three}</a></li>
  1899. <li><a id="linkfour" href="#tab4"> <span> – </span> {text:Project Four}</a></li>
  1900. <li><a id="linkfive" href="#tab5"> <span> – </span> {text:Project Five}</a></li>
  1901. </ul>
  1902.  
  1903. </div>
  1904. <!--End tabs-->
  1905. </div>
  1906. <!--End projects_links-->
  1907.  
  1908. <div class="projects_panel">
  1909.  
  1910. <div id="tab1" class="tab">
  1911. <div class="tab_hover">
  1912. <h1>{text:Project One}</h1>
  1913. <div class="tab_description">
  1914. {text:Project One description}
  1915. </div>
  1916. <!--End tab_description-->
  1917. </div>
  1918. <!--End tab_hover-->
  1919. </div>
  1920. <!-- End tab1 -->
  1921.  
  1922. <div id="tab2" class="tab">
  1923. <div class="tab_hover">
  1924. <h1>{text:Project Two}</h1>
  1925. <div class="tab_description">
  1926. {text:Project Two description}
  1927. </div>
  1928. <!--End tab_description-->
  1929. </div>
  1930. <!--End tab_hover-->
  1931. </div>
  1932. <!--End tab2-->
  1933.  
  1934. <div id="tab3" class="tab">
  1935. <div class="tab_hover">
  1936. <h1>{text:Project Three}</h1>
  1937. <div class="tab_description">
  1938. {text:Project Three description}
  1939. </div>
  1940. <!--End tab_description-->
  1941. </div>
  1942. <!--End tab_hover-->
  1943. </div>
  1944. <!--End tab3-->
  1945.  
  1946. <div id="tab4" class="tab">
  1947. <div class="tab_hover">
  1948. <h1>{text:Project Four}</h1>
  1949. <div class="tab_description">
  1950. {text:Project Four description}
  1951. </div>
  1952. <!--End tab_description-->
  1953. </div>
  1954. <!--End tab_hover-->
  1955. </div>
  1956. <!--End tab4-->
  1957.  
  1958. <div id="tab5" class="tab">
  1959. <div class="tab_hover">
  1960. <h1>{text:Project Five}</h1>
  1961. <div class="tab_description">
  1962. {text:Project Five description}
  1963. </div>
  1964. <!--End tab_description-->
  1965. </div>
  1966. <!--End tab_hover-->
  1967. </div>
  1968. <!--End tab5-->
  1969.  
  1970. </div>
  1971. <!--End projects_panel-->
  1972.  
  1973. <div id="close2"><a onclick="toggle_visibility('projects');"> <span class="sf sf-cross-o"></span></a></div>
  1974.  
  1975. </div>
  1976. <!--End projects-->
  1977.  
  1978.  
  1979. <div id="afilliates">
  1980.  
  1981. <div id="afbox">
  1982.  
  1983. <div id="affiliates_title">
  1984.  
  1985. <div id="affiliates_titlein">
  1986.  
  1987. <h1> AFILLIATES </h1>
  1988.  
  1989. {text:Afilliates text}
  1990.  
  1991. </div>
  1992. <!-- End affiliates_titlein -->
  1993. </div>
  1994. <!-- End affiliates_title -->
  1995.  
  1996. <div id="aficons">
  1997.  
  1998. <div class="aficon">
  1999. <img src="{image:Member One image}">
  2000. <div class="afborder"></div>
  2001. <!-- End afborder -->
  2002. <div class="afhover">
  2003. <div class="afname"> {text:Member One}
  2004. <div class="afdivider"></div>
  2005. </div>
  2006. <!-- End afname -->
  2007. </div>
  2008. <!-- End afhover -->
  2009. </div>
  2010. <!-- End aficon -->
  2011.  
  2012. <div class="aficon">
  2013. <img src="{image:Member Two image}">
  2014. <div class="afborder"></div>
  2015. <!-- End afborder -->
  2016. <div class="afhover">
  2017. <div class="afname"> {text:Member Two}
  2018. <div class="afdivider"></div>
  2019. </div>
  2020. <!-- End afname -->
  2021. </div>
  2022. <!-- End afhover -->
  2023. </div>
  2024. <!-- End aficon -->
  2025.  
  2026. <div class="aficonbig">
  2027. <img src="{image:Member Three image}">
  2028. <div class="aficonbighover">
  2029. <div class="afnamebig">
  2030. {text:Member Three}
  2031. <span> {text:Member Three Role} </span>
  2032. </div>
  2033. </div>
  2034. <!-- End aficonbighover -->
  2035. </div>
  2036. <!-- End aficonbig -->
  2037.  
  2038. <div class="aficon">
  2039. <img src="{image:Member Four image}">
  2040. <div class="afborder"></div>
  2041. <!-- End afborder -->
  2042. <div class="afhover">
  2043. <div class="afname"> {text:Member Four}
  2044. <div class="afdivider"></div>
  2045. </div>
  2046. <!-- End afname -->
  2047. </div>
  2048. <!-- End afhover -->
  2049. </div>
  2050. <!-- End aficon -->
  2051.  
  2052. <div class="aficon">
  2053. <img src="{image:Member Five image}">
  2054. <div class="afborder"></div>
  2055. <!-- End afborder -->
  2056. <div class="afhover">
  2057. <div class="afname"> {text:Member five}
  2058. <div class="afdivider"></div>
  2059. </div>
  2060. <!-- End afname -->
  2061. </div>
  2062. <!-- End afhover -->
  2063. </div>
  2064. <!-- End aficon -->
  2065.  
  2066. <div class="aficon">
  2067. <img src="{image:Member Six image}">
  2068. <div class="afborder"></div>
  2069. <!-- End afborder -->
  2070. <div class="afhover">
  2071. <div class="afname"> {text:Member Six}
  2072. <div class="afdivider"></div>
  2073. </div>
  2074. <!-- End afname -->
  2075. </div>
  2076. <!-- End afhover -->
  2077. </div>
  2078. <!-- End aficon -->
  2079.  
  2080. <div class="aficon">
  2081. <img src="{image:Member Seven image}">
  2082. <div class="afborder"></div>
  2083. <!-- End afborder -->
  2084. <div class="afhover">
  2085. <div class="afname"> {text:Member Seven}
  2086. <div class="afdivider"></div>
  2087. </div>
  2088. <!-- End afname -->
  2089. </div>
  2090. <!-- End afhover -->
  2091. </div>
  2092. <!-- End aficon -->
  2093.  
  2094. <div class="aficon">
  2095. <img src="{image:Member Eight image}">
  2096. <div class="afborder"></div>
  2097. <!-- End afborder -->
  2098. <div class="afhover">
  2099. <div class="afname"> {text:Member Eight}
  2100. <div class="afdivider"></div>
  2101. </div>
  2102. <!-- End afname -->
  2103. </div>
  2104. <!-- End afhover -->
  2105. </div>
  2106. <!-- End aficon -->
  2107.  
  2108. <div class="aficon">
  2109. <img src="{image:Member Nine image}">
  2110. <div class="afborder"></div>
  2111. <!-- End afborder -->
  2112. <div class="afhover">
  2113. <div class="afname"> {text:Member Nine}
  2114. <div class="afdivider"></div>
  2115. </div>
  2116. <!-- End afname -->
  2117. </div>
  2118. <!-- End afhover -->
  2119. </div>
  2120. <!-- End aficon -->
  2121.  
  2122.  
  2123. </div>
  2124. <!-- End aficons -->
  2125.  
  2126. </div>
  2127. <!-- End afbox -->
  2128.  
  2129. <div id="close3"><a onclick="toggle_visibility('afilliates');"> <span class="sf sf-cross-o"></span></a></div>
  2130.  
  2131. </div>
  2132. <!-- End afilliates -->
  2133.  
  2134.  
  2135. <div id="container">
  2136.  
  2137. <div id="profile">
  2138.  
  2139. {block:IfDisplayAvatar}
  2140. <div id="avatar"><img src="{image:Avatar}"></div>
  2141. {/block:IfDisplayAvatar}
  2142.  
  2143. <div id="profile_title">{Title}</div>
  2144. <div class="subtitle">{text:Subtitle}</div>
  2145.  
  2146. <div id="main_links">
  2147. <a href="/ask"> ASK BOX</a>
  2148. <a href="/submit"> SUBMIT</a>
  2149. <a href="/archive"> ARCHIVE</a><br>
  2150.  
  2151. {block:IfDisplayLinkOne}
  2152. <a href="{text:Link One Url}">{text:Link One Title}</a>
  2153. {/block:IfDisplayLinkOne}
  2154. {block:IfDisplayLinkTwo}
  2155. <a href="{text:Link Two Url}">{text:Link Two Title}</a>
  2156. {/block:IfDisplayLinkTwo}
  2157. {block:IfDisplayLinkThree}
  2158. <a href="{text:Link Three Url}">{text:Link Three Title}</a>
  2159. {/block:IfDisplayLinkThree}
  2160. {block:IfDisplayLinkFour}
  2161. <a href="{text:Link Four Url}">{text:Link Four Title}</a>
  2162. {/block:IfDisplayLinkFour}
  2163. {block:IfDisplayLinkFive}
  2164. <a href="{text:Link Five Url}">{text:Link Five Title}</a>
  2165. {/block:IfDisplayLinkFive}
  2166.  
  2167. </div>
  2168. <!--main_links-->
  2169.  
  2170. <div class="divider"></div>
  2171.  
  2172. <div class="description">
  2173. {Description}
  2174. </div>
  2175. <!--End description-->
  2176.  
  2177. </div>
  2178. <!--End profile-->
  2179.  
  2180. <!-- POSTS -->
  2181.  
  2182. <div id="posts">
  2183.  
  2184. {block:Posts}
  2185.  
  2186. <div class="entry">
  2187.  
  2188. {block:Date}
  2189. <div class="info1">
  2190. <b>-</b>
  2191. <!-- Reblogged from -->
  2192. {block:RebloggedFrom}
  2193. <a href="{ReblogParentURL}">
  2194. via</a> /{/block:RebloggedFrom}
  2195.  
  2196. {block:ContentSource}
  2197. <a href="{SourceURL}"
  2198. target=blank> source</a>
  2199. {/block:ContentSource}
  2200.  
  2201. <div class="date">
  2202. <a href="{Permalink}">
  2203. {shortmonth} {dayofmonth}</a>
  2204. </div>
  2205. <!--End date-->
  2206.  
  2207. </div>
  2208. <!--End info1-->
  2209.  
  2210. {/block:Date}
  2211.  
  2212. <div class="content">
  2213.  
  2214. <!-- Text -->
  2215. {block:Text}
  2216. {block:Title}
  2217. <a href="{Permalink}">
  2218. <h1>{Title}</h1></a>
  2219. {/block:Title}
  2220. {Body}
  2221. {/block:Text}
  2222.  
  2223. <!-- Photo -->
  2224. {block:Photo}
  2225. {block:IndexPage}
  2226. {LinkOpenTag}
  2227. <img src="{PhotoURL-500}" alt="{PhotoAlt}" width="{select:Post width}px"/></a>
  2228. {LinkCloseTag}
  2229. {/block:IndexPage}
  2230. {block:PermalinkPage}
  2231. {LinkOpenTag}
  2232. <img src="{PhotoURL-500}" alt="{PhotoAlt}" width="500px"/></a>
  2233. {LinkCloseTag}
  2234. {/block:PermalinkPage}
  2235. {/block:Photo}
  2236.  
  2237. <!-- Photoset -->
  2238. {block:Photoset}
  2239. {block:IndexPage}
  2240. {Photoset-500}
  2241. {/block:IndexPage}
  2242. {block:PermalinkPage}
  2243. {Photoset-500}
  2244. {/block:PermalinkPage}
  2245. {/block:Photoset}
  2246.  
  2247. <!-- Quote -->
  2248. {block:Quote}
  2249. <div class="source">
  2250. <span class="sf sf-quotation-mark"></span>
  2251. {block:Source}
  2252. {Source}
  2253. {/block:Source}
  2254. </div>
  2255. <!--End source-->
  2256. <div class="quote">
  2257. {Quote}
  2258. </div>
  2259. <!--End quote-->
  2260. {/block:Quote}
  2261.  
  2262. <!-- Link -->
  2263. {block:Link}
  2264. <div id="linktitle">
  2265. <a href="{URL}"
  2266. class="linkpost"
  2267. target="_blank">
  2268. {Name} &raquo; </a>
  2269. </div>
  2270. {block:Description}
  2271. {Description}
  2272. {/block:Description}
  2273. {/block:Link}
  2274.  
  2275. <!-- Chat -->
  2276. {block:Chat}
  2277. <div class="chat">
  2278. <ul>
  2279. {block:Lines}
  2280. <li class="{Alt}">
  2281. {block:Label}<b>{Label}</b>{/block:Label}
  2282. {Line}
  2283. </li>
  2284. {/block:Lines}
  2285. </ul>
  2286. </div>
  2287. {/block:Chat}
  2288.  
  2289. <!-- Audio -->
  2290. {block:Audio}
  2291. <div class="album">
  2292. {block:AlbumArt}
  2293. <img src="{AlbumArtURL}"></a>
  2294. {block:AlbumArt}
  2295. </div>
  2296. <!--End album-->
  2297. <div class="play">
  2298. {block:AudioPlayer}
  2299. {AudioPlayer}
  2300. {/block:AudioPlayer}
  2301. </div>
  2302. <div class="audio">
  2303. {block:TrackName}<h1>{TrackName}</h1>{/block:TrackName}
  2304. {block:Artist}{Artist}{/block:Artist}<br>
  2305. <!--End play-->
  2306. {block:PlayCount}
  2307. {FormattedPlayCount}
  2308. {/block:PlayCount}
  2309. </div>
  2310. <!--End audio-->
  2311. {/block:Audio}
  2312.  
  2313. <!-- Video -->
  2314. {block:Video}
  2315. {block:IndexPage}
  2316. {block:ifNot250pxPosts}
  2317. {Video-500}
  2318. {/block:ifNot250pxPosts}
  2319. {block:if250pxPosts}
  2320. {Video-250}
  2321. {/block:if250pxPosts}
  2322. {/block:IndexPage}
  2323. {block:PermalinkPage}
  2324. {Video-500}
  2325. {/block:PermalinkPage}
  2326. {/block:Video}
  2327.  
  2328. <!-- Ask -->
  2329. {block:Answer}
  2330. <div class="question">
  2331. <img src="{AskerPortraitURL-48}"
  2332. align="left"></div>
  2333. <div class="questionin">
  2334. {Asker}: {Question}</div>
  2335. <div class="answer">
  2336. {Answer}</div>
  2337. {/block:Answer}
  2338.  
  2339. <!-- Caption -->
  2340. {block:IndexPage}
  2341. {block:IfDisplayCaptions}
  2342. {block:Caption}
  2343. {Caption}
  2344. {/block:Caption}
  2345. {/block:IfDisplayCaptions}
  2346. {/block:IndexPage}
  2347. {block:PermalinkPage}
  2348. {block:Caption}
  2349. {Caption}
  2350. {/block:Caption}
  2351. {/block:PermalinkPage}
  2352.  
  2353. </div>
  2354. <!--End content-->
  2355.  
  2356. <!-- Date -->
  2357. {block:Date}
  2358.  
  2359. <div class="info2">
  2360.  
  2361. <b>-</b>
  2362. {block:NoteCount}
  2363. <a href="{Permalink}">
  2364. {NoteCountWithLabel}</a>
  2365. {/block:NoteCount}
  2366.  
  2367. <!-- Permalink, reblog and like buttons -->
  2368. <ul class="post_buttons">
  2369.  
  2370. <li class="rblg"><a href="{ReblogUrl}"><span class="sf sf-refresh-o"></span></a></li>
  2371.  
  2372. <li class="like">
  2373. <span class="sf sf-heart-o"></span>
  2374. {LikeButton size="15"}
  2375. </li>
  2376.  
  2377. {block:IndexPage}
  2378. <div class="perma"><a href="{Permalink}"><span class="sf sf-aero-cursor-o"></span></a></div>
  2379. {/block:IndexPage}
  2380.  
  2381. </ul>
  2382. <!-- End post_buttons -->
  2383.  
  2384. <!-- Tags -->
  2385. {block:IndexPage}
  2386. {block:IfDisplayTags}
  2387. <div class="tags">
  2388. {block:HasTags}
  2389. {block:Tags}
  2390. <a href="{TagURL}">#{Tag}</a>
  2391. {/block:Tags}
  2392. {/block:HasTags}
  2393. </div>
  2394. {/block:IfDisplayTags}
  2395. {/block:IndexPage}
  2396. {block:PermalinkPage}
  2397. <div class="tags">
  2398. {block:HasTags}
  2399. {block:Tags}
  2400. <a href="{TagURL}">#{Tag}</a>
  2401. {/block:Tags}
  2402. {/block:HasTags}
  2403. </div>
  2404. {/block:PermalinkPage}
  2405.  
  2406. </div>
  2407. <!--End info2-->
  2408. {/block:Date}
  2409.  
  2410. <!-- Permalink page -->
  2411. {block:PermalinkPage}
  2412. <!-- Post notes-->
  2413. {block:PostNotes}
  2414. <div class="postnotes">
  2415. <h2>Post notes:</h2>
  2416. {PostNotes}
  2417. </div>
  2418. {/block:PostNotes}
  2419. {/block:PermalinkPage}
  2420.  
  2421. <!-- Other -->
  2422. {block:ContentSource}
  2423. <!-- {SourceURL}
  2424. {block:SourceLogo}
  2425. <img src="{#000LogoURL}"
  2426. width="{LogoWidth}"
  2427. height="{LogoHeight}"
  2428. alt="{SourceTitle}" />
  2429. {/block:SourceLogo}
  2430. {block:NoSourceLogo}
  2431. {SourceLink}
  2432. {/block:NoSourceLogo} -->
  2433. {/block:ContentSource}
  2434.  
  2435. </div>
  2436. <!--End entry-->
  2437.  
  2438. {/block:Posts}
  2439.  
  2440. </div>
  2441. <!-- End posts -->
  2442.  
  2443. {block:Pagination}
  2444.  
  2445. <div id="pager">
  2446.  
  2447. <div id="pagination">
  2448. {block:PreviousPage}
  2449. <span class="pagicon">
  2450. <a href="{PreviousPage}#container"><span class="sf sf-arrow-left"></span> NEWER </a>
  2451. </span>
  2452. {/block:PreviousPage}
  2453.  
  2454. <span class="pagicon">
  2455. <a href="#"><span class="sf sf-arrow-up"></span> TOP </a></span>
  2456.  
  2457. {block:NextPage}
  2458. <a class="next" href="{NextPage}#container"> OLDER <span class="sf sf-arrow-right"></span></a>
  2459. </span>
  2460. {/block:NextPage}
  2461. </div>
  2462. <!--End pagination-->
  2463.  
  2464. <div id="iscroll">
  2465. {block:ifLoadMore}
  2466. <span class="pagicon">
  2467. <a href="#"><span class="sf sf-arrow-up"></span> TOP </a>
  2468. </span>
  2469.  
  2470. <a href="#" class="load-more"> MORE <span class="sf sf-plus-round"></span></a>
  2471. {/block:ifLoadMore}
  2472. </div>
  2473. <!--End iscroll-->
  2474.  
  2475. </div>
  2476. <!--End pager-->
  2477.  
  2478. {/block:Pagination}
  2479.  
  2480. {block:IndexPage}
  2481. <div id="footer">
  2482.  
  2483. <div id="socialicons">
  2484.  
  2485. {block:IfDisplayTumblr}<a href="{text:Tumblr url}" title="Tumblr"><span class="sf sf-tumblr"></span></a>{/block:IfDisplayTumblr}
  2486. {block:IfDisplayFacebook}<a href="{text:Facebook url}" target = "_blank" title="facebook"><span class="sf sf-facebook"></span></a>{/block:IfDisplayFacebook}
  2487. {block:IfDisplayPinterest}<a href="{text:Pinterest url}" title="Pinterest"><span class="sf sf-pinterest"></span></a>{/block:IfDisplayPinterest}
  2488. {block:IfDisplayLinkedin}<a href="{text:Linkedin url}" title="Linkedin"><span class="sf sf-linkedin"></span></i></a>{/block:IfDisplayLinkedin}
  2489. {block:IfDisplayInstagram}<a href="{text:Instagram url}" title="instagram"><span class="sf sf-instagram"></span></a>{/block:IfDisplayInstagram}
  2490. </div>
  2491. <!--End socialicons-->
  2492.  
  2493. {block:IfDisplayAvatar}
  2494. <div id="footer_avatar"><img src="{image:Avatar}"></div>
  2495. {/block:IfDisplayAvatar}
  2496.  
  2497. @ COPYRIGHT 2015 - 2017 | THEME BY <a href="https://hunterthemes.tumblr.com"> HUNTER THEMES</a>
  2498.  
  2499. </div>
  2500. <!-- End footer -->
  2501. {/block:IndexPage}
  2502.  
  2503. </div>
  2504. <!--End container-->
  2505.  
  2506. </body>
  2507.  
  2508. <!----- SCRIPTS ----->
  2509.  
  2510. <!-- Saturn icons -->
  2511.  
  2512. <link href="https://dl.dropbox.com/s/50g6fbds3rh4m0j/saturnicons.css" rel="stylesheet">
  2513.  
  2514. <!--Jquery-->
  2515.  
  2516. <script src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-3.3.1.min.js"></script>
  2517.  
  2518. <!-- Style my tooltips -->
  2519.  
  2520. <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  2521. <script src="https://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
  2522.  
  2523. <script>
  2524. (function($){
  2525. $(document).ready(function(){
  2526. $("a[title]").style_my_tooltips({
  2527. tip_follows_cursor:true,
  2528. tip_delay_time: 90,
  2529. tip_fade_speed: 600,
  2530. attribute:"title"
  2531. });
  2532. });
  2533. })(jQuery);
  2534. </script>
  2535.  
  2536. <script>
  2537. <!--
  2538. function toggle_visibility(id) {
  2539. var e = document.getElementById(id);
  2540. if(e.style.display == 'block')
  2541. e.style.display = 'none';
  2542. else
  2543. e.style.display = 'block';
  2544. }
  2545. //-->
  2546. </script>
  2547.  
  2548. <!-- TABS/ALL-INN-ONE SCRIPTS -->
  2549.  
  2550. <script>
  2551. $(document).ready(function() {
  2552. $('.tabs .tab-links a').on('click', function(e) {
  2553. var currentAttrValue = $(this).attr('href');
  2554.  
  2555. // Show/Hide Tab links
  2556. $('.tabs ' + currentAttrValue).fadeIn(600).siblings().hide();
  2557.  
  2558. // Tabs active
  2559. $('.projects_panel ' + currentAttrValue).addClass('active').siblings().removeClass('active');
  2560.  
  2561. // Change/remove current tab to active
  2562. $(this).parent('li').addClass('active').siblings().removeClass('active');
  2563.  
  2564. e.preventDefault();
  2565. });
  2566. });
  2567. </script>
  2568.  
  2569. <script>
  2570. $(document).ready(function() {
  2571. $('#filterOptions li a').click(function() {
  2572. // fetch the class of the clicked item
  2573. var ourClass = $(this).attr('class');
  2574.  
  2575. // reset the active class on all the buttons
  2576. $('#filterOptions li').removeClass('active');
  2577. // update the active state on our clicked button
  2578. $(this).parent().addClass('active');
  2579.  
  2580. if(ourClass == 'all') {
  2581. // show all our items
  2582. $('#ourHolder').children('div.item').show();
  2583. }
  2584. else {
  2585. // hide all elements that don't share ourClass
  2586. $('#ourHolder').children('div:not(.' + ourClass + ')').hide();
  2587. // show all elements that do share ourClass
  2588. $('#ourHolder').children('div.' + ourClass).show();
  2589. }
  2590. return false;
  2591. });
  2592. });
  2593. </script>
  2594.  
  2595. <script>
  2596. $(document).ready(function(){
  2597.  
  2598. $("#linkone").click(function(){
  2599. $("#tab1").show();
  2600. });
  2601.  
  2602. $("#linktwo").click(function(){
  2603. $("#tab2").show();
  2604. });
  2605.  
  2606. $("#linkfour").click(function(){
  2607. $("#tab1").hide();
  2608. });
  2609.  
  2610. $("#linkfive").click(function(){
  2611. $("#tab1").hide();
  2612. $("#tab2").hide();
  2613. });
  2614.  
  2615. });
  2616. </script>
  2617.  
  2618. <!--Sticky menu-->
  2619.  
  2620. <script>
  2621. $(function(){
  2622. var stickyRibbonTop = $('#container').offset().top;
  2623. $(window).scroll(function(){
  2624. if( $(window).scrollTop() > stickyRibbonTop ) {
  2625. $('#menu').css({background:'{color:Accent}'});
  2626. } else {
  2627. $('#menu').css({background:'transparent'});
  2628. }
  2629. });
  2630. });
  2631. </script>
  2632.  
  2633. {block:IndexPage}
  2634.  
  2635. <script src="https://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
  2636.  
  2637. {block:ifInfiniteScrolling}
  2638. <script src="https://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
  2639. {/block:ifInfiniteScrolling}
  2640.  
  2641. {/block:IndexPage}
  2642.  
  2643. <script>
  2644. $(document).ready(function(){
  2645. $('.photo-slideshow').pxuPhotoset({
  2646. lightbox: true,
  2647. rounded: false,
  2648. gutter: '1px',
  2649. photoset: '.photo-slideDisplay',
  2650. photoWrap: '.photo-data',
  2651. photo: '.pxu-photo'
  2652. });
  2653. {block:IndexPage}
  2654. var $container = $('#posts');
  2655. $container.masonry({ itemSelector: '.entry' });
  2656. $container.imagesLoaded(function(){
  2657. $container.masonry();
  2658. $container.find('.entry').animate({ opacity: 1, zIndex: 1 });
  2659. });
  2660. {block:ifInfiniteScrolling}
  2661. $container.infinitescroll({
  2662. itemSelector: '.entry',
  2663. navSelector: '.pagination',
  2664. nextSelector: '.next',
  2665. loadingImg: '',
  2666. loadingText: '<em></em>',
  2667. bufferPx: 2000
  2668. },
  2669. function( newElements ) {
  2670. var $newElems = $( newElements );
  2671. $newElems.find('.photo-slideshow').pxuPhotoset({
  2672. lightbox: true,
  2673. rounded: false,
  2674. gutter: '1px',
  2675. photoset: '.photo-slideshow',
  2676. photoWrap: '.photo-data',
  2677. photo: '.pxu-photo'
  2678. },
  2679. function(){
  2680. $container.masonry();
  2681. });
  2682. $newElems.imagesLoaded(function(){
  2683. $container.masonry( 'appended', $newElems );
  2684. $newElems.animate({ opacity: 1, zIndex: 1 });
  2685. });
  2686. });
  2687. {/block:ifInfiniteScrolling}
  2688. $container.infinitescroll({
  2689. itemSelector: ".entry",
  2690. navSelector: "#pagination",
  2691. nextSelector: ".next",
  2692. loadingImg: "",
  2693. loadingText: "<em></em>",
  2694. bufferPx: 10000,
  2695. extraScrollPx: 12000,
  2696. errorCallback: function() {
  2697. $('.load-more').fadeOut();
  2698. }
  2699. }, function(newElements) {
  2700. var $newElems = $(newElements).css({
  2701. opacity: 0
  2702. });
  2703. $newElems.imagesLoaded(function() {
  2704. $newElems.animate({
  2705. opacity: 1
  2706. });
  2707. $container.masonry('appended', $newElems,
  2708. true);
  2709. });
  2710. });
  2711. {block:ifLoadMore}
  2712. $(window).unbind('.infscr');
  2713. $('.load-more').click(function() {
  2714. $container.infinitescroll('retrieve');
  2715. return false
  2716. });
  2717. {/block:ifLoadMore}
  2718. {/block:IndexPage}
  2719. });
  2720. </script>
  2721.  
  2722. <link href="https://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
  2723.  
  2724. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
  2725.  
  2726. {/block:IndexPage}
  2727.  
  2728. </html>
  2729.  
  2730. <!-- END HTML -->
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!