View difference between Paste ID: pWtFi2Cw and mEfX1shq
SHOW: | | - or go back to the newest paste.
1
<!--  
2
 
3
   ✧* 。♡  Heathens theme | @planthed | @themekid ♡ 。*✧  
4
5
 
6
— Do not delete the credit.
7
— Do not copy or steal any code.
8
— Do not claim as yours.
9
                          
10
Enjoy (✿◠‿◠) 
11
12
infinite scroll with masonry + pxu: @shythemes 
13
-->
14
 
15
<html lang="en">
16
<head>
17
18
19
<title>{Title}</title>
20
<link rel="shortcut icon" href="{favicon}">
21
<link rel="alternate" type="application/rss+xml" href="{RSS}">
22
{block:hidden}
23
<!--Default Variables-->
24
<meta name="image:background" content=""/>
25
 
26
<meta name="color:Background" content="#ffffff"/>
27
<meta name="color:Link" content="#000000"/>
28
<meta name="color:Text" content="#000000"/>
29
<meta name="color:Title" content="#000000"/>
30
31
<meta name="color:Accent" content="#BDC0DA"/>
32
<meta name="color:Accent text" content="#000000"/>
33
<meta name="color:Borders" content="#BDC0DA"/>
34
35
<meta name="text:Blogtitle" content="" />
36
<meta name="text:Home label" content="home" />
37
<meta name="text:Ask label" content="ask"/>
38
<meta name="text:Archive label" content="Past" />
39
<meta name="text:Extra link 1 title" content="" />
40
<meta name="text:Extra link 1" content="http://" />
41
<meta name="text:Extra link 2 title" content="" />
42
<meta name="text:Extra link 2" content="http://" />
43
44
<meta name="if:White Tiny cursor" content="" />
45
<meta name="if:Black Tiny cursor" content="" />
46
47
48
{/block:hidden}
49
50
51
<!---pxu script--->
52
<link href="http://static.tumblr.com/qudkd6d/OcDnl99gb/style.css" rel="stylesheet" type="text/css"/>
53
54
<!--- tooltips script --->
55
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
56
<script src="http://static.tumblr.com/iuw14ew/VSQma1786/jquery.style-my-tooltips.js"></script>
57
<script>
58
(function($){
59
$(document).ready(function(){
60
$("a[title]").style_my_tooltips({
61
tip_follows_cursor:true,
62
tip_delay_time:90,
63
tip_fade_speed:600,
64
attribute:"title"
65
});
66
});
67
})(jQuery);
68
</script>
69
70
71
<!-------
72
 
73
A FEW RULES YOU NEED TO KNOW BEFORE START EDITING THE THEME:
74
 
75
 > You CAN'T use my themes as base
76
 > You CAN'T remove my credits, even if you edited the theme a lot.
77
 > Don't use any part of my codes without permission.
78
 > You can edit the theme as your own like and make it look too different as the original one but if you edit the theme a lot and you're having problems with it, I'll not allowed to help you.
79
 
80
 
81
YOU ARE NOT ALLOWED TO USE MY CODES FOR YOUR OWN THEME OR ANY OTHER THEME
82
BY OTHER THEME MAKER WITHOUT PERMISSION, IF YOU WANNA USE ONE OF MY CODES
83
ASK FIRST, DON'T CLAIM AS YOURS, DON'T BE A BITCH.
84
 
85
---------->
86
87
	
88
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
89
90
<script> 
91
$(document).ready(function(){
92
    $(".show").click(function(){
93
        $(".notas").slideToggle("slow");
94
    });
95
});
96
</script>
97
98
<style type="text/css">
99
100
101
.video, .video iframe{
102
display:block;
103
{block:indexpage}
104
width:230px; 
105
height:auto;
106
{/block:indexpage}
107
{block:PermalinkPage}
108
width:500px;
109
height:auto;
110
{/block:PermalinkPage}
111
}
112
113
/*tooltips style*/
114
#s-m-t-tooltip{
115
max-width:300px;
116
padding:7px;
117
min-height:7px;
118
margin:20px 0px 0px 20px;
119
line-height:100%;
120
border:1px solid {color:borders};
121
background:#fff;
122
word-wrap:break-word;
123
word-break:break-all;
124
opacity:1;
125
z-index:9999999999999999999;
126
}
127
128
129
 #tumblr_controls, .tmblr-iframe{
130
position:fixed!important;
131
top:25px!important; 
132
right:4px!important; 
133
opacity:.9;
134
z-index:99999999999999999999999999!important; 
135
-webkit-filter:invert(100%); 
136
-moz-filter:invert(100%); 
137
-o-filter:invert(100%); 
138
-ms-filter:invert(100%);
139
filter:invert(100%);  
140
-webkit-transition:all 0.6s ease-out;
141
-webkit-transition: opacity 0.7s linear;
142
-webkit-transition: all 0.8s ease-out;
143
-moz-transition: all 0.8s ease-out;
144
transition: all 0.8s ease-out
145
 }
146
 
147
  #tumblr_controls, .tmblr-iframe:hover{
148
      opacity:.9;webkit-transition: all 0.4s ease-out;-moz-transition: all 0.4s ease-out;transition: all 0.4s ease-out;
149
-webkit-transition:all 0.6s ease-out;-webkit-filter:invert(80%); -moz-filter:invert(80%); -o-filter:invert(80%); -ms-filter:invert(80%); filter:invert(80%);
150
  }
151
152
153
/*tumblr controls and lightbox*/
154
155
156
   
157
#tumblr_lightbox,.tmblr-lightbox{
158
background:rgba({RGBcolor:background}, 0.8)!important;}
159
   
160
#vignette,#tumblr_lightbox_caption,.vignette,.lightbox-caption{
161
opacity:0!important;
162
}
163
 
164
#tumblr_lightbox_center_image, #tumblr_lightbox_left_image, #tumblr_lightbox_right_image, .lightbox-image {
165
box-shadow:none!important;
166
border-radius:0px!important;
167
padding:0px!important;
168
background:{color:post background}!important;
169
border:0px solid {color:border}!important;
170
}
171
172
::-webkit-scrollbar{
173
height:3px;
174
width:11px;
175
background:inherit;
176
background:rgba({RGBcolor:Accent}, 0.4);
177
border:5px solid {color:background};
178
}
179
180
::-webkit-scrollbar-track {background:transparent;}
181
 
182
::-webkit-scrollbar-thumb {
183
height:150px!important;
184
background:{color:borders};
185
border:5px solid {color:background};
186
}
187
 
188
/*tiny cursor*/ 
189
190
 
191
html, body, img, a { 
192
{block:ifWhiteTinycursor}
193
cursor:url(http://static.tumblr.com/vmteopo/fhxo3gbrd/small_white_cursor.png), auto;
194
{/block:ifWhiteTinycursor}
195
{block:ifBlackTinyCursor}
196
cursor: url('http://33.media.tumblr.com/tumblr_lqs4qdUu8n1qfoi4t.png'), auto;
197
{/block:ifBlackTinyCursor}
198
}
199
 
200
 a:hover, a:active, iframe{
201
{block:ifWhiteTinycursor}cursor:url(http://static.tumblr.com/vmteopo/RQ9o3gbth/small_white_cursor_help.png), crosshair;
202
{/block:ifWhiteTinycursor}
203
{block:ifBlackTinyCursor}
204
 cursor:url(http://static.tumblr.com/vmteopo/DH3njhg50/help_cursor.png), crosshair;
205
{/block:ifBlackTinyCursor}
206
 }
207
 
208
209
/*main structure*/
210
211
body{
212
background-color:{color:background};
213
background-image:url({image:Background});
214
background-attachment:fixed;
215
background-repeat:repeat;
216
font-size:10px;
217
letter-spacing:0px;
218
font-family:Karla, sans-serif;
219
color:{color:text};
220
line-height:1.5em;
221
-moz-osx-font-smoothing:grayscale;
222
-webkit-font-smoothing:antialiased;
223
font-smoothing:antialiased; 
224
}
225
226
 
227
a:link, a:active, a:visited{
228
color:{color:link};
229
text-decoration:none;
230
-webkit-transition:all 0.5s linear;
231
-moz-transition:all 0.5s linear;
232
transition:all 0.5s linear;
233
}
234
235
a:hover {color:{color:text};}
236
237
238
.center {
239
position:relative;
240
margin:50px auto;
241
width:calc(550px + 120px);
242
{block:PermalinkPage}
243
width:calc(400px + 200px);
244
{/block:PermalinkPage}
245
}
246
247
#posts{
248
position:relative;
249
{block:PermalinkPage}
250
margin-top:100px;
251
{/block:PermalinkPage}
252
}
253
254
255
.entry {
256
overflow:hidden;
257
margin:35px;
258
background:#fff;
259
padding:15px;
260
border:1px solid {color:borders};
261
{block:indexpage}
262
width:230px; 
263
opacity:0;
264
z-index:-1;
265
{/block:indexpage}
266
{block:PermalinkPage}
267
width:500px;
268
padding-bottom:0px;
269
{/block:PermalinkPage}
270
}
271
272
273
.entry img{
274
max-width:100%;
275
display:block;
276
position:relative;
277
overflow:hidden;
278
}
279
280
#zoom{
281
position:relative;
282
overflow:hidden;
283
}
284
 
285
.entry #zoom img{
286
display:block;
287
height:auto;
288
-webkit-transition:opacity 0.5s linear;
289
-webkit-transition:all 0.5s linear;
290
-moz-transition:all 0.5s linear;
291
transition:all 0.5s linear;
292
-webkit-transform: scale(1.2);
293
-moz-transform: scale(1.2);
294
-o-transform: scale(1.2);
295
transform: scale(1.2);
296
}
297
   
298
.entry:hover #zoom img{
299
-webkit-filter: grayscale(0%);
300
-webkit-transform: scale(1);
301
-moz-transform: scale(1);
302
-o-transform: scale(1);
303
transform: scale(1);
304
}
305
306
.mask{
307
position:absolute;
308
width:230px;
309
height:calc(100% - 30px);
310
opacity:0.0;
311
background:black;
312
z-index:9;
313
-webkit-transition: all 0.4s ease;
314
-moz-transition: all 0.4s ease;
315
-o-transition: all 0.4s ease;
316
transition: all 0.4s ease;
317
}
318
 
319
.entry:hover .mask{
320
opacity:0.6;
321
-webkit-transition: all 0.4s ease;
322
-moz-transition: all 0.4s ease;
323
-o-transition: all 0.4s ease;
324
transition: all 0.4s ease;
325
}
326
327
#perm{
328
position:absolute;
329
z-index:10;
330
left:25px;
331
right:25px;
332
top:25px;
333
bottom:25px;
334
overflow:hidden;
335
opacity:0;
336
-webkit-transition: all 0.5s ease;
337
-moz-transition: all 0.5s ease;
338
-o-transition: all 0.5s ease;
339
transition: all 0.5s ease;
340
}
341
342
.entry:hover #perm {opacity:1;}
343
344
 
345
.line {
346
width:0px;
347
height:0px;
348
border-top:1px solid #fff;
349
border-left:1px solid #fff;
350
-webkit-transition: all 0.5s ease;
351
-moz-transition: all 0.5s ease;
352
-o-transition: all 0.5s ease;
353
transition: all 0.5s ease;
354
355
}
356
357
.line2 {
358
position:absolute;
359
width:0px;
360
height:0px;
361
border-bottom:1px solid #fff;
362
border-right:1px solid #fff;
363
bottom:0px;
364
right:0px;
365
-webkit-transition: all 0.5s ease;
366
-moz-transition: all 0.5s ease;
367
-o-transition: all 0.5s ease;
368
transition: all 0.5s ease;
369
370
}
371
372
.entry:hover .line, .entry:hover .line2 {width:100%;height:100%;}
373
374
.perm1 a, .perm2 a, .perm3 a{
375
color:#fff;
376
}
377
378
.perm1 {
379
width:20px;
380
height:20px;
381
text-align:center;
382
position:absolute;
383
z-index:100;
384
top:10%;
385
font-size:18px;
386
margin-left:55px;
387
opacity:0;
388
display:inline-block;
389
-webkit-transition: all 0.5s ease;
390
-moz-transition: all 0.5s ease;
391
-o-transition: all 0.5s ease;
392
transition: all 0.5s ease;
393
}
394
395
.entry:hover .perm1{
396
opacity:1;
397
top:45%;
398
-webkit-transition-delay: 0.50s;
399
-webkit-transition: all 0.50s;
400
transition: all 0.50s;
401
transition-delay: 0.50s;
402
}
403
404
.perma1{
405
position:absolute;
406
text-transform:uppercase;
407
font-family:roboto;
408
font-weight:300;
409
font-style:normal;
410
font-size:14px;
411
letter-spacing:1px;
412
margin-top:20px;
413
margin-left:0px;
414
width:120px;
415
opacity:0;
416
visibility:hidden;
417
-webkit-transition:opacity 0.3s linear;
418
-webkit-transition:all 0.3s linear;
419
-moz-transition:all 0.3s linear;
420
transition:all 0.3s linear;
421
}
422
423
.perm1:hover .perma1{
424
opacity:1;
425
visibility:visible;
426
margin-left:0px;
427
}
428
429
.perm2 {
430
width:20px;
431
height:20px;
432
text-align:center;
433
position:absolute;
434
z-index:100;
435
top:70%;
436
font-size:18px;
437
margin-left:105px;
438
opacity:0;
439
display:inline-block;
440
-webkit-transition:all .5s ease-in-out;
441
-moz-transition:all .5s ease-in-out;
442
-o-transition:all .5s ease-in-out;
443
}
444
445
.entry:hover .perm2 {
446
opacity:1;
447
top:45%;
448
-webkit-transition-delay: 0.50s;
449
-webkit-transition: all 0.50s;
450
transition: all 0.50s;
451
transition-delay: 0.50s;
452
}
453
454
455
.perma2{
456
position:absolute;
457
text-transform:uppercase;
458
font-family:roboto;
459
font-weight:300;
460
font-style:normal;
461
font-size:14px;
462
letter-spacing:1px;
463
margin-top:20px;
464
margin-left:-50px;
465
width:120px;
466
opacity:0;
467
visibility:hidden;
468
-webkit-transition:opacity 0.3s linear;
469
-webkit-transition:all 0.3s linear;
470
-moz-transition:all 0.3s linear;
471
transition:all 0.3s linear;
472
}
473
474
.perm2:hover .perma2{
475
opacity:1;
476
visibility:visible;
477
margin-left:-50px;
478
}
479
480
.perm3 {
481
width:20px;
482
height:20px;
483
text-align:center;
484
position:absolute;
485
z-index:100;
486
top:10%;
487
font-size:18px;
488
margin-left:155px;
489
opacity:0;
490
display:inline-block;
491
-webkit-transition:all .5s ease-in-out;
492
-moz-transition:all .5s ease-in-out;
493
-o-transition:all .5s ease-in-out;
494
}
495
496
.entry:hover .perm3 {
497
opacity:1;
498
top:45%;
499
-webkit-transition-delay: 0.50s;
500
-webkit-transition: all 0.50s;
501
transition: all 0.50s;
502
transition-delay: 0.50s;
503
504
}
505
506
507
.perma3{
508
position:absolute;
509
text-transform:uppercase;
510
font-family:roboto;
511
font-weight:300;
512
font-style:normal;
513
font-size:14px;
514
letter-spacing:1px;
515
margin-top:20px;
516
margin-left:-100px;
517
width:120px;
518
opacity:0;
519
visibility:hidden;
520
-webkit-transition:opacity 0.3s linear;
521
-webkit-transition:all 0.3s linear;
522
-moz-transition:all 0.3s linear;
523
transition:all 0.3s linear;
524
}
525
526
.perm3:hover .perma3{
527
opacity:1;
528
visibility:visible;
529
margin-left:-100px;
530
}
531
532
533
pre {
534
white-space: pre-wrap;       
535
white-space: -moz-pre-wrap;  
536
white-space: -pre-wrap;      
537
white-space: -o-pre-wrap; 
538
word-wrap: break-word;       
539
}
540
541
p {margin:5px 0;}
542
543
p:first-of-type {
544
    margin-top:0;
545
    padding-top:0;    
546
}
547
548
p:last-of-type {
549
    margin-bottom:0;
550
    padding-bottom:0;       
551
}
552
553
554
small, big {font-size:1em;}
555
556
h1, h2, h3, h4 {
557
font-size:2em;
558
line-height:24px;
559
margin:0;
560
padding:0;
561
}
562
563
564
.back{
565
padding:0px;
566
}
567
568
.etext{
569
padding:5px;
570
}
571
572
.back a, .a a{
573
color:{color:text};
574
border-bottom:1px solid {color:borders};
575
}
576
577
.back a:hover, .a a:hover{
578
color:{color:link};
579
border-bottom:1px solid {color:link};
580
}
581
582
.permalinktext{
583
margin-left:-15px;
584
width:calc(100% + 17px);
585
display:block;
586
text-decoration:none;
587
text-transform:uppercase;
588
letter-spacing:1px;font-size:8px;
589
border-top:1px solid {color:borders};
590
padding-right:7px;
591
padding-top:7px;
592
padding-left:7px;
593
margin-top:15px;
594
height:6px;
595
line-height:16px;
596
}
597
 
598
.permalinktext a{
599
color:{color:link};
600
}
601
 
602
.permalinktext a:hover{
603
    color:{color:text};
604
    letter-spacing:3px;font-weight:700;
605
}
606
607
/*audio player*/
608
609
 
610
#audio {
611
width:auto;
612
margin:0px;
613
height:auto;
614
min-height:60px;
615
line-height:20px;
616
}
617
.cover {
618
z-index:1;
619
width:70px;
620
height:70px;
621
position:absolute;
622
}
623
.cover img {
624
float:left;
625
position:absolute;
626
border-radius:0px;
627
width:70px;
628
height:70px;
629
}
630
631
.playbox {
632
position:absolute; 
633
z-index:9;
634
background:black;
635
opacity:0;
636
width:70px;
637
height:70px;
638
-webkit-transition:opacity 0.5s linear;
639
-webkit-transition:all 0.5s linear;
640
-moz-transition:all 0.5s linear;
641
transition:all 0.5s linear;
642
}
643
644
.entry:hover .playbox{
645
opacity:.8;
646
-webkit-transition:opacity 0.5s linear;
647
-webkit-transition:all 0.5s linear;
648
-moz-transition:all 0.5s linear;
649
transition:all 0.5s linear;
650
}
651
652
.button {
653
position:relative;
654
z-index: 1000;
655
overflow:hidden;
656
width:25px; 
657
height:25px; 
658
margin:20px 20px 20px 20px;
659
}
660
661
662
.info {
663
margin-left:70px;
664
margin-top:0px;
665
font-size:11px;
666
letter-spacing:2px;
667
text-align:right;
668
text-transform:uppercase;
669
line-height:25px;
670
background:{color:Accent};
671
color:{color:Accent text};
672
padding:10px;
673
}
674
 
675
/*title*/
676
 
677
.title{    
678
padding:8px;
679
padding-left:11px;
680
margin-bottom:10px;
681
font-family:Quicksand, serif;
682
font-size:17px;
683
color:{color:Accent text};
684
background:{color:Accent};
685
text-transform:uppercase;
686
letter-spacing:1px;
687
line-height:28px;
688
}
689
690
.title a{
691
color:{color:Accent text};
692
}
693
694
/*blockquote & quote*/
695
696
blockquote{
697
border-left:1px solid {color:borders};
698
margin:5px;
699
padding-left:10px;
700
line-height:15px;
701
}
702
703
.quote{
704
font-size:12px;
705
font-style:italic;
706
line-height:20px;
707
padding:7px;
708
background:{color:Accent};
709
color:{color:Accent text};
710
}
711
712
.cite{
713
line-height:15px;
714
text-align:right;
715
font-family:9px;
716
font-style:italic;
717
padding:10px;
718
padding-bottom:7px;
719
background:rgba({RGBcolor:Accent}, 0.7);
720
color:{color:Accent text};
721
}
722
723
.cite a{
724
    color:{color:Accent text};
725
}
726
727
/*ask style*/
728
729
730
.as{
731
color:{color:text};
732
letter-spacing:0px;
733
text-transform:uppercase;
734
letter-spacing:1px;
735
padding:10px;
736
font-family:roboto;
737
font-size:10px;
738
text-align:center;
739
overflow:hidden;
740
background:{color:Accent};
741
color:{color:Accent text};
742
}
743
744
.as a{color:{color:Accent text};}
745
746
.q{
747
margin-top:10px;
748
margin-bottom:10px;
749
line-height:14px;
750
}
751
752
.qline{
753
height:1px;
754
display:block;
755
width:50%;
756
margin-left:25%;
757
background:{color:borders};
758
}
759
 
760
.a{
761
line-height:14px;
762
margin-top:10px;
763
}
764
 
765
 .a img{
766
     width:100%;
767
     height:auto;
768
 }
769
 
770
771
.pagination{
772
bottom:0px;
773
display:block;
774
margin:5px;
775
}
776
/*chat styling*/
777
778
.user_1, .user_3, .user_5, .user_7, .user_9, .user_11, .user_13, .user_15, .user_17, .user_19, .user_21, .user_23, .user_25, .user_27, .user_29, .user_31, .user_33, .user_35, .user_37, .user_39, .user_41, .user_43, .user_45, .user_47, .user_49, .user_51, .user_53, .user_55, .user_57, .user_59, .user_61, .user_63, .user_65, .user_67, .user_69, .user_71, .user_73, .user_75, .user_77, .user_79, .user_81, .user_83, .user_85, .user_87, .user_89, .user_91, .user_93, .user_95, .user_97, .user_99, .user_101, .user_103, .user_105, .user_107, .user_109, .user_111, .user_113, .user_115, .user_117, .user_119, .user_121, .user_123, .user_125, .user_127, .user_129, .user_131, .user_133, .user_135, .user_137, .user_139, .user_141, .user_143, .user_145, .user_147, .user_149{
779
background:rgba({RGBcolor:Accent}, 1);
780
padding:7px;
781
color:{color:Accent text};}
782
783
.user_2, .user_4, .user_6, .user_8, .user_10, .user_12, .user_14, .user_16, .user_18, .user_20, .user_22, .user_24, .user_26, .user_28, .user_30, .user_32, .user_34, .user_36, .user_38, .user_40, .user_42, .user_44, .user_46, .user_48, .user_50, .user_52, .user_54, .user_56, .user_58, .user_60, .user_62, .user_64, .user_66, .user_68, .user_70, .user_72, .user_74, .user_76, .user_78, .user_80, .user_82, .user_84, .user_86, .user_88, .user_90, .user_92, .user_94, .user_96, .user_98, .user_100, .user_102, .user_104, .user_106, .user_108, .user_110, .user_112, .user_114, .user_116, .user_118, .user_120, .user_122, .user_124, .user_126, .user_128, .user_130, .user_132, .user_134, .user_136, .user_138, .user_140, .user_142, .user_144, .user_146, .user_148, .user_150{
784
background:rgba({RGBcolor:Accent}, 0.6);
785
padding:7px;
786
color:{color:Accent text};}
787
788
789
.back li, .a li{position:relative;display:block;}
790
.back li:before, .a li:before{content:'―';font-size:10px;position:absolute;left:-15px;color:{color:borders};top:0px;}
791
 
792
793
/*permalink notes*/
794
795
.caption{
796
padding-top:10px;
797
padding-bottom:10px;
798
}
799
800
801
.l{
802
display:block;
803
border-top:1px solid {color:borders};
804
margin-left:-15px;
805
width:calc(100% + 30px);
806
}
807
808
809
.inf{
810
display:block;
811
margin-top:10px;
812
margin-bottom:5px;
813
line-height:17px;
814
}
815
816
.tg{display:block;}
817
.tg a:after{content:',';}
818
.tg a:last-of-type:after {content:'.';}
819
.inf a, .notas a, .tg a{color:{color:text};}
820
.inf a:hover, .notas a:hover, .tg a:hover{color:{color:link};}
821
822
.notas{
823
margin-top:0px;
824
display:none;
825
padding:0px;margin-left:-15px;
826
width:calc(100% + 30px);
827
color:{color:text};
828
}
829
830
831
832
ol.notes {
833
    padding:0px!important;
834
    margin: 0;
835
    list-style-type: none;
836
}
837
ol.notes li.note {
838
    padding:8px;
839
    border-top:1px solid {color:borders};
840
}
841
ol.notes li.note img.avatar {
842
    float:right;
843
    border-radius:50%;
844
    padding:0px!important;
845
    border:1px solid #fff;
846
}
847
ol.notes li.note blockquote a {
848
    text-decoration: none;
849
}
850
li.more_notes_link_container {
851
    text-transform: uppercase;
852
    font-size:1em;
853
    letter-spacing:1px;
854
}
855
856
li.more_notes_link_container:hover{
857
letter-spacing:4px;
858
}
859
860
img:not(.lightbox-image) {
861
    max-width:100%;
862
    height:auto;
863
}
864
865
#top{
866
position:fixed;
867
top:0px;
868
left:0px;
869
width:100%;
870
height:15px;
871
background:{color:Accent};
872
z-index:999999;
873
}
874
875
#top2{
876
position:fixed;
877
top:15px;
878
left:20px;
879
width:100%;
880
height:5px;
881
border-bottom:1px solid {color:Accent};
882
background:{color:background};
883
z-index:999999;
884
}
885
886
887
#left{
888
position:fixed;
889
top:0px;
890
left:0px;
891
width:15px;
892
height:100%;
893
background:{color:Accent};
894
z-index:999999;
895
}
896
897
#left2{
898
position:fixed;
899
top:20px;
900
left:20px;
901
width:1px;
902
height:100%;
903
background:{color:Accent};
904
z-index:999999;
905
}
906
907
908
 
909
#sidebar {
910
width:160px;
911
height:auto;
912
border:1px solid {color:borders};
913
position:fixed;
914
background:white;
915
margin-left:calc(20px - 260px);
916
top:180px;
917
z-index:999999;
918
padding:15px;
919
height:auto;
920
}
921
   
922
 
923
.titulo {
924
color:{color:title};
925
margin-top:-25px;
926
margin-left:0px;
927
font-family:quicksand;
928
font-size:23px;
929
text-transform:uppercase;
930
z-index:999999;
931
text-align:left;
932
width:auto;
933
padding:3px;
934
background:{color:background};
935
position:absolute; }
936
 
937
.desc{
938
margin:4px;
939
padding:10px;
940
background:{color:Accent};
941
color:{color:Accent text};
942
}
943
944
.desc a{
945
color:{color:Accent text};
946
}
947
 
948
 
949
.nav{
950
position:fixed;
951
height:19px;
952
z-index:-9999999999999;
953
margin-top:3px;
954
margin-left:30px;
955
opacity:1;
956
transition:0.4s;
957
}
958
 
959
960
.nav a{
961
font-size:13px;
962
display:inline-block;
963
margin-left:-1px;
964
text-align:center;
965
width:17px;
966
height:14px;
967
margin-right:-2px;
968
padding:5px;
969
color:{color:Accent};
970
background:{color:background};
971
-webkit-transition:All 0.3s ease-in-out;
972
}
973
 
974
.nav a:hover{
975
color:{color:Accent text};
976
background:{color:Accent};
977
}
978
 
979
980
981
</style>
982
</head>
983
 
984
<body>
985
986
987
<div id="top"></div>
988
<div id="top2"></div>
989
<div id="left"></div>
990
<div id="left2"></div>
991
992
<div class="center">
993
994
<div id="sidebar">
995
<div class="titulo">{text:blogtitle}</div>
996
<div class="desc">
997
{description}
998
</div>
999
<div class="nav">
1000
<a title="{text:Home Label}" href="/"><i class="fa fa-home"></i></a>
1001
<a title="{text:Ask Label}" href="/ask"><i class="fa fa-envelope"></i></a>
1002
<a title="{text:Extra link 1 Title}" href="{text:Extra link 1}"><i class="fa fa-link"></i></a>
1003
<a title="{text:Extra link 2 Title}" href="{text:Extra link 2}"><i class="fa fa-tags"></i></a>
1004
<a title="{text:Archive Label}" href="/archive"><i class="fa fa-calendar"></i></a>
1005
</div>
1006
</div>
1007
1008
1009
<div id="posts">
1010
{block:Posts}
1011
<div class="entry">
1012
 
1013
{block:Text}
1014
{block:Title}<div class="title">{Title}</div>{/block:Title}
1015
<div class="back">{Body}</div>
1016
{block:IndexPage}
1017
<div class="permalinktext">
1018
Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
1019
{/block:IndexPage}
1020
{/block:Text}
1021
 
1022
 
1023
{block:Link}
1024
<div class="title">
1025
<a href="{URL}">{Name} <i class="fa fa-angle-right"></i></a></div>
1026
<div class="back">{block:Description}{Description}{/block:Description}
1027
</div>{block:IndexPage}
1028
<div class="permalinktext">
1029
Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
1030
{/block:IndexPage}
1031
{block:Link}
1032
 
1033
 
1034
{block:Photo}
1035
{block:IndexPage}
1036
<div class="perm1">
1037
<a href="{Permalink}"><i class="fa fa-calendar"></i></a>
1038
<div class="perma1">
1039
<a href="{Permalink}">{Month} {DayOfMonth}</a></div>
1040
</div><div class="perm2"><a href="{ReblogURL}" target="_blank"><i class="fa fa-refresh"></i></a>
1041
<div class="perma2"><a href="{ReblogURL}" target="_blank">reblog this</a></div>
1042
</div>
1043
<div class="perm3">
1044
<a href="{Permalink}"><i class="fa fa-comments"></i></a>
1045
<div class="perma3"><a href="{Permalink}">{NoteCountWithLabel}</a></div>
1046
</div>
1047
<!--
1048
<div id="perma">
1049
<div id="perm1">
1050
<a href="{permalink}" target="_blank">{block:NoteCount}{notecount}{/block:NoteCount}</a></div>
1051
<div id="perm2"><a href="{ReblogURL}" target="_blank">reblog</a>
1052
</div>
1053
<div id="perm3"><a href="{permalink}" target="_blank">{Month} {DayOfMonth}</a>
1054
</div>
1055
</div>-->
1056
<div class="mask"></div>
1057
<div id="perm">
1058
<div class="line"></div>
1059
<div class="line2"></div>
1060
</div>
1061
<div id="zoom">
1062
<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/></div>
1063
{/block:IndexPage}
1064
{block:PermalinkPage}
1065
<img src="{PhotoURL-HighRes}" alt="{PhotoAlt}" width="100%"/>
1066
{/block:PermalinkPage}
1067
{/block:Photo}
1068
 
1069
 
1070
{block:Photoset}
1071
<div class="photo-slideshow" id="photoset_{PostID}" data-layout="{PhotosetLayout}">{block:Photos}<div class="photo-data"><div class="pxu-photo"><img src="{PhotoURL-500}" width="{PhotoWidth-500}" height="{PhotoHeight-500}" data-highres="{PhotoURL-HighRes}" data-width="{PhotoWidth-HighRes}" data-height="{PhotoHeight-HighRes}"></div><a class="tumblr-box" rel="post-{PostID}" href="{PhotoURL-HighRes}"></a></div>{/block:Photos}</div>
1072
{block:IndexPage}
1073
<div class="permalinktext">
1074
Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
1075
{/block:IndexPage}
1076
{/block:Photoset}
1077
1078
 
1079
{block:Quote}
1080
<div class="back"><div class="quote">❝&nbsp;{quote}</div>
1081
<div class="cite">&mdash; {Source}</div></div>
1082
{block:IndexPage}
1083
<div class="permalinktext">
1084
Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
1085
{/block:IndexPage}
1086
{/block:Quote}
1087
 
1088
{block:Chat}<div class="back">
1089
<div class="chat">
1090
{block:Title}<span class="title">{Title}</span></span>{/block:Title}
1091
{block:Lines}<div class="lines {Alt}"><div class="{Alt} user_{UserNumber}">{block:Label}<i>{Label}</i> {/block:Label}{Line}</div></div>{/block:Lines}
1092
</div></div>
1093
{block:IndexPage}
1094
<div class="permalinktext">
1095
Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
1096
{/block:IndexPage}
1097
{/block:Chat}
1098
 
1099
{block:Audio}<div class="back">
1100
<div id="audio">
1101
<div class="cover"><img src="http://static.tumblr.com/k9utpfa/tcom8wpif/default_cover_m.jpg"></div>
1102
{block:AlbumArt}
1103
<div class="cover"><img src="{AlbumArtURL}"></div>
1104
{/block:AlbumArt}
1105
<div class="playbox">
1106
<div class="button">
1107
{block:AudioPlayer}{AudioPlayerBlack}{/block:AudioPlayer}</div></div>
1108
<div class="info">
1109
<span{block:TrackName} style="display:none;"{/block:TrackName}>Unknown</span>{block:TrackName}{TrackName}{/block:TrackName}
1110
<div style="text-transform:uppercase;font-size:8px;letter-spacing:2px;color:{color:Accent text};">
1111
<span{block:Artist} style="display:none;"{/block:Artist}>Unknown</span>{block:Artist}{Artist}{/block:Artist}</div>
1112
</div> 
1113
</div></div>
1114
{block:IndexPage}
1115
<div class="permalinktext">
1116
Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
1117
{/block:IndexPage}
1118
{/block:Audio}
1119
1120
 
1121
{block:Video}
1122
<div class="video">{Video-500}</div>  
1123
{block:IndexPage}
1124
<div class="permalinktext">
1125
Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
1126
{/block:IndexPage}
1127
{/block:Video}
1128
 
1129
 
1130
{block:Answer}<div class="back">
1131
<div class="as">{Asker} asked:</div>
1132
<div class="q">{Question}</div>
1133
<div class="qline"></div>
1134
<div class="a">{Answer}</div></div> 
1135
{block:IndexPage}
1136
<div class="permalinktext">
1137
Posted on {Month} {DayOfMonth}, {Year} <div style="text-align:right;margin-top:-16px"><a href="{permalink}" target="_blank">{notecountwithlabel}</a></div></div>
1138
{/block:IndexPage}
1139
{/block:Answer}
1140
1141
1142
{block:ContentSource}<!-- {SourceURL}
1143
{block:SourceLogo}<img src="{BlackLogoURL}"width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />{/block:SourceLogo}
1144
{block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo} -->
1145
{/block:ContentSource}
1146
1147
<!-- {block:NoRebloggedFrom}
1148
{block:RebloggedFrom}{ReblogParentName}{/block:RebloggedFrom}
1149
{/block:NoRebloggedFrom} -->
1150
1151
1152
{block:PermalinkPage}
1153
<div class="caption">{block:Caption}{Caption}{/block:Caption}</div>
1154
{block:Date}
1155
<div class="l"></div>
1156
<div class="inf">
1157
Posted on {month} {dayofmonth}{dayofmonthsuffix} at {12hour}:{minutes}{ampm} <br>
1158
{block:RebloggedFrom}
1159
source: <a href="{ReblogRootURL}">{ReblogRootName}</a> <br> via: <a href="{ReblogParentURL}">{ReblogParentName}</a><br>
1160
{/block:RebloggedFrom}
1161
<div class="tg">
1162
{block:HasTags} 
1163
tags: {block:Tags}<a href="{TagURL}">#{Tag}</a>&nbsp;
1164
{/block:Tags}{/block:HasTags}
1165
</div>
1166
<a title="show notes" class="show">{block:NoteCount}{NoteCountWithLabel}{/block:NoteCount}</a></div>
1167
<div class="notas">
1168
{block:PostNotes}
1169
{PostNotes}
1170
{/block:PostNotes}
1171
{/block:Date}
1172
</div>
1173
{/block:PermalinkPage}
1174
{/block:Date}
1175
</div>
1176
{/block:Posts}
1177
</div>
1178
 
1179
1180
<div class="pagination">
1181
{block:Pagination}
1182
{block:PreviousPage}
1183
<a href="{PreviousPage}"></a>
1184
{/block:PreviousPage}
1185
 
1186
{block:NextPage}
1187
<a href="{NextPage}" class="next"></a>
1188
{/block:NextPage}
1189
{/block:Pagination}</div></div>
1190
1191
<!--Like seriously guys, DON'T TOUCH any of this scripts unless you know what it does or you will ruin your whole theme--->
1192
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.1/css/font-awesome.min.css"> <link href='https://fonts.googleapis.com/css?family=Montserrat:400,700|Source+Sans+Pro:400,700|Hind:400,700|Dancing+Script:400,700|Open+Sans:400,700|Muli|Kurale|PT+Serif:400,700|Old+Standard+TT:400,700|Roboto:400,700|Roboto+Condensed:400,700|Lato:400,700|Raleway:400,700,300|Montez|Karla:400,700|Quicksand:400,700|Petit+Formal+Script|Clicker+Script|Mako|Maven+Pro:400,700' rel='stylesheet' type='text/css'>
1193
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
1194
<script src ="http://static.tumblr.com/fwgzvyf/Oj1o08f6h/shythemes.vr.js"></script>
1195
<link rel="stylesheet" href="http://static.tumblr.com/8pnyeus/29To2og0o/styles.css">
1196
<script src="http://static.tumblr.com/8pnyeus/nfIo2oh8w/l-script.js" type="text/javascript"></script>
1197
<script src="http://static.tumblr.com/qudkd6d/Az6nkemqr/pxuphotoset.min.js"></script>
1198
{block:IndexPage}
1199
<script src="http://static.tumblr.com/6hsqxdt/QBym35odk/jquery.masonry.js"></script>
1200
<script src="http://static.tumblr.com/wgijwsy/u2vm2hxv6/jquery.infinitescroll.min.js"></script>
1201
{/block:IndexPage}
1202
<script>
1203
$(document).ready(function(){
1204
    $('.photo-slideshow').pxuPhotoset({
1205
        lightbox: true,
1206
        rounded: false,
1207
        gutter: '3px',
1208
        photoset: '.photo-slideshow',
1209
        photoWrap: '.photo-data',
1210
        photo: '.pxu-photo'
1211
    });
1212
    {block:IndexPage}
1213
    var $container = $('#posts');
1214
    $container.masonry({ itemSelector: '.entry' });
1215
    $container.imagesLoaded(function(){
1216
        $container.masonry();
1217
        $container.find('.entry').animate({ opacity: 1, zIndex: 1 });
1218
    });
1219
    $container.infinitescroll({
1220
        itemSelector: '.entry',
1221
        navSelector: '.pagination',
1222
        nextSelector: '.next',
1223
        loadingImg: '',
1224
        loadingText: '<em></em>',
1225
        bufferPx: 2000
1226
    },
1227
    function( newElements ) {
1228
        var $newElems = $( newElements );
1229
        $newElems.find('.photo-slideshow').pxuPhotoset({
1230
            lightbox: true,
1231
            rounded: false,
1232
            gutter: '3px',
1233
            photoset: '.photo-slideshow',
1234
            photoWrap: '.photo-data',
1235
            photo: '.pxu-photo'
1236
        },
1237
        
1238
    function(){
1239
     resizeVideos(); },
1240
     
1241
        function(){
1242
            $container.masonry();
1243
        });
1244
        $newElems.imagesLoaded(function(){
1245
            $container.masonry( 'appended', $newElems );
1246
            $newElems.animate({ opacity: 1, zIndex: 1 });
1247
        });
1248
    });
1249
    {/block:IndexPage}
1250
});
1251
</script>
1252
</body>
1253
</html>