Advertisement
xariaaaa

[THEME] Epitome of Innocence

Dec 4th, 2015
101
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 27.01 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. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  3.  
  4. <!-- THEME BY 15304, POSTS BY GALAXIAS-THEMES -->
  5.  
  6. <head>
  7. <title>{Title}</title>
  8. <link rel="shortcut icon" href="{FavIcon}" />
  9. <link rel="alternate" type="application/rss+xml" href="{RSS}" />
  10.  
  11. <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
  12.  
  13.  
  14. <style type="text/css">
  15. @font-face {font-family: "vdj";src: url('https://dl.dropboxusercontent.com/s/vn84aq1yx6s7jti/Vdj.ttf?dl=1'); format("truetype");}
  16.  
  17. @font-face {font-family: "tinytots";src: url('https://dl.dropboxusercontent.com/s/y0pfz7ndq83n7j7/04B_03_.TTF?dl=1'); format("truetype");}
  18.  
  19. @font-face {font-family: "existence_light";src: url('https://dl.dropboxusercontent.com/s/j6zit9abexzkx1z/Existence-Light.ttf?dl=1'); format("truetype");}
  20.  
  21. @font-face {font-family: "alexbrush";src: url('https://dl.dropboxusercontent.com/s/y48zvcvymdw1vmo/AlexBrush-Regular.ttf?dl=1'); format("truetype");}
  22.  
  23. @font-face {font-family: "aaargh";src: url('https://dl.dropboxusercontent.com/s/bnyoyt2m3w06ehr/Aaargh.ttf?dl=1'); format("truetype");}
  24.  
  25. @font-face {font-family: "Color of Autumn";src: url('https://dl.dropboxusercontent.com/s/l06x9nm9m2aw6n8/Colors%20Of%20Autumn.ttf?dl=1'); format("truetype");}
  26.  
  27. @font-face {font-family: "black jack";src: url('https://dl.dropboxusercontent.com/s/ryf3a4mag4hudp6/BLACKJAR.TTF?dl=1'); format("truetype");}
  28.  
  29.  
  30.  
  31. ::selection {
  32. color: #2a4a5c;
  33. background-color: transparent !important;
  34. }
  35.  
  36. ::-moz-selection {
  37. color: #2a4a5c;
  38. background-color: transparent !important;
  39. }
  40.  
  41. ::-webkit-scrollbar {
  42. width: 5px;
  43. height:1px;
  44. }
  45.  
  46. ::-webkit-scrollbar-thumb:vertical {
  47. background-color: #2a4a5c;
  48. border: 1px solid #4e6d7e;
  49. }
  50.  
  51. ::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment {
  52. height: 90%;
  53. display: block;
  54. background-color: transparent;
  55. }
  56.  
  57. ::-webkit-scrollbar-track-piece {
  58. background-color: #000000;
  59. }
  60.  
  61. body {
  62. background-color: #000000;
  63. }
  64.  
  65. *, body, a {
  66. cursor: url(http://i.imgur.com/2qleX.jpg), auto;
  67. }
  68.  
  69. a:link, a:visited, a:active {
  70. text-decoration: none;
  71. color: #4e6d7e;
  72. cursor: url('http://i.imgur.com/IepP2.jpg'), auto;
  73. text-shadow: 0px 0px #2a4a5c, -0px 0px #2a4a5c;
  74. -webkit-transition: all 0.7s ease-in-out;
  75. }
  76.  
  77. a:hover {
  78. color: #2a4a5c;
  79. text-shadow: 7px 0px transparent, -7px 0px transparent;
  80. -webkit-transition: all 0.7s ease-in-out;
  81. }
  82.  
  83. /* GASARA */
  84. @font-face { font-family: "gasara"; src: url('https://dl.dropbox.com/s/9mird7ef2oyhzbc/gasara.ttf'); }
  85.  
  86. ul, li {
  87. font-family: "Gasra";
  88. font-size:8px;
  89. list-style-type:square;
  90. color: #5c5c5c;
  91. }
  92.  
  93. ul, ol {
  94. font-family: "Calibri";
  95. text-transform: none !important;
  96. font-size: 10px;
  97. padding:2px;
  98. margin-left:20px;
  99. }
  100.  
  101. small, sub {
  102. font-family: "Calibri";
  103. font-size: 8px;
  104. letter-spacing: 1px;
  105. line-height: 13px;
  106. margin-top: 10px !important;
  107. line-height: 90%;
  108. }
  109.  
  110. pre, code {
  111. font-family: "Gasara";
  112. font-size: 8px;
  113. text-transform: uppercase;
  114. letter-spacing: 1;
  115. line-height: 100%;
  116. color: #2a4a5c;
  117. background-color: #9a9a9a;
  118. text-align: center;
  119. padding: 3px;
  120. border-radius: 10px 0px 10px 0px;
  121. border: 1px dotted #2a4a5c;
  122. }
  123.  
  124. blockquote {
  125. margin-left: 7px;
  126. width: 85%;
  127. width:92%;
  128. text-align: justify;
  129. border-left: dotted 1px #2a4a5c;
  130. padding: 5px;
  131. -moz-border-radius: 10px 0px;
  132. border-radius: 10px 0px 0px 0px;
  133. padding-left: 10px;
  134. }
  135.  
  136. blockquote blockquote {
  137. margin-left: 4px;
  138. width: 85%;
  139. width:90%;
  140. text-align: justify;
  141. border-left: dotted 1px #2a4a5c;
  142. padding: 5px;
  143. -moz-border-radius: 0px 0px;
  144. border-radius: 10px 0px 0px 0px;
  145. padding-left: 10px;
  146. }
  147.  
  148. blockquote img {
  149. max-width:210px !important;
  150. height: auto;
  151. opacity: .5;
  152. overflow:hidden;
  153. }
  154.  
  155. blockquote blockquote img {
  156. max-width:180px !important;
  157. height: auto;
  158. opacity: .5;
  159. overflow:hidden;
  160. }
  161.  
  162. .alignment {
  163. position: relative;
  164. margin-left: 165px;
  165. margin-top: 20px;
  166. height: 100%;
  167. height: auto !important;
  168. min-height: 100%;
  169. z-index:999999999999;
  170. width:250px;
  171. }
  172.  
  173. #posttitle {
  174. font-family: 'aaargh', sans-serif;
  175. color: #2a4a5c;
  176. font-size: 15px;
  177. padding: 5px;
  178. margin-top: 5px;
  179. line-height: 17px;
  180. text-align: center;
  181. text-transform: lowercase;
  182. }
  183.  
  184. #posttitle:first-letter {
  185. font-family: 'alexbrush', cursive;
  186. color: #4e6d7e;
  187. text-transform: uppercase;
  188. font-size: 35px;
  189. }
  190.  
  191. #posttitle a {
  192. color: #2a4a5c;
  193. -moz-transition:all ease-in-out 0.7s;
  194. -webkit-transition:all ease-in-out 0.7s;
  195. -o-transition:all ease-in-out 0.7s;
  196. transition:all ease-in-out 0.7s;
  197. }
  198.  
  199. #posttitle a:hover {
  200. color: #4e6d7e;
  201. -moz-transition:all ease-in-out 0.7s;
  202. -webkit-transition:all ease-in-out 0.7s;
  203. -o-transition:all ease-in-out 0.7s;
  204. transition:all ease-in-out 0.7s;
  205. }
  206.  
  207. .quotation1 {
  208. position:absolute;
  209. font-size:30px;
  210. color: {color:bolded text};
  211. opacity:0.1;
  212. font-family: georgia;
  213. margin-top: 5px;
  214. }
  215.  
  216. .quotation2 {
  217. position:absolute;
  218. font-size:30px;
  219. color: #4e6d7e;
  220. opacity:0.1;
  221. font-family: georgia;
  222. margin-top: 5px;
  223. }
  224.  
  225. .postcontainer {
  226. width:250px;
  227. font-family: arial;
  228. font-size: 10px;
  229. letter-spacing: 1;
  230. line-height: 100%;
  231. color: #5c5c5c;
  232. text-align: justify;
  233. word-wrap:break-word;
  234. background-color: #080808;
  235. border-radius: 30px 0px 30px 0px;
  236. border-right: 1px dotted #4e6d7e;
  237. border-left: 1px dotted #4e6d7e;
  238. padding: 10px;
  239. margin-bottom: 20px;
  240. -moz-transition:all ease-in-out 0.7s;
  241. -webkit-transition:all ease-in-out 0.7s;
  242. -o-transition:all ease-in-out 0.7s;
  243. transition:all ease-in-out 0.7s;
  244. }
  245.  
  246. .postinfo {
  247. width:250px;
  248. font-family: arial;
  249. font-size: 10px;
  250. letter-spacing: 1;
  251. line-height: 100%;
  252. color: #5c5c5c;
  253. text-align: justify;
  254. word-wrap:break-word;
  255. margin-top: -15px;
  256. background-color: #080808;
  257. padding: 10px;
  258. -moz-transition:all ease-in-out 0.7s;
  259. -webkit-transition:all ease-in-out 0.7s;
  260. -o-transition:all ease-in-out 0.7s;
  261. transition:all ease-in-out 0.7s;
  262. }
  263.  
  264. .postnotes {
  265. width:250px;
  266. font-family: "Gasara";
  267. font-size: 8px;
  268. letter-spacing: 1;
  269. line-height: 100%;
  270. color: #5c5c5c;
  271. text-align: left;
  272. text-transform: uppercase;
  273. word-wrap:break-word;
  274. background-color: #080808;
  275. padding: 10px;
  276. -moz-transition:all ease-in-out 0.7s;
  277. -webkit-transition:all ease-in-out 0.7s;
  278. -o-transition:all ease-in-out 0.7s;
  279. transition:all ease-in-out 0.7s;
  280. }
  281.  
  282. .postnotes img {
  283. display:none;
  284. }
  285.  
  286. .postperma {
  287. width:264px;
  288. margin-top: -17px;
  289. margin-bottom: 20px;
  290. text-align:center;
  291. font-family: "Gasara";
  292. font-size: 8px;
  293. color: #4e6d7e;
  294. text-transform: uppercase;
  295. letter-spacing: 1;
  296. line-height: 15px;
  297. padding: 5px;
  298. height: 11px;
  299. -moz-transition:all ease-in-out 0.7s;
  300. -webkit-transition:all ease-in-out 0.7s;
  301. -o-transition:all ease-in-out 0.7s;
  302. transition:all ease-in-out 0.7s;
  303. }
  304.  
  305. .postperma a {
  306. color: #4e6d7e;
  307. -moz-transition:all ease-in-out 0.7s;
  308. -webkit-transition:all ease-in-out 0.7s;
  309. -o-transition:all ease-in-out 0.7s;
  310. transition:all ease-in-out 0.7s;
  311. }
  312.  
  313. .postperma a:hover {
  314. color: #5c5c5c;
  315. -moz-transition:all ease-in-out 0.7s;
  316. -webkit-transition:all ease-in-out 0.7s;
  317. -o-transition:all ease-in-out 0.7s;
  318. transition:all ease-in-out 0.7s;
  319. }
  320.  
  321.  
  322. #odd {
  323. padding:2px;
  324. font-size: 10px;
  325. letter-spacing: 1px;
  326. font-family: arial;
  327. color: #5c5c5c;
  328. }
  329.  
  330. #even {
  331. padding:2px;
  332. font-size: 10px;
  333. letter-spacing: 1px;
  334. font-family: arial;
  335. color: #5c5c5c;
  336. }
  337.  
  338. #tags {
  339. font-family: "Gasara";
  340. font-size: 8px;
  341. text-transform: uppercase;
  342. letter-spacing: 1;
  343. line-height: 100%;
  344. }
  345.  
  346. #tags a, #permatags a {
  347. color: #2a4a5c;
  348. }
  349.  
  350. #permatags {
  351. width:270px;
  352. margin-top: -20px;
  353. padding: 5px;
  354. margin-bottom: 10px;
  355. color: #c5c5c5;
  356. font-family: "Gasara";
  357. font-size: 8px;
  358. text-transform: uppercase;
  359. letter-spacing: 1;
  360. line-height: 100%;
  361. text-align: center;
  362. }
  363.  
  364. .postcontainer img:hover, #photoset:hover {
  365. opacity: 1;
  366. -webkit-filter: grayscale(0%) !important;
  367. -moz-transition:all ease-in-out 0.7s;
  368. -webkit-transition:all ease-in-out 0.7s;
  369. -o-transition:all ease-in-out 0.7s;
  370. transition:all ease-in-out 0.7s;
  371. }
  372.  
  373. .postcontainer img, #photoset {
  374. max-width:250px;
  375. opacity: .5;
  376. -webkit-filter: grayscale(100%);
  377. -moz-transition:all ease-in-out 0.7s;
  378. -webkit-transition:all ease-in-out 0.7s;
  379. -o-transition:all ease-in-out 0.7s;
  380. transition:all ease-in-out 0.7s;
  381. }
  382.  
  383. .photopost img {
  384. max-width: 250px !important;
  385. opacity: .5;
  386. -webkit-filter: grayscale(100%);
  387. -moz-transition:all ease-in-out 0.7s;
  388. -webkit-transition:all ease-in-out 0.7s;
  389. -o-transition:all ease-in-out 0.7s;
  390. transition:all ease-in-out 0.7s;
  391. }
  392.  
  393. .video {
  394. max-width: 250px !important;
  395. -moz-transition:all ease-in-out 0.7s;
  396. -webkit-transition:all ease-in-out 0.7s;
  397. -o-transition:all ease-in-out 0.7s;
  398. transition:all ease-in-out 0.7s;
  399. -webkit-filter: grayscale(100%);
  400. opacity: .5;
  401. }
  402.  
  403. .video:hover {
  404. opacity: 1;
  405. -webkit-filter: grayscale(0%);
  406. -moz-transition:all ease-in-out 0.7s;
  407. -webkit-transition:all ease-in-out 0.7s;
  408. -o-transition:all ease-in-out 0.7s;
  409. transition:all ease-in-out 0.7s;
  410. }
  411.  
  412.  
  413. /* QUOTES */
  414. h2 {
  415. font-family: aaargh;
  416. font-size: 15px;
  417. line-height:15px;
  418. color: #2a4a5c;
  419. font-weight: normal;
  420. letter-spacing: 0px;
  421. }
  422.  
  423. .quote {
  424. font-family: aaargh;
  425. font-size: 24px;
  426. opacity:0.5;
  427. color: #2a4a5c;
  428. float: left;
  429. margin-top: 2px;
  430. }
  431.  
  432.  
  433. /* AUDIO */
  434. .album {
  435. background-repeat: no-repeat;
  436. background-position: center;
  437. position: absolute;
  438. width: 86px;
  439. height: 86px;
  440. background-size: 60px;
  441. overflow: hidden;
  442. border: 1px dotted #2a4a5c;
  443. border-radius: 30px 0px 30px 0px;
  444. -moz-transition:all ease-in-out 0.7s;
  445. -webkit-transition:all ease-in-out 0.7s;
  446. -o-transition:all ease-in-out 0.7s;
  447. transition:all ease-in-out 0.7s;
  448. }
  449.  
  450. .album img {
  451. width: 86px;
  452. height: 86px;
  453. overflow: hidden;
  454. -moz-transition:all ease-in-out 0.7s;
  455. -webkit-transition:all ease-in-out 0.7s;
  456. -o-transition:all ease-in-out 0.7s;
  457. transition:all ease-in-out 0.7s
  458. -webkit-filter: grayscale(100%);
  459. opacity:.5;
  460. border-radius: 30px 0px 30px 0px;
  461. }
  462.  
  463. .album img:hover {
  464. -moz-transition:all ease-in-out 0.7s;
  465. -webkit-transition:all ease-in-out 0.7s;
  466. -o-transition:all ease-in-out 0.7s;
  467. transition:all ease-in-out 0.7s;
  468. -webkit-filter: grayscale(0%) !important;
  469. opacity:1;
  470. }
  471.  
  472. .player {
  473. width: 10px;
  474. height: 11px;
  475. overflow: hidden;
  476. padding: 4px 21px 21px 4px;
  477. margin-top: 27px;
  478. margin-left: 26px;
  479. position: absolute;
  480. background-color: #000;
  481. border:1px dotted #2a4a5c;
  482. opacity: 0.5;
  483. z-index: 10;
  484. -webkit-transition: all 0.4s linear;
  485. -moz-transition: all 0.4s linear;
  486. -o-transition: all 0.4s linear;
  487. -moz-border-radius: 30px;
  488. -webkit-border-radius: 30px;
  489. border-radius: 30px;
  490. }
  491.  
  492. .album:hover .player {
  493. opacity: 0.5;
  494. }
  495.  
  496. .track {
  497. margin-left: 90px;
  498. min-height: 80px;
  499. max-height: 100px;
  500. overflow: auto;
  501. font-family: "Gasara";
  502. font-size: 8px;
  503. padding: 3px;
  504. color: #2a4a5c;
  505. text-align: center;
  506. line-height: 12px;
  507. text-transform: uppercase;
  508. letter-spacing: 1px;
  509. background: #9a9a9a;
  510. border: 1px dotted #2a4a5c;
  511. border-radius: 30px 0px 30px 0px;
  512. }
  513.  
  514. /* ASK */
  515. .question {
  516. background-color: #9a9a9a;
  517. border-right:1px dotted #2a4a5c;
  518. border-left:1px dotted #2a4a5c;
  519. border-radius: 30px 0px 30px 0px;
  520. color: #2a4a5c;
  521. padding: 5px;
  522. font-size: 8px;
  523. font-family:vdj;
  524. text-transform: auto;
  525. }
  526.  
  527. .asker {
  528. font-family:black jack;
  529. font-size:30px;
  530. font-style: normal;
  531. text-align:right;
  532. padding:3px;
  533. }
  534.  
  535. .asker a:hover {
  536. text-shadow:-1px 0px 2px #2a4a5c, 0px 1px 0px #2a4a5c, 1px 0px 0px #2a4a5c, -1px 0px 0px #2a4a5c;
  537. color: #c5c5c5;
  538. opacity:.2;
  539. }
  540.  
  541. .answer {
  542. font-family: "Calibri";
  543. }
  544.  
  545. .answer img {
  546. max-width: 240px;
  547. height: auto;
  548. }
  549.  
  550.  
  551. /* Tooltip */
  552.  
  553. #s-m-t-tooltip {
  554. max-width:250px;
  555. margin-top:25px;
  556. margin-left:15px;
  557. padding-left:5px;
  558. padding-right:5px;
  559. padding-top:1px;
  560. padding-bottom:1px;
  561. border:1px solid #2a4a5c;
  562. background-color: #080808;
  563. color: #2a4a5c;
  564. font-family: "Gasara";
  565. font-size:8px;
  566. letter-spacing:1px;
  567. text-transform:uppercase;
  568. text-align:justify;
  569. line-height:10px;
  570. box-shadow:1px 1px 3px rgba(0,0,0,.1);
  571. -webkit-border-radius: 2px;
  572. -moz-border-radius: 2px;
  573. border-radius: 2px;
  574. z-index:999999999999999;
  575. }
  576.  
  577. #s-m-t-tooltip:first-letter {
  578. font-family: 'alexbrush', cursive;
  579. color: #4e6d7e;
  580. text-transform: uppercase;
  581. font-size: 25px;
  582. }
  583.  
  584. #sidewrap {
  585. left: 50%;
  586. bottom: -20px;
  587. height: 550px;
  588. width: 500px;
  589. position: fixed;
  590. }
  591.  
  592. .kook {
  593. bottom: 0px;
  594. left: 0px;
  595. height: 450px;
  596. width: 215px;
  597. }
  598.  
  599. .kook img {
  600. opacity: 1 !imporant;
  601. -webkit-filter: grayscale(0%) !important;
  602. }
  603.  
  604. .kookdesc {
  605. background-color: #080808;
  606. margin-top: -100px;
  607. margin-left: 140px;
  608. height: 96px;
  609. width: 146px;
  610. padding: 2px;
  611. border-radius: 0px 0px 0px 30px;
  612. border-left: 1px dotted #2a4a5c;
  613. border-right: 1px dotted #2a4a5c;
  614. font-family: "gasara";
  615. font-size: 8px;
  616. text-align: justify;
  617. line-height: 10px;
  618. color: #2a4a5c;
  619. }
  620.  
  621. .kooklnk{
  622. height: 20px;
  623. width: 80px;
  624. margin-top: 5px;
  625. margin-left: 225px;
  626. }
  627.  
  628. .kooklink{
  629. text-align: right;
  630. display: inline-block;
  631. height: 10px;
  632. width: 10px;
  633. margin-right: 10px;
  634. background-color: #080808;
  635. border-radius: 3px 0px 3px 0px;
  636. border: 1px dotted #2a4a5c;
  637. box-shadow: inset 0 0 7px 7px #080808, 0 0 0 #080808;
  638. opacity: 1;
  639. -webkit-transition: all 0.4s linear;
  640. -moz-transition: all 0.4s linear;
  641. -o-transition: all 0.4s linear;
  642. }
  643.  
  644. .kooklink:hover {
  645. box-shadow: inset 0 0 3px 3px #000000, 0 0 7px 5px #000000;
  646. border-radius: 0px 3px 0px 3px;
  647. -webkit-transition: all 0.4s linear;
  648. -moz-transition: all 0.4s linear;
  649. -o-transition: all 0.4s linear;
  650. }
  651.  
  652. .seol{
  653. margin-left: 400px;
  654. margin-top: -460px;
  655. height: 450px;
  656. width: 215px;
  657. }
  658.  
  659. .seol img {
  660. opacity: 1 !imporant;
  661. -webkit-filter: grayscale(0%) !important;
  662. }
  663.  
  664. .seoldesc {
  665. background-color: #080808;
  666. margin-top: -115px;
  667. margin-left: 310px;
  668. height: 96px;
  669. width: 146px;
  670. padding: 2px;
  671. border-radius: 0px 30px 0px 0px;
  672. border-left: 1px dotted #2a4a5c;
  673. border-right: 1px dotted #2a4a5c;
  674. font-family: "gasara";
  675. font-size: 8px;
  676. text-align: justify;
  677. line-height: 10px;
  678. color: #2a4a5c;
  679. }
  680.  
  681. .seollnk{
  682. height: 20px;
  683. width: 80px;
  684. margin-top: 5px;
  685. margin-left: 310px;
  686. }
  687.  
  688. .seollink{
  689. text-align: right;
  690. display: inline-block;
  691. height: 10px;
  692. width: 10px;
  693. margin-right: 10px;
  694. background-color: #080808;
  695. border-radius: 0px 3px 0px 3px;
  696. border: 1px dotted #2a4a5c;
  697. box-shadow: inset 0 0 7px 7px #080808, 0 0 0 #080808;
  698. opacity: 1;
  699. -webkit-transition: all 0.4s linear;
  700. -moz-transition: all 0.4s linear;
  701. -o-transition: all 0.4s linear;
  702. }
  703.  
  704. .seollink:hover {
  705. box-shadow: inset 0 0 3px 3px #000000, 0 0 7px 5px #000000;
  706. border-radius: 3px 0px 3px 0px;
  707. -webkit-transition: all 0.4s linear;
  708. -moz-transition: all 0.4s linear;
  709. -o-transition: all 0.4s linear;
  710. }
  711.  
  712. .sidetitl{
  713. margin-top: -160px;
  714. margin-left: 140px;
  715. height: 40px;
  716. width: 470px;
  717. font-family: "aaargh";
  718. font-size: 27px;
  719. letter-spacing: 1px;
  720. color: #2a4a5c;
  721. }
  722.  
  723. .sidetitl:first-letter{
  724. font-family: 'alexbrush', cursive;
  725. color: #4e6d7e;
  726. text-transform: uppercase;
  727. font-size: 35px;
  728. }
  729.  
  730. #fade {
  731. display: none;
  732. position: fixed;
  733. left: 0;
  734. top: 0;
  735. width: 100%;
  736. height: 100%;
  737. opacity: 0;
  738. z-index: 9999999;
  739. }
  740.  
  741. .popup_block{
  742. display: none;
  743. background-color: #080808;
  744. padding: 5px;
  745. border: 1px dotted #2a4a5c;
  746. float: left;
  747. position: fixed;
  748. top: 45%;
  749. right: 248px;
  750. z-index: 99999999999999;
  751. border-radius: 30px 0px 30px 0px;
  752. overflow: auto;
  753. max-height: 250px !important;
  754. }
  755.  
  756. .tit{
  757. font-family: "aaargh";
  758. font-size: 20px;
  759. color: #2a4a5c;
  760. text-align: center;
  761. transform: uppercase;
  762. text-shadow: 0px 2px 4px #2a4a5c;
  763. }
  764.  
  765. .abt{
  766. overflow: auto;
  767. max-width: 200px;
  768. max-height: 130px;
  769. color: #c5c5c5;
  770. font-family: "Gasara";
  771. font-size: 8px;
  772. text-align: justify;
  773. }
  774.  
  775. .abt b {
  776. color: #2a4a5c;
  777. }
  778. img.btn_close {
  779. float: right;
  780. margin: -5px -5px 0 0;
  781. }
  782.  
  783. *html #fade {
  784. position: absolute;
  785. }
  786. *html .popup_block {
  787. position: absolute;
  788. }
  789. </style>
  790.  
  791. <!-- INFINTIE SCROLL -->
  792. <script type="text/javascript" src="http://codysherman.tumblr.com/tools/infinite-scrolling/code"></script>
  793.  
  794. <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js'></script>
  795. <script type="text/javascript" src="http://static.tumblr.com/7qjmkr5/IUmmdsy41/jquery.style-my-tooltips.js"></script>
  796. <script>
  797. (function($){
  798. $(document).ready(function(){
  799. $("[title]").style_my_tooltips();
  800. });
  801. })(jQuery);
  802. </script>
  803.  
  804. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
  805.  
  806. <script type="text/javascript"
  807. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  808. <script>
  809. $(document).ready(function() {
  810. //
  811. $('a.poplight[href^=#]').click(function() {
  812. var popID = $(this).attr('rel');
  813. var popURL = $(this).attr('href');
  814. var query= popURL.split('?');
  815. var dim= query[1].split('&');
  816. var popWidth = dim[0].split('=')[1];
  817. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"></a>');
  818. var popMargTop = ($('#' + popID).height() + 80) / 2;
  819. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  820.  
  821. $('#' + popID).css({
  822. 'margin-top' : -popMargTop,
  823. 'margin-left' : -popMargLeft
  824. });
  825. $('body').append('<div id="fade"></div>');
  826. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
  827.  
  828. return false;
  829. });
  830. $('a.close, #fade').live('click', function() {
  831. $('#fade , .popup_block').fadeOut(function() {
  832. $('#fade, a.close').remove();
  833. });
  834. return false;
  835. });
  836. });
  837. </script>
  838.  
  839. </head>
  840.  
  841. <body>
  842.  
  843. <div id="kook" class="popup_block">
  844. <div class="tit">GENERAL</div>
  845. <div class="abt">
  846. <b>NAME</b>: <br />
  847. <b>NAME</b>: <br />
  848. <b>NAME</b>: <br />
  849. <b>NAME</b>: <br />
  850. <b>NAME</b>: <br />
  851. <b>NAME</b>: <br />
  852. <b>NAME</b>: <br />
  853. <b>NAME</b>: <br />
  854. <b>NAME</b>: <br />
  855. <b>NAME</b>: <br />
  856. <b>NAME</b>: <br />
  857. </div>
  858. </div>
  859.  
  860. <div id="seol" class="popup_block">
  861. <div class="tit">GENERAL</div>
  862. <div class="abt">
  863. <b>NAME</b>: <br />
  864. <b>NAME</b>: <br />
  865. <b>NAME</b>: <br />
  866. <b>NAME</b>: <br />
  867. <b>NAME</b>: <br />
  868. <b>NAME</b>: <br />
  869. <b>NAME</b>: <br />
  870. <b>NAME</b>: <br />
  871. <b>NAME</b>: <br />
  872. <b>NAME</b>: <br />
  873. <b>NAME</b>: <br />
  874. </div>
  875. </div>
  876.  
  877. <!-- START OF SIDEBAR -->
  878.  
  879. <div id="sidewrap">
  880. <div class="kook"><img src="http://i.imgur.com/1ZJRJfH.png" /></div>
  881. <div class="kookdesc">this is the first desctiption</div>
  882. <div class="kooklnk">
  883. <a href=""><div class="kooklink"></div></a>
  884. <a href=""><div class="kooklink"></div></a>
  885. <a href="#?w=220" rel="kook" class="poplight"><div class="kooklink"></div></a>
  886. </div>
  887. <div class="seol"><img src="http://i.imgur.com/usAJwNT.png" /></div>
  888. <div class="seoldesc">this is the second desctiption</div>
  889. <div class="seollnk">
  890. <a href="#?w=220" rel="seol" class="poplight"><div class="seollink"></div></a>
  891. <a href=""><div class="seollink"></div></a>
  892. <a href=""><div class="seollink"></div></a>
  893. </div>
  894. <div class="sidetitl">epitome of innocence</div>
  895. </div>
  896.  
  897. <div class="alignment">
  898. <div class="autopagerize_page_element">
  899. {block:Posts}
  900. <div class="postcontainer">
  901. {block:ContentSource}
  902. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  903. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  904. {/block:SourceLogo}
  905. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  906.  
  907. <!-- {ReblogParentURL}{block:ReblogParentLogo}<img src="{BlackLogoURL}"
  908. width="{LogoWidth}" height="{LogoHeight}" alt="{ReblogParentTitle}" />
  909. {/block:ReblogParentLogo}
  910. {block:NoReblogParentLogo}{ReblogParentLink}{/block:NoReblogParentLogo} -->
  911. {/block:ContentSource}
  912.  
  913. <!-- PHOTO POSTS -->
  914. {block:Photo}
  915. {LinkOpenTag}
  916. <div class="photopost"><img src="{PhotoURL-250}"></div>
  917. {LinkCloseTag}
  918. {block:ifShowCaptions}
  919. {block:Caption}{Caption}{/block:Caption}
  920. {/block:ifShowCaptions}
  921. {/block:photo}
  922.  
  923. <!-- PHOTOSET POSTS -->
  924. {block:Photoset}
  925. <div id="photoset">{Photoset-250}</div>
  926. {block:ifShowCaptions}
  927. {block:Caption}{Caption}{/block:Caption}
  928. {/block:ifShowCaptions}
  929. {/block:Photoset}
  930.  
  931. <!-- VIDEO POSTS -->
  932. <div class="video">
  933. {block:Video}
  934. {Video-250}
  935. {block:ifShowCaptions}
  936. {block:Caption}{Caption}{/block:Caption}
  937. {/block:ifShowCaptions}
  938. {/block:Video}
  939. </div>
  940.  
  941. <!-- AUDIO POSTS -->
  942. {block:Audio}
  943. <div class="album">
  944. {block:AudioPlayer}
  945. <div class="player">{AudioPlayerBlack}</div>
  946. {/block:AudioPlayer}
  947. {block:AlbumArt}
  948. {block:IndexPage}<img src="{AlbumArtURL}">{/block:IndexPage}
  949. {block:PermalinkPage}<img src="{AlbumArtURL}">{/block:PermalinkPage}
  950. {/block:AlbumArt}
  951. </div>
  952. <div class="track">
  953. {block:TrackName}<b>Title:</b> {TrackName}<br>{/block:TrackName}
  954. {block:Artist}<b>Artist:</b> {Artist}<br>{/block:Artist}
  955. {block:Album}<b>Album:</b>{Album}{/block:Album}
  956. </div>
  957.  
  958. {block:ifShowCaptions}
  959. {block:Indexpage}
  960. {block:Caption}{Caption}{/block:Caption}
  961. {/block:Indexpage}
  962. {/block:ifShowCaptions}
  963.  
  964. {block:PermalinkPage}
  965. {block:Caption}{Caption}{/block:Caption}
  966. {/block:PermalinkPage}
  967. {/block:Audio}
  968.  
  969.  
  970.  
  971. <!-- QUOTE POSTS -->
  972. {block:Quote}
  973. <h2>{Quote}</h2>
  974. {block:Source}<p align="right">{Source}</p>{/block:Source}
  975. {/block:Quote}
  976.  
  977.  
  978. <!-- TEXT POSTS -->
  979. {block:Text}
  980. {block:Title}<div id="posttitle">{Title}</div>{/block:Title}
  981. {Body}
  982. {/block:Text}
  983.  
  984. <!-- QUESTION POSTS -->
  985. {block:Answer}
  986. <div class="question">{Question}</div>
  987. <div class="asker">{Asker}</div>
  988. <div class="answer">{Answer}</div>
  989. {/block:Answer}
  990.  
  991. <!-- CHAT POSTS -->
  992. {block:Chat}
  993. {block:Title}<div id="posttitle">{Title}</div><br />{/block:Title}
  994. {block:Lines}
  995. <div id="{Alt}">
  996. {block:Label}<b>{Label}</b>{/block:Label} {Line}</br>
  997. </div>
  998. {/block:Lines}
  999. {/block:Chat}
  1000.  
  1001. <!-- LINK POSTS -->
  1002. {block:Link}
  1003. <a href="{URL}"><div id="posttitle">{Name}→</div></a>
  1004. {block:Description}{Description}{/block:Description}
  1005. {/block:Link}
  1006. </div>
  1007.  
  1008. <!-- START OF PERMA -->
  1009. <!-- START OF PERMA MAIN -->
  1010. {block:IndexPage}
  1011. <div class="postperma">
  1012. <a href="{Permalink}">{TimeAgo}</a> {block:NoteCount}&middot; <a title="{NoteCount}">notes</a> {/block:NoteCount} {block:RebloggedFrom}&middot; <a href="{ReblogParentURL}" title="{ReblogParentName}">via</a> &middot; <a href="{ReblogRootURL}" title="{ReblogRootName}">src</a>{/block:RebloggedFrom} &middot; <a title="Reblog" href="{ReblogURL}" >reblog</a> {block:HasTags}&middot; <a title="{block:Tags} #{Tag}{/block:Tags}">tags</a>{/block:HasTags}
  1013. </div>
  1014. {/block:IndexPage}
  1015. <!-- END OF PERMA MAIN -->
  1016.  
  1017. <!-- START OF PERMA PAGE -->
  1018. {Block:PermaLinkPage}
  1019. <div class="postinfo">
  1020. <center>
  1021. <div id="posttitle">Posted on: {Month} {DayofMonth}, {Year}.</div>
  1022. {block:RebloggedFrom}<strong>Via:</strong><a href="{ReblogParentURL}">{ReblogParentName}</a> || <strong>Source:</strong> <a href="{ReblogRootURL}">{ReblogRootName}</a>{/block:RebloggedFrom}
  1023. </center>
  1024. <br>
  1025. <div id="tags">{block:Tags}#<a href="{TagURL}">{Tag}</a> &nbsp; {/block:Tags}</div>
  1026. </div>
  1027.  
  1028. {block:PostNotes}<div class="postnotes"><div style="margin-left: -20px;">{PostNotes}</div></div>{/block:PostNotes}
  1029. {/block:PermalinkPage}
  1030. <!-- END OF PERMA PAGE -->
  1031. <!-- END OF PERMA -->
  1032. {/block:Posts}
  1033. </div>
  1034. </div>
  1035. </body></html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement