Layout 142C

       					**UPDATED 8-24 FOR FIREFOX BUGS**


					!!!!!!!!!!!!Read It!!!!!!!!!!!!

                                                (⊙.⊙(☉_☉)⊙.⊙)

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.

............................

IMAGES

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 first Like to Meet table. The tall 'default' image is 275px width by 500px height.

 ............................

MUSIC PLAYER

REPLACE MY MUSIC PLAYER WITH YOUR OWN.

Read the cited note under the music player for additional instructions.

............................


FOR ROLEPLAYER.ME USERS:

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>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.

<font class="h1">Header 1</font>

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:
<h1>Header</h1> <strike>Strike</strike> etc..

OR just leave them as they are.  They will work for you either way.


///////////////////////////////////////////////////



                        Don't forget to replace the XXXXX with your friend ID number.

                                                     (>‿◠)✌


                *****************************SAVE YOUR WORK AS YOU GO.*******************************


DO NOT REMOVE THE .VICARIOUS MARKERS FROM ANY VICARIOUS LAYOUT.

-----------------------------ABOUT ME---------------------------------


<style type="text/css">
@import url(http://fonts.googleapis.com/css?family=Raleway:400,900|Playfair+Display:400,700italic|Marck+Script|Oswald|Dynalight|Roboto+Condensed:400,700);

/* - -DO NOT PUT ANYTHING ABOVE THE @import LINE ABOVE - - */
/* - -DO NOT REARRANGE MY CODING!! ORDER IS IMPORTANT! - - */

.vicarious { Structure }


body {
background-color: 202020;
background-image:url( );
background-repeat:repeat;
background-attachment:fixed;
background-position:center center;
}

table, tr, td {background-color:transparent;}

.viclike2meet_table, .vicinterests_table, #sidebar {
visibility:visible;
z-index:2;
position:absolute;
top:0%;
left:50%;
border:0px solid;
margin-top:0px;
height:auto;
overflow:hidden;
display:inline-block;
background-color:transparent;
}

.viclike2meet_table {  width:350px;height:auto;margin-left:-160px; }
.viclike2meet_table tr { margin:0px;  }
.viclike2meet_table td { margin:0px; max-width:350px; overflow:hidden;   }

.vicinterests_table{ width:425px; height:auto;margin-left:195px;}
.vicinterests_table tr { margin:0px; }
.vicinterests_table td { margin:0px; max-width:425px; overflow:hidden;  }


.vic_table {
padding:0px;
margin:0px;
width:100%;
margin-bottom:4px;
border:0px solid;
background-color:d7d7d7;
border-collapse: collapse; /* 'cellspacing' equivalent */
overflow:hidden;
}

.vic_table tr { margin:0px; }
.vic_table td { margin:0px; width:100%; text-align:center; padding: 0; /* 'cellpadding' equivalent */ }


 .vicarious{ Google Chrome Scrollbar }
::-webkit-scrollbar {width: 10px;}
::-webkit-scrollbar-track {border: 1px solid #000000;background-color:transparent;}
::-webkit-scrollbar-thumb {border: 1px solid #000000;background-color:ffffff;}

.vicarious { text }

table, tr, td, li, p, div, .text, .btext, a, b, i {
font-family:tahoma;
font-size:7pt;
line-height:100%;
color: 4e4e4e;
padding:0px;
margin:0px;
text-decoration:none;
text-transform:none;
}

p {text-align:justify; margin-top: 5px;text-indent:10px; }
p:first-line {  }
p:first-letter { font-size: 9pt; }


b {
font-size:8pt;
text-transform:uppercase;
font-family: 'Roboto Condensed', sans-serif;
color: 000000;
}

i {
font-size:10pt;
color: 424242;
font-family: 'Dynalight', cursive;
}

.u, u {
color: 202020;
text-decoration:underline;
}

.strike, strike {
color: 4e4e4e ;
text-decoration:line-through;
letter-spacing:1pt;
}

.strong, strong {
font-family:courier new;
font-size: 9pt;
text-transform:uppercase;
color: 454545;
font-weight:900;
}

em {
font-family:brush script mt;
font-size:11pt;
color: 4b4b4b;
}

.h1, h1, .h2, h2, .h3, h3, .h4, h4, .h5, h5, .h6, h6, .h7, h7, .h8, h8, .h9, h9, .h10, h10, .h11, h11, .h12, h12, .one, one, .two, two, .three, three. small, big  {
padding:0px;
margin:0px;
}


.blockquote {
height:auto;
display:block;
text-align:justify;
margin:5px 5px 5px 10px;
padding: 5px 5px 5px 10px;
border-left:10px double #151515;
background-color:eaeaea;
-moz-border-radius-topleft: 90px;
-webkit-border-top-left-radius: 90px;
 border-top-left-radius: 90px;
-moz-border-radius-topright: 5px;
-webkit-border-top-right-radius: 5px;
border-top-right-radius: 5px;
-moz-border-radius-bottomright: 5px;
-webkit-border-bottom-right-radius: 5px;
border-bottom-right-radius: 5px;
-moz-border-radius-bottomleft: 90px;
-webkit-border-bottom-left-radius: 90px;
border-bottom-left-radius: 90px;
}


.cite {font-size:0px; color:transparent;display:block; height:0px;}


.vicarious { Divs }

/* add*/
#add {
visibility:visible;
z-index:2000;
position:fixed;
bottom:0%;
left:0%;
margin-bottom:20px;
margin-left:20px;
background-color:transparent;
}

#add a {
text-transform:none;
text-decoration:none;
height:25px;
width:25px;
line-height:25px;
font-size:18pt;
overflow:hidden;
color:ffffff;
text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
}

/* SIDEBAR */

#sidebar {
position:fixed;
z-index:10000;
margin-top:0px;
margin-left:-605px;
width:440px;
height:100%;
background-color:transparent;
}

#sidebar .sidebarB {
position:absolute;
margin-top:100px;
margin-left:0px;
width:430px;
height:300px;
background-color: eaeaea;
border:5px solid #d6d6d6;
}

.sidebarB .def {
z-index:10000;
position:absolute;
margin-top:5px;
margin-left:25px;
width:190px;
height:190px;
background-color:transparent;
transform: rotate(345deg);
-webkit-transform: rotate(345deg);
-moz-transform: rotate(345deg);
-o-transform: rotate(345deg);
-ms-transform: rotate(345deg);
transition:All 1s linear 0s;
-webkit-transition:All 1s linear 0s;
-moz-transition:All 1s linear 0s;
-o-transition:All 1s linear 0s;
}

.sidebarB:hover .def {
transition:All 1s linear 0s;
-webkit-transition:All 1s linear 0s;
-moz-transition:All 1s linear 0s;
-o-transition:All 1s linear 0s;
transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
}

.def .linx {
z-index:2;
position:absolute;
margin-top:0px;
margin-left:0px;
width:190px;
height:190px;
background-color:d7d7d7;
}

.def a {
letter-spacing:0pt;
height:34px;
line-height:34px;
display:block;
outline:dashed;
outline-offset:-6px;
outline-width:1px;
text-transform:uppercase;
text-decoration:none;
text-align:center;
color:151515;
background-color: e6e6e6;
border:1px solid #202020;
margin:2px;
overflow:hidden;
font-family: 'Raleway', sans-serif;
transition:All .6s ease-in-out 0s;
-webkit-transition:All .6s ease-in-out 0s;
-moz-transition:All .6s ease-in-out 0s;
-o-transition:All .6s ease-in-out 0s;
}

.def a:hover {
color:b4b4b4;
letter-spacing:2pt;
background-color:e7e7e7;
}

.def1 {
opacity:1;
z-index:3;
position:absolute;
margin-top:0px;
margin-left:0px;
width:180px;
height:180px;
background-size:180px 180px;
border:5px solid #454545;
transition:All 1s linear 0s;
-webkit-transition:All 1s linear 0s;
-moz-transition:All 1s linear 0s;
-o-transition:All 1s linear 0s;
transform-origin: top left;
transform-style: preserve-3D;
transform: rotate(0deg);
}

.def:hover .def1 {
opacity:0;
transform: rotate(-180deg);
transform-origin:-0px -0px;
-ms-transform: rotate(-180deg);
-ms-transform-origin:-0px -0px;
-webkit-transform: rotate(-180deg);
-webkit-transform-origin:-0px -0px;
-moz-transform: rotate(-180deg);
-moz-transform-origin:-0px -0px;
-o-transform: rotate(-180deg);
-o-transform-origin:-0px -0px;
}

.sidebarB .quote1 {
position:absolute;
margin-top:245px;
margin-left:5px;
width:400px;
height:30px;
line-height:30px;
outline:solid;
outline-offset:-2px;
outline-width:1px;
 color:ffffff;
background-color: 151515;
display:block;
overflow:hidden;
text-align:center;
padding:5px 10px;
transition:All 1.4s linear .7s;
-webkit-transition:All 1.4s linear .7s;
-moz-transition:All 1.4s linear .7s;
-o-transition:All 1.4s linear .7s;
}

.sidebarB:hover .quote1 {
font-size:10pt;
color: e0e0e0;
background-color: 202020;
width:170px;
height:60px;
line-height:100%;
margin-left:25px;
margin-top:205px;
transition:All 1s linear 0s;
-webkit-transition:All 1s linear 0s;
-moz-transition:All 1s linear 0s;
-o-transition:All 1s linear 0s;
}

.sidebarB .title {
font-family: 'Playfair Display', serif;
font-style:italic;
font-size:37px;
position:absolute;
margin-top:5px;
margin-left:240px;
text-align:center;
display:block;
width:170px;
height:50px;
line-height:50px;
overflow:hidden;
color:151515;
background-color:transparent;
}

.sidebarB .stuff {
position:absolute;
margin-top:60px;
margin-left:240px;
width:170px;
height:215px;
overflow:hidden;
background-color:transparent;
}

.sidebarB .icon {
display:block;
text-align:center;
opacity:1;
position:absolute;
margin-top:0px;
margin-left:0px;
width:170px;
height:125px;
font-size:100px;
line-height:125px;
color: ffffff;
text-shadow: 4px 2px 2px rgba(0, 0, 0, 1);
background-color:transparent;
transition:All 1.4s ease-in-out 0s;
-webkit-transition:All 1.4s ease-in-out 0s;
-moz-transition:All 1.4s ease-in-out 0s;
-o-transition:All 1.4s ease-in-out 0s;
}

.sidebarB:hover .icon {
font-size:2pt;
height:10px;
margin-top:-125px;
opacity:0;
transition:All .6s ease-in-out 0s;
-webkit-transition:All .6s ease-in-out 0s;
-moz-transition:All .6s ease-in-out 0s;
-o-transition:All .6s ease-in-out 0s;
}

.sidebarB .info {
position:absolute;
margin-top:0px;
margin-left:0px;
width:145px;
padding:10px;
height:170px;
overflow:hidden;
opacity:0;
transition: all 1s ease-out 0s;
-o-transition-transition: all 1s ease-out 0s;
-webkit-transition: all 1s ease-out 0s;
-moz-transition: all 1s ease-out 0s;
outline:dashed;
outline-offset:-6px;
outline-width:1px;
text-align:center;
background-color: 151515;
color: e6e6e6;
 -webkit-box-shadow: 4px 4px 2px 0px rgba(0, 0, 0, 0.75);
-moz-box-shadow:    4px 4px 2px 0px rgba(0, 0, 0, 0.75);
box-shadow:         4px 4px 2px 0px rgba(0, 0, 0, 0.75);
}

.sidebarB:hover .info {
opacity:1;
margin-top:20px;
transition: all 1s ease-out 1s;
-o-transition-transition: all 1s ease-out 1s;
-webkit-transition: all 1s ease-out 1s;
-moz-transition: all 1s ease-out;
}

.sidebarB .strong, .sidebarB strong {
color: ffffff;
display:block;
text-align:center;
padding:2px;
line-height:100%;
margin-top:5px;
}


/* INTERESTS - TABLE 1 */

#INTtable1 {
width:425px;
height:500px;
background-color:transparent;
}

#INTtable1 .line1, #INTtable1 .line2, #INTtable1 .line3, #INTtable1 .line4 {
position:absolute;
transition:All 1s linear;
-webkit-transition:All 1s linear;
-moz-transition:All 1s linear;
-o-transition:All 1s linear;
background-color:transparent;
border-style:solid;
}

#INTtable1 .line1, #INTtable1 .line2 { border-width:5 5 0 0; }
#INTtable1 .line3, #INTtable1 .line4 { border-width:0 0 5 5; }
#INTtable1 .line1, #INTtable1 .line3 { height:145px; border-color:#fefefe; }
#INTtable1 .line2, #INTtable1 .line4 { height:245px; border-color:#454545; }

#INTtable1 .line1 { width:110px; margin:80px 0px 0px 305px;}
#INTtable1 .line2 { width:100px; margin:90px 0px 0px 305px;}
#INTtable1 .line3 { width:135px; margin:335px 0px 0px 5px;}
#INTtable1 .line4 { width:125px; margin:225px 0px 0px 15px;}

#INTtable1:hover .line1 { height:400px; }
#INTtable1:hover .line2 { height:390px; }
#INTtable1:hover .line3, #INTtable1:hover .line4  { margin-top:5px; }
#INTtable1:hover .line3 { height:475px; }
#INTtable1:hover .line4 { height:465px; }

#INTtable1 .about {
background-color: eaeaea;
width:365px;
padding:0px 5px;
height:365px;
margin:100px 0px 0px 25px;
position:absolute;
text-align:justify;
overflow:auto;
transition:All .6s ease-in-out 0s;
-webkit-transition:All .6s ease-in-out 0s;
-moz-transition:All .6s ease-in-out 0s;
-o-transition:All .6s ease-in-out 0s;
}

#INTtable1:hover .about {
background-color:ffffff;
}

#INTtable1 .quote {
opacity:1;
z-index:1;
font-family: 'Raleway', sans-serif;
font-size:7pt;
letter-spacing:0pt;
width:245px;
height:20px;
line-height:20px;
margin:470px 0px 0px 150px;
position:absolute;
text-align:left;
padding:0px;
letter-spacing:1pt;
text-transform:uppercase;
color: 4a4a4a;
overflow:hidden;
display:block;
transition:All .6s ease-in-out 0s;
-webkit-transition:All .6s ease-in-out 0s;
-moz-transition:All .6s ease-in-out 0s;
-o-transition:All .6s ease-in-out 0s;
}

#INTtable1:hover .quote {
opacity:0;
}

#INTtable1 .music {
z-index:2;
opacity:0;
width:245px;
height:20px;
margin:470px 0px 0px 150px;
position:absolute;
padding:0px;
overflow:hidden;
display:block;
transition:All .6s ease-in-out 0s;
-webkit-transition:All .6s ease-in-out 0s;
-moz-transition:All .6s ease-in-out 0s;
-o-transition:All .6s ease-in-out 0s;
}

#INTtable1:hover .music { opacity:1;}
#INTtable1 .xxx  {z-index:2;opacity:1;}
#INTtable1:hover .xxx {opacity:0;}
#INTtable1 .xxy  {z-index:1;opacity:0;}
#INTtable1:hover .xxy {opacity:1;}

#INTtable1 .xxx, #INTtable1 .xxy {
background-color:transparent;
width:280px;
height:100px;
position:absolute;
margin:5px 0px 0px 25px;
transition:All .6s ease-in-out 0s;
-webkit-transition:All .6s ease-in-out 0s;
-moz-transition:All .6s ease-in-out 0s;
-o-transition:All .6s ease-in-out 0s;
}

#INTtable1 img {
border-width:5px;
border-style:solid;
border-color:#151515;
height:80px;
width:80px;
display:inline-block;
}

/* INTERESTS - TABLE 2 */

#INTtable2 {
background-color:#fefefe;
width:425px;
height:424px;
overflow:hidden;
}

.vicbox {
width: 207px;
height: 207px;
margin: 0px;
float: left;
overflow: hidden;
position: relative;
text-align: center;
}

.vicbox .mask, .vicbox .content {
width: 207px;
height: 207px;
position: absolute;
overflow: hidden;
top: 0;
left: 0;
background-color: rgba(0,0,0,0.5);
opacity:0;
transition: all 0.3s ease-in 0.4s;
}

.vicbox:hover .mask {
opacity:1;
transition-delay: 0s;
}

.vicbox img {
width:207px;
height:207px;
overflow:hidden;
display: block;
position: relative;
transition: all 0.4s ease-in-out 0.5s;
}

.vicbox:hover img {
transition-delay: 0s;
}

.vicbox .h2, .vicbox h2 {
font-family: 'Oswald', sans-serif;
display:block;
text-transform: uppercase;
color: ffffff;
text-align: center;
position: relative;
font-size: 10pt;
line-height:100%;
padding: 5px;
text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
opacity:0;
transform: scale(10);
transition: all 0.3s ease-in-out 0.1s;
border-bottom: 1px solid rgba(0, 0, 0, 0.3);
background: transparent;
margin: 20px 10px 0px 10px;
}

.vicbox:hover .h2, .vicbox:hover h2 {
opacity: 1;
transform: scale(1);
transition-delay: 0.1s;
}

.vicbox .stats {
position: relative;
color: ffffff;
padding: 10px 5px 5px 5px;
text-align: left;
overflow:auto;
height:140px;
margin:0px 10px;
text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
opacity:0;
transform: scale(10);
transition: all 0.3s ease-in-out 0.2s;
}

.stats p {
color:ffffff;
text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
}

.stats b {
font-size:8pt;
color: e1e1e1;
text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
}

.vicbox:hover .stats {
opacity:1;
transform: scale(1);
transition-delay: 0.2s;
}


/* INTERESTS - TABLE 3 */

#INTtable3 {
width:425px;
height:350px;
overflow:hidden;
}

#INTtable3 .title1 {
z-index:7;
font-size:40pt;
width:415px;
height:50px;
line-height:50px;
color:fefefe;
text-align:left;
padding:10px 5px 80px 5px;
border-bottom:2px solid #d7d7d7;
background-color:151515;
margin-top:0px;
margin-left:0px;
position:absolute;
display:block;
overflow:hidden;
-webkit-box-shadow: 0px 5px 0px 0px rgba(181, 181, 181, 0.75);
-moz-box-shadow:    0px 5px 0px 0px rgba(181, 181, 181, 0.75);
box-shadow:         0px 5px 0px 0px rgba(181, 181, 181, 0.75);
font-family: 'Dynalight', cursive;
text-transform:none;
letter-spacing:1pt;
}

#INTtable3 .title2 {
z-index:8;
font-size:6pt;
width:205px;
height:10px;
line-height:10px;
color:151515;
text-align:right;
padding:2px 215px 2px 5px;
background-color:fefefe;
position:absolute;
margin-top:60px;
margin-left:0px;
display:block;
overflow:hidden;
text-transform:uppercase;
font-family: 'Raleway', sans-serif;
letter-spacing:3pt;
}

#INTtable3 .pic {
z-index:9;
width:100px;
height:100px;
background-size:100px 100px;
position:absolute;
margin-top:20px;
margin-left:300px;
overflow:none;
border:5px solid #fefefe;
-webkit-border-radius: 360px;
-moz-border-radius: 360px;
border-radius: 360px;
}

#INTtable3 .about {
z-index:6;
width:397px;
height:140px;
position:absolute;
margin-top:145px;
margin-left:5px;
padding:5px;
overflow:auto;
border-width:0px 4px 0px 4px;
border-style:double;
border-color:fefefe;
background-color: eeeeee;
}

#INTtable3 .quote {
z-index:7;
width:405px;
height:35px;
line-height:100%;
padding:10px;
position:absolute;
margin-top:295px;
margin-left:0px;
overflow:auto;
color: eeeeee;
display:block;
text-align:center;
background-color:151515;
font-family: 'Oswald', sans-serif;
font-size:9pt;
overflow:hidden;
}


/* INTERESTS - TABLE 4 */

#INTtable4 {
width:405px;
height:168px;
overflow:hidden;
border:5px solid #454545;
padding:5px;
overflow:auto;
}


/* LIKE TO MEET - TABLE 1 */

#LK2MEETtable1 {
width:350px;
height:500px;
overflow:hidden;
}

#LK2MEETtable1 .namefield {
background-color: transparent;
width:502px;
height:75px;
position:absolute;
margin-left:60px;
margin-top:212px;
transform: rotate(90deg) ;
-webkit-transform: rotate(90deg) ;
-moz-transform: rotate(90deg) ;
-o-transform: rotate(90deg) ;
-ms-transform: rotate(90deg) ;
display:block;
overflow:hidden;
}

#LK2MEETtable1 .h1, #LK2MEETtable1 h1 {
margin:0px;
text-align:left;
padding-left:15px;
height:55px;
line-height:55px;
font-size:55px;
font-family: 'Oswald', sans-serif;
color:0f0f0f;
border-bottom:20px solid #fefefe;
display:block;
overflow:hidden;
}

#LK2MEETtable1 .default, #LK2MEETtable1 .innerbox {
position:absolute;
transition:All 1s linear 0s;
-webkit-transition:All 1s linear 0s;
-moz-transition:All 1s linear 0s;
-o-transition:All 1s linear 0s;
}

#LK2MEETtable1 .default {
margin:0px 0px 0px 0px;
overflow:none;
opacity:1;
z-index:1;
width:275px;
height:500px;
background-size:275px 500px;
}

#LK2MEETtable1:hover .default {
opacity:.2;
}

#LK2MEETtable1 .innerbox {
overflow:hidden;
opacity:0;
z-index:2;
width:200px;
height:380px;
padding:10px;
margin:0px 0px 0px 25px;
border:1px solid #c2b0ad;
background-color:e7e7e7;
outline:dashed;
outline-offset:-6px;
outline-width:1px;
 -webkit-box-shadow: 4px 4px 2px 0px rgba(176, 176, 176, 0.75);
-moz-box-shadow:    4px 4px 2px 0px rgba(176, 176, 176, 0.75);
box-shadow:         4px 4px 2px 0px rgba(176, 176, 176, 0.75);
}

.innerbox .text {
width:180px;
margin:5px;
padding:5px;
height:360px;
overflow:auto;
}

 .innerbox p {}

#LK2MEETtable1:hover .innerbox {
overflow:auto;
opacity:1;
margin:50px 0px 0px 25px;
}

/* LIKE TO MEET - TABLE 2 */

#LK2MEETtable2 {
z-index:7;
width:330px;
height:330px;
overflow:hidden;
outline:solid;
outline-offset:-15px;
outline-width:5px;
outline-color:454545;
border:5px solid #eeeeee;
margin:5px;
}

#LK2MEETtable2 .about {
z-index:8;
width:290px;
height:240px;
margin-top:15px;
margin-left:15px;
padding:5px;
position:absolute;
overflow:auto;
}

#LK2MEETtable2 img {
width:100px;
height:100px;
overflow:hidden;
float:left;
padding:10px;
margin:2px;
background-color:454545;
outline:dotted;
outline-offset:-6px;
outline-width:1px;
outline-color:ffffff;
}

#LK2MEETtable2 .text {
z-index:9;
position:absolute;
width:330px;
height:30px;
margin-top:275px;
margin-left:0px;
overflow:hidden;
background-color:151515;
transition:All .4s linear 2s;
-webkit-transition:All .4s linear 2s;
-moz-transition:All .4s linear 2s;
-o-transition:All .4s linear 2s;
}

#LK2MEETtable2 .text:hover {
height:330px;
margin-top:0px;
transition:All .4s linear 0s;
-webkit-transition:All .4s linear 0s;
-moz-transition:All .4s linear 0s;
-o-transition:All .4s linear 0s;
}

.text  .title {
position:absolute;
width:320px;
height:30px;
line-height:30px;
font-size:12pt;
color:ffffff;
padding-right:10px;
display:block;
text-align:right;
margin-top:0px;
margin-left:0px;
overflow:hidden;
text-transform:uppercase;
}

.text .additional {
position:absolute;
margin-top:40px;
margin-left:10px;
width:270px;
height:210px;
padding:10px;
background-color:d7d7d7;
overflow:auto;
opacity:0;
border:double #fefefe 10px;
transition:All .8s linear 0s;
-webkit-transition:All .8s linear 0s;
-moz-transition:All .8s linear 0s;
-o-transition:All .8s linear 0s;
}

.text:hover .additional {
opacity:1;
margin-top:50px;
transition:All .8s linear 1s;
-webkit-transition:All .8s linear 1s;
-moz-transition:All .8s linear 1s;
-o-transition:All .8s linear 1s;
}


/* LIKE TO MEET - TABLE 3 */

#LK2MEETtable3 {
width:350px;
height:170px;
overflow:hidden;
outline:groove;
outline-offset:-20px;
outline-width:1px;
background-color: ffffff;
color: 151515;
}


#LK2MEETtable3 .shorty {
width:290px;
height:100px;
text-align:justify;
position:auto;
padding:5px;
margin:25px 0px 0px 25px;
overflow:auto;
}

.shorty p { color: 151515;  text-indent:0px;}
.shorty p:first-letter { font-size: 7pt; }


#LK2MEETtable3 .one, #LK2MEETtable3 one  {
display:block;
background-color:151515;
color:fefefe;
padding:5px;
line-height:35px;
height:35px;
width:35px;
font-size:16pt;
font-family: 'Raleway', sans-serif;
outline:dashed;
outline-offset:-6px;
outline-width:1px;
float:left;
margin:2px;
text-align:center;
}


/* LIKE TO MEET - Connections Tables */

#LK2MEETconnTables {
width:350px;
height:110px;
overflow:hidden;
border-bottom:2px solid #d7d7d7;
-webkit-box-shadow: 0px 5px 0px 0px rgba(181, 181, 181, 0.75);
-moz-box-shadow:    0px 5px 0px 0px rgba(181, 181, 181, 0.75);
box-shadow:         0px 5px 0px 0px rgba(181, 181, 181, 0.75);
}

#LK2MEETconnTables .title1, #LK2MEETconnTables .title1, #LK2MEETconnTables .pic, #LK2MEETconnTables .conn {
transition:All .6s linear 0s;
-webkit-transition:All .6s linear 0s;
-moz-transition:All .6s linear 0s;
-o-transition:All .6s linear 0s;
}

#LK2MEETconnTables .title1 {
z-index:7;
font-size:16pt;
width:340px;
height:30px;
line-height:30px;
color:000000;
text-align:right;
padding:60px 5px 10px 5px;
margin-top:0px;
margin-left:0px;
position:absolute;
display:block;
overflow:hidden;
font-family: 'Raleway', sans-serif;
text-transform:none;
letter-spacing:1pt;
}

#LK2MEETconnTables:hover .title1 {
margin-left:-360px;
opacity:0;
}

#LK2MEETconnTables .title2 {
z-index:8;
font-size:6pt;
width:230px;
height:10px;
line-height:10px;
color:ffffff;
text-align:left;
padding:2px 5px 2px 115px;
background-color:454545;
position:absolute;
margin-top:40px;
margin-left:0px;
display:block;
overflow:hidden;
text-transform:uppercase;
font-family: 'Raleway', sans-serif;
letter-spacing:3pt;
}

#LK2MEETconnTables:hover .title2 {
margin-left:360px;
opacity:0;
transition:All .6s linear .6s;
-webkit-transition:All .6s linear .6s;
-moz-transition:All .6s linear .6s;
-o-transition:All .6s linear .6s;
}

#LK2MEETconnTables .pic {
z-index:9;
width:80px;
height:80px;
background-size:80px 80px;
position:absolute;
margin-top:10px;
margin-left:25px;
overflow:none;
border:5px solid #454545;
}

#LK2MEETconnTables:hover .pic  {
margin-left:245px;
opacity:1;
transition:All .6s linear 1.2s;
-webkit-transition:All .6s linear 1.2s;
-moz-transition:All .6s linear 1.2s;
-o-transition:All .6s linear 1.2s;
}

#LK2MEETconnTables .conn {
opacity:0;
z-index:10;
font-size:16pt;
width:0px;
height:80px;
padding:5px;
margin-top:10px;
margin-left:25px;
position:absolute;
overflow:hidden;
background-color: ffffff;
font-family:arial narrow;

}

.conn p {;font-family:arial narrow;}

#LK2MEETconnTables:hover .conn {
width:200px;
opacity:1;
overflow:auto;
transition:All .6s linear 1.2s;
-webkit-transition:All .6s linear 1.2s;
-moz-transition:All .6s linear 1.2s;
-o-transition:All .6s linear 1.2s;
}

/* LIKE TO MEET - Connections Links*/

#LK2MEETlinksTable {
background-color: d7d7d7;
width:350px;
height:auto;
overflow:hidden;
}

#LK2MEETlinksTable .left, #LK2MEETlinksTable .right {
width:48%;
overflow:auto;
height:95px;
}

#LK2MEETlinksTable .left { float:left;}
#LK2MEETlinksTable .right { float:right; }

#LK2MEETlinksTable a {
background-color:151515;
color:ffffff;
font-size:7pt;
display:block;
text-align:center;
height:17px;
line-height:17px;
margin-bottom:2px;
font-family: 'Roboto Condensed', sans-serif;
outline:solid;
outline-offset:-3px;
outline-width:1px;
text-transform;uppercase;
text-decoration:none;
letter-spacing:0pt;
transition:All .6s linear 0s;
-webkit-transition:All .6s linear 0s;
-moz-transition:All .6s linear 0s;
-o-transition:All .6s linear 0s;
}

#LK2MEETlinksTable a:hover {
background-color: fefefe;
color: 151515;
text-decoration:line-through;
letter-spacing:2pt;
}

 .vicarious{ Hide Codes }
.profileInfo, .userProfileURL, .friendsComments, .blurbs, .blacktext12, .friendSpace, .contactTable, .extendedNetwork, .latestBlogEntry, .interestsAndDetails, .userProfiledetail,  .userAlbums, .whitetext12, .orangetext15, .lightbluetext8, .blacktext12, .navigationBar, tr#groups,  .navigationBar, .profile, table tr td[id='footerWarpper'] { display:none !important;visibility:hidden!important; }
table table table table td {width:0px;}
.contactTable td, table table td.text table td,table table table table table td {width:auto;}
div div select, div div form {display:none !important;}
select { visibility:hidden!important; WIDTH:0px!important;}
table div {display:none;}
table table div {display:block;}
.clearfix {display:none !important;position:absolute!important;}
div[id="googlebar"],div div select{opacity:0;filter:alpha(opacity=0);display:none !important;position:absolute !important; bottom:2000px !important;}
.profileInfo tr tr td { visibility:hidden; }
.profileInfo td.text { visibility:visible; }
.vicarious {Layouts available @ http://vicarious-hs.tumblr.com/}
</style></td></tr></table><table style="display:none"><tr><td>






-----------------------------LIKE TO MEET-------------------------



</td></tr></table></td></tr></table><table class="viclike2meet_table"><tr><td valign="top" align="center"><table><tr><td>

<font class="cite">
The above table code must remain at the top.  FULL tables below can be rearranged.

***Image Sizing Instructions***
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 this section. The tall 'default' image is 275px width by 500px height.
</font>



</td></tr></table><table class="vic_table"><tr><td>

<div id="LK2MEETtable1"><div class="namefield">

<font class="h1">FirstName
<font color="b0b0b0">LastName

</font></font></div>

<div class="default" style="background-image:url(http://i61.tinypic.com/2q87l6w.jpg);">

</div><div class="innerbox"><div class="text">

<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.

</div></div></div>



</td></tr></table><table class="vic_table"><tr><td>


<div id="LK2MEETtable2">

<div class="about">

<p><img src="http://i59.tinypic.com/vrc4lw.jpg">At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.

<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.

</div>


<div class="text"><div class="title">

Something goes here ▼

</div><div class="additional">

<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus.


<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus.


</div></div></div>




</td></tr></table><table class="vic_table"><tr><td>

<div id="LK2MEETtable3"><div class="shorty">

<p><font class="one">A</font>t vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.

</div></div>


</td></tr></table><table class="vic_table"><tr><td>

<div id="LK2MEETconnTables">

<div class="title1">Connection One</div>
<div class="title2">Short Quote</div>

<a href="/#">
<div class="pic" style="background-image:url(http://i57.tinypic.com/28aq0rd.jpg);">
</div></a>


<div class="conn">

<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.

</div></div>



</td></tr></table><table class="vic_table"><tr><td>

<div id="LK2MEETconnTables">

<div class="title1">Connection Two</div>
<div class="title2">Short Quote</div>

<a href="/#">
<div class="pic" style="background-image:url(http://i57.tinypic.com/28aq0rd.jpg);">
</div></a>


<div class="conn">

<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.

</div></div>


</td></tr></table><table class="vic_table"><tr><td>

<div id="LK2MEETconnTables">

<div class="title1">Connection Three</div>
<div class="title2">Short Quote</div>

<a href="/#">
<div class="pic" style="background-image:url(http://i57.tinypic.com/28aq0rd.jpg);">
</div></a>


<div class="conn">

<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.

</div></div>

</td></tr></table><table class="vic_table"><tr><td>

<div id="LK2MEETlinksTable"><div class="left">

<a href="/#">Connection Name</a>
<a href="/#">Connection Name</a>
<a href="/#">Connection Name</a>
<a href="/#">Connection Name</a>
<a href="/#">Connection Name</a>

</div><div class="right">

<a href="/#">Connection Name</a>
<a href="/#">Connection Name</a>
<a href="/#">Connection Name</a>
<a href="/#">Connection Name</a>
<a href="/#">Connection Name</a>

</div></div>
-----------------------------INTERESTS-----------------------------


 </td></tr></table></td></tr></table><table class="vicinterests_table"><tr><td valign="top" align="center"><table><tr><td>

<font class="cite">
The above table code must remain at the top.  FULL tables below can be rearranged.
</font>

</td></tr></table><table class="vic_table"><tr><td>


<div id="INTtable1">

<div class="line1"></div><div class="line2"></div><div class="line3"></div><div class="line4"></div>


<div class="xxx">

<img src="http://i60.tinypic.com/2sabl1v.jpg">
<img src="http://i60.tinypic.com/2v14yfc.jpg">
<img src="http://i62.tinypic.com/2q3ytl5.jpg">


</div><div class="xxy">

<img src="http://i62.tinypic.com/2l9ryq1.jpg">
<img src="http://i57.tinypic.com/28aq0rd.jpg">
<img src="http://i61.tinypic.com/2nl5sva.jpg">

</div><div class="about">

<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.

<font class="blockquote">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum
</font>

<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?  At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.


</div><div class="quote">

I shall live by passion and not by law

</div><div class="music">

<object type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_mini.swf" width="200" height="20">
    <param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_mini.swf" />
    <param name="bgcolor" value="#d7d7d7" />
<param name="wmode" value="opaque" />
    <param name="FlashVars" value="mp3=http%3A//k007.kiwi6.com/hotlink/giu61ppz04/FATM_H.mp3&autoplay=1&bgcolor=d7d7d7&loadingcolor=151515&buttoncolor=151515&slidercolor=151515" />
</object>


</div></div>

<font class="cite">You will note a line of code that starts with param name="wmode" above.  The normal player that you add from mp3.flash 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. This will keep it hidden until it's hovered over.</font>



</td></tr></table><table class="vic_table"><tr><td>

<div id="INTtable2"><div class="vicbox" style="position:absolute; margin-top:0px; margin-left:0px; ">

<img src="http://i57.tinypic.com/1fzasz.jpg">

<div class="mask">

<font class="h2">Personality</font>

<div class="stats">
<b>Type</b> Input Info
<br><b>Traits</b> Input Info
<br><b>Quirks</b> Input Info

<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?

</div></div></div>

<div class="vicbox" style="position:absolute; margin-top:0px; margin-left:218px;">

<img src="http://i61.tinypic.com/2lij81v.jpg">

<div class="mask">

<font class="h2">Legal & Physical</font>

<div class="stats">
<b>NAME:</b> Input info
<BR><b>NICKNAMES:</b> Input info
<BR><b>ALIASES:</b> Input info
<BR><b>DATE OF BIRTH:</b> Input info
<BR><b>PLACE OF BIRTH:</b> Input info
<BR><b>CURRENT RESIDENCE:</b> Input info
<BR><b>ETHNICITY:</b> Input info
<BR><b>HAIR COLOR:</b> Input info
<BR><b>EYE COLOR:</b> Input info
<BR><b>HEIGHT:</b> Input info
<BR><b>WEIGHT:</b> Input info
<BR><b>BIRTHMARKS/SCARS:</b> Input info

</div></div></div>


<div class="vicbox" style="position:absolute; margin-top:217px; margin-left:0px;">

<img src="http://i61.tinypic.com/beuceu.jpg">

<div class="mask">

<font class="h2">Family & Relationships</font>

<div class="stats">
<BR><b>MOTHER:</b> Input info
<BR><b>FATHER:</b> Input info
<BR><b>SISTER(S):</b> Input info
<BR><b>BROTHER(S):</b> Input info
<BR><b>Other Family:</b> Input info
<BR><b>STATUS:</b> Input info
<BR><b>ORIENTATION:</b> Input info
<BR><b>CURRENT:</b> Input info
<BR><b>FORMER:</b> Input info

</div></div></div>

<div class="vicbox" style="position:absolute; margin-top:217px; margin-left:218px;">

<img src="http://i60.tinypic.com/30wms5z.jpg">

<div class="mask">

<font class="h2">Education & Employment</font>

<div class="stats">
<b>High School</b> Input Info
<br><b>College</b> Input Info
<br><b>Major</b> Input Info
<br><b>Degree</b> Input Info
<br><b>OCCUPATION:</b> Input info
<BR><b>JOB DESCRIPTION:</b> Input info
<BR><b>EMPLOYER:</b> Input info
<BR><b>SKILLSET:</b> Input info


</div></div></div></div>



</td></tr></table><table class="vic_table"><tr><td>

<div id="INTtable3">
<div class="title1">Howl</div>
<div class="title2">at the moon</div>

<div class="pic" style="background-image:url(http://i57.tinypic.com/28aq0rd.jpg);"></div>


<div class="about">

<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.


<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.

</div><div class="quote">
This is where I hide my power.  This is where I become free.
<BR>
This is where I take control and slowly choke your fantasies.

</div></div>


</td></tr></table><table class="vic_table"><tr><td>


<div id="INTtable4">

<p>This is an extra box.
<em>Emphasized</em>
<b>Bold</b>
<i>Italics</i>
<font class="u">underline</font>
<font class="strike">strike</font>
<font class="strong">strong</font>

<p>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.

</div>


-----------------------------MUSIC---------------------------------

 </td></tr></table></td></tr></table><table><tr><td valign="top" align="center"><table><tr><td>

<div id="sidebar"><div class="sidebarB"><div class="def">

<div class="def1" style="background-image:url(http://i62.tinypic.com/qns1np.jpg);">

</div><div class="linx">

<a href="/logincomplete.php">Home</a>
<a href="/send_message.php?member_id=xxxxxx">Message</a>
<a href="/add_testimonial.php?member_id=xxxxxx">Comment</a>
<a href="/gallery.php?member_id=xxxxxx">Photos</a>
<a href="/view_member_blog.php?member_id=xxxxxx">Blogs</a>


</div></div><div class="quote1">

But I'm, nothing special.  I'm not unique.  I have many secrets, and I eat the weak.


</div><div class="title">

Arooooo

</div><div class="stuff">

<div class="icon">☾</div>

<div class="info">

<Strong>Verses</strong>
<BR>Verse, Verse, Verse, Verse

<BR><Strong>Writing Style</strong>
<BR>Multi-para to Novella

<Strong>Dues</strong>
<br>S:0 | C:0 | M:0


</div></div></div></div>


-----------------------------MOVIES--------------------------------

 <font class="cite">If your profile is private, you can delete this entire section.</font>

<div id="add"><a href="/invite_friend.php?friend_id=xxxxxx">✚</a></div>



-----------------------------TELEVISION/BOOKS/HEROES--------------------------------

  <font class="cite">LEAVE BLANK</font>