Advertisement
roxiestheme

Fansite 002

Mar 6th, 2017 (edited)
15,978
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 59.04 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!--
  6.  
  7. >> THEMES OF ROXIE
  8.  
  9. Fansite 002 by roxiestheme
  10. roxiestheme.tumblr.com
  11. 2017 ⓒ All Rights Reserved.
  12.  
  13. ---
  14.  
  15. >> TERMS OF USE
  16.  
  17. Do NOT remove the credit
  18. Do NOT use as a base code
  19. Do NOT republish
  20. Do NOT claim as your own
  21.  
  22. ---
  23.  
  24. >> SPECIAL THANKS
  25.  
  26. Fonts by Google Fonts
  27. Icons by Linearicons
  28. Extended photoset by PixelUnion
  29. Video width fix by shythemes
  30. Custom like button by cubthemes
  31.  
  32. -->
  33.  
  34. <meta charset="utf-8" />
  35. <meta name="viewport" content="width=device-width; initial-scale=1" />
  36. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  37.  
  38. <!-- THEME OPTIONS -->
  39. <meta name="color:Background Color" content="#f6f6f6" />
  40. <meta name="color:Post Background Color" content="#ffffff" />
  41. <meta name="color:Navigation Color" content="#fafafa" />
  42. <meta name="color:Border Color" content="#eeeeee" />
  43. <meta name="color:Text Color" content="#888888" />
  44. <meta name="color:Link Color" content="#666666" />
  45. <meta name="color:Accent" content="#9cdfed" />
  46.  
  47. <meta name="select:Font Family" content="'Karla', sans-serif" title="Karla" />
  48. <meta name="select:Font Family" content="'Open Sans', sans-serif" title="Open Sans" />
  49. <meta name="select:Font Family" content="'Roboto', sans-serif" title="Roboto" />
  50. <meta name="select:Font Family" content="'Lato', sans-serif" title="Lato" />
  51.  
  52. <meta name="select:Font Size" content="11px" title="11px" />
  53. <meta name="select:Font Size" content="10px" title="10px" />
  54. <meta name="select:Font Size" content="12px" title="12px" />
  55.  
  56. <meta name="select:Banner Side Position" content="left" title="Left" />
  57. <meta name="select:Banner Side Position" content="right" title="Right" />
  58.  
  59. <meta name="select:Sidebar Width" content="250px" title="250px" />
  60. <meta name="select:Sidebar Width" content="200px" title="200px" />
  61. <meta name="select:Sidebar Width" content="280px" title="280px" />
  62.  
  63. <meta name="select:Post Width" content="540px" title="540px" />
  64. <meta name="select:Post Width" content="400px" title="400px" />
  65. <meta name="select:Post Width" content="500px" title="500px" />
  66.  
  67. <meta name="image:Banner" content="" />
  68. <meta name="image:Banner Side" content="" />
  69. <meta name="image:Description Banner" content="" />
  70.  
  71. <meta name="text:Blog Title" content="" />
  72. <meta name="text:Blog Subtitle" content="" />
  73.  
  74. <meta name="text:Topbar Title Icon" content="star" />
  75.  
  76. <meta name="text:Link 1 Title" content="message" />
  77. <meta name="text:Link 1 Icon" content="envelope" />
  78. <meta name="text:Link 1 Url" content="/ask" />
  79. <meta name="text:Link 2 Title" content="" />
  80. <meta name="text:Link 2 Icon" content="earth" />
  81. <meta name="text:Link 2 Url" content="" />
  82. <meta name="text:Link 3 Title" content="" />
  83. <meta name="text:Link 3 Icon" content="picture" />
  84. <meta name="text:Link 3 Url" content="" />
  85. <meta name="text:Link 4 Title" content="" />
  86. <meta name="text:Link 4 Icon" content="bookmark" />
  87. <meta name="text:Link 4 Url" content="" />
  88. <meta name="text:Link 5 Title" content="" />
  89. <meta name="text:Link 5 Icon" content="pencil" />
  90. <meta name="text:Link 5 Url" content="" />
  91. <meta name="text:Link 6 Title" content="" />
  92. <meta name="text:Link 6 Icon" content="inbox" />
  93. <meta name="text:Link 6 Url" content="" />
  94.  
  95. <meta name="text:Category 1 Title" content="about" />
  96. <meta name="text:Category 1 Icon" content="flag" />
  97. <meta name="text:Category 2 Title" content="projects" />
  98. <meta name="text:Category 2 Icon" content="list" />
  99. <meta name="text:Category 3 Title" content="links" />
  100. <meta name="text:Category 3 Icon" content="link" />
  101. <meta name="text:Category 4 Title" content="status" />
  102. <meta name="text:Category 4 Icon" content="alarm" />
  103. <meta name="text:Category 5 Title" content="updates" />
  104. <meta name="text:Category 5 Icon" content="history" />
  105. <meta name="text:Category 6 Title" content="affiliates" />
  106. <meta name="text:Category 6 Icon" content="heart" />
  107. <meta name="text:Category 7 Title" content="members" />
  108. <meta name="text:Category 7 Icon" content="users" />
  109. <meta name="text:Category 8 Title" content="site info" />
  110. <meta name="text:Category 8 Icon" content="chart-bars" />
  111.  
  112. <meta name="if:Use Avatar" content="0" />
  113. <meta name="if:Light Tumblr Control Buttons" content="1" />
  114.  
  115. <title>{Title}</title>
  116. <link rel="shortcut icon" href="{Favicon}" />
  117. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  118.  
  119. <!-- STYLESHEETS -->
  120. <link rel="stylesheet" type="text/css" href="https://static.tumblr.com/a0dmjhi/Ka7omax1p/layout.css" /> <!-- LAYOUT -->
  121. <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Karla:400,700|Lato:400,700|Open+Sans:400,700|Roboto:400,700" /> <!-- GOOGLE FONT -->
  122. <link rel="stylesheet" type="text/css" href="https://cdn.linearicons.com/free/1.0.0/icon-font.min.css" /> <!-- LINEARICONS -->
  123.  
  124. <!-- SCRIPTS -->
  125. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <!-- JQUERY -->
  126. <script src="https://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script> <!-- TOOLTIP -->
  127. <script src="https://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script> <!-- EXTENDED PHOTOSET BY PIXELUNION -->
  128. <script src ="https://static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script> <!-- FIX VIDEO WIDTH BY SHYTHEMES -->
  129. <script src="https://cdn.linearicons.com/free/1.0.0/svgembedder.min.js"></script><!-- LINEARICONS -->
  130.  
  131. <style type="text/css">
  132.  
  133. /*----- BASIC ----*/
  134.  
  135. html, body {
  136. font-family: {select:Font Family};
  137. background: {color:Background Color};
  138. margin: 0px;
  139. padding :0px;
  140. -webkit-font-smoothing: antialiased;
  141. -moz-osx-font-smoothing: grayscale;
  142. }
  143.  
  144. /* LINKS BASIC */
  145. a{
  146. color: {color:Link Color};
  147. }
  148. a:hover{
  149. color: {color:Accent};
  150. }
  151. a, a:hover, a:active{
  152. text-decoration: none;
  153. -webkit-transition: all 0.3s ease-in-out;
  154. -moz-transition: all 0.3s ease-in-out;
  155. -o-transition: all 0.3s ease-in-out;
  156. -ms-transition: all 0.3s ease-in-out;
  157. transition: all 0.3s ease-in-out;
  158. }
  159.  
  160. /* LIST BASIC */
  161. ul, menu, dir{
  162. margin: 0px !important;
  163. padding: 0px !important;
  164. -webkit-margin-before: 0px !important;
  165. -webkit-margin-after: 0px !important;
  166. -webkit-margin-start: 0px !important;
  167. -webkit-margin-end: 0px!important;
  168. -webkit-padding-start: 0px !important;
  169. }
  170.  
  171. /* TOOLTIPS */
  172. #s-m-t-tooltip{
  173. position: absolute;
  174. z-index: 9999999;
  175. margin-top: 5px;
  176. margin-left: 10px;
  177. display: block;
  178. padding: 5px 8px;
  179. background-color: {color:Text Color};
  180. font-family: {select:Font Family};
  181. font-size: calc({select:Font Size} - 2px);
  182. color: {color:Post Background Color};
  183. letter-spacing: 1px;
  184. text-transform: uppercase;
  185. }
  186.  
  187. /* SCROLL BAR */
  188. ::-webkit-scrollbar-thumb {
  189. width: 5px;
  190. border: 1px solid {color:Border Color};
  191. border-right: none;
  192. background-color: {color:Navigation Color};
  193. }
  194. ::-webkit-scrollbar {
  195. width: 5px;
  196. border-left: 1px solid {color:Border Color};
  197. border-right: 4px solid {color:Post Background Color};
  198. background-color: {color:Post Background Color};
  199. }
  200.  
  201. /* SELECTION */
  202. ::-moz-selection{
  203. color: {color:Post Background Color};
  204. background-color: {color:Text Color};
  205. }
  206. ::selection{
  207. color: {color:Post Background Color};
  208. background-color: {color:Text Color};
  209. }
  210.  
  211. /* TUMBLR CONTROLS */
  212. .tmblr-iframe-compact .tmblr-iframe--unified-controls {
  213. z-index: 999999;
  214. position: fixed;
  215. top: 4px;
  216. right: calc(50% - {select:Post Width}/2 - 6px - {select:Sidebar Width});
  217. white-space: nowrap !important;
  218. {block:IfLightTumblrControlButtons}
  219. opacity:0.3;
  220. -webkit-filter: invert(100%);
  221. -moz-filter: invert(100%);
  222. -o-filter: invert(100%);
  223. -ms-filter: invert(100%);
  224. filter: invert(100%);
  225. {/block:IfLightTumblrControlButtons}
  226. -webkit-transform: scale(0.6);
  227. -webkit-transform-origin: top right;
  228. -moz-transform: scale(0.6);
  229. -moz-transform-origin: top right;
  230. -o-transform: scale(0.6);
  231. -o-transform-origin: top right;
  232. -ms-transform: scale(0.6);
  233. -ms-transform-origin: top right;
  234. transform: scale(0.6);
  235. transform-origin: top right;
  236. }
  237.  
  238. /* SCROLL TO TOP */
  239. .scrollToTop{
  240. font-size: 8px;
  241. font-weight: 400;
  242. text-align: center;
  243. width: 72px;
  244. color: {color:Text Color};
  245. text-transform: uppercase;
  246. text-decoration: none;
  247. position: fixed;
  248. bottom: 40px;
  249. right: 20px;
  250. letter-spacing: 1px;
  251. display: none;
  252. z-index: 9999;
  253. }
  254. .scrollToTop:hover{
  255. color: {color:Link Color};
  256. text-decoration: none;
  257. }
  258.  
  259. /*---------------------------------------*/
  260. /*---------------------------------------*/
  261. /*---------------------------------------*/
  262.  
  263. /*----- HEADER -----*/
  264.  
  265. /* HEADER BASIC */
  266. header#blog-header{
  267. position: fixed;
  268. top: 0px;
  269. left: calc(50% - {select:Post Width}/2 - 16px - {select:Sidebar Width});
  270. width: calc({select:Post Width} + 30px + {select:Sidebar Width}*2);
  271. height: 40px;
  272. overflow: hidden;
  273. background-color: {color:Navigation Color};
  274. border: 1px solid {color:Border Color};
  275. border-top: none;
  276. z-index: 9999;
  277. border-bottom-left-radius: 3px;
  278. border-bottom-right-radius: 3px;
  279. }
  280.  
  281. /* ICON */
  282. header#blog-header .icon{
  283. float: left;
  284. margin: 9px 7px 0px 12px;
  285. display: block;
  286. border-radius: 3px;
  287. width: 20px;
  288. height: 20px;
  289. text-align: center;
  290. background-color: {color:Accent};
  291. {block:ifUseAvatar}background-image: url('{PortraitURL-24}');{/block:ifUseAvatar}
  292. }
  293. header#blog-header .icon:before{
  294. {block:ifUseAvatar}display:none;{/block:ifUseAvatar}
  295. font-size: 15px;
  296. line-height: 20px;
  297. color: {color:Post Background Color};
  298. }
  299.  
  300. /* TITLE */
  301. header#blog-header h1{
  302. font-size: calc({select:Font Size} + 4px);
  303. font-weight: 700;
  304. display: block;
  305. float:left;
  306. padding-right:10px;
  307. line-height: 40px;
  308. text-transform: uppercase;
  309. margin: 0px;
  310. }
  311. header#blog-header h1 a{
  312. color: {color:Text Color};
  313. }
  314. header#blog-header h1 a:hover{
  315. color: {color:Link Color};
  316. cursor: help;
  317. }
  318.  
  319. /* SEARCH BAR */
  320. header#blog-header .search{
  321. margin: 8.5px 10px 0px 0px;
  322. float: left;
  323. display: block;
  324. width: 150px;
  325. height: 20px;
  326. overflow: hidden;
  327. border-radius: 3px;
  328. border: 1px solid {color:Border Color};
  329. z-index: 999999;
  330. background-color: {color:Post Background Color};
  331. }
  332. header#blog-header .search input{
  333. display: block;
  334. width: 130px;
  335. height: 20px;
  336. padding: 0px 5px;
  337. background-color: transparent;
  338. border: none;
  339. outline: none;
  340. font-family: {select:Font Family};
  341. font-size: 10px !important;
  342. font-weight: 400 !important;
  343. color: {color:Text Color} !important;
  344. }
  345. header#blog-header .search input.sbutton{
  346. position: absolute;
  347. margin-top: -20px;
  348. margin-left: 130px;
  349. cursor: pointer;
  350. padding: 0px;
  351. display:block;
  352. width: 20px;
  353. height: 20px;
  354. outline: none;
  355. border: none;
  356. border-left: 1px solid {color:Border Color};
  357. font-family: 'Linearicons-Free';
  358. text-align: center;
  359. line-height: 21px;
  360. font-size: 10px !important;
  361. font-weight: normal;
  362. background: {color:Navigation Color};
  363. z-index: 9;
  364. }
  365. ::-webkit-input-placeholder{ color: {color:Text Color}; opacity: 0.5; letter-spacing: 1px; }
  366. ::-moz-input-placeholder{ color: {color:Text Color}; opacity: 0.5; letter-spacing: 1px; }
  367. ::-o-input-placeholder{ color: {color:Text Color}; opacity: 0.5; letter-spacing: 1px; }
  368. ::-ms-input-placeholder{ color: {color:Text Color}; opacity: 0.5; letter-spacing: 1px; }
  369.  
  370. /*---------------------------------------*/
  371. /*---------------------------------------*/
  372. /*---------------------------------------*/
  373.  
  374. /*----- TOPLINKS -----*/
  375.  
  376. .trigger{ /* for sticky nav */
  377. position: relative;
  378. float: left;
  379. height: 1px;
  380. top: 364px;
  381. }
  382. nav.toplinks{
  383. position:relative;
  384. margin-top: -22px;
  385. width: 250px;
  386. height: 20px;
  387. line-height: 20px;
  388. z-index: 99999;
  389. }
  390. nav.toplinks a{
  391. display: block;
  392. float: left;
  393. width: 20px;
  394. height: 20px;
  395. cursor: help;
  396. border-radius: 3px;
  397. font-weight: 400;
  398. font-size: 14px;
  399. text-align: center;
  400. border: 1px solid {color:Border Color};
  401. background-color: {color:Post Background Color};
  402. line-height: 20px;
  403. margin-right: 10px;
  404. color: {color:Text Color};
  405. }
  406. nav.toplinks a:hover{
  407. background-color: {color:Accent};
  408. border: 1px solid {color:Accent};;
  409. color: {color:Post Background Color};
  410. }
  411. nav.toplinks a:first-child{
  412. line-height: 18px;
  413. }
  414. .sticky{
  415. position: relative;
  416. z-index: 99999;
  417. top: 0px;
  418. }
  419. .sticky nav.toplinks{
  420. margin-top: 7.5px;
  421. z-index: 9999999;
  422. }
  423. nav.toplinks,
  424. .sticky nav.toplinks{
  425. -webkit-transition: all 0.3s ease-in-out;
  426. -moz-transition: all 0.3s ease-in-out;
  427. -o-transition: all 0.3s ease-in-out;
  428. -ms-transition: all 0.3s ease-in-out;
  429. transition: all 0.3s ease-in-out;
  430. }
  431.  
  432. /*---------------------------------------*/
  433. /*---------------------------------------*/
  434. /*---------------------------------------*/
  435.  
  436. /*----- BANNER -----*/
  437.  
  438. /* BANNER BASIC */
  439. #banner{
  440. position: relative;
  441. margin: 55px auto 0px auto;
  442. width:calc({select:Post Width} + 32px + {select:Sidebar Width}*2);
  443. height: 350px;
  444. overflow: hidden;
  445. background-color: {color:Accent};
  446. background-image: url('{image:Banner}');
  447. background-repeat: no-repeat;
  448. border-radius: 3px;
  449. }
  450. #banner.left{
  451. background-position: center right;
  452. }
  453. #banner.right{
  454. background-position: center left;
  455. }
  456.  
  457. /* BANNER SIDE */
  458. #banner aside.banner-side{
  459. display: block;
  460. float: {select:Banner Side Position};
  461. width: 208px;
  462. height: 350px;
  463. border: 1px solid {color:Border Color};
  464. background-color: {color:Navigation Color};
  465. }
  466.  
  467. /* BANNER INFO */
  468. #banner section.banner-info{
  469. display: block;
  470. width: 168px;
  471. height: 167.5px;
  472. padding: 20px;
  473. font-size: {select:Font Size};
  474. text-align: center;
  475. color: {color:Text Color};
  476. border-bottom: 1px solid {color:Border Color};
  477. }
  478. #banner section.banner-info .banner-side-img-border{
  479. margin: auto;
  480. display: block;
  481. width: 138px;
  482. height: 138px;
  483. padding: 1px;
  484. background-color:{color:Border Color};
  485. -webkit-clip-path: polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%);
  486. clip-path: polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%);
  487. }
  488. #banner section.banner-info .banner-side-img-wrapper{
  489. margin: auto;
  490. display: block;
  491. width: 130px;
  492. height: 130px;
  493. padding: 4px;
  494. background-color:{color:Navigation Color};
  495. -webkit-clip-path: polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%);
  496. clip-path: polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%);
  497. }
  498. #banner section.banner-info .banner-side-img-wrapper img{
  499. display: block;
  500. width: 130px;
  501. height: 130px;
  502. -webkit-clip-path: polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%);
  503. clip-path: polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%);
  504. }
  505. #banner section.banner-info h1{
  506. margin: 6px 0px 1.5px 0px;
  507. font-size: calc({select:Font Size} + 7px);
  508. line-height: calc({select:Font Size} + 7px);
  509. font-weight: 700;
  510. letter-spacing: -1px;
  511. }
  512. #banner section.banner-info h2{
  513. margin: 0px;
  514. font-size: calc({select:Font Size} - 3px);
  515. line-height: calc({select:Font Size} - 3px);
  516. font-weight: 400;
  517. text-transform: uppercase;
  518. letter-spacing: 1px;
  519. }
  520.  
  521. /* BANNER LINKS */
  522. #banner nav.banner-links{
  523. display: block;
  524. width: 207.5px;
  525. margin-left: 1px;
  526. }
  527. #banner nav.banner-links a{
  528. cursor: help;
  529. display: block;
  530. float: left;
  531. width: 69.5px;
  532. height: 69.5px;
  533. font-family: {select:Font Family};
  534. font-size: calc({select:Font Size} - 4px);
  535. font-weight: 700;
  536. text-transform: uppercase;
  537. letter-spacing: 1px;
  538. text-align: center;
  539. margin: -1px;
  540. border: 1px solid {color:Border Color};
  541. background-color: {color:Post Background Color};
  542. color: {color:Text Color};
  543. }
  544. #banner nav.banner-links a:before{
  545. display: block;
  546. font-family: 'Linearicons-Free';
  547. font-size: calc({select:Font Size} + 10px);
  548. font-weight: normal;
  549. margin: 20px 0px 5px 0px;
  550. letter-spacing: 0px;
  551. }
  552. #banner nav.banner-links a:nth-child(1),
  553. #banner nav.banner-links a:nth-child(4){
  554. border-left: none;
  555. }
  556. #banner nav.banner-links a:nth-child(3),
  557. #banner nav.banner-links a:nth-child(6){
  558. border-right: none;
  559. }
  560. #banner nav.banner-links a:hover{
  561. color: {color:Post Background Color} !important;
  562. background-color: {color:Accent};
  563. }
  564.  
  565. /*---------------------------------------*/
  566. /*---------------------------------------*/
  567. /*---------------------------------------*/
  568.  
  569. /*------ MAIN -----*/
  570.  
  571. #main{
  572. position: relative;
  573. overflow: hidden;
  574. margin: 15px auto 0px;
  575. padding-bottom: 40px;
  576. width: calc({select:Post Width} + 32px + {select:Sidebar Width}*2);
  577. }
  578.  
  579. /* PAGINATION */
  580. #main .pagination{
  581. display: block;
  582. margin-bottom: 15px;
  583. font-size: {select:Font Size};
  584. text-align: center;
  585. }
  586. #main .pagination a{
  587. display: inline-block;
  588. margin: 5px;
  589. color: {color:Text Color};
  590. }
  591. #main .pagination a:hover{
  592. color: {color:Accent};
  593. }
  594. #main .pagination .current{
  595. display: inline-block;
  596. margin: 5px;
  597. color: {color:Link Color};
  598. }
  599. #main .pagination a.jump{
  600. font-family: 'Linearicons-Free';
  601. font-size: calc({select:Font Size} - 4px);
  602. line-height: {select:Font Size};
  603. }
  604.  
  605. /* FOOTER */
  606. footer#blog-footer{
  607. position: absolute;
  608. bottom: 0px;
  609. width: calc(100% - 2px);
  610. height: 40px;
  611. display: block;
  612. border: 1px solid {color:Border Color};
  613. border-bottom: none;
  614. border-top-right-radius: 3px;
  615. border-top-left-radius: 3px;
  616. background-color: {color:Navigation Color};
  617. font-size: calc({select:Font Size} - 3px);
  618. color: {color:Text Color};
  619. line-height: 40px;
  620. text-align: center;
  621. text-transform: uppercase;
  622. letter-spacing: 1.5px;
  623. }
  624.  
  625. /*---------------------------------------*/
  626. /*---------------------------------------*/
  627. /*---------------------------------------*/
  628.  
  629. /*------ SIDEBAR -----*/
  630.  
  631. /* SIDEBAR BASIC */
  632. aside.sidebar{
  633. position: relative;
  634. width: {select:Sidebar Width};
  635. }
  636.  
  637. /* CATEGORY BASIC */
  638. aside.sidebar .category{
  639. display: block;
  640. margin-bottom: 15px;
  641. overflow: hidden;
  642. border-radius: 3px;
  643. border: 1px solid {color:Border Color};
  644. }
  645. aside.sidebar .category h1{
  646. font-family: {select:Font Family};
  647. display: block;
  648. margin: 0px;
  649. padding: 0px 5.5px;
  650. height: 35px;
  651. font-size: calc({select:Font Size} + 2px);
  652. font-weight: 400;
  653. line-height: 35px;
  654. text-align: left;
  655. text-transform: capitalize;
  656. color: {color:Text Color};
  657. background-color: {color:Navigation Color};
  658. border-bottom: 1px solid {color:Border Color};
  659. }
  660. aside.sidebar .category h1:before{
  661. font-family: 'Linearicons-Free';
  662. font-weight: normal;
  663. font-size: calc({select:Font Size} + 3px);
  664. text-align: center;
  665. line-height: 22.5px;
  666. color: {color:Post Background Color};
  667. display: block;
  668. float: left;
  669. margin: 6px 6px 6px 0px;
  670. width: 22.5px;
  671. height: 22.5px;
  672. background-color: {color:Accent};
  673. border-radius: 3px;
  674. }
  675. aside.sidebar .category .box{
  676. padding: 15px;
  677. overflow: hidden;
  678. background-color: {color:Post Background Color};
  679. font-size: {select:Font Size};
  680. color: {color:Text Color};
  681. text-align: justify;
  682. }
  683.  
  684. /*---------------------------------------*/
  685. /*---------------------------------------*/
  686. /*---------------------------------------*/
  687.  
  688. /*----- CATEGORIES -----*/
  689.  
  690. /* ABOUT */
  691. aside.sidebar .box.about{
  692. line-height: 135%;
  693. }
  694. aside.sidebar .box.about img.desc-banner{
  695. display: block;
  696. width: {select:Sidebar Width};
  697. margin: -15px -15px 15px;
  698. }
  699.  
  700. /* PROJECTS */
  701. aside.sidebar .box.projects article{
  702. display: block;
  703. margin-bottom: 15px;
  704. overflow: hidden;
  705. border: 1px solid {color:Border Color};
  706. border-radius: 3px;
  707. }
  708. aside.sidebar .box.projects article:last-child{
  709. margin: 0px;
  710. }
  711. aside.sidebar .box.projects article img{
  712. display: block;
  713. width: 100%;
  714. }
  715. aside.sidebar .box.projects article section{
  716. border-top: 1px solid {color:Border Color};
  717. padding: 10px;
  718. font-size: calc({select:Font Size} - 1px);
  719. font-weight: 400;
  720. background-color: {color:Navigation Color};
  721. }
  722. aside.sidebar .box.projects article section h2,
  723. aside.sidebar .box.projects article section h3{
  724. margin: 0px;
  725. line-height: 110%;
  726. text-transform: uppercase;
  727. }
  728. aside.sidebar .box.projects article section h2{
  729. font-size: calc({select:Font Size} + 2px);
  730. color:{color:Link Color};
  731. }
  732. aside.sidebar .box.projects article section h3{
  733. font-size: calc({select:Font Size} - 2px);
  734. letter-spacing: 1px;
  735. }
  736. aside.sidebar .box.projects article section ul{
  737. list-style-type: none;
  738. line-height: 135%;
  739. margin-top: 5px !important;
  740. }
  741. aside.sidebar .box.projects article section span.list-title{
  742. text-transform: uppercase;
  743. color: {color:Link Color};
  744. letter-spacing: 0.5px;
  745. margin-right: 3px;
  746. }
  747. aside.sidebar .box.projects article section p{
  748. margin: 5px 0px 0px 0px;
  749. }
  750. aside.sidebar .box.projects article section a{
  751. display: inline-block;
  752. padding: 3px 5px;
  753. margin-right :1px;
  754. font-size: calc({select:Font Size} - 2px);
  755. font-weight:700;
  756. letter-spacing: 0.5px;
  757. text-transform: uppercase;
  758. border-radius: 3px;
  759. color: {color:Post Background Color};
  760. background-color: {color:Accent};
  761. }
  762. aside.sidebar .box.projects article section a:hover{
  763. background-color: {color:Text Color};
  764. }
  765.  
  766. /* EXTRA LINKS */
  767. aside.sidebar .box.extra-links a{
  768. display: block;
  769. padding: 5.5px 7.5px;
  770. text-transform: uppercase;
  771. font-family: {select:Font Family};
  772. font-size: calc({select:Font Size} - 1px);
  773. color: {color:Text Color};
  774. letter-spacing: 0.5px;
  775. margin-bottom: 3px;
  776. border-radius: 3px;
  777. border: 1px solid {color:Border Color};
  778. }
  779. aside.sidebar .box.extra-links a:last-child{
  780. margin: 0px;
  781. }
  782. aside.sidebar .box.extra-links a:before{
  783. font-family: 'Linearicons-Free';
  784. font-size: {select:Font Size};
  785. line-height: calc({select:Font Size} + 1px);
  786. display: block;
  787. float: left;
  788. margin-right: 5px;
  789. content: '\e871';
  790. }
  791. aside.sidebar .box.extra-links a:hover{
  792. font-weight: 700;
  793. border: 1px solid {color:Accent};
  794. background-color: {color:Accent};
  795. color: {color:Post Background Color};
  796. }
  797.  
  798. /* STATUS */
  799. aside.sidebar .box.status ul{
  800. list-style-type: none;
  801. }
  802. aside.sidebar .box.status li{
  803. display: block;
  804. border: 1px solid {color:Border Color};
  805. border-radius: 3px;
  806. padding: 7.5px 10px;
  807. text-transform: uppercase;
  808. margin-bottom: 5px;
  809. font-size: calc({select:Font Size} - 2px);
  810. letter-spacing: 1px;
  811. }
  812. aside.sidebar .box.status li:last-child{
  813. margin: 0px;
  814. }
  815. aside.sidebar .box.status li span{
  816. display: block;
  817. font-family: {select:Font Family};
  818. font-weight: 700;
  819. font-size: calc({select:Font Size} + 1px);
  820. letter-spacing: 0px;
  821. margin-bottom: 5px;
  822. text-transform: uppercase;
  823. }
  824. aside.sidebar .box.status li span:before{
  825. font-family: 'Linearicons-Free';
  826. display: block;
  827. color: {color:Accent};
  828. font-size: {select:Font Size};
  829. line-height: calc({select:Font Size} + 1px);
  830. float: left;
  831. margin-right: 5px;
  832. }
  833.  
  834. /* UPDATES */
  835. aside.sidebar .box.updates article{
  836. display: block;
  837. padding: 10px 0px;
  838. border-bottom: 1px solid {color:Border Color};
  839. }
  840. aside.sidebar .box.updates article:first-child{
  841. padding-top: 0px;
  842. }
  843. aside.sidebar .box.updates article:last-child{
  844. padding-bottom: 0px;
  845. border: none;
  846. }
  847. aside.sidebar .box.updates article section.date{
  848. display: block;
  849. float: left;
  850. margin-right: 10px;
  851. width: 30px;
  852. text-align: center;
  853. text-transform: uppercase;
  854. padding: 5px;
  855. border: 1px solid {color:Border Color};
  856. border-radius: 3px;
  857. font-size: 8px;
  858. }
  859. aside.sidebar .box.updates article section.date span{
  860. font-weight: 700;
  861. font-size: 10px;
  862. color: {color:Link Color};
  863. }
  864. aside.sidebar .box.updates article section.event{
  865. display: block;
  866. padding-top: calc(29px/2 - {select:Font Size});
  867. height: 30px;
  868. }
  869.  
  870. /* AFFILIATES */
  871. aside.sidebar .box.affiliates a{
  872. display: block;
  873. float: left;
  874. border-radius: 3px;
  875. margin: 0px 3px 3px 0px;
  876. border: 1px solid {color:Border Color};
  877. overflow: hidden;
  878. background-color: {color:Accent};
  879. }
  880. aside.sidebar .box.affiliates a:hover{
  881. border: 1px solid {color:Accent};
  882. }
  883. aside.sidebar .box.affiliates-200px a{
  884. width: calc({select:Sidebar Width}/3 - 44px/3);
  885. height: calc({select:Sidebar Width}/3 - 44px/3);
  886. }
  887. aside.sidebar .box.affiliates-250px a,
  888. aside.sidebar .box.affiliates-280px a{
  889. width: calc({select:Sidebar Width}/4 - 49px/4);
  890. height: calc({select:Sidebar Width}/4 - 49px/4);
  891. }
  892. aside.sidebar .box.affiliates-200px a:nth-child(3n+0),
  893. aside.sidebar .box.affiliates-250px a:nth-child(4n+0),
  894. aside.sidebar .box.affiliates-280px a:nth-child(4n+0){
  895. margin-right: 0px;
  896. }
  897. aside.sidebar .box.affiliates-200px a:nth-last-child(3),
  898. aside.sidebar .box.affiliates-250px a:nth-last-child(4),
  899. aside.sidebar .box.affiliates-280px a:nth-last-child(4){
  900. margin-bottom: 0px;
  901. }
  902. aside.sidebar .box.affiliates a img{
  903. display: block;
  904. width: 100%;
  905. height: 100%;
  906. }
  907. aside.sidebar .box.affiliates a:hover img{
  908. -webkit-filter: grayscale(100%);
  909. filter: grayscale(100%);
  910. opacity: 0.3;
  911. }
  912. aside.sidebar .box.affiliates a img,
  913. aside.sidebar .box.affiliates a:hover img:hover{
  914. -webkit-transition: all 0.2s ease-in-out;
  915. -moz-transition: all 0.2s ease-in-out;
  916. -o-transition: all 0.2s ease-in-out;
  917. -ms-transition: all 0.2s ease-in-out;
  918. transition: all 0.2s ease-in-out;
  919. }
  920.  
  921. /* MEMBERS */
  922. aside.sidebar .box.members section{
  923. display: block;
  924. margin-bottom: 5px;
  925. height: calc({select:Font Size} + 20px);
  926. }
  927. aside.sidebar .box.members section:last-child{
  928. margin: 0px;
  929. }
  930. aside.sidebar .box.members section img{
  931. width: calc({select:Font Size} + 20px);
  932. height: calc({select:Font Size} + 20px);
  933. margin: 0px 10px 0px 0px;
  934. border-radius: 3px;
  935. display: block;
  936. float: left;
  937. }
  938. aside.sidebar .box.members section h3{
  939. font-size: calc({select:Font Size} + 2px);
  940. font-weight: 700;
  941. text-transform: uppercase;
  942. margin: 0px;
  943. padding: 1px 0px 0px 0px;
  944. }
  945.  
  946. /* SITE INFO */
  947. aside.sidebar .box.site-info ul{
  948. list-style-type: none;
  949. line-height: 135%;
  950. font-size: calc({select:Font Size} - 1px);
  951. }
  952. aside.sidebar .box.site-info li{
  953. margin-bottom: 3px;
  954. }
  955. aside.sidebar .box.site-info li:last-child{
  956. margin: 0px;
  957. }
  958. aside.sidebar .box.site-info ul span.list-title{
  959. text-transform: uppercase;
  960. letter-spacing: 0.5px;
  961. color: {color:Link Color};
  962. }
  963. aside.sidebar .box.site-info ul span.list-title:after{
  964. font-family: 'Linearicons-Free';
  965. font-size: calc({select:Font Size} - 4px);
  966. line-height: calc({select:Font Size} - 4px);
  967. margin: 0px 5px;
  968. content: '\e876';
  969. }
  970.  
  971. /*---------------------------------------*/
  972. /*---------------------------------------*/
  973. /*---------------------------------------*/
  974.  
  975. /*----- POST -----*/
  976.  
  977. #posts-container{
  978. position: relative;
  979. margin: auto;
  980. width: calc({select:Post Width} + 2px);
  981. margin-bottom: 15px;
  982. }
  983.  
  984. /* SINGLE POST */
  985. article.post-wrapper{
  986. overflow: hidden;
  987. width: {select:Post Width};
  988. border: 1px solid {color:Border Color};
  989. border-bottom: none;
  990. border-radius: 3px;
  991. margin: 0px 0px 15px 0px;
  992. }
  993. article.post-wrapper:last-child{
  994. margin: 0px;
  995. }
  996.  
  997. /* POST CONTENT BASIC */
  998. section.post-content{
  999. background-color: {color:Post Background Color};
  1000. font-family: {select:Font Family};
  1001. font-weight: 400;
  1002. font-size: {select:Font Size};
  1003. color:{color:Text Color};
  1004. width: {select:Post Width};
  1005. text-align: justify;
  1006. line-height: 150%;
  1007. }
  1008.  
  1009. /* POST MEDIA */
  1010. section.post-content .post-media{
  1011. width: {select:Post Width};
  1012. border: 1px solid {color:Border Color};
  1013. border-top: none;
  1014. overflow: hidden;
  1015. display: block;
  1016. }
  1017. section.post-content .post-media .width_fix iframe{
  1018. width: calc({select:Post Width} + 2px) !important;
  1019. margin: 0px;
  1020. margin-top: -1px;
  1021. margin-left: -1px;
  1022. }
  1023. section.post-content .post-media iframe.tumblr_audio_player{
  1024. height: 85px !important;
  1025. margin-bottom: -5px;
  1026. }
  1027.  
  1028. /* PHOTO SET FIX */
  1029. .photo-slideshow .photo-data { padding-bottom: 4px; }
  1030. .photo-slideshow .pxu-photo { padding-bottom: 1px; }
  1031. .photo-slideshow .pxu-photo img { margin-left: 0px !important; }
  1032. .photo-slideshow .count-1 { padding-bottom: 2px; }
  1033. .photo-slideshow .count-1 .pxu-photo { padding-bottom: 0; margin-bottom: -2px; }
  1034. .photo-slideshow .count-1 .pxu-photo:last-child { margin-bottom: 0px; }
  1035. .photo-slideshow .count-2 { width: calc(50% - 2px); }
  1036. .photo-slideshow .count-3 { width: calc(100%/3 - 3px); }
  1037. .photo-slideshow .count-3:nth-child(2n+0) { width: calc(100%/3 - 2px); }
  1038. .photo-slideshow .count-2:nth-child(2n+0), .photo-slideshow .count-3:nth-child(2n+0), .photo-slideshow .count-3:nth-child(3n+0) { margin-left: 4px; }
  1039.  
  1040. /* POST BODY */
  1041. section.post-content .post-body{
  1042. width: calc({select:Post Width} - 40px);
  1043. border-bottom: 1px solid {color:Border Color};
  1044. padding: 20px;
  1045. }
  1046. section.post-content .post-body a{
  1047. background-image: linear-gradient(180deg,rgba(68,68,68,0) 50%,rgba(68,68,68,.1) 0);
  1048. text-decoration: none;
  1049. background-repeat: repeat-x;
  1050. background-size: 1em 2px;
  1051. background-position: 0 1.15em;
  1052. padding-bottom: 2px;
  1053. }
  1054. section.post-content .post-body a:hover{
  1055. color: {color:Text Color};
  1056. }
  1057.  
  1058. /* POST IMAGES */
  1059. section.post-content .post-body img{
  1060. max-width: 100%;
  1061. height: auto;
  1062. }
  1063.  
  1064. /* FIX IMAGE FIGURE */
  1065. section.post-content .post-body figure{
  1066. margin-top: 10px;
  1067. max-width: 100%;
  1068. height: auto;
  1069. }
  1070. section.post-content .post-body figure.tumblr-full img{
  1071. width: {select:Post Width};
  1072. }
  1073.  
  1074. /* POST TITLE */
  1075. section.post-content h1.post-title{
  1076. font-family: {select:Font Family};
  1077. font-weight: 400;
  1078. font-size: calc({select:Font Size} + 18px);;
  1079. letter-spacing: 0px;
  1080. text-align: justify;
  1081. line-height: 120%;
  1082. margin: -10px 0px 0px 0px;
  1083. color: {color:Text Color};
  1084. }
  1085.  
  1086. /* BLOCKQUOTE */
  1087. section.post-content blockquote{
  1088. width: calc(100% - 11px);
  1089. max-width: calc(100% - 11px);
  1090. margin-left: 0px;
  1091. padding-left: 10px;
  1092. border-left: 1px solid {color:Accent};
  1093. }
  1094.  
  1095. /* TEXT STYLES */
  1096. section.post-content p{ margin-top: 3px; }
  1097. section.post-content p:first-child{ margin-top: 0px; }
  1098. section.post-content big{ font-size: calc({select:Font Size} + 13px); }
  1099. section.post-content small{ font-size: {select:Font Size}; }
  1100.  
  1101. /* HIGHLIGHT */
  1102. section.post-content h2{
  1103. font-family: {select:Font Family};
  1104. font-weight: 400;
  1105. font-size: calc({select:Font Size} + 10px);
  1106. color: {color:Accent};
  1107. margin-bottom: 15px;
  1108. }
  1109.  
  1110. /* LIST STYLES */
  1111. section.post-content .post-body ol{
  1112. margin: 0px 0px 10px -15px !important;
  1113. }
  1114. section.post-content .post-body ul{
  1115. list-style-type: none;
  1116. margin: 0px 0px 10px 5px !important;
  1117. }
  1118. section.post-content .post-body ul li:before{
  1119. display: block;
  1120. float: left;
  1121. margin-right: 5px;
  1122. font-family: 'Linearicons-Free';
  1123. font-size: calc({select:Font Size} - 3px);
  1124. content: '\e870';
  1125. }
  1126.  
  1127. /* CAPTION */
  1128. section.post-content .caption{
  1129. margin-bottom: -10px;
  1130. }
  1131. section.post-content .caption.has-title{
  1132. margin-top: 10px;
  1133. }
  1134.  
  1135. /* LINK POSTS */
  1136. section.post-content .link-button{
  1137. border-bottom: 1px solid {color:Border Color};
  1138. word-break: break-word;
  1139. overflow: hidden;
  1140. display: block;
  1141. position: relative;
  1142. text-decoration: none;
  1143. }
  1144. section.post-content .info-container{
  1145. padding: 20px 20px 0;
  1146. overflow: hidden;
  1147. }
  1148. section.post-content .publisher-container{
  1149. margin-top: -4px;
  1150. margin-bottom: 17px;
  1151. display: block;
  1152. font-size: 13px;
  1153. line-height: 16px;
  1154. font-weight: 700;
  1155. word-break: break-all;
  1156. }
  1157. section.post-content .publisher-container.if-thumbnail{
  1158. position:absolute;
  1159. top: 20px;
  1160. left: 20px;
  1161. right: 20px;
  1162. }
  1163. section.post-content .publisher-container .publisher{
  1164. line-height: 16px;
  1165. font-size: 7px;
  1166. font-weight: 700;
  1167. color: {color:Post Background Color};
  1168. text-transform: uppercase;
  1169. letter-spacing: 2px;
  1170. display: inline-block;
  1171. margin: 0px;
  1172. }
  1173. section.post-content .info-container{
  1174. padding: 15px 20px;
  1175. overflow: hidden;
  1176. background-color: {color:Navigation Color};
  1177. color: {color:Text Color};
  1178. }
  1179. section.post-content .info-container .title{
  1180. font-family: {select:Font Family};
  1181. margin-bottom: 5px;
  1182. display: block;
  1183. font-size: calc({select:Font Size} + 8px);
  1184. font-weight: 700;
  1185. letter-spacing: 0px;
  1186. line-height: calc({select:Font Size} + 10px);
  1187. }
  1188. section.post-content .info-container .title:after{
  1189. display: inline-block;
  1190. font-size: calc({select:Font Size} + 3px);
  1191. vertical-align: top;
  1192.  
  1193. margin-left: 5px;
  1194. white-space: nowrap;
  1195. font-family: 'Linearicons-Free';
  1196. font-weight: bold;
  1197. content: "\e876";
  1198. }
  1199. section.post-content .info-container .excerpt{
  1200. margin-bottom: 5px;
  1201. display: block;
  1202. font-size: {select:Font Size};
  1203. line-height: calc({select:Font Size} + 3px);
  1204. }
  1205. section.post-content .info-container .author{
  1206. margin-bottom: 5px;
  1207. display: block;
  1208. font-size: calc({select:Font Size} - 2px);
  1209. font-weight: 400;
  1210. letter-spacing: 0.5px;
  1211. line-height: calc({select:Font Size} + 2px);
  1212. opacity: 0.5;
  1213. }
  1214.  
  1215. /* QUOTES */
  1216. section.post-content .quotes{
  1217. font-weight: 400;
  1218. font-size: calc({select:Font Size} + 15px);
  1219. letter-spacing: -1px;
  1220. line-height: 130%;
  1221. margin-top: -5px;
  1222. margin-bottom: 10px;
  1223. color: {color:Text Color};
  1224. }
  1225. section.post-content .icon-quote-left,
  1226. section.post-content .icon-quote-right{
  1227. display: inline-block;
  1228. width: calc({select:Font Size} + 10px);
  1229. height: calc({select:Font Size} + 10px);
  1230. fill: {color:Text Color};
  1231. }
  1232. section.post-content .icon-quote-left{
  1233. margin-right: 8px;
  1234. }
  1235. section.post-content .icon-quote-right{
  1236. margin-left: 8px;
  1237. }
  1238.  
  1239. /* ANSWERS */
  1240. section.post-content .asker{
  1241. font-size: calc({select:Font Size} - 3px);
  1242. text-transform: uppercase;
  1243. text-align: left;
  1244. line-height: 110%;
  1245. margin-top: 2px;
  1246. color: {color:Text Color};
  1247. letter-spacing: 2px;
  1248. }
  1249. section.post-content .asker span{
  1250. font-weight: 400;
  1251. text-transform: uppercase;
  1252. font-size: calc({select:Font Size} + 2px);
  1253. line-height: 110%;
  1254. letter-spacing: 1px;
  1255. }
  1256. section.post-content .asker a{
  1257. background-image: none;
  1258. color: {color:Link Color};
  1259. font-weight: 400;
  1260. text-transform: uppercase;
  1261. font-size: calc({select:Font Size} + 2px);
  1262. line-height: 110%;
  1263. letter-spacing: 1px;
  1264. }
  1265. section.post-content .asker a:hover{
  1266. color: {color:Text Color};
  1267. }
  1268. section.post-content .askimg img{
  1269. width: calc({select:Font Size} + 15px);
  1270. height: calc({select:Font Size} + 15px);
  1271. margin-right: 10px;
  1272. border-radius: 50%;
  1273. float: left;
  1274. }
  1275. section.post-content .question{
  1276. width: calc({select:Post Width} - {select:Font Size}/2 - 68px);
  1277. margin-top: -5px;
  1278. margin-left: calc({select:Font Size}/2 + 7px);
  1279. margin-bottom: 15px;
  1280. padding: 20px 0px 0px 20px;
  1281. border-left: 1px solid {color:Border Color};
  1282. }
  1283.  
  1284. /* CHATS */
  1285. section.post-content ul.chat{
  1286. margin-bottom: 0px !important;
  1287. overflow: hidden;
  1288. border: 1px solid {color:Border Color};
  1289. border-bottom: none;
  1290. text-align: left;
  1291. }
  1292. section.post-content ul.chat{
  1293. list-style: none !important;
  1294. margin-left: 0px !important;
  1295. }
  1296. section.post-content ul.chat.has-title{
  1297. margin-top: 10px !important;
  1298. }
  1299. section.post-content ul.chat li{
  1300. display: block;
  1301. min-height: 25px;
  1302. line-height: 25px;
  1303. font-size: calc({select:Font Size} + 1px);
  1304. font-weight: 400 !important;
  1305. letter-spacing: 1px;
  1306. color: {color:Text Color};
  1307. padding: 0px 10px;
  1308. border-bottom: 1px solid {color:Border Color};
  1309. }
  1310. section.post-content ul.chat li:before{
  1311. display: none;
  1312. }
  1313. section.post-content span.label{
  1314. display: block;
  1315. float: left;
  1316. height: 25px;
  1317. border-right: 1px solid {color:Border Color};
  1318. border-bottom: 1px solid {color:Border Color};
  1319. background-color: {color:Post Background Color};
  1320. font-size: calc({select:Font Size} - 1px);
  1321. font-weight: 700;
  1322. text-transform: uppercase;
  1323. letter-spacing :2px;
  1324. margin-left: -10px;
  1325. margin-right: 5px;
  1326. padding: 0px 3px 0px 10px;
  1327. color: {color:Text Color};
  1328. }
  1329. section.post-content span.label:after{
  1330. content: '';
  1331. position: absolute;
  1332. float: right;
  1333. margin-left: -5px;
  1334. width: 4px;
  1335. height: 25px;
  1336. background-color: {color:Post Background Color};
  1337. }
  1338.  
  1339. /* POSTNOTES */
  1340. article.postnotes{
  1341. width: calc({select:Post Width} - 40px);
  1342. padding: 0px 20px;
  1343. margin: 30px 0px 0px 0px;
  1344. border-radius: 3px;
  1345. border: 1px solid {color:Border Color};
  1346. color: {color:Text Color};
  1347. background: {color:Post Background Color};
  1348. font-size: calc({select:Font Size} - 2px);
  1349. text-align: justify;
  1350. line-height: 150%;
  1351. letter-spacing: 1px;
  1352. text-transform: uppercase;
  1353. }
  1354. article.postnotes ol.notes{
  1355. padding: 0px;
  1356. margin: 20px 0px;
  1357. list-style-type: none;
  1358. }
  1359. article.postnotes ol.notes li.note{
  1360. padding: 10px 0px;
  1361. }
  1362. article.postnotes ol.notes li.note img.avatar{
  1363. vertical-align: -4px;
  1364. margin-right: 10px;
  1365. width: calc({select:Font Size} + 6px);
  1366. height: calc({select:Font Size} + 6px);
  1367. border-radius: 50%;
  1368. }
  1369.  
  1370. /*---------------------------------------*/
  1371. /*---------------------------------------*/
  1372. /*---------------------------------------*/
  1373.  
  1374. /*----- PERMALINK -----*/
  1375.  
  1376. header.post-permalink{
  1377. position: relative;
  1378. display: block;
  1379. z-index: 999;
  1380. background-color: {color:Navigation Color};
  1381. width: calc({select:Post Width} - 40px);
  1382. height: 40px;
  1383. padding: 0px 20px;
  1384. border-bottom: 1px solid {color:Border Color};
  1385. overflow: hidden;
  1386. text-align: left;
  1387. font-size: calc({select:Font Size} - 1px);
  1388. letter-spacing: 1px;
  1389. }
  1390.  
  1391. /* PERMALINK LINKS */
  1392. header.post-permalink .postinfo a{
  1393. font-family: {select:Font Family};
  1394. font-weight: 700;
  1395. display: block;
  1396. float: left;
  1397. text-transform: uppercase !important;
  1398. color: {color:Text Color};
  1399. text-align: left;
  1400. line-height :40px;
  1401. }
  1402. header.post-permalink .postinfo a:before{
  1403. font-family: 'Linearicons-Free';
  1404. margin-right: 5px;
  1405. color: {color:Accent};
  1406. }
  1407. header.post-permalink .postinfo a:hover{
  1408. color: {color:Link Color};
  1409. }
  1410. header.post-permalink .postinfo a:after{
  1411. content: "";
  1412. position: relative;
  1413. width: 1px;
  1414. height: calc({select:Font Size} - 2px);
  1415. display: block;
  1416. float: right;
  1417. background-color:{color:Border Color};
  1418. margin-top: calc(21px - {select:Font Size}/2);
  1419. margin-left: 15px;
  1420. margin-right: 15px;
  1421. }
  1422. header.post-permalink .postinfo a:last-child:after{
  1423. display: none;
  1424. }
  1425. header.post-permalink .postinfo a.notes{
  1426. font-size: calc({select:Font Size} + 1px);
  1427. }
  1428.  
  1429. /* LIKE & REBLOG BUTTONS */
  1430. header.post-permalink ul.like_and_reblog_buttons{
  1431. width: 100px;
  1432. margin-top: 12px !important;
  1433. list-style: none;
  1434. text-align: right;
  1435. display: block;
  1436. float: right;
  1437. }
  1438. header.post-permalink ul.like_and_reblog_buttons li{
  1439. list-style: none;
  1440. display: inline-block;
  1441. margin: 0px 0px 0px 5px;
  1442. cursor: pointer !important;
  1443. }
  1444. header.post-permalink ul.like_and_reblog_buttons{
  1445. margin-left: -38px;
  1446. margin-bottom: -2px;
  1447. }
  1448. header.post-permalink ul.reblog-icons{
  1449. margin-left: -38px;
  1450. }
  1451.  
  1452. /* CUSTOM LIKE BUTTONS | BY DEMIREV.CUBTHEMES.COM */
  1453. header.post-permalink .like{
  1454. position: relative;
  1455. cursor: pointer !important;
  1456. }
  1457. header.post-permalink .lnr-sync,
  1458. header.post-permalink .lnr-heart{
  1459. fill: {color:Accent};
  1460. }
  1461. header.post-permalink .lnr:hover{
  1462. fill: {color:Text Color};
  1463. }
  1464. header.post-permalink .like .like_button{
  1465. position: absolute;
  1466. top: -1.5px;
  1467. opacity: 0;
  1468. }
  1469. header.post-permalink .like .like_button.liked {
  1470. opacity: 1;
  1471. }
  1472. header.post-permalink .lnr{
  1473. -webkit-transition: all 0.2s ease-in-out;
  1474. -moz-transition: all 0.2s ease-in-out;
  1475. -o-transition: all 0.2s ease-in-out;
  1476. -ms-transition: all 0.2s ease-in-out;
  1477. transition: all 0.2s ease-in-out;
  1478. }
  1479.  
  1480. /* TAGS */
  1481. footer.post-tags{
  1482. position: relative;
  1483. z-index: 999;
  1484. width: calc({select:Post Width} - 40px);
  1485. background-color: {color:Navigation Color};
  1486. border-bottom: 1px solid {color:Border Color};
  1487. text-align:left;
  1488. line-height: 100%;
  1489. padding: 15px 20px;
  1490. letter-spacing: 0.5px;
  1491. line-height: 150%;
  1492. font-weight: 400;
  1493. font-size: calc({select:Font Size} - 2px);
  1494. }
  1495. footer.post-tags a{
  1496. display: inline-block;
  1497. color: {color:Text Color};
  1498. margin-left: 10px;
  1499. }
  1500. footer.post-tags a:hover{
  1501. color: {color:Link Color};
  1502. }
  1503. footer.post-tags span{
  1504. font-family: {select:Font Family};
  1505. color: {color:Text Color};
  1506. text-transform: uppercase;
  1507. display: inline-block;
  1508. font-size: calc({select:Font Size} - 3px);
  1509. line-height: calc({select:Font Size} - 3px);
  1510. font-weight: 700;
  1511. letter-spacing: 1px;
  1512. margin-right: -5px;
  1513. }
  1514. footer.post-tags span:before {
  1515. font-family: 'Linearicons-Free';
  1516. font-size: {select:Font Size};
  1517. color: {color:Accent};
  1518. line-height: calc({select:Font Size} - 5px);
  1519. margin-right: 5px;
  1520. display :block;
  1521. float: left;
  1522. }
  1523.  
  1524. /*---------------------------------------*/
  1525. /*---------------------------------------*/
  1526. /*---------------------------------------*/
  1527.  
  1528. /* DO NOT REMOVE! */
  1529. /*----- CREDIT -----*/
  1530.  
  1531. #credit{
  1532. position: fixed;
  1533. bottom: 20px;
  1534. right: 20px;
  1535. text-align: center;
  1536. z-index: 99999;
  1537. }
  1538. #credit a{
  1539. padding: 3px 3px 3px 5px;
  1540. color: {color:Text Color};
  1541. background-color: {color:Post Background Color};
  1542. border: 1px solid {color:Border Color};
  1543. border-radius: 3px;
  1544. text-align: center;
  1545. font-size: 8px;
  1546. font-weight: 400;
  1547. letter-spacing: 1px;
  1548. text-transform: uppercase;
  1549. color: {color:Text Color};
  1550. }
  1551. #credit a:hover{
  1552. background-color: {color:Accent};
  1553. color: {color:Post Background Color};
  1554. border: 1px solid {color:Accent};
  1555. }
  1556.  
  1557. /*---------------------------------------*/
  1558. /*---------------------------------------*/
  1559. /*---------------------------------------*/
  1560.  
  1561. {CustomCSS}
  1562.  
  1563. </style><!-- END OF CSS STYLE-->
  1564.  
  1565. <!-- JAVASCRIPT -->
  1566. <script>
  1567. $(document).ready(function() {
  1568.  
  1569. $('.photo-slideshow').pxuPhotoset({
  1570. lightbox: true,
  1571. gutter: '2px',
  1572. borderRadius: '0px',
  1573. photoset: '.photo-slideshow',
  1574. photoWrap: '.photo-data',
  1575. photo: '.pxu-photo'
  1576. });
  1577.  
  1578. $("[title]").style_my_tooltips({
  1579. tip_follows_cursor:true,
  1580. tip_delay_time:100,
  1581. tip_fade_speed:300
  1582. });
  1583.  
  1584. //Check to see if the window is top if not then display button
  1585. $(window).scroll(function(){
  1586. if ($(this).scrollTop() > 100) {
  1587. $('.scrollToTop').fadeIn();
  1588. } else {
  1589. $('.scrollToTop').fadeOut();
  1590. }
  1591. });
  1592.  
  1593. //Click event to scroll to top
  1594. $('.scrollToTop').click(function(){
  1595. $('html, body').animate({scrollTop : 0},800);
  1596. return false;
  1597. });
  1598.  
  1599. });
  1600. </script>
  1601.  
  1602. </head>
  1603.  
  1604. <body>
  1605.  
  1606. <!-- HEADER -->
  1607. <header id="blog-header">
  1608. <!-- TITLE + ICON -->
  1609. <div class="icon lnr lnr-{text:Topbar Title Icon}"></div>
  1610. <h1>{block:ifBlogTitle}<a href="/">{text:Blog Title}</a>{/block:ifBlogTitle}{block:ifnotBlogTitle}<a href="/">{Title}</a>{/block:ifnotBlogTitle}</h1>
  1611. <!-- SEARCH BAR-->
  1612. <div class="search">
  1613. <form action="/search" method="get">
  1614. <input type="text" name="q" value="" placeholder="SEARCH..." />
  1615. <input type="submit" value="&#xe86f;" class="sbutton" />
  1616. </form>
  1617. </div>
  1618. <!-- TOPLINKS -->
  1619. <div class="trigger">
  1620. <nav class="toplinks">
  1621. <a class="lnr lnr-{text:Link 1 Icon}" href="{text:Link 1 URL}" title="{text:Link 1 Title}"></a>
  1622. <a class="lnr lnr-{text:Link 2 Icon}" href="{text:Link 2 URL}" title="{text:Link 2 Title}"></a>
  1623. <a class="lnr lnr-{text:Link 3 Icon}" href="{text:Link 3 URL}" title="{text:Link 3 Title}"></a>
  1624. <a class="lnr lnr-{text:Link 4 Icon}" href="{text:Link 4 URL}" title="{text:Link 4 Title}"></a>
  1625. <a class="lnr lnr-{text:Link 5 Icon}" href="{text:Link 5 URL}" title="{text:Link 5 Title}"></a>
  1626. <a class="lnr lnr-{text:Link 6 Icon}" href="{text:Link 6 URL}" title="{text:Link 6 Title}"></a>
  1627. </nav>
  1628. </div>
  1629. </header>
  1630.  
  1631. <!-- BANNER -->
  1632. <div id="banner" class="{select:Banner Side Position}">
  1633. <aside class="banner-side">
  1634. <section class="banner-info">
  1635. <div class="banner-side-img-border">
  1636. <div class="banner-side-img-wrapper">
  1637. <img src="{image:Banner Side}" />
  1638. </div>
  1639. </div>
  1640. <h1>{block:ifBlogTitle}{text:Blog Title}{/block:ifBlogTitle}{block:ifnotBlogTitle}{Title}{/block:ifnotBlogTitle}</h1>
  1641. <h2>{block:ifBlogSubtitle}{text:Blog Subtitle}{/block:ifBlogSubtitle}{block:ifnotBlogSubtitle}{Name}.tumblr.com{/block:ifnotBlogSubtitle}</h2>
  1642. </section>
  1643. <nav class="banner-links">
  1644. <a class="lnr lnr-{text:Link 1 Icon}" href="{text:Link 1 URL}">{text:Link 1 Title}</a>
  1645. <a class="lnr lnr-{text:Link 2 Icon}" href="{text:Link 2 URL}">{text:Link 2 Title}</a>
  1646. <a class="lnr lnr-{text:Link 3 Icon}" href="{text:Link 3 URL}">{text:Link 3 Title}</a>
  1647. <a class="lnr lnr-{text:Link 4 Icon}" href="{text:Link 4 URL}">{text:Link 4 Title}</a>
  1648. <a class="lnr lnr-{text:Link 5 Icon}" href="{text:Link 5 URL}">{text:Link 5 Title}</a>
  1649. <a class="lnr lnr-{text:Link 6 Icon}" href="{text:Link 6 URL}">{text:Link 6 Title}</a>
  1650. </nav>
  1651. </aside>
  1652. </div>
  1653.  
  1654. <!-- STICKY TOPBAR -->
  1655. <script>
  1656. var header = document.querySelector('.trigger');
  1657. var origOffsetY = header.offsetTop;
  1658.  
  1659. function onScroll(e) {
  1660. window.scrollY >= origOffsetY ? header.classList.add('sticky') :
  1661. header.classList.remove('sticky');
  1662. }
  1663.  
  1664. document.addEventListener('scroll', onScroll);
  1665. </script>
  1666.  
  1667. <!--------------------->
  1668. <!--------------------->
  1669. <!--------------------->
  1670.  
  1671. <!-- START OF MAIN CONTENT -->
  1672. <div id="main">
  1673.  
  1674. <!-- START OF LEFT SIDEBAR -->
  1675. <aside class="sidebar" id="sidebar-left">
  1676.  
  1677. <!-- CATEGORY ONE -->
  1678. <div class="category">
  1679. <h1 class="lnr lnr-{text:Category 1 Icon}">{text:Category 1 Title}</h1>
  1680. <div class="box about">
  1681. {block:ifDescriptionBannerImage}<img class="desc-banner" src="{image:Description Banner}" />{/block:ifDescriptionBannerImage}
  1682. {Description}
  1683. </div>
  1684. </div>
  1685. <!-- CATEGORY ONE -->
  1686.  
  1687. <!-- CATEGORY TWO -->
  1688. <div class="category">
  1689. <h1 class="lnr lnr-{text:Category 2 Icon}">{text:Category 2 Title}</h1>
  1690. <div class="box projects">
  1691. <article>
  1692. <img src="" />
  1693. <section>
  1694. <h2>Project title</h2>
  1695. <h3>project subtitle</h3>
  1696. <ul>
  1697. <li><span class="list-title">date</span>05th Mar 2017</li>
  1698. <li><span class="list-title">project type</span>Type</li>
  1699. </ul>
  1700. <p>
  1701. <a href="/">link</a>
  1702. <a href="/">link</a>
  1703. </p>
  1704. </section>
  1705. </article>
  1706. </div>
  1707. </div>
  1708. <!-- CATEGORY TWO -->
  1709.  
  1710. <!-- CATEGORY THREE-->
  1711. <div class="category">
  1712. <h1 class="lnr lnr-{text:Category 3 Icon}">{text:Category 3 Title}</h1>
  1713. <div class="box extra-links">
  1714. <a href="/">Extra Link</a>
  1715. <a href="/">Extra Link</a>
  1716. <a href="/">Extra Link</a>
  1717. <a href="/">Extra Link</a>
  1718. <a href="/">Extra Link</a>
  1719. <a href="/">Extra Link</a>
  1720. </div>
  1721. </div>
  1722. <!-- CATEGORY THREE -->
  1723.  
  1724. </aside>
  1725. <!-- END OF LEFT SIDEBAR -->
  1726.  
  1727. <!-- START OF RIGHT SIDEBAR -->
  1728. <aside class="sidebar" id="sidebar-right">
  1729.  
  1730. <!-- CATEGORY FOUR -->
  1731. <div class="category">
  1732. <h1 class="lnr lnr-{text:Category 4 Icon}">{text:Category 4 Title}</h1>
  1733. <div class="box status">
  1734. <ul>
  1735. <li>
  1736. <span class="lnr lnr-location">status title</span>
  1737. Status description
  1738. </li>
  1739. </ul>
  1740. </div>
  1741. </div>
  1742. <!-- CATEGORY FOUR -->
  1743.  
  1744. <!-- CATEGORY FIVE -->
  1745. <div class="category">
  1746. <h1 class="lnr lnr-{text:Category 5 Icon}">{text:Category 5 Title}</h1>
  1747. <div class="box updates">
  1748. <article>
  1749. <section class="date"><span>07th</span> Mar 17</section>
  1750. <section class="event">Event<br />Description</section>
  1751. </article>
  1752. <article>
  1753. <section class="date"><span>06th</span> Mar 17</section>
  1754. <section class="event">Event<br />Description</section>
  1755. </article>
  1756. </div>
  1757. </div>
  1758. <!-- CATEGORY FIVE -->
  1759.  
  1760. <!-- CATEGORY SIX -->
  1761. <div class="category">
  1762. <h1 class="lnr lnr-{text:Category 6 Icon}">{text:Category 6 Title}</h1>
  1763. <div class="box affiliates affiliates-{select:Sidebar Width}">
  1764. <a href="https://username.tumblr.com" title="username"><img src="" /></a>
  1765. </div>
  1766. </div>
  1767. <!-- CATEGORY SIX -->
  1768.  
  1769. <!-- CATEGORY SEVEN -->
  1770. <div class="category">
  1771. <h1 class="lnr lnr-{text:Category 7 Icon}">{text:Category 7 Title}</h1>
  1772. <div class="box members">
  1773. {block:GroupMembers}{block:GroupMember}<section>
  1774. <img src="{GroupMemberPortraitURL-30}" />
  1775. <h3><a href="{GroupMemberURL}">{GroupMemberName}</a></h3>
  1776. {GroupMemberTitle}
  1777. </section>{/block:GroupMember}{/block:GroupMembers}
  1778. </div><!-- BOX -->
  1779. </div>
  1780. <!-- CATEGORY SEVEN -->
  1781.  
  1782. <!-- CATEGORY EIGHT -->
  1783. <div class="category">
  1784. <h1 class="lnr lnr-{text:Category 8 Icon}">{text:Category 8 Title}</h1>
  1785. <div class="box site-info">
  1786. <ul>
  1787. <li><span class="list-title">about</span>Theme</li>
  1788. <li><span class="list-title">established</span>Date</li>
  1789. <li><span class="list-title">currently online</span>Online counter</li>
  1790. <li><span class="list-title">total hits</span>Hit counter</li>
  1791. <li><span class="list-title">theme by</span><a href="https://roxiestheme.tumblr.com">ROXIESTHEME</a></li>
  1792. <li><span class="list-title">discalimer</span>Disclaimer</li>
  1793. </ul>
  1794. </div>
  1795. </div>
  1796. <!-- CATEGORY EIGHT -->
  1797.  
  1798. </aside>
  1799. <!-- END OF RIGHT SIDEBAR -->
  1800.  
  1801. <!-- POSTS CONTAINER -->
  1802. <div id="posts-container">
  1803.  
  1804. <!-- START OF A POST -->
  1805. {block:Posts}<article class="post-wrapper">
  1806.  
  1807. <!-- PERMALINK -->
  1808. {block:Date}<header class="post-permalink">
  1809. <div class="postinfo">
  1810. <a class="lnr lnr-star" href="{Permalink}" title="notes">{NoteCount}</a>
  1811. <a class="lnr lnr-clock" href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}/" title="date">{ShortMonth} {DayOfMonthWithZero} {Year}</a>
  1812. {block:RebloggedFrom}<a class="lnr lnr-location" href="{ReblogRootURL}" target="_blank" title="{ReblogRootName}">src</a><a class="lnr lnr-enter" href="{ReblogParentURL}" target="_blank" title="{ReblogParentName}">via</a>{/block:RebloggedFrom}
  1813. </div>
  1814. <ul class="like_and_reblog_buttons">
  1815. <li class="reblog-button" title="reblog"><a href="{ReblogURL}" target="_blank"><svg class="lnr lnr-sync" width="13px" height="13px"><use xlink:href="#lnr-sync"></use></svg></a></li>
  1816. <li class="like" title="like">{LikeButton size="11"}<svg class="lnr lnr-heart" width="13px" height="13px"><use xlink:href="#lnr-heart"></use></svg></li>
  1817. </ul>
  1818. </header>{/block:Date}
  1819.  
  1820. <!-- START OF POST CONTENT -->
  1821. <section class="post-content">
  1822.  
  1823. <!-- TEXT POST -->
  1824. {block:Text}
  1825. <div class="post-body">
  1826. {block:Title}<h1 class="post-title">{Title}</h1>{/block:Title}
  1827. <div class="caption {block:Title}has-title{/block:Title}">{Body}</div>
  1828. </div>
  1829. {/block:Text}
  1830.  
  1831. <!-- PHOTO POST -->
  1832. {block:Photo}
  1833. <div class="post-media">{LinkOpenTag}<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="{select:Post Width}" style="display:block;" />{LinkCloseTag}</div>
  1834. {block:Caption}<div class="post-body"><div class="caption">{Caption}</div></div>{/block:Caption}
  1835. {/block:Photo}
  1836.  
  1837. <!-- PHOTOSET -->
  1838. {block:Photoset}
  1839. <div class="post-media">
  1840. <div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">
  1841. {block:Photos}<div class="photo-data">
  1842. <div class="pxu-photo">
  1843. <img src="{PhotoURL-HighRes}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}" />
  1844. </div><!-- pxu-photo -->
  1845. <a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a>
  1846. </div><!-- photo-data -->{/block:Photos}
  1847. </div><!-- photo-slideshow-->
  1848. </div>
  1849. {block:Caption}<div class="post-body"><div class="caption">{Caption}</div></div>{/block:Caption}
  1850. {block:ContentSource}<!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
  1851. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->{/block:ContentSource}
  1852. {/block:Photoset}
  1853.  
  1854. <!-- VIDEO POST -->
  1855. {block:Video}
  1856. <div class="post-media">
  1857. <div class="video" style="margin-bottom:-5px;">{Video-500}</div>
  1858. </div>
  1859. {block:Caption}<div class="post-body"><div class="caption">{Caption}</div></div>{/block:Caption}
  1860. {/block:Video}
  1861.  
  1862. <!-- AUDIO POST -->
  1863. {block:Audio}
  1864. <div class="post-media" style="border:none">
  1865. <div class="width_fix" style="margin-bottom:-5px;">{AudioEmbed-500}</div>
  1866. </div>
  1867. {block:Caption}<div class="post-body"><div class="caption">{Caption}</div></div>{/block:Caption}
  1868. {/block:Audio}
  1869.  
  1870. <!-- LINK POST -->
  1871. {block:Link}
  1872. <div class="post-media" style="border:none">
  1873. <a href="{Url}" target="_blank" class="link-button">
  1874. {block:Thumbnail}<img src="{Thumbnail}" width="{select:Post Width}">{/block:Thumbnail}
  1875. <div class="info-container">
  1876. {block:Host}<div class="publisher-container {block:Thumbnail}if-thumbnail{/block:Thumbnail}"><div class="publisher">{Host}</div></div>{/block:Host}
  1877. <div class="title">{Name}</div>
  1878. {block:Excerpt}<div class="excerpt">{Excerpt}</div>{/block:Excerpt}
  1879. {block:Author}<div class="author">{Author}</div>{/block:Author}
  1880. </div><!-- INFO CONTAINER -->
  1881. </a>
  1882. </div>
  1883. {block:Description}<div class="post-body"><div class="caption">{Description}</div></div>{/block:Description}
  1884. {/block:Link}
  1885.  
  1886. <!-- QUOTE POST -->
  1887. {block:Quote}
  1888. <div class="post-body">
  1889. <div class="quotes">
  1890. <svg class="icon icon-quote-left"><use xlink:href="#icon-quote-left"></use></svg>
  1891. {Quote}
  1892. <svg class="icon icon-quote-right"><use xlink:href="#icon-quote-right"></use></svg>
  1893. </div>
  1894. {block:Source}<div class="caption" style="margin-bottom:0px;">— {Source}</div>{/block:Source}
  1895. </div>
  1896. {/block:Quote}
  1897.  
  1898. <!-- CHAT POST -->
  1899. {block:Chat}
  1900. <div class="post-body">
  1901. {block:Title}<h1 class="posttitle">{Title}</h1>{/block:Title}
  1902. <ul class="chat {block:Title}has-title{/block:Title}">
  1903. {block:Lines}<li class="user_{UserNumber}">{block:Label}<span class="label">{Label}</span>{/block:Label}&nbsp;{Line}</li>{/block:Lines}
  1904. </ul>
  1905. </div>
  1906. {/block:Chat}
  1907.  
  1908. <!-- ANSWER -->
  1909. {block:Answer}
  1910. <div class="post-body">
  1911. <div class="askimg"><img src="{AskerPortraitURL-48}"></div>
  1912. <div class="asker"><span>{Asker}</span><br>sent a message</div>
  1913. <div class="question">{Question}</div>
  1914. <div class="caption">{Answer}</div>
  1915. </div>
  1916. {/block:Answer}
  1917.  
  1918. </section>
  1919. <!-- END OF POST CONTENT -->
  1920.  
  1921. <!-- TAGS -->
  1922. {block:HasTags}<footer class="post-tags">
  1923. <span class="lnr lnr-bookmark">Tagged as</span> {block:Tags}<a href="{TagURL}">{Tag}</a>{/block:Tags}
  1924. </footer>{/block:HasTags}
  1925.  
  1926. </article>
  1927. <!-- END OF A POST -->
  1928.  
  1929. <!-- POST NOTES -->
  1930. {block:PostNotes}<article class="postnotes">{PostNotes}</section>{/block:PostNotes}
  1931.  
  1932. {/block:Posts}<!-- END OF ALL POSTS -->
  1933.  
  1934. <!-- PAGINATION -->
  1935. {block:Pagination}<div class="pagination">
  1936. {block:PreviousPage}<a href="{PreviousPage}" class="jump">&#xe875;</a>{/block:PreviousPage}
  1937. {block:JumpPagination length="10"}{block:CurrentPage}<span class="current">{PageNumber}</span>{/block:CurrentPage}{block:JumpPage}<a href="{URL}">{PageNumber}</a>{/block:JumpPage}{/block:JumpPagination}
  1938. {block:NextPage}<a href="{NextPage}" class="jump">&#xe876;</a>{/block:NextPage}
  1939. </div>{/block:Pagination}
  1940.  
  1941. </div><!-- POSTS CONTAINER -->
  1942.  
  1943. <!-- !!! DO NO REMOVE THE CREDIT !!! -->
  1944. <footer id="blog-footer">© {CopyrightYears} <a href="/">{Name}</a> all rights reserved. Theme by <a href="https://roxiestheme.tumblr.com" target="_blank">roxiestheme</a> • Powered by <a href="https://tumblr.com" target="_blank">Tumblr</a></footer>
  1945.  
  1946. </div>
  1947. <!-- END OF MAIN CONTENT -->
  1948.  
  1949. <!-- SCROLL TO TOP BUTTON -->
  1950. <a href="#" class="scrollToTop">Scroll To Top</a>
  1951.  
  1952. <!-- !!! DO NO REMOVE THE CREDIT !!! -->
  1953. <div id="credit"><a href="https://roxiestheme.tumblr.com" target="_blank">roxiestheme</a></div>
  1954.  
  1955. </body>
  1956.  
  1957. <!-- SVGS -->
  1958. <svg xmlns="https://www.w3.org/2000/svg" xmlns:svg="https://www.w3.org/2000/svg" display="none">
  1959. <defs>
  1960. <symbol id="icon-quote-left" viewBox="0 0 33 32">
  1961. <title>quote</title>
  1962. <path class="path1" d="M16.025 19.192c-0.133-3.75-3.258-7.225-7.133-7.675-1.475-0.167-3.767 0.483-4.767 1.167-0.4 0.083-0.6 0.225-0.717-0.4 3.433-6.633 11.342-6.625 11.342-6.625v-0.917c-8.058-1.325-17.025 8.842-14.225 17 1.333 3.875 5.117 6.25 8.792 5.508 3.85-0.783 6.842-4.367 6.708-8.058zM7.925 25.9c-3.708-0.050-6.492-2.958-6.408-6.692 0.092-3.683 3.083-6.458 6.792-6.3 3.475 0.15 6.183 2.975 6.2 6.458 0.025 3.633-2.942 6.583-6.583 6.533z"></path>
  1963. <path class="path2" d="M33.025 19.192c-0.133-3.75-3.258-7.225-7.133-7.675-1.475-0.167-3.767 0.483-4.767 1.167-0.4 0.083-0.6 0.225-0.717-0.4 3.433-6.633 11.342-6.625 11.342-6.625v-0.917c-8.058-1.325-17.025 8.842-14.225 17 1.333 3.875 5.117 6.25 8.792 5.508 3.85-0.783 6.842-4.367 6.708-8.058zM24.925 25.9c-3.708-0.050-6.492-2.958-6.408-6.692 0.092-3.683 3.083-6.458 6.792-6.3 3.475 0.15 6.183 2.975 6.2 6.458 0.033 3.633-2.942 6.583-6.583 6.533z"></path>
  1964. </symbol>
  1965. <symbol id="icon-quote-right" viewBox="0 0 33 32">
  1966. <title>quote2</title>
  1967. <path class="path1" d="M17.006 12.808c0.133 3.75 3.258 7.225 7.133 7.675 1.475 0.167 3.767-0.483 4.767-1.167 0.4-0.083 0.6-0.225 0.717 0.4-3.433 6.633-11.342 6.625-11.342 6.625v0.917c8.058 1.325 17.025-8.842 14.225-17-1.333-3.875-5.117-6.25-8.792-5.508-3.85 0.783-6.842 4.367-6.708 8.058zM25.106 6.1c3.708 0.050 6.492 2.958 6.408 6.692-0.092 3.683-3.083 6.458-6.792 6.3-3.475-0.15-6.183-2.975-6.2-6.458-0.025-3.633 2.942-6.583 6.583-6.533z"></path>
  1968. <path class="path2" d="M0.006 12.808c0.133 3.75 3.258 7.225 7.133 7.675 1.475 0.167 3.767-0.483 4.767-1.167 0.4-0.083 0.6-0.225 0.717 0.4-3.433 6.633-11.342 6.625-11.342 6.625v0.917c8.058 1.325 17.025-8.842 14.225-17-1.333-3.875-5.117-6.25-8.792-5.508-3.85 0.783-6.842 4.367-6.708 8.058zM8.106 6.1c3.708 0.050 6.492 2.958 6.408 6.692-0.092 3.683-3.083 6.458-6.792 6.3-3.475-0.15-6.183-2.975-6.2-6.458-0.033-3.633 2.942-6.583 6.583-6.533z"></path>
  1969. </symbol>
  1970. </defs>
  1971. </svg>
  1972.  
  1973. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement