Advertisement
helloiloveju

#5 Wake Up Stiles

Feb 15th, 2014
6,612
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 27.15 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.  
  5. <!----
  6. W A K E U P S T I L E S
  7. theme #5 by
  8. helloiloveju.tumblr.com
  9. DO NOT REMOVE CREDIT!
  10. feel free to edit
  11. e n j o y !
  12. & don't remove this comment
  13. --->
  14.  
  15. <script type="text/javascript"
  16. src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  17. <script>
  18. $(document).ready(function() {
  19. $('a.poplight[href^=#]').click(function() {
  20. var popID = $(this).attr('rel');
  21. var popURL = $(this).attr('href');
  22. var query= popURL.split('?');
  23. var dim= query[1].split('&');
  24. var popWidth = dim[0].split('=')[1];
  25. $('#' + popID).fadeIn().css({ 'width': Number( popWidth ) }).prepend('<a href="#" class="close"><img src="http://25.media.tumblr.com/tumblr_marvbbzNI81qd6op7o1_100.jpg" class="btn_close" title="Close Window" alt="Close" /></a>');
  26. var popMargTop = ($('#' + popID).height() + 80) / 2;
  27. var popMargLeft = ($('#' + popID).width() + 80) / 2;
  28. $('#' + popID).css({
  29. 'margin-top' : -popMargTop,
  30. 'margin-left' : -popMargLeft });
  31. $('body').append('<div id="fade"></div>');
  32. $('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();
  33. return false;});
  34. $('a.close, #fade').live('click', function() {
  35. $('#fade , .popup_block').fadeOut(function() {
  36. $('#fade, a.close').remove(); //fade them both out
  37. });
  38. return false;});
  39. });
  40. </script>
  41.  
  42.  
  43. <!-- DEFAULT VARIABLES -->
  44. <title>{Title}</title>
  45. <link rel="shortcut icon" href="{favicon}">
  46. <meta name="color:background" content="#ffffff" />
  47. <meta name="color:text" content="#000000" />
  48. <meta name="color:link" content="#000000" />
  49. <meta name="color:link hover" content="#000000" />
  50. <meta name="color:blackcircle" content="#000000" />
  51. <meta name="color:blackcircletext" content="#ffffff" />
  52. <meta name="color:tabs1" content="#000000" />
  53. <meta name="color:tabs2" content="#888888" />
  54. <meta name="color:tabs1 bg" content="#ffffff" />
  55. <meta name="color:tabs2 bg" content="#ffffff" />
  56. <meta name="color:tags" content="#000000" />
  57. <meta name="color:tags bg" content="#888888" />
  58. <meta name="color:tags hover" content="#ffffff" />
  59. <meta name="color:navi" content="#000000" />
  60. <meta name="color:navi hover" content="#000000" />
  61. <meta name="color:navi bg" content="#ffffff" />
  62. <meta name="color:tags" content="#000000" />
  63. <meta name="color:blockquote" content="#000000" />
  64. <meta name="color:pagination" content="#000000" />
  65. <meta name="color:maintitle1" content="#ffffff" />
  66. <meta name="color:maintitle2" content="#ffffff" />
  67.  
  68. <meta name="image:titleimage" content=""/>
  69. <meta name="image:sidebar" content=""/>
  70. <meta name="image:background" content=""/>
  71.  
  72. <meta name="if:Timestamps" content="0"/>
  73.  
  74. <meta name="text:blackdot" content="help"/>
  75. <meta name="text:Maintitle1" content="wake up stiles"/>
  76. <meta name="text:Maintitle2" content="if you ever get sad"/>
  77. <meta name="text:Maintitle3" content="just think of a tyrannosaurus trying to masturbate"/>
  78.  
  79. <meta name="text:Naviname1" content="home"/>
  80. <meta name="text:Navilink1" content="/"/>
  81. <meta name="text:Naviname2" content="about me"/>
  82. <meta name="text:Navilink2" content="http://yourblog.tumblr.com/example"/>
  83. <meta name="text:Naviname3" content="about me"/>
  84. <meta name="text:Navilink3" content="http://yourblog.tumblr.com/example"/>
  85. <meta name="text:Naviname4" content="watchlist"/>
  86. <meta name="text:Navilink4" content="http://yourblog.tumblr.com/example"/>
  87. <meta name="text:Naviname5" content="wolves"/>
  88. <meta name="text:Navilink5" content="http://yourblog.tumblr.com/example"/>
  89. <meta name="text:Naviname6" content="graphics"/>
  90. <meta name="text:Navilink6" content="http://yourblog.tumblr.com/example"/>
  91. <meta name="text:Naviname7" content="howlings"/>
  92. <meta name="text:Navilink7" content="http://yourblog.tumblr.com/example"/>
  93. <meta name="text:Naviname8" content="daily me"/>
  94. <meta name="text:Navilink8" content="http://yourblog.tumblr.com/example"/>
  95. <meta name="text:Naviname9" content="taglist"/>
  96. <meta name="text:Navilink9" content="http://yourblog.tumblr.com/example"/>
  97. <meta name="text:Naviname10" content="ask"/>
  98. <meta name="text:Navilink10" content="http://yourblog.tumblr.com/example"/>
  99.  
  100.  
  101.  
  102. <meta name="text:tab1label" content="about me"/>
  103. <meta name="text:tab1headline" content="just in case you want to know"/>
  104. <meta name="text:tab2label" content="more +"/>
  105. <meta name="text:tab2headline" content="sayings"/>
  106. <meta name="text:tab2content" content="you're killing people...to death!, You mean like: hey dad! Derek Hale's in my room..bring your gun, am I attractive to gay guys?, no, a body of water. yes, dumbass, a dead body!, Come on, if I have to, I'll chain you up myself on full moon nights and feed you, live, mice. I had a boa once. I can do it. "/>
  107. <meta name="text:tab3label" content="rec"/>
  108. <meta name="text:tab3headline" content="nogitsune"/>
  109. <meta name="text:tab3content" content="I'm friends with the monster that's under my bed Get along with the voices inside of my head You're trying to save me, stop holding your breath And you think I'm crazy, yeah, you think I'm crazy
  110. Now, I ain't much of a poet but I know somebody once told me To seize the moment and don't squander it 'Cause you never know when it all could be over tomorrow So I keep conjuring, sometimes I wonder where these thoughts spawn from (Yeah, pondering'll do you wonders. No wonder you're losing your mind the way it wanders.)"/>
  111.  
  112. <link href='http://fonts.googleapis.com/css?family=Montserrat:700' rel='stylesheet' type='text/css'>
  113. <style type="text/css">
  114.  
  115. body {
  116. background: {color:background};
  117. background-image : url('{image:background}');
  118. background-repeat : repeat;
  119. background-attachment : fixed;
  120. font: 11px arial;
  121. line-height:14px;
  122. color: {color:text};}
  123.  
  124. a {text-decoration:underline;
  125. color :{color:link};
  126. padding:1px;
  127. font-style:italic;}
  128.  
  129. a:hover {
  130. color:{color:link hover};
  131. text-decoration:none;}
  132.  
  133. a img {
  134. border: none;}
  135.  
  136. b, strong {font-weight : bold;}
  137.  
  138. i, em {font-style : italic;}
  139.  
  140. strike, s {text-decoration: line-through #434340;}
  141.  
  142. u{
  143. color:{color:text};
  144. line-height: 12px;
  145. font-weight: normal;
  146. font: 11px arial;
  147. letter-spacing:1px;
  148. text-transform: uppercase;
  149. font-weight:600;
  150. text-decoration;none;}
  151.  
  152. h1 {
  153. color:{color:text};
  154. line-height: 12px;
  155. font-weight: normal;
  156. font: 11px arial;
  157. letter-spacing:1px;
  158. text-transform: uppercase;
  159. font-weight:600;}
  160.  
  161. h2 {
  162. font-family : inconsolata;
  163. font-style:normal;
  164. font-weight:400;
  165. font-size : 11px;
  166. text-transform : uppercase;
  167. padding : 5px;
  168. margin-bottom : 10px;}
  169.  
  170. .link1{color:{color:tags};text-transform:uppercase;border-radius:3px;padding:1px 8px; font-size:7px;font-family:arial;text-decoration:none;}
  171.  
  172. .link1:hover{color:{color:tags hover}; background-color:{color:tags bg};text-decoration:none;}
  173.  
  174. #titless{
  175. position:fixed;
  176. top:155px;
  177. left:120px;
  178. text-decoration:none;}
  179.  
  180. .maintitle1 {
  181. font:35px 'Montserrat';
  182. letter-spacing:5px;
  183. line-height:14px;
  184. text-transform:uppercase;
  185. color: {color:maintitle1};
  186. text-align: center;
  187. z-index:999999;
  188. text-decoration:none;
  189. text-shadow: 1px 1px 1px #000;}
  190.  
  191. .maintitle2 {
  192. font: 7px arial;
  193. letter-spacing:1px;
  194. text-transform:uppercase;
  195. color: {color:maintitle2};
  196. text-align: center;
  197. margin-left:-10px;
  198. font-style:italic;
  199. text-shadow: 1px 1px 1px #000;}
  200.  
  201. blockquote {
  202. color:{color:text};
  203. padding:3px 5px 3px 5px;
  204. margin:0px 5px 5px 0px;
  205. border-left:1px solid {color:blockquote};
  206. font: 11px arial;}
  207.  
  208. blockquote img {
  209. display : block;}
  210.  
  211. blockquote p {
  212. padding : 0;
  213. margin : 0;}
  214.  
  215. blockquote blockquote {
  216. position : relative;
  217. margin-top : 5px;
  218. margin-left : 5px;
  219. padding-right : 0;}
  220.  
  221.  
  222. /**********************************************************Grundgerüst*/
  223. #bg{
  224. position:fixed;
  225. top:0;
  226. left:50px;
  227. width:540px;
  228. height:auto;
  229. z-index:-9999999999999999999999999;
  230. }
  231.  
  232. #hintergrund {position:fixed;
  233. top:0;
  234. left:0px;
  235. width:490px;
  236. height:350px;
  237. z-index:-999;}
  238.  
  239. #sidebar {position:fixed;
  240. top:300px;
  241. left:50px;
  242. width:465px;
  243. height:500px;}
  244.  
  245. #sideleft{float:left;
  246. width:230px;
  247. height:500px;}
  248.  
  249. #sideright{float:right;
  250. width:230px;
  251. height:500px;}
  252.  
  253. #entry {
  254. width : 500px;
  255. display : block;
  256. margin : 20px 3px 3px 2px;}
  257.  
  258. #entries {
  259. width : 500px;
  260. display : block;
  261. margin : 20px 0px 0px 3px;}
  262.  
  263. #post{
  264. margin-left: 620px;
  265. margin-top:6px;
  266. width:506px;}
  267.  
  268.  
  269.  
  270. /******************************Sidebar Specials*********/
  271.  
  272. /*PAGINATION SIDEBAR*/
  273. #pagination {
  274. position:relative;
  275. width: 200px;
  276. height: 30px;
  277. top:0;
  278. left:5px;
  279. padding-top: 20px;
  280. word-spacing: 6px;
  281. text-align: center;
  282. font-family: arial;
  283. font-size: 7px;
  284. font-style:italic;
  285. color:{color:pagination};}
  286.  
  287. .jump_page {
  288. padding: 3px;}
  289.  
  290. .current_page {
  291. padding: 3px;
  292. color: {color:pagination};
  293. opacity:0.7;}
  294.  
  295. #pagination a, a:visited {
  296. padding: 3px;
  297. color: {color:pagination};
  298. text-decoration: none;}
  299.  
  300. #pagination a:hover {
  301. padding: 3px;
  302. text-decoration: none;
  303. font-weight: bold;}
  304.  
  305.  
  306. /*************************************************stiles navi*********/
  307. #stiles{
  308. position:fixed;
  309. left:385px;
  310. top:470px;
  311. text-align:center;
  312. text-align:block;}
  313.  
  314. .stiles a {
  315. display:block;
  316. font-family: 'arial';
  317. font-size: 7px;
  318. text-transform:uppercase;
  319. padding-top:9px;
  320. padding-bottom:9px;
  321. padding-left:7px;
  322. padding-right:7px;
  323. width:50px;
  324. background-color:{color:navi bg};
  325. letter-spacing: 1px;
  326. color: {color:navi};
  327. margin-top: 3px;
  328. text-decoration:none;}
  329.  
  330. .stiles a:hover {
  331. color:{color:navi hover};
  332. font-weight:600;
  333. text-decoration:none;}
  334.  
  335. /**HOVER POST**/
  336.  
  337. .hovercontainer {
  338. width: auto;
  339. height:auto;
  340. position: relative;
  341. top: 70px;
  342. right: 15px;
  343. float: right;
  344. z-index: 1;
  345. opacity: 0;
  346. -webkit-transition: all 0.6s ease-in;
  347. -moz-transition: all 0.6s ease-in;
  348. -o-transition: all 0.6s ease-in;}
  349.  
  350. .hovercontainer2 {
  351. text-align: center;
  352. padding:10px;
  353. line-height: 120%;
  354. -webkit-transition: all 0.6s ease-in;
  355. -moz-transition: all 0.6s ease-in;
  356. -o-transition: all 0.6s ease-in;
  357. background-color: hsla(0,0%,0%,0.6);}
  358.  
  359. .blacks:hover .hovercontainer {
  360. opacity: 1;}
  361. /******************************************tags*/
  362.  
  363. #taggs {
  364. font:7px 'arial';
  365. font-style:italic;
  366. line-height:13px;
  367. margin-left:5px;
  368. padding-top:3px;
  369. margin-top:-5px;
  370. letter-spacing:1px;
  371. padding:1px; }
  372.  
  373. .tags1 {
  374. font-weight: uppercase;
  375. letter-spacing: 1px;
  376. text-align: center;
  377. margin-top: 20px;
  378. }
  379.  
  380. .tags2 {
  381. text-align: center;
  382. margin-bottom: 90px;}
  383.  
  384.  
  385.  
  386. /*ask*/
  387. .asp {float:left; margin-right: 10px;}
  388. .asn {width: 24px; height: 24px; border: 6px solid #fff;margin:20px;margin-top:0;}
  389.  
  390. .asker {
  391. width: 485px;
  392. font-size: 7px;
  393. font-family: 'times new roman';
  394. text-transform:uppercase;
  395. width: 100%;
  396. background-color: #000;
  397. color:#fff;
  398. line-height:9px;
  399. padding-top:15px;
  400. letter-spacing:2px;
  401. font-weight:600;}
  402.  
  403. .asker img{
  404. float:left;
  405. border-bottom:5px solid #fff;}
  406.  
  407. .asker a{
  408. font-size: 7px;
  409. font-family: 'times new roman';
  410. text-transform:uppercase;
  411. width: 100%;
  412. background-color: #000;
  413. color:#fff;
  414. line-height:9px;
  415. padding-top:15px;
  416. letter-spacing:2px;
  417. font-weight:600;
  418. text-decoration:none;}
  419.  
  420. .question {
  421. padding-bottom:0px;
  422. padding-top:5px;
  423. font-family:'times new roman';
  424. min-height:39px;
  425. font-size:10px;
  426. background-color:#000;
  427. color:#fff;}
  428.  
  429. .answer {
  430. margin: 3px 0 0 20px;
  431. font-family:times new roman;
  432. font-size:9px;
  433. line-height:115%;
  434. padding:0 10px 0 15px;
  435. border-left:1px solid #000;}
  436.  
  437. .answer img {
  438. max-width: 470px;}
  439.  
  440.  
  441.  
  442. /******quote**/
  443. .quote{background-color: #000;
  444. color:#fff;
  445. padding:40px;
  446. font-family:times new roman;
  447. font-size:10px;}
  448.  
  449.  
  450.  
  451. /*audio*/
  452. #player {
  453. width:26px;
  454. height:30px;
  455. overflow:hidden;
  456. position:absolute;
  457. margin-top:7px;
  458. text-align: center;
  459. margin-bottom:5px;
  460. margin-left: 2px;
  461. padding-left: 5px;
  462. opacity: 0.7;
  463. filter:alpha(opacity=70);
  464. -moz-opacity: 0.7;
  465. -khtml-opacity: 0.7;
  466. z-index: 3;}
  467.  
  468. #playerbg{ width:40px;
  469. height:40px;
  470. margin-top:36px;
  471. margin-left:37px;
  472. margin-bottom:40px;
  473. opacity: 0.7;
  474. -moz-opacity: 0.7;
  475. -khtml-opacity: 0.7;
  476. position:absolute;
  477. z-index: 2;}
  478.  
  479. #albumart {
  480. width: 100px;
  481. float:left;
  482. margin:5px 7px 0px 7px;
  483. z-index: 1;
  484. position:absolute;}
  485.  
  486.  
  487.  
  488. /***audio links feld mit text****/
  489.  
  490. .atext {
  491. font-family: arial;
  492. font-size: 8px;
  493. line-height: 7px;
  494. letter-spacing: 2px;
  495. color: {color:navu};
  496. margin-top: 5px;
  497. margin-left: 101px;
  498. text-transform:;
  499. height:18px;
  500. text-decoration: none;
  501. display: block;
  502. padding: 20px 5px 41px 6px;
  503. width:350px;
  504. text-align:center;}
  505.  
  506.  
  507. iframe#tumblr_controls {
  508. top: 0%;
  509. right:0%;
  510. position: fixed;}
  511.  
  512. .source img {
  513. margin-top:2px;
  514. margin-left:1px;
  515. margin-bottom:1px;
  516. border:4px solid {color:background};}
  517.  
  518.  
  519.  
  520. /**chat***/
  521. ul.chat {
  522. width:497px;
  523. margin:0;
  524. padding:0;}
  525.  
  526. .chat li {
  527. list-style-type: none;
  528. padding: 10px;}
  529.  
  530. .chat li.odd {
  531. background-color:{color:Background};
  532. color: {color:Text};
  533. border-top: 1px solid #eee;
  534. border-left: 1px solid #eee;
  535. border-right: 1px solid #eee;}
  536.  
  537. .chat li.even {
  538. border-top: 1px solid #eee;
  539. border-left: 1px solid #eee;
  540. border-right: 1px solid #eee;
  541. color: #000;}
  542.  
  543. .chat li:last-child {border-bottom: 1px solid #eee;;}
  544.  
  545. .label {
  546. text-transform:uppercase;
  547. font-weight: bold;
  548. letter-spacing:1px;}
  549.  
  550. /*****************************************************TABS*************/
  551.  
  552. .tabs {
  553. position: relative;
  554. width: 228px;}
  555.  
  556. .tabs input {
  557. position: absolute;
  558. z-index: 1000;
  559. width: 100px;
  560. height: 20px;
  561. left: 0px;
  562. top: 0px;
  563. opacity: 0;
  564. -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  565. filter: alpha(opacity=0);
  566. cursor: pointer;}
  567.  
  568. .tabs input#tab-2{
  569. left: 0px;}
  570.  
  571. .tabs input#tab-3{
  572. left: 0px;}
  573.  
  574. .tabs label {position: relative;
  575. display: block;
  576. height: 30px;
  577. width: 76px;
  578. padding: 0px;
  579. float: left;
  580. color: {color:tabs2};
  581. background-color:{color:tabs2 bg};
  582. text-align: center;
  583. font-family:arial;
  584. font-size: 7px;
  585. font-style:italic;
  586. text-transform:uppercase;
  587. letter-spacing:1px;
  588. line-height: 30px;}
  589.  
  590. .tabs label:after {
  591. content: '';
  592. position: absolute;
  593. bottom: -2px;
  594. left: 0;
  595. width: 100%;
  596. height: 2px;
  597. display: block;}
  598.  
  599. .tabs input:hover + label {
  600. color:#000;}
  601.  
  602. .tabs label:first-of-type {
  603. z-index: 4;}
  604.  
  605. .tab-label-2 {
  606. z-index: 3;}
  607.  
  608. .tab-label-3 {
  609. z-index: 2;}
  610.  
  611. .tabs input:checked + label {
  612. z-index: 6;
  613. -webkit-animation: page 0.2s linear;
  614. -moz-animation: page 0.2s linear;
  615. -ms-animation: page 0.2s linear;
  616. -o-animation: page 0.2s linear;
  617. animation: page 0.2s linear;}
  618.  
  619. .clear-shadow { clear: both;}
  620.  
  621. .content {position: relative;
  622. background: {color:tabs1 bg};
  623. width: 100%;
  624. height: 275px;
  625. z-index: 5;
  626. overflow: hidden;}
  627.  
  628. .content div {
  629. position: absolute;
  630. top: 0;
  631. padding: 15px 20px 5px 20px;
  632. z-index: 1;
  633. opacity: 0;
  634. -webkit-transition: all linear 0.3s;
  635. -moz-transition: all linear 0.3s;
  636. -o-transition: all linear 0.3s;
  637. -ms-transition: all linear 0.3s;
  638. transition: all linear 0.3s;}
  639.  
  640. .content-1, .content-3 {
  641. -webkit-transform: translateX(-250px);
  642. -moz-transform: translateX(-250px);
  643. -o-transform: translateX(-250px);
  644. -ms-transform: translateX(-250px);
  645. transform: translateX(-250px);}
  646.  
  647. .content-2, {
  648. -webkit-transform: translateX(250px);
  649. -moz-transform: translateX(250px);
  650. -o-transform: translateX(250px);
  651. -ms-transform: translateX(250px);
  652. transform: translateX(250px);}
  653.  
  654. .tabs input.tab-selector-1:checked ~ .content .content-1,
  655. .tabs input.tab-selector-2:checked ~ .content .content-2,
  656. .tabs input.tab-selector-3:checked ~ .content .content-3 {
  657. -webkit-transform: translateX(0px);
  658. -moz-transform: translateX(0px);
  659. -o-transform: translateX(0px);
  660. -ms-transform: translateX(0px);
  661. transform: translateX(0px);
  662. z-index: 100;
  663. -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  664. filter: alpha(opacity=100);
  665. opacity: 1;
  666. -webkit-transition: all ease-out 0.2s 0.1s;
  667. -moz-transition: all ease-out 0.2s 0.1s;
  668. -o-transition: all ease-out 0.2s 0.1s;
  669. -ms-transition: all ease-out 0.2s 0.1s;
  670. transition: all ease-out 0.2s 0.1s;}
  671.  
  672. .content div h2{color:{color:tabs1}; font: 11px arial;letter-spacing:1px;margin:0 0 0 -3px; line-height:10px;font-weight:600;}
  673.  
  674. .content div h3{color:{color:tabs1}; font: 10px times new roman;margin:0; line-height:13px;}
  675.  
  676.  
  677. @keyframes "page" {0% {left: 0;} 50% {left: 10px;} 100% { left: 0;}}
  678.  
  679. @-moz-keyframes page { 0% {left: 0;} 50% {left: 10px;} 100% {left: 0;}}
  680.  
  681. @-webkit-keyframes "page" { 0% {left: 0;} 50% {left: 10px;} 100% {left: 0;}}
  682.  
  683. @-ms-keyframes "page" {0% {left: 0;}50% {left: 10px;} 100% {left: 0;}}
  684.  
  685. @-o-keyframes "page" {0% {left: 0;} 50% {left: 10px;} 100% {left: 0;}}
  686.  
  687. /*****************************************************ROUND*************/
  688. .box{position:relative;
  689. top:20px;left:60px;font-style:italic;}
  690.  
  691. .blackhole{
  692. position:absolute;
  693. top:12.5px;left:12.5px;
  694. height:58px;
  695. width:100px;
  696. padding:42px 0 0 0;
  697. border-radius:100px;
  698. opacity:0;
  699. text-align:center;
  700. font-style:italic;
  701. font: 14px arial, helvetica;
  702. background:{color:blackcircle};
  703. color:{color:blackcircletext};
  704. -webkit-transition:all .7s ease; -moz-transition:all .7s ease; -o-transition:all .7s ease;}
  705.  
  706. .box:hover .blackhole{
  707. opacity:1;}
  708.  
  709. .port img{
  710. width:125px;
  711. height:125px;
  712. border-radius:125px;}
  713.  
  714.  
  715.  
  716. </style>
  717. <style type="text/css">{CustomCSS}</style>
  718. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/8mXm7q8vn/jquery.js"></script>
  719. <script type="text/javascript" src="http://static.tumblr.com/bmdsqsc/ogWm7q8w1/lazyload.js"></script>
  720. <script type="text/javascript" charset="utf-8">
  721. var $j = jQuery.noConflict();
  722. $j(function() {
  723. if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
  724. $j("img").lazyload({
  725. placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
  726. effect: "fadeIn",
  727. });
  728. });
  729. </script>
  730. </head>
  731. <body>
  732.  
  733.  
  734. <div id="bg"><img src="{image:titleimage}" width="500" height="280">
  735. <div id="titless">
  736. <div class="maintitle2" style="margin-top:35px;">{text:Maintitle2}</div>
  737. <a href="/" style="text-decoration:none"border="0"><div class="maintitle1">{text:Maintitle1}</div></a>
  738. <div class="maintitle2">{text:Maintitle3}</div>
  739. </div></div>
  740. <div id="hintergrund"></div>
  741. <div id="sidebar">
  742. <div id="sideleft">
  743.  
  744. <!----------Tab Slider-->
  745. <section class="tabs">
  746. <input id="tab-1" type="radio"
  747. name="radio-set" class="tab-selector-1" checked="checked" />
  748. <input id="tab-2" type="radio"
  749. name="radio-set" class="tab-selector-2" />
  750. <input id="tab-3" type="radio"
  751. name="radio-set" class="tab-selector-3" />
  752. <div class="clear-shadow"></div>
  753. <div class="content">
  754.  
  755. <div class="content-2">
  756. <h2>{text:tab2headline}<br>_</h2>
  757. <h3>{text:tab2content}</h3></div>
  758.  
  759. <div class="content-1">
  760. <h2>{text:tab1headline}<br>_</h2>
  761. <h3>{Description}
  762. </h3></div>
  763.  
  764. <div class="content-3">
  765. <h2>{text:tab3headline}<br>_</h2>
  766. <h3>{text:tab3content}
  767. </h3></div>
  768. </div>
  769.  
  770. <label for="tab-1" class="tab-label-1"> {text:tab1label} </label>
  771. <label for="tab-2" class="tab-label-2"> {text:tab2label} </label>
  772. <label for="tab-3" class="tab-label-3"> {text:tab3label} </label>
  773. <div class="clear-shadow"></div>
  774. </section>
  775.  
  776. <div id="pagination" >{block:Pagination}
  777. {block:PreviousPage}
  778. <a class="jump_page" href="{PreviousPage}" style="margin-right:30px;">&larr;</a>
  779. {/block:PreviousPage}
  780.  
  781. {block:JumpPagination length="3"}
  782. {block:CurrentPage}
  783. <span class="current_page">{PageNumber}</span>
  784. {/block:CurrentPage}
  785.  
  786. {block:JumpPage}
  787. <a class="jump_page" href="{URL}">{PageNumber}</a>
  788. {/block:JumpPage}
  789. {/block:JumpPagination}
  790. of {TotalPages}
  791.  
  792. {block:NextPage}
  793. <a class="jump_page" href="{NextPage}" style="margin-left:30px;">&rarr;</a>
  794. {/block:NextPage}
  795. {/block:Pagination}</div>
  796.  
  797.  
  798. </div><!---End sideleft-->
  799.  
  800. <div id="sideright">
  801.  
  802. <!-- animated round box -->
  803. <div class="box">
  804. <div class="port"><img src="{image:sidebar}">
  805. <div class="blackhole">{text:blackdot}</div></div>
  806.  
  807. <!--stiles navigation -->
  808. <div id="stiles"><div class="stiles">
  809. <div style="margin-left:-45px;">
  810. <a href="{text:Navilink1}">{text:Naviname1}</a>
  811. <a href="{text:Navilink3}">{text:Naviname3}</a>
  812. <a href="{text:Navilink5}">{text:Naviname5}</a>
  813. <a href="{text:Navilink7}">{text:Naviname7}</a>
  814. <a href="{text:Navilink9}">{text:Naviname9}</a>
  815. </div></div></div>
  816. <div id="stiles"><div class="stiles">
  817. <div style="margin-left:25px;">
  818. <a href="{text:Navilink2}">{text:Naviname2}</a>
  819. <a href="{text:Navilink4}">{text:Naviname4}</a>
  820. <a href="{text:Navilink6}">{text:Naviname6}</a>
  821. <a href="{text:Navilink8}">{text:Naviname8}</a>
  822. <a href="{text:Navilink10}"> {text:Naviname10} </a>
  823. </div></div>
  824. </div>
  825.  
  826.  
  827. </div>
  828.  
  829.  
  830.  
  831.  
  832. </div>
  833.  
  834. </div> </div>
  835.  
  836. <!-- content -->
  837. <div id="post">
  838. {block:Posts}
  839. <div id="entries">
  840.  
  841.  
  842. {block:Text}
  843. <div id="entry" style="padding :8px;">
  844. {block:Title}
  845. <h1>{title}</h1>{/block:Title}{Body}
  846. </div>
  847. {/block:Text}
  848.  
  849. {block:Photo}
  850. <div class="blacks">
  851. <div class="hovercontainer"></div>
  852. <div class="hovercontainer"><div style="margin-top:-52px;"><div class="hovercontainer2">{LikeButton size="13"}<br> {ReblogButton size="13"} </div></div></div>
  853. <a href="{Permalink}"><img src="{PhotoURL-500}"></a>
  854. {block:Caption}<div style="padding-left :8px;">{Caption}</div>{/block:Caption}</div>
  855. {/block:Photo}
  856.  
  857. {block:Photoset}
  858. <div class="blacks">
  859. <div class="hovercontainer"></div>
  860. <div class="hovercontainer"><div style="margin-top:-52px;"><div class="hovercontainer2">{LikeButton size="13"}<br> {ReblogButton size="13"} </div></div></div>
  861. <div id="entries">
  862. {Photoset-500}
  863. {block:Caption}<div style="padding-left :8px;">{Caption}</div>{/block:Caption}</div></div>
  864. {/block:Photoset}
  865.  
  866. {block:ContentSource}
  867. <!-- {SourceURL}{block:SourceLogo}<img src="{BlackLogoURL}"
  868. width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
  869. {/block:SourceLogo}
  870. {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
  871. {/block:ContentSource}
  872.  
  873. {block:Quote}
  874. <div id="entry" style="padding: 8px;">
  875. <div class="quote">{quote}<br><p align="right">{block:Source}<font style="font-weight: bold; text-transform: uppercase; color: #fff; line-height: 7px; letter-spacing: 3pt; text-transform:uppercase;padding-right:5px;font:7px times new roman;font-weight:600;">&mdash; {Source}</font></p>{/block:Source}</div>
  876. {/block:Quote}
  877.  
  878. {block:Link}
  879. <div id="entry" style="padding : 8px;">
  880. <div class="h1"><a href="{URL}" title="{name}"><h1>{name}</h1></a></div>{block:Description}<blockquote>{Description}</blockquote>{/block:Description}
  881. </div>
  882. {/block:Link}
  883.  
  884. {block:Chat}
  885. {block:Title}
  886. <h3><a href="{Permalink}">{Title}</a></h3>
  887. {/block:Title}
  888. <ul class="chat">
  889. {block:Lines}
  890. <li class="{Alt} user_{UserNumber}">
  891. {block:Label}
  892. <span class="label">{Label}</span>
  893. {/block:Label}
  894. {Line}
  895. </li>
  896. {/block:Lines}
  897. </ul>
  898. {/block:Chat}
  899.  
  900. {block:Audio}
  901. <div id="entry" style="padding : 8px;">
  902. <div id="playerbg">
  903. <div id="player">{AudioPlayerWhite}</div>
  904. </div>
  905. <div id="albumart">{block:AlbumArt}<img src="{AlbumArtURL}" width="100">{/block:AlbumArt}</div>
  906. <span class="atext"><font style="FONT-WEIGHT: normal; COLOR: {color:title}; font:normal 15px {font:body}">♫ {block:TrackName}{TrackName}{/block:TrackName}</font><br>
  907. <FONT style="FONT-WEIGHT: normal; FONT-SIZE: 5pt; TEXT-TRANSFORM: uppercase; COLOR: {color:link}; font-style:; LINE-HEIGHT: 8pt; LETTER-SPACING: 1pt; text-transform:;">{block:Artist}by: {Artist}{/block:Artist} {block:PlayCount}played {PlayCount} times{/block:PlayCount}<br> {block:Album}
  908. Album: {Album}{/block:Album}</font></span>
  909. <br><br>{block:Caption}<blockquote>{Caption}</blockquote>{/block:Caption}
  910. </div>{/block:Audio}
  911.  
  912. {block:Answer}
  913. <div id="entry" style="padding: 8px;">
  914. <div id="question">
  915. <div class="asker">
  916. <table cellspacing="0" cellpadding="0" class="asp"><tr><td><div class="asn"><img src="{AskerPortraitURL-24}"></div></td><td style="vertical-align: top"></td></tr></table>
  917. &nbsp;{Asker}</div>
  918. <div class="question">{Question}</div>
  919. </div>
  920. <div class="answer">{Answer}</div>
  921. </div>
  922. {/block:Answer}
  923.  
  924. {block:Video}
  925. <div id="entry" style="padding: 8px;">
  926. {Video-500}
  927. <div class="padding">{block:Caption}{Caption}{/block:Caption}</div>
  928. </div>
  929. {/block:Video}
  930.  
  931.  
  932. <!-- tags and info -->
  933. <br>
  934. <div id="taggs">
  935. <div class="tags1">
  936. {block:Text} {LikeButton size="13"}{/block:Text}
  937. {block:Panorama} {LikeButton size="13"}{/block:Panorama}
  938. {block:Quote} {LikeButton size="13"}{/block:Quote}
  939. {block:Link} {LikeButton size="13"}{/block:Link}
  940. {block:Chat} {LikeButton size="13"}{/block:Chat}
  941. {block:Audio} {LikeButton size="13"}{/block:Audio}
  942. {block:Video} {LikeButton size="13"}{/block:Video}
  943. {block:Answer} {LikeButton size="13"}{/block:Answer}
  944. <a class="link1" href="{Permalink}">{block:NoteCount}{Notecount} notes{/block:NoteCount}</a>&nbsp;&nbsp;
  945. {block:RebloggedFrom}<a class="link1" href="{ReblogParentURL}">VIA</a> / <a class="link1" href="{ReblogRootURL}">©</a>
  946. <a class="link1" href="{ReblogURL}">REBLOG</a>{/block:RebloggedFrom}
  947. {block:IfTimestamps}{block:Date}<br><a class="link1" href="{Permalink}">{DayOfMonth}{DayOfMonthSuffix} of {Month}, {Year} {24Hour}:{Minutes}:{Seconds}</a> {/block:Date}{/block:IfTimestamps}
  948.  
  949.  
  950.  
  951.  
  952. </div>
  953.  
  954.  
  955. <div class="tags2">{block:HasTags} <div class="taggedi"> {block:Tags}<span class="taghead" style="margin-top:-5px;"> <a class="link1" href="{TagURL}">{Tag}</a></span>{/block:Tags} </div>{/block:HasTags}
  956. </div>
  957. </div>
  958.  
  959. {block:PostNotes}
  960. {PostNotes}
  961. {/block:PostNotes}
  962. </div>
  963. {/block:Posts}
  964. </div>
  965. <div style="position:fixed;font:12px arial;color:#000;text-decoration:none;bottom:10px;left:10px;text-shadow:0;font-weight:300;"><a href="http://helloiloveju.tumblr.com/" border="0" style="text-decoration:none;font-weight:300;">©</a></div>
  966. </body>
  967. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement