Advertisement
teenageblog

Winter Wonderland Theme (v. 2)

Nov 30th, 2013
528
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 26.59 KB | None | 0 0
  1.  
  2. <!-----------------------------------------
  3. ╭━━━┳╮╱╱╱╱╱╱╱╱╱╱╭╮╱╭━━━━┳╮
  4. ┃╭━╮┃┃╱╱╱╱╱╱╱╱╱╱┃┃╱┃╭╮╭╮┃┃
  5. ┃┃╱╰┫╰━┳━━┳━╮╭━━┫┃╱╰╯┃┃╰┫╰━┳━━┳╮╭┳━━┳━━╮
  6. ┃┃╱╭┫╭╮┃╭╮┃╭╮┫┃━┫┃╱╱╱┃┃╱┃╭╮┃┃━┫╰╯┃┃━┫━━┫
  7. ┃╰━╯┃┃┃┃╭╮┃┃┃┃┃━┫╰╮╱╱┃┃╱┃┃┃┃┃━┫┃┃┃┃━╋━━┃
  8. ╰━━━┻╯╰┻╯╰┻╯╰┻━━┻━╯╱╱╰╯╱╰╯╰┻━━┻┻┻┻━━┻━━╯
  9.  
  10. Please keep credit (✿◠‿◠)
  11. ----------------------------------------------->
  12.  
  13. <html lang="en">
  14. <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  15. <html xmlns="http://www.w3.org/1999/xhtml">
  16. <script type="text/javascript"
  17. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  18.  
  19. <head>
  20. <!-- DEFAULT VARIABLES -->
  21. <title>{Title}</title>
  22. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  23. <meta name="color:Background" content="#fff"/>
  24. <meta name="color:Text" content="#000"/>
  25. <meta name="color:Title" content="#000"/>
  26. <meta name="color:Link" content="#999"/>
  27. <meta name="color:Hover" content="#000"/>
  28. <meta name="color:Scrollbar" content="#ccc"/>
  29. <meta name="color:Blogtitle" content="#ccc"/>
  30. <meta name="color:Permalink Bg" content="#aaa"/>
  31.  
  32. <meta name="image:Sidebar icon" content=""/>
  33. <meta name="image:Sidebar" content=""/>
  34. <meta name="image:Background" content="0"/>
  35. <meta name="image:Post Border" content="http://static.tumblr.com/5uvtpxx/txdmplak0/vintage__1_.gif"/>
  36.  
  37. <meta name="text:description 2" content=""/>
  38. <meta name="text:Blogtitle 2" content="Walking in a " />
  39. <meta name="text:Link One Title" content="link 1" />
  40. <meta name="text:Link One" content="" />
  41. <meta name="text:Link Two Title" content="link 2" />
  42. <meta name="text:Link Two" content="" />
  43. <meta name="text:Link Three Title" content="link 3" />
  44. <meta name="text:Link Three" content="" />
  45. <meta name="text:Link Four Title" content="link 4" />
  46. <meta name="text:Link Four" content="" />
  47.  
  48.  
  49. <link href='http://static.tumblr.com/blpgwiz/u8Qmijy1c/fade_in_up.css' rel='stylesheet' type='text/css'>
  50. <script src="http://static.tumblr.com/rzl30kg/eAxm7a751/jquery.style-my-tooltips.js"></script>
  51. <script>
  52. (function($){
  53. $(document).ready(function(){
  54. $("[title]").style_my_tooltips({
  55. tip_follows_cursor:true,
  56. tip_delay_time:200,
  57. tip_fade_speed:300
  58. }
  59. );
  60. });
  61. })(jQuery);
  62. </script>
  63.  
  64. <style type="text/css">
  65. #s-m-t-tooltip{
  66. max-width:300px;
  67. margin:15px;
  68. padding:2px 8px;
  69. border:1px solid #DDD;
  70. border-radius:4px;
  71. background:#FFF;
  72. color:#AAA;
  73. z-index:999999;
  74. font-size:10px;
  75. font-style:italic;
  76. text-transform:lowercase;
  77. letter-spacing:1px;
  78. box-shadow:1px 1px 3px rgba(0,0,0,.1);}
  79.  
  80. ::-webkit-scrollbar {width: 8px; height: 4px; background: {color:background}; border-left: 1px solid #eee; }
  81.  
  82. ::-webkit-scrollbar-thumb { background-color:{color:scrollbar}; border-bottom: 1px solid #eee; border-top: 1px solid #eee; border-left: 1px solid
  83. #eee; border-right: 1px solid #eee; }
  84.  
  85. iframe#tumblr_controls {right:3px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.2;-webkit-transition: all 0.8s ease-out;-moz-transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  86.  
  87. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: 1;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  88.  
  89.  
  90.  
  91. .wrapper{
  92. margin: 0px auto;
  93. margin-left: 60px;
  94. width: 1045px;
  95. }
  96.  
  97. .header{
  98. float: left;
  99. width: 100%;
  100. }
  101.  
  102. .left{
  103. float: left;
  104. margin-right: 20px;
  105. width:1045;
  106. }
  107.  
  108. .right{
  109. float: right;
  110. width: 200px;
  111. background-color: #fff;
  112. }
  113.  
  114.  
  115. body {
  116. margin:0px;
  117. background-color: {color:Background};
  118. background-image:url({image:Background});
  119. background-attachment: fixed;
  120. background-repeat: repeat;}
  121. body, div, p, textarea, submit, input{
  122. font-family: 'Ubuntu', sans-serif;
  123. font-size: 11px;
  124. line-height:14px;
  125. letter-spacing:1px;
  126. color:{color:Text};
  127. }
  128.  
  129.  
  130.  
  131. p {
  132. margin:0px;
  133. margin-top:0px;
  134. }
  135.  
  136. a:link, a:active, a:visited{
  137. text-decoration: none;
  138. -webkit-transition: color 0.3s ease-out;
  139. -moz-transition: color 0.3s ease-out;
  140. transition: color 0.3s ease-out;
  141. color: {color:Link};
  142. }
  143.  
  144. a:hover {
  145. : -webkit-transition-duration: 1.0s;
  146. color:{color:Hover};
  147. }
  148.  
  149.  
  150.  
  151.  
  152. div#center{
  153. margin:auto;
  154. margin-top:0px;
  155. position:relative;
  156. width:1000px;
  157. background-color:;
  158. overflow:auto;
  159. overflow-y:hidden;
  160. }
  161. .side1{
  162. position:fixed;
  163. margin-left:80px;
  164. top: 385px;
  165. background: #ccc;
  166. height:120px;
  167. opacity:0.8;
  168. width:5px;
  169.  
  170.  
  171. }
  172. #img1{
  173. position:fixed !important;
  174. opacity: 1;
  175. width: 130px;
  176. z-index:9999999;
  177. padding:2px;
  178. height: 130px;
  179. margin-top: 450px;
  180. margin-left:40px;
  181. -webkit-border-radius: 220px;
  182. -moz-border-radius: 220px;
  183. border-radius: 220px;
  184. -webkit-transform: rotate(0deg);
  185. -moz-transform: rotate(0deg);
  186. font-size: 8px;
  187. letter-spacing: 0px;
  188. -webkit-animation:bounceIn 2s;
  189. -moz-animation:bounceIn 2s;
  190. -ms-animation:bounceIn 2s;
  191.  
  192.  
  193.  
  194. }
  195.  
  196. .side2{
  197. position:fixed;
  198. margin-left:165px;
  199. top: 350px;
  200. background: #ccc;
  201. height:210px;
  202. opacity:0.8;
  203. width:5px;
  204. }
  205. #img2{
  206. position:fixed !important;
  207. opacity: 1;
  208. width: 130px;
  209. z-index:9999999;
  210. padding:2px;
  211. height: 130px;
  212. margin-top: 495px;
  213. margin-left:114px;
  214. -webkit-border-radius: 220px;
  215. -moz-border-radius: 220px;
  216. border-radius: 220px;
  217. -webkit-transform: rotate(0deg);
  218. -moz-transform: rotate(0deg);
  219. font-size: 8px;
  220. letter-spacing: 0px;
  221. -webkit-animation:bounceIn 2s;
  222. -moz-animation:bounceIn 2s;
  223. -ms-animation:bounceIn 2s;
  224. }
  225. .side3{
  226. position:fixed;
  227. margin-left:250px;
  228. top: 350px;
  229. background: #ccc;
  230. height:170px;
  231. opacity:0.8;
  232. width:5px;
  233. }
  234. #img3{
  235. position:fixed !important;
  236. opacity: 1;
  237. width: 130px;
  238. padding:2px;
  239. z-index:99999999999;
  240. height: 130px;
  241. margin-left:210px;
  242. margin-top: 465px;
  243. -webkit-border-radius: 220px;
  244. -moz-border-radius: 220px;
  245. border-radius: 220px;
  246. -webkit-transform: rotate(0deg);
  247. -moz-transform: rotate(0deg);
  248. font-size: 8px;
  249. letter-spacing: 0px;
  250. transition: all 0.7s ease;
  251. -webkit-animation:bounceIn 2s;
  252. -moz-animation:bounceIn 2s;
  253. -ms-animation:bounceIn 2s;}
  254. .side4{
  255. position:fixed;
  256. margin-left:325px;
  257. top:360px;
  258. background:#ccc;
  259. height:220px;
  260. opacity:0.8;
  261. width:5px;
  262. }
  263. #img4{
  264. position:fixed !important;
  265. opacity: 1;
  266. width: 130px;
  267. padding:2px;
  268. height: 130px;
  269. z-index:999999999;
  270. margin-top: 510px;
  271. margin-left:277px;
  272. -webkit-border-radius: 220px;
  273. -moz-border-radius: 220px;
  274. border-radius: 220px;
  275. -webkit-transform: rotate(0deg);
  276. -moz-transform: rotate(0deg);
  277. font-size: 8px;
  278. letter-spacing: 0px;
  279. -webkit-animation:bounceIn 2s;
  280. -moz-animation:bounceIn 2s;
  281. -ms-animation:bounceIn 2s;
  282. }
  283.  
  284.  
  285. #leftstripe{
  286. background-image: url({image:Post Border});
  287. position:fixed;
  288. top:0px;
  289. left:400px;
  290. width:40px;
  291. height:100%}
  292.  
  293. #rightstripe{
  294. background-image: url({image:Post Border});
  295. position:fixed;
  296. top:0px;
  297. left:844px;
  298. width:40px;
  299. height:100%}
  300.  
  301.  
  302.  
  303.  
  304.  
  305.  
  306.  
  307.  
  308.  
  309. #border {
  310. position:fixed !important;
  311. width:400px;
  312. opacity:1;
  313. padding:0px;
  314. font-family: arma;
  315. height:100%;
  316. background-color:transparent;
  317. margin-left:-20px;
  318. margin-top:-10px;
  319. background-image:url();
  320. z-index: 9;
  321. }
  322.  
  323. #icon {
  324. position:fixed !important;
  325. width:75px;
  326. opacity:0.0;
  327. padding:3px;
  328. height:auto;
  329. background-color:#fff;
  330. margin-left:45px;
  331. margin-top:45px;
  332. z-index: 9999;
  333. box-shadow: 0px 0px 2px #aaa;
  334. transition: all 0.9s ease-out;
  335. -o-transition-transition: all 0.9s ease-out;
  336. -webkit-transition: all 0.9s ease-out;
  337. -moz-
  338. }
  339. #border:hover #icon{
  340. opacity:0.9;
  341. transition: all 0.9s ease-out;
  342. -o-transition-transition: all 0.9s ease-out;
  343. -webkit-transition: all 0.9s ease-out;
  344. -moz-}
  345.  
  346. #iconbg {
  347. position:fixed !important;
  348. width:260px;
  349. opacity:0.0;
  350. padding:3px;
  351. font-family: arma;
  352. height:255px;
  353. background-color:#fff;
  354. margin-top:15px;
  355. margin-left:15px;
  356. z-index: 999;
  357. box-shadow: 0px 0px 20px #ddd;
  358. -o-transition-transition: all 0.9s ease-out;
  359. -webkit-transition: all 0.9s ease-out;
  360. -moz-transition: all 0.9s ease-out;
  361. }
  362. #border:hover #iconbg{
  363. position:fixed !important;
  364. opacity:0.8;
  365. margin-top:15px;
  366. margin-left:15px;
  367. -o-transition-transition: all 0.9s ease-out;
  368. -webkit-transition: all 0.9s ease-out;
  369. -moz-transition: all 0.9s ease-out;
  370. }
  371.  
  372.  
  373. .description2{
  374. opacity:0.0;
  375. margin-top:126px;
  376. margin-left:35px;
  377. width:200px;
  378. padding-top:5px;
  379. padding-left:7px;
  380. padding-right:7px;
  381. padding-bottom:7px;
  382. height:auto;
  383. float:left;
  384. font-family:"Courier New", Courier, monospace;
  385. font-size:9px;
  386. letter-spacing:1px;
  387. text-align:justify;
  388. font-style:italic;
  389. line-height:12px;
  390. word-wrap:break-word;
  391. text-transform:none;
  392. background-color:transparent;
  393. color:black;
  394. z-index:99999;
  395. position:fixed;
  396. -webkit-transition: all 0.9s ease-in-out;
  397. -moz-transition: all 0.9s ease-in-out;
  398. -o-transition: all 0.9s ease-in-out;}
  399. #border:hover .description2{
  400. opacity:0.65;
  401. transition: all 0.9s ease-out;
  402. -o-transition-transition: all 0.9s ease-out;
  403. -webkit-transition: all 0.9s ease-out;
  404. -moz-}
  405.  
  406. .description{
  407. opacity:0.0;
  408. margin-top:40px;
  409. margin-left:128px;
  410. width:110px;
  411. padding-top:5px;
  412. padding-left:7px;
  413. padding-right:7px;
  414. padding-bottom:7px;
  415. height:auto;
  416. float:left;
  417. font-family:"Courier New", Courier, monospace;
  418. font-size:9px;
  419. letter-spacing:1px;
  420. text-align:justify;
  421. font-style:italic;
  422. line-height:12px;
  423. word-wrap:break-word;
  424. text-transform:none;
  425. background-color:transparent;
  426. color:black;
  427. z-index:99999;
  428. position:fixed;
  429. -webkit-transition: all 0.9s ease-in-out;
  430. -moz-transition: all 0.9s ease-in-out;
  431. -o-transition: all 0.9s ease-in-out;}
  432.  
  433. #border:hover .description{
  434. opacity:0.65;
  435. transition: all 0.9s ease-out;
  436. -o-transition-transition: all 0.9s ease-out;
  437. -webkit-transition: all 0.9s ease-out;
  438. -moz-}
  439.  
  440.  
  441. #sidebar {
  442. position:fixed !important;
  443. width:auto;
  444. opacity:1;
  445. padding:3px;
  446. font-family: arma;
  447. height:auto;
  448. background-color:#fff;
  449. margin-left:70px;
  450. border:1px solid #fafafa;
  451. margin-top:100px;
  452. background-image:url();
  453. z-index: 99;
  454. box-shadow: 0px 0px 4px #ddd;
  455. }
  456.  
  457.  
  458. #sidebarpic img{
  459. width:300px;
  460. height:290px;
  461. opacity:1;
  462. transition: all 0.9s ease-out;
  463. -o-transition-transition: all 0.9s ease-out;
  464. -webkit-transition: all 0.9s ease-out;
  465. -moz-transition: all 0.9s ease-out;
  466. }
  467.  
  468. #border:hover #sidebarpic img{
  469. -webkit-filter:blur(4px);
  470. transition: all 0.5s ease-out;
  471. -o-transition-transition: all 0.5s ease-out;
  472. -webkit-transition: all 0.5s ease-out;
  473. -moz-}
  474.  
  475. @font-face{font-family:Hasteristico; src: url(http://slutpark-resources.webs.com/Hasteristico.ttf);}
  476. div#blogtitle{
  477. z-index: 9999999;
  478. opacity:1;
  479. background-color:transparent;
  480. color:{color:blogtitle};
  481. text-shadow: 0px 0px 8px #aaa;
  482. position:fixed !important;
  483. font-size:36px;
  484. text-transform:uppercase;
  485. font-family:hasteristico;
  486. letter-spacing:0px;
  487. line-height: 50px;
  488. width:auto;
  489. padding-top:3px;
  490. padding-bottom:10px;
  491. margin:-60px 0px 0px 8px;
  492. -webkit-transform: rotate(0deg);
  493. -moz-transform: rotate(0deg);
  494. -webkit-animation: fadeInUp 2s;
  495. -moz-animation: fadeInUp 2s;
  496. -ms-animation: fadeInUp 2s;
  497. }
  498. @font-face { font-family: "dreams"; src: url('http://static.tumblr.com/4yxykdm/xXTlrecqr/caviardreams.ttf'); }
  499.  
  500. @font-face { font-family: "lovenote"; src: url('http://static.tumblr.com/4yxykdm/k6plrfhwf/ck_love_note.ttf'); }
  501. div#blogtitle1{
  502. z-index: 9999999;
  503. opacity:0;
  504. color:{color:blogtitle};
  505. text-shadow: 0px 0px 8px #aaa;
  506. position:fixed !important;
  507. font-size:45px;
  508. text-transform:none;
  509. font-family: lovenote;
  510. letter-spacing:0px;
  511. line-height: 50px;
  512. width:auto;
  513. padding-top:3px;
  514. padding-bottom:10px;
  515. margin:-90px 0px 0px -25px;
  516. -webkit-transform: rotate(0deg);
  517. -moz-transform: rotate(0deg);transition: all 0.4s ease-out;
  518. -o-transition-transition: all 0.4s ease-out;
  519. -webkit-transition: all 0.4s ease-out;}
  520. #border:hover #blogtitle1{
  521. opacity:1;
  522. margin:-100px 0px 0px -25px;
  523. transition: all 0.9s ease-out;
  524. -o-transition-transition: all 0.9s ease-out;
  525. -webkit-transition: all 0.9s ease-out;
  526. -moz-}
  527.  
  528. @font-face{font-family:Jane;src:url(http://static.tumblr.com/9wzbixa/ncHmj2mmb/janeaust.ttf);}
  529.  
  530.  
  531.  
  532. .entry {
  533. float:left;
  534. display: block;
  535. overflow:hidden;
  536. width:380px;
  537. border: 4px double #eee;
  538. margin:3px;
  539. background-color: white;
  540. padding:4px;
  541. padding-bottom:4px;
  542. transition: all 0.5s ease-out;
  543. -o-transition-transition: all 0.5s ease-out;
  544. -webkit-transition: all 0.5s ease-out;
  545. -moz-transition: all 0.5s ease-out;
  546. {block:PermalinkPage}
  547. width:420px;
  548. margin-left:0px;
  549. text-align:center;
  550. {/block:PermalinkPage}
  551. }
  552. .entry .perma{
  553. width:40px;
  554. height: 40px;
  555. font-family: calibri;
  556. text-transform:;
  557. position: absolute;
  558. font-size: 11px;
  559. line-height: 20px;
  560. text-align: center;
  561. overflow:hidden;
  562. background-color:{color:permalink bg};
  563. letter-spacing:0px;
  564. margin-top:-15px;
  565. margin-left: 7px;
  566. border-radius:90px;
  567. padding:5px;
  568. color:white;
  569. font-style:italic;
  570. border: 3px solid #fff;
  571. -webkit-transition: opacity 0.4s linear; opacity: 0.0;
  572. -webkit-transition: all 0.4s linear;
  573. -moz-transition: all 0.4s linear;
  574. transition: all 0.4s linear;
  575.  
  576. }
  577.  
  578. .entry:hover .perma{
  579. overflow:visible;
  580. opacity:0.95;
  581. margin-top:10px;
  582. -ms-transform: rotate(360deg);
  583. -webkit-transform: rotate(360deg);
  584. -o-transform: rotate(360deg);
  585. -moz-transform: rotate(360deg);
  586. }
  587.  
  588.  
  589. @font-face {font-family: kk; src: url('http://static.tumblr.com/loouiuu/Ttaloide6/halohandletter.ttf');}
  590.  
  591.  
  592. #audio {width:250px; height:auto; min-height:60px; padding-bottom:0px;}
  593. .cover {position:absolute; z-index:1; width:60px; height:60px;}
  594. .cover img {float:left; width:60px; height:60px;}
  595. .playbox {opacity:0.6; width:27px; height:30px; overflow:hidden; position:absolute; z-index:1000; margin-left:17px; margin-top:17px; text-align:center;}
  596. .info {margin-left:73px; margin-top:4px; line-height:14px;}
  597.  
  598. .title{
  599. font-family: "kk";
  600. font-size: 24px;
  601. line-height: 25px;
  602. color: {color:link};
  603. letter-spacing: 1px;
  604. font-weight: normal;
  605. }
  606.  
  607.  
  608. .cred {
  609. color: #000;
  610. font-family: Calibri;
  611. font-size:14px;
  612. z-index: 99999999999999px;
  613. line-height:14px;
  614. background:#fff;
  615. border: 1px #eee solid;
  616. background-repeat:repeat;
  617. padding:2px;
  618. -webkit-border-radius:2px;
  619. moz-border-radius:2px;
  620. -o-border-radius:2px;
  621. border-radius:2px;
  622. }
  623.  
  624. .cred a { color: #000; }
  625.  
  626. .permalinktext {
  627. display: block;
  628. padding: 1px;
  629. margin: 0px 0px 0px 8px;
  630. font-family: calibri;
  631. letter-spacing: 0px;
  632. font-size: 10px;
  633. color: #424242;
  634. line-height: 11px;
  635. text-align: right;
  636. text-decoration: none;
  637. -webkit-transition: color 0.5s ease-out;
  638. -moz-transition: color 0.5s ease-out;
  639. border-top: 1px solid #dcdcdc;
  640. }
  641. .bubble {align:right;background:#eee; margin:7px 0px 5px 66px;padding:10px;position: relative;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;}
  642. .bubble p {margin:1px 0px;}
  643. .bubble span {display:block;position:absolute;width:1px;height:1px;font-size: 12;line-height: 14px;left:-10px;top:10px;border-top:7px solid transparent;border-bottom:7px solid transparent;border-right:10px solid #eee;}
  644. .askborder {float: left;margin: 1px 4px 1 0;padding: 3px; background: #eee;}
  645.  
  646. #posts {
  647. width:400px;
  648. margin-top: 5px;
  649. margin-left: 381px;
  650. margin-right: auto;
  651. position:relative;
  652. overflow-y: hidden;
  653. }
  654.  
  655.  
  656. #infscr-loading{
  657. bottom: -70px;
  658. position: absolute;
  659. left: 50%;
  660. margin-left:-8px;
  661. width:16px;
  662. height:11px;
  663. overflow:hidden;
  664. margin-bottom: 50px;
  665. }
  666.  
  667. #postnotes{
  668. text-align: justify;
  669. }
  670.  
  671. #postnotes blockquote{
  672. border: 0px;
  673. }
  674.  
  675. blockquote{
  676. padding:0px 0px 2px 5px;
  677. margin:0px 0px 2px 1px;
  678. border-left: 1px dotted {color:Text};
  679. }
  680.  
  681. blockquote p, ul{
  682. margin:0px;
  683. padding:0px;
  684. }
  685.  
  686. a img{border: 0px;}
  687. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  688. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  689. .user_7 .label, .user_8 .label, .user_9 .label {color:{color:Title};}
  690. .notes img{width:10px; position:relative; top:3px;
  691. }
  692.  
  693. small{font-size: 90%;}
  694.  
  695. .video embed, .post div.video object {width:260px !important; height:180px !important;}
  696. .video2 embed, .post div.video object {width:400px !important; height:400px !important;}
  697.  
  698. @-webkit-keyframes bounceIn {
  699. 0% {
  700. opacity: 0;
  701. -webkit-transform: scale(.3);
  702. }
  703. 50% {
  704. opacity: 1;
  705. -webkit-transform: scale(1.05);
  706. }
  707. 70% {
  708. -webkit-transform: scale(.9);
  709. }
  710. 100% {
  711. -webkit-transform: scale(1);
  712. }
  713. }
  714. @-moz-keyframes bounceIn {
  715. 0% {
  716. opacity: 0;
  717. -moz-transform: scale(.3);
  718. }
  719. 50% {
  720. opacity: 1;
  721. -moz-transform: scale(1.05);
  722. }
  723. 70% {
  724. -moz-transform: scale(.9);
  725. }
  726. 100% {
  727. -moz-transform: scale(1);
  728. }
  729. }
  730. @-ms-keyframes bounceIn {
  731. 0% {
  732. opacity: 0;
  733. -ms-transform: scale(.3);
  734. }
  735. 50% {
  736. opacity: 1;
  737. -ms-transform: scale(1.05);
  738. }
  739. 70% {
  740. -ms-transform: scale(.9);
  741. }
  742. 100% {
  743. -ms-transform: scale(1);
  744. }
  745. }
  746. @-o-keyframes bounceIn {
  747. 0% {
  748. opacity: 0;
  749. -o-transform: scale(.3);
  750. }
  751. 50% {
  752. opacity: 1;
  753. -o-transform: scale(1.05);
  754. }
  755. 70% {
  756. -o-transform: scale(.9);
  757. }
  758. 100% {
  759. -o-transform: scale(1);
  760. }
  761. }
  762. @keyframes bounceIn {
  763. 0% {
  764. opacity: 0;
  765. transform: scale(.3);
  766. }
  767. 50% {
  768. opacity: 1;
  769. transform: scale(1.05);
  770. }
  771. 70% {
  772. transform: scale(.9);
  773. }
  774. 100% {
  775. transform: scale(1);
  776. }
  777. }
  778. .bounceIn {
  779. -webkit-animation-name: bounceIn;
  780. -moz-animation-name: bounceIn;
  781. -ms-animation-name: bounceIn;
  782. -o-animation-name: bounceIn;
  783. animation-name: bounceIn;
  784. }
  785.  
  786. }
  787.  
  788.  
  789. {CustomCSS}
  790.  
  791. </style>
  792.  
  793. {block:IndexPage}
  794.  
  795. <script type='text/javascript' src='http://static.tumblr.com/m52lhg5/u9amoiddc/infinite.js'></script>
  796. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  797. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  798.  
  799. <script type="text/javascript">
  800. $(window).load(function () {
  801. var $content = $('#posts');
  802. $content.masonry({itemSelector: '.entry'}),
  803. $content.infinitescroll({
  804. navSelector : 'div#pagination',
  805. nextSelector : 'div#pagination a#nextPage',
  806. itemSelector : '.entry',
  807. loading: {
  808. finishedMsg: '',
  809. img: 'http://static.tumblr.com/dbek3sy/pX1lrx8xv/ajax-loader.gif'
  810. },
  811. bufferPx : 600,
  812. debug : false,
  813. },
  814. // call masonry as a callback.
  815. function( newElements ) {
  816. var $newElems = $( newElements );
  817. $newElems.hide();
  818. // ensure that images load before adding to masonry layout
  819. $newElems.imagesLoaded(function(){
  820. $content.masonry( 'appended', $newElems, true, function(){$newElems.fadeIn(300);} );
  821.  
  822.  
  823. });
  824. });
  825. });
  826. </script>
  827. {/block:IndexPage}
  828.  
  829.  
  830. <title>{Title}</title>
  831. <link rel="shortcut icon" href="{favicon}">
  832. <meta name="viewport" content="width=720" />
  833. <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}" />
  834. </head>
  835.  
  836. <body>
  837. <div id="leftstripe"></div>
  838. <div id="rightstripe"></div>
  839.  
  840. <div class="side1"></div>
  841. <div class="side2"></div>
  842. <div class="side3"></div>
  843. <div class="side4"></div>
  844.  
  845.  
  846.  
  847. <div id="border"><div id="sidebar">
  848. <div id="iconbg"></div>
  849. <div class="description">{description}</div>
  850. <div class="description2">{text:description 2}
  851. </div>
  852. <div id="icon">
  853. <img src="{image:sidebar icon}" style=" padding:0;background-color:white;border: 0px solid #000;border-bottom:0px solid white;opacity:0.95;" width=75px; height=auto;class="sideimg"></div>
  854.  
  855. <div id="blogtitle1">{text:blogtitle 2}</div>
  856. <div id="blogtitle"> {title}</div>
  857. <div id="sidebarpic"><a href="/"><img src="{image:sidebar}" style=" padding:0;background-color:white;border: 0px solid #000;border-bottom:0px solid white;opacity:1;" width=100px; height=auto;class="sideimg">
  858.  
  859. </div></div></div>
  860. <div id="img1"><a href="{text:Link One}" title="{text:Link One title}"><img src="http://i49.tinypic.com/359wa5i.png" border="0" width="80"></a></div>
  861.  
  862. <div id="img2"><a href="{text:Link Two}" title="{text:Link Two title}"><img src="http://i49.tinypic.com/359wa5i.png" border="0" width="105"></a></div>
  863.  
  864. <div id="img3"><a href="{text:Link Three}" title="{text:Link Three title}"><img src="http://i49.tinypic.com/359wa5i.png" border="0" width="80"></a></div>
  865.  
  866. <div id="img4"><a href="{text:Link Four}" title="{text:Link Four title}"><img src="http://i49.tinypic.com/359wa5i.png" border="0" width="95"></a></div>
  867. <div class="wrapper">
  868. <div class="header">
  869. </div>
  870.  
  871.  
  872.  
  873. <div class="left">
  874. <div id="posts">
  875. {block:Posts}
  876. <div class="entry">
  877.  
  878. {block:Answer}
  879. <div class="post"><div class="askborder">
  880. <img src="{askerportraiturl-40}" width="40px"></div><div class="bubble"><span></span>{asker} said: {Question}</div><br>
  881. {Answer}</div>
  882. <div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> <font color="#aaa">&middot</font> <a href="{ReblogURL}" target="_blank">reblog</a> </div>
  883. {/block:Answer}
  884.  
  885. {block:Text}
  886. {block:Title}<span class="title">{Title}</span>{/block:Title}
  887. <span class="entrytext">{Body}</span>
  888. <div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> <font color="#aaa">&middot</font> <a href="{ReblogURL}" target="_blank">reblog</a> </div>
  889. {/block:Text}
  890.  
  891. {block:Link}
  892. <center><a href="{URL}"><span class="title">{Name}</span></a></center>
  893. <div style="margin-left:3px;">{block:Description}{Description}{/block:Description}</div>
  894. {block:IndexPage}<div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> <font color="#aaa">&middot</font> <a href="{ReblogURL}" target="_blank">reblog</a> </div>
  895. {/block:IndexPage}
  896. {block:Link}
  897.  
  898. {block:Photo}{block:IndexPage}
  899.  
  900.  
  901. <center>
  902. <div class="perma">
  903. <a href="{permalink}"><font color="white">{NoteCount}</font></a> <br><a href="{ReblogURL}" target="_blank"><font color="white">Reblog</font></span></a> </div>
  904. </a></a></a></a></a></a>
  905.  
  906. {/block:IndexPage}
  907. {block:IndexPage}
  908. <a href="{Permalink}"><img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width=380px/></a>
  909. {/block:IndexPage}
  910. {block:permalinkpage}{LinkOpenTag}
  911. <img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width=420px/>{LinkCloseTag}
  912. {/block:permalinkpage}
  913. {/block:Photo}
  914.  
  915.  
  916. {block:Photoset}
  917. {block:IndexPage}<center>
  918. <div class="perma">
  919. <a href="{permalink}"><font color="white">{NoteCount}</font></a> <br><a href="{ReblogURL}" target="_blank"><font color="white">Reblog</font></span></a> </div>
  920. </a></a></a></a></a></a>
  921. </center>{/block:IndexPage}
  922. {block:IndexPage}
  923. {block:Photos}<a href="{Permalink}"><img src="{PhotoURL-500}" width="250" style="padding:3px;"/></a>
  924. {/block:Photos}
  925. {/block:permalinkpage}
  926. {/block:IndexPage}
  927.  
  928. {block:permalinkpage}
  929. {Photoset-500}
  930. {/block:permalinkpage}
  931. {/block:Photoset}
  932.  
  933.  
  934.  
  935. {block:Quote}<span class="title">"{Quote}"</span> — {block:Source}<b>{Source}</b>{/block:Source}<br>
  936. <div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> <font color="#aaa">&middot</font> <a href="{ReblogURL}" target="_blank">reblog</a> </div>
  937. {/block:Quote}
  938.  
  939. {block:Chat}{block:Title}<span class="title">{Title}</span>{/block:Title}
  940. <ul class="chat">
  941. {block:Lines}
  942. <li class="user_{UserNumber}">
  943. {block:Label}
  944. <span class="label">{Label}</span>
  945. {/block:Label}
  946.  
  947. {Line}
  948. </li>
  949. {/block:Lines}
  950. <div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> <font color="#aaa">&middot</font> <a href="{ReblogURL}" target="_blank">reblog</a> </div>
  951. {/block:Chat}
  952.  
  953. {block:Audio}
  954. <div id="audio"><div class="cover"><img src="http://static.tumblr.com/k9utpfa/tcom8wpif/default_cover_m.jpg"></div>{block:AlbumArt}<div class="cover"><img src="{AlbumArtURL}"></div>{/block:AlbumArt}<div class="playbox">{block:AudioPlayer}{AudioPlayerWhite}{/block:AudioPlayer}</div><div class="info"><b>Artist:</b> <span{block:Artist} style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}<br><b>Title:</b> <span{block:TrackName} style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}<br><b>Album:</b> <span{block:Album} style="display:none;"{/block:Album}>Unknown</span>{block:Album}{Album}{/block:Album}{block:PlayCount}<br><b>Plays:</b> {FormattedPlayCount}{/block:PlayCount}</div></div>
  955. {block:IndexPage}
  956. <div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> <font color="#aaa">&middot</font> <a href="{ReblogURL}" target="_blank">reblog</a> </div>
  957. {/block:IndexPage}
  958. {/block:Audio}
  959.  
  960. {block:Video}
  961. {block:IndexPage}
  962. <center>
  963. <div class="permalinktext"> <a href="{permalink}">{NoteCountwithlabel}</a> <font color="#aaa">&middot</font> <a href="{ReblogURL}" target="_blank">reblog</a> </div>
  964. {Video-250}</center>
  965. {/block:IndexPage}
  966. {block:PermalinkPage}
  967. <center>
  968. {Video-400}</center>
  969. {/block:PermalinkPage}
  970. {block:Video}
  971.  
  972. {block:PostNotes}<div align="middle">{caption}</div>
  973. <center>
  974.  
  975. {block:NoteCount}{NoteCountWithLabel}<br>{/block:NoteCount}
  976.  
  977. {block:HasTags}
  978. tags: {block:Tags}<a href="{TagURL}">{Tag}. </a>{/block:Tags}<br> {/block:HasTags}
  979. {block:RebloggedFrom}
  980. reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  981. posted by <a href="{ReblogRootURL}">{ReblogRootName}</a>
  982.  
  983. {/block:RebloggedFrom}
  984. </center></span>
  985. <br>
  986. <div id="postnotes">{PostNotes}</div><br>
  987.  
  988. <center>{block:ContentSource}
  989. <br><a href="{SourceURL}">
  990. {lang:Source}:
  991. {block:SourceLogo}
  992. <img src="{BlackLogoURL}" width="{LogoWidth}"
  993. height="{LogoHeight}" alt="{SourceTitle}" />
  994. {/block:SourceLogo}
  995. {block:NoSourceLogo}
  996. {SourceLink}
  997. {/block:NoSourceLogo}
  998. </a>
  999. {/block:ContentSource}</center>
  1000.  
  1001. {/block:PostNotes}
  1002. </div>
  1003. {/block:Posts}
  1004. </div></div>
  1005.  
  1006. {block:IndexPage}
  1007. {block:Pagination}
  1008. <div id="pagination">
  1009. {block:NextPage}
  1010. <a id="nextPage" href="{NextPage}"></a>
  1011. {/block:NextPage}
  1012. {block:PreviousPage}
  1013. <a href="{PreviousPage}"></a>
  1014. {/block:PreviousPage}
  1015. </div>
  1016. {/block:Pagination}
  1017. {/block:IndexPage}
  1018.  
  1019.  
  1020. <div style="position: fixed; right:6px;bottom:10px;">
  1021. <span class="cred">
  1022. <a href="http://teenageblog.tumblr.com/" target="_blank">
  1023. </a></span></div>
  1024. </body>
  1025. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement