Advertisement
striaton-city

Untitled

Aug 4th, 2015
79
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 28.66 KB | None | 0 0
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  4.  
  5. <head>
  6.  
  7. <!----[9] Memories of You -------------------------------------------------
  8.  
  9. + Theme by sanyoucity.tumblr.com
  10.  
  11. Hello! Thanks for using my theme. Feel free to do whatever you want with this
  12. code as long as you do not redistribute it or use sections of the code with-
  13. out my permission (I'll most likely say yes but I'd like to know!). Also,
  14. don't remove my credit! If you have any questions or comments don't hesitate
  15. to send me a message @sanyoucity. This time I've made an attempt to organize
  16. my code, so things should be easier to find!
  17.  
  18. + popup menu tutorial by starious.tumblr.com
  19. + monochrome tutorial by a--themes.tumblr.com
  20.  
  21. ------------------------------------------------------------- ver 1.0 ---->
  22.  
  23.  
  24. <!-- POPUP JAVASCRIPT -->
  25. <script type="text/javascript"
  26. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  27. <script>
  28. $(document).ready(function() {
  29. //
  30. $('a.poplight[href^=#]').click(function() {
  31. var popID = $(this).attr('rel'); //Get Popup Name
  32. var popURL = $(this).attr('href'); //Get Popup href to define size
  33. var query= popURL.split('?');
  34. var dim= query[1].split('&');
  35. var popWidth = dim[0].split('=')[1]; //Gets the first query string value
  36. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://tiny.cc/closeimg" id="closee" title="Close" alt="Close" /></a>');
  37. var popMargTop = ($('#' + popID).height() + 80) / 2;
  38. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  39. //Apply Margin to Popup
  40. $('#' + popID).css({
  41. 'margin-top' : -popMargTop,
  42. 'margin-left' : -popMargLeft
  43. });
  44. $('body').append('<div id="fade"></div>');
  45. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn(); //Fade in the fade layer - .css({'filter' : 'alpha(opacity=80)'})
  46. return false;
  47. });
  48. $('a.close, #fade').live('click', function() {
  49. $('#fade , .popup_block').fadeOut(function() {
  50. $('#fade, a.close').remove(); //fade them both out
  51. });
  52. return false;
  53. });
  54. });
  55. </script>
  56. </script>
  57.  
  58. <title>{Title}</title>
  59. <link rel="shortcut icon" href="{Favicon}">
  60. <link rel="alternate" type="application/rss+xml" href="{RSS}">
  61. {block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}
  62.  
  63. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
  64.  
  65. <!-- TOOLTIP -->
  66. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  67. <script>
  68. (function($){
  69. $(document).ready(function(){
  70. $("[title]").style_my_tooltips();
  71. });
  72. })(jQuery);
  73. </script>
  74.  
  75.  
  76.  
  77. <meta name="image:side image" content="http://static.tumblr.com/608371af1ff647ea3f5bb1eb4e640f7c/wrjqiql/ghSnrnqg7/tumblr_static_pgiafn0ku0gs4oo80cwwckg8.png"/>
  78. <meta name="image:background" content=""/>
  79.  
  80. <meta name="color:background" content="#ffffff"/>
  81. <meta name="color:scroll" content="#a5a5a5"/>
  82. <meta name="color:posts" content="#a5a5a5"/>
  83. <meta name="color:title" content="#444444"/>
  84. <meta name="color:title2" content="#ffffff"/>
  85. <meta name="color:blockquote" content="#8e9294"/>
  86. <meta name="color:text" content="#032d41"/>
  87. <meta name="color:selection text" content="#a34d42"/>
  88. <meta name="color:selection" content="#ffffff"/>
  89. <meta name="color:description" content="#444"/>
  90.  
  91. <meta name="color:nav" content="#444"/>
  92. <meta name="color:nav hover" content="#fff"/>
  93.  
  94. <meta name="color:link" content="#235c92"/>
  95. <meta name="color:ask text" content="#616a86"/>
  96. <meta name="color:ask bubble" content="#eae8e8"/>
  97. <meta name="color:tooltip text" content="#ffffff"/>
  98. <meta name="color:tooltip" content="#444444"/>
  99.  
  100. <meta name="color:perm" content="#444444"/>
  101. <meta name="color:perm border" content="#444444"/>
  102. <meta name="color:perm hover" content="#a5a5a5"/>
  103.  
  104. <meta name="color:odd chat" content="#777777">
  105. <meta name="color:even chat" content="#b8b8b8">
  106.  
  107. <meta name="color:bold" content="#9a787e"/>
  108. <meta name="color:italics" content="#aed2da"/>
  109.  
  110. <meta name="text:link1 title" content="LINK 1"/>
  111. <meta name="text:link1 url" content="/"/>
  112. <meta name="text:link2 title" content="LINK 2"/>
  113. <meta name="text:link2 url" content="/"/>
  114. <meta name="text:link3 title" content="LINK 3"/>
  115. <meta name="text:link3 url" content="/"/>
  116. <meta name="text:link4 title" content="LINK 4"/>
  117. <meta name="text:link4 url" content="/"/>
  118. <meta name="text:link5 title" content="LINK 5"/>
  119. <meta name="text:link5 url" content="/"/>
  120. <meta name="text:link6 title" content="LINK 6"/>
  121. <meta name="text:link6 url" content="/"/>
  122.  
  123. <meta name="text:side image width" content="430"/>
  124.  
  125. <meta name="if:All Caps" content="1"/>
  126. <meta name="if:Monochrome" content="0" />
  127.  
  128. <link href='http://fonts.googleapis.com/css?family=Maven+Pro:400,900' rel='stylesheet' type='text/css'>
  129. <link href='http://fonts.googleapis.com/css?family=Oxygen' rel='stylesheet' type='text/css'>
  130.  
  131. <style type="text/css">
  132.  
  133.  
  134. /* POPUP */
  135. #closee {
  136. width:30px;
  137. float: right;
  138. }
  139.  
  140. #fade {
  141. display: none;
  142. background-image: url('{image:background}');
  143. background-color: {color:background};
  144. position: fixed; left: 0; top: 0;
  145. width: 100%; height: 100%;?
  146. opacity:1;
  147. z-index: 999999999;
  148. }
  149.  
  150. .popup_block{
  151. display: none;
  152. background: rgba(0,0,0,0);
  153. padding: 10px;
  154. border: 1px solid {color:posts};
  155. float: left;
  156. font-size: 10;
  157. position: fixed;
  158. top: 50%; left: 50%;
  159. z-index: 99999999999999999999;
  160. }
  161.  
  162. img.btn_close {
  163. float: right;
  164. margin: -20 -20px 0 0;
  165. }
  166.  
  167. *html #fade {position: absolute;}
  168. *html .popup_block {position: absolute;}
  169.  
  170. /* SCROLLBAR */
  171. ::-webkit-scrollbar {
  172. width: 7px;
  173. }
  174.  
  175. ::-webkit-scrollbar-thumb:vertical {
  176. width: 3px;
  177. background-color: {color:scroll};
  178. }
  179.  
  180. ::-webkit-scrollbar-thumb{
  181. background-color:{color:background};
  182.  
  183. }
  184.  
  185. /* GENERAL */
  186. body {
  187. background: {color:background};
  188. font-family: calibri, sans-serif;
  189. font-size: 11px;
  190. {block:ifAllCaps}
  191. text-transform:uppercase;
  192. {/block:ifAllCaps}
  193. letter-spacing:2px;
  194. color: {color:text};
  195. text-align: center;
  196. background-image: url('{image:background}');
  197. font-family: 'Oxygen', calibri, sans-serif;
  198. border:none;
  199. }
  200.  
  201. blockquote {padding-left:5px;border-left:1px solid;color: {color:blockquote};}
  202. small {font-size:11px;}
  203. body, a {cursor: crosshair;}
  204. a:hover {cursor:crosshair;}
  205. ul {list-style-type: square;}
  206. a {color: {color:link};text-decoration: none;}
  207. a:hover {text-decoration:underline;}
  208. img {max-width: 100%;}
  209. .entry img:hover {background-color: rgba(0,0,0,0);}
  210. #portrait img {float: left;margin-right: 5px;}
  211. strong, b {color: {color:bold};}
  212. em, i {color: {color:italics};}
  213.  
  214. {block:ifMonochrome}
  215. .mono {
  216. filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000 /svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0 .3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
  217. filter: gray;
  218. -webkit-filter: grayscale(100%);
  219. -webkit-transition: all 0.7s linear;
  220. -moz-transition: all 0.7s linear;
  221. -o-transition: all 0.7s linear;
  222. }
  223. .mono:hover {
  224. filter: none;
  225. -webkit-filter: grayscale(0%);
  226. }
  227. {/block:ifMonochrome}
  228.  
  229. /* PAGINATION */
  230. .prev {
  231. color:{color:text};
  232. margin-left: 60px;
  233. position:fixed;
  234. margin-top:480px;
  235. padding-right:10px;
  236. opacity:.8;
  237. font-weight:bold;
  238. font-size: 8px;
  239. z-index:9999;
  240. text-align:left;
  241. font-size:10px;
  242. }
  243.  
  244. .next {
  245. color:{color:text};
  246. margin-left: 30px;
  247. position:fixed;
  248. margin-top:480px;
  249. opacity:.8;
  250. font-weight:bold;
  251. font-size: 8px;
  252. z-index:9999;
  253. text-align:left;
  254. font-size:10px;
  255. }
  256.  
  257. .prev a, .next a {
  258. color:{color:text};
  259. font-size:10px;
  260. }
  261.  
  262. #pagination a {
  263. color:{color:nav text hover};
  264. }
  265.  
  266.  
  267. #pagination a:hover {
  268. background-color: rgba(0,0,0,0);
  269. font-style:normal;
  270. }
  271.  
  272. #side {
  273. position:left;
  274. width:auto;
  275. height:auto;
  276. }
  277.  
  278. /* TITLE */
  279. #title {
  280. text-transform:uppercase;
  281. z-index: 99999;
  282. position: fixed;
  283. margin-left:30px;
  284. margin-top: 250px;
  285. font-size: 30px;
  286. text-align:center;
  287. color: {color:title2};
  288. background-color:{color:title};
  289. border-radius:2px;
  290. font-family: 'Maven Pro' , sans-serif;
  291. font-weight:700;
  292. padding:1px;
  293. }
  294. #title a {
  295. color: {color:title2};
  296. background-color:{color:title1};
  297. }
  298. #title a:hover {
  299. text-decoration:none;
  300. font-style:normal;
  301. }
  302.  
  303.  
  304.  
  305. /* PERMALINK */
  306. #permalink {
  307. text-align: center;
  308. position: relative;
  309. margin-top: 5px;
  310. padding-top: 5px;
  311. }
  312. #permalink #notecontainer ol.notes {
  313. list-style-type: none;
  314. text-align:left;
  315. padding: 0;
  316. margin-top:100;
  317. }
  318. #permalink #notecontainer img.avatar {
  319. margin-right: 10px;
  320. width: 16px;
  321. height: 16px;
  322. }
  323. .permatext {
  324. display:block;
  325. line-height:15px;
  326. text-align:center;
  327. }
  328.  
  329. /* POSTS */
  330. h1 {
  331. text-align: left;
  332. font-size: 15px;
  333. color: {color:Title};
  334. font-variant:small-caps;
  335. }
  336. #around {
  337. width: 20px;
  338. }
  339.  
  340. #container {
  341. margin-left:auto;
  342. margin-right:auto;
  343. width: 500px;
  344.  
  345. }
  346. .entry {
  347. margin-top:100px;
  348. margin-left: -200px;
  349. float:left;
  350. position: relative;
  351. width:250px;
  352. padding: 5px;
  353. margin-bottom:20px;
  354. background-color: {color:background};
  355. word-wrap: break-word;
  356. opacity:1;
  357. transition: 2s;
  358. z-index:99;
  359.  
  360. }
  361. .entry {
  362. padding:5px;
  363. margin:2px;
  364. margin-bottom:12px;
  365. margin-left:45px;
  366. width:400px;
  367. border-radius:0px;
  368. padding:5px;
  369. background:rgba(0,0,0,0);
  370. text-align: justify;
  371. z-index:99;
  372. }
  373.  
  374. .left {
  375. float:left;
  376. margin-right:20px;
  377. width:802px;
  378. }
  379.  
  380. #posts {
  381. float:left;
  382. margin-top:70px;
  383. width:530px;
  384. height:82%;
  385. padding:10px;
  386. position:fixed;
  387. border-radius:0px;
  388. opacity:1;
  389. background-color: rgba(0,0,0,0) ;
  390. border-top:1px solid {color:posts};
  391. border-image:url() 30 30 round;
  392. overflow-x:hidden;
  393. overflow-y: scroll;
  394. z-index:9999;
  395. }
  396.  
  397. .title {
  398. font-size:20px;
  399. line-height:22px;
  400. color:{color:Title};
  401. text-align:left;
  402. text-transform:uppercase;
  403. font-family: 'Oxygen', calibri, cursive;
  404. padding:3.5px;
  405. -moz-transition: all 0.5s linear;
  406. -o-transition: all 0.5s linear;
  407. -ms-transition: all 0.5s linear;
  408. transition: all 0.5s linear;
  409. }
  410. .title:hover {
  411. color:{color:italics};
  412. cursor:help;
  413. -moz-transition: all 0.5s linear;
  414. -o-transition: all 0.5s linear;
  415. -ms-transition: all 0.5s linear;
  416. transition: all 0.5s linear;
  417. text-decoration:none;
  418. }
  419.  
  420.  
  421. /* CUSTOM LINKS */
  422. .yi {
  423. margin-left:22.5px;
  424. margin-top: 30px;
  425. height:40px;
  426. width:120px;
  427. padding:2px;
  428. line-height:40px;
  429. font-size:20px;
  430. text-align:center;
  431. position:fixed;
  432. background-color:{color:title};
  433. color:{color:title2};
  434. border: 1px solid {color:title2};
  435. z-index:9999999999;
  436. -webkit-transition: all 0.5s linear;
  437. -moz-transition: all 0.5s linear;
  438. -o-transition: all 0.5s linear;
  439. }
  440. .yi:hover {
  441. background-color:rgba(0,0,0,0);
  442. color:{color:title};
  443. border: 1px solid {color:title};
  444. -webkit-transition: all 0.5s linear;
  445. -moz-transition: all 0.5s linear;
  446. -o-transition: all 0.5s linear;
  447. }
  448.  
  449. .er {
  450. margin-left:185px;
  451. margin-top:30px;
  452. height:40px;
  453. width:120px;
  454. padding:2px;
  455. line-height:40px;
  456. font-size:20px;
  457. text-align:center;
  458. position:fixed;
  459. background-color:{color:title};
  460. color:{color:title2};
  461. border: 1px solid {color:title2};
  462. z-index:9999999999;
  463. -webkit-transition: all 0.5s linear;
  464. -moz-transition: all 0.5s linear;
  465. -o-transition: all 0.5s linear;
  466. }
  467. .er:hover {
  468. background-color:rgba(0,0,0,0);
  469. color:{color:title};
  470. border: 1px solid {color:title};
  471. -webkit-transition: all 0.5s linear;
  472. -moz-transition: all 0.5s linear;
  473. -o-transition: all 0.5s linear;
  474. }
  475.  
  476. .san {
  477. margin-left:347.5px;
  478. margin-top:30px;
  479. height:40px;
  480. width:120px;
  481. padding:2px;
  482. line-height:40px;
  483. font-size:20px;
  484. text-align:center;
  485. position:fixed;
  486. background-color:{color:title};
  487. color:{color:title2};
  488. border: 1px solid {color:title2};
  489. z-index:9999999999;
  490. -webkit-transition: all 0.5s linear;
  491. -moz-transition: all 0.5s linear;
  492. -o-transition: all 0.5s linear;
  493. }
  494. .san:hover {
  495. background-color:rgba(0,0,0,0);
  496. color:{color:title};
  497. border: 1px solid {color:title};
  498. -webkit-transition: all 0.5s linear;
  499. -moz-transition: all 0.5s linear;
  500. -o-transition: all 0.5s linear;
  501. }
  502.  
  503. .shi {
  504. margin-left:22.5px;
  505. margin-top: 110.5px;
  506. height:40px;
  507. width:120px;
  508. padding:2px;
  509. line-height:40px;
  510. font-size:20px;
  511. text-align:center;
  512. position:fixed;
  513. background-color:{color:title};
  514. color:{color:title2};
  515. border: 1px solid {color:title2};
  516. z-index:9999999999;
  517. -webkit-transition: all 0.5s linear;
  518. -moz-transition: all 0.5s linear;
  519. -o-transition: all 0.5s linear;
  520. }
  521. .shi:hover {
  522. background-color:rgba(0,0,0,0);
  523. color:{color:title};
  524. border: 1px solid {color:title};
  525. -webkit-transition: all 0.5s linear;
  526. -moz-transition: all 0.5s linear;
  527. -o-transition: all 0.5s linear;
  528. }
  529.  
  530. .wu {
  531. margin-left:185px;
  532. margin-top:110.5px;
  533. height:40px;
  534. width:120px;
  535. padding:2px;
  536. line-height:40px;
  537. font-size:20px;
  538. text-align:center;
  539. position:fixed;
  540. background-color:{color:title};
  541. color:{color:title2};
  542. border: 1px solid {color:title2};
  543.  
  544. z-index:9999999999;
  545. -webkit-transition: all 0.5s linear;
  546. -moz-transition: all 0.5s linear;
  547. -o-transition: all 0.5s linear;
  548. }
  549. .wu:hover {
  550. background-color:rgba(0,0,0,0);
  551. color:{color:title};
  552. border: 1px solid {color:title};
  553. -webkit-transition: all 0.5s linear;
  554. -moz-transition: all 0.5s linear;
  555. -o-transition: all 0.5s linear;
  556. }
  557.  
  558. .liu {
  559. margin-left:347.5px;
  560. margin-top:110.5px;
  561. height:40px;
  562. width:120px;
  563. padding:2px;
  564. line-height:40px;
  565. font-size:20px;
  566. text-align:center;
  567. position:fixed;
  568. background-color:{color:title};
  569. color:{color:title2};
  570. border: 1px solid {color:title2};
  571. z-index:9999999999;
  572. -webkit-transition: all 0.5s linear;
  573. -moz-transition: all 0.5s linear;
  574. -o-transition: all 0.5s linear;
  575. }
  576. .liu:hover {
  577. background-color:rgba(0,0,0,0);
  578. color:{color:title};
  579. border: 1px solid {color:title};
  580. -webkit-transition: all 0.5s linear;
  581. -moz-transition: all 0.5s linear;
  582. -o-transition: all 0.5s linear;
  583. }
  584.  
  585. #links {
  586. height:10px;
  587. width:10px;
  588. position:fixed;
  589. border-radius:1px;
  590. background-color:{color:nav};
  591. margin-left:535px;
  592. margin-top:65px;
  593. z-index:999999999;
  594. -webkit-transition: all 0.5s linear;
  595. -moz-transition: all 0.5s linear;
  596. -o-transition: all 0.5s linear;
  597. }
  598. #links:hover {
  599. background-color:{color:nav hover};
  600. -webkit-transition: all 0.5s linear;
  601. -moz-transition: all 0.5s linear;
  602. -o-transition: all 0.5s linear;
  603. }
  604.  
  605. /* DESCRIPTION */
  606.  
  607. #desc {
  608. z-index:3;
  609. width:230px;
  610. border-radius:0px;
  611. margin-left:30px;
  612. margin-top:300px;
  613. text-transform:lowercase;
  614. font-size:10px;
  615. position:fixed;
  616. padding:5px;
  617. text-align:left;
  618. word-wrap: break-word;
  619. line-height:25px;
  620. overflow-y:hidden;
  621. }
  622. #desc p{
  623. background-color:{color:title};
  624. }
  625.  
  626. /* CHAT */
  627.  
  628. .line {
  629. border-bottom: 1px solid {color:ask bubble};
  630. background-color: {color:background};
  631. }
  632.  
  633. .odd .line {
  634. padding: 5px 5px;
  635. color:{color:odd chat};
  636. background-color: rgba(0,0,0,0);
  637.  
  638. }
  639. .even .line {
  640. padding: 5px 5px;
  641. color:{color:even chat};
  642. background-color: rgba(0,0,0,0);
  643.  
  644. }
  645.  
  646. /* NAVIGATION */
  647. #navv {
  648. height: 190px;
  649. }
  650.  
  651. /* TAGS */
  652. .entry:hover #tags{
  653. margin-top: 0px;
  654. opacity: 1;
  655. border-left:1px solid {color:link};
  656. -webkit-transition: all 0.8s ease;
  657. -moz-transition: all 0.8s ease;
  658. -o-transition: all 0.8s ease;
  659. }
  660.  
  661.  
  662. #tags{
  663. border-left:1px solid {color:link};
  664. overflow-x:auto;
  665. z-index: 999;
  666. font-family: calibri;
  667. font-size: 10px;
  668. letter-spacing: 1px;
  669. width: 100px;
  670. margin-top: 0px;
  671. display: inline-block;
  672. padding: 5px;
  673. margin-left: 500px;
  674. text-align: left;
  675. position: absolute;
  676. z-index: 9999;
  677. opacity: 0;
  678. -webkit-transition: all 0.8s ease;
  679. -moz-transition: all 0.8s ease;
  680. -o-transition: all 0.8s ease;
  681. }
  682.  
  683. #tags a{
  684. color: {color:link};
  685. font-style: none;
  686. }
  687.  
  688. #tags a:hover {
  689. color: {color:link};
  690. font-style: none;
  691. }
  692.  
  693. #tags b,strong{
  694. color: {color:link};
  695. }
  696.  
  697. /* AUDIO */
  698. #musicc {
  699. margin-left: 190px;
  700. margin-top:415px;
  701. position:fixed;
  702. opacity:.8;
  703. z-index:9999;
  704.  
  705. }
  706.  
  707. .album {
  708. position:absolute;
  709. width:100px;
  710. height:100px;
  711.  
  712. }
  713. .album img {
  714. width:100px;
  715. height:100px;
  716. z-index:1;
  717.  
  718. }
  719. .audio {
  720. display:block;
  721. position:absolute;
  722. width:30px;
  723. height:30px;
  724.  
  725. }
  726. .play {
  727. width:27px;
  728. height:80px;
  729. opacity:.5;
  730. padding-top:40px;
  731. padding-left:35px;
  732. overflow:hidden;
  733.  
  734. }
  735. .cap {
  736. height:100px;
  737.  
  738. }
  739. .capp {
  740. margin-left:110px;
  741. width:250px;
  742. text-align:left;
  743.  
  744. }
  745.  
  746. .bubble {
  747. position:relative;
  748. margin:0px 0px 0px 50px;
  749. text-align:left; padding:10px;
  750. color:{color:ask text};
  751. border:1px solid {color:ask bubble};
  752. min-height:27px;
  753. opacity:.7;
  754. border-radius:0px;
  755. double {color:ask bubble};
  756.  
  757. }
  758. .bubble p {
  759. margin:1px 0px;
  760.  
  761. }
  762.  
  763. #sideb {
  764. z-index:2;
  765. position:fixed;
  766. }
  767. #sideb img {
  768. position:relative;
  769.  
  770. }
  771.  
  772. img {
  773. border-radius:0px;
  774. }
  775.  
  776. #info {
  777. margin-top:10px;
  778. background-color:{color:perm};
  779. border:1px solid {color:perm border};
  780. border-radius:1px;
  781. height:50px;
  782. -webkit-transition: opacity 0.7s linear;
  783. -webkit-transition: all 0.7s ease-in-out;
  784. -moz-transition: all 0.7s ease-in-out;
  785. -o-transition: all 0.7s ease-in-out;
  786. }
  787.  
  788.  
  789. #info a {
  790. border-bottom:1px solid rgba(0,0,0,0);
  791. border-top:1px solid rgba(0,0,0,0);
  792. -webkit-transition: opacity 0.7s linear;
  793. -webkit-transition: all 0.7s ease-in-out;
  794. -moz-transition: all 0.7s ease-in-out;
  795. -o-transition: all 0.7s ease-in-out;
  796. }
  797.  
  798. #info a:hover {
  799. font-style:normal;
  800. text-decoration:none;
  801. border-bottom:1px solid {color:posts};
  802. border-top:1px solid {color:posts};
  803. cursor:help;
  804. -webkit-transition: opacity 0.7s linear;
  805. -webkit-transition: all 0.7s ease-in-out;
  806. -moz-transition: all 0.7s ease-in-out;
  807. -o-transition: all 0.7s ease-in-out;
  808.  
  809. }
  810.  
  811. #date {
  812. margin-top:17px;
  813. margin-left:10px;
  814. }
  815.  
  816. /* TOOLTIP */
  817. #s-m-t-tooltip {
  818. display: block;
  819. background: {color:tooltip};
  820. font-size: 10px;
  821. text-transform: uppercase;
  822. color: {color:tooltip text};
  823. text-align: center;
  824. font-family: calibri, sans-serif;
  825. letter-spacing: 0px;
  826. margin-left: 18px;
  827. padding: 1px 2px;
  828. min-width: 30px;
  829. max-width: 200px;
  830. z-index: 99999999999999999999999999999999999999999;
  831.  
  832. }
  833.  
  834. /* HIGHLIGHT */
  835. ::selection {
  836. background-color:{color:selection};
  837. color:{color:selection text};
  838.  
  839. }
  840.  
  841.  
  842. #thing {
  843. width: 100%;
  844. height:100%;
  845. position:fixed;
  846. z-index:1;
  847. }
  848.  
  849. #swagmoney {position:fixed;font-weight:700;font-size:20px;line-height:20px;width: 100px;height:21px;overflow:hidden;z-index:9999999999999999;inline:block;color:{color:text};}
  850. .swag {margin-top:0px;position:relative;transition:.3s;}
  851. .swag:hover {margin-top:-21px;transition:.3s;}
  852. .swag a {color:{color:text};}
  853. .swag a:hover {text-decoration:none;color:#FF3399;border:none;}
  854.  
  855.  
  856. </style>
  857.  
  858. </head>
  859.  
  860. <body>
  861.  
  862. <div id="swagmoney">
  863. <div class="swag"><span style="margin-left:-50px;">♔</span><br><a style="font-size:11px" href="http://sanyoucity.tumblr.com/">&nbsp;SANYOUCITY</a></div>
  864. </div>
  865.  
  866. <!-- TITLE -->
  867. <div id="title">{Title}</div>
  868.  
  869.  
  870. <!-- DESCRIPTION -->
  871.  
  872. <div title="desc"></div>
  873. <div id="desc">
  874. <span style="
  875. background-color:{color:description};
  876. padding:2px; color:{color:background};">
  877. {description}</span>
  878. <br>
  879.  
  880. <!-- LINKS -->
  881.  
  882. <span style="color:{color:description};">/<a href="/">index</a></span>
  883. <!-- home -->
  884. <br>
  885. <span style="color:{color:description};">/<a href="#?w=500"rel="02" class="poplight">message</a></span>
  886. <!-- ask -->
  887. <br>
  888.  
  889. <span style="color:{color:description};">/<a href="/archive">history</a></span>
  890. <!-- archive -->
  891. <br>
  892. <span style="color:{color:description};">/<a href="#?w=500"rel="navv" class="poplight">links</a></span>
  893. <!-- links -->
  894.  
  895.  
  896. <!-- PAGINATION -->
  897. <br>
  898. {block:NextPage} &nbsp;<a href="{NextPage}" >next</a>{/block:NextPage}
  899.  
  900. {block:PreviousPage}/ &nbsp;<a href="{PreviousPage}" >prev </a>{/block:PreviousPage}
  901.  
  902. </div>
  903.  
  904. <div id="container">
  905.  
  906. <!-- CORNER/SIDE IMAGE -->
  907.  
  908. <div id="sideb"><div style="
  909. position:fixed;
  910. bottom:0px;
  911. right:0px;
  912. width:px;">
  913.  
  914. <img width={text:side image width} src= "{image:side image}" /> <br></div></div>
  915.  
  916.  
  917. <!-- CUSTOM LINKS POPUP -->
  918.  
  919. <div id="navv" class="popup_block" >
  920.  
  921. <a href="{text:link1 url}"><div class="yi">{text:link1 title}</div></a>
  922. <a href="{text:link2 url}"><div class="er">{text:link2 title}</div></a>
  923. <a href="{text:link3 url}"><div class="san">{text:link3 title}</div></a>
  924. <a href="{text:link4 url}"><div class="shi">{text:link4 title}</div></a>
  925. <a href="{text:link5 url}"><div class="wu">{text:link5 title}</div></a>
  926. <a href="{text:link6 url}"><div class="liu">{text:link6 title}</div></a>
  927.  
  928. <!-- CORNER/SIDE IMAGE -->
  929.  
  930. <div id="sideb"><div style="
  931. position:fixed;
  932. bottom:0px;
  933. right:0px;
  934. width:px;">
  935.  
  936. <img width={text:side image width} src= "{image:side image}" /> <br></div></div>
  937.  
  938. </div>
  939.  
  940. <!-- POSTS -->
  941. <div class="scroll">
  942. {block:Posts}
  943.  
  944. <div class="entry">
  945.  
  946. {block:indexpage}
  947.  
  948. {block:HasTags}
  949. <div id="tags">
  950. <b>filed under:</b><br /> {block:Tags} <b>#</b><a href="/tagged/{Tag}">{Tag}</a><br />{/block:Tags}
  951. </div>
  952. {/block:HasTags}
  953.  
  954. {/block:indexpage}
  955.  
  956. {block:Answer}
  957. <div class="mono">
  958. <img src="{AskerPortraitURL-40}" width="49" align="left">
  959. </div>
  960. <div class="bubble"><span></span><b>{Asker} whispered:</b> {Question}</div><br/><div class="mono">{Answer}</div>
  961. {/block:Answer}
  962.  
  963. {block:Text}
  964. {block:Title}<a href="{Permalink}"class="title" >{Title}</a>{/block:Title}
  965. <div class="mono">{Body}</div>
  966. {/block:Text}
  967.  
  968. {block:Link}
  969. <a href="{URL}" class="title">{Name}</a>
  970. {block:Description}{Description}{/block:Description}
  971. {block:Link}
  972.  
  973. {block:Photo}
  974. {LinkOpenTag}
  975. <div class="mono">
  976. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%">
  977. </div>
  978. {LinkCloseTag}
  979. {/block:Photo}
  980.  
  981. {block:Photoset}
  982. <div class="mono">
  983. <center>{Photoset-400}</center>
  984. </div>
  985. {/block:Photoset}
  986.  
  987. {block:Quote}
  988. <a class="title" href="{Permalink}">"{Quote}"</a><br>
  989. <div align="right">{block:Source}- {Source}{/block:Source}</div>
  990. {/block:Quote}
  991.  
  992. {block:Chat}
  993. {block:Title}<a href="{Permalink}"class="title">{Title}</a>{/block:Title}<br><br>
  994. <div class="text">
  995. {block:Lines}<div class="{Alt}">
  996. <div class="line">{block:Label}<span>{Label}</span>{/block:Label} {Line}<br /></div></div>
  997. {/block:Lines}
  998. </div>
  999. {/block:Chat}
  1000.  
  1001. {block:Audio}
  1002. {block:AlbumArt}
  1003. <div class="mono">
  1004. <div class="album"><img src="{AlbumArtURL}"></div>
  1005. </div>
  1006. {/block:AlbumArt}
  1007. <div class="audio"><div class="play">{AudioPlayerBlack}</div></div>
  1008. <div class="cap"><div class="capp">{block:TrackName}<b><font size="2">{TrackName}</font></b>{/block:TrackName}{block:Artist}<br>{Artist}{/block:Artist}</div></div>
  1009. {/block:Audio}
  1010.  
  1011. {block:Video}
  1012. <center>{Video-250}</center>
  1013. {block:Video}
  1014.  
  1015. <!--PERMATEXT -->
  1016.  
  1017. {block:IndexPage}
  1018.  
  1019. {block:Caption}{Caption}{/block:Caption}
  1020.  
  1021. {block:Date}
  1022.  
  1023. <div id="info">
  1024. <div id="date">
  1025.  
  1026. <!-- reblog -->
  1027. <a href="{ReblogURL}"
  1028. title="reblog?"
  1029. target=_blank
  1030. class=details
  1031. style="
  1032. padding:5px;
  1033. top:5px;
  1034. color:{color:background};"
  1035. >REBLOG</a>&nbsp;
  1036.  
  1037. <!-- date -->
  1038. <a href="{Permalink}" style="
  1039. padding:5px;
  1040. color:{color:background};
  1041. text-transform:uppercase;">
  1042. {ShortMonth}-{DayOfMonthWithZero}</a>&nbsp;
  1043.  
  1044. <!-- time -->
  1045. <a href="{Permalink}"
  1046. style="
  1047. padding:5px;
  1048. color:{color:background};">
  1049. {12Hour}:{Minutes} {CapitalAmPm}</a>&nbsp;
  1050.  
  1051. <!-- notes -->
  1052. {block:NoteCount}<a href="{Permalink}"
  1053. style="
  1054. padding:5px;
  1055. color:{color:background};
  1056. text-transform:uppercase;">
  1057. {notecount}% </a>{/block:NoteCount} &nbsp;
  1058.  
  1059. <!-- via -->
  1060. {block:RebloggedFrom}<a href="{ReblogParentURL}"
  1061. title="{ReblogParentName}"
  1062. style="
  1063. padding:5px;
  1064. color:{color:background};">VIA</a>{/block:RebloggedFrom}&nbsp;
  1065. {block:RebloggedFrom}
  1066.  
  1067. <!-- ori -->
  1068. <a href="{ReblogRootURL}" title="{ReblogRootName}"
  1069. style="
  1070. padding:5px;
  1071. color:{color:background};">ORI</a>
  1072. {/block:RebloggedFrom}
  1073.  
  1074.  
  1075. <!-- important for some reason
  1076.  
  1077. <br><br>
  1078. {block:HasTags}
  1079. <div id="tagg">
  1080. <span id="tags" style="
  1081. background-color:#444;
  1082. color:white;
  1083. padding:5px;" >{block:Tags}<a href="{TagURL}">#{Tag}</a> {/block:Tags}<br><br></span>
  1084. </div>
  1085. {/block:hasTags} -->
  1086. </div></div>
  1087. {/block:Date}
  1088.  
  1089.  
  1090. {block:IndexPage}
  1091.  
  1092. {block:PermalinkPage}
  1093.  
  1094. {block:Caption}{Caption}{/block:Caption}<br>
  1095.  
  1096. {block:Date}
  1097.  
  1098. <div id="info">
  1099. <div id="date">
  1100.  
  1101. <!-- reblog -->
  1102. <a href="{ReblogURL}"
  1103. title="reblog?"
  1104. target=_blank
  1105. class=details
  1106. style="
  1107. padding:5px;
  1108. top:5px;
  1109. color:{color:background};"
  1110. >REBLOG</a>&nbsp;
  1111.  
  1112. <!-- date -->
  1113. <a href="{Permalink}" style="
  1114. padding:5px;
  1115. color:{color:background};
  1116. text-transform:uppercase;">
  1117. {ShortMonth}-{DayOfMonthWithZero}</a>&nbsp;
  1118.  
  1119. <!-- time -->
  1120. <a href="{Permalink}"
  1121. style="
  1122. padding:5px;
  1123. color:{color:background};">
  1124. {12Hour}:{Minutes} {CapitalAmPm}</a>&nbsp;
  1125.  
  1126. <!-- notes -->
  1127. {block:NoteCount}<a href="{Permalink}"
  1128. style="
  1129. padding:5px;
  1130. color:{color:background};
  1131. text-transform:uppercase;">
  1132. {notecount}% </a>{/block:NoteCount} &nbsp;
  1133.  
  1134. <!-- via -->
  1135. {block:RebloggedFrom}<a href="{ReblogParentURL}"
  1136. title="{ReblogParentName}"
  1137. style="
  1138. padding:5px;
  1139. color:{color:background};">VIA</a>{/block:RebloggedFrom}&nbsp;
  1140. {block:RebloggedFrom}
  1141.  
  1142. <!-- ori -->
  1143. <a href="{ReblogRootURL}" title="{ReblogRootName}"
  1144. style="
  1145. padding:5px;
  1146. color:{color:background};">ORI</a>
  1147. {/block:RebloggedFrom}
  1148. </div></div>
  1149. {/block:Date}
  1150.  
  1151. {/block:PermalinkPage}
  1152.  
  1153. {block:PostNotes}{PostNotes}{/block:PostNotes}</div>
  1154.  
  1155.  
  1156.  
  1157. {/block:Posts}</div></div></div></div><!--</div>-->
  1158.  
  1159. <div id="thing"></div>
  1160.  
  1161. </body>
  1162.  
  1163. <!-- SUBMIT POPUP -->
  1164.  
  1165. <div id="02" class="popup_block">
  1166.  
  1167. <Center><iframe frameborder="0" scrolling="yes" width="100%" height="190" src="http://www.tumblr.com/ask_form/{Name}.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"></iframe>
  1168.  
  1169. <!-- CORNER/SIDE IMAGE -->
  1170.  
  1171. <div id="sideb"><div style="
  1172. position:fixed;
  1173. bottom:0px;
  1174. right:0px;
  1175. width:px;">
  1176.  
  1177. <img width={text:side image width} src= "{image:side image}" /> <br></div></div>
  1178. </center></div>
  1179.  
  1180. <!-- ASK POPUP -->
  1181.  
  1182. <div id="022" class="popup_block">
  1183.  
  1184. <Center><iframe frameborder="0" scrolling="yes" width="100%" height="190" src="http://www.tumblr.com/submit_form/{Name}.tumblr.com" style="background-color:transparent; overflow:hidden;" id="ask_form"></iframe>
  1185. </center>
  1186.  
  1187. <!-- CORNER/SIDE IMAGE -->
  1188.  
  1189. <div id="sideb"><div style="
  1190. position:fixed;
  1191. bottom:0px;
  1192. right:0px;
  1193. width:px;">
  1194.  
  1195. <img width={text:side image width} src= "{image:side image}" /> <br></div></div>
  1196.  
  1197. </div>
  1198.  
  1199. </div></div></div></div></div></div></div></div></div></div></div>
  1200.  
  1201.  
  1202.  
  1203. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement