View difference between Paste ID: A6xPgVGk and PQtjNJEX
SHOW: | | - or go back to the newest paste.
1
       					!!!!!!!!!!!!Read It!!!!!!!!!!!!
2
 
3
                                                (⊙.⊙(☉_☉)⊙.⊙)
4
 
5
 
6
ALL COLORS CAN BE CHANGED.For color changes, see the color palette section in About Me.  There are a ton of color schemes online.  It won't take you long to change the color set-up on this profile.
7
 
8
There are div ids/classes, tables (table, tr, td) and img classes in this layout.  Be VERY, VERY, VERY careful not to drop off any of the coding.    
9
10
11
12
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
13
14
ELITEROLEPLAYERS.NET USERS:  PLEASE BE SURE TO READ THE SPECIAL INSTRUCTIONS BEFORE COMING TO ME WITH QUESTIONS REGARDING TABLE ALIGNMENT 
15
16
//////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
17
18
19
20
............................
21
MUSIC PLAYER
22
 
23
REPLACE MY MUSIC PLAYER WITH YOUR OWN.  
24
 
25
............................
26
27
............................
28
MASTHEAD BANNER
29
 
30
The banner is located at the END of ABOUT ME.  Replace my link with your link to your uploaded image.
31
 
32
............................
33
34
HOVER PICS
35
36
To Change the hover over pics/icons, locate div style classes like the below and replace the http address with a DIRECT link to your uploaded photo image:
37
38
<div class="hbox1" style="background-image:url(http://......);">
39
 
40
41
.......................................
42
43
CONNECTION ICON PICS
44
 
45
There is no magic to this set-up for image replacement.  You will see <img src="http//:..."> for each icon pic.  Just put your url to your uploaded pic in place of mine.
46
 
47
.......................................
48
 
49
PARAGRAPH - SPECIAL
50
 
51
Paragraph first letter and first line:
52
 
53
If you don't want the color to change for the first line of your paragraph, just delete this from the Color Palette near the end of About ME:
54-
p:first-line {color:898c92;}
54+
p:first-line {color:5d0000;}
55
 
56
If you don't want any adjustments to the first line and letter of the paragraph, remove this from the Font Styles in About Me:
57
p:first-letter {font-size:15pt;}
58
p:first-line {font-size:10pt;}
59
 
60
.......................................
61
 
62
 FOR ROLEPLAYER.ME USERS:
63
 
64
For the below text font classes and all of the headers (1, 2, 3, etc) and lyrics, please note the following:  
65
I code for ALL sites.  Not every website will allow headers to be placed as <h1>Header 1</h1>.  For that reason, I turn them into font classes with a period in front (.h1) in About Me and script them in the tables as I have done below.  
66
 
67
<font class="h1">Header 1</font>
68
 
69
If you are on a website like RPer.me that allows regular header, underline, strong, etc coding, you can just use regular header coding for all of the header, lyric, special text labels like so:
70
<h1>Header</h1> <strike>Strike</strike> etc..
71
 
72
OR just leave them as they are.  They will work for you either way.  
73
 
74
 
75
76
!!!!!!!!!!!!!!!!!!!!SPECIAL INSTRUCTIONS!!!!!!!!!!!!!!!!!!!!!!!!!
77
!!!!!!!!!!!!!!!!!!FOR ELITERPERS.NET USERS ONLY!!!!!!!!!!!!!!!!!!
78
79
The tables will be a bit off on Elite.  You will need to adjust the following:
80
81
Find the below NEAR the TOP of About Me and change the top and left marker as notated below (MAKE SURE you have the right one for INTERESTS and NOT Like to Meet)
82
83
.vicarious{Interests Tables Placement (Up/Down/Left/Right) Codes}
84
object, embed, table table table { position:relative; top:-20px; left:10px;}
85
table table table table{border:0px; position:static;}
86
 
87
(CONTINUED FOR ELITERPERS.NET ONLY) If you use Google Chrome more so than FF, NOW adjust the LIKE TO MEET table placement for LEFT as such:
88
89
.vicarious{Like To Meet Tables Placement (Up/Down/Left/Right) Codes}
90
td.text table {position:relative; top:-20px; left:-4px;  }
91
td.text object, td.text embed, td.text table table {position:static;}
92
 
93
!!!!!!!!!!!!!!! END SPECIAL INSTRUCTIONS !!!!!!!!!!!!!!!
94
95
96
97
98
///////////////////////////////////////////////////
99
_______________________________________________
100
 
101
 
102
 
103
 
104
                        Don't forget to replace the XXXXX with your friend ID number.
105
 
106
                                                     (>‿◠)✌
107
 
108
 
109
                *****************************SAVE YOUR WORK AS YOU GO.*******************************
110
 
111
 
112
 
113
                               
114
 
115
DO NOT REMOVE THE .VICARIOUS MARKERS FROM ANY VICARIOUS LAYOUT.  
116
 
117
-----------------------------ABOUT ME---------------------------------
118
 <BODY oncontextmenu="return false" onselectstart="return false" ondragstart="return false">
119
120
 <style type="text/css">@import url("https://googledrive.com/host/0B79YHAkeE7SuSjRYNk1ucE5hUW8 ");@import url(http://fonts.googleapis.com/css?family=Special+Elite|Rancho|Qwigley|Dorsa|Mystery+Quest|Voltaire|Righteous&effect=decaying);
121
122
/* - -DO NOT PUT ANYTHING ABOVE THE @import LINE ABOVE - - */  
123-
.vicarious { LAYOUT 134a // Layouts available @ http://vicarious-hs.tumblr.com/ }
123+
.vicarious { LAYOUT 134c // Layouts available @ http://vicarious-hs.tumblr.com/ }
124
/* - -DO NOT REARRANGE MY CODING!! ORDER IS IMPORTANT! - - */
125
126
.vicarious{ Background Properties }
127
body {
128
width:100%;
129
height:100%;
130
background-image: url("");
131
background-attachment:fixed;
132
background-repeat:no-repeat;
133
background-position:center center;
134
}
135
 
136
.vicarious { Table Properties }
137
table, tr, td { background-color:transparent; border:0;}
138
table table {
139
background-color:transparent;
140
border-left:0px double #000000 ;
141
border-right:0px double #000000;
142
}
143
 
144
table table table  { background-color:transparent; display: inline-table; border:0px solid; }
145
 
146
147
.vic_table {
148
padding:5px;
149
margin-bottom:5px;
150
border:1px solid ; }
151
.vic_table tr { margin:0px; }
152
.vic_table td { margin:0px; width:100%; }   
153
154
.vicarious{Like To Meet Tables Placement (Up/Down/Left/Right) Codes}
155
td.text table {position:relative; top:-20px; left:-9px;  }
156
td.text object, td.text embed, td.text table table {position:static;}
157
 
158
.vicarious{Interests Tables Placement (Up/Down/Left/Right) Codes}
159
object, embed, table table table { position:relative; top:0px; left:0px;}
160
table table table table{border:0px; position:static;}
161
 
162
.vicarious{ Google Chrome Scrollbar }
163
::-webkit-scrollbar {width: 10px;}
164
::-webkit-scrollbar-track {border: 1px solid ;}
165
::-webkit-scrollbar-thumb {border: 1px solid ;} 
166
 
167
.vicarious { Font Styles }
168
a, a:link, a:active, a:visited, a:hover, td, .text, table, tr, td, li, div, input, p, i, b, em  {
169
font-family: tahoma;
170
font-size: 8pt ;
171
line-height: 90% ;
172
text-decoration:none;
173
}
174
 
175
P { text-align:justify; }
176
p:first-letter {font-size:15pt;}
177
p:first-line {font-size:10pt;}
178
 
179
I {
180
font-size:12pt;
181
font-family: brushscript mt;
182
text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
183
}
184
 
185
EM {
186
font-size:16pt;    
187
font-family: 'Qwigley', cursive;
188
text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);  
189
}
190
 
191
.strike, strike {
192
text-decoration:line-through;
193
}
194
 
195
.u, u {
196
text-decoration:underline;
197
font-size:10pt;  
198
}
199
 
200
.strong, strong {
201
font-weight:bolder;
202
font-size:11pt;  
203
}
204
 
205
B, .B2, B2, .B3, B3, .B4, B4 {
206
font-family:copperplate gothic light;
207
font-size:7pt;
208
font-weight:bold;
209
text-transform:uppercase;
210
line-height:100%;
211
letter-spacing: 0pt;
212
text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
213
}
214
 
215
B{
216
font-family:georgia;
217
}
218
 
219
.B2, B2  {  
220
letter-spacing:1pt;
221
} 
222
 
223
.B3, B3 {  
224
font-size:9pt;  
225
letter-spacing:1pt;
226
} 
227
228
.B4, B4 {  
229
font-size:13pt;  
230
letter-spacing:2pt;
231
} 
232
 
233
a.first, a.first:link, a.first:active, a.first:visited, a.second, a.second:link, a.second:active, a.second:visited, a.cons, a.cons:link, a.cons:active, a.cons:visited {
234
font-family: 'Voltaire', sans-serif;
235
font-size:15pt;
236
text-align:center;
237
text-transform:uppercase;
238
display:block;
239
font-weight:bold;
240
text-decoration:none;
241
-webkit-transition: all 0.6s ease-out;
242
-moz-transition: all  0.6s ease-out;
243
-ms-transition: all  0.6s ease-out;
244
-o-transition: all  0.6s ease-out;
245
transition: all  0.6s ease-out;
246
margin-bottom:2px;
247
padding:0px;
248
text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);  
249
}
250
251
a.first, a.first:link, a.first:active, a.first:visited{ width:46px; line-height:35px;height:35px;}
252
a.first:hover { font-size:25pt; text-decoration: line-through;  }
253
a.second, a.second:link, a.second:active, a.second:visited { line-height:50px;height:50px; width:50px; } 
254
a.cons, a.cons:link, a.cons:active, a.cons:visited {font-size:8pt;letter-spacing:2pt;line-height:100%; text-align:right; padding-right:5px;}
255
a.cons:hover {letter-spacing:1pt;}
256
257
.h1, .h2, .h3,  .h4, .h5, .h6, .h7, .h8, .h9, h1, h2, h3, h4, h5, h6, h7, h8, h9, small, big {
258
font-family: copperplate gothic light;
259
line-height:100%;
260
text-align:center;
261
display:block;
262
font-size: 11pt ;
263
padding:0px;
264
margin:0px;
265
text-decoration:none;
266
}
267
 
268
.h1, h1   {
269
font-family: 'Mystery Quest', cursive;
270
font-size: 12pt ;
271
margin:5px 0px ; 
272
border-bottom:2px solid;
273
font-weight:bold;
274
}
275
 
276
.h2, h2  {
277
font-family: 'Voltaire', sans-serif;
278
letter-spacing:1pt;
279
font-size:24pt; 
280
line-height:160%;
281
text-transform:uppercase;
282
}
283
 
284
.h3, h3 {
285
font-family: 'Rancho', cursive;
286
text-align:left;
287
padding-left:5px;
288
margin-top:10px;
289
font-size: 12pt ;
290
}
291
 
292
.h4, h4 {
293
font-family: 'Voltaire', sans-serif;
294
font-weight:bold;
295
text-align:left;
296
font-size: 10pt ;
297
border-bottom:2px solid;
298
margin-top:5px;
299
}
300
 
301
.h5, h5 {
302
font-family: 'Dorsa', sans-serif;
303
font-weight:bold;
304
font-size: 46pt ;  
305
letter-spacing:1pt; 
306
}
307
 
308
.h6, h6  {
309
letter-spacing:1pt;
310
font-size:20pt; 
311
}
312
 
313
.h7, h7  {
314
font-family: 'Mystery Quest', cursive;
315
text-transform:uppercase;
316
letter-spacing:-1pt;
317
font-size:20pt; 
318
}
319
 
320
.h8, h8 {
321
font-weight:bold;
322
font-family: 'Dorsa', sans-serif;
323
letter-spacing:2pt;
324
font-size:18pt; 
325
margin:5px 0px;
326
}
327
 
328
small {
329
font-family: 'Dorsa', sans-serif;
330
letter-spacing:0pt;
331
font-size:12pt; 
332
text-transform:uppercase;
333
}
334
 
335
big {
336
font-family: 'Righteous', cursive;
337
letter-spacing:0pt;
338
font-size:28pt; 
339
text-transform:uppercase;
340
text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);  
341
}
342
 
343
.lyric, .lyric2, .lyric3, .lyric4, .lyric5, .lyric6, .lyric7, lyric, lyric2, lyric3, lyric4, lyric5, lyric6, lyric7  {
344
font-family: 'Special Elite', cursive;
345
text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);
346
text-decoration:none;
347
padding:0px;
348
margin:0px;
349
display:block;
350
text-align:center;
351
line-height:60%;
352
}
353
 
354
.lyric, lyric {Font-size:14pt; text-align:left; margin-left:5px;margin-top:5px;line-height:60%;}      
355
.lyric2, lyric2 {Font-size:12pt;line-height:35%;}  
356
.lyric3, lyric3 {Font-size:13pt;text-align:right; margin-right:5px;line-height:85%;}  
357
.lyric4, lyric4 {Font-size:13pt;text-align:left; margin-left:5px;} 
358
.lyric5, lyric5 {Font-size:12pt;letter-spacing:1.8pt;}  
359
.lyric6, lyric6 {Font-size:13pt;text-align:left; margin-left:5px;line-height:100%;}  
360
.lyric7, lyric7 {Font-size:15pt;letter-spacing:1pt;text-align:right; margin-right:5px; margin-bottom:5px;}     
361
362
.vicarious{ Img / Div  Style Classes}
363
 
364
.img1  {margin:5px 0px; width:82px; height:82px; overflow:hidden; }  
365
.img2  {width:100px; height:100px; overflow:hidden; }  
366
367
.VC   { 
368
width:265px; 
369
height:220px; 
370
overflow:auto; 
371
padding-left:10px;
372
padding-right:5px;
373
text-align:justify;
374
}
375
376
.vicframe   { 
377
width:500px; 
378
height:225px;
379
text-align:center;
380
background-position:top right; 
381
background-repeat:no-repeat;
382
}  
383
 
384
.viccontrol { margin-left:0px;overflow:hidden; width:215px;}
385
386
.leftside {
387
height:100%;
388
width:50px; 
389
position:fixed;  
390
overflow:none;
391
z-index:1000;  
392
-webkit-transition: all 0.5s linear 2s;
393
-moz-transition: all  0.5s linear 2s;
394
-ms-transition: all  0.5s linear 2s;
395
-o-transition: all  0.5s linear 2s;
396
transition: all  0.5s linear 2s;
397
top:0%; 
398
left:0%;
399
margin-top:10px;  
400
margin-left:-490px; 
401
}  
402
 
403
404
body:hover .leftside {
405
margin-left:0px;
406
-webkit-transition: all 0.5s linear 0s;
407
-moz-transition: all  0.5s linear 0s;
408
-ms-transition: all  0.5s linear 0s;
409
-o-transition: all  0.5s linear 0s;
410
transition: all  0.5s linear 0s;
411
}  
412
413
.about{
414
width:415px;
415
height:130px;
416
overflow:auto; 
417
padding:5px;
418
text-align:justify;
419
}
420
421
.statsL {
422
float:left; 
423
width:200px; 
424
height:220px; 
425
overflow:hidden;
426
}
427
428
.statsR {
429
float:right; 
430
width:215px; 
431
height:220px; 
432
overflow:auto;
433
text-align:left;
434
}
435
436
.pers {
437
width:210px; 
438
height:75px; 
439
overflow:auto; 
440
text-align:left;
441
margin-bottom:5px;
442
}
443
444
.music {
445
width:210px; 
446
height:20px; 
447
overflow:hidden; 
448
text-align:center; 
449
}
450
451
.hbox1 {
452
width:150px;
453
height:150px; 
454
overflow:hidden;
455
margin:10px 5px;
456
}
457
458
.hbox1a {
459
width:140px;
460
height:140px; 
461
padding:5px;
462
overflow:hidden;
463
text-align:justify;
464
 -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
465
filter: alpha(opacity=0);
466
opacity: 0;
467
-webkit-transition: all 1s ease-out 0s;
468
-moz-transition: all 1s ease-out 0s;
469
-ms-transition: all 1s ease-out 0s;
470
-o-transition: all 1s ease-out 0s;
471
transition: all 1s ease-out 0s;
472
}
473
474
475
.Hbox1a:hover   {
476
 -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
477
filter: alpha(opacity=100);
478
opacity: 1;
479
overflow:auto;
480
}
481
 
482
483
.vicariousmasthead {
484
position:absolute; 
485
width:950px; 
486
height:500px;  
487
padding:3px; 
488
border:1px solid ; 
489
top:0%; 
490
left:50%; 
491
margin-top:5px; 
492
margin-left:-475px; 
493
z-index:1 !important;
494
visibility:visible !important; 
495
display:block !important; 
496
}
497
498
.vicarious{ Masthead CSS }
499
 .v {display:none;}
500
body.bodyContent, body, v v v.x {margin-top:490px;margin-left:0px;}
501
div.profileWidth table div ul, div.clearfix v v.v {top:0px !important;}
502
 
503
.vicarious{ Color Palette}
504
 
505-
 body { background-color:34383a;  }
505+
 body { background-color:0f0f0f;  }
506
507
::-webkit-scrollbar-track {background-color:000000 ; border-color:000000 ;}  
508-
::-webkit-scrollbar-thumb {background-color:4c4945;   border-color:000000 ;}
508+
::-webkit-scrollbar-thumb {background-color:680000;   border-color:000000 ;}
509
510-
.vic_table, table table table, .vicariousmasthead  {background-color:333333; border-color:666666; }
510+
.vic_table, table table table, .vicariousmasthead  {background-color:1a1a1a; border-color:222222; }
511
512-
.about, .pers, .statsR, .vc, .hbox1a  {background-color:232323; }
512+
.about, .pers, .statsR, .vc, .hbox1a {background-color:191919; }
513-
.music  {background-color:333333;  }
513+
.music  {background-color:1a1a1a;  }
514
.leftside, .vicframe  {background-color:transparent; }
515
516-
a, a:link, a:active, a:visited, a:hover, td, .text, table, tr, td, li, div, input, p  { color:4f5959; }
516+
a, a:link, a:active, a:visited, a:hover, td, .text, table, tr, td, li, div, input, p  { color:424242; }
517-
p:first-line {color:898c92;}
517+
p:first-line {color:5d0000;}
518-
I { color:ebebeb; }
518+
I { color:4c4c4c; }
519-
EM { color:ebe7e8; }
519+
EM { color:eb380d; }
520-
B {color:696e71;}
520+
B {color:631515;}
521-
.B2, B2, .B3, B3, .B4, B4  {color:948e87; }
521+
.B2, B2, .B3, B3, .B4, B4  {color:dcdbd8; }
522-
.strong, strong {color:d3cbcf; }
522+
.strong, strong {color:a20000; }
523-
.strike, strike {color:efeae7; }
523+
.strike, strike {color:a1a1a1; }
524
 
525-
a.first, a.first:link, a.first:active, a.first:visited, a.second, a.second:link, a.second:active, a.second:visited {color:7f766d;background-color:transparent; }
525+
a.first, a.first:link, a.first:active, a.first:visited, a.second, a.second:link, a.second:active, a.second:visited {color:c41900;background-color:transparent; }
526-
a.first:hover,  a.second:hover {color:717a7a; }
526+
a.first:hover,  a.second:hover {color:f61f00; }
527-
a.cons, a.cons:link, a.cons:active, a.cons:visited {color:696e71 ; background-color:3b4141; }
527+
a.cons, a.cons:link, a.cons:active, a.cons:visited  {color:c41900; background-color:000000; }
528-
a.cons:hover {color:726864; }
528+
a.cons:hover {color:f61f00; }
529
530-
.h1, h1   {color:505558;  border-color:34393d;}
530+
.h1, h1   {color:7a7a7a;  border-color:333333;}
531-
.h2, h2 {color:726864 ; background-color:3b4141; }
531+
.h2, h2 {color:000000; background-color:c41900; }
532-
.h3, h3 { color:8c9492 ;  }
532+
.h3, h3 { color:929292 ;  }
533-
.h5, h5 { color:b8bab9 ;  }
533+
.h4, h4 {color:ebebeb ;background-color:262626; border-color:000000;}
534-
.h4, h4 {color:746865 ;background-color:1a1b1b; border-color:34393d;}
534+
.h5, h5 { color:c1bcbc ;  }
535-
.h6, h6 {color:000000;background-color:3b4141; }
535+
.h6, h6 {color:dd2a00; background-color:222222; }
536-
.h7, h7 {color:adb3b1; }
536+
.h7, h7 {color:c1c1c1; }
537-
.h8, h8 {color:596162; }
537+
.h8, h8 {color:0e1f29; }
538-
small {color:0d0c0b;background-color:77706a; }
538+
small {color:fcf3ea;background-color:d42d03; }
539-
big {color:77706a;background-color:3b4547; }
539+
big {color:e8300c; background-color:121212; }
540-
.lyric, lyric { color:b3b8ba;}
540+
.lyric, lyric { color:d2d2d2;}
541-
.lyric2, lyric2  {color:574f4c;}
541+
.lyric2, lyric2  {color:968b89;}
542-
.lyric3, lyric3  {color:667176; }
542+
.lyric3, lyric3  {color:bd2907; }
543-
.lyric4, lyric4  {color:484240; }
543+
.lyric4, lyric4  {color:64220a; }
544-
.lyric5, lyric5 {color:7c8a8b }
544+
.lyric5, lyric5 {color:b8b8b8; }
545-
.lyric6, lyric6  {color:807570; }
545+
.lyric6, lyric6  {color:888888; }
546-
.lyric7, lyric7  {color:697175; } 
546+
.lyric7, lyric7  {color:9d2300; } 
547
 
548
 
549
.vicarious{ Hide Codes }
550
.profileInfo,  .userProfileURL,  .friendsComments, .blacktext12, .friendSpace, .blurbs, .contactTable, .extendedNetwork, .latestBlogEntry, .interestsAndDetails, .userprofiledetail, .userAlbums, .whitetext12, .orangetext15, .lightbluetext8, .navigationBar, .profile, table tr td[id='footerWarpper'] { display:none !important;visibility:hidden!important; }
551
table table table table td {width:0px;}
552
.contactTable td, table table td.text table td,table table table table table td {width:auto;}
553
div div select, div div form {display:none !important;}
554
select { visibility:hidden!important; WIDTH:0px!important;}
555
table div {display:none;}table table div {display:block;}
556
.navigationBar { display: none; }
557
div[id="googlebar"],div div select{opacity:0;filter:alpha(opacity=0);display:none !important;position:absolute !important; bottom:2000px !important;}
558
.vicarious{Misc Codes}
559
p.breakhere { page-break-after: always }
560
br{line-height:10px!important;} 
561
562
563
.vicarious {Layouts available @ http://vicarious-hs.tumblr.com/}
564
565
566
</style></td></tr></table></td></tr></table><div class="vicariousmasthead">
567
568
569
<img src="http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l10_zpsd1f05af4.jpg~original">
570
571
572
</div><table class=v><tr><td><table><tr><td></td></tr></table><table style="display:none"><tr><td>
573
 
574
 
575
-----------------------------LIKE TO MEET---------------------------------
576
 
577
</td></tr></table></td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0" border="0"><tr><td><table cellspacing="0" cellpadding="0" border="0"><tr><td valign="top" align="center" style="width:500px; display:block; word-wrap:break-word">
578
579
<font class="h2">Your Name Here</font> 
580
 
581
582
<font class="h8">Verse 1 - Verse 2 - Verse 3 - Verse 4</font>
583
584
<img src="http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l_zps0b4afcd6.jpg~original">
585
586
<font class="h8">Multi-Para to Novella, Third Person POV</font>
587
588
 </td></tr></table></td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0" border="0"><tr><td><table cellspacing="0" cellpadding="0" border="0"><tr><td valign="top" align="center" style="width:500px; display:block; word-wrap:break-word">
589
590
591
<table><tr>
592
593
594
<td><div class="hbox1" style="background-image:url(http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l17_zpsfa5e427f.jpg~original);">
595
<div class="hbox1a">
596
597
This is box 1.  Text goes here. 
598
599
</div></div></td>
600
601
<td><div class="hbox1" style="background-image:url(http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l17_zpsfa5e427f.jpg~original);">
602
<div class="hbox1a">
603
604
This is box 2.  Text goes here.
605
606
</div></div></td>
607
608
<td><div class="hbox1" style="background-image:url(http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l17_zpsfa5e427f.jpg~original);">
609
<div class="hbox1a">
610
611
This is box 3.  Text goes here.
612
613
</div></div></td></tr></table>
614
615
616
</td></tr></table></td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0" border="0"><tr><td><table cellspacing="0" cellpadding="0" border="0"><tr><td valign="top" align="center" style="width:500px; display:block; word-wrap:break-word">
617
618
<font class="h5">Main Connections</font> 
619
620
</td></tr></table></td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0" border="0"><tr><td><table cellspacing="0" cellpadding="0" border="0"><tr><td valign="top" align="center" style="width:500px; display:block; word-wrap:break-word">
621
622
<div class="vicframe" style="background-image:url(http://i40.tinypic.com/140xnw3.jpg);"><div class="viccontrol">
623
624
<table><tr>
625
<td><a class="second" href="#conn1"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
626
<td><a class="second" href="#conn2"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
627
<td><a class="second" href="#conn3"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
628
<td><a class="second" href="#conn4"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
629
</tr><tr>
630
<td><a class="second" href="#conn5"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
631
<td><a class="second" href="#conn6"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
632
<td><a class="second" href="#conn7"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
633
<td><a class="second" href="#conn8"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
634
</tr><tr>
635
<td><a class="second" href="#conn9"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
636
<td><a class="second" href="#conn10"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
637
<td><a class="second" href="#conn11"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
638
<td><a class="second" href="#conn12"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
639
</tr><tr>
640
<td><a class="second" href="#conn13"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
641
<td><a class="second" href="#conn14"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
642
<td><a class="second" href="#conn15"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
643
<td><a class="second" href="#conn16"><img src="http://i.imgur.com/wTA99l4.jpg"></a></td> 
644
</tr></table>
645
 
646
</div><div class="vicframeimg">
647
 
648
 
649
<a id="conn1" href="#"><table><tr><td><div class="VC">
650
<font class="h4">Connection 1 Here</font>
651
<a class="cons" href="/FRIENDID">View Profile</a>
652
653
<img align=left src="http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l22_zpsbf91791c.jpg~original"> 
654
I have included a pic (aligned to the left)in Connection 1's box to show you that you can put a larger pic in here before the text field, but if you just want text, remove the image.  BE HELLUVA CAREFUL NOT TO DROP ANY OF THESE CODE TAGS.
655
</div></td></tr></table></a>
656
657
<a id="conn2" href="#"><table><tr><td><div class="VC">
658
<font class="h4">Connection 2 Here</font>
659
<a class="cons" href="/FRIENDID">View Profile</a>
660
Text goes here
661
</div></td></tr></table></a>
662
663
<a id="conn3" href="#"><table><tr><td><div class="VC">
664
<font class="h4">Connection 3 Here</font>
665
<a class="cons" href="/FRIENDID">View Profile</a>
666
Text goes here
667
</div></td></tr></table></a>
668
669
<a id="conn4" href="#"><table><tr><td><div class="VC">
670
<font class="h4">Connection 4 Here</font>
671
<a class="cons" href="/FRIENDID">View Profile</a>
672
Text goes here
673
</div></td></tr></table></a>
674
675
<a id="conn5" href="#"><table><tr><td><div class="VC">
676
<font class="h4">Connection 5 Here</font>
677
<a class="cons" href="/FRIENDID">View Profile</a>
678
Text goes here
679
</div></td></tr></table></a>
680
681
<a id="conn6" href="#"><table><tr><td><div class="VC">
682
<font class="h4">Connection 6 Here</font>
683
<a class="cons" href="/FRIENDID">View Profile</a>
684
Text goes here
685
</div></td></tr></table></a>
686
687
<a id="conn7" href="#"><table><tr><td><div class="VC">
688
<font class="h4">Connection 7 Here</font>
689
<a class="cons" href="/FRIENDID">View Profile</a>
690
Text goes here
691
</div></td></tr></table></a>
692
693
<a id="conn8" href="#"><table><tr><td><div class="VC">
694
<font class="h4">Connection 8 Here</font>
695
<a class="cons" href="/FRIENDID">View Profile</a>
696
Text goes here
697
</div></td></tr></table></a>
698
699
<a id="conn9" href="#"><table><tr><td><div class="VC">
700
<font class="h4">Connection 9 Here</font>
701
<a class="cons" href="/FRIENDID">View Profile</a>
702
Text goes here
703
</div></td></tr></table></a>
704
705
<a id="conn10" href="#"><table><tr><td><div class="VC">
706
<font class="h4">Connection 10 Here</font>
707
<a class="cons" href="/FRIENDID">View Profile</a>
708
Text goes here
709
</div></td></tr></table></a>
710
711
<a id="conn11" href="#"><table><tr><td><div class="VC">
712
<font class="h4">Connection 11 Here</font>
713
<a class="cons" href="/FRIENDID">View Profile</a>
714
Text goes here
715
</div></td></tr></table></a>
716
717
<a id="conn12" href="#"><table><tr><td><div class="VC">
718
<font class="h4">Connection 12 Here</font>
719
<a class="cons" href="/FRIENDID">View Profile</a>
720
Text goes here
721
</div></td></tr></table></a>
722
723
<a id="conn13" href="#"><table><tr><td><div class="VC">
724
<font class="h4">Connection 13 Here</font>
725
<a class="cons" href="/FRIENDID">View Profile</a>
726
Text goes here
727
</div></td></tr></table></a>
728
729
<a id="conn14" href="#"><table><tr><td><div class="VC">
730
<font class="h4">Connection 14 Here</font>
731
<a class="cons" href="/FRIENDID">View Profile</a>
732
Text goes here
733
</div></td></tr></table></a>
734
735
<a id="conn15" href="#"><table><tr><td><div class="VC">
736
<font class="h4">Connection 15 Here</font>
737
<a class="cons" href="/FRIENDID">View Profile</a>
738
Text goes here
739
</div></td></tr></table></a>
740
741
<a id="conn16" href="#"><table><tr><td><div class="VC">
742
<font class="h4">Connection 16 Here</font>
743
<a class="cons" href="/FRIENDID">View Profile</a>
744
Text goes here
745
</div></td></tr></table></a>
746
  
747
</div></div>
748
749
750
<font class="h6">Friends - Fiends - Foes</font>  
751
752
 
753
-----------------------------INTERESTS---------------------------------
754
755
</td></tr></table></td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0" border="0"><tr><td><table cellspacing="0" cellpadding="0" border="0"><tr><td valign="top" align="center" style="width:425px; display:block; word-wrap:break-word">
756
757
758
<font class="h5">The Devil Is In The Details</font> 
759
760
</td></tr></table></td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0" border="0"><tr><td><table cellspacing="0" cellpadding="0" border="0"><tr><td valign="top" align="center" style="width:425px; display:block; word-wrap:break-word">
761
762
763
<div class="about">
764
765
<p>This is your About Me section.  Input your biographical information here.
766
767
<font class="h1">General Layout Info</font>
768
769
<p>Always replace the XXXXXX in the links with your friend ID number.  Links are located in the "Music" section of this layout.  For links to your mains, put the friend id number for your connections where you see FriendID.
770
771
<p>Banner:  To replace the image in the banner portion of this layout, go to About Me and scroll down to the bottom.  Put your http address for your uploaded image in place of the current one between the " and ".
772
773
<p>REMINDER:  For ALL images, always use the DIRECT LINK provided to you by your image hosting site.
774
775
<p>For images that are hover boxes, find the background-image:url("http://..."); area and replace my http address with yours.
776
777
<p>Replace the provided music player with one of your own.  Use the color codes in that object coding as a guide.
778
779
<p>The first letter of a paragraph will be enlarged and the first line of a paragraph will have a different color.  If you do not want this effect, you can remove the paragraph codes in About Me or you can simply use the page break code <BR> tag in front of your paragraphs instead of the p tag (as seen in the beginning of this paragraph of instructions).
780
 
781
782
<p>For your reference, these are the header codes, etc found in this layout.
783
784
785
<font class="h1">Header1</font>
786
<font class="h2">Header2</font>
787
<font class="h3">Header3</font>
788
<font class="h4">Header4</font>
789
<font class="h5">Header5</font>
790
<font class="h6">Header6</font>
791
<font class="h7">Header7</font>
792
<font class="h8">Header8</font>
793
 
794
<font class="lyric">Line 1 of lyrics</font>
795
<font class="lyric2">Line 2 of lyrics</font>
796
<font class="lyric3">Line 3 of lyrics</font>
797
<font class="lyric4">Line 4 of lyrics</font>
798
<font class="lyric5">Line 5 of lyrics</font>
799
<font class="lyric6">Line 6 of lyrics</font>
800
<font class="lyric7">Line 7 of lyrics</font>
801
 
802
<BR><B>Bold</b> <i> Italic</i> <em>Emphasized text</em>
803
 
804
<BR>For the below text font classes and all of the headers (1, 2, 3, etc) and lyrics, please note the following:  I code for ALL sites.  Not every website will allow headers to be placed as h1 etc between < these > brackets.  For that reason, I turn them into font classes with a period in front and script them as I have done below.  If you are on a website that allows regular header, underline, strong, etc coding, you can just use regular header coding for all of the header, lyric, special text labels OR just leave them as they are.  They will work for you either way.  SEE THE INSTRUCTIONS FOR THIS LAYOUT FOR SPECIFIC DETAILS AND EXAMPLES.
805
<BR><BR>
806
<font class="b2">Bold2</font>
807
<font class="b3">Bold3</font>
808
<font class="b4">Bold4</font>
809
<font class="strong">Strong</font>
810
<font class="strike">Strike</font>
811
<font class="u">Underline</font>
812
 
813
<BR><BR>I have also included the below two special text classes that are fine as is and need no modification on any site.
814
 
815
<big>big</big>
816
<small>Small</small>
817
 
818
819
</div>
820
 
821
<font class="h6">Past - Present - Future</font>   
822
 
823
 
824
</td></tr></table></td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0" border="0"><tr><td><table cellspacing="0" cellpadding="0" border="0"><tr><td valign="top" align="center" style="width:425px; display:block; word-wrap:break-word">
825
826
<font class="h7">Homicidal Tendencies</font> 
827
828
<table><tr><td>
829
830
<img class="img2" src="http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l22_zpsbf91791c.jpg~original">
831
832
</td><td><div class="pers">
833
834
<b>Traits:</b> Input Info
835
<BR><b>Disorders:</b> Input Info
836
<BR><b>Addictions:</b> Input Info
837
<BR><b>Likes:</b> Input Info
838
<BR><b>Dislikes:</b> Input Info
839
<BR><b>Quirks:</b> Input Info
840
<BR>This is the section for your personality.  Add additional details as needed.
841
 
842
843
</div><div class="music">
844
845
<object type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_mini.swf" width="200" height="20">
846
    <param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_mini.swf" />
847-
    <param name="bgcolor" value="#333333" />
847+
    <param name="bgcolor" value="#1c1b16" />
848-
    <param name="FlashVars" value="mp3=http%3A//k002.kiwi6.com/hotlink/wsq2887c51/the_hunger_games_-_deep_shadows_soundtrack_www.mp3fiber.com_.mp3&autoplay=1&bgcolor=333333&loadingcolor=696e71&buttoncolor=696e71&slidercolor=696e71" />
848+
    <param name="FlashVars" value="mp3=http%3A//k002.kiwi6.com/hotlink/wsq2887c51/the_hunger_games_-_deep_shadows_soundtrack_www.mp3fiber.com_.mp3&autoplay=1&bgcolor=1c1b16&loadingcolor=631515&buttoncolor=631515&slidercolor=631515" />
849
</object>
850
851
</div></td><td>
852
853
<img class="img2" src="http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l22_zpsbf91791c.jpg~original">
854
855
</td></tr></table>
856
 
857
<font class="h8">I don't care if you're offended</font> 
858
859
</td></tr></table></td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0" border="0"><tr><td><table cellspacing="0" cellpadding="0" border="0"><tr><td valign="top" align="center" style="width:425px; display:block; word-wrap:break-word">
860
861
<font class="h1">The Short and Sweet of It</font>
862
863
<div class="statsL">
864
<img src="http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l1_zps633210fd.jpg~original">
865
866
</div><div class="statsR">
867
868
<font class="h3">Legal</font>
869
 
870
<b>NAME:</b> Input info
871
<BR><b>NICKNAMES:</b> Input info
872
<BR><b>ALIASES:</b> Input info
873
<BR><b>DATE OF BIRTH:</b> Input info
874
<BR><b>PLACE OF BIRTH:</b> Input info
875
<BR><b>CURRENT RESIDENCE:</b> Input info 
876
877
<font class="h3">Physical</font>
878
 
879
<b>ETHNICITY:</b> Input info
880
<BR><b>HAIR COLOR:</b> Input info
881
<BR><b>EYE COLOR:</b> Input info
882
<BR><b>HEIGHT:</b> Input info
883
<BR><b>WEIGHT:</b> Input info
884
<BR><b>BIRTHMARKS/SCARS:</b> Input info
885
886
<font class="h3">Family</font>
887
 
888
<b>MOTHER:</b> Input info
889
<BR><b>FATHER:</b> Input info
890
<BR><b>SISTER(S):</b> Input info
891
<BR><b>BROTHER(S):</b> Input info
892
<BR><b>Other Family:</b> Input info
893
 
894
<font class="h3">Relationships</font>
895
 
896
<b>SEXUAL ORIENTATION:</b> Input info
897
<BR><b>RELATIONSHIP STATUS:</b> Input info
898
<BR><b>CURRENT RELATIONSHIP(S):</b> Input info
899
<BR><b>PAST RELATIONSHIP(S):</b> Input info 
900
 
901
<font class="h3">Education</font>
902
 
903
<b>High School</b> Input Info
904
<br><b>College</b> Input Info
905
<br><b>Major</b> Input Info
906
<br><b>Degree</b> Input Info 
907
 
908
<font class="h3">Employment</font>
909
 
910
<b>OCCUPATION:</b> Input info
911
<BR><b>JOB DESCRIPTION:</b> Input info
912
<BR><b>EMPLOYER:</b> Input info
913
<BR><b>SKILLSET:</b> Input info
914
 
915
</div>
916
917
918
</td></tr></table></td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0" border="0"><tr><td><table cellspacing="0" cellpadding="0" border="0"><tr><td valign="top" align="center" style="width:425px; display:block; word-wrap:break-word">
919
 
920
921
<font class="lyric">Try to remember how it felt</font>
922
<font class="lyric2">To just make up your own steps</font>
923
<font class="lyric3">And let anklebiters</font>
924
<font class="lyric4">Chew up, spit out someone else</font>
925
<font class="lyric5">Fall in love with yourself</font>
926
<font class="lyric6">Because someday you’re gonna be</font>
927
<font class="lyric7">The only one you’ve got</font>
928
 
929
930
 
931
</td></tr></table></td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0" border="0"><tr><td><table cellspacing="0" cellpadding="0" border="0"><tr><td valign="top" align="center" style="width:425px; display:block; word-wrap:break-word">
932
933
<img class="img1" src="http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l25_zpsa9a1c828.jpg~original">
934
 
935
<img class="img1" src="http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l25_zpsa9a1c828.jpg~original">
936
937
<img class="img1" src="http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l25_zpsa9a1c828.jpg~original">
938
939
<img class="img1" src="http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l25_zpsa9a1c828.jpg~original">
940
941
<img class="img1" src="http://i1080.photobucket.com/albums/j334/Vicarious_HS/layouts/l25_zpsa9a1c828.jpg~original">
942
943
944
-----------------------------MUSIC---------------------------------
945
946
 </td></tr></table></td></tr></table><table  cellspacing="0" cellpadding="0" border="0"><tr><td><table cellspacing="0" cellpadding="0" border="0"><tr><td valign="top" align="center" style="width:450px; display:block; word-wrap:break-word">
947
948
 
949
<div class="leftside">
950
<a class="first" href="/logincomplete.php" title="Home">H</a> 
951
<a class="first" href="/invite_friend.php?friend_id=xxxxxx" title="Add">A</a> 
952
<a class="first" href="/send_message.php?member_id=xxxxxx" title="Message">M</a> 
953
<a class="first" href="/add_testimonial.php?member_id=xxxxxx" title="Comment">C</a> 
954
<a class="first" href="/gallery.php?member_id=xxxxxx" title="Photos">P</a> 
955
<a class="first" href="/view_member_blog.php?member_id=xxxxxx" title="Blogs">B</a> 
956
</div>