Advertisement
thematchgirl

Theme 19 w Slider

May 30th, 2014
203
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 33.62 KB | None | 0 0
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <title>{title}</title>
  5. <link rel="shortcut icon" href="{Favicon}">
  6. <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'>
  7. </head>
  8. <link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:700,300,300italic' rel='stylesheet' type='text/css'>
  9. <link rel="shortcut icon" type="image/png" href="images/icon1.png">
  10. <script type="text/javascript" src="http://static.tumblr.com/hzv1lz4/APkmx312k/jquery.min.js"></script>
  11. <script type="text/javascript" src="http://static.tumblr.com/hzv1lz4/PhVmx3141/jmpress.min.js"></script>
  12. <script src="http://static.tumblr.com/hzv1lz4/I7Nmugrrm/pace.min.js"></script>
  13. <script type="text/javascript" src="http://static.tumblr.com/hzv1lz4/KLRmx3184/jquery.jmslideshow.js"></script>
  14. <script type="text/javascript" src="http://static.tumblr.com/hzv1lz4/m2Mmx319r/modernizr.custom.js"></script>
  15.  
  16. <meta name="color:first color" content="#ff3f3d">
  17. <meta name="color:second color" content="#ffffff">
  18. <meta name="color:third color" content="#5f5f5f">
  19.  
  20. <meta name="image:content bg" content="http://i.imgur.com/lsTKGht.png">
  21. <meta name="image:footer bg" content="http://i.imgur.com/8uKoe9v.png">
  22. <meta name="image:header image" content="http://i.imgur.com/DG9lcBF.png">
  23. <meta name="image:character1" content="http://i.imgur.com/is61asx.png">
  24. <meta name="image:character2" content="http://i.imgur.com/QTPyVv1.png">
  25. <meta name="image:character3" content="http://i.imgur.com/8UDxaYd.png">
  26.  
  27. <meta name="text:Link1URL" content=""/>
  28. <meta name="text:Link2URL" content=""/>
  29. <meta name="text:Link3URL" content=""/>
  30. <meta name="text:Link4URL" content=""/>
  31. <meta name="text:Link5URL" content=""/>
  32. <meta name="text:Link6URL" content=""/>
  33. <meta name="text:Link7URL" content=""/>
  34. <meta name="text:Link8URL" content=""/>
  35. <meta name="text:Link9URL" content=""/>
  36. <meta name="text:Link10URL" content=""/>
  37. <meta name="text:Link11URL" content=""/>
  38. <meta name="text:Link12URL" content=""/>
  39. <meta name="text:Link13URL" content=""/>
  40. <meta name="text:Link14URL" content=""/>
  41. <meta name="text:Link15URL" content=""/>
  42. <meta name="text:Link1" content="Nothing"/>
  43. <meta name="text:Link2" content="Nothing"/>
  44. <meta name="text:Link3" content="Nothing"/>
  45. <meta name="text:Link4" content="Nothing"/>
  46. <meta name="text:Link5" content="Nothing"/>
  47. <meta name="text:Link6" content="Nothing"/>
  48. <meta name="text:Link7" content="Nothing"/>
  49. <meta name="text:Link8" content="Nothing"/>
  50. <meta name="text:Link9" content="Nothing"/>
  51. <meta name="text:Link10" content="Nothing"/>
  52. <meta name="text:Link11" content="Nothing"/>
  53. <meta name="text:Link12" content="Nothing"/>
  54. <meta name="text:Link13" content="Nothing"/>
  55. <meta name="text:Link14" content="Nothing"/>
  56. <meta name="text:Link15" content="Nothing"/>
  57. <meta name="text:Facebook" content=""/>
  58. <meta name="text:Twitter" content=""/>
  59. <meta name="text:Email" content=""/>
  60. <meta name="text:Character 1" content="Character 1"/>
  61. <meta name="text:Character 2" content="Character 2"/>
  62. <meta name="text:Character 3" content="Character 3"/>
  63. <meta name="text:Username" content="Your Username"/>
  64. <meta name="text:Second Desc" content="">
  65. <meta name="text:Second Desc Title" content="">
  66.  
  67.  
  68.  
  69. <script>
  70. (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  71. (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  72. m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  73. })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
  74. ga('create', 'UA-44755840-1', 'hellolittlered.org');
  75. ga('send', 'pageview');
  76. </script>
  77.  
  78. <noscript>
  79. <style>
  80. .step {
  81. width: 100%;
  82. position: relative;
  83. }
  84. .step:not(.active) {
  85. opacity: 1;
  86. filter: alpha(opacity=99);
  87. -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=99)";
  88. }
  89. .step:not(.active) a.jms-link{
  90. opacity: 1;
  91. margin-top: 40px;
  92. }
  93. </style>
  94. </noscript>
  95. <style>
  96. @font-face {
  97. color:{color:second color};
  98. font-family:ElegantIcons;
  99. font-style:normal;
  100. font-weight:400;
  101. src:url(fonts/ElegantIcons.eot?#iefix) format(embedded-opentype), url(http://static.tumblr.com/hzv1lz4/2MQmx31dk/eleganticons.woff) format(woff), url(http://static.tumblr.com/hzv1lz4/dB8mx31bk/eleganticons.ttf) format(truetype), url(http://static.tumblr.com/hzv1lz4/srNmx31eg/eleganticons.svg#ElegantIcons) format(svg);
  102. }
  103.  
  104. ::-webkit-scrollbar-thumb:vertical {
  105. background-color:{color:second color};
  106. border:2px solid {color:first color};
  107. height:12px;
  108. }
  109.  
  110. ::-webkit-scrollbar-thumb:horizontal {
  111. background-color:{color:first color};
  112. }
  113.  
  114. ::-webkit-scrollbar {
  115. background-color:{color:second color};
  116. border:5px solid {color:first color};
  117. height:7px;
  118. width:11px;
  119. }
  120.  
  121. body {
  122. background:{color:first color};
  123. color:{color:third color};
  124. font-family:Quicksand;
  125. font-size:16px;
  126. overflow-x:hidden;
  127. text-align:justify;
  128. text-shadow:1px 1px 1px rgba(0,0,0,0.1);
  129. margin:0px;
  130. padding:0px;
  131. }
  132.  
  133. #link {
  134. display:block;
  135. left:0;
  136. margin-bottom:20px;
  137. position:fixed;
  138. text-align:center;
  139. top:-50px;
  140. width:100%;
  141. -webkit-transition: all 0.5s ease-in-out;
  142. -moz-transition: all 0.5s ease-in-out;
  143. -o-transition: all 0.5s ease-in-out;
  144. transition: all 0.5s ease-in-out;
  145. }
  146.  
  147. #link a {
  148. -moz-box-shadow:0 5px 9px rgba(50,50,50,0.51);
  149. -ms-transform:rotate(7deg);
  150. -webkit-box-shadow:0 5px 9px rgba(50,50,50,0.51);
  151. -webkit-transform:rotate(7deg);
  152. background:{color:second color};
  153. box-shadow:0 5px 9px rgba(50,50,50,0.51);
  154. color:{color:first color};
  155. display:inline-block;
  156. font-family:Mensch;
  157. font-size:16px;
  158. font-weight:700;
  159. margin-right:20px;
  160. padding:70px 10px 15px;
  161. text-align:center;
  162. text-transform:uppercase;
  163. transform:rotate(7deg);
  164. width:80px;
  165. -webkit-transition: all 0.5s ease-in-out;
  166. -moz-transition: all 0.5s ease-in-out;
  167. -o-transition: all 0.5s ease-in-out;
  168. transition: all 0.5s ease-in-out;
  169. }
  170.  
  171. #link a:hover {
  172. -moz-transform:rotate(0deg);
  173. -o-transform:rotate(0deg);
  174. -webkit-transform:rotate(0deg);
  175. font-size:18px;
  176. }
  177.  
  178. a {
  179. color:{color:first color};
  180. text-decoration:none;
  181. }
  182.  
  183. b {
  184. color:{color:first color};
  185. }
  186.  
  187. #tabel td {
  188. border-left:#000;
  189. padding:10px;
  190. width:25%;
  191. }
  192.  
  193. #header {
  194. height:100%;
  195. left:0;
  196. padding:10px;
  197. position:fixed;
  198. text-align:center;
  199. top:15%;
  200. width:100%;
  201. }
  202.  
  203. #link:hover a {
  204. opacity:.7;
  205. }
  206.  
  207. #link:hover a:hover {
  208. opacity:1;
  209. }
  210.  
  211. #konten {
  212. background:url({image:content bg}) {color:second color};
  213. margin-top:800px;
  214. padding:20px;
  215. position:absolute;
  216. width:98%;
  217. }
  218.  
  219. #footer {
  220. background:url({image:footer bg}) {color:third color};
  221. color:{color:second color};
  222. height:100%;
  223. margin-bottom:-20px;
  224. margin-left:-20px;
  225. padding:20px;
  226. width:100%;
  227. }
  228.  
  229. #footer b {
  230. background:{color:second color};
  231. display:block;
  232. padding:10px;
  233. width:90%;
  234. }
  235.  
  236. #menn a {
  237. background:{color:first color};
  238. color:{color:second color};
  239. display:block;
  240. font-size:14px;
  241. marign-bottom:1px;
  242. padding:5px;
  243. width:100%;
  244. }
  245.  
  246. #menn a:hover {
  247. background:{color:second color};
  248. color:{color:first color};
  249. }
  250.  
  251. .box {
  252. background:{color:second color};
  253. border-radius:20px;
  254. display:inline-block;
  255. height:100%;
  256. margin-left:-5%;
  257. padding:10px;
  258. text-align:justify;
  259. width:100%;
  260. }
  261.  
  262. .box table {
  263. width:100%;
  264. }
  265.  
  266. .box td {
  267. color:{color:first color};
  268. font-size:15px;
  269. font-weight:700;
  270. text-align:center;
  271. text-transform:uppercase;
  272. width:25%;
  273. }
  274.  
  275. .box img {
  276. border:5px solid {color:first color};
  277. border-radius:10px 20px 0 0;
  278. width:100%;
  279. }
  280.  
  281. .box h2 {
  282. color:{color:first color};
  283. font-family:Quicksand;
  284. font-size:20px;
  285. text-align:center;
  286. }
  287.  
  288. .box img:hover {
  289. -moz-box-shadow:0 5px 9px rgba(50,50,50,0.51);
  290. -webkit-box-shadow:0 5px 9px rgba(50,50,50,0.51);
  291. box-shadow:0 5px 9px rgba(50,50,50,0.51);
  292. }
  293.  
  294. .about {
  295. margin-bottom:50px;
  296. margin-left:10%;
  297. width:80%;
  298. }
  299.  
  300. .blog {
  301. font-size:14px;
  302. margin-bottom:50px;
  303. margin-left:25%;
  304. width:50%;
  305. }
  306.  
  307. .blog h2 {
  308. background:{color:first color};
  309. color:{color:second color};
  310. display:block;
  311. font-size:30px;
  312. padding:10px;
  313. }
  314.  
  315. .blog h2:hover {
  316. background:{color:second color};
  317. color:{color:first color};
  318. }
  319.  
  320. blockquote {
  321. border-left:5px solid {color:first color};
  322. opacity:.8;
  323. padding-left:5px;
  324. min-height:35px;
  325. }
  326.  
  327. .end {
  328. background:{color:first color};
  329. color:{color:second color};
  330. font-size:12px;
  331. margin-bottom:25px;
  332. padding:10px;
  333. text-align:center;
  334. display:block;
  335. }
  336.  
  337. .end a {
  338. color:{color:second color};
  339. font-family:Quicksand;
  340. text-transform:uppercase;
  341. font-weight:700;
  342. font-size:12px;
  343. }
  344.  
  345. .end li,#footer li {
  346. list-style:none;
  347. }
  348.  
  349. .time {
  350. margin-left:-90px;
  351. margin-top:0;
  352. position:absolute;
  353. }
  354.  
  355. .date {
  356. background:{color:first color};
  357. color:{color:second color};
  358. display:block;
  359. font-size:13px;
  360. padding:5px;
  361. text-align:center;
  362. width:60px;
  363. font-weight:700;
  364. }
  365.  
  366. .mont {
  367. background:{color:second color};
  368. color:{color:first color};
  369. display:block;
  370. font-size:30px;
  371. height:50px;
  372. padding:10px;
  373. text-align:center;
  374. width:50px;
  375. }
  376.  
  377. h2 {
  378. color:{color:first color};
  379. font-family:Mensch;
  380. font-size:50px;
  381. text-align:center;
  382. margin:0px;
  383. }
  384.  
  385. #footer table {
  386. width:80%;
  387. }
  388.  
  389. #footer table td {
  390. border-left:1px solid {color:second color};
  391. padding:20px;
  392. text-align:center;
  393. vertical-align:top;
  394. }
  395.  
  396. .jms-slideshow {
  397. height:460px;
  398. margin:20px auto;
  399. max-width:1400px;
  400. min-width:640px;
  401. position:relative;
  402. width:80%;
  403. }
  404.  
  405. .jms-wrapper {
  406. -moz-background-clip:padding;
  407. -moz-transition:background-color 1s linear;
  408. -ms-transition:background-color 1s linear;
  409. -o-transition:background-color 1s linear;
  410. -webkit-background-clip:padding;
  411. -webkit-transition:background-color 1s linear;
  412. background-clip:padding-box;
  413. height:440px;
  414. min-width:600px;
  415. outline:none;
  416. transition:background-color 1s linear;
  417. width:auto;
  418. }
  419.  
  420. .step {
  421. -moz-transition:opacity 1s;
  422. -ms-transition:opacity 1s;
  423. -o-transition:opacity 1s;
  424. -webkit-transition:opacity 1s;
  425. display:block;
  426. height:420px;
  427. transition:opacity 1s;
  428. width:900px;
  429. }
  430.  
  431. .step:not(.active) {
  432. -ms-filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
  433. filter:alpha(opacity=0);
  434. opacity:0;
  435. }
  436.  
  437. .jms-content {
  438. clear:both;
  439. margin:0 370px 0 20px;
  440. position:relative;
  441. }
  442.  
  443. .jms-content a {
  444. color:{color:second color};
  445. }
  446.  
  447. .jms-content p {
  448. color:{color:second color};
  449. }
  450.  
  451. .step h3 {
  452. color:{color:second color};
  453. font-size:30px;
  454. font-weight:700;
  455. margin:0;
  456. padding:60px 0 10px;
  457. }
  458.  
  459. .step p {
  460. color:{color:second color};
  461. font-size:18px;
  462. font-weight:400;
  463. position:relative;
  464. text-align:justify;
  465. }
  466.  
  467. .step table td {
  468. height:100%;
  469. padding:10px;
  470. }
  471.  
  472. a.jms-link {
  473. background:{color:second color};
  474. border-radius:4px;
  475. box-shadow:1px 1px 1px rgba(0,0,0,0.5);
  476. clear:both;
  477. color:{color:first color};
  478. display:inline-block;
  479. font-size:16px;
  480. font-weight:700;
  481. margin-top:40px;
  482. opacity:1;
  483. padding:8px 15px;
  484. text-shadow:1px 1px 1px rgba(0,0,0,0.3);
  485. text-transform:uppercase;
  486. }
  487.  
  488. a.link {
  489. background:{color:second color};
  490. border-radius:4px;
  491. box-shadow:1px 1px 1px rgba(0,0,0,0.5);
  492. clear:both;
  493. color:{color:first color};
  494. display:block;
  495. font-size:16px;
  496. font-weight:700;
  497. margin-bottom:5px;
  498. opacity:1;
  499. padding:8px 15px;
  500. text-shadow:1px 1px 1px rgba(0,0,0,0.3);
  501. text-transform:uppercase;
  502. -webkit-transition: all 0.5s ease-in-out;
  503. -moz-transition: all 0.5s ease-in-out;
  504. -o-transition: all 0.5s ease-in-out;
  505. transition: all 0.5s ease-in-out;
  506. width:100%;
  507. }
  508.  
  509. .step:not(.active) a.jms-link {
  510. margin-top:80px;
  511. opacity:0;
  512. }
  513.  
  514. .jms-dots {
  515. -moz-user-select:none;
  516. -ms-user-select:none;
  517. -o-user-select:none;
  518. -webkit-user-select:none;
  519. bottom:20px;
  520. left:0;
  521. position:absolute;
  522. text-align:center;
  523. user-select:none;
  524. width:100%;
  525. z-index:2000;
  526. }
  527.  
  528. .jms-dots span {
  529. background:{color:second color};
  530. border-radius:50%;
  531. box-shadow:1px 1px 1px rgba(0,0,0,0.1) inset, 1px 1px 1px rgba(255,255,255,0.3);
  532. cursor:pointer;
  533. display:inline-block;
  534. height:12px;
  535. margin:3px;
  536. position:relative;
  537. width:12px;
  538. }
  539.  
  540. .jms-dots span.jms-dots-current:after {
  541. background:linear-gradient(top,#777777 0%,#333333 47%,#7d7d7d 100%);
  542. border-radius:50%;
  543. content:'';
  544. filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#777777',endColorstr='#ededed',GradientType=0);
  545. height:8px;
  546. left:2px;
  547. position:absolute;
  548. top:2px;
  549. width:8px;
  550. }
  551.  
  552. .jms-arrows {
  553. -moz-user-select:none;
  554. -ms-user-select:none;
  555. -o-user-select:none;
  556. -webkit-user-select:none;
  557. user-select:none;
  558. }
  559.  
  560. .jms-arrows span {
  561. border-radius:3px;
  562. cursor:pointer;
  563. height:80px;
  564. margin-top:-40px;
  565. position:absolute;
  566. top:50%;
  567. width:50px;
  568. z-index:2000;
  569. }
  570.  
  571. .jms-arrows span.jms-arrows-prev {
  572. background:url(http://i.imgur.com/kQrHtZx.png) no-repeat 50% 50%;
  573. left:-10px;
  574. }
  575.  
  576. .jms-arrows span.jms-arrows-next {
  577. background:url(http://i.imgur.com/EjZA6Tp.png) no-repeat 50% 50%;
  578. right:-10px;
  579. }
  580.  
  581. .jms-wrapper.not-supported {
  582. background-color:rgba(227,216,268,1);
  583. }
  584.  
  585. .jms-wrapper.not-supported:after {
  586. content:'The slideshow functionality is not supported on your device.';
  587. display:block;
  588. padding:0 0 30px;
  589. text-align:center;
  590. }
  591.  
  592. .jms-wrapper.not-supported .step {
  593. -ms-filter:progid:DXImageTransform.Microsoft.Alpha(opacity=99);
  594. display:none;
  595. filter:alpha(opacity=99);
  596. margin:20px auto;
  597. opacity:1;
  598. position:relative;
  599. }
  600.  
  601. .jms-wrapper.not-supported .step:first-of-type {
  602. display:block;
  603. }
  604.  
  605. .jms-wrapper.not-supported .step:not(.active) a.jms-link {
  606. margin-top:40px;
  607. opacity:1;
  608. }
  609.  
  610. .pace {
  611. -moz-user-select:none;
  612. -webkit-pointer-events:none;
  613. -webkit-user-select:none;
  614. pointer-events:none;
  615. user-select:none;
  616. }
  617.  
  618. .pace .pace-activity {
  619. -webkit-transform:translateX(100%) translateY(-100%) rotate(45deg);
  620. -webkit-transition:0 .3s;
  621. background:{color:second color};
  622. display:block;
  623. height:300px;
  624. pointer-events:none;
  625. position:fixed;
  626. right:0;
  627. top:0;
  628. transform:translateX(100%) translateY(-100%) rotate(45deg);
  629. transition:transform .3s;
  630. width:300px;
  631. z-index:2000;
  632. }
  633.  
  634. .pace.pace-active .pace-activity {
  635. -webkit-transform:translateX(50%) translateY(-50%) rotate(45deg);
  636. transform:translateX(50%) translateY(-50%) rotate(45deg);
  637. }
  638.  
  639. .pace .pace-activity::before,.pace .pace-activity::after {
  640. border:5px solid {color:first color};
  641. border-radius:50%;
  642. bottom:30px;
  643. content:'';
  644. display:block;
  645. left:50%;
  646. position:absolute;
  647. }
  648.  
  649. .pace .pace-activity::before {
  650. -webkit-animation:pace-rotation 3s linear infinite;
  651. animation:pace-rotation 3s linear infinite;
  652. border-left-color:rgba(0,0,0,.2);
  653. border-right-color:rgba(0,0,0,.2);
  654. height:80px;
  655. margin-left:-40px;
  656. width:80px;
  657. }
  658.  
  659. .pace .pace-activity::after {
  660. -webkit-animation:pace-rotation 1s linear infinite;
  661. animation:pace-rotation 1s linear infinite;
  662. border-bottom-color:rgba(0,0,0,.2);
  663. border-top-color:rgba(0,0,0,.2);
  664. bottom:50px;
  665. height:40px;
  666. margin-left:-20px;
  667. width:40px;
  668. }
  669.  
  670. 100% {
  671. -webkit-transform:rotate(359deg);
  672. transform:rotate(359deg);
  673. }
  674.  
  675. [data-icon]:before {
  676. -webkit-font-smoothing:antialiased;
  677. content:attr(data-icon);
  678. font-family:ElegantIcons;
  679. font-variant:normal;
  680. font-weight:400;
  681. line-height:1;
  682. speak:none;
  683. text-transform:none;
  684. }
  685.  
  686. .arrow_up,.arrow_down,.arrow_left,.arrow_right,.arrow_left-up,.arrow_right-up,.arrow_right-down,.arrow_left-down,.arrow-up-down,.arrow_up-down_alt,.arrow_left-right_alt,.arrow_left-right,.arrow_expand_alt2,.arrow_expand_alt,.arrow_condense,.arrow_expand,.arrow_move,.arrow_carrot-up,.arrow_carrot-down,.arrow_carrot-left,.arrow_carrot-right,.arrow_carrot-2up,.arrow_carrot-2down,.arrow_carrot-2left,.arrow_carrot-2right,.arrow_carrot-up_alt2,.arrow_carrot-down_alt2,.arrow_carrot-left_alt2,.arrow_carrot-right_alt2,.arrow_carrot-2up_alt2,.arrow_carrot-2down_alt2,.arrow_carrot-2left_alt2,.arrow_carrot-2right_alt2,.arrow_triangle-up,.arrow_triangle-down,.arrow_triangle-left,.arrow_triangle-right,.arrow_triangle-up_alt2,.arrow_triangle-down_alt2,.arrow_triangle-left_alt2,.arrow_triangle-right_alt2,.arrow_back,.icon_minus-06,.icon_plus,.icon_close,.icon_check,.icon_minus_alt2,.icon_plus_alt2,.icon_close_alt2,.icon_check_alt2,.icon_zoom-out_alt,.icon_zoom-in_alt,.icon_search,.icon_box-empty,.icon_box-selected,.icon_minus-box,.icon_plus-box,.icon_box-checked,.icon_circle-empty,.icon_circle-slelected,.icon_stop_alt2,.icon_stop,.icon_pause_alt2,.icon_pause,.icon_menu,.icon_menu-square_alt2,.icon_menu-circle_alt2,.icon_ul,.icon_ol,.icon_adjust-horiz,.icon_adjust-vert,.icon_document_alt,.icon_documents_alt,.icon_pencil,.icon_pencil-edit_alt,.icon_pencil-edit,.icon_folder-alt,.icon_folder-open_alt,.icon_folder-add_alt,.icon_info_alt,.icon_error-oct_alt,.icon_error-circle_alt,.icon_error-triangle_alt,.icon_question_alt2,.icon_question,.icon_comment_alt,.icon_chat_alt,.icon_vol-mute_alt,.icon_volume-low_alt,.icon_volume-high_alt,.icon_quotations,.icon_quotations_alt2,.icon_clock_alt,.icon_lock_alt,.icon_lock-open_alt,.icon_key_alt,.icon_cloud_alt,.icon_cloud-upload_alt,.icon_cloud-download_alt,.icon_image,.icon_images,.icon_lightbulb_alt,.icon_gift_alt,.icon_house_alt,.icon_genius,.icon_mobile,.icon_tablet,.icon_laptop,.icon_desktop,.icon_camera_alt,.icon_mail_alt,.icon_cone_alt,.icon_ribbon_alt,.icon_bag_alt,.icon_creditcard,.icon_cart_alt,.icon_paperclip,.icon_tag_alt,.icon_tags_alt,.icon_trash_alt,.icon_cursor_alt,.icon_mic_alt,.icon_compass_alt,.icon_pin_alt,.icon_pushpin_alt,.icon_map_alt,.icon_drawer_alt,.icon_toolbox_alt,.icon_book_alt,.icon_calendar,.icon_film,.icon_table,.icon_contacts_alt,.icon_headphones,.icon_lifesaver,.icon_piechart,.icon_refresh,.icon_link_alt,.icon_link,.icon_loading,.icon_blocked,.icon_archive_alt,.icon_heart_alt,.icon_star_alt,.icon_star-half_alt,.icon_star,.icon_star-half,.icon_tools,.icon_tool,.icon_cog,.icon_cogs,.arrow_up_alt,.arrow_down_alt,.arrow_left_alt,.arrow_right_alt,.arrow_left-up_alt,.arrow_right-up_alt,.arrow_right-down_alt,.arrow_left-down_alt,.arrow_condense_alt,.arrow_expand_alt3,.arrow_carrot_up_alt,.arrow_carrot-down_alt,.arrow_carrot-left_alt,.arrow_carrot-right_alt,.arrow_carrot-2up_alt,.arrow_carrot-2dwnn_alt,.arrow_carrot-2left_alt,.arrow_carrot-2right_alt,.arrow_triangle-up_alt,.arrow_triangle-down_alt,.arrow_triangle-left_alt,.arrow_triangle-right_alt,.icon_minus_alt,.icon_plus_alt,.icon_close_alt,.icon_check_alt,.icon_zoom-out,.icon_zoom-in,.icon_stop_alt,.icon_menu-square_alt,.icon_menu-circle_alt,.icon_document,.icon_documents,.icon_pencil_alt,.icon_folder,.icon_folder-open,.icon_folder-add,.icon_folder_upload,.icon_folder_download,.icon_info,.icon_error-circle,.icon_error-oct,.icon_error-triangle,.icon_question_alt,.icon_comment,.icon_chat,.icon_vol-mute,.icon_volume-low,.icon_volume-high,.icon_quotations_alt,.icon_clock,.icon_lock,.icon_lock-open,.icon_key,.icon_cloud,.icon_cloud-upload,.icon_cloud-download,.icon_lightbulb,.icon_gift,.icon_house,.icon_camera,.icon_mail,.icon_cone,.icon_ribbon,.icon_bag,.icon_cart,.icon_tag,.icon_tags,.icon_trash,.icon_cursor,.icon_mic,.icon_compass,.icon_pin,.icon_pushpin,.icon_map,.icon_drawer,.icon_toolbox,.icon_book,.icon_contacts,.icon_archive,.icon_heart,.icon_profile,.icon_group,.icon_grid-2x2,.icon_grid-3x3,.icon_music,.icon_pause_alt,.icon_phone,.icon_upload,.icon_download,.social_facebook,.social_twitter,.social_pinterest,.social_googleplus,.social_tumblr,.social_tumbleupon,.social_wordpress,.social_instagram,.social_dribbble,.social_vimeo,.social_linkedin,.social_rss,.social_deviantart,.social_share,.social_myspace,.social_skype,.social_youtube,.social_picassa,.social_googledrive,.social_flickr,.social_blogger,.social_spotify,.social_delicious,.social_facebook_circle,.social_twitter_circle,.social_pinterest_circle,.social_googleplus_circle,.social_tumblr_circle,.social_stumbleupon_circle,.social_wordpress_circle,.social_instagram_circle,.social_dribbble_circle,.social_vimeo_circle,.social_linkedin_circle,.social_rss_circle,.social_deviantart_circle,.social_share_circle,.social_myspace_circle,.social_skype_circle,.social_youtube_circle,.social_picassa_circle,.social_googledrive_alt2,.social_flickr_circle,.social_blogger_circle,.social_spotify_circle,.social_delicious_circle,.social_facebook_square,.social_twitter_square,.social_pinterest_square,.social_googleplus_square,.social_tumblr_square,.social_stumbleupon_square,.social_wordpress_square,.social_instagram_square,.social_dribbble_square,.social_vimeo_square,.social_linkedin_square,.social_rss_square,.social_deviantart_square,.social_share_square,.social_myspace_square,.social_skype_square,.social_youtube_square,.social_picassa_square,.social_googledrive_square,.social_flickr_square,.social_blogger_square,.social_spotify_square,.social_delicious_square {
  687. -webkit-font-smoothing:antialiased;
  688. font-family:ElegantIcons;
  689. font-style:normal;
  690. font-variant:normal;
  691. font-weight:400;
  692. line-height:1;
  693. speak:none;
  694. text-transform:none;
  695. }
  696.  
  697. blockquote:before {
  698. color:{color:second color};
  699. content:"\275D";
  700. font-size:70px;
  701. margin-left:-60px;
  702. margin-top:-20px;
  703. position:absolute;
  704. text-shadow:2px 2px {color:first color};
  705. }
  706.  
  707. .icon_comment:before {
  708. content:"\e065";
  709. }
  710.  
  711. .icon_mail:before {
  712. content:"\e076";
  713. }
  714.  
  715. .icon_tag:before {
  716. content:"\e07b";
  717. }
  718.  
  719. .icon_tags:before {
  720. content:"\e07c";
  721. }
  722.  
  723. .social_facebook_circle:before {
  724. content:"\e0aa";
  725. }
  726.  
  727. .social_twitter_circle:before {
  728. content:"\e0ab";
  729. }
  730.  
  731. .social_googleplus_circle:before {
  732. content:"\e0ad";
  733. }
  734.  
  735. .social_tumblr_circle:before {
  736. content:"\e0ae";
  737. }
  738.  
  739. .social_wordpress_circle:before {
  740. content:"\e0b0";
  741. }
  742.  
  743. .social_instagram_circle:before {
  744. content:"\e0b1";
  745. }
  746.  
  747. .social_dribbble_circle:before {
  748. content:"\e0b2";
  749. }
  750.  
  751. .social_vimeo_circle:before {
  752. content:"\e0b3";
  753. }
  754.  
  755. .social_skype_circle:before {
  756. content:"\e0b9";
  757. }
  758.  
  759. .social_youtube_circle:before {
  760. content:"\e0ba";
  761. }
  762.  
  763. .social_picassa_circle:before {
  764. content:"\e0bb";
  765. }
  766.  
  767. .social_googledrive_alt2:before {
  768. content:"\e0bc";
  769. }
  770.  
  771. .social_flickr_circle:before {
  772. content:"\e0bd";
  773. }
  774.  
  775. .iconed {
  776. font-family:ElegantIcons;
  777. font-size:25px;
  778. }
  779.  
  780. .rules {
  781. background:{color:second color};
  782. border-radius:10px;
  783. color:{color:first color};
  784. display:block;
  785. height:99%;
  786. margin-left:30px;
  787. overflow:auto;
  788. padding:5px;
  789. text-align:justify;
  790. width:99%;
  791. }
  792.  
  793. .question {
  794. background:{color:first color};
  795. color:{color:second color};
  796. margin-bottom:10px;
  797. margin-left:150px;
  798. padding:10px;
  799. display:block;
  800. min-height:130px;
  801. }
  802.  
  803. .question a {
  804. color:{color:second color};
  805. }
  806.  
  807. .question:before {
  808. color:{color:first color};
  809. content:'\25c0';
  810. font-size:40px;
  811. margin-left:-30px;
  812. margin-top:25px;
  813. position:absolute;
  814. }
  815.  
  816. .ava {
  817. background:{color:first color};
  818. display:block;
  819. float:left;
  820. text-align:center;
  821. width:128px;
  822. color:{color: second color};
  823. font-size:12px;
  824. }
  825.  
  826. .ava a {
  827. color:{color:second color};
  828. }
  829.  
  830. .username {
  831. color:{color:second color};
  832. display:block;
  833. font-weight:700;
  834. margin:5px;
  835. text-transform:uppercase;
  836. }
  837.  
  838. .caption {
  839. background:{color:second color};
  840. display:block;
  841. padding:10px;
  842. margin-top:5px;
  843. margin-bottom:5px;
  844. }
  845.  
  846. .audio {
  847. background:{color:second color};
  848. display:block;
  849. height:25px;
  850. opacity:.5;
  851. overflow:hidden;
  852. padding:37.5px 65px 37.5px 10px;
  853. position:absolute;
  854. width:25px;
  855. z-index:10000;
  856. }
  857.  
  858. .music {
  859. background:{color:first color};
  860. color:{color:second color};
  861. font-size:20px;
  862. height:100px;
  863. padding:5px;
  864. text-align:center;
  865. }
  866.  
  867. .quote {
  868. color:{color:first color};
  869. font-size:20px;
  870. font-style:italic;
  871. }
  872.  
  873. .quote:first-letter {
  874. font-size:25px;
  875. opacity:.7;
  876. }
  877.  
  878. sup {
  879. font-size:16px;
  880. }
  881.  
  882. .2 {
  883. background:{color:second color};
  884. padding:3px;
  885. text-align:justify;
  886. }
  887.  
  888. .1 {
  889. background:{color:first color};
  890. color:{color:second color};
  891. padding:3px;
  892. }
  893.  
  894. ::-moz-selection,::selection {
  895. background-color:{color:second color};
  896. color:{color:second color};
  897. }
  898.  
  899. img, .html_photoset {
  900. max-width:100%;
  901. }
  902.  
  903. #pagination {
  904. font-size:18px;
  905. font-weight:700;
  906. color:{color:first color};
  907. text-align:center;
  908. display:block;
  909. }
  910.  
  911. .prev, .next {
  912. background:{color:second color};
  913. border-radius:4px;
  914. box-shadow:1px 1px 1px rgba(0,0,0,0.5);
  915. clear:both;
  916. color:{color:first color};
  917. display:block;
  918. font-size:16px;
  919. font-weight:700;
  920. margin-bottom:5px;
  921. opacity:1;
  922. text-align:center;
  923. padding:8px 15px;
  924. text-shadow:1px 1px 1px rgba(0,0,0,0.3);
  925. text-transform:uppercase;
  926. width:100px;
  927. position:absolute;
  928. }
  929.  
  930. .prev {
  931. margin-left:0;
  932. margin-top:0;
  933. }
  934.  
  935. .next {
  936. margin-left:38%;
  937. margin-top:-20px;
  938. }
  939.  
  940. .txt {
  941. color:{color:first color};
  942. background:{color:second color};
  943. padding:5px;
  944. border-radius:10px;
  945. border:1px solid #f8f8f8;
  946. }
  947.  
  948. .sub {
  949. background:{color:first color};
  950. color:{color:second color};
  951. border:1px solid {color:first color};
  952. padding:5px;
  953. border-radius:5px;
  954. }
  955.  
  956. .icon {
  957. border-radius:100%;
  958. border:10px inset {color:second color};
  959. }
  960.  
  961. .titled {
  962. color:{color:second color};
  963. font-family:Mensch;
  964. font-size:30px;
  965. margin-bottom:10px;
  966. }
  967. </style>
  968. <body>
  969. <div id="link">
  970. <a href="/">Home</a>
  971. <a href="/ask">Message Us</a>
  972. <a href="/archive">Archive</a>
  973. {block:ifLink1}<a href="{text:Link1URL}">{text:Link1}</a>{/block:ifLink1}
  974. {block:ifLink2}<a href="{text:Link2URL}">{text:Link2}</a>{/block:ifLink2}
  975. {block:ifLink3}<a href="{text:Link3URL}">{text:Link3}</a>{/block:ifLink3}
  976. <a href="http://hellolittlered.org">theme</a>
  977. </div>
  978.  
  979. <!-- slider -->
  980. <div id="header">
  981. <section id="jms-slideshow" class="jms-slideshow">
  982. <div class="step" data-color="color-2">
  983. <div class="jms-content">
  984. <br>
  985. <center>
  986. <img src="{PortraitURL-128}" class="icon">
  987. <div class="titled">{title}</div>
  988. </center>
  989.  
  990. <p>{description}</p>
  991. </div>
  992. <img src="{image:header image}" style="position:absolute;top:0;right:20px">
  993. </div>
  994.  
  995. <div class="step" data-color="color-4" data-x="-100" data-z="1500" data-rotate="170">
  996. <div class="jms-content" style="width:90%;margin-top:-50px">
  997. <table width="100%" style="margin-top:30px;">
  998. <tr>
  999. <th colspan="2"><h3>Complete Links</h3></th>
  1000. <th><h3>{text:Second Desc Title}</h3></th>
  1001. </tr>
  1002. <tr>
  1003. <td width="20%">
  1004. {block:ifLink4}<a href="{text:Link4URL}" class="link">{text:Link4}</a>{/block:ifLink4}
  1005. {block:ifLink5}<a href="{text:Link5URL}" class="link">{text:Link5}</a>{/block:ifLink5}
  1006. {block:ifLink6}<a href="{text:Link6URL}" class="link">{text:Link6}</a>{/block:ifLink6}
  1007. {block:ifLink7}<a href="{text:Link7URL}" class="link">{text:Link7}</a>{/block:ifLink7}
  1008. {block:ifLink8}<a href="{text:Link8URL}" class="link">{text:Link8}</a>{/block:ifLink8}
  1009. {block:ifLink9}<a href="{text:Link9URL}" class="link">{text:Link9}</a>{/block:ifLink9}
  1010. </td>
  1011. <td width="20%">
  1012. {block:ifLink10}<a href="{text:Link10URL}" class="link">{text:Link10}</a>{/block:ifLink10}
  1013. {block:ifLink11}<a href="{text:Link11URL}" class="link">{text:Link11}</a>{/block:ifLink11}
  1014. {block:ifLink12}<a href="{text:Link12URL}" class="link">{text:Link12}</a>{/block:ifLink12}
  1015. {block:ifLink13}<a href="{text:Link13URL}" class="link">{text:Link13}</a>{/block:ifLink13}
  1016. {block:ifLink14}<a href="{text:Link14URL}" class="link">{text:Link14}</a>{/block:ifLink14}
  1017. {block:ifLink15}<a href="{text:Link15URL}" class="link">{text:Link15}</a>{/block:ifLink15}
  1018. </td>
  1019. <td width="60%">
  1020. <div class="rules">
  1021. {text:Second Desc}
  1022. </div>
  1023. </td>
  1024. </tr>
  1025. </table>
  1026. </div>
  1027. </div>
  1028.  
  1029. {block:ifcharacter1}<div class="step" data-color="color-" data-y="900" data-rotate-x="80">
  1030. <div class="jms-content" style="width:80%;margin-left:10%;">
  1031. <div class="box">
  1032. <table>
  1033. <tr>
  1034. <td><img src="{image:character1}"></td>
  1035. <td><img src="{image:character1}"></td>
  1036. <td><img src="{image:character3}"></td>
  1037. </tr>
  1038. <tr>
  1039. <td>{text:Character 1}</td>
  1040. <td>{text:Character 2}</td>
  1041. <td>{text:Character 2}</td>
  1042. </tr>
  1043. </table>
  1044. </div>
  1045. <a class="jms-link" href="http://hellolittlered.org/pages/designs" style="margin-top:10px;">All Characters</a>
  1046. </div>
  1047. </div>
  1048. {/block:ifcharacter1}
  1049. </section>
  1050. </div>
  1051.  
  1052. <!-- the content -->
  1053.  
  1054. <section id="konten">
  1055. <div class="blog">
  1056. {block:posts}
  1057. <div class="cont">
  1058. {block:Date}<a href="{permalink}"><div class="time">
  1059. <div class="mont">{DayOfMonthWithZero}<sup>{DayOfMonthSuffix}</sup></div>
  1060. <div class="date">{ShortMonth}</div>
  1061. </div></a>
  1062. {/block:Date}
  1063.  
  1064. {block:Photo}
  1065. <center><a href="{PhotoURL-HighRes}"><img src="{PhotoURL-HighRes}" alt=""></a></center>
  1066. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1067. {/block:Photo}
  1068.  
  1069. {block:Photoset}
  1070. <center><div class="photo">{Photoset}</div></center>
  1071. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1072. {/block:Photoset}
  1073.  
  1074. {block:Quote}
  1075. <div class="quote caption">"{Quote}"
  1076. <b>- {Source}</b></div>
  1077. {/block:Quote}
  1078.  
  1079. {block:Text}
  1080. {block:Title}<a href="{permalink}"><h2>{Title}</h2></a>{/block:Title}
  1081. <div class="caption">{Body}</div>
  1082. {/block:Text}
  1083.  
  1084. {block:Answer}
  1085. <div class="ava"><img src="{AskerPortraitURL-128}">
  1086. <span class="username">{asker}</span>
  1087. </div>
  1088. <div class="question">{Question}</div>
  1089. <div class="caption">{Answer}</div>
  1090. {/block:Answer}
  1091.  
  1092.  
  1093. {block:Link}
  1094. <a href="{URL}"><h2>{Name} →</h2></a>
  1095. {block:Description}<div class="caption">{Description}</div>{/block:Description}
  1096. {/block:Link}
  1097.  
  1098. {block:Chat}
  1099. <div class="chat">
  1100. {block:Title}<a href="{Permalink}"><h2>{Title}</h2></a>{/block:Title}
  1101. <div class="caption"><table>
  1102. {block:Lines}<tr>{block:Label}<td class="1"><b>{Label}</b></td>{/block:Label}<td class="2">{Line}</td></tr>{/block:Lines}
  1103. </table></div>
  1104. </div>
  1105. {/block:Chat}
  1106.  
  1107.  
  1108. {block:Audio}
  1109.  
  1110. <div class="music">
  1111. <div class="audio">
  1112. {AudioPlayerWhite}
  1113. </div>
  1114. {block:AlbumArt}
  1115. <img src="{AlbumArtURL}" width="100px" height="100px" align="left">
  1116. {/block:AlbumArt}
  1117. <br/>
  1118. {block:TrackName}<em><strong>{TrackName}</strong></em>{/block:TrackName} {block:Artist}<br/>
  1119. <span style="font-size:16px">{Artist}</span>{/block:Artist}
  1120. </div>
  1121. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1122. {/block:Audio}
  1123.  
  1124.  
  1125. {block:Video}
  1126. {Video-700}
  1127. {block:Caption}<div class="caption">{Caption}</div>{/block:Caption}
  1128. {/block:Video}
  1129.  
  1130. <div class="end">
  1131. {block:RebloggedFrom}<a href="{ReblogParentURL}">{ReblogParentName}</a>{/block:RebloggedFrom}{block:ContentSource} - <a href="{SourceURL}">{SourceLink}</a>{/block:ContentSource}
  1132. {block:HasTags}<li class="icon_tag"> {block:Tags}<a href="{TagURL}">{Tag},</a>{/block:Tags}</li>{/block:HasTags}
  1133. {block:NoteCount}<li class="icon_comment"> <a href="{permalink}">{NoteCountWithLabel}</a></li>{/block:NoteCount}
  1134. </div>
  1135. {block:PostNotes}{PostNotes}{/block:PostNotes}
  1136. </div>
  1137. {/block:posts}
  1138.  
  1139. {block:Pagination}
  1140. <div id="pagination">
  1141. {block:PreviousPage}<a href="{PreviousPage}" class="prev">PREV</a>{/block:PreviousPage}
  1142. {CurrentPage}/{TotalPages}
  1143. {block:NextPage}<a href="{NextPage}" class="next">NEXT</a>{/block:NextPage}
  1144. </div>
  1145. {/block:Pagination}
  1146. </div>
  1147.  
  1148. <!-- the footer -->
  1149. <section id="footer">
  1150. <table align="center">
  1151. <tr>
  1152. <td style="border:none;">
  1153. <b>Other Media</b><br>
  1154. <form action="/search" method="get">
  1155. <input type="text" name="q" value="{SearchQuery}" class="txt"/>
  1156. <input type="submit" value="Search" class="sub"/>
  1157. </form><br>
  1158. {block:ifFacebook}<a class="social_facebook_circle" style="color:{color:second color};font-size:40px;display:inline-block;margin:5px" href="{text:Facebook}"></a>{/block:ifFacebook}
  1159. {block:ifTwitter}<a class="social_twitter_circle" style="color:{color:second color};font-size:40px;display:inline-block;margin:5px" href="{text:Twitter}"></a>{/block:ifTwitter}
  1160. {block:ifEmail}<a href="mailto:{text:Email}" class="icon_mail" style="color:{color:second color};font-size:40px;display:inline-block;margin:5px"></a>{/block:ifEmail}
  1161. <p>© {text:username}<br>
  1162. {CopyrightYears}<br>
  1163. </td>
  1164.  
  1165. <td>
  1166. <center id="menn"><b>Menu</b><br>
  1167. <small>
  1168. <a href="/">Home</a>
  1169. <a href="/ask">Message</a>
  1170. <a href="/archive">Archive</a>
  1171. {block:ifLink1}<a href="{text:Link1URL}">{text:Link1}</a>{/block:ifLink1}
  1172. {block:ifLink2}<a href="{text:Link2URL}">{text:Link2}</a>{/block:ifLink2}
  1173. {block:ifLink3}<a href="{text:Link3URL}">{text:Link3}</a>{/block:ifLink3}
  1174. <a href="http://hellolittlered.org">theme</a>
  1175. </small></center>
  1176. </td>
  1177. </tr>
  1178. </table>
  1179. </section>
  1180.  
  1181. <!-- the footer -->
  1182.  
  1183. </section>
  1184. <script type="text/javascript">
  1185. $(function() {
  1186. $( '#jms-slideshow' ).jmslideshow();
  1187. });
  1188. </script>
  1189. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement