API tools faq
paste
Advertisement
feiinho

Skyfall Tumblr theme Hakuna Matata

feiinho
Jan 3rd, 2018
935
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 52.79 KB | None | 0 0
raw download clone embed print report
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <!--===================================================================
  5.  
  6. Skyfall Tumblr theme
  7. Created by Hakuna Matata
  8.  
  9. If you have any questions, please send me an email:
  10. leentheme@hotmail.com with the name of the theme and a link
  11. to your blog.
  12.  
  13. Feel free to edit and customize this theme for personal use.
  14. more themes ? ===> http://www.leenthemes.com/
  15.  
  16. http://www.leenthemes.com/
  17. Published on May 3, 2015
  18. All rights reserved
  19.  
  20. ==================================================================
  21.  
  22. External resources used in this theme:
  23.  
  24. # SCRIPT: jQuery v1.11.2
  25. + http://jquery.com
  26. + jQuery Foundation, Inc. and other contributors
  27. + Licensed under the MIT license
  28.  
  29. # SCRIPT: Infinite Scroll
  30. + https://github.com/paulirish/infinite-scroll
  31. + version 2.0b2.120519
  32. + Copyright 2011/12 Paul Irish & Luke Shumard
  33. + Licensed under the MIT license
  34.  
  35. # SCRIPT: Modernizr 2.8.3 (Custom Build) | MIT & BSD
  36. + http://modernizr.com
  37.  
  38. # FONT: FONT AWESOME (v4.3.0)
  39. + http://fontawesome.io
  40. + Dave Gandy
  41. + Font licensed under the SIL Open Font License 1.1
  42. + CSS licensed under the MIT license
  43. ============================================================== -->
  44. <title>{Title}{block:TagPage} &bull; Posts Tagged &lsquo;{Tag}&rsquo;{/block:TagPage}{block:PostSummary} &bull; {PostSummary}{/block:PostSummary}</title>
  45. <link rel="shortcut icon" href="{Favicon}"/>
  46. <link rel="apple-touch-icon" href="{PortraitURL-128}"/>
  47. <link rel="alternate" type="application/rss+xml" href="{RSS}"/>
  48. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  49. <meta charset="UTF-8"/>
  50. <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  51. <script src="//static.tumblr.com/6znvctm/DrLnnzdhf/skyfall.js"></script>
  52. {block:Hidden}
  53. <meta name="select:Layout type" content="col-md-4 col-sm-6 col-xs-12" title="Three column"/>
  54. <meta name="select:Layout type" content="col-md-3 col-sm-6 col-xs-12" title="Four column"/>
  55. <meta name="select:Layout type" content="col-md-6 col-sm-6 col-xs-12" title="Two column"/>
  56. <meta name="select:Color Brightness" content="3" title="Level 3"/>
  57. <meta name="select:Color Brightness" content="5" title="Level 5"/>
  58. <meta name="select:Color Brightness" content="4" title="Level 4"/>
  59. <meta name="select:Color Brightness" content="2" title="Level 2"/>
  60. <meta name="select:Color Brightness" content="1" title="Level 1"/>
  61. <meta name="image:Background image" content=""/>
  62. <meta name="if:Repeat Backgruond" content="1"/>
  63. <meta name="color:Gradient top" content="#f7c282">
  64. <meta name="color:Gradient bottom" content="#b997ce">
  65. <meta name="color:Title Color" content="#333333">
  66. <meta name="color:Description Color" content="#ffffff">
  67. <meta name="color:Footer Color" content="#ffffff">
  68. <meta name="if:Infinite Scrolling" content="1"/>
  69. <meta name="if:Show Random Post" content="1"/>
  70. <meta name="if:Show Archive Page" content="1"/>
  71. <meta name="if:Show Feed Page" content="1"/>
  72. <meta name="text:Disqus Shortname" content=""/>
  73. <meta name="text:Google Analytics ID" content=""/>
  74. <meta name="text:WebSite URL" content=""/>
  75. <meta name="text:Facebook URL" content=""/>
  76. <meta name="text:Google URL" content=""/>
  77. <meta name="text:Vine URL" content=""/>
  78. <meta name="text:Twitter URL" content=""/>
  79. <meta name="text:Google Plus URL" content=""/>
  80. <meta name="text:Dribbble URL" content=""/>
  81. <meta name="text:Instagram URL" content=""/>
  82. <meta name="text:Flickr URL" content=""/>
  83. <meta name="text:Youtube URL" content=""/>
  84. <meta name="text:Vimeo URL" content=""/>
  85. <meta name="text:DeviantArt URL" content=""/>
  86. <meta name="text:Pinterest URL" content=""/>
  87. <meta name="text:LinkedIn URL" content=""/>
  88. <meta name="text:Behance URL" content=""/>
  89. <meta name="text:GitHub URL" content=""/>
  90. <meta name="text:Spotify URL" content=""/>
  91. <meta name="text:SoundCloud URL" content=""/>
  92. <meta name="text:Wordpress URL" content=""/>
  93. <meta name="text:Tag 1" content=""/>
  94. <meta name="text:Tag 2" content=""/>
  95. <meta name="text:Tag 3" content=""/>
  96. <meta name="text:Tag 4" content=""/>
  97. <meta name="text:Tag 5" content=""/>
  98. {/block:Hidden}
  99. <!--[if IE]>
  100. <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
  101. <![endif]-->
  102. <!-- Fonts -->
  103. <link href="//fonts.googleapis.com/css?family=Droid+Sans:400,700|Droid+Serif:400,400italic" rel="stylesheet" type="text/css">
  104. <link href='//fonts.googleapis.com/css?family=Lobster+Two|Handlee|Satisfy' rel='stylesheet' type='text/css'>
  105. <!-- Stylesheet -->
  106. <link rel="stylesheet" href="//static.tumblr.com/zdvilra/GZGnmptcq/bootstrap.min.css">
  107. <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
  108. <style type="text/css">
  109. html{
  110. font-size: 16px;
  111. -webkit-text-size-adjust:100% !important;
  112. -ms-text-size-adjust:100% !important;
  113. overflow-x: hidden;
  114. }
  115. body {
  116. font: normal 14px/22px 'Droid Sans', sans-serif;
  117. background-color: #36465d;
  118. color: rgb(94, 102, 97);
  119. background: linear-gradient(to bottom, {color:Gradient top} 0%, {color:Gradient bottom} 100%) repeat fixed 0% 0% transparent;
  120. {block:IfBackgroundImageImage}
  121. {block:IfNotRepeatBackgruond}
  122. background: url('{image:Background Image}') center center fixed;
  123. background-size: 100% 100% !important;
  124. {/block:IfNotRepeatBackgruond}
  125. {block:IfRepeatBackgruond}
  126. background: url({image:Background Image}) repeat fixed;
  127. {/block:IfRepeatBackgruond}
  128. {/block:IfBackgroundImageImage}
  129. }
  130. .container{
  131. margin-top: 20px;
  132. margin-bottom: 80px;
  133. min-height: 800px;
  134. }
  135. #grid{
  136. margin-top: 20px;
  137. }
  138. div[class^='col-md'],div[class*=' col-md']{
  139. padding-left: 5px;
  140. padding-right: 5px;
  141. }
  142. .post{
  143. position: relative;
  144. word-wrap: break-word;
  145. }
  146. .col-md-3{
  147. padding-bottom: 8px;
  148. }
  149. .col-md-4 , .col-md-6 {
  150. padding-bottom: 20px;
  151. }
  152. .post_media{
  153. background: #fff;
  154. border-radius: 3px;
  155. border: 6px solid transparent;
  156. box-shadow: 0 0 1px rgba(34, 25, 25, 0.4);
  157. }
  158. img{
  159. max-width: 100%;
  160. height: auto;
  161. }
  162. figure{
  163. text-align: center;
  164. }
  165. /* magnificPopup */
  166. .mfp-bg{top:0;left:0;width:100%;height:100%;z-index:1042;overflow:hidden;position:fixed;background:#0b0b0b;opacity:.8;filter:alpha(opacity=80)}.mfp-wrap{top:0;left:0;width:100%;height:100%;z-index:1043;position:fixed;outline:0!important;-webkit-backface-visibility:hidden}.mfp-container{text-align:center;position:absolute;width:100%;height:100%;left:0;top:0;padding:0 8px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.mfp-container:before{content:'';display:inline-block;height:100%;vertical-align:middle}.mfp-align-top .mfp-container:before{display:none}.mfp-content{position:relative;display:inline-block;vertical-align:middle;margin:0 auto;text-align:left;z-index:1045}.mfp-ajax-holder .mfp-content,.mfp-inline-holder .mfp-content{width:100%;cursor:auto}.mfp-ajax-cur{cursor:progress}.mfp-zoom-out-cur{cursor:crosshair}.mfp-zoom{cursor:pointer;cursor:-webkit-zoom-in;cursor:-moz-zoom-in;cursor:zoom-in}.mfp-auto-cursor .mfp-content{cursor:auto}.mfp-arrow,.mfp-close,.mfp-counter,.mfp-preloader{-webkit-user-select:none;-moz-user-select:none;user-select:none}.mfp-loading.mfp-figure{display:none}.mfp-hide{display:none!important}.mfp-preloader{color:#ccc;position:absolute;top:50%;width:auto;text-align:center;margin-top:-.8em;left:8px;right:8px;z-index:1044}.mfp-preloader a{color:#ccc}.mfp-preloader a:hover{color:#fff}.mfp-s-error .mfp-content,.mfp-s-ready .mfp-preloader{display:none}button.mfp-arrow,button.mfp-close{overflow:visible;cursor:pointer;background:0 0;border:0;display:block;outline:0;padding:0;z-index:1046;-webkit-box-shadow:none;box-shadow:none}button::-moz-focus-inner{padding:0;border:0}.mfp-close{width:44px;height:44px;line-height:44px;position:absolute;right:0;top:0;text-decoration:none;text-align:center;opacity:.65;filter:alpha(opacity=65);padding:0 0 18px 10px;color:#fff;font-style:normal;font-size:28px;font-family:Arial,Baskerville,monospace}.mfp-close:focus,.mfp-close:hover{opacity:1;filter:alpha(opacity=100)}.mfp-close:active{top:1px}.mfp-close-btn-in .mfp-close{color:#333}.mfp-iframe-holder .mfp-close,.mfp-image-holder .mfp-close{color:#fff;right:-6px;text-align:right;padding-right:6px;width:100%}.mfp-counter{position:absolute;top:0;right:0;color:#ccc;font-size:12px;line-height:18px}.mfp-arrow{position:absolute;opacity:.65;filter:alpha(opacity=65);margin:0;top:50%;margin-top:-55px;padding:0;width:90px;height:110px;-webkit-tap-highlight-color:rgba(0,0,0,0)}.mfp-arrow:active{margin-top:-54px}.mfp-arrow:focus,.mfp-arrow:hover{opacity:1;filter:alpha(opacity=100)}.mfp-arrow .mfp-a,.mfp-arrow .mfp-b,.mfp-arrow:after,.mfp-arrow:before{content:'';display:block;width:0;height:0;position:absolute;left:0;top:0;margin-top:35px;margin-left:35px;border:medium inset transparent}.mfp-arrow .mfp-a,.mfp-arrow:after{border-top-width:13px;border-bottom-width:13px;top:8px}.mfp-arrow .mfp-b,.mfp-arrow:before{border-top-width:21px;border-bottom-width:21px;opacity:.7}.mfp-arrow-left{left:0}.mfp-arrow-left .mfp-a,.mfp-arrow-left:after{border-right:17px solid #fff;margin-left:31px}.mfp-arrow-left .mfp-b,.mfp-arrow-left:before{margin-left:25px}.mfp-arrow-right{right:0}.mfp-arrow-right .mfp-a,.mfp-arrow-right:after{border-left:17px solid #fff;margin-left:39px}.mfp-iframe-holder{padding-top:40px;padding-bottom:40px}.mfp-iframe-holder .mfp-content{line-height:0;width:100%;max-width:900px}.mfp-iframe-holder .mfp-close{top:-40px}.mfp-iframe-scaler{width:100%;height:0;overflow:hidden;padding-top:56.25%}.mfp-iframe-scaler iframe{position:absolute;display:block;top:0;left:0;width:100%;height:100%;box-shadow:0 0 8px rgba(0,0,0,.6);background:#000}img.mfp-img{width:auto;max-width:100%;height:auto;display:block;line-height:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:40px 0;margin:0 auto}.mfp-figure{line-height:0}.mfp-figure:after{content:'';position:absolute;left:0;top:40px;bottom:40px;display:block;right:0;width:auto;height:auto;z-index:-1;box-shadow:0 0 8px rgba(0,0,0,.6);background:#444}.mfp-figure small{color:#bdbdbd;display:block;font-size:12px;line-height:14px}.mfp-figure figure{margin:0}.mfp-bottom-bar{margin-top:-36px;position:absolute;top:100%;left:0;width:100%;cursor:auto}.mfp-title{text-align:left;line-height:18px;color:#f3f3f3;word-wrap:break-word;padding-right:36px}.mfp-image-holder .mfp-content{max-width:100%}.mfp-gallery .mfp-image-holder .mfp-figure{cursor:pointer}@media screen and (max-width:800px) and (orientation:landscape),screen and (max-height:300px){.mfp-img-mobile .mfp-image-holder{padding-left:0;padding-right:0}.mfp-img-mobile img.mfp-img{padding:0}.mfp-img-mobile .mfp-figure:after{top:0;bottom:0}.mfp-img-mobile .mfp-figure small{display:inline;margin-left:5px}.mfp-img-mobile .mfp-bottom-bar{background:rgba(0,0,0,.6);bottom:0;margin:0;top:auto;padding:3px 5px;position:fixed;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}.mfp-img-mobile .mfp-bottom-bar:empty{padding:0}.mfp-img-mobile .mfp-counter{right:5px;top:3px}.mfp-img-mobile .mfp-close{top:0;right:0;width:35px;height:35px;line-height:35px;background:rgba(0,0,0,.6);position:fixed;text-align:center;padding:0}}@media all and (max-width:900px){.mfp-arrow{-webkit-transform:scale(0.75);transform:scale(0.75)}.mfp-arrow-left{-webkit-transform-origin:0;transform-origin:0}.mfp-arrow-right{-webkit-transform-origin:100%;transform-origin:100%}.mfp-container{padding-left:6px;padding-right:6px}}.mfp-ie7 .mfp-img{padding:0}.mfp-ie7 .mfp-bottom-bar{width:600px;left:50%;margin-left:-300px;margin-top:5px;padding-bottom:5px}.mfp-ie7 .mfp-container{padding:0}.mfp-ie7 .mfp-content{padding-top:44px}.mfp-ie7 .mfp-close{top:0;right:0;padding-top:0}
  167.  
  168. /* videos */
  169. .i_Frame{
  170. position: relative;
  171. background: #fff;
  172. }
  173. .responsive-video-wrapper{
  174. width:100%;position:relative;padding:0;
  175. -webkit-transition: all 1.9s ease;
  176. -ms-transition: all 1.9s ease;
  177. -o-transition: all 1.9s ease;
  178. transition: all 1.9s ease;
  179. }
  180. .responsive-video-wrapper iframe,.responsive-video-wrapper object,.responsive-video-wrapper embed{
  181. position:absolute;top:0;left:0;width:100%;height:100%
  182. }
  183. /* Typography */
  184. .text_caption{
  185. padding: 10px 10px 5px;
  186. }
  187. {block:PermalinkPage}
  188. .text_caption{
  189. padding: 20px 20px 15px;
  190. border-radius: 3px;
  191. margin-bottom: 15px;
  192. background: #fff;
  193. }
  194. {/block:PermalinkPage}
  195. .text_caption a , .decsol a , .note a , .tags a{
  196. background-color: rgba(68,68,68,0);
  197. background-image: -webkit-linear-gradient(top,rgba(68,68,68,0)50%,rgba(68,68,68,.25)50%);
  198. background-image: linear-gradient(to bottom,rgba(68,68,68,0)50%,rgba(68,68,68,.25)50%);
  199. color: #919191;
  200. text-decoration: none;
  201. background-repeat: repeat-x;
  202. background-size: 1em 2px;
  203. background-position: 0 1.15em;
  204. padding-bottom: .15em;
  205. margin-right: 3px;
  206. }
  207. .tags a{
  208. margin-right: 5px;
  209. }
  210. .text_caption a:hover , .note a:hover , .decsol a:hover{
  211. background: #fff;
  212. color: #444;
  213. }
  214. p{
  215. margin: 15px 0;
  216. padding: 0;
  217. }
  218. p.description{
  219. margin: 15px 0;
  220. }
  221. .text_caption p:last-child , .text_caption blockquote:last-child{
  222. margin-bottom: 0;
  223. }
  224. .text_caption p:first-child{
  225. margin-top: 0;
  226. }
  227. b{
  228. font-weight: 700;
  229. line-height: 1.3;
  230. }
  231. blockquote {
  232. border-left: 2px solid #e6e6e6;
  233. padding: 0 0 0 18px;
  234. margin: 15px 0px;
  235. font-size: 15px;
  236. }
  237.  
  238. .text_caption > blockquote{
  239. margin: 15px 0px;
  240. }
  241. /* Answer */
  242. .answer-post-wrap{
  243. width: 100%;
  244. padding:15px 0;
  245. }
  246. .asker-wrap , .answer-wrap{
  247. text-align: center;
  248. }
  249. .asker-wrap .decsol ,.answer-wrap .decsol{
  250. min-height: 80px;
  251. padding-top: 10px;
  252. padding-bottom: 10px;
  253. }
  254. .decsol{
  255. padding: 0px 20px;
  256. text-align: center;
  257. line-height: 1.4;
  258. }
  259. .decsol img{
  260. margin: 10px 0px;
  261. }
  262. .border_middle_post{
  263. border-bottom: 1px solid transparent;
  264. -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
  265. box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
  266. border-color: #EDECEC;
  267. margin: 10px auto;
  268. }
  269. /* Chat */
  270. .chattitle{
  271. width: 100%;
  272. padding: 20px;
  273. font-size: 19px;
  274. text-align: center;
  275. color: #9E6A8C;
  276. }
  277. .chatwrap{
  278. padding:5px;
  279. }
  280. .chatwrap .line{
  281. line-height: 1.8;
  282. }
  283. div[class^='user']{
  284. border-bottom: 1px solid transparent;
  285. -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
  286. box-shadow: inset 0 1px 0 rgba(255,255,255,.1);
  287. border-color: #F7F7F7;
  288. padding-bottom: 5px;
  289. padding-top: 7px;
  290. }
  291. div[class^='user']:first-child{
  292. box-shadow: none;
  293. -webkit-box-shadow:none;
  294. }
  295. .labe_l{
  296. font-weight: bold;
  297. color: #000;
  298. }
  299. div[class^='user']:last-child{
  300. border-bottom: none;
  301. }
  302. /*text */
  303. .link_button , .text_button , .quote_button{
  304. border-radius: 0px;
  305. color: #FFF;
  306. background-color: transparent;
  307. opacity: 1;
  308. transition: opacity 0.25s linear 0s;
  309. }
  310. .link_og_blockquote{
  311. padding: 10px 0px 10px 10px;
  312. }
  313. .link_text_container {
  314. height: 100%;
  315. padding: 10px;
  316. overflow: hidden;
  317. }
  318. .link_text_outer {
  319. display: table;
  320. width: 100%;
  321. min-height: 100%;
  322. height: 58px;
  323. }
  324. .link_text_outer .link_text{
  325. display: table-cell;
  326. width: 100%;
  327. vertical-align: middle;
  328. text-align: center;
  329. }
  330. .fa-quote-left{
  331. margin-right: 7px;
  332. }
  333. .post_media a {
  334. text-decoration: none;
  335. }
  336. .link_text_container .link_text .link_title , .quote_title{
  337. color: #FFF;
  338. margin-left: auto;
  339. display: block;
  340. font-size: 16px;
  341. line-height: 24px;
  342. margin-bottom: 8px;
  343. margin-right: auto;
  344. max-width: 460px;
  345. overflow: visible;
  346. text-decoration: none;
  347. text-overflow: ellipsis;
  348. letter-spacing: 0.5px;
  349. position: relative;
  350. }
  351. .quote_title{
  352. margin-bottom: 0;
  353. }
  354. .fa-chevron-right{
  355. font-weight: normal;
  356. margin-left: 10px;
  357. font-size: 14px;
  358. }
  359. .post_content a {
  360. background-color: rgba(68, 68, 68, 0);
  361. background-repeat: repeat-x;
  362. background-size: 1em 2px;
  363. background-position: 0px 1.15em;
  364. }
  365. .link_text_container .link_text .link_source {
  366. display: block;
  367. font-size: 12px;
  368. color: rgba(255, 255, 255, 0.7);
  369. overflow: hidden;
  370. margin-left: auto;
  371. margin-right: auto;
  372. max-width: 460px;
  373. text-overflow: ellipsis;
  374. font-weight: 400;
  375. text-transform: uppercase;
  376. }
  377. .post_content_inner {
  378. padding: 10px 10px 0px;
  379. overflow: hidden;
  380. }
  381. .post_body > :first-child {
  382. margin-top: 0px;
  383. }
  384. .post_body > :last-child {
  385. margin-bottom: 0px;
  386. }
  387. .post_body{
  388. padding-bottom: 10px;
  389. }
  390. .post_content blockquote {
  391. border-left: 2px solid #E6E6E6;
  392. padding: 0px 0px 0px 18px;
  393. margin: 15px 0px;
  394. }
  395. .quote_button .link_text{
  396. text-align: left;
  397. }
  398. .header{
  399. text-align: center;
  400. margin: 0;
  401. padding: 0;
  402. }
  403. .AvatarShape{
  404. -webkit-transform: scale3d(0,0,1);
  405. transform: scale3d(0,0,1);
  406. -webkit-transform-origin: 50% 50%;
  407. transform-origin: 50% 50%;
  408. -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  409. transition: opacity 0.3s, transform 0.3s;
  410. }
  411. .square , .circle{
  412. border-radius: 5%;
  413. margin: 60px auto 0;
  414. }
  415. .circle{
  416. border-radius: 50%;
  417. }
  418. .header h1{
  419. font-size: 35px;
  420. padding: 20px;
  421. color: {color:Title Color};
  422. font-family:satisfy;
  423. opacity: 0;
  424. -webkit-transform: scale3d(1.3,1.3,1.3);
  425. transform: scale3d(1.3,1.3,1.3);
  426. -webkit-transform-origin: 50% 50%;
  427. transform-origin: 50% 50%;
  428. -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  429. transition: opacity 0.3s, transform 0.3s;
  430. }
  431. .header h1 a{
  432. color: {color:Title Color};
  433. }
  434. .header h2{
  435. font-size: 17px;
  436. line-height: 1.5;
  437. padding: 0 10px;
  438. margin: 5px auto;
  439. color: {color:Description Color};
  440. opacity: 0;
  441. -webkit-transform: scale3d(0,0,1);
  442. transform: scale3d(0,0,1);
  443. -webkit-transform-origin: 50% 50%;
  444. transform-origin: 50% 50%;
  445. -webkit-transition: opacity 0.5s, -webkit-transform 0.5s;
  446. transition: opacity 0.5s, transform 0.5s;
  447. }
  448. .tooltip {
  449. display: inline;
  450. z-index: 999;
  451. }
  452. /* Trigger text */
  453. .tooltip-item {
  454. background: #fff;
  455. width: 40px;
  456. height: 30px;
  457. line-height: 35px;
  458. position: absolute;
  459. cursor: pointer;
  460. border-top-left-radius: 3px;
  461. border-top-right-radius: 3px;
  462. text-align: center;
  463. bottom: 13px;
  464. right: 0px;
  465. left: 5px;
  466. margin: auto;
  467. }
  468. .col-md-6 .tooltip-item , .col-md-4 .tooltip-item{
  469. bottom: 25px;
  470. }
  471. /* Gap filler */
  472. .tooltip-item::after {
  473. content: '';
  474. position: absolute;
  475. width: 360px;
  476. height: 20px;
  477. bottom: 100%;
  478. left: 50%;
  479. pointer-events: none;
  480. -webkit-transform: translateX(-50%);
  481. transform: translateX(-50%);
  482. }
  483. .tooltip:hover .tooltip-item::after {
  484. pointer-events: auto;
  485. }
  486. /* Tooltip */
  487. .tooltip-content {
  488. position: absolute;
  489. z-index: 9999;
  490. width: 200px;
  491. left: 50%;
  492. margin: 0 0 35px -100px;
  493. bottom: 30px;
  494. text-align: center;
  495. font-size: 0.765em;
  496. line-height: 1.4;
  497. box-shadow: -5px -5px 15px rgba(48,54,61,0.2);
  498. background: #2a3035;
  499. opacity: 0;
  500. cursor: default;
  501. pointer-events: none;
  502. }
  503. .col-md-6 .tooltip-content , .col-md-4 .tooltip-content{
  504. margin: 0 0 35px -100px;
  505. }
  506. .tooltip-effect-3 .tooltip-content {
  507. -webkit-transform: translate3d(0,10px,0) rotate3d(1,1,0,25deg);
  508. transform: translate3d(0,10px,0) rotate3d(1,1,0,25deg);
  509. -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  510. transition: opacity 0.3s, transform 0.3s;
  511. }
  512. .tooltiphover:hover .tooltip-content {
  513. pointer-events: auto;
  514. opacity: 1;
  515. -webkit-transform: translate3d(0,0,0) rotate3d(0,0,0,0);
  516. transform: translate3d(0,0,0) rotate3d(0,0,0,0);
  517. }
  518. /* Arrow */
  519. .tooltip-content::after {
  520. content: '';
  521. top: 100%;
  522. left: 52%;
  523. border: solid transparent;
  524. height: 0;
  525. width: 0;
  526. position: absolute;
  527. pointer-events: none;
  528. border-color: transparent;
  529. border-top-color: #2a3035;
  530. border-width: 8px;
  531. margin-left: -10px;
  532. }
  533. /* Tooltip content*/
  534. .tooltip-content img {
  535. position: relative;
  536. height: 48px;
  537. width: 48px;
  538. margin: 15px 0px 15px 15px;
  539. float: left;
  540. }
  541. .tooltip-text {
  542. line-height: 1.5;
  543. font-size: 11px;
  544. display: block;
  545. color: #EDBA17;
  546. font-weight: bold;
  547. margin-top: 15px;
  548. }
  549. .tooltip-text a {
  550. font-weight: bold;
  551. line-height: 1.6;
  552. color: #03A8D8;
  553. }
  554. .here{
  555. position: absolute;
  556. bottom: 15px;
  557. right: 15px;
  558. width: 30px;
  559. line-height: 35px;
  560. text-align: center;
  561. height: 30px;
  562. background: rgba(255,255,255,1);
  563. color: #676767;
  564. border-radius: 3px;
  565. cursor: pointer;
  566. font-family:satisfy;
  567. opacity: 0;
  568. z-index: 1;
  569. }
  570. .post:hover .here{
  571. opacity: 1;
  572. }
  573. /* Pages */
  574. .pagination {
  575. display: block;
  576. margin: 40px 0px;
  577. -webkit-border-radius: 0;
  578. border-radius: 0;
  579. text-align: center;
  580. padding: 0px;
  581. }
  582. .pagination ul {
  583. -webkit-box-shadow: none;
  584. -moz-box-shadow: none;
  585. box-shadow: none;
  586. list-style: none;
  587. padding: 0;
  588. margin: 0;
  589. }
  590. .pagination ul > li {
  591. display: inline-block;
  592. margin-bottom: 10px;
  593. margin-top: 10px;
  594. }
  595. .pagination ul > li > a, .pagination ul > li > span {
  596. float: none;
  597. margin: 0;
  598. margin-right: 3px;
  599. }
  600. .btn {
  601. color: #fff !important;
  602. background: none;
  603. border: 1px solid rgba(255,255,255,1);
  604. margin-bottom: 10px;
  605. margin-right: 4px;
  606. font-size: 11px;
  607. padding: 3px 12px 2px;
  608. font-weight: 800;
  609. text-shadow: none;
  610. text-transform: uppercase;
  611. -webkit-border-radius: 0;
  612. border-radius: 0px;
  613. -webkit-box-shadow: none;
  614. -moz-box-shadow: none;
  615. box-shadow: none;
  616. display: inline-block;
  617. }
  618. {block:IfInfiniteScrolling}
  619. .pagination{
  620. opacity: 0;
  621. visibility: hidden;
  622. }
  623. .container{
  624. margin-bottom: 150px;
  625. }
  626. {/block:IfInfiniteScrolling}
  627. .center{
  628. text-align: center;
  629. z-index: 1;
  630. }
  631. .menu {
  632. position: relative;
  633. width: auto;
  634. height: auto;
  635. padding: 0;
  636. background: transparent;
  637. text-align: center;
  638. display: inline-block;
  639. word-wrap: break-word;
  640. margin: 0 auto;
  641. }
  642. .menu nav a{
  643. float: left;
  644. position: relative;
  645. top: 0;
  646. left: 0;
  647. width: 40px;
  648. height: 40px;
  649. line-height: 42px;
  650. text-align: center;
  651. color: #fff;
  652. opacity: 0;
  653. font-weight: normal;
  654. text-decoration: none;
  655. -webkit-transform: scale3d(0,0,1);
  656. transform: scale3d(0,0,1);
  657. -webkit-transform-origin: 50% 50%;
  658. transform-origin: 50% 50%;
  659. -webkit-transition: opacity 0.3s, -webkit-transform 0.3s;
  660. transition: opacity 0.3s, transform 0.3s;
  661. }
  662. .cuddles{
  663. opacity: 1 !important;
  664. -webkit-transform: scale3d(1,1,1) !important;
  665. transform: scale3d(1,1,1) !important;
  666. }
  667. .menu nav a i{
  668. position: relative;
  669. font-size: 16px;
  670. -webkit-transition-property: line-height;
  671. -moz-transition-property: line-height;
  672. -ms-transition-property: line-height;
  673. -o-transition-property: line-height;
  674. transition-property: line-height;
  675. -webkit-transition-duration: .08s;
  676. -moz-transition-duration: .08s;
  677. -ms-transition-duration: .08s;
  678. -o-transition-duration: .08s;
  679. transition-duration: .08s;
  680. -webkit-transition-timing-function: linear;
  681. -moz-transition-timing-function: linear;
  682. -ms-transition-timing-function: linear;
  683. -o-transition-timing-function: linear;
  684. transition-timing-function: linear;
  685. -webkit-transition-delay: 0s;
  686. -moz-transition-delay: 0s;
  687. -ms-transition-delay: 0s;
  688. -o-transition-delay: 0s;
  689. transition-delay: 0s;
  690. }
  691. /* HINT */
  692. .hint, [data-hint] {
  693. position: relative;
  694. display: inline-block;
  695. }
  696. .hint:before, .hint:after, [data-hint]:before, [data-hint]:after {
  697. position: absolute;
  698. -webkit-transform: translate3d(0, 0, 0);
  699. -moz-transform: translate3d(0, 0, 0);
  700. transform: translate3d(0, 0, 0);
  701. visibility: hidden;
  702. opacity: 0;
  703. top: -30px;
  704. left: 0;
  705. z-index: 1000000;
  706. pointer-events: none;
  707. -webkit-transition: 0.3s ease;
  708. -moz-transition: 0.3s ease;
  709. transition: 0.3s ease;
  710. -webkit-transition-delay: 0ms;
  711. -moz-transition-delay: 0ms;
  712. transition-delay: 0ms;
  713. }
  714. .hint:hover:before, .hint:hover:after, .hint:focus:before, .hint:focus:after, [data-hint]:hover:before, [data-hint]:hover:after, [data-hint]:focus:before, [data-hint]:focus:after {
  715. visibility: visible;
  716. opacity: 1;
  717. border-top-color: ;
  718. }
  719. .hint:hover:before, .hint:hover:after, [data-hint]:hover:before, [data-hint]:hover:after {
  720. -webkit-transition-delay: 100ms;
  721. -moz-transition-delay: 100ms;
  722. transition-delay: 100ms;
  723. }
  724. .hint:before, [data-hint]:before {
  725. content: '';
  726. position: absolute;
  727. background: transparent;
  728. border: 6px solid transparent;
  729. z-index: 1000001;
  730. margin-top: 26px;
  731. margin-left: -15px;
  732. }
  733. .hint:after, [data-hint]:after {
  734. content: attr(data-hint);
  735. background: inherit;
  736. color: white;
  737. padding: 8px 10px;
  738. font-size: 12px;
  739. font-weight: bold;
  740. line-height: 12px;
  741. white-space: nowrap;
  742. }
  743. .hint--top:before {margin-bottom: -12px}
  744. .hint--top:after {margin-left: -18px;border-radius: 3px;box-shadow: 0 1px 2px rgba(0, 0, 0, 0.26);}
  745. .hint--top:before, .hint--top:after {left: 50%}
  746. .hint--top:hover:after, .hint--top:hover:before, .hint--top:focus:after, .hint--top:focus:before {
  747. -webkit-transform: translateY(-6px);
  748. -moz-transform: translateY(-6px);
  749. transform: translateY(-6px);
  750. }
  751. /* post-info-perma */
  752. ol.notes{
  753. list-style: none;
  754. padding: 25px;
  755. font-size: 14px;
  756. }
  757. .perma_post{
  758. margin-bottom: 25px;
  759. }
  760. .post-notes{
  761. background: #fff;
  762. border-radius: 3px;
  763. }
  764. .note{
  765. margin-bottom: 7px;
  766. }
  767. .action{
  768. margin-left: 10px;
  769. line-height: 1.8;
  770. }
  771. .disqus{
  772. background: #fff;
  773. padding: 30px;
  774. margin-top: 15px;
  775. border-radius: 3px;
  776. position: relative;
  777. }
  778.  
  779. .text_caption time{
  780. font-family: inherit;
  781. font-size: 13px;
  782. color: #777;
  783. }
  784. .text_caption time i{
  785. margin-right: 5px;
  786. }
  787. .text_caption time span{
  788. margin-right: 5px;
  789. margin-left: 5px;
  790.  
  791. }
  792. .text_caption time span:first-child{
  793. margin-left: 0;
  794. }
  795. /* Infinity */
  796. #infscr-loading{
  797. position: absolute;
  798. bottom: 0px;
  799. right: 0px;
  800. left: 0px;
  801. width: 200px;
  802. margin: auto;
  803. }
  804. #infscr-loading > img{
  805. display: none !important;
  806. }
  807. /* Infinity Spinner */
  808.  
  809. .spinner{
  810. width: 70px;
  811. height: 18px;
  812. position: absolute;
  813. top: 0;
  814. bottom: 0;
  815. right: 0;
  816. left: 0;
  817. margin: auto;
  818. text-align: center;
  819. }
  820. .spinnertags{
  821. text-align: center;
  822. margin: 15px auto;
  823. }
  824. .spinner > div , .spinnertags > div{
  825. width: 18px;
  826. height: 18px;
  827. background-color: #fff;
  828. border-radius: 100%;
  829. display: inline-block;
  830. -webkit-animation: bouncedelay 1.4s infinite ease-in-out;
  831. animation: bouncedelay 1.4s infinite ease-in-out;
  832. /* Prevent first frame from flickering when animation starts */
  833. -webkit-animation-fill-mode: both;
  834. animation-fill-mode: both;
  835. }
  836. .spinnertags > div{
  837. background-color: rgba(229, 170, 18, 0.5);
  838. }
  839. .spinner .bounce1 , .spinnertags .bounce1{
  840. -webkit-animation-delay: -0.32s;
  841. animation-delay: -0.32s;
  842. }
  843.  
  844. .spinner .bounce2 , .spinnertags .bounce2{
  845. -webkit-animation-delay: -0.16s;
  846. animation-delay: -0.16s;
  847. }
  848.  
  849. @-webkit-keyframes bouncedelay {
  850. 0%, 80%, 100% { -webkit-transform: scale(0.0) }
  851. 40% { -webkit-transform: scale(1.0) }
  852. }
  853.  
  854. @keyframes bouncedelay {
  855. 0%, 80%, 100% {
  856. transform: scale(0.0);
  857. -webkit-transform: scale(0.0);
  858. } 40% {
  859. transform: scale(1.0);
  860. -webkit-transform: scale(1.0);
  861. }
  862. }
  863. .scrollup{
  864. position: fixed;
  865. bottom: 10px;
  866. right: 10px;
  867. width: 35px;
  868. height: 35px;
  869. line-height: 35px;
  870. cursor: pointer;
  871. color: #000;
  872. z-index: 99;
  873. display: none;
  874. text-align: center;
  875. background: rgba(255,255,255,0.1);
  876. }
  877. .like_btn{
  878. position: relative;
  879. }
  880. .like_button {
  881. opacity: 0;
  882. z-index: 999999;
  883. cursor: pointer;
  884. position: absolute;
  885. top: -3px;
  886. left: 0px;
  887. }
  888. .like_btn .like_button.liked {
  889. opacity: 0;
  890. }
  891. .like_btn .like_button.liked + i {
  892. color: #b04b40;
  893. }
  894. /* More themes */
  895. .more_themes{
  896. position: absolute;
  897. text-align: center;
  898. z-index: 9;
  899. width: 100px;
  900. padding: 6px;
  901. background: #fff;
  902. box-shadow: 0 0px 2px rgba(0, 0, 0, 0.2);
  903. border-radius: 3px;
  904. left: -5px;
  905. display: none;
  906. top: 50px;
  907. }
  908. .more_themes a{
  909. color: {color:Gradient top};
  910. }
  911. .more_themes a:hover{
  912. text-decoration: underline;
  913. }
  914. .colornote{
  915. width: 400px;
  916. text-align: center;
  917. line-height: 1.7;
  918. padding: 10px;
  919. background: #fff;
  920. margin: 5px auto 20px;
  921. position: relative;
  922. border-radius: 3px;
  923. display: none;
  924. }
  925. .colornote:after{
  926. content: '';
  927. top: 100%;
  928. left: 50%;
  929. border: solid transparent;
  930. height: 0;
  931. width: 0;
  932. position: absolute;
  933. pointer-events: none;
  934. border-color: transparent;
  935. border-top-color: #fff;
  936. border-width: 8px;
  937. margin-left: -10px;
  938. }
  939. /* Footer */
  940. #footer{
  941. color: {color:Footer Color};
  942. opacity: 0.8;
  943. text-align: center;
  944. float: left;
  945. font-size: 14px;
  946. letter-spacing: 1px;
  947. margin: 0px;
  948. width: 100%;
  949. }
  950. .footer{
  951. color: rgb(255,255,255,0.8);
  952. font-family: 'Ubuntu',sans-serif;
  953. text-decoration: none;
  954. }
  955. .footer p{
  956. font-size: 12px;
  957. letter-spacing: 1px;
  958. padding-left: 15px;
  959. padding-right: 15px;
  960. }
  961. .footer a{
  962. color: {color:Footer Color};
  963. text-decoration: none;
  964. text-transform: uppercase;
  965. }
  966. .footer a:hover{
  967. text-decoration: underline;
  968. }
  969. /* Small devices (tablets, 768px and up) */
  970. @media (min-width: 768px) {
  971. .col-md-3{
  972. padding: 8px !important;
  973. }
  974. .col-md-4 , .col-md-6{
  975. padding-right: 15px !important;
  976. padding-left: 15px !important;
  977. }
  978. }
  979. /* Medium devices (desktops, 992px and up) */
  980. @media (min-width: 992px) {
  981.  
  982. .header h1{
  983. font-size: 40px;
  984. padding: 20px;
  985. }
  986. .header h2{
  987. font-size: 20px;
  988. padding: 0 50px;
  989. }
  990. .menu nav a:first-child{
  991. border-bottom-left-radius: 3px;
  992. border-top-left-radius: 3px;
  993. }
  994. .menu nav a:last-child{
  995. border-bottom-right-radius: 3px;
  996. border-top-right-radius: 3px;
  997. }
  998. .is-sticky .menu nav a{
  999. border-radius: 0 !important
  1000. }
  1001. .is-sticky .menu{
  1002. background: rgba(255,255,255,0.1);
  1003. padding: 0 7px 7px 7px;
  1004. border-bottom-right-radius: 3px;
  1005. border-bottom-left-radius: 3px;
  1006. box-shadow: 0 1px 5px rgba(0, 0, 0, 0.46);
  1007. }
  1008. .tooltip-item{
  1009. width: 25px;
  1010. height: 20px;
  1011. line-height: 24px;
  1012. opacity: 0;
  1013. }
  1014. .post:hover .tooltip-item{
  1015. opacity: 1;
  1016. }
  1017. .tooltip-content {
  1018. margin: 0 0 20px -100px;
  1019. }
  1020. .link_text_container .link_text .link_title, .quote_title{
  1021. font-size: 20px;
  1022. line-height: 25px;
  1023. }
  1024. }
  1025. /* Large devices (large desktops, 1200px and up) */
  1026. @media (min-width: 1200px) {
  1027. .container {
  1028. width: 1100px;
  1029. }
  1030. iframe#tumblr_controls{
  1031. right: 4px;
  1032. -webkit-filter: invert(100%);
  1033. }
  1034. .header h1{
  1035. font-size: 45px;
  1036. padding: 20px;
  1037. }
  1038. .header h2{
  1039. font-size: 16px;
  1040. padding: 0 300px;
  1041. }
  1042. }
  1043. {CustomCSS}
  1044. </style>
  1045. </head>
  1046. <body>
  1047. <div class="container-fluid">
  1048. <div class="more_themes">
  1049. <a href="http://dejavu-themes.tumblr.com/" target="_blank">theme</a>
  1050. </div>
  1051. <div class="row">
  1052. <div class="col-md-12 header">
  1053. <a href="/"><img class="{AvatarShape} AvatarShape" src="{PortraitURL-96}"></a>
  1054. <h1><a href="/">{Title}</a></h1>
  1055. {block:ShowDescription}<h2>{Description}</h2>{/block:ShowDescription}
  1056. </div>
  1057. </div>
  1058. </div>
  1059. <div class="container">
  1060. <div class="row">
  1061. <div class="center">
  1062. <div class="colornote">
  1063. 5 levels of brightness from 1 to 5, level 1 being the darkest.<br> Check it on your theme options.
  1064. </div>
  1065. <div class="menu">
  1066. <nav>
  1067. {block:IndexPage}<a href="/" data-hint="Home" class="hint--top" {Target}><i class="fa fa-laptop"></i></a>{block:AskEnabled}
  1068. <a href="/ask" data-hint="{AskLabel}" class="hint--top" {Target}><i class="fa fa-envelope-o"></i>
  1069. </a>{/block:AskEnabled}
  1070. {block:SubmissionsEnabled}
  1071. <a href="/submit" data-hint="{SubmitLabel}" class="hint--top" {Target}><i class="fa fa-inbox"></i></a>{/block:SubmissionsEnabled}
  1072. {block:HasPages}
  1073. {block:Pages}<a href="{URL}" data-hint="{Label}" class="hint--top" {Target}><i class="fa fa-file-text-o"></i></a>{/block:Pages}
  1074. {/block:HasPages}
  1075. {block:IfTag1}<a href="{BlogURL}tagged/{text:Tag 1}" data-hint="{text:Tag 1}" class="hint--top" {Target}><i class="fa fa-tag"></i></a>{/block:IfTag1}
  1076. {block:IfTag2}<a href="{BlogURL}tagged/{text:Tag 2}" data-hint="{text:Tag 2}" class="hint--top" {Target}><i class="fa fa-tag"></i></a>{/block:IfTag2}
  1077. {block:IfTag3}<a href="{BlogURL}tagged/{text:Tag 3}" data-hint="{text:Tag 3}" class="hint--top" {Target}><i class="fa fa-tag"></i></a>{/block:IfTag3}
  1078. {block:IfTag4}<a href="{BlogURL}tagged/{text:Tag 4}" data-hint="{text:Tag 4}" class="hint--top" {Target}><i class="fa fa-tag"></i></a>{/block:IfTag4}
  1079. {block:IfTag5}<a href="{BlogURL}tagged/{text:Tag 5}" data-hint="{text:Tag 5}" class="hint--top" {Target}><i class="fa fa-tag"></i></a>{/block:IfTag5}
  1080. {block:IfFacebookURL}<a href="{text:Facebook URL}" data-hint="Facebook" class="hint--top" {Target}><i class="fa fa-facebook"></i></a>
  1081. {/block:IfFacebookURL}
  1082. {block:IfInstagramURL}<a href="{text:Instagram URL}" data-hint="Instagram" class="hint--top" {Target}><i class="fa fa-instagram"></i></a>{/block:IfInstagramURL}
  1083. {block:IfGoogleURL}<a href="{text:Google URL}" data-hint="Google +" class="hint--top" {Target}><i class="fa fa-google-plus"></i></a>
  1084. {/block:IfGoogleURL}
  1085. {block:IfVineURL}<a href="{text:Vine URL}" data-hint="Vine" class="hint--top" {Target}><i class="fa fa-vine"></i></a>
  1086. {/block:IfVineURL}
  1087. {block:IfTwitterURL}<a href="{text:Twitter URL}" data-hint="Twitter" class="hint--top" {Target}><i class="fa fa-twitter"></i></a>
  1088. {/block:IfTwitterURL}
  1089. {block:IfPinterestURL}<a href="{text:Pinterest URL}" data-hint="Pinterest" class="hint--top" {Target}><i class="fa fa-pinterest-p"></i></a>
  1090. {/block:IfPinterestURL}
  1091. {block:IfLinkedInURL}<a href="{text:LinkedIn URL}" data-hint="LinkedIn" class="hint--top" {Target}><i class="fa fa-linkedin"></i></a>
  1092. {/block:IfLinkedInURL}
  1093. {block:IfDribbbleURL}<a href="{text:Dribbble URL}" data-hint="Dribbble" class="hint--top" {Target}><i class="fa fa-dribbble"></i></a>
  1094. {block:IfDribbbleURL}
  1095. {block:IfFlickrURL}<a href="{text:Flickr URL}" data-hint="Flickr" class="hint--top" {Target}><i class="fa fa-flickr"></i></a>
  1096. {/block:IfFlickrURL}
  1097. {block:IfWebSiteURL}<a href="{text:WebSite URL}" data-hint="WebSite" class="hint--top" {Target}><i class="fa fa-file-word-o"></i></a>
  1098. {/block:IfWebSiteURL}
  1099. {block:IfYoutubeURL}<a href="{text:Youtube URL}" data-hint="Youtube" class="hint--top" {Target}><i class="fa fa-youtube-play"></i></a>
  1100. {/block:IfYoutubeURL}
  1101. {block:IfVimeoURL}<a href="{text:Vimeo URL}" data-hint="Vimeo" class="hint--top" {Target}><i class="fa fa-vimeo-square"></i></a>
  1102. {/block:IfVimeoURL}
  1103. {block:IfDeviantArtURL}<a href="{text:DeviantArt URL}" data-hint="DeviantArt" class="hint--top" {Target}><i class="fa fa-deviantart"></i></a>
  1104. {/block:IfDeviantArtURL}
  1105. {block:IfBehanceURL}<a href="{text:Behance URL}" data-hint="Behance" class="hint--top" {Target}><i class="fa fa-behance"></i></a>
  1106. {/block:IfBehanceURL}
  1107. {block:IfGitHubURL}<a href="{text:GitHub URL}" data-hint="Github" class="hint--top" {Target}><i class="fa fa-github-alt"></i></a>
  1108. {/block:IfGitHubURL}
  1109. {block:IfSpotifyURL}<a href="{text:Spotify URL}" data-hint="Spotify" class="hint--top" {Target}><i class="fa fa-spotify"></i></a>
  1110. {/block:IfSpotifyURL}
  1111. {block:IfSoundCloudURL}<a href="{text:SoundCloud URL}" data-hint="SoundCloud" class="hint--top" {Target}><i class="fa fa-soundcloud"></i></a>
  1112. {/block:IfSoundCloudURL}
  1113. {block:IfWordpressURL}<a href="{text:Wordpress URL}" data-hint="Wordpress" class="hint--top" {Target}><i class="fa fa-wordpress"></i></a>
  1114. {/block:IfWordpressURL}
  1115. {block:IfShowFeedPage}
  1116. <a href="{RSS}" data-hint="{lang:Feed}" class="hint--top" {Target}>
  1117. <i class="fa fa-rss"></i>
  1118. </a>
  1119. {/block:IfShowFeedPage}
  1120. {block:IfShowRandomPost}
  1121. <a href="/random" data-hint="{lang:random}" class="hint--top" {Target}>
  1122. <i class="fa fa-random"></i>
  1123. </a>
  1124. {/block:IfShowRandomPost}
  1125. {block:IfShowArchivePage}
  1126. <a href="/archive" data-hint="{lang:Archive}" class="hint--top" {Target}>
  1127. <i class="fa fa-newspaper-o"></i>
  1128. </a>
  1129. {/block:IfShowArchivePage}
  1130. <a href="http://www.leenthemes.com/" data-hint="{lang:Install this theme}" class="hint--top" target="_blank"><i class="fa fa-paint-brush"></i></a>
  1131. {/block:IndexPage}
  1132. {block:PermalinkPage}
  1133. {block:PermalinkPagination}
  1134. {block:NextPost}
  1135. <a href="{NextPost}"><i class="fa fa-arrow-left"></i></a>
  1136. {/block:NextPost}
  1137. {block:PreviousPost}
  1138. <a href="{PreviousPost}"><i class="fa fa-arrow-right"></i></a>
  1139. {/block:PreviousPost}
  1140. {/block:PermalinkPagination}
  1141. {/block:PermalinkPage}
  1142. </nav>
  1143. </div>
  1144. </div>
  1145. <div class="col-md-12" id="organize">
  1146. <div id="grid">
  1147. {block:Posts}
  1148. {block:IndexPage}<div class="{select:Layout type} post" id="{PostID}">{/block:IndexPage}
  1149. {block:PermalinkPage}<div class="col-md-6 col-sm-6 col-xs-12 perma_post">{/block:PermalinkPage}
  1150. <div class="post_media">
  1151. {block:Photo}
  1152. {block:IndexPage}
  1153. <a href="{Permalink}">
  1154. <figure>
  1155. <img class="mainimg" src="{PhotoURL-400}" alt="{PhotoAlt}">
  1156. </figure>
  1157. </a>
  1158. {/block:IndexPage}
  1159. {block:PermalinkPage}
  1160. {LinkOpenTag}
  1161. <figure>
  1162. <img class="mainimg" src="{PhotoURL-1280}" alt="{PhotoAlt}">
  1163. </figure>
  1164. {LinkCloseTag}
  1165. {/block:PermalinkPage}
  1166. {/block:Photo}
  1167.  
  1168. {block:Photoset}
  1169. <div class="photoset-grid photoset{PostID}" data-layout="{PhotosetLayout}" data-id="photoset{PostID}" data-popup="{PostID}">
  1170. {block:Photos}
  1171. <img src="{PhotoURL-400}" width="{PhotoWidth-400}" height="{PhotoHeight-400}" {block:HighRes}data-highres="{PhotoURL-HighRes}"{/block:HighRes}
  1172. {block:Caption}alt="{Caption}"{/block:caption} />
  1173. {/block:Photos}
  1174. </div>
  1175. {/block:Photoset}
  1176.  
  1177. {block:Text}
  1178. <div class="post_media">
  1179. {block:Title}
  1180. <div class="text_button">
  1181. <div class="link_text_container">
  1182. <div class="link_text_outer">
  1183. <div class="link_text">
  1184. <a class="quote_title" href="{Permalink}" {Target}>{Title}</a>
  1185. </div>
  1186. </div>
  1187. </div>
  1188. </div>
  1189. {/block:Title}
  1190. <div class="text_caption">
  1191. {Body}
  1192. </div>
  1193. </div>
  1194. {/block:Text}
  1195.  
  1196.  
  1197. {block:Quote}
  1198. <div class="post_media">
  1199. <div class="quote_button">
  1200. <div class="link_text_container">
  1201. <div class="link_text_outer">
  1202. <div class="link_text">
  1203. <a class="quote_title" href="{Permalink}" {Target}><i class="fa fa-quote-left"></i>{Quote}</a>
  1204. </div>
  1205. </div>
  1206. </div>
  1207. </div>
  1208. {block:Source}
  1209. <div class="text_caption">
  1210. {Source}
  1211. </div>
  1212. {/block:Source}
  1213. </div>
  1214. {/block:Quote}
  1215. {block:Chat}
  1216. <div class="post_media">
  1217. <div class="chatwrap">
  1218. {block:Title}
  1219. <div class="chattitle">
  1220. {Title}
  1221. </div>
  1222. {/block:Title}
  1223. {block:Lines}
  1224. <div class="user_{UserNumber}">
  1225. {block:Label}
  1226. <span class="labe_l">{Label}</span>
  1227. {/block:Label}
  1228. <span class="line">{Line}</span>
  1229. </div>
  1230. {/block:Lines}
  1231. </div>
  1232. </div>
  1233. {/block:Chat}
  1234. {block:Link}
  1235. <div class="post_media">
  1236. <div class="link_button">
  1237. <div class="link_text_container">
  1238. <div class="link_text_outer">
  1239. <div class="link_text">
  1240. <a href="{URL}" target="_blank" class="link_title">{Name}<i class="fa fa-chevron-right"></i></a>
  1241. <a href="{URL}" target="_blank" class="link_source">{Host}</a>
  1242. </div>
  1243. </div>
  1244. </div>
  1245. </div>
  1246. {block:Description}
  1247. <div class="post_content_inner">
  1248. <div class="post_body" data-subview="body">
  1249. {Description}
  1250. </div>
  1251. </div>
  1252. {/block:Description}
  1253. </div>
  1254. {/block:Link}
  1255. {block:Answer}
  1256. <div class="post_media">
  1257. <div class="answer-post-wrap">
  1258. <div class="asker-wrap">
  1259. <img class="fl-left" src="{AskerPortraitURL-24}">
  1260. <div class="decsol">{Asker} asked: {Question}<div class="border_middle_post"></div></div>
  1261. </div>
  1262. {block:Answerer}
  1263. <div class="answer-wrap">
  1264. <img class="fl-left" src="{AnswererPortraitURL-24}" alt="{Title}"/>
  1265. <div class="decsol">{Answerer} answered: {Answer}</div>
  1266. </div>
  1267. {/block:Answerer}
  1268. {Replies}
  1269. </div>
  1270. </div>
  1271. {/block:Answer}
  1272. {block:Video}
  1273. <div class="i_Frame">
  1274. {VideoEmbed-250}
  1275. </div>
  1276. {/block:Video}
  1277. {block:Audio}
  1278. <div class="i_Frame">
  1279. {block:AudioEmbed}
  1280. {AudioEmbed}
  1281. {/block:AudioEmbed}
  1282. </div>
  1283. {/block:Audio}
  1284. <span class="tooltip tooltip-effect-3">
  1285. <span class="tooltip-item"><i class="fa fa-info"></i></span>
  1286. <span class="tooltip-content clearfix">
  1287. {block:RebloggedFrom}
  1288. <a href="{ReblogParentURL}" title="{ReblogParentTitle}" {Target}>
  1289. <img src="{ReblogParentPortraitURL-48}">
  1290. </a>
  1291. {/block:RebloggedFrom}
  1292. {block:NotReblog}
  1293. <a href="/" title="{Title}" {Target}>
  1294. <img src="{PortraitURL-48}">
  1295. </a>
  1296. {/block:NotReblog}
  1297. <span class="tooltip-text">
  1298. <time>
  1299. <div class="postdate">
  1300. <i class="fa fa-calendar"></i>
  1301. {DayOfMonthWithZero} {ShortMonth} {Year}
  1302. {block:NoteCount}
  1303. <br><i class="fa fa-heart"></i> {NoteCount}
  1304. {/block:NoteCount}
  1305. </div>
  1306. <a href="{ReblogURL}" title="Reblog" {Target}>
  1307. <i class="fa fa-retweet"></i> |
  1308. </a>
  1309. <a class="like_btn">
  1310. {LikeButton size="14"}
  1311. <i class="fa fa-heart"></i> |
  1312. </a>
  1313. <a href="{Permalink}" title="Permalink">
  1314. <i class="fa fa-arrow-right"></i>
  1315. </a>
  1316. </time>
  1317. </span>
  1318. </span>
  1319. </span>
  1320. </div><!-- End .post_media -->
  1321. {block:PermalinkPage}
  1322. {block:Date}
  1323. {block:IfDisqusShortname}
  1324. <div class="disqus">
  1325. <div id="disqus_thread"></div>
  1326. <script type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/embed.js"></script>
  1327. <noscript><a href="http://{text:Disqus Shortname}.disqus.com/?url=ref">{lang:View the discussion thread}</a></noscript>
  1328. </div>
  1329. {/block:IfDisqusShortname}
  1330. {/block:Date}
  1331. {/block:PermalinkPage}
  1332. </div>
  1333. {block:PermalinkPage}
  1334. {block:Date}
  1335. <div class="col-md-6 col-sm-6 col-xs-12 perma">
  1336. <figcaption class="text_caption">
  1337. <time>
  1338. <span class="postdate"><i class="fa fa-calendar"></i>{DayOfMonthWithZero} {ShortMonth} {Year}</span>
  1339. {block:NoteCount}
  1340. <span class="postnote"><i class="fa fa-heart"></i> {NoteCount}</span>
  1341. {/block:NoteCount}
  1342. </time>
  1343. {block:Caption}
  1344. {Caption}
  1345. {/block:Caption}
  1346. {block:HasTags}
  1347. <div class="tags">
  1348. {block:Tags}
  1349. <a href="{TagURL}" {Target}>#{Tag}</a>
  1350. {/block:Tags}
  1351. </div>
  1352. {/block:HasTags}
  1353. </figcaption>
  1354. {block:PostNotes}
  1355. <div class="post-notes">
  1356. {PostNotes-16}
  1357. </div>
  1358. {/block:PostNotes}
  1359. </div>
  1360. {/block:Date}
  1361. {/block:PermalinkPage}
  1362. {/block:Posts}
  1363. </div>
  1364. </div>
  1365. </div><!-- End .row -->
  1366. {block:Pagination}
  1367. <div class="col-md-12 col-xs-12 pagination">
  1368. <ul>
  1369. {block:PreviousPage}
  1370. <li><a href="{PreviousPage}" class="prev_page btn">{lang:Prev}</a></li>
  1371. {/block:PreviousPage}
  1372. {block:JumpPagination length="7"}
  1373. {block:CurrentPage}
  1374. <li><span class="current_page btn" >{PageNumber}</span></li>
  1375. {/block:CurrentPage}
  1376. {block:JumpPage}
  1377. <li class="jq"><a class="jump_page btn" href="{URL}">{PageNumber}</a></li>
  1378. {/block:JumpPage}
  1379. {/block:JumpPagination}
  1380. {block:NextPage}
  1381. <li><a id="a-next" href="{NextPage}" class="btn">{lang:Next}</a></li>
  1382. {/block:NextPage}
  1383. </ul>
  1384. </div><!-- End Pagination -->
  1385. {/block:Pagination}
  1386. <div class="scrollup"><i class="fa fa-arrow-up"></i></div>
  1387. </div><!-- End .container -->
  1388. <div id="footer">
  1389. <div class="footer">
  1390. <p>Copyright © {CopyrightYears} <span class="style1">{title}</span>.All rights reserved. Theme by <a href="http://www.leenthemes.com/" target="_blank">Hakuna Matata</a>
  1391. </p>
  1392. </div>
  1393. </div>
  1394. <script src="http://static.tumblr.com/zdvilra/qAqnnnd3t/jquery.sticky.js"></script>
  1395. <script type="text/javascript">
  1396. ( function($) {$.fn.responsiveVideo = function() {var $all_videos = $(".i_Frame");$all_videos = $(this).find( 'iframe, object, embed' );$all_videos.not( 'object object , .like_toggle, #lEENstagram , .bandcamp_audio_player ,.photoset , #submit_form , #ask_form , #dsq-2' ).each( function() {var $video = $(this);if ( $video.parents( 'object' ).length )return;if ( ! $video.prop( 'id' ) )$video.attr( 'id', 'sandy' + Math.floor( Math.random() * 999999 ) );$video.wrap( '<div class="responsive-video-wrapper" style="padding-top: ' + ( $video.attr( 'height' ) / $video.attr( 'width' ) * 100 ) + '%" />' ).removeAttr( 'height' ).removeAttr( 'width' );$video.closest( ".responsive-video-wrapper iframe" )});};} )(jQuery);
  1397. $("body").responsiveVideo();
  1398. $(document).ready(function(){
  1399. gridcolumn();mansory();photoset();showshape();RandColor();
  1400. $(".center").sticky({topSpacing:0});
  1401. $(".header h2 , .header h1 , .AvatarShape , .menu nav a").addClass("cuddles");
  1402. if(window.location.href.indexOf("https://assets.txmblr.com/") > -1) {
  1403. $(".sticky-wrapper").css("height","");
  1404. $('.more_themes , .colornote').show().fadeIn();
  1405. }
  1406. $('.scrollup').click(function(){$("html, body").animate({ scrollTop: 0 }, 600);return false;});
  1407. {block:IfInfiniteScrolling}
  1408. var $container = $("#grid");
  1409. $container.infinitescroll({
  1410. navSelector : 'div#loading_nav , .pagination',
  1411. nextSelector : '#a-next',
  1412. itemSelector : '.post',
  1413. loading:{finishedMsg:'<div id="#loadingeen" style="position:absolute;width:170px;height:70px;bottom: -100px;right:0px;left:0;margin:auto;z-index:999;color:#fff;text-align:center;"><strong>{lang:No more posts}</strong></div>',msgText:'<div id="#loading_nav" style="position:absolute;width:70px;height:70px;bottom: -100px;right:0px;left:0;margin:auto;z-index: 999"><div class="spinner"><div class="bounce1"></div><div class="bounce2"></div><div class="bounce3"></div></div></div>'}
  1414. },
  1415. function( newElements ) {
  1416. var $newElems = $( newElements ).css({ opacity: 0 });
  1417. var $newElemsIDs = $newElems.map(function () {
  1418. return this.id;
  1419. }).get();
  1420. $newElems.responsiveVideo();
  1421. mansory();RandColor();photoset();
  1422. setTimeout(function(){
  1423. $newElems.css({opacity: 1});
  1424. $container.masonry( 'appended', $newElems, true );
  1425. }, 500);
  1426. Tumblr.LikeButton.get_status_by_post_ids($newElemsIDs);
  1427. }
  1428. );
  1429. {/block:IfInfiniteScrolling}
  1430. });
  1431. var mansory = function(){
  1432. var $container = $("#grid");
  1433. $container.masonry({transitionDuration: 0});
  1434. setTimeout(function(){ $container.masonry() }, 100);
  1435. setTimeout(function(){ $container.masonry() }, 200);
  1436. setTimeout(function(){ $container.masonry() }, 300);
  1437. setTimeout(function(){ $container.masonry() }, 500);
  1438. setTimeout(function(){ $container.masonry() }, 1000);
  1439. setTimeout(function(){ $container.masonry() }, 2000);
  1440. setTimeout(function(){ $container.masonry() }, 4000);
  1441. setTimeout(function(){ $container.masonry() }, 6000);
  1442. $container.imagesLoaded().progress( function( instance, image ) {
  1443. image.isLoaded ? $container.masonry({transitionDuration: 0}) : $container.masonry({transitionDuration: 0});
  1444. });
  1445. }
  1446. var RandColor = function(){
  1447. var menucolor = $('.menu nav a , .link_button , .text_button , .quote_button , .btn , .current_page');
  1448. menucolor.each(function() {$(this).css('backgroundColor', getRandColor({select:Color Brightness}))});
  1449. }
  1450. var gridcolumn = function(){
  1451. var $organize = $("#organize");
  1452. var $elements = $(".post");
  1453. if ( $elements.hasClass( "col-md-6" ) ) {
  1454. $organize.removeClass("col-md-12").addClass("col-md-10 col-md-offset-1");
  1455. }
  1456. }
  1457. var photoset = function(){
  1458. var $allPhotoSets = $('.photoset-grid');
  1459. $allPhotoSets.photosetGrid({
  1460. highresLinks: true,
  1461. gutter: '5px',
  1462. onComplete: function(){
  1463. $allPhotoSets.each(function(){
  1464. var postClass = ".photoset" + $(this).data("popup");
  1465. $(postClass).magnificPopup({
  1466. delegate:"a.highres-link",
  1467. type:"image",
  1468. gallery:{enabled:!0}
  1469. });
  1470. })
  1471. }
  1472. });
  1473. }
  1474. function showshape(){
  1475. $(document).on("mousedown",".tooltip-item",function(){
  1476. $(this).closest('.tooltip').toggleClass("tooltiphover");
  1477. })
  1478. }
  1479. function getRandColor(brightness){
  1480. var rgb = [Math.random() * 256, Math.random() * 256, Math.random() * 256];
  1481. var mix = [brightness*51, brightness*51, brightness*51]; //51 => 255/5
  1482. var mixedrgb = [rgb[0] + mix[0], rgb[1] + mix[1], rgb[2] + mix[2]].map(function(x){ return Math.round(x/2.0)})
  1483. return "rgb(" + mixedrgb.join(",") + ")";
  1484. }
  1485. $( window ).resize(function() {mansory()});
  1486. $(window).scroll(function(){if ($(this).scrollTop() > 300) {$('.scrollup').fadeIn();} else {$('.scrollup , .colornote').fadeOut();}});
  1487. </script>
  1488. {block:IfGoogleAnalyticsID}
  1489. <script>
  1490. (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  1491. (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  1492. m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  1493. })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
  1494. ga('create', '{text:Google Analytics ID}', 'tumblr.com');
  1495. ga('send', 'pageview');
  1496. </script>
  1497. {/block:IfGoogleAnalyticsID}
  1498. </body>
  1499. </html><!-- 05/03/2015 1:51 AM -->
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!