thetruththemes

Town Pass Card Pink Theme

Jun 10th, 2015
7,587
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 50.03 KB | None | 0 0
  1. <html>
  2. <!---------------------------------------------------------------------------
  3.  
  4. ,,
  5. ,GG,
  6. GIIG
  7. Gl''lG
  8. ;G' 'G;
  9. GP YG
  10. oQ' 'Qo -Tᴏᴡɴ Pᴀss Cᴀʀᴅ ᴛʜᴇᴍᴇ ʙʏ
  11. *TGGGGGGGGGGGGQQQ, ,QQQGGGGGGGGGGGGP* ɴʏᴄᴛᴏᴛʜᴇᴍᴇs.ᴛᴜᴍʙʟʀ.ᴄᴏᴍ
  12. *TGo, '* *' ,oGP*
  13. *TGo, ɴʏᴄᴛ□ᴛʜᴇᴍᴇs ,oGP* -ᴘʟᴇᴀsᴇ ʀᴇғᴇʀ ᴛᴏ ᴏʀɪɢɪɴᴀʟ
  14. *TGio,, ,,oiGP* ᴘᴏsᴛ ʟɪɴᴋ ғᴏʀ ʀᴜʟᴇs ᴀɴᴅ ᴍɪsᴄ
  15. ;GGT' 'TGG:
  16. GG' ii 'GG -ᴅᴏ ɴᴏᴛ ʀᴇᴍᴏᴠᴇ ᴀɴʏ ᴏғ ᴛʜᴇ
  17. GG' ,GG, 'GG ᴄᴏᴅᴇ ᴄʀᴇᴅɪᴛ ᴏʀ ᴍᴏᴠᴇ ɪᴛ ᴛᴏ
  18. GG* oGGGGo. *GG ᴀ ᴘᴀɢᴇ.
  19. oG* oGG* *GGo. *Go
  20. ;GG;oGG* *GGo;GG;
  21. ,GGGT* *TGGG,
  22. ""' '""
  23.  
  24. ---------------------------------------------------------------------------->
  25.  
  26. <!-- Decorated Hover Titles 1/2 -->
  27. <link href="style-my-tooltips.css" rel="stylesheet" type="text/css" />
  28. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script><script>(function($){$(document).ready(function(){$("[title]").style_my_tooltips();});})(jQuery);</script>
  29.  
  30. <head>
  31.  
  32. {block:Ifcustomfavicon}<link rel="shortcut icon" href="{image:favicon}"/>{/block:Ifcustomfavicon}
  33. {block:IfNotcustomfavicon}<link rel="shortcut icon" href="{favicon}"/>{/block:IfNotcustomfavicon}
  34.  
  35. <link rel="alternate" type="application/rss+xml" href="{RSS}"/>
  36. <title>{Title}</title>
  37. {block:Description}<meta name="description" content="{MetaDescription}"/>{/block:Description}
  38.  
  39. <!-------------------------------- IMAGES ---------------------------------->
  40. <meta name="image:Background" content="http://static.tumblr.com/bba00573733437939dec431cf3ea2bdb/u5vz4xb/iHFnpr6wa/tumblr_static_evooyv3pfvkg4g4s8ok0gg4k.gif"/>
  41. <meta name="image:Top Bar BG" content="https://68.media.tumblr.com/dcb489f4358fbaa73682922d4aded783/tumblr_npettzPu4Q1s60yyoo4_r1_75sq.png"/>
  42. <meta name="image:Card BG" content="https://68.media.tumblr.com/dcb489f4358fbaa73682922d4aded783/tumblr_npettzPu4Q1s60yyoo4_r1_75sq.png"/>
  43. <meta name="image:ID Photo" content="https://secure.static.tumblr.com/ff7e57de0cb477bae6b5b3ecc7ed4f42/u5vz4xb/FGynpsvln/tumblr_static_7bvwvd8a0dgkwgo80880ggs4.png"/>
  44. <meta name="image:Town Flag" content="https://68.media.tumblr.com/36e841b74127830ba44a53d0ff00045b/tumblr_inline_npqwtmBP1I1rg1lxe_540.png"/>
  45. <meta name="image:Custom Cursor" content="http://static.tumblr.com/4b9e672ddfbce2e3f558f1f50ad83139/u5vz4xb/4QTnpkdss/tumblr_static_bwjv5rnhi3kgg80g8cs0gswkg.png"/>
  46. <meta name="image:Custom Cursor Links" content="http://static.tumblr.com/6f8c21cc6581ff3e5cde3cbb149e3e2e/u5vz4xb/E85npkdss/tumblr_static_ernun2pyp4gskg0k0k0wgwgw0.png"/>
  47. <meta name="image:Favicon" content="https://68.media.tumblr.com/94ac727789f06cefac433e915180ca69/tumblr_npettzPu4Q1s60yyoo5_r6_75sq.png"/>
  48. <meta name="image:Album Art" content="https://68.media.tumblr.com/4afdb448a180a10ab4290953e4093264/tumblr_npettzPu4Q1s60yyoo1_r4_100.png"/>
  49.  
  50. <!-------------------------------- COLORS ---------------------------------->
  51. <!-- Full Body -->
  52. <meta name="color:Background" content="#fdedc3"/>
  53. <meta name="color:Scroll BG" content="#fdedc3"/>
  54. <meta name="color:Scroll Thumb" content="#9881b6"/>
  55. <!-- Topbar -->
  56. <meta name="color:Top Bar BG" content="#ffbee8"/>
  57. <meta name="color:Top Bar Trim" content="#ff71bd"/>
  58. <meta name="color:Top Bar Shadow" content="#c63b74"/>
  59. <meta name="color:Pagination Current Page" content="#c63b74"/>
  60. <meta name="color:Pagination Text" content="#ffffff"/>
  61. <meta name="color:Pagination BG" content="#ff71bd"/>
  62. <meta name="color:Pagination Hover Text" content="#ff71bd"/>
  63. <meta name="color:Pagination Hover BG" content="#ffffff"/>
  64. <meta name="color:Main Links Symbols" content="#ffffff"/>
  65. <meta name="color:Main Link 1 BG" content="#73dc05"/>
  66. <meta name="color:Main Link 1 Hover Symbol" content="#118c00"/>
  67. <meta name="color:Main Link 2 BG" content="#ff68c8"/>
  68. <meta name="color:Main Link 2 Hover Symbol" content="#a51759"/>
  69. <meta name="color:Main Link 3 BG" content="#6465fb"/>
  70. <meta name="color:Main Link 3 Hover Symbol" content="#2a2b82"/>
  71. <meta name="color:Main Link 4 BG" content="#ff504e"/>
  72. <meta name="color:Main Link 4 Hover Symbol" content="#a10602"/>
  73. <meta name="color:Main Link 5 BG" content="#fac10f"/>
  74. <meta name="color:Main Link 5 Hover Symbol" content="#9b611c"/>
  75. <!-- Sidebar -->
  76. <meta name="color:Catchphrase Text" content="#945102"/>
  77. <meta name="color:Catchphrase BG 1" content="#feffdd"/>
  78. <meta name="color:Catchphrase BG 2" content="#fef78c"/>
  79. <meta name="color:Catchphrase Border" content="#fdd464"/>
  80. <meta name="color:Card BG" content="#ffbee8"/>
  81. <meta name="color:Card Trims" content="#ff71bd"/>
  82. <meta name="color:Card Highlights" content="#ffcae5"/>
  83. <meta name="color:Card Indents" content="#fdb6d4"/>
  84. <meta name="color:Card Shadows" content="#c63b74"/>
  85. <meta name="color:Card Info Text" content="#920937"/>
  86. <meta name="color:Description Text" content="#8375a5"/>
  87. <meta name="color:Description Links" content="#ffffff"/>
  88. <meta name="color:Description Links Hover" content="#f7d6ff"/>
  89. <meta name="color:Badge BG" content="#ffa802"/>
  90. <meta name="color:Badge Highlights" content="#ffe507"/>
  91. <meta name="color:Minor Links Hover" content="#e7c38c"/>
  92. <!-- Posts -->
  93. <meta name="color:Posts BG" content="#feffdd"/>
  94. <meta name="color:Posts 2nd BG" content="#faf7d5"/>
  95. <meta name="color:Posts Shadows" content="#e7ba96"/>
  96. <meta name="color:Posts Title" content="#d1ae71"/>
  97. <meta name="color:Posts Text" content="#f0c270"/>
  98. <meta name="color:Posts Bold" content="#d1ae71"/>
  99. <meta name="color:Posts Italic" content="#f0c270"/>
  100. <meta name="color:Posts Code" content="#aaaaaa"/>
  101. <meta name="color:Posts Code BG" content="#f7f7f9"/>
  102. <meta name="color:Posts Links" content="#b99edc"/>
  103. <meta name="color:Posts Links Hover" content="#8b5db8"/>
  104. <meta name="color:Posts Blockquote" content="#ffced4"/>
  105. <meta name="color:Audio Player" content="#9881b6"/>
  106. <!-- Post Endings -->
  107. <meta name="color:Postending Text" content="#b4bac3"/>
  108. <meta name="color:Postending BG" content="#fcf4e4"/>
  109. <meta name="color:Postending Links" content="#9d7ac4"/>
  110. <meta name="color:Postending Links Hover" content="#7e59ae"/>
  111. <!-- Permalink -->
  112. <meta name="color:Permalink Text" content="#e7ba96"/>
  113. <meta name="color:Permalink Links" content="#c69bda"/>
  114. <meta name="color:Permalink Links Hover" content="#a57ac4"/>
  115. <meta name="color:Permalink Blockquote" content="#e7ba96"/>
  116. <meta name="color:Permalink Scroll Thumb" content="#e7ba96"/>
  117. <!-- Misc. -->
  118. <meta name="color:Selection BG" content="#b99edc"/>
  119. <meta name="color:Selection Text" content="#ffffff"/>
  120. <meta name="color:Selection Links" content="#fff1ae"/>
  121.  
  122. <!------------------------------- OPTIONS ---------------------------------->
  123. <meta name="if:Monochrome Photos" content="0"/>
  124. <meta name="if:Fade Photos" content="1"/>
  125. <meta name="if:Postending Circles for Indexpage" content="1"/>
  126. <meta name="if:Custom Cursor" content="1"/>
  127. <meta name="if:Custom Favicon" content="1"/>
  128. <meta name="if:Dark Audio Player" content="0"/>
  129.  
  130. <!-------------------------------- TEXTS ----------------------------------->
  131. <meta name="text:Catchphrase" content="Your Catchphrase"/>
  132. <meta name="text:Region" content="Region"/>
  133. <meta name="text:Town" content="Town's name"/>
  134. <meta name="text:Name" content="Mayor/villager's name"/>
  135. <meta name="text:Dream Code" content="0000-0000-0000"/>
  136. <meta name="text:Birthday" content="January 1st"/>
  137. <meta name="text:Link 1 URL" content="/"/>
  138. <meta name="text:Link 1 Title" content="Link 1"/>
  139. <meta name="text:Link 2 URL" content="/"/>
  140. <meta name="text:Link 2 Title" content="Link 2"/>
  141. <meta name="text:Link 3 URL" content="/"/>
  142. <meta name="text:Link 3 Title" content="Link 3"/>
  143. <meta name="text:Link 4 URL" content="/"/>
  144. <meta name="text:Link 4 Title" content="Link 4"/>
  145. <meta name="text:Link 5 URL" content="/"/>
  146. <meta name="text:Link 5 Title" content="Link 5"/>
  147. <meta name="text:Link 6 URL" content="/"/>
  148. <meta name="text:Link 6 Title" content="Link 6"/>
  149. <meta name="text:Native Fruit" content="https://68.media.tumblr.com/9a49c6e8d17db16f245f5e4530674b51/tumblr_inline_npr1greOwo1rg1lxe_540.png"/>
  150. <meta name="text:Villager 1 URL" content="http://i1168.photobucket.com/albums/r486/zeldalise/ACNL%20Villagers/bam_zpsfb186fd6.gif"/>
  151. <meta name="text:Villager 2 URL" content="http://i1168.photobucket.com/albums/r486/zeldalise/ACNL%20Villagers/bella_zpsf894abd7.gif"/>
  152. <meta name="text:Villager 3 URL" content="http://i1168.photobucket.com/albums/r486/zeldalise/ACNL%20Villagers/annalisa_zps97c6365e.gif"/>
  153. <meta name="text:Villager 4 URL" content="http://i1168.photobucket.com/albums/r486/zeldalise/ACNL%20Villagers/al_zps502924ca.gif"/>
  154. <meta name="text:Villager 5 URL" content="http://i1168.photobucket.com/albums/r486/zeldalise/ACNL%20Villagers/anicotti_zps8e318f0d.gif"/>
  155. <meta name="text:Villager 6 URL" content="http://i1168.photobucket.com/albums/r486/zeldalise/ACNL%20Villagers/apollo_zpse38a26d3.gif"/>
  156. <meta name="text:Villager 7 URL" content="http://i1168.photobucket.com/albums/r486/zeldalise/ACNL%20Villagers/chief_zps465a8e72.gif"/>
  157. <meta name="text:Villager 8 URL" content="http://i1168.photobucket.com/albums/r486/zeldalise/ACNL%20Villagers/clay_zps414cd5aa.gif"/>
  158. <meta name="text:Villager 9 URL" content="http://i1168.photobucket.com/albums/r486/zeldalise/ACNL%20Villagers/diva_zpsd31327a5.gif"/>
  159. <meta name="text:Villager 10 URL" content="http://i1168.photobucket.com/albums/r486/zeldalise/ACNL%20Villagers/baabara_zps3a6c3cae.gif"/>
  160. <meta name="text:Ask Verb" content="asked"/>
  161.  
  162. <!-- Custom Fonts 1/2 -->
  163. <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
  164. <link href="https://fonts.googleapis.com/css?family=Imprima|Montserrat:400,700" rel="stylesheet">
  165.  
  166. </head>
  167.  
  168. <!-- Decorated Hover Titles 2/2 -->
  169. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  170. <script type="text/javascript" src="http://static.tumblr.7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  171. <script>(function($){$(document).ready(function(){$("[title]").style_my_tooltips();});})(jQuery);</script>
  172.  
  173. <!-- Fade in/out of the Card's second side 1/2 -->
  174. <script type="text/javascript">
  175. function unhide(divID) {
  176. var item = document.getElementById(divID);
  177. if (item) {
  178. item.className=(item.className=='hidden')?'unhidden':'hidden';
  179. }}</script>
  180.  
  181. <style type="text/css">
  182.  
  183. /* Custom Fonts 2/2 */
  184. @import url('https://fonts.googleapis.com/css?family=Imprima|Montserrat:400,700');
  185.  
  186. /* --------------------------- DECORATION ---------------------------- */
  187.  
  188. /* body */
  189. body {
  190. color:{color:Posts Text};
  191. background:{color:background} url('{image:background}') fixed;
  192. font: normal normal normal 11px/17px 'Montserrat', sans-serif;
  193. text-align:justify;}
  194.  
  195. /* --------------------------- MINOR STUFF ---------------------------- */
  196.  
  197. /* hover text */
  198. #s-m-t-tooltip {
  199. z-index: 99999;
  200. display: block;
  201. margin-left: 20px; margin-top: 5px;
  202. max-width:150px;
  203. padding: 2px 5px 2px 5px;
  204. color: {color:Catchphrase Text};
  205. font-family:Calibri;
  206. font-size:8px;
  207. font-weight:bold;
  208. line-height:10px;
  209. text-transform:uppercase;
  210. letter-spacing:1px;
  211. text-align:center;
  212. border:solid {color:Catchphrase Border};
  213. border-width: 2px 5px;
  214. border-radius: 20px;
  215. background: {color:Catchphrase BG 1};
  216. box-shadow:0px -10px 10px 0px {color:Catchphrase BG 2} inset, 1px 1px 1px {color:Card Shadows};}
  217.  
  218. /* scrollbar */
  219. ::-webkit-scrollbar {
  220. height: 14px; width: 14px;
  221. background: {color:Scroll BG};}
  222. ::-webkit-scrollbar-thumb {
  223. background: {color:Scroll Thumb};
  224. border:4px solid {color:Scroll BG};
  225. border-radius:5px;}
  226.  
  227. /* drag n' click selection */
  228. ::selection {
  229. background: {color:Selection BG};
  230. color: {color:Selection Text};}
  231. ::-moz-selection {
  232. background: {color:Selection BG};
  233. color: {color:Selection Text};}
  234. a::selection {
  235. background: {color:Selection BG};
  236. color: {color:Selection Links};}
  237. a::-moz-selection {
  238. background: {color:Selection BG};
  239. color: {color:Selection Links};}
  240.  
  241. /* ------------------------- FONT STUFF --------------------------- */
  242.  
  243. /* links */
  244. a:link, a:active, a:visited{
  245. text-decoration:none;
  246. color:{color:Posts Links};
  247. -webkit-transition: all 0.5s linear;
  248. -moz-transition: all 0.5s linear;
  249. transition: all 0.5s linear;}
  250. a:hover {
  251. color:{color:Posts Links Hover};
  252. -webkit-transition: all 0.2s linear;
  253. -moz-transition: all 0.2s linear;
  254. transition: all 0.2s linear;}
  255.  
  256. /* main font decorations */
  257. b, strong{color:{color:Posts Bold};}
  258. i, em {color:{color:Posts Italic};}
  259. pre {color:{color:Posts Code};
  260. font-size:10px;
  261. max-width:100%;
  262. font-family:consolas;
  263. background:{color:Posts Code BG};
  264. padding:1px 6px 2px 6px;
  265. white-space: pre-wrap;
  266. white-space: -moz-pre-wrap;
  267. white-space: -pre-wrap;
  268. white-space: -o-pre-wrap;
  269. word-wrap: break-word;}
  270. code {
  271. color:{color:Posts Code};
  272. font-size:10px;
  273. font-family:consolas;
  274. background:{color:Posts Code BG};
  275. padding:0px 1px 0px 1px;}
  276. .posts p:last-child {
  277. margin-bottom:0px;}
  278. .posts p:first-child {
  279. margin-top:0px;}
  280.  
  281. /* text and link post titles */
  282. h1 {font: normal normal bold 18px/18px Imprima;
  283. color:{color:Posts Title};
  284. text-align:center;
  285. letter-spacing:1px;}
  286. /* quote and ask post titles */
  287. h2 {font: normal normal normal 16px/16px Imprima;
  288. color:{color:Posts Bold};
  289. text-shadow:0 0 0.2px {color:Posts Bold}, 0 0 0px {color:Posts Bold};
  290. text-align:center;
  291. letter-spacing:0px;}
  292. .posts h1:first-child, .posts h2:first-child {margin-top:0px;}
  293.  
  294. /* -------------------------------- TOP BAR ------------------------------ */
  295.  
  296. /* top bar */
  297. #top-bar {
  298. position:fixed; z-index:5;
  299. top:0; left:0;
  300. width:100%; height:128px;
  301. background:{color:Top Bar BG} url({image:Top Bar BG});
  302. border-bottom:15px solid {color:Top Bar Trim};
  303. box-shadow: 0px 2px 1px {color:Top Bar Shadow};}
  304.  
  305. /* page navigation */
  306. #pagination {
  307. z-index:6; position:fixed;
  308. top:98px; left:50%;
  309. margin-left:-470px;
  310. width:300px; height:21px;
  311. overflow:hidden;
  312. color:{color:Pagination Current Page};
  313. font-family:Imprima;
  314. font-weight:normal;
  315. text-align:center;
  316. font-size:11px;}
  317. .active {
  318. display:inline-block;
  319. min-width:10px;
  320. padding:5px 4px 5px 4px;
  321. line-height:11px;
  322. margin:0px 3px;
  323. border-radius:3px;
  324. background:{color:Pagination BG};}
  325. #pagination a .active {
  326. color:{color:Pagination Text};
  327. margin:0px 3px;
  328. -webkit-transition: all 0.3s linear;
  329. -moz-transition: all 0.3s linear;
  330. transition: all 0.3s linear;}
  331. #pagination a .active:hover {
  332. color:{color:Pagination Hover Text};
  333. background:{color:Pagination Hover BG};
  334. margin:0px 6px;}
  335.  
  336. /* main links BEFORE hover */
  337. #mainlinks a {
  338. overflow:hidden;
  339. z-index:4; position:fixed;
  340. left:50%; top:144px;
  341. height:22px; width:48px;
  342. font-size:19px; text-align:center;
  343. background-image: url(https://68.media.tumblr.com/07d0c7a6aea18213ac1c3a885bbb27ae/tumblr_npettzPu4Q1s60yyoo5_r3_75sq.png);
  344. border-width:0px 2px 2px 2px;
  345. border-radius: 0px 0px 14px 14px;
  346. -webkit-transition: all 0.2s linear;
  347. -moz-transition: all 0.2s linear;
  348. transition: all 0.2s linear;}
  349. #mainlinks l {padding-top:2px;
  350. -webkit-transition: all 0.2s linear;
  351. -moz-transition: all 0.2s linear;
  352. transition: all 0.2s linear;}
  353.  
  354. #link1 {
  355. margin-left:-451px;
  356. color:{color:Main Links Symbols};
  357. background:{color:Main Link 1 BG};
  358. box-shadow:0px 0px 10px 0px {color:Main Link 1 BG} inset, -2px -2px 5px 0px {color:Main Link 1 Hover Symbol} inset;
  359. border:solid transparent;}
  360. #link2 {
  361. margin-left:-399px;
  362. color:{color:Main Links Symbols};
  363. background:{color:Main Link 2 BG};
  364. border:solid transparent;
  365. box-shadow:0px 0px 10px 0px {color:Main Link 2 BG} inset, -2px -2px 5px 0px {color:Main Link 2 Hover Symbol} inset;}
  366. #link3 {
  367. margin-left:-347px;
  368. color:{color:Main Links Symbols};
  369. background:{color:Main Link 3 BG};
  370. border:solid transparent;
  371. box-shadow:0px 0px 10px 0px {color:Main Link 3 BG} inset, -2px -2px 5px 0px {color:Main Link 3 Hover Symbol} inset;}
  372. #link4 {
  373. margin-left:-295px;
  374. color:{color:Main Links Symbols};
  375. background:{color:Main Link 4 BG};
  376. box-shadow:0px 0px 10px 0px {color:Main Link 4 BG} inset, -2px -2px 5px 0px {color:Main Link 4 Hover Symbol} inset;
  377. border:solid transparent;}
  378. #link5 {
  379. margin-left:-243px;
  380. color:{color:Main Links Symbols};
  381. background:{color:Main Link 5 BG};
  382. box-shadow:0px 0px 10px 0px {color:Main Link 5 BG} inset, -2px -2px 5px 0px {color:Main Link 5 Hover Symbol} inset;
  383. border:solid transparent;}
  384.  
  385. /* main links AFTER hover */
  386. #mainlinks a:hover {height:26px;}
  387. #mainlinks a:hover l {padding-top:4px;}
  388.  
  389. #link1:hover {
  390. color:{color:Main Link 1 Hover Symbol};
  391. background:{color:Main Link 1 BG} url(https://68.media.tumblr.com/07d0c7a6aea18213ac1c3a885bbb27ae/tumblr_npettzPu4Q1s60yyoo5_r3_75sq.png);
  392. border:solid {color:Main Link 1 Hover Symbol};
  393. border-width:0px 2px 2px 2px;}
  394. #link2:hover {
  395. color:{color:Main Link 2 Hover Symbol};
  396. background:{color:Main Link 2 BG} url(https://68.media.tumblr.com/07d0c7a6aea18213ac1c3a885bbb27ae/tumblr_npettzPu4Q1s60yyoo5_r3_75sq.png);
  397. border:solid {color:Main Link 2 Hover Symbol};
  398. border-width:0px 2px 2px 2px;}
  399. #link3:hover {
  400. color:{color:Main Link 3 Hover Symbol};
  401. background:{color:Main Link 3 BG} url(https://68.media.tumblr.com/07d0c7a6aea18213ac1c3a885bbb27ae/tumblr_npettzPu4Q1s60yyoo5_r3_75sq.png);
  402. border:solid {color:Main Link 3 Hover Symbol};
  403. border-width:0px 2px 2px 2px;}
  404. #link4:hover {
  405. color:{color:Main Link 4 Hover Symbol};
  406. background:{color:Main Link 4 BG} url(https://68.media.tumblr.com/07d0c7a6aea18213ac1c3a885bbb27ae/tumblr_npettzPu4Q1s60yyoo5_r3_75sq.png);
  407. border:solid {color:Main Link 4 Hover Symbol};
  408. border-width:0px 2px 2px 2px;}
  409. #link5:hover {
  410. color:{color:Main Link 5 Hover Symbol};
  411. background:{color:Main Link 5 BG} url(https://68.media.tumblr.com/07d0c7a6aea18213ac1c3a885bbb27ae/tumblr_npettzPu4Q1s60yyoo5_r3_75sq.png);
  412. border:solid {color:Main Link 5 Hover Symbol};
  413. border-width:0px 2px 2px 2px;}
  414.  
  415. /* --------------------------- ID CARD: SIDE 1 --------------------------- */
  416.  
  417. /* bubble title (catchphrase) */
  418. #card-title {
  419. position:fixed; z-index:2;
  420. left:50%; margin-left:-462px;
  421. top:50%; margin-top:-115px;
  422. width:250px; height:17px;
  423. color:{color:Catchphrase Text};
  424. font-family:Imprima;
  425. font-weight:bold;
  426. font-size:18px;
  427. line-height:18px;
  428. text-align:center;
  429. letter-spacing:1px;
  430. padding:3px 10px;
  431. background: {color:Catchphrase BG 1};
  432. box-shadow:0px -10px 10px 0px {color:Catchphrase BG 2} inset, 2px 2px 1px {color:Card Shadows};
  433. border:solid {color:Catchphrase Border};
  434. border-width: 2px 5px;
  435. border-radius: 20px;}
  436. /* bubble title's tail */
  437. .tail {
  438. position:fixed; z-index:3;
  439. left:50%; margin-left:-425px;
  440. top:50%; margin-top:-90px;
  441. width:0px; height:0px;
  442. border-top: 10px solid {color:Catchphrase Border};
  443. border-left: 2px solid transparent;
  444. border-right: 10px solid transparent;}
  445. #tail-shadow {
  446. margin-left:-423px; margin-top:-88px;
  447. z-index:2;
  448. border-top: 9px solid {color:Card Shadows};}
  449.  
  450. /* actual ID Card */
  451. #card {
  452. overflow: hidden; z-index:1;
  453. position: fixed;
  454. left:50%; margin-left:-475px;
  455. top:50%; margin-top:-100px;
  456. width:306px; height:186px;
  457. color:{color:Card Info Text};
  458. font-family:Imprima;
  459. font-weight:normal;
  460. font-size:15px;
  461. line-height:18px;
  462. text-align:left;
  463. box-shadow: 1px 1px 1px {color:Card Shadows};
  464. background: {color:Card BG};
  465. border-radius:14px;
  466. border: 1px solid {color:Card Shadows};}
  467.  
  468. /* card's top & bottom strips */
  469. .card-trim {
  470. width:100%; height:15px;
  471. box-shadow:0px 0px 0px 2px {color:Card Indents};
  472. background:{color:Card Trims};
  473. background-image: url(https://68.media.tumblr.com/07d0c7a6aea18213ac1c3a885bbb27ae/tumblr_npettzPu4Q1s60yyoo5_r3_75sq.png);}
  474.  
  475. /* container between the two strips */
  476. #card-content {
  477. padding:5px 10px;
  478. height:142px;
  479. background-image:url('https://68.media.tumblr.com/5156b183e057ccf556b07a2ad0a66fa6/tumblr_npettzPu4Q1s60yyoo1_r3_400.png'), url({image:Card BG});
  480. background-position:center;}
  481.  
  482. /* ID Photo */
  483. #card-photo {
  484. width:62px; height:100px;
  485. border-radius:7px;
  486. float:left; margin-right:7px;
  487. background: url(https://68.media.tumblr.com/539e50c09d383e1eb4491b5a4fb8edb9/tumblr_npettzPu4Q1s60yyoo7_r1_100.png) center;
  488. background-repeat:no-repeat;
  489. border:6px solid transparent;
  490. border-image-source:url(https://68.media.tumblr.com/2b5e683a7724e4f9b696cd2e2f4a9d17/tumblr_npettzPu4Q1s60yyoo7_r2_250.png);
  491. border-image-slice: 33%;
  492. border-image-width: 18px;
  493. border-image-outset: 0px;
  494. border-image-repeat: round;}
  495.  
  496. /* information */
  497. #card-info {
  498. height:80px; padding:2px 5px 8px 7px; overflow:hidden;}
  499. #card b {
  500. color:{color:Card Info Text};
  501. text-shadow:0 0 0.2px {color:Card Info Text}, 0 0 0px {color:Card Info Text};
  502. font-weight:normal;}
  503. #card small {
  504. vertical-align:middle;
  505. font-size:11px;}
  506. #card hr {
  507. display: block;
  508. margin-top: -5px;
  509. margin-bottom: 4px;
  510. margin-left: -2px;
  511. margin-right: 0px;
  512. border-style: solid;
  513. border-width: 2px;
  514. border-color: {color:Card Indents};}
  515.  
  516. /* description */
  517. #description {
  518. float:right; margin-top:4px;
  519. width:191px; height:40px;
  520. text-align:center;
  521. padding:3px 5px;
  522. background:{color:Card Indents};
  523. box-shadow:0px 0px 0px 2px {color:Card Highlights};
  524. border-radius:5px;
  525. color:{color:Description Text};
  526. font-family:Calibri;
  527. font-size:10px;
  528. line-height:12px;
  529. overflow:auto;}
  530. #description b, #description strong {
  531. color:{color:Description Text};
  532. font-weight:bold;
  533. text-shadow:0 0 0px {color:Description Text};}
  534. #description i, #description em {color:{color:Description Text};}
  535. #description a {color:{color:Description Links};}
  536. #description a:hover {color:{color:Description Links Hover};}
  537. #description::-webkit-scrollbar {
  538. height:4px; width:4px;
  539. background: transparent;}
  540. #description::-webkit-scrollbar-thumb {
  541. background: transparent;
  542. border:none;
  543. border-left:2px solid {color:Card Highlights};
  544. border-radius:0px;}
  545.  
  546. /* badge button */
  547. #badgebutton {
  548. z-index:2; position: fixed;
  549. left:50%; margin-left:-447px;
  550. top:50%; margin-top:39px;
  551. height:33px; width:33px;
  552. background:{color:Badge Highlights};
  553. border:2px solid {color:Badge BG};
  554. border-radius:50%;
  555. box-shadow:-10px -10px 20px -5px {color:Badge BG} inset, 1px 3px 1px {color:Card Shadows};
  556. -webkit-transition: all 0.2s linear;
  557. -moz-transition: all 0.2s linear;
  558. transition: all 0.2s linear;}
  559. #badgebutton:hover {
  560. background:{color:Badge BG}; margin-top:41px;
  561. box-shadow:-10px -10px 20px -5px {color:Badge BG} inset, 0px 0px 0px {color:Card Shadows};}
  562.  
  563. /* --------------------------- ID CARD: SIDE 2 --------------------------- */
  564.  
  565. /* Fade in/out of the Card's second side 2/2 */
  566. .hidden {display: none;}
  567. .unhidden {display: block;}
  568. #second-side {display:;}
  569.  
  570. /* sidebar links */
  571. #sidelinks {
  572. margin-top:3px; margin-left:-10px;
  573. letter-spacing:10px;
  574. width:308px;
  575. text-align:center;}
  576. #sidelinks a {
  577. text-decoration:none;
  578. display:inline-block;
  579. width:32px; height:32px;
  580. padding:2px;
  581. box-shadow:2px 2px 1px {color:Card Highlights}, 1px 1px 10px 0px {color:Card Indents} inset, 1px 1px 2px {color:Card Shadows} inset;
  582. border-radius:50%;
  583. background:{color:Card Indents};
  584. -webkit-transition: all 0.2s linear;
  585. -moz-transition: all 0.2s linear;
  586. transition: all 0.2s linear;}
  587. #sidelinks a:hover {
  588. box-shadow:2px 2px 1px {color:Card Highlights};
  589. background:{color:Minor Links Hover};}
  590.  
  591. /* villagers */
  592. #villagers {
  593. float:right;
  594. margin:0px 0px 3px 0px;
  595. width:150px;
  596. text-align:center;}
  597. #villagers img {display:inline-block; margin:2px -1px; max-width:32px;}
  598.  
  599. /* flag + native fruit */
  600. #flag-fruit {
  601. float:left;
  602. margin-top:8px;
  603. width:130px;
  604. text-align:center;}
  605. .flag {
  606. float:left; margin-left:5px;}
  607. .flag img {
  608. width:32px; height:32px;
  609. border-radius:3px;
  610. margin-top:5px;
  611. padding:2px;
  612. background:{color:Card Indents};
  613. box-shadow:2px 2px 1px {color:Card Highlights}, 1px 1px 10px 0px {color:Card Indents} inset, 1px 1px 2px {color:Card Shadows} inset;}
  614. .fruit {
  615. float:right; margin-right:5px;}
  616. .fruit img {
  617. width:32px; height:32px;
  618. border-radius:50%;
  619. margin-top:5px;
  620. padding:2px;
  621. background:{color:Card Indents};
  622. box-shadow:2px 2px 1px {color:Card Highlights}, 1px 1px 10px 0px {color:Card Indents} inset, 1px 1px 2px {color:Card Shadows} inset;}
  623.  
  624. /* -------------------------------- POSTS -------------------------------- */
  625.  
  626. /* posts position */
  627. #entries {
  628. z-index:6;
  629. position:relative;
  630. margin-top:70px;
  631. margin-left:50%;
  632. text-align:justify;}
  633. /* posts themselves */
  634. .posts {
  635. {block:IndexPage}{block:IfPostendingCirclesForIndexpage}
  636. margin:0 0 90px -56px;
  637. {/block:IfPostendingCirclesForIndexpage}
  638. {block:IfNotPostendingCirclesForIndexpage}
  639. margin:0 0 70px -56px;
  640. {/block:IfNotPostendingCirclesForIndexpage}{/block:IndexPage}
  641. {block:PermalinkPage}margin:0 0 70px -56px;{/block:PermalinkPage}
  642. overflow:hidden;
  643. width: 500px;
  644. text-align:justify;
  645. padding:20px;
  646. background: {color:Posts BG} url('');
  647. border:1px solid {color:Posts Shadows};
  648. box-shadow:1px 1px 1px {color:Posts Shadows};
  649. border-radius:8px;}
  650.  
  651. /* ----------------------------- POST TYPES ------------------------------ */
  652.  
  653. /* text post */
  654. blockquote {
  655. padding:0px;
  656. padding-left:6px;
  657. margin:-3px 0 -1px 6px;
  658. border-left:3px solid {color:posts blockquote};}
  659. hr {display: block;
  660. margin: 30px 80px;
  661. border:1px solid {color:posts blockquote};}
  662.  
  663. /* bullet lists */
  664. ol {margin-left:-8px;
  665. list-style-type:decimal;}
  666. ul {margin-left:-20px;
  667. list-style-type:none;}
  668. ul li::before {
  669. content:"";
  670. margin:0px 10px 2px 0px;
  671. display:inline-block;
  672. height:4px; width:4px;
  673. border-radius:50%;
  674. background:{color:posts blockquote};}
  675. li {margin-bottom:3px;}
  676.  
  677. /* text-images */
  678. .posts img {
  679. vertical-align:middle;
  680. max-width:100%;}
  681. /* the credit below images that are from other people */
  682. .tmblr-full {margin:0;}
  683. .tmblr-attribution {
  684. opacity:.8;
  685. margin-top:0px;
  686. font-family:Calibri;
  687. font-size:8px; line-height:8px;
  688. text-transform:uppercase;
  689. letter-spacing:1px;}
  690. .tmblr-attribution::after {content: " >";}
  691.  
  692. /* link posts */
  693. .link-posts a {
  694. background: {color:Posts Links};
  695. display:inline-block;
  696. width: 480px;
  697. padding:10px;
  698. color:{color:Posts BG};}
  699. .link-posts a:hover {
  700. background: {color:Posts Links Hover}}
  701.  
  702. /* ask posts */
  703. .ask-posts img {
  704. vertical-align:middle;
  705. display:inline-block;
  706. margin-right:7px;
  707. max-width:64px;}
  708. .ask-posts .question {
  709. vertical-align:middle;
  710. display:inline-block;
  711. min-height:44px; width:406px;
  712. padding: 10px;
  713. background: {color:Posts 2nd BG};}
  714. .ask-posts h2 {text-align:left; margin:0px 0px 5px 5px;}
  715.  
  716. /* quote posts */
  717. .quote-posts {
  718. padding:10px 0px;
  719. text-align:center}
  720. .quote {
  721. vertical-align:middle;
  722. width:430px;
  723. display:inline-block;}
  724. .quote-posts .fa {
  725. text-shadow:none;
  726. font-size:20px;
  727. vertical-align:middle;
  728. display:inline-block;
  729. color:{color:Posts Blockquote}}
  730.  
  731. /* chat posts */
  732. .chat {margin:0px; padding:0px; line-height:14px;}
  733. .chat li {text-align:left;}
  734. .chat li::before {display:none;}
  735.  
  736. {block:IfNot2ndChatPostFormat}
  737. .chat li {
  738. padding:0px 0px 4px 4px;
  739. border-bottom:2px solid {color:Posts Blockquote};}
  740. .chat li:first-of-type {
  741. padding-top:4px;
  742. border-top:2px solid {color:Posts Blockquote};}
  743. {/block:IfNot2ndChatPostFormat}
  744. {block:If2ndChatPostFormat}
  745. .chat li {
  746. padding:5px 8px;
  747. margin-bottom:4px;
  748. background: {color:Posts 2nd BG};}
  749. {/block:If2ndChatPostFormat}
  750.  
  751. /* photo posts */
  752. .posts img, .posts .html_photoset, .posts #audio-pic {
  753. {block:IfFadePhotos}opacity:0.75;{/block:IfFadePhotos}
  754. {block:IfMonochromePhotos}
  755. -webkit-filter: grayscale(100%);
  756. -moz-filter: grayscale(100%);
  757. -ms-filter: grayscale(100%);
  758. -o-filter: grayscale(100%);
  759. filter: grayscale(100%);{/block:IfMonochromePhotos}
  760. -webkit-transition-duration: 0.5s;
  761. -moz-transition-duration:0.5s;
  762. -o-transition-duration:0.5s;
  763. transition-duration:0.5s;}
  764. .posts:hover img, .posts:hover .html_photoset, .posts:hover #audio-pic {
  765. opacity:1;
  766. -webkit-filter: grayscale(0%);
  767. -moz-filter: grayscale(0%);
  768. -ms-filter: grayscale(0%);
  769. -o-filter: grayscale(0%);
  770. filter: grayscale(0%);
  771. -webkit-transition-duration: 0.5s;
  772. -moz-transition-duration:0.5s;
  773. -o-transition-duration:0.5s;
  774. transition-duration:0.5s;}
  775.  
  776. /* photoset focused image background */
  777. .tmblr-lightbox {
  778. background-color:transparent !important;}
  779. .vignette {
  780. z-index:99998! important;
  781. opacity:.75 !important;
  782. background-color:{color:background} !important;
  783. background-image:none !important;}
  784. .tmblr-lightbox .lightbox-image {
  785. z-index:99999! important;
  786. border-radius:0px !important;
  787. background:{color:background} !important;
  788. box-shadow:0px 0px 0px 30px {color:background} !important;}
  789. .tmblr-lightbox .lightbox-caption {
  790. z-index:99999! important;
  791. font-family:consolas !important;
  792. font-size:10px !important;
  793. font-size: 15px !important;
  794. font-weight: bold !important;
  795. color: {color:posts title} !important;
  796. text-shadow: 0 4px 30px {color:background} !important;}
  797.  
  798. /* video posts */
  799. #youtube_iframe, .tumblr_video_container {
  800. margin-bottom:5px; max-width:100%;}
  801. .caption iframe, .caption #youtube_iframe, .caption .tumblr_video_container {
  802. margin:5px 0px; max-width:100%;}
  803.  
  804. /* audio posts */
  805. #audio-pic {
  806. display:inline-block;
  807. vertical-align:middle;
  808. margin-right:2px;
  809. width:135px; height:135px;
  810. background: url('{image:Default Audio Pic}');
  811. background-size:cover;}
  812. #info-container {
  813. display:inline-block;
  814. vertical-align:middle;
  815. text-align:left;
  816. font-size:8px; line-height:15px;
  817. width:355px;
  818. text-transform:uppercase;
  819. letter-spacing:1px;}
  820. #info-container li {
  821. display:block;
  822. padding:4px 7px;
  823. margin:0px; margin-top:4px;
  824. background:{color:Posts 2nd BG};}
  825. .posts .audio_player {
  826. max-width:355px; max-height:27px;
  827. margin:0px;
  828. background:{color:Audio Player};
  829. {block:IfMonochromePhotos}
  830. -webkit-filter: grayscale(100%);
  831. -moz-filter: grayscale(100%);
  832. -ms-filter: grayscale(100%);
  833. -o-filter: grayscale(100%);
  834. filter: grayscale(100%);{/block:IfMonochromePhotos}
  835. -webkit-transition: all 0.2s linear;
  836. -moz-transition: all 0.2s linear;
  837. transition: all 0.2s linear;}
  838. .posts:hover .audio_player {
  839. {block:IfMonochromePhotos}
  840. -webkit-filter: grayscale(0%);
  841. -moz-filter: grayscale(0%);
  842. -ms-filter: grayscale(0%);
  843. -o-filter: grayscale(0%);
  844. filter: grayscale(0%);{/block:IfMonochromePhotos}}
  845. .tumblr_audio_player {
  846. width:355px; opacity:.66;}
  847.  
  848. /* ---------------------------- POSTS INFO ------------------------------ */
  849.  
  850. /* if circles */
  851. #postinfo {
  852. margin-top:30px;
  853. position:absolute;
  854. text-align:center;
  855. margin-left:-20px;
  856. width:540px;}
  857. /* individual circles */
  858. #postinfo a {
  859. text-decoration:none;
  860. display:inline-block;
  861. margin:0px 15px;
  862. width:32px; height:32px;
  863. border-radius:50%;
  864. border:1px solid {color:Card Shadows};
  865. box-shadow:1px 2px 1px {color:Card Shadows}, 1px 1px 10px 0px {color:Card Indents} inset, 1px 1px 2px {color:Card Shadows} inset;
  866. background:{color:Card Indents};
  867. -webkit-transition: all 0.2s linear;
  868. -moz-transition: all 0.2s linear;
  869. transition: all 0.2s linear;}
  870. #postinfo a:hover {
  871. margin:0px 20px;
  872. box-shadow:0px 0px 0px {color:Card Shadows};
  873. background:{color:Minor Links Hover};}
  874.  
  875. /* if no circles */
  876. #postending {
  877. border-radius:3px;
  878. padding:10px;
  879. width:500px;
  880. padding:10px;
  881. margin:15px 0px -10px -10px;
  882. background: {color:Postending BG};
  883. text-align:center;
  884. border-radius:1px;
  885. margin-top:15px;
  886. text-transform:uppercase;
  887. font-family:Calibri;
  888. font-size:8px;
  889. letter-spacing:1px;
  890. color: {color:Postending Text};}
  891. #postending a {
  892. color:{color:Postending Links};}
  893. #postending a:hover {
  894. color:{color:Postending Links Hover};}
  895.  
  896. /* ---------------------------- PERMALINK -------------------------------- */
  897.  
  898. /* permalink position */
  899. #permalink {
  900. background:; /* if you want the post-notes to have a non-transparent bg */
  901. margin-top: -70px;
  902. margin-left:-56px;
  903. width: 500px;
  904. padding: 20px;}
  905.  
  906. /* post notes container */
  907. .notes {
  908. max-height:600px;
  909. overflow: auto;
  910. text-align:center;
  911. line-height:0px; font-size:0px;
  912. color:transparent;
  913. letter-spacing:0px;}
  914. .notes li::before {display:none;}
  915. .notes a {
  916. box-shadow:none;
  917. font: normal normal normal 9px/17px 'Montserrat', san-serif;
  918. text-transform:uppercase;
  919. letter-spacing:1px;
  920. color:{color:Permalink Links};}
  921. .notes a:hover {
  922. color:{color:Permalink Links Hover};}
  923. .notes blockquote, .notes .answer_content {
  924. font: normal normal normal 9px/17px 'Montserrat', san-serif;
  925. letter-spacing:1px;
  926. max-width:350px;
  927. margin:3px auto; border:none;
  928. color:{color:Permalink Links};
  929. background:{color:Permalink Blockquote};}
  930. .notes blockquote {
  931. display:inline-block;
  932. padding:1px 10px 0px 10px;}
  933. .notes .answer_content {
  934. display:block;
  935. padding:2px 10px 1px 10px;}
  936. .notes img {display:none;}
  937. .notes li {margin-left:-10px;}
  938.  
  939. /* replaced regular sentences with fa symbols */
  940. .notes .like span a::after, .notes .reblog .tumblelog::after, .notes .reblog blockquote::before, .notes .reblog blockquote::after, .notes .answer_content::before, .notes .answer_content::after, .notes .reply .action a::after {
  941. font-weight:normal;
  942. vertical-align:middle;
  943. content:"";
  944. font-family:'FontAwesome';
  945. display:inline-block; margin:0px 5px;
  946. font-size:10px;
  947. color:{color:Permalink Text};}
  948. .notes .like span a::after {content:"\f004";}
  949. .notes .reblog .tumblelog::after {content: "\f079";}
  950. .notes .reblog blockquote::before, .notes .answer_content::before {content: "\f10d"; margin-top:-1px;}
  951. .notes .reblog blockquote::after, .notes .answer_content::after {content: "\f10e"; margin-top:-1px;}
  952. .notes .reply .action a::after {content: "\f063";}
  953.  
  954. </style>
  955. <body>
  956.  
  957. <!--------------------------------- CURSOR --------------------------------->
  958.  
  959. {block:IfCustomCursor}
  960. <style type="text/css"> body {cursor: url({image:Custom Cursor}), auto;} a, a:hover{cursor:url({image:Custom Cursor Links}), auto;}
  961. </style>
  962. <!-- Custom cursors don't show up on empty spaces, but this fixes that -->
  963. <div style="position:fixed; background:rgba(0,0,0,0); top:0px; left:0px; width:100%; height:100%; z-index: -99999999999999;"></div>{/block:IfCustomCursor}
  964.  
  965. <!-------------------------------- TOP BAR --------------------------------->
  966. <div id="top-bar"></div>
  967.  
  968. <!-- Page navigation -->
  969. <div id="pagination">{block:Pagination}
  970. {block:PreviousPage}<a href="{PreviousPage}">{/block:PreviousPage}<div class="active">◀</div>{block:PreviousPage}</a>{/block:PreviousPage}
  971. {block:JumpPagination length="5"}
  972. {block:CurrentPage}
  973. <div class="active">{PageNumber}</div>
  974. {/block:CurrentPage}
  975. {block:JumpPage}
  976. <a href="{URL}"><div class="active">{PageNumber}</div></a>
  977. {/block:JumpPage}
  978. {/block:JumpPagination}
  979. {block:NextPage}<a href="{NextPage}">{/block:NextPage}<div class="active">▶</div>{block:NextPage}</a>{/block:NextPage}
  980. {/block:Pagination}</div>
  981.  
  982. <!-- Main links -->
  983. <div id="mainlinks">
  984. <a href="/" id="link1" title="Home"><l class="fa fa-suitcase"></l></a>
  985. <a href="/ask" id="link2" title="Post Office"><l class="fa fa-pencil"></l></a>
  986. <a href="/archive" id="link3" title="Town Records"><l class="fa fa-book"></l></a>
  987. <a href="/submit" id="link4" title="Bulletin Board"><l class="fa fa-user"></l></a>
  988. <!-------------------------- CREDIT; DON'T REMOVE -------------------------->
  989. <a href="http://nyctothemes.tumblr.com/" id="link5" title="© nyctothemes"><l class="fa fa-heart"></l></a>
  990. </div>
  991.  
  992. <!--------------------------- ID CARD: SIDE 1 ------------------------------>
  993.  
  994. <!-- catch bubble -->
  995. <div id="card-title">{text:Catchphrase}</div>
  996. <div class="tail"></div><div class="tail" id="tail-shadow"></div>
  997.  
  998. <!-- actual card -->
  999. <div id="card">
  1000. <div class="card-trim"></div>
  1001. <div id="card-content">
  1002. <img src="{image:ID Photo}" id="card-photo">
  1003. <div id="card-info">
  1004. <small>({text:Region})</small> <b>{text:Town}</b><hr>
  1005. <b>{text:Name}</b><hr>
  1006. <small>DA:</small> {text:Dream Code}<hr>
  1007. <small>Born:</small> {text:Birthday}<hr>
  1008. </div>
  1009. <div id="description">{description}</div>
  1010.  
  1011. <!-- button -->
  1012. <a href="javascript:unhide('second-side');" title="More Info!"><img src="https://68.media.tumblr.com/4693bd964ab91db97dc996e9d66d69ac/tumblr_npettzPu4Q1s60yyoo3_r1_250.png" id="badgebutton"></a>
  1013. </div>
  1014. <div class="card-trim" style="height:19px;"></div>
  1015. </div>
  1016.  
  1017. <!--------------------------- ID CARD: SIDE 2 ------------------------------>
  1018.  
  1019. <div id="second-side" class="hidden"><div id="card">
  1020. <div class="card-trim"></div>
  1021. <div id="card-content">
  1022.  
  1023. <!-- extra links -->
  1024. <div id="sidelinks">
  1025. <a href="{text:link 1 URL}" title="{text:link 1 title}"><img src="https://68.media.tumblr.com/e856f6b5b75b1b50a00c6001602e720e/tumblr_npettzPu4Q1s60yyoo2_r2_75sq.png"></a>
  1026. <a href="{text:link 2 URL}" title="{text:link 2 title}"><img src="https://68.media.tumblr.com/428cbd2e72cf9732dab39b4dcdc20866/tumblr_npettzPu4Q1s60yyoo3_r2_75sq.png"></a>
  1027. <a href="{text:link 3 URL}" title="{text:link 3 title}"><img src="https://68.media.tumblr.com/00606409c391dd5954efbca67664f6a4/tumblr_npettzPu4Q1s60yyoo4_r2_75sq.png"></a>
  1028. <a href="{text:link 4 URL}" title="{text:link 4 title}"><img src="https://68.media.tumblr.com/e8e10494b7d34cd2bf3fc35300b8b6dc/tumblr_npettzPu4Q1s60yyoo6_r2_75sq.png"></a>
  1029. <a href="{text:link 5 URL}" title="{text:link 5 title}"><img src="https://68.media.tumblr.com/db83d02da4c4889a96a1a67640854ba3/tumblr_npettzPu4Q1s60yyoo5_r4_75sq.png"></a>
  1030. <a href="{text:link 6 URL}" title="{text:link 6 title}"><img src="https://68.media.tumblr.com/c397a4b71fbbc67683121795b45acec2/tumblr_npettzPu4Q1s60yyoo1_r2_75sq.png"></a>
  1031. </div>
  1032.  
  1033. <!-- Flag + Fruit -->
  1034. <div id="flag-fruit">
  1035. <div class="flag"><small>Town Flag</small><br><img src="{image:Town Flag}"></div>
  1036. <div class="fruit"> <small>Native Fruit</small><br><img src="{text:Native fruit}"></div>
  1037. </div>
  1038.  
  1039. <!-- Current Villagers -->
  1040. <div id="villagers">
  1041. <small style="letter-spacing:1px">Current Villagers:</small><br>
  1042. <img src="{text:Villager 1 URL}"><img src="{text:Villager 2 URL}"><img src="{text:Villager 3 URL}"><img src="{text:Villager 4 URL}"><img src="{text:Villager 5 URL}"><br><img src="{text:Villager 6 URL}"><img src="{text:Villager 7 URL}"><img src="{text:Villager 8 URL}"><img src="{text:Villager 9 URL}"><img src="{text:Villager 10 URL}">
  1043. </div>
  1044.  
  1045. <!-- button -->
  1046. <a href="javascript:unhide('second-side');" title="More Info!"><img src="https://68.media.tumblr.com/4693bd964ab91db97dc996e9d66d69ac/tumblr_npettzPu4Q1s60yyoo3_r1_250.png" id="badgebutton"></a>
  1047. </div>
  1048. <div class="card-trim" style="height:19px;"></div>
  1049. </div></div>
  1050.  
  1051. <!--------------------------------- POSTS --------------------------------->
  1052. <div id="entries">
  1053. {block:posts}
  1054.  
  1055. <div class="posts">
  1056.  
  1057. <!-- text posts -->
  1058. {block:Text}
  1059. {block:Title}<h1>{Title}</h1>{/block:Title}
  1060. <div class="caption">{Body}</div>
  1061. {/block:Text}
  1062.  
  1063. <!-- link posts -->
  1064. {block:Link}
  1065. {block:Thumbnail}<center>
  1066. <a href="{Thumbnail-HighRes}">
  1067. <img src="{Thumbnail}" class="photo-posts" style="margin-bottom:5px;">
  1068. </a>
  1069. </center>{/block:Thumbnail}
  1070. <div class="link-posts"><h1><a href="{URL}">
  1071. {Name}&nbsp;<l class="fa fa-arrow-right" style="font-size:16px; position:relative; top:-2px;"></l>
  1072. </a></h1></div>
  1073. {block:Description}<div class="caption">
  1074. <p>{Description}</p>
  1075. </div>{/block:Description}
  1076. {/block:Link}
  1077.  
  1078. <!-- ask posts -->
  1079. {block:Answer}
  1080. <div class="ask-posts">
  1081. <img src="{AskerPortraitURL-64}">
  1082. <div class="question">
  1083. <h2>{Asker} {text:Ask Verb}:</h2> {Question}
  1084. </div></div><br>
  1085. <div id="caption">{Answer}</div>
  1086. {/block:Answer}
  1087.  
  1088. <!-- quote posts -->
  1089. {block:Quote}
  1090. <h2 class="quote-posts">
  1091. <l class="fa fa-quote-left"></l>
  1092. <div class="quote">{Quote}</div>
  1093. <l class="fa fa-quote-right"></l>
  1094. </h2>
  1095. <div style="text-align:right; margin-right:20px">
  1096. {block:Source}<b>- {Source}</b>{/block:Source}
  1097. </div>
  1098. {/block:Quote}
  1099.  
  1100. <!-- chat posts -->
  1101. {block:Chat}
  1102. {block:Title}<h1>{Title}</h1>{/block:Title}
  1103. <ul class="chat">{block:Lines}
  1104. <li class="user_{UserNumber}">{block:Label}<b>{Label}</b>{/block:Label} {Line}</li>
  1105. {/block:Lines}</ul>
  1106. {/block:Chat}
  1107.  
  1108. <!-- photo posts -->
  1109. {block:Photo}
  1110. <center>
  1111. {block:HighRes}<a href="{PhotoURL-HighRes}" target="_blank">{/block:HighRes}<img src="{PhotoURL-500}" class="photo-posts"/>{block:HighRes}</a>{/block:HighRes}
  1112. </center>
  1113. {block:Caption}<br><div class="caption">{Caption}</div>{/block:Caption}{/block:Photo}
  1114.  
  1115. {block:Photoset}
  1116. <div style="width:540px; margin-left:-20px; text-align:middle">
  1117. {Photoset}
  1118. </div>
  1119. {block:Caption}<br><div class="caption">{Caption}</div>{/block:Caption}{/block:Photoset}
  1120.  
  1121. <!-- video post -->
  1122. {block:Video}
  1123. {Video-500}
  1124. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1125. {/block:Video}
  1126.  
  1127. <!-- audio posts -->
  1128. {block:Audio}
  1129. <!--image-->
  1130. {block:IndexPage}<a href="{Permalink}">{/block:IndexPage}<div id="audio-pic" {block:AlbumArt}style="background:none"{/block:AlbumArt}>
  1131. {block:AlbumArt}<img src="{AlbumArtURL}">{/block:AlbumArt}
  1132. </div>{block:IndexPage}</a>{/block:IndexPage}
  1133. <div id="info-container">
  1134. <!--player-->
  1135. {block:ifDarkAudioPlayer}{AudioPlayerBlack}{/block:ifDarkAudioPlayer}
  1136. {block:ifNotDarkAudioPlayer}{AudioPlayerWhite}{/block:ifNotDarkAudioPlayer} <!--info-->
  1137. {block:TrackName}<li><b>Track:</b> {TrackName}</li>{/block:TrackName}
  1138. {block:Artist}<li><b>Artist:</b> {Artist}</li>{/block:Artist}
  1139. {block:Album}<li><b>Album:</b> {Album}</li>{/block:Album}
  1140. {block:PlayCount}<li><b>Plays:</b> {FormattedPlayCount}</li>{/block:PlayCount}
  1141. </div>
  1142. {block:Caption}<div class="caption" style="margin-top:5px;">{Caption}</div>{/block:Caption}{/block:Audio}
  1143.  
  1144. <!------------------------------ POST ENDING ------------------------------->
  1145.  
  1146. {block:PermalinkPage}{block:Date}<div id="postending">
  1147.  
  1148. <!-- date posted -->
  1149. <a href="/day/{Year}/{MonthNumberWithZero}/{DayOfMonthWithZero}">{ShortMonth}.{DayOfMonthWithZero}.{ShortYear}</a>
  1150. <!-- notes counter -->
  1151. {block:NoteCount}
  1152. || {NoteCountWithLabel}
  1153. {/block:NoteCount}
  1154. <!-- reblogged from -->
  1155. {block:RebloggedFrom}<br>
  1156. Via: <a href="{ReblogParentURL}">{ReblogParentName}</a>
  1157. {/block:RebloggedFrom}
  1158. <!-- original poster -->
  1159. {block:ContentSource}
  1160. || Source: <a href="{SourceURL}">{SourceTitle}</a>
  1161. {/block:ContentSource}
  1162. <!-- tags -->
  1163. {block:HasTags}<br><div style="padding:0px 20px 0px 20px">
  1164. Tags: {block:Tags}<a href="{TagURL}">{Tag}</a>, {/block:Tags}
  1165. </div>{/block:HasTags}
  1166.  
  1167. </div>{/block:Date}{/block:PermalinkPage}
  1168.  
  1169. <!------------- If Circles for Index Page ------------->
  1170. {block:IfPostendingCirclesForIndexpage}
  1171. {block:IndexPage}
  1172. <div id="postinfo">
  1173.  
  1174. <!-- date posted -->
  1175. {block:Date}
  1176. <a href="{Permalink}" title="{ShortMonth}.{DayOfMonthWithZero}.{ShortYear}"><img src="https://68.media.tumblr.com/2528146fe341ea963ae61b401c725495/tumblr_npettzPu4Q1s60yyoo6_r4_75sq.png"></a>
  1177. {/block:Date}
  1178. <!-- notes counter -->
  1179. {block:NoteCount}
  1180. <a href="{Permalink}" title="{NoteCountWithLabel}"><img src="https://68.media.tumblr.com/49bc4b2d8e2ed352f50bd6a40d75fd2f/tumblr_npettzPu4Q1s60yyoo5_r7_75sq.png"></a>
  1181. {/block:NoteCount}
  1182. <!-- original poster -->
  1183. {block:ContentSource}
  1184. <a href="{SourceURL}" title="Source: {SourceTitle}"><img src="https://68.media.tumblr.com/0899ff7c48881003d942bcc9b0b3387b/tumblr_npettzPu4Q1s60yyoo3_r4_75sq.png"></a>
  1185. {/block:ContentSource}
  1186. <!-- reblogged from -->
  1187. {block:RebloggedFrom}
  1188. <a href="{ReblogParentURL}" title="Via: {ReblogParentName}"><img src="https://68.media.tumblr.com/2aaa09a92863a5d3beb6accd3aa85828/tumblr_npettzPu4Q1s60yyoo4_r3_75sq.png"></a>
  1189. {/block:RebloggedFrom}
  1190. <!-- tags -->
  1191. {block:HasTags}
  1192. <a href="{Permalink}" title="# {block:Tags}{Tag}, {/block:Tags}"><img src="https://68.media.tumblr.com/0f1ec405192614e0ee8948b91c002958/tumblr_npettzPu4Q1s60yyoo2_r5_75sq.png"></a>
  1193. {/block:HasTags}
  1194. <!-- reblog -->
  1195. <a href="{ReblogURL}" title="Reblog"><img src="https://68.media.tumblr.com/7dff97e924cbc194df3c7c5e7da93391/tumblr_npettzPu4Q1s60yyoo1_r5_75sq.png"></a>
  1196.  
  1197. </div>
  1198. {/block:IndexPage}
  1199. {/block:IfPostendingCirclesForIndexpage}
  1200.  
  1201. <!------------- If NO Circles for Index Page ------------->
  1202. {block:IfNotPostendingCirclesForIndexpage}
  1203. {block:IndexPage}
  1204. {block:Date}<div id="postending">
  1205.  
  1206. <!-- date posted -->
  1207. <a href="{Permalink}">{ShortMonth}.{DayOfMonthWithZero}.{ShortYear}</a>
  1208. <!-- notes counter -->
  1209. {block:NoteCount}
  1210. || {NoteCountWithLabel}
  1211. {/block:NoteCount}
  1212. <!-- reblogged from -->
  1213. {block:RebloggedFrom}<br>
  1214. Via: <a href="{ReblogParentURL}">{ReblogParentName}</a>
  1215. {/block:RebloggedFrom}
  1216. <!-- original poster -->
  1217. {block:ContentSource}
  1218. || Source: <a href="{SourceURL}">{SourceTitle}</a>
  1219. {/block:ContentSource}
  1220. <!-- tags -->
  1221. {block:HasTags}<br><div style="padding:0px 20px 0px 20px">
  1222. Tags: {block:Tags}<a href="{TagURL}">{Tag}</a>, {/block:Tags}
  1223. </div>{/block:HasTags}
  1224.  
  1225. </div>{/block:Date}
  1226. {/block:IndexPage}
  1227. {/block:IfNotPostendingCirclesForIndexpage}
  1228.  
  1229. </div> <!-- ending div tag for "posts" -->
  1230.  
  1231. {/block:Posts}
  1232.  
  1233. <!------------------------------ PERMALINK ------------------------------->
  1234.  
  1235. {block:PostNotes}
  1236. <div id="permalink">
  1237. <div id="notescontainer">{PostNotes}</div>
  1238. </div>
  1239. {/block:PostNotes}
  1240.  
  1241. </div> <!-- ending div tag for "entries" -->
  1242.  
  1243. <script>
  1244. /* questions? ask oddhour.tumblr.com */
  1245. var updatePhotosetCss = "<style id='updatePhotosetStyle'> .photoset .photoset_row.photoset_row_1 img { max-width: 540px; } .photoset .photoset_row.photoset_row_1 { margin-top:5px; } .photoset .photoset_row.photoset_row_2 img { max-width: 268px; } .photoset .photoset_row.photoset_row_2 { margin-top:5px; } .photoset .photoset_row.photoset_row_3 img { max-width: 177px; } .photoset .photoset_row.photoset_row_3 { margin-top:5px; } .photoset .photoset_row { text-align: center; width: 540px; } .photoset .photoset_row .photoset_photo {margin-left:4px;} .photoset { width: 540px; }</style>";
  1246. function updatePhotoset() {
  1247.  
  1248. $(".photoset").each( function (i, e) {
  1249. if($(this.contentDocument).find("#updatePhotosetStyle").size() <= 0)
  1250. $(this.contentDocument).find("head").append(updatePhotosetCss);
  1251. var photoset = $(this.contentDocument).find(".photoset");
  1252. var photosetRows = photoset.find(".photoset_row");
  1253. photoset.find(".photoset_photo")
  1254. .each(function () {
  1255. var hiResSrc = $(this).attr("href");
  1256. var img = $(this).find('img');
  1257. img.attr("src", hiResSrc );
  1258. img.attr("style", "");
  1259. });
  1260. photosetRows.attr("style", "").css("margin-bottom", "-5px");
  1261. photoset.attr("style","");
  1262.  
  1263. $(this).height($(this.contentDocument.body).height());
  1264. });
  1265. }
  1266.  
  1267. updatePhotoset();
  1268.  
  1269. var photosetTimer = setInterval(updatePhotoset, 1500);
  1270. $(window).on('load', function () { setTimeout(function() {clearInterval(photosetTimer)}, 2000); })
  1271. </script>
  1272.  
  1273. </body>
  1274. </html>
Advertisement
Add Comment
Please, Sign In to add comment