View difference between Paste ID: ASh8YQ8g and nSfb18Zt
SHOW: | | - or go back to the newest paste.
1
       				        !!!!!!!!!!!!Read It!!!!!!!!!!!!
2
 
3
                                                (⊙.⊙(☉_☉)⊙.⊙)
4
 
5
CAN'T EMPHASIZE THIS ENOUGH:  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.   
6
7
............................
8
9-
IMAGES
9+
IMAGE SIZES:
10
11-
This layout will code image sizes for you.  For the sake of simplicity you may make all photos 250px width by 250px height EXCEPT the 'default' photo in Like to Meet and the 'banner' size photo in Music. The tall 'default' image is 275px width by 500px height.  The 'banner' (Vicbox) image in Music is 500px width by 300px height.
11+
Image sizes are located in 'Television'
12
 ............................
13-
If you elect to keep the color scheme for pics, the psd is here:
13+
14-
https://drive.google.com/file/d/0B79YHAkeE7SuejREWlRIbFllX3M
14+
15
 
16
REPLACE MY MUSIC PLAYER WITH YOUR OWN.  
17
18
Read the cited note under the music player for additional instructions.
19
 
20
............................
21
 
22
23
FOR ROLEPLAYER.ME USERS:
24
 
25
For the below text font classes and all of the headers (1, 2, 3, etc) and lyrics, please note the following:  
26
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.  
27
 
28
<font class="h1">Header 1</font>
29
 
30
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:
31
<h1>Header</h1> <strike>Strike</strike> etc..
32
 
33
OR just leave them as they are.  They will work for you either way.  
34
35
36
///////////////////////////////////////////////////
37
 
38
 
39
 
40
                        Don't forget to replace the XXXXX with your friend ID number.
41
 
42
                                                     (>‿◠)✌
43
 
44
 
45
                *****************************SAVE YOUR WORK AS YOU GO.*******************************
46
                                
47
 
48
DO NOT REMOVE THE .VICARIOUS MARKERS FROM ANY VICARIOUS LAYOUT.  
49
 
50
-----------------------------ABOUT ME-----------------------------
51
<style type="text/css">
52
@import url(http://fonts.googleapis.com/css?family=Raleway:400,800,100,200,300,500,600,700,900|Josefin+Sans|Oswald:300,400,700|Six+Caps|Dynalight|Great+Vibes|Tangerine:400,700|Roboto+Condensed:400,700);
53
  
54
/* - -DO NOT PUT ANYTHING ABOVE THE @import LINE ABOVE - - */  
55
/* - -DO NOT REARRANGE MY CODING!! ORDER IS IMPORTANT! - - */
56
  
57
 
58
.vicarious { Structure }
59
 
60
body {
61
background-image:url(http://i58.tinypic.com/2ziy2yt.jpg);   
62
background-color:5a5862;
63
background-repeat:repeat;
64-
-----------------------------TV---------------------------
64+
background-attachment:fixed;
65
background-position:center center;
66-
-----------------------------BOOKS--------------------------------
66+
}   
67
 
68-
-----------------------------HEROES-------------------------------
68+
table, tr, td { background-color:transparent; border:0px; padding:0px; margin:0px; }
69
 
70
.vicinterests_table, .viclike2meet_table  {
71
visibility:visible;
72
z-index:2;
73
position:absolute;
74
top:0%;
75
left:50%;
76
border:0px;  
77
margin-top:5px;  
78
height:auto;
79
display:inline-block;
80
padding:0px;
81
}
82
 
83
.vicinterests_table{ width:300px; height:auto; margin-left:-205px;  }
84
.vicinterests_table tr { }
85
.vicinterests_table td { margin:0px; max-width:300px;  }  
86
 
87
.viclike2meet_table { width:500px; height:auto;  margin-left:102px;  }
88
.viclike2meet_table tr { }
89
.viclike2meet_table td { margin:0px; max-width:500px;   }
90
 
91
.vic_table {
92
width:100%;
93
margin-bottom:4px;
94
border:0px solid #090809;  
95
background-color:514f58;
96
overflow:hidden;
97
display:block; 
98
-webkit-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.75);
99
-moz-box-shadow:    1px 1px 5px 0px rgba(0, 0, 0, 0.75);
100
box-shadow:         1px 1px 5px 0px rgba(0, 0, 0, 0.75);
101
}
102
 
103
.vic_table tr { }
104
.vic_table td { width:100%;  }  
105
 
106
 .vicarious{ Google Chrome Scrollbar }
107
::-webkit-scrollbar {width: 10px;}
108
::-webkit-scrollbar-track {border: 1px solid #1b1a1d;background-color:transparent;}
109
::-webkit-scrollbar-thumb {border: 4px double #bdbcc0; background-color:36343a; -moz-border-radius-topright: 90px;-webkit-border-top-right-radius: 90px;border-top-right-radius: 90px;-moz-border-radius-bottomleft: 90px;-webkit-border-bottom-left-radius: 90px;border-bottom-left-radius: 90px;}
110
 
111
.vicarious { General Text }
112
 
113
table, tr, td, li, p, div, .text, .btext, a, b, i {
114
font-family:tahoma;
115
font-size:7pt;
116
line-height:100%;
117
color: 2d2c31;
118
padding:0px;
119
margin:0px;
120
text-decoration:none;
121
text-transform:none;
122
text-align:left;
123
word-wrap: break-word;
124
}
125
 
126
p {
127
text-align:justify;
128
margin-top: 5px;
129
text-indent:10px;
130
word-wrap: break-word;
131
}
132
 
133
p::first-line {  }
134
p::first-letter {   } 
135
 
136
b {
137
font-size:8pt;
138
text-transform:uppercase;
139
font-family: 'Roboto Condensed', sans-serif;
140
color:acabb0;
141
}  
142
 
143
i {
144
font-size:10pt;
145
color: ffffff;
146
font-family: 'Dynalight', cursive;
147
}
148
 
149
.u, u {
150
color: 9c9aa0;
151
text-decoration:underline;
152
}
153
 
154
.strike, strike {
155
color: bdbcc0;
156
text-decoration:line-through;
157
letter-spacing:1pt;
158
}
159
 
160
.strong, strong {
161
font-family: "Oswald", Helvetica, sans-serif;
162
font-size: 9pt;
163
text-transform:uppercase;
164
color: cdcccf;  
165
line-height:110%;
166
}
167
 
168
em {
169
font-family: 'Tangerine', cursive;
170
font-weight:700;
171
font-size:16pt;
172
color: dedddf;
173
}
174
 
175
.vicarious { Headers }
176
 
177
.h1, h1, .h2, h2, .h3, h3, .h4, h4, .h5, h5, .h6, h6, .h7, h7, .h8, h8, .h9, h9, .h10, h10, .h11, h11, .h12, h12, .h13, h13, .h14, h14, .h15, h15, .one, one, .two, two, .three, three, .blockquote, blockquote {
178
margin:0px;
179
padding:0px;
180
display:block;
181
text-transform:none;
182
line-height:100%;  
183
}  
184
185
.h1, h1 {
186
font-family: 'Josefin Sans', sans-serif;
187
text-align:center;
188
padding:5px; 
189
font-size:40pt;
190
color:acabb0;
191
text-transform:uppercase;
192
}
193
194
.h2, h2 {
195
font-family: 'Tangerine', cursive;
196
text-align:right;
197
padding:5px; 
198
font-size:15pt;
199
color:7a7981;
200
background-color:37363d;
201
border-top:2px solid #303033;
202
}
203
 
204
 
205
.h3, h3 {}
206
 
207
.h4, h4 {
208
font-family: 'Josefin Sans', sans-serif;
209
text-align:center;
210
padding:5px; 
211
font-size:30pt;
212
color:acabb0;
213
text-transform:uppercase;
214
border-bottom:2px solid #d7d6d9;
215
}
216
217
.h7, h7 {  
218
margin:31px 0px 31px 0px;
219
padding:2px;
220
font-family: "Oswald", Helvetica, sans-serif;
221
font-size:22px;
222
height:22px;
223
line-height: 22px;
224
text-align: center;
225
background-color:090809;
226
color:cdcccf;
227
text-transform:uppercase;
228
}   
229
 
230
 
231
.h13, h13 {
232
padding: 5px;
233
font-family: 'Great Vibes', cursive;
234
letter-spacing: 0pt ;
235
font-size:16pt;
236
line-height: 90%;
237
text-align:right;  
238
color:514f58;
239
border-bottom:2px solid #4e4c55;
240
}
241
  
242
 
243
.blockquote, blockquote {
244
height:auto;
245
text-align:justify;
246
margin:5px 5px 5px 10px;
247
padding: 5px 5px 5px 10px;
248
border-left:10px double #313036;
249
background-color:d2d0d7;
250
}
251
 
252
.cite {font-size:0px; color:transparent;display:block; height:0px;}
253
 
254
.vicarious { Divs }
255
256
/* Divider */
257
 
258
#wood {
259
visibility:visible;
260
z-index:2;
261
position:fixed;
262
top:0%;
263
left:50%;
264
border:0px;  
265
margin-top:0px; 
266
margin-left:-290px; 
267
padding:0px;
268
background-image:url(http://i61.tinypic.com/15wjtw2.jpg);
269
background-repeat:repeat-y;
270
background-position:top center;
271
width:70px;
272
height:100%;
273
-webkit-box-shadow: 10px 2px 12px 0px rgba(0, 0, 0, 0.68);
274
-moz-box-shadow:    10px 2px 12px 0px rgba(0, 0, 0, 0.68);
275
box-shadow:         10px 2px 12px 0px rgba(0, 0, 0, 0.68);
276
}
277
 
278
/* Subtract Wallpaper */
279
280
#back {
281
visibility:visible;
282
z-index:1;
283
position:fixed;
284
top:0%;
285
left:50%;
286
border:0px;  
287
margin-top:0px; 
288
margin-left:-290px; 
289
padding:0px;
290
background-color:514f58; 
291
width:100%;
292
height:100%;
293
}
294
295
/* Decotitle */
296
297
.decoTitle {
298
background-image:url(http://i57.tinypic.com/bff2v7.jpg);
299
background-position:center center;
300
background-repeat:no-repeat;
301
margin:0px;
302
padding:0px;
303
width:300px;
304
height:88px;
305
overflow:hidden;
306
} 
307
308
/* Sidebar */
309
310
#sidebar, #sidebar .frame, #sidebar .decoTitle-sidebar, #sidebar .box, #sidebar .linx, #sidebar .music {
311
-webkit-transition: all 0.6s ease-in-out 0s;
312
-moz-transition: all  0.6s ease-in-out 0s;
313
-ms-transition: all  0.6s ease-in-out 0s;
314
-o-transition: all  0.6s ease-in-out 0s;
315
transition: all  0.6s ease-in-out 0s;
316
}
317
318
#sidebar:hover, #sidebar:hover .decoTitle-sidebar, #sidebar:hover .box, #sidebar:hover .linx, #sidebar:hover .music {
319
-webkit-transition: all 0.6s ease-in-out .6s;
320
-moz-transition: all  0.6s ease-in-out .6s;
321
-ms-transition: all  0.6s ease-in-out .6s;
322
-o-transition: all  0.6s ease-in-out .6s;
323
transition: all  0.6s ease-in-out .6s;
324
}
325
 
326
#sidebar {
327
visibility:visible;
328
z-index:2;
329
position:fixed;
330
top:0%;
331
left:50%;
332
border:0px;  
333
margin-top:0px; 
334
margin-left:-605px; 
335
background-color:transparent;
336
padding:0px; 
337
width:300px;
338
height:100%;
339
}
340
341
#sidebar:hover {
342
background-color:37363f;
343
}
344
345
#sidebar .frame {
346
z-index:2;
347
position:absolute;
348
margin-top:50px;
349
margin-left:0px;
350
width:300px;
351
height:300px; 
352
opacity:1;
353
}
354
355
#sidebar:hover .frame {
356
opacity:0;
357
}
358
359
.frame img {
360
position:absolute;
361
margin-top:36px;
362
margin-left:36px;
363
width:228px;
364
height:228px;
365
} 
366
367
#sidebar .decoTitle-sidebar {
368
position:absolute;
369
margin-top:20px;
370
margin-left:0px; 
371
opacity:0;
372
} 
373
374
#sidebar:hover .decoTitle-sidebar { 
375
opacity:1;
376
}
377
378
#sidebar .box {
379
z-index:3;
380
position:absolute;
381
margin-top:110px;
382
margin-left:25px;
383
-webkit-border-radius: 20px;
384
-moz-border-radius: 20px;
385
border-radius: 20px;
386
width:242px;
387
height:242px;
388
background-color:6a6871;
389
border:4px double #090809;
390
overflow:hidden;
391
opacity:0;
392
}
393
394
#sidebar:hover .box {
395
opacity:1;
396
}
397
398
#sidebar .inner { 
399
padding:5px;
400
width:232px;
401
height:232px;
402
overflow:auto;
403
text-align:center;
404
}
405
406
#sidebar big {
407
display:block;
408
margin:20px 5px 10px 5px;
409
padding:2px;
410
line-height:30%;
411
font-size:14pt;
412
background-color:514f58;
413
color:acabb0;
414
text-transform:uppercase;
415
text-align:center;
416
font-family: "Oswald", Helvetica, sans-serif;
417
}
418
419
#sidebar .music {
420
z-index:3;
421
position:absolute;
422
margin-top:440px;
423
margin-left:0px;
424
width:300px;
425
height:20px;
426
text-align:center;
427
opacity:0;
428
}
429
430
#sidebar:hover .music {
431
opacity:1;
432
}
433
434
#sidebar .linx {
435
z-index:3;
436
position:absolute;
437
margin-top:380px;
438
margin-left:0px;
439
width:300px;
440
height:60px;
441
text-align:center;
442
opacity:0;
443
}
444
445
#sidebar:hover .linx {
446
opacity:1;
447
}
448
449
#sidebar a {
450
background-image:url(http://i59.tinypic.com/t9e9gk.jpg);
451
background-repeat:repeat;
452
background-position:center center;
453
display:inline-block;
454
padding:0px;
455
-webkit-border-radius: 360px;
456
-moz-border-radius: 360px;
457
border-radius: 360px;
458
background-color:7a7981;
459
-webkit-animation: spin 10s infinite linear;
460
-moz-animation: spin 10s infinite linear;
461
-ms-transition: spin 10s infinite linear;
462
-o-transition: spin 10s infinite linear;
463
animation: spin 10s infinite linear; 
464
-webkit-transition: background-color 0.6s ease-in-out .6s;
465
-moz-transition: background-color  0.6s ease-in-out .6s;
466
-ms-transition: background-color  0.6s ease-in-out .6s;
467
-o-transition: background-color 0.6s ease-in-out .6s;
468
transition: background-color  0.6s ease-in-out .6s;
469
-webkit-box-shadow: 1px 1px 5px 0px rgba(0, 0, 0, 0.75);
470
-moz-box-shadow:    1px 1px 5px 0px rgba(0, 0, 0, 0.75);
471
box-shadow:         1px 1px 5px 0px rgba(0, 0, 0, 0.75);
472
473
}
474
475
#sidebar a.LK1 {
476
background-size:20px 20px;
477
width:20px;
478
height:20px;
479
margin:12.5px 5px;
480
}
481
482
#sidebar a.LK2 {
483
background-size:25px 25px;
484
width:25px;
485
height:25px;
486
margin:10px 5px;
487
}
488
489
#sidebar a.LK3 {
490
background-size:30px 30px;
491
width:30px;
492
height:30px;
493
margin:7.5px 5px;
494
}
495
496
#sidebar a.LK4 {
497
background-size:35px 35px;
498
width:35px;
499
height:35px;
500
margin:5px;
501
} 
502
503
#sidebar a.LK1:Hover,
504
#sidebar a.LK2:Hover,
505
#sidebar a.LK3:hover,
506
#sidebar a.LK4:hover {
507
background-size:15px 15px;
508
width:35px;
509
height:35px;
510
margin:5px;
511
} 
512
513
#sidebar a:hover {  
514
background-color:514f58;
515
-webkit-transition: all 0.6s ease-in-out .6s;
516
-moz-transition: all 0.6s ease-in-out .6s;
517
-ms-transition:all 0.6s ease-in-out .6s;
518
-o-transition: all 0.6s ease-in-out .6s;
519
transition: all 0.6s ease-in-out .6s;
520
}
521
522
@-moz-keyframes spin {
523
    from { -moz-transform: rotate(0deg); }
524
    to { -moz-transform: rotate(360deg); }
525
}
526
@-webkit-keyframes spin {
527
    from { -webkit-transform: rotate(0deg); }
528
    to { -webkit-transform: rotate(360deg); }
529
}
530
@keyframes spin {
531
    from {transform:rotate(0deg);}
532
    to {transform:rotate(360deg);}
533
}
534
535
536
 
537
/* Name Table */
538
539
#namebox {
540
width:500px; 
541
height:160px;
542
overflow:hidden;
543
background-image:url(http://i57.tinypic.com/zl6rk4.jpg);  
544
background-repeat:repeat; 
545
background-position:center center;  
546
background-color:514f58;
547
border-top:15px solid #6a6871; 
548
border-bottom:15px solid #6a6871;
549
}
550
551
.pearla, .pearlb {
552
position:absolute;
553
background-color:eeeeef;
554
border:4px double #dedddf;
555
margin-top:60px;
556
width:32px;
557
height:32px;  
558
-webkit-border-radius: 360px;
559
-moz-border-radius: 360px;
560
border-radius: 360px;
561
-webkit-box-shadow: inset 1px 0px 22px -2px rgba(50, 50, 50, 0.75);
562
-moz-box-shadow:    inset 1px 0px 22px -2px rgba(50, 50, 50, 0.75);
563
box-shadow:         inset 1px 0px 22px -2px rgba(50, 50, 50, 0.75);
564
}
565
566
.pearla { margin-left:20px; }
567
.pearlb { margin-left:440px; }
568
569
.nameplate {
570
position:absolute;
571
margin-top:5px;
572
margin-left:80px;
573
width:340px;
574
height:150px;
575
background-image:url(http://i57.tinypic.com/29xhnc6.jpg);
576
background-repeat:no-repeat;
577
background-position:center center;
578
}
579
580
.nameplate .h6 {
581
padding:5px;
582
display:block;
583
margin-top:50px;
584
text-align:center; 
585
font-size: 30px;
586
height:40px;
587
line-height:40px;
588
-webkit-box-shadow: inset 1px 0px 22px -2px rgba(50, 50, 50, 0.75);
589
-moz-box-shadow:    inset 1px 0px 22px -2px rgba(50, 50, 50, 0.75);
590
box-shadow:         inset 1px 0px 22px -2px rgba(50, 50, 50, 0.75); 
591
background-color:eeeeef;
592
font-family: 'Great Vibes', cursive;
593
color:acabb0;
594
}
595
596
/* Side by Side Pic/Text Table */
597
598
#L2Mbox {
599
width:500px; 
600
height:310px;
601
overflow:hidden;
602
}
603
604
#L2Mbox img {
605
position:absolute; 
606
margin-top:5px; 
607
margin-left:295px; 
608
width:200px; 
609
height:300px; 
610
overflow:hidden;  
611
}
612
613
#L2Mbox .textbox {
614
position:absolute;
615
margin-top:60px;
616
margin-left:5px; 
617
padding:5px;
618
width:267px;
619
height:227px; 
620
overflow:auto;
621
background-color:6a6871;
622
border:4px double #090809;
623
}
624
625
#L2Mbox .titles {
626
position:absolute;
627
margin-top:5px;
628
margin-left:5px;
629
height:47px;
630
width: 278px;
631
overflow:hidden;
632
background-color:6a6871;
633
border:4px double #090809;  
634
}
635
636
#L2Mbox .one {
637
text-align:center; 
638
margin:0px;
639
padding:2px 5px;
640
color:acabb0;
641
font-size:16px;
642
height:16px;
643
line-height:16px; 
644
letter-spacing:3pt;
645
font-family: 'Raleway', sans-serif;
646
text-transform:uppercase;
647
}
648
649
#L2Mbox .two {
650
text-align:center; 
651
margin:0px;
652
padding:2px 5px;
653
background-color:090809;
654
color:cdcccf;
655
font-size:11px;
656
height:11px;
657
line-height:11px;
658
letter-spacing:2pt;
659
font-family: 'Roboto Condensed', sans-serif;
660
text-transform:uppercase;
661
}
662
663
#L2Mbox .three {
664
text-align:center; 
665
margin:0px;
666
padding:2px 5px;
667
color:acabb0;
668
font-size:8px;
669
height:8px;
670
line-height:8px; 
671
letter-spacing:2pt;
672
font-family: 'Six Caps', sans-serif;
673
text-transform:uppercase;
674
}
675
676
/* 3 Vol. Table */
677
  
678
#tales { 
679
height:248px; 
680
width:500px;
681
overflow:hidden;
682
}
683
684
.sider {
685
position:absolute;
686
margin-top:15px;
687
height:200px; 
688
width:205px; 
689
padding:5px; 
690
text-align:justify;
691
background-color:6a6871;
692
border:4px double #090809;
693
}
694
695
.sider-xxx, .sider-yyy, .sider-zzz  {
696
z-index:3;
697
overflow-x:hidden;
698
overflow-y:auto;
699
-webkit-transition: all 0.6s linear .6s;
700
-moz-transition: all  0.6s linear .6s;
701
-ms-transition: all  0.6s linear .6s;
702
-o-transition: all  0.6s linear .6s;
703
transition: all  0.6s linear .6s;
704
}
705
706
.sider-xxx {margin-left:15px;}
707
.sider-yyy {margin-left:262px;}
708
.sider-zzz {margin-left: 138.5px;}
709
710
.sider-xxx:hover, .sider-yyy:hover, .sider-zzz:hover {
711
z-index:4;
712
width:452px; 
713
margin-left:15px;
714
-webkit-transition: all 0.6s linear .6s;
715
-moz-transition: all  0.6s linear .6s;
716
-ms-transition: all  0.6s linear .6s;
717
-o-transition: all  0.6s linear .6s;
718
transition: all  0.6s linear .6s;
719
}
720
721
.sider .title {
722
padding:0px;
723
margin:0px; 
724
height:50px; 
725
width:195px;
726
display:block;
727
text-align:center;
728
overflow:hidden;
729
-moz-border-radius-bottomright: 90px;
730
-webkit-border-bottom-right-radius: 90px;
731
border-bottom-right-radius: 90px;
732
-moz-border-radius-bottomleft: 90px;
733
-webkit-border-bottom-left-radius: 90px;
734
border-bottom-left-radius: 90px;
735
-webkit-box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.75);
736
-moz-box-shadow:    0px 5px 5px 0px rgba(0, 0, 0, 0.75);
737
box-shadow:         0px 5px 5px 0px rgba(0, 0, 0, 0.75);
738
background-image:url(http://i58.tinypic.com/2ziy2yt.jpg);   
739
background-color:5a5862;
740
background-repeat:repeat; 
741
background-position:center center;
742
background-size:250px 135px;
743
-webkit-transition: all .6s linear .6s;
744
-moz-transition: all  .6s linear .6s;
745
-ms-transition: all .6s linear .6s;
746
-o-transition: all  .6s linear .6s;
747
transition: all  .6s linear .6s; 
748
}
749
750
.sider-xxx:hover .title, .sider-yyy:hover .title, .sider-zzz:hover .title {
751
width:430px; 
752
margin-left:11px;
753
-webkit-transition: all 0.6s linear .6s;
754
-moz-transition: all  0.6s linear .6s;
755
-ms-transition: all  0.6s linear .6s;
756
-o-transition: all  0.6s linear .6s;
757
transition: all  0.6s linear .6s; 
758
}
759
760
.sider small, .sider big {
761
display:block;
762
position:absolute;
763
padding:5px 0px;
764
margin-top:10px; 
765
margin-left:5px;
766
width:185px;
767
line-height:20px;
768
font-size:12pt;
769
text-align:center;
770
text-transform:uppercase;
771
color:bdbcc0;
772
background-color:090809; 
773
-moz-border-radius-bottomright: 90px;
774
-webkit-border-bottom-right-radius: 90px;
775
border-bottom-right-radius: 90px;
776
-moz-border-radius-bottomleft: 90px;
777
-webkit-border-bottom-left-radius: 90px;
778
border-bottom-left-radius: 90px;
779
}
780
781
782
.sider small, .sider-xxx:hover small, .sider-yyy:hover small, .sider-zzz:hover small, .sider big, .sider-xxx:hover big, .sider-yyy:hover big, .sider-zzz:hover big  {
783
-webkit-transition: all .6s linear .6s;
784
-moz-transition: all  .6s linear .6s;
785
-ms-transition: all .6s linear .6s;
786
-o-transition: all  .6s linear .6s;
787
transition: all  .6s linear .6s; 
788
}
789
790
.sider small {opacity:1; }
791
.sider-xxx:hover small, .sider-yyy:hover small, .sider-zzz:hover small {opacity:0; } 
792
793
.sider big {opacity:0; }
794
.sider-xxx:hover big, .sider-yyy:hover big, .sider-zzz:hover big  {opacity:1; width:420px; }
795
 
796
797
/* About Table */
798
 
799
.about { 
800
margin:15px; 
801
padding:5px; 
802
width:452px;
803
height:136px; 
804
text-align:justify;
805
overflow:auto;
806
background-color:6a6871;
807
border:4px double #090809;
808
} 
809
810
.wallpBack { 
811
border-top:5px solid #242327;
812
border-bottom:5px solid #242327;
813
height:15px;
814
width:500px;
815
overflow:hidden;
816
margin:5px 0px;
817
background-image:url(http://i58.tinypic.com/2ziy2yt.jpg);   
818
background-color:5a5862;
819
background-repeat:repeat; 
820
background-position:center center;
821
background-size:250px 135px;
822
} 
823
824
.img1 { margin:5px 0px 15px 0px; }
825
 
826
827
/* Stats Table */
828
829
.stats {
830
margin:10px;  
831
width:272px;
832
height:232px;
833
overflow:hidden;
834
text-align:justify;
835
background-color:6a6871;
836
border:4px double#090809;
837
-webkit-border-radius: 20px;
838
-moz-border-radius: 20px;
839
border-radius: 20px;
840
}
841
842
.stats .inner {  
843
padding:5px;
844
width:262px;
845
height:222px;
846
overflow:auto;
847
}
848
849
850
.decoTitle-stats {
851
background-image:url(http://i57.tinypic.com/bff2v7.jpg);
852
background-position:center center;
853
background-repeat:no-repeat;
854
margin:10px 0px 5px 0px;
855
width:300px;
856
height:88px;
857
overflow:hidden;
858
} 
859
860
/* Connections Table - 9 pics */
861
 
862
.conns {
863
width:300px;
864
height:300px;
865
overflow:hidden;
866
background-color:d9d8df;
867
}
868
 
869
.conns img {
870
float:left;
871
overflow:hidden;
872
margin:0px 5px 0px 0px;
873
width:80px;
874
height:80px;
875
border:5px solid #37363f;
876
-webkit-border-radius: 0px;
877
-moz-border-radius: 0px;
878
border-radius: 0px;
879
-webkit-transition: all 0.2s ease-in-out;
880
-moz-transition: all  0.2s ease-in-out;
881
-ms-transition: all  0.2s ease-in-out;
882
-o-transition: all  0.2s ease-in-out;
883
transition: all  0.2s ease-in-out;
884
}
885
 
886
.conn1:hover img, .conn2:hover img, .conn3:hover img, .conn4:hover img, .conn5:hover img, .conn6:hover img, .conn7:hover img, .conn8:hover img, .conn9:hover img {
887
width:50px;
888
height:50px;
889
border:20px solid #1b1a1d;
890
-webkit-border-radius: 360px;
891
-moz-border-radius: 360px;
892
border-radius: 360px;
893
-webkit-transition: all 0.6s ease-in-out .6s;
894
-moz-transition: all  0.6s ease-in-out .6s;
895
-ms-transition: all  0.6s ease-in-out .6s;
896
-o-transition: all  0.6s ease-in-out .6s;
897
transition: all  0.6s ease-in-out .6s;
898
}
899
 
900
.conns .info {
901
float:right;
902
margin:0px 0px 0px 5px;
903
padding:5px;
904
width:175px;
905
height:80px;
906
overflow:hidden;
907
background-color:d9d8df;
908
opacity:0;
909
-webkit-transition: all 0.2s ease-in-out;
910
-moz-transition: all  0.2s ease-in-out;
911
-ms-transition: all  0.2s ease-in-out;
912
-o-transition: all  0.2s ease-in-out;
913
transition: all  0.2s ease-in-out;
914
}
915
 
916
.conn1:hover .info, .conn2:hover .info, .conn3:hover .info, .conn4:hover .info, .conn5:hover .info, .conn6:hover .info, .conn7:hover .info, .conn8:hover .info, .conn9:hover .info {
917
opacity:1;
918
overflow:auto;
919
-webkit-transition: all 0.6s ease-in-out 1.2s;
920
-moz-transition: all  0.6s ease-in-out 1.2s;
921
-ms-transition: all  0.6s ease-in-out 1.2s;
922
-o-transition: all  0.6s ease-in-out 1.2s;
923
transition: all  0.6s ease-in-out 1.2s;
924
}
925
 
926
.conn1, .conn2, .conn3, .conn4, .conn5, .conn6, .conn7, .conn8, .conn9 {
927
background-color:d9d8df;
928
position:absolute;
929
margin-top: 7.5px;
930
width:90px;
931
height:90px;
932
overflow:hidden;
933
z-index:2;
934
-webkit-transition: all 0.2s linear;
935
-moz-transition: all  0.2s linear;
936
-ms-transition: all  0.2s linear;
937
-o-transition: all  0.2s linear;
938
transition: all  0.2s linear;
939
}
940
 
941
.conn1, .conn2, .conn3 {margin-top: 7.5px;}
942
.conn4, .conn5, .conn6 {margin-top: 105px;}
943
.conn7, .conn8, .conn9 {margin-top: 202.5px;}
944
.conn1, .conn4, .conn7 { margin-left: 7.5px; }
945
.conn2, .conn5, .conn8 { margin-left: 105px; }
946
.conn3, .conn6, .conn9 { margin-left: 202.5px;}
947
 
948
.conn1:hover, .conn2:hover, .conn3:hover, .conn4:hover, .conn5:hover, .conn6:hover, .conn7:hover, .conn8:hover, .conn9:hover {
949
width:285px; 
950
z-index:3;
951
-webkit-transition: all 0.6s linear;
952
-moz-transition: all  0.6s linear;
953
-ms-transition: all  0.6s linear;
954
-o-transition: all  0.6s linear;
955
transition: all  0.6s linear;
956
}
957
 
958
.conn2:hover, .conn3:hover, .conn5:hover, .conn6:hover, .conn8:hover, .conn9:hover { margin-left: 7.5px; }   
959
960
 .vicarious{ Hide Codes }
961
.profileInfo, .userProfileURL, .friendsComments, .blurbs, .friendSpace, .contactTable, .extendedNetwork, .latestBlogEntry, .interestsAndDetails, .userProfiledetail,  .userAlbums, .whitetext12, .orangetext15, .lightbluetext8, .blacktext12, .navigationBar, .btext, .redlink, .redtext, .blacktext10,  tr#groups,  .navigationBar, .profile, table tr td[id='footerWarpper'] { display:none !important;visibility:hidden!important; }
962
table table table table td {width:0px;}
963
.contactTable td, table table td.text table td,table table table table table td {width:auto;}
964
div div select, div div form {display:none !important;}
965
select { visibility:hidden!important; WIDTH:0px!important;}
966
table div {display:none;}
967
table table div {display:block;}
968
.clearfix {display:none !important;position:absolute!important;}
969
div[id="googlebar"],div div select{opacity:0;filter:alpha(opacity=0);display:none !important;position:absolute !important; bottom:2000px !important;}
970
.profileInfo tr tr td { visibility:hidden; }
971
.profileInfo td.text { visibility:visible; }
972
.vicarious {Layouts available @ http://vicarious-hs.tumblr.com/}
973
</style></td></tr></table><table style="display:none"><tr><td>
974
975
-----------------------------LIKE TO MEET-------------------------
976
977
 </td></tr></table></td></tr></table></td></tr></table><table cellspacing="0" cellpadding="0" class="viclike2meet_table"><tr><td valign="top"><table cellspacing="0" cellpadding="0"  style="width:500px;"><tr><td>
978
 
979
<font class="cite">
980
The above table code must remain at the top.  FULL tables below can be rearranged.
981
</font>
982
983
</td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
984
985
<div id="namebox"><div class="pearla"></div>
986
987
<div class="nameplate">
988
<font class="h6">Miss Vanessa Ives</font>
989
990
</div><div class="pearlb"></div></div>
991
992
993
</td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td> 
994
995
<img src="http://i57.tinypic.com/2rc32wm.jpg">
996
997
998
</td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
999
1000
<font class="h1">Penny Dreadful</font>
1001
1002
</td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
1003
<div id="tales">
1004
1005
<div class="sider sider-xxx">
1006
<div class="title">
1007
<small>Vol. 2</small>
1008
<big>Vol. 2 Secondary Title</big>
1009
</div>
1010
1011
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1012
 
1013
1014
</div>
1015
1016
<div class="sider sider-yyy">
1017
<div class="title">
1018
<small>Vol. 3</small>
1019
<big>Vol. 3 Secondary Title</big>
1020
</div>
1021
1022
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1023
 
1024
1025
</div>
1026
1027
1028
<div class="sider sider-zzz">
1029
<div class="title">
1030
<small>Vol. 1</small>
1031
<big>Vol. 1 Secondary Title</big>
1032
</div>
1033
1034
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1035
 
1036
1037
</div></div>
1038
 
1039
1040
</td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
1041
1042
<img src="http://i61.tinypic.com/2uh7dky.jpg">
1043
1044
</td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
1045
1046
1047
<div class="wallpback"></div>
1048
1049
<font class="h4">Title Here</font>
1050
<font class="h2">A little quote goes here</font>
1051
 
1052
</td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
1053
1054
1055
<div class="about"> 
1056
1057
<em>Emphasized</em>
1058
<b>Bold</b>
1059
<i>Italics</i>
1060
<font class="u">underline</font>
1061
<font class="strike">strike</font>
1062
<font class="strong">strong</font>
1063
 
1064
1065
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. 
1066
 
1067
 <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.  
1068
1069
</div> 
1070
1071
<center><img class="img1" src="http://i60.tinypic.com/14eazkg.jpg"></center>
1072
1073
1074
1075
</td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
1076
1077
  
1078
<div id="L2Mbox"> 
1079
1080
<img src="http://i58.tinypic.com/10pnejp.jpg">
1081
1082
<div class="titles">
1083
<font class="one">Title One</font>
1084
<font class="two">Title Two</font>
1085
<font class="three">Quote goes here</font>
1086
</div>
1087
1088
<div class="textbox">
1089
1090
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1091
1092
 <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1093
 
1094
1095
</div></div>
1096
 
1097
 
1098
-----------------------------INTERESTS----------------------------
1099
1100
 </td></tr></table></td></tr></table></td></tr></table><table class="vicinterests_table" cellspacing="0" cellpadding="0"><tr><td valign="top" padding="0"><table cellspacing="0" cellpadding="0"  style="width:300px;"><tr><td>
1101
 
1102
<font class="cite">
1103
The above table code must remain at the top.  FULL tables below can be rearranged.</font>  
1104
1105
  
1106
</td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
1107
1108
<img src="http://i62.tinypic.com/59y0yx.jpg">
1109
1110
</td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
1111
1112
<div class="decoTitle">
1113
<font class="h7">Personality</font>
1114
</div>
1115
1116
<div class="stats"><div class="inner">
1117
1118
<p>Personality details go here.  Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?
1119
1120
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?
1121
 
1122
1123
</div></div>
1124
1125
<center><img class="img1" src="http://i61.tinypic.com/akh9v7.jpg"></center>
1126
1127
1128
1129
</td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td> 
1130
1131
<img src="http://i57.tinypic.com/j7vzih.jpg"> 
1132
1133
1134
  
1135
</td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td> 
1136
1137
<div class="decoTitle decoTitle-stats">
1138
<font class="h7">Details</font>
1139
</div>
1140
1141
<div class="stats"><div class="inner">
1142
<font class="strong">Legal</font>
1143
<B>Name:</B> Input Info
1144
<B>Nicknames:</B> Input Info
1145
<B>Aliases:</B> Input Info
1146
<B>Date Of Birth:</B> Input Info
1147
<B>Place Of Birth:</B> Input Info
1148
<B>Current Residence:</B> Input Info
1149
 
1150
<font class="strong">Physical</Font>
1151
<B>Ethnicity:</B> Input Info
1152
<B>Hair Color:</B> Input Info
1153
<B>Eye Color:</B> Input Info
1154
<B>Height:</B> Input Info
1155
<B>Weight:</B> Input Info
1156
<B>Birthmarks/Scars:</B> Input Info
1157
 
1158
<font class="strong">Family</Font>
1159
<B>Mother:</B> Input Info
1160
<B>Father:</B> Input Info
1161
<B>Sister(S):</B> Input Info
1162
<B>Brother(S):</B> Input Info
1163
<B>Other Family:</B> Input Info
1164
 
1165
<font class="strong">Relationships</Font>
1166
<B>Sexual Orientation:</B> Input Info
1167
<B>Relationship Status:</B> Input Info
1168
<B>Current Relationship(S):</B> Input Info
1169
<B>Past Relationship(S):</B> Input Info
1170
 
1171
<font class="strong">Education</Font>
1172
<B>High School</B> Input Info
1173
<B>College</B> Input Info
1174
<B>Major</B> Input Info
1175
<B>Degree</B> Input Info
1176
 
1177
<font class="strong">Employment</Font>
1178
<B>Occupation:</B> Input Info
1179
<B>Job Description:</B> Input Info
1180
<B>Employer:</B> Input Info
1181
<B>Skillset:</B> Input Info
1182
  
1183
</div></div>
1184
1185
<center><img class="img1" src="http://i61.tinypic.com/akh9v7.jpg"></center>
1186
1187
-----------------------------MUSIC-------------------------------- 
1188
1189
  
1190
</td></tr></table><table class="vic_table" cellspacing="0" cellpadding="0"><tr><td>
1191
 
1192
<div class="conns"><div class="conn1">
1193
 
1194
<img src="http://i61.tinypic.com/2eoxqqd.jpg">
1195
 
1196
<div class="info">
1197
 
1198
<font class="h13">Connection Name</font>
1199
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1200
 
1201
 
1202
</div></div><div class="conn2">
1203
 
1204
<img src="http://i62.tinypic.com/287fa85.jpg">
1205
 
1206
<div class="info">
1207
 
1208
<font class="h13">Connection Name</font>
1209
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1210
 
1211
</div></div><div class="conn3">
1212
 
1213
<img src="http://i59.tinypic.com/6ris6h.jpg">
1214
 
1215
<div class="info">
1216
 
1217
<font class="h13">Connection Name</font>
1218
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1219
 
1220
</div></div><div class="conn4">
1221
 
1222
<img src="http://i57.tinypic.com/14sk1eb.jpg">
1223
 
1224
<div class="info">
1225
 
1226
<font class="h13">Connection Name</font>
1227
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1228
 
1229
</div></div><div class="conn5">
1230
 
1231
<img src="http://i58.tinypic.com/ilvbmg.jpg">
1232
 
1233
<div class="info">
1234
 
1235
<font class="h13">Connection Name</font>
1236
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1237
 
1238
 
1239
</div></div><div class="conn6">
1240
 
1241
<img src="http://i58.tinypic.com/53nxpx.jpg">
1242
 
1243
<div class="info">
1244
 
1245
<font class="h13">Connection Name</font>
1246
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1247
 
1248
</div></div><div class="conn7">
1249
 
1250
<img src="http://i62.tinypic.com/2nktfrc.jpg">
1251
 
1252
<div class="info">
1253
 
1254
<font class="h13">Connection Name</font>
1255
 
1256
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1257
 
1258
</div></div><div class="conn8">
1259
 
1260
<img src="http://i60.tinypic.com/29atg9j.jpg">
1261
 
1262
<div class="info">
1263
 
1264
<font class="h13">Connection Name</font>
1265
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1266
 
1267
 
1268
</div></div><div class="conn9">
1269
 
1270
<img src="http://i60.tinypic.com/29atg9j.jpg">
1271
 
1272
<div class="info">
1273
 
1274
<font class="h13">Connection Name</font>
1275
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt.  
1276
 
1277
 
1278
</div></div></div>
1279
 
1280
 
1281
1282
1283
-----------------------------MOVIES-------------------------------
1284
  
1285
   
1286
</td></tr></table></td></tr></table><table cellspacing="0" cellpadding="0"><tr><td valign="top" align="center"><table cellspacing="0" cellpadding="0"><tr><td>
1287
1288
<div id="back"></div><div id="wood"></div> <div id="sidebar"> 
1289
1290
<div class="frame" style="background-image:url(http://i59.tinypic.com/v5igb9.jpg);">
1291
<img src="http://i61.tinypic.com/t4vbio.jpg">
1292
1293
<font class="cite">
1294
1295
The background-image above is a silver frame.  The img src=.. is the actual image of Eva (228px x 228px).  Leave the background-image frame and add your image into the img src= spot instead. 
1296
1297
If you want to omit the frame entirely and just have a photo, you can delete the img src= section and put a 300px x 300px image in the background-image url section instead.
1298
1299
</font>
1300
</div>
1301
1302
1303
<div class="decoTitle decoTitle-sidebar">
1304
<font class="h7">Details</font>
1305
</div>
1306
1307
<div class="box">
1308
<div class="inner">
1309
 
1310
<big>Verses</big>
1311
1312
Verse - Verse - Verse - Verse
1313
1314
<big>Writing Style</big>
1315
1316
Multi-paragraphs to Novella
1317
1318
<big>Dues</big>
1319
Starters (0) Comments (0) Messages (0) 
1320
1321
<big>Contact</big> 
1322
  
1323
AOL:  CONTACT INFO
1324
  
1325
1326
</div></div><div class="linx">
1327
1328
<a class="lk1" title="Add" href="/invite_friend.php?friend_id=xxxxxx"></a>
1329
1330
<a class="lk2" title="Photos" href="/gallery.php?member_id=xxxxxx"></a>
1331
1332
<a class="lk3" title="Message" href="/send_message.php?member_id=xxxxxx"></a>
1333
1334
<a class="lk4" title="Home" href="/logincomplete.php"></a>
1335
1336
<a class="lk3" title="Comment" href="/add_testimonial.php?member_id=xxxxxx"></a>
1337
1338
<a class="lk2" title="Blogs" href="/view_member_blog.php?member_id=xxxxxx"></a>
1339
1340
<a class="lk1" title="Extra" href="/#"></a> 
1341
1342
1343
</div><div class="music">
1344
<object type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_mini.swf" width="200" height="20">
1345
    <param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_mini.swf" />
1346
    <param name="bgcolor" value="#37363f" />
1347
<param name="wmode" value="opaque" />
1348
    <param name="FlashVars" value="mp3=http%3A//k007.kiwi6.com/hotlink/pn6r7nnk1m/PD.mp3&autoplay=1&bgcolor=37363f&loadingcolor=6a6871&buttoncolor=6a6871&slidercolor=6a6871" />
1349
</object>
1350
<font class="cite">You will note a line of code that starts with param name="wmode" above.  The normal player that you add from flash-mp3-player.net does not contain this.  If you are replacing the full player, make sure to add it into your code.  Firefox can be buggy with flash players. The extra code will keep it hidden until the sidebar has been hovered over.</font>
1351
1352
</div></div> 
1353
1354
 
1355
1356
1357
-----------------------------Television-------------------------------
1358
<font class="cite">
1359
1360
PHOTO DIMENSIONS
1361
1362
Sidebar image (inside frame) = 228px width x 228px height  
1363
1364
Interests (Left side of profile)
1365
Top to bottom
1366
300px width x 350px height (height doesn't matter)
1367
300px width x 200px height (height doesn't matter)
1368
9 connection pics = 80px width x 80px height
1369
1370
1371
Like to Meet (Right side of profile)
1372
Top to bottom
1373
500px width x 300px height (height doesn't matter)
1374
500px width x 150px height (height doesn't matter)
1375
200px width x 300px height 
1376
</font>