Advertisement
suqarcoat

Theme #1 by Suqarcoat

Aug 8th, 2013
512
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 25.64 KB | None | 0 0
  1. <!--
  2. Theme 1 by SUQARCOAT.
  3. Keep the credits or at least keep the credit in your FAQ.
  4. Please make sure to keep at least one visible and easy to find form of credit.
  5. If I find out you are using my themes without any credits, you will be blocked and reported.
  6.  
  7. I use a basecode from OUTLASTING.
  8. Hover description is from ALLURINGTRUST.
  9. If there is anything not working on any of my themes please message me politely and I will fix it as soon as possible. Thank you.
  10. -->
  11.  
  12. <html lang="en">
  13. <!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  14. <html xmlns="http://www.w3.org/1999/xhtml">
  15. <head>
  16.  
  17. <link href='http://fonts.googleapis.com/css?family=Parisienne' rel='stylesheet' type='text/css'>
  18.  
  19. <script type="text/javascript">
  20. <!--
  21.  
  22. // Disable Right Click Script
  23.  
  24. function IE(e)
  25. {
  26. if (navigator.appName == "Microsoft Internet Explorer" && (event.button == "2" || event.button == "3"))
  27. {
  28. return false;
  29. }
  30. }
  31. function NS(e)
  32. {
  33. if (document.layers || (document.getElementById && !document.all))
  34. {
  35. if (e.which == "2" || e.which == "3")
  36. {
  37. return false;
  38. }
  39. }
  40. }
  41. document.onmousedown=IE;document.onmouseup=NS;document.oncontextmenu=new Function("return false");
  42.  
  43. //-->
  44. </script>
  45.  
  46.  
  47. <script type="text/javascript"
  48. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  49.  
  50. <!--DEFAULT VARIABLES-->
  51. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  52. <meta name="color:background" content="#fff"/>
  53. <meta name="color:link" content="#777"/>
  54. <meta name="color:text" content="#777"/>
  55. <meta name="color:title" content="#333"/>
  56. <meta name="color:borders" content="#777"/>
  57. <meta name="color:side" content="#ddd"/>
  58. <meta name="color:hover" content="#fff"/>
  59. <meta name="color:blogtitle" content="#aaa"/>
  60. <meta name="color:letter" content="#aaa"/>
  61.  
  62. <meta name="image:flower" content="1"/>
  63. <meta name="image:sidebar" content="1"/>
  64. <meta name="image:sidebar bg 1" content="1"/>
  65. <meta name="image:background" content="1"/>
  66.  
  67. <meta name="text:link one" content="link one"/>
  68. <meta name="text:link one hover" content="one"/>
  69. <meta name="text:link two" content="link two"/>
  70. <meta name="text:link two hover" content="two"/>
  71. <meta name="text:link three" content="link three"/>
  72. <meta name="text:link three hover" content="three"/>
  73. <meta name="text:link four" content="link four"/>
  74. <meta name="text:link four hover" content="four"/>
  75. <meta name="text:link five" content="link five"/>
  76. <meta name="text:link five hover" content="five"/>
  77.  
  78.  
  79. <style type="text/css">
  80.  
  81. #fade { /*--Transparent background layer--*/
  82. display: none; /*--hidden by default--*/
  83. background: #000;
  84. position: fixed; left: 0; top: 0;
  85. width: 100%; height: 100%;
  86. opacity: .37;
  87. z-index: 9999;
  88. }
  89. .popup_block{
  90. display: none; /*--hidden by default--*/
  91. background-color:#fff;
  92. padding: 20px;
  93. border: 6px solid {color:sidebar border2};
  94. border-right: 12px solid {color:sidebar border1};
  95. border-left: 12px solid {color:sidebar border1};
  96. float: left;
  97. border-radius: 55px;
  98. font-family: "calibri";
  99. color: #000;
  100. font-size: 15px;
  101. line-height: 20px;
  102. position: fixed;
  103. top: 45%; left: 50%;
  104. z-index: 9999999999999999999999;
  105. transition: all 0.4s ease-out;
  106. -o-transition-transition: all 0.4s ease-out;
  107. -webkit-transition: all 0.4s ease-out;
  108. -moz-transition: all 0.4s ease-out;
  109. /*--CSS3 Box Shadows--*/
  110. -webkit-box-shadow: 0px 0px 0px #fff;
  111. -moz-box-shadow: 0px 0px 0px #fff;
  112. box-shadow: 0px 0px 0px #000;
  113. /*--CSS3 Rounded Corners--*/
  114. }
  115.  
  116. img.btn_close {
  117. float: right;
  118. margin: -10 -10px 0 0;
  119. }
  120.  
  121.  
  122.  
  123.  
  124. /*--Making IE6 Understand Fixed Positioning--*/
  125.  
  126. *html #fade {
  127.  
  128. position: absolute;
  129.  
  130. }
  131.  
  132. *html .popup_block {
  133.  
  134. position: absolute;
  135.  
  136. }
  137.  
  138.  
  139. .popup_block:hover{
  140. opacity:1;
  141. border-radius: 40px 40px ; 40px 40px;
  142. -webkit-transition: all .5s ease-in-out;
  143. -moz-transition: all .5s ease-in-out;
  144. -o-transition: all .5s ease-in-out;
  145. transition: all .5s ease-in-out;
  146. }
  147.  
  148.  
  149. #s-m-t-tooltip {
  150. max-width:300px;
  151. height: 15px;
  152. line-height:17px;
  153. padding:6px 6px 6px 6px;
  154. margin:20px 0px 0px 20px;
  155. box-shadow:0px 0px 2px #333;
  156. background: {color:link message};
  157. border:3px solid {color:sidebar border1}; /* change the border color */
  158. font-family:ekhlas; /* change the font */
  159. font-size:20px; /* change the font size */
  160. letter-spacing:0px; /* change the letter spacing */ /* can be uppercase, lowercase, none*/
  161. border-radius: 5px;
  162. color:#000; /* change the text color */
  163. z-index:999999999999999999999999999999999999;
  164. }
  165.  
  166.  
  167. iframe#tumblr_controls {right:2px !important; position: fixed !important;-webkit-transition: opacity 0.7s linear;opacity: 0.05;-webkit-transition: all 0.8s ease-out;-moz-
  168.  
  169. transition: all 0.8s ease-out;transition: all 0.8s ease-out;}
  170.  
  171. iframe#tumblr_controls:hover{-webkit-transition: opacity 0.7s linear;opacity: 0.8;-webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;}
  172.  
  173. p {
  174. margin:0px;
  175. margin-top:0px;
  176. }
  177.  
  178.  
  179. body {
  180. padding: 0px;
  181. margin: 0px;
  182. color:{color:text};
  183. font-family:Cambria;
  184. line-height:12px;
  185. font-size:10px;
  186. background-color: {color:Background};
  187. background-image:url({image:Background});
  188. background-attachment: fixed;
  189. background-repeat: repeat;
  190. }
  191.  
  192.  
  193. a:link, a:active, a:visited{
  194. text-decoration: none;
  195. -webkit-transition: color 0.3s ease-out;
  196. -moz-transition: color 0.3s ease-out;
  197. transition: color 0.3s ease-out;
  198. color:{color:link};
  199. }
  200.  
  201. a:hover {
  202. text-decoration: none;
  203. font-style:;
  204. color: {color:Hover};
  205. }
  206.  
  207. div#center{
  208. margin:auto;
  209. position:relative;
  210. width:1000px;
  211. background-color:;
  212. overflow:auto;
  213. overflow-y:hidden;
  214. }
  215.  
  216. ask{
  217. font-family:'Parisienne', cursive;
  218. text-align: right;
  219. margin-top: 10px;
  220. margin-left: 5px;
  221. font-size:16px;
  222. color: #ddd;
  223. line-height: 5px;
  224. }
  225.  
  226. askk {
  227. font-family:'Parisienne', cursive;
  228. text-align: center;
  229. font-size:23px;
  230. color: {color:name};
  231. line-height: 5px;
  232. text-shadow: 1.5px 1px #ddd;
  233. }
  234.  
  235.  
  236. /*CUSTOMIZE ENTRY SETTINGS HERE*/
  237. .entry {
  238. float:left;
  239. display: block;
  240. margin:8px;
  241. padding:10px;
  242. padding-bottom:7px;
  243. overflow:hidden;
  244. width:220px;
  245. box-shadow:0px 0px 2px {color:box shadows};
  246. {block:PermalinkPage}
  247. width:450px;
  248. text-align:left;
  249. line-height:13px;
  250. {/block:PermalinkPage}
  251. background:white;
  252. background-image:URL();
  253. }
  254.  
  255.  
  256. /*CUSTOMIZE THE APPEARANCE OF PERMALINKS*/
  257. .entry .perma{
  258. width:196px;
  259. height:11px;
  260. margin-left:0px;
  261. position: absolute;
  262. line-height: 11px;
  263. overflow:hidden;
  264. padding:12px;
  265. padding-top:5px;
  266. text-align:center;
  267. top:-11px;
  268. border:1px solid {color:borders};
  269. font-family:Calibri;
  270. text-transform:uppercase;
  271. font-size:8px;
  272. border-top:0px;
  273. border-left:0px;
  274. border-right:0px;
  275. background:white;
  276. word-spacing:2px;
  277. letter-spacing:1px;
  278. opacity: 0.0;
  279. -webkit-transition: all .7s ease;
  280. -moz-transition: all .7s ease;
  281. -o-transition: all .7s ease;
  282. transition: all .7s ease;
  283.  
  284. }
  285.  
  286. .entry:hover .perma{
  287. overflow:visible;
  288. opacity:1.0;
  289. height:11px;
  290. top:0px;
  291. border-bottom:3px solid {color:borders};
  292. }
  293.  
  294.  
  295. /*CUSTOMIZE POST POSITIONING AND STUFFZ HERE*/
  296. #posts {
  297. width:780px;
  298. margin-top:18px;
  299. z-index:99;
  300. margin-left:220px;
  301. right:auto;
  302. background:transparent;
  303. margin-right:auto;
  304. position:relative;
  305. overflow-y: hidden;
  306. line-height:16px;
  307. -webkit-animation:fadeInDown 2s;
  308. -moz-animation:fadeInDown 2s;
  309. -ms-animation:fadeInDown 2s;
  310. }
  311.  
  312.  
  313. /*CUSTOMIZE SIDEBAR HERE*/
  314. #sidebar{
  315. position:fixed !important;
  316. width: auto;
  317. background: white;
  318. margin-top:135px;
  319. margin-left:-110px;
  320. padding:10px;
  321. opacity:.9;
  322. z-index:99;
  323. border:4px double #ddd;
  324. text-align: center;
  325. -webkit-transition: all .7s ease;
  326. -moz-transition: all .7s ease;
  327. -o-transition: all .7s ease;
  328. transition: all .7s ease;
  329. }
  330. #sidebar:hover{
  331. opacity:1;
  332. }
  333.  
  334. div#description{
  335. position:fixed !important;
  336. opacity:0;
  337. text-align:justify;
  338. line-height:16px;
  339. width: 199px;
  340. height: 316px;
  341. font-family:calibri;
  342. font-size: 11px;
  343. letter-spacing:px;
  344. color:#aaa;
  345. padding: 15px;
  346. padding-top: 10px;
  347. margin-top: 0px;
  348. padding-right: 70px;
  349. margin-left: 10px;
  350. padding-left: 10px;
  351. border: 4px #fff solid;
  352. background-color: #f7f7f7;
  353. transition: all 0.9s ease-out;
  354. -o-transition-transition: all 0.9s ease-out;
  355. -webkit-transition: all 0.9s ease-out;
  356. -moz-transition: all 0.9s ease-out;
  357. }
  358.  
  359. #description:first-letter {
  360. width:24px;
  361. height:29px;
  362. padding:5px;
  363. margin-bottom:-5px;
  364. margin-right:8px;
  365. float:left;
  366. background-color:{color:letter};
  367. color:#fff;
  368. font-family:'Parisienne', cursive;
  369. font-size:26px;
  370. font-style:italic;
  371. line-height:29px;
  372. text-transform:uppercase;
  373. text-align:center;
  374. border: 3px #fff solid;
  375. }
  376.  
  377. #sidebar:hover #description{
  378. opacity: 1;
  379. margin-left: 0px;
  380. transition: all 0.9s ease-out;
  381. -o-transition-transition: all 0.9s ease-out;
  382. -webkit-transition: all 0.9s ease-out;
  383. -moz-transition: all 0.9s ease-out;
  384. }
  385.  
  386. #link1{
  387. position:fixed;
  388. display:inline-block;
  389. width:34px;
  390. height:10px;
  391. padding:5px;
  392. padding-left:5px;
  393. font-family:Cambria;
  394. font-size:12px;
  395. line-height:10px;
  396. margin-left:-15px;
  397. margin-top:370px;
  398. border:4px double #ddd;
  399. text-transform:uppercase;
  400. text-align:center;
  401. background:white;
  402. -webkit-transition: opacity .7s linear;
  403. -webkit-transition: all .7s ease-in-out;
  404. -moz-transition: all .7s ease-in-out;
  405. -o-transition: all .7s ease-in-out;
  406. }
  407.  
  408. #link2{
  409. position:fixed;
  410. display:inline-block;
  411. width:34px;
  412. height:10px;
  413. padding:5px;
  414. padding-left:5px;
  415. font-family:Cambria;
  416. font-size:12px;
  417. line-height:10px;
  418. margin-left:50px;
  419. margin-top:370px;
  420. border:4px double #ddd;
  421. text-transform:uppercase;
  422. text-align:center;
  423. background:white;
  424. -webkit-transition: opacity .7s linear;
  425. -webkit-transition: all .7s ease-in-out;
  426. -moz-transition: all .7s ease-in-out;
  427. -o-transition: all .7s ease-in-out;
  428. }
  429.  
  430. #link3{
  431. position:fixed;
  432. display:inline-block;
  433. width:34px;
  434. height:10px;
  435. padding:5px;
  436. padding-left:5px;
  437. font-family:Cambria;
  438. font-size:12px;
  439. line-height:10px;
  440. margin-left:115px;
  441. margin-top:370px;
  442. border:4px double #ddd;
  443. text-transform:uppercase;
  444. text-align:center;
  445. background:white;
  446. -webkit-transition: opacity .7s linear;
  447. -webkit-transition: all .7s ease-in-out;
  448. -moz-transition: all .7s ease-in-out;
  449. -o-transition: all .7s ease-in-out;
  450. }
  451.  
  452. #link4{
  453. position:fixed;
  454. display:inline-block;
  455. width:34px;
  456. height:10px;
  457. padding:5px;
  458. padding-left:5px;
  459. font-family:Cambria;
  460. font-size:12px;
  461. line-height:10px;
  462. margin-left:180px;
  463. margin-top:370px;
  464. border:4px double #ddd;
  465. text-transform:uppercase;
  466. text-align:center;
  467. background:white;
  468. -webkit-transition: opacity .7s linear;
  469. -webkit-transition: all .7s ease-in-out;
  470. -moz-transition: all .7s ease-in-out;
  471. -o-transition: all .7s ease-in-out;
  472. }
  473.  
  474. #link5{
  475. position:fixed;
  476. display:inline-block;
  477. width:34px;
  478. height:10px;
  479. padding:5px;
  480. padding-left:5px;
  481. font-family:Cambria;
  482. font-size:12px;
  483. line-height:10px;
  484. margin-left:245px;
  485. margin-top:370px;
  486. border:4px double #ddd;
  487. text-transform:uppercase;
  488. text-align:center;
  489. background:white;
  490. -webkit-transition: opacity .7s linear;
  491. -webkit-transition: all .7s ease-in-out;
  492. -moz-transition: all .7s ease-in-out;
  493. -o-transition: all .7s ease-in-out;
  494. }
  495.  
  496. #blogtitle{
  497. position:fixed;
  498. margin-top:-82px;
  499. font-family:'Parisienne', cursive;
  500. font-size:60px;
  501. line-height:66px;
  502. margin-left:-20px;
  503. width:310px;
  504. text-align:center;
  505. padding:20px;
  506. padding-left:0px;
  507. padding-right:0px;
  508. z-index:9999999;
  509. color:{color:blogtitle};
  510. }
  511.  
  512. #flower{
  513. position:fixed;
  514. margin-left:200px;
  515. margin-top:220px;
  516. z-index:9999;
  517. }
  518.  
  519. div#side{
  520. opacity: 0.3;
  521. width:40px;
  522. position:fixed !important;
  523. text-align:center;
  524. top:-2px;
  525. height:1025px;
  526. margin-left:1080px;
  527. background: {color:side};
  528. border: 1px solid #ddd;
  529. box-shadow: 0px 0px 7px #ddd;
  530. -webkit-animation:fadeInDownBig 3s;
  531. -moz-animation:fadeInDownBig 3s;
  532. -ms-animation:fadeInDownBig 3s;
  533. -webkit-transition: all 0.5s ease;
  534. -moz-transition: all 0.5s ease;
  535. -o-transition: all 0.5s ease;
  536. }
  537.  
  538. .lace{
  539. background: url('http://static.tumblr.com/onnk3od/DF1moey55/merpderp.png') repeat;
  540. width:3000px;
  541. height:17px;
  542. top:0px;
  543. margin-left:-200px;
  544. position:fixed;
  545. z-index:120;
  546. z-index:999999999999999999999;
  547. }
  548.  
  549. .sidebarbg1{
  550. position:fixed;
  551. margin-left:1160px;
  552. top: 0px;
  553. background: #;
  554. background-image:url({image:sidebar bg 1});
  555. height: 100%;
  556. opacity:0.8;
  557. width:10px;
  558. border-right: 5px solid #000;
  559. box-shadow: 0px 0px 5px #000;
  560. opacity:5;
  561. border-bottom:3px solid #fff;
  562. border-left: 3px solid #fff;
  563. border-right: 3px solid #fff;
  564. -webkit-transition: all .7s ease;
  565. -moz-transition: all .7s ease;
  566. -o-transition: all .7s ease;
  567. transition: all .7s ease;
  568. }
  569.  
  570.  
  571. #lala{
  572. width:auto;
  573. position:fixed;
  574. top:580px;
  575. left:0px;
  576. -webkit-transition: all .7s ease;
  577. -moz-transition: all .7s ease;
  578. -o-transition: all .7s ease;
  579. transition: all .7s ease;
  580. }
  581.  
  582. #lalala{
  583. font-size:12px;
  584. font-family:arial;
  585. line-height:16px;
  586. text-align:center;
  587. height:15px;
  588. margin-top:33px;
  589. width:5px;
  590. padding:5px;
  591. padding-right:10px;
  592. background:#ffffff;
  593. margin-left:0px;
  594. position:fixed;
  595. -webkit-transition: all .7s ease;
  596. -moz-transition: all .7s ease;
  597. -o-transition: all .7s ease;
  598. transition: all .7s ease;
  599. border:1px solid #eee;
  600. }
  601.  
  602. #lalalala{
  603. text-align:center;
  604. width:100px;
  605. font-size:10px;
  606. background:#ffffff;
  607. height:5px;
  608. padding-top:10px;
  609. padding-bottom:10px;
  610. font-family:calibri;
  611. text-transform:uppercase;
  612. margin-left:-100px;
  613. margin-top:33px;
  614. position:fixed;
  615. -webkit-transition: all .7s ease;
  616. -moz-transition: all .7s ease;
  617. -o-transition: all .7s ease;
  618. transition: all .7s ease;
  619. border:1px solid #eee;
  620. line-height:5px;
  621. }
  622.  
  623. #lala:hover #lalala{
  624. margin-left:100px;
  625. }
  626.  
  627. #lala:hover #lalalala{
  628. margin-left:0px;
  629. }
  630.  
  631. /*CUSTOMIZE TITLE OF ENTRIES HERE*/
  632. .title{
  633. line-height: 22px;
  634. color:{color:Title};
  635. font-family:'Parisienne', cursive;
  636. font-size:22px;
  637. font-weight: normal;
  638. }
  639.  
  640.  
  641. /*CUSTOMIZE PERMALINKS OF TEXT POSTS AND SUCH HERE*/
  642. .permalink{
  643. text-transform: uppercase;
  644. display: block;
  645. text-align: right;
  646. text-decoration: none;
  647. font-size:8px;
  648. font-style: italic;
  649. }
  650.  
  651. /*I RECCOMMEND TO NOT TOUCH ANY OF THIS LOLz*/
  652. #infscr-loading{
  653. bottom: -70px;
  654. position: absolute;
  655. left: 50%;
  656. margin-left:-8px;
  657. width:16px;
  658. height:11px;
  659. overflow:hidden;
  660. margin-bottom: 50px;
  661. }
  662.  
  663. #postnotes{
  664. text-align: justify;}
  665.  
  666. #postnotes blockquote{
  667. border: 0px;}
  668.  
  669. blockquote{
  670. padding:0px 0px 2px 5px;
  671. margin:0px 0px 2px 10px;
  672. border-left: 1px dotted #555555;
  673. }
  674.  
  675. blockquote p, ul{
  676. margin:0px;
  677. padding:0px;
  678. }
  679.  
  680. a img{border: 0px;}
  681.  
  682.  
  683. ::-webkit-scrollbar-thumb{
  684. background-color: {color:scrollbar};
  685. border: 2px solid white;
  686. height:auto;
  687. -moz-border-radius: 10px;
  688. border-radius: 10px;
  689. }
  690.  
  691. ::-webkit-scrollbar {
  692. height:3px;
  693. width:3px;
  694. background-color:#aaa;
  695. }
  696.  
  697.  
  698.  
  699.  
  700. ul, ol, li{list-style:none; margin:0px; padding:0px;}
  701.  
  702. .user_1 .label, .user_2 .label, .user_3 .label, .user_4 .label, .user_5 .label, .user_6 .label,
  703. .user_7 .label, .user_8 .label, .user_9 .label {color:{color:text};}
  704.  
  705. .notes img{width:10px; position:relative; top:3px;}
  706. <--ses-->
  707. small{font-size: 90%;}
  708.  
  709. @-webkit-keyframes fadeInDown {
  710. 0% {
  711. opacity: 0;
  712. -webkit-transform: translateY(-20px);
  713. }
  714. 100% {
  715. opacity: 1;
  716. -webkit-transform: translateY(0);
  717. }
  718. }
  719. @-moz-keyframes fadeInDown {
  720. 0% {
  721. opacity: 0;
  722. -moz-transform: translateY(-20px);
  723. }
  724. 100% {
  725. opacity: 1;
  726. -moz-transform: translateY(0);
  727. }
  728. }
  729. @-ms-keyframes fadeInDown {
  730. 0% {
  731. opacity: 0;
  732. -ms-transform: translateY(-20px);
  733. }
  734. 100% {
  735. opacity: 1;
  736. -ms-transform: translateY(0);
  737. }
  738. }
  739. @-o-keyframes fadeInDown {
  740. 0% {
  741. opacity: 0;
  742. -ms-transform: translateY(-20px);
  743. }
  744. 100% {
  745. opacity: 1;
  746. -ms-transform: translateY(0);
  747. }
  748. }
  749. @keyframes fadeInDown {
  750. 0% {
  751. opacity: 0;
  752. transform: translateY(-20px);
  753. }
  754. 100% {
  755. opacity: 1;
  756. transform: translateY(0);
  757. }
  758. }
  759. .fadeInDown {
  760. -webkit-animation-name: fadeInDown;
  761. -moz-animation-name: fadeInDown;
  762. -ms-animation-name: fadeInDown;
  763. -o-animation-name: fadeInDown;
  764. animation-name: fadeInDown;
  765. }
  766.  
  767. @-webkit-keyframes bounceIn {
  768. 0% {
  769. opacity: 0;
  770. -webkit-transform: scale(.3);
  771. }
  772. 50% {
  773. opacity: 1;
  774. -webkit-transform: scale(1.05);
  775. }
  776. 70% {
  777. -webkit-transform: scale(.9);
  778. }
  779. 100% {
  780. -webkit-transform: scale(1);
  781. }
  782. }
  783. @-moz-keyframes bounceIn {
  784. 0% {
  785. opacity: 0;
  786. -moz-transform: scale(.3);
  787. }
  788. 50% {
  789. opacity: 1;
  790. -moz-transform: scale(1.05);
  791. }
  792. 70% {
  793. -moz-transform: scale(.9);
  794. }
  795. 100% {
  796. -moz-transform: scale(1);
  797. }
  798. }
  799. @-ms-keyframes bounceIn {
  800. 0% {
  801. opacity: 0;
  802. -ms-transform: scale(.3);
  803. }
  804. 50% {
  805. opacity: 1;
  806. -ms-transform: scale(1.05);
  807. }
  808. 70% {
  809. -ms-transform: scale(.9);
  810. }
  811. 100% {
  812. -ms-transform: scale(1);
  813. }
  814. }
  815. @-o-keyframes bounceIn {
  816. 0% {
  817. opacity: 0;
  818. -o-transform: scale(.3);
  819. }
  820. 50% {
  821. opacity: 1;
  822. -o-transform: scale(1.05);
  823. }
  824. 70% {
  825. -o-transform: scale(.9);
  826. }
  827. 100% {
  828. -o-transform: scale(1);
  829. }
  830. }
  831. @keyframes bounceIn {
  832. 0% {
  833. opacity: 0;
  834. transform: scale(.3);
  835. }
  836. 50% {
  837. opacity: 1;
  838. transform: scale(1.05);
  839. }
  840. 70% {
  841. transform: scale(.9);
  842. }
  843. 100% {
  844. transform: scale(1);
  845. }
  846. }
  847. .bounceIn {
  848. -webkit-animation-name: bounceIn;
  849. -moz-animation-name: bounceIn;
  850. -ms-animation-name: bounceIn;
  851. -o-animation-name: bounceIn;
  852. animation-name: bounceIn;
  853. }
  854.  
  855. @-webkit-keyframes fadeInUpBig {
  856. 0% {
  857. opacity: 0;
  858. -webkit-transform: translateY(2000px);
  859. }
  860.  
  861. 100% {
  862. opacity: 1;
  863. -webkit-transform: translateY(0);
  864. }
  865. }
  866.  
  867. @-moz-keyframes fadeInUpBig {
  868. 0% {
  869. opacity: 0;
  870. -moz-transform: translateY(2000px);
  871. }
  872.  
  873. 100% {
  874. opacity: 1;
  875. -moz-transform: translateY(0);
  876. }
  877. }
  878.  
  879. @-o-keyframes fadeInUpBig {
  880. 0% {
  881. opacity: 0;
  882. -o-transform: translateY(2000px);
  883. }
  884.  
  885. 100% {
  886. opacity: 1;
  887. -o-transform: translateY(0);
  888. }
  889. }
  890.  
  891. @keyframes fadeInUpBig {
  892. 0% {
  893. opacity: 0;
  894. transform: translateY(2000px);
  895. }
  896.  
  897. 100% {
  898. opacity: 1;
  899. transform: translateY(0);
  900. }
  901. }
  902.  
  903. .fadeInUpBig {
  904. -webkit-animation-name: fadeInUpBig;
  905. -moz-animation-name: fadeInUpBig;
  906. -o-animation-name: fadeInUpBig;
  907. animation-name: fadeInUpBig;
  908. }
  909.  
  910. @-webkit-keyframes fadeInDownBig {
  911. 0% {
  912. opacity: 0;
  913. -webkit-transform: translateY(-2000px);
  914. }
  915.  
  916. 100% {
  917. opacity: 1;
  918. -webkit-transform: translateY(0);
  919. }
  920. }
  921.  
  922. @-moz-keyframes fadeInDownBig {
  923. 0% {
  924. opacity: 0;
  925. -moz-transform: translateY(-2000px);
  926. }
  927.  
  928. 100% {
  929. opacity: 1;
  930. -moz-transform: translateY(0);
  931. }
  932. }
  933.  
  934. @-ms-keyframes fadeInDownBig {
  935. 0% {
  936. opacity: 0;
  937. -ms-transform: translateY(-2000px);
  938. }
  939.  
  940. 100% {
  941. opacity: 1;
  942. -ms-transform: translateY(0);
  943. }
  944. }
  945.  
  946. @-o-keyframes fadeInDownBig {
  947. 0% {
  948. opacity: 0;
  949. -o-transform: translateY(-2000px);
  950. }
  951.  
  952. 100% {
  953. opacity: 1;
  954. -o-transform: translateY(0);
  955. }
  956. }
  957.  
  958. @keyframes fadeInDownBig {
  959. 0% {
  960. opacity: 0;
  961. transform: translateY(-2000px);
  962. }
  963.  
  964. 100% {
  965. opacity: 1;
  966. transform: translateY(0);
  967. }
  968. }
  969.  
  970. @mixin fadeInDownBig($duration, $delay, $function, $fill, $visibility) {
  971. -webkit-animation-name: fadeInDownBig;
  972. -moz-animation-name: fadeInDownBig;
  973. -ms-animation-name: fadeInDownBig;
  974. -o-animation-name: fadeInDownBig;
  975. animation-name: fadeInDownBig;
  976. @include duration($duration);
  977. @include delay($delay);
  978. @include function($function);
  979. @include fill-mode($fill);
  980. @include visibility($visibility);
  981. }
  982.  
  983. {CustomCSS}
  984.  
  985. </style>
  986.  
  987. {block:IndexPage}
  988. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/iBElrgjim/jquerymasonry.js"></script>
  989. <script type="text/javascript" src="http://static.tumblr.com/dbek3sy/Qyblrgjfn/jqueryinfintescroll.js"></script>
  990. <a href="http://www.suqarcoat.tumblr.com"><img src="http://i50.tinypic.com/3325qp0.png" style="position:fixed; right:3px; opacity:.6; top:27px;z-index:99999;-webkit-filter: invert(100%)"></a>
  991.  
  992. <script type="text/javascript">
  993. $(window).load(function(){
  994. var $wall = $('#posts');
  995. $wall.imagesLoaded(function(){
  996. $wall.masonry({
  997. itemSelector: '.entry, .entry_photo',
  998. isAnimated : false
  999. });
  1000. });
  1001.  
  1002. $wall.infinitescroll({
  1003. navSelector : '#pagination',
  1004. nextSelector : '#pagination a',
  1005. itemSelector : '.entry, .entry_photo',
  1006. bufferPx : 2000,
  1007. debug : false,
  1008. errorCallback: function() {
  1009. $('#infscr-loading').fadeOut('normal');
  1010. }},
  1011. function( newElements ) {
  1012. var $newElems = $( newElements );
  1013. $newElems.hide();
  1014. $newElems.imagesLoaded(function(){
  1015. $wall.masonry( 'appended', $newElems,{isAnimated: false}, function(){$newElems.fadeIn('slow');} );
  1016. });
  1017. }); $('#posts').show(500);
  1018. });
  1019. </script>
  1020.  
  1021.  
  1022. {/block:IndexPage}
  1023.  
  1024.  
  1025. <title>{title}</title>
  1026.  
  1027. <link rel="shortcut icon" href="{Favicon}" />
  1028. <meta name="viewport" content="width=820" />
  1029. </head>
  1030.  
  1031. <body>
  1032. <BODY onselectstart="return false;" ondragstart="return false;">
  1033. <div class="wrapper">
  1034. <div class="header">
  1035. </div>
  1036.  
  1037. <div id="cage">
  1038. <div class="sidebarbg1"></div>
  1039. <div id="center">
  1040.  
  1041. <!--STUFF THAT GOES INTO THE SIDEBAR-->
  1042. <div id="sidebar">
  1043.  
  1044. <div id="blogtitle">{title}</div>
  1045.  
  1046. <div id="side">{side}</div>
  1047.  
  1048. <div id="flower"><img src="{image:flower}" width=120px></div>
  1049.  
  1050. <div id="description">{description}</div>
  1051.  
  1052. <center>
  1053.  
  1054. <div id="link1"><a href="{text:link one}" title="{text:link one hover}">Home</a></div>
  1055.  
  1056. <div id="link2"><a href="{text:link two}" title="{text:link two hover}">Inbox</a></div>
  1057.  
  1058. <div id="link3"><a href="{text:link three}" title="{text:link three hover}">Etc</a></div>
  1059.  
  1060. <div id="link4"><a href="{text:link four}" title="{text:link four hover}">Mine</a></div>
  1061.  
  1062. <div id="link5"><a href="http://suqarcoat.tumblr.com" title="Credit"> Cred</a></div>
  1063.  
  1064. <a href="/"><img src="{image:sidebar}" style="width:283px; height: 348px;"></a>
  1065.  
  1066. </center>
  1067.  
  1068. </div>
  1069. <!------------------------------------->
  1070.  
  1071. <div class="lace"></div>
  1072.  
  1073. <div class="left">
  1074. <div id="posts">
  1075. {block:Posts}
  1076. <div class="entry">
  1077.  
  1078.  
  1079. {block:Answer}
  1080. <div style="margin-top:2px;;margin-bottom:0px;min-height:30px; padding: 4px; background-color:;border-bottom:1px solid #ddd;border-left:4px double #ddd;border-radius:0px;">
  1081. <a href="{AskerURL}"><img src="{AskerPortraitURL-30}" width="30" align="left" style="margin-right:3.5px;"/></a><ask>{asker}</ask>: {Question}</div>
  1082. <div style="margin-top:2px; line-height:11px;margin-bottom:4px; background: transparent;">{Answer}</div>
  1083. <div class="permalink"> <a href="{permalink}">{notecountwithlabel}</a> </div>
  1084. {/block:Answer}
  1085.  
  1086. {block:Text}{block:Title}<span class="title">{Title}</span>{/block:Title}<span class="body">{Body}</span><p align=right><span class="permalink"><a
  1087.  
  1088. href="{Permalink}"><a href="{Permalink}"><a href="{Permalink}">{notecountwithlabel}</a></a><br>{/block:HasTags}</span></align>
  1089. {/block:Text}
  1090.  
  1091. {block:Link}<a href="{URL}" class="title">{Name}</a>{block:Description}<div class="body">{Description}</div>{/block:Description} <p align=right><span
  1092.  
  1093. class="permalink"><a href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}"></span></align>{block:Link}
  1094.  
  1095. {block:Photo}
  1096. {block:IndexPage}
  1097. <center>
  1098. <div class="perma">
  1099. posted at {12Hour}:{Minutes} {AmPm} on {DayOfWeek}<br>
  1100. with <a href="{permalink}">{notecountwithlabel}</a> - <a href="{reblogurl}">reblog this post</a> </span></div>
  1101.  
  1102. <div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  1103. {/block:IndexPage}
  1104. {block:PermalinkPage}
  1105. {LinkOpenTag}<div class="photo"><a href="{permalink}"><img class="photo" src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></a></div>
  1106.  
  1107. {LinkCloseTag}
  1108. {/block:PermalinkPage}
  1109. {/block:Photo}
  1110.  
  1111. {block:Photoset}
  1112. {block:IndexPage}
  1113. <center>
  1114.  
  1115. <div class="perma">
  1116. <a href="{ReblogURL}" target="_blank"> reblog </a> </div>
  1117.  
  1118. {Photoset-250}</center>
  1119. {/block:IndexPage}
  1120. {block:PermalinkPage}
  1121. <center>
  1122. {Photoset-500}</center>
  1123. {/block:PermalinkPage}
  1124. {/block:Photoset}
  1125.  
  1126. {block:Quote}<span class="title">"{Quote}"</span> — {block:Source}<b>{Source}</b>{/block:Source}<br><p align=right><span class="permalink"><a
  1127.  
  1128. href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}"> </span>{/block:Quote}
  1129.  
  1130. {block:Chat}{block:Title}<span class="title">{Title}</span>{/block:Title}
  1131. <ul class="chat">
  1132. {block:Lines}
  1133. <li class="user_{UserNumber}">
  1134. {block:Label}
  1135. <span class="label">{Label}</span>
  1136. {/block:Label}
  1137.  
  1138. {Line}
  1139. </li>
  1140. {/block:Lines}
  1141. <p align=right><span class="permalink"><a href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}">
  1142. {/block:Chat}
  1143.  
  1144. {block:Audio}
  1145. <div style="width:200px; height:30px;">
  1146. {AudioPlayerBlack}
  1147. </div>
  1148. {block:IndexPage}<span class="permalink">
  1149. <p align=right><span class="permalink"><a href="{Permalink}">{notecountwithlabel}</a> <a href="{Permalink}"> </a>
  1150. </span>{/block:IndexPage}
  1151. {/block:Audio}
  1152.  
  1153. {block:Video}
  1154. {block:IndexPage}
  1155. <center>
  1156. <div class="perma">
  1157. <a href="{ReblogURL}" target="_blank"> reblog </a> </div>
  1158. {Video-250}</center>
  1159. {/block:IndexPage}
  1160. {block:PermalinkPage}
  1161. <center>
  1162. {Video-400}</center>
  1163. {/block:PermalinkPage}
  1164. {block:Video}
  1165.  
  1166.  
  1167. {block:PostNotes}<div align="middle">{caption}</div>
  1168. <center>
  1169.  
  1170. {block:NoteCount}{NoteCountWithLabel}<br>{/block:NoteCount}
  1171.  
  1172. {block:HasTags}
  1173. tags: {block:Tags}<a href="{TagURL}">{Tag}. </a>{/block:Tags}<br> {/block:HasTags}
  1174. {block:RebloggedFrom}
  1175. reblogged from <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
  1176. posted by <a href="{ReblogRootURL}">{ReblogRootName}</a>
  1177.  
  1178. {/block:RebloggedFrom}
  1179. </center></span>
  1180. <br>
  1181. <div id="postnotes">{PostNotes}</div><br>
  1182.  
  1183. <center>{block:ContentSource}
  1184. <br><a href="{SourceURL}">
  1185. {lang:Source}:
  1186. {block:SourceLogo}
  1187. <img src="{BlackLogoURL}" width="{LogoWidth}"
  1188. height="{LogoHeight}" alt="{SourceTitle}" />
  1189. {/block:SourceLogo}
  1190. {block:NoSourceLogo}
  1191. {SourceLink}
  1192. {/block:NoSourceLogo}
  1193. </a>
  1194. {/block:ContentSource}</center>
  1195.  
  1196. {/block:PostNotes}
  1197. </div>
  1198. {/block:Posts}
  1199. </div></div>
  1200.  
  1201. {block:IndexPage}
  1202. {block:Pagination}
  1203. <div id="pagination">
  1204. {block:NextPage}
  1205. <a id="nextPage" href="{NextPage}"></a>
  1206. {/block:NextPage}
  1207. {block:PreviousPage}
  1208. <a href="{PreviousPage}"></a>
  1209. {/block:PreviousPage}
  1210. </div>
  1211. {/block:Pagination}
  1212. {/block:IndexPage}
  1213. </body>
  1214.  
  1215. <html>
  1216. </object>
  1217. <div id="lala"><div id="lalala">♥</div>
  1218. <div id="lalalala">
  1219. <a href="http://suqarcoat.tumblr.com">Theme Credit</a>
  1220. </div></div>
  1221.  
  1222. <div style="position:fixed;right:2px;top:26px;z-index:9999; fadeIn(2);">
  1223. <a href="http://suqarcoat.tumblr.com" target="_blank">
  1224.  
  1225. </a>
  1226. </div>
  1227. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement