Realistic or Modern ᴘʀᴏᴊᴇᴄᴛ ɪᴜᴠᴇɴᴛᴜs (ʀᴇsɪᴅᴇɴᴛs)

[teenage witch]

.

.

[class=container] height: 310px; width: 360px; margin: auto; background-color: white; overflow: hidden; [/class] [class=box1] height: 250px; width: 200px; background-color: white; margin-left: 140px; margin-top: 40px; position: absolute; border: 1px solid lightgray; overflow: hidden; [/class] [class=image] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; position: absolute; opacity: 0; transition: 1s; z-index: 1; background-image: url('https://66.media.tumblr.com/99e6e51277d4bd628e03735b69de588f/a5f71232b0dbcf5e-f9/s1280x1920/56f4c760564c7be36acfd16d9978a0809f4edb3c.jpg'); background-size: cover; background-position: center center; background-repeat: no-repeat; [/class] [class name=image state=hover] cursor: default; [/class] [class=personality] width: 80px; height: 20px; font-size: 10px; font-family: 'Arial', sans-serif; font-weight: bold; color: black; opacity: 0; position: absolute; background-color: transparent; margin-top: 168px; margin-left: 5px; transform: translateY(-10px); transition: 1s; z-index: 0; pointer-events: none; letter-spacing: 0.5px; [/class] [class=history] width: 80px; height: 20px; font-size: 10px; font-family: 'Arial', sans-serif; font-weight: bold; color: black; opacity: 0; position: absolute; background-color: transparent; margin-top: 168px; margin-left: 40px; transform: translateY(-10px); transition: 1s; z-index: 0; pointer-events: none; letter-spacing: 0.5px; [/class] [class=extra] width: 80px; height: 20px; font-size: 10px; font-family: 'Arial', sans-serif; font-weight: bold; color: black; opacity: 0; position: absolute; background-color: transparent; margin-top: 168px; margin-left: 65px; transform: translateY(-10px); transition: 1s; z-index: 0; pointer-events: none; letter-spacing: 0.5px; [/class] [class=gallery] width: 80px; height: 20px; font-size: 10px; font-family: 'Arial', sans-serif; font-weight: bold; color: black; opacity: 0; position: absolute; background-color: transparent; margin-top: 168px; margin-left: 85px; transform: translateY(-10px); transition: 1s; z-index: 0; pointer-events: none; letter-spacing: 0.5px; [/class] [class=slide] transform: translateX(0); opacity: 0.2; transition: opacity 0.5s , transform 1s; [/class] [class=image1] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://66.media.tumblr.com/84b38df8b122d4a38b4428c246eeaab9/tumblr_inline_pmbnriNNW81t9f20v_250.gifv'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 47px; [/class] [class name=image1 state=hover] cursor: default; [/class] [class=image2] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://i.pinimg.com/originals/e1/9a/c7/e19ac7548c94ebce381859e505a587bb.gif'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 47px; [/class] [class name=image2 state=hover] cursor: default; [/class] [class=image3] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://66.media.tumblr.com/b01f4fa889db5cb84f8073c3e3da13cc/tumblr_inline_pm0it8nWeD1s5z4l1_1280.gif'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 47px; [/class] [class name=image3 state=hover] cursor: default; [/class] [class=showimg] opacity: 0.8; transition: 1s; [/class] [class=name] font-size: 18px; font-family: 'Arial', sans-serif; font-style: italic; font-weight: bold; margin-left: 20px; margin-top: 120px; color: black; position: absolute; opacity: 0.3; transition: 1s; [/class] [class name=name state=hover] cursor: default; [/class] [class=tabcontainer] height: 20px; width: 80px; position: absolute; margin-top: 140px; margin-left: 25px; background-color: transparent; padding: 5px; [/class] [class=tab1] font-size: 14px; font-family: 'Cardo', serif; color: black; font-weight: lighter; position: absolute; margin-left: 0px; margin-top: 0px; opacity: 0.3; transition: 1s; [/class] [class name=tab1 state=hover] opacity: 0.8; transition: opacity 1s; cursor: default; [/class] [class=tab2] font-size: 14px; font-family: 'Cardo', serif; color: black; font-weight: lighter; position: absolute; margin-left: 20px; margin-top: 0px; opacity: 0.3; transition: 1s; [/class] [class name=tab2 state=hover] opacity: 0.8; transition: opacity 1s; cursor: default; [/class] [class=tab3] font-size: 14px; font-family: 'Cardo', serif; color: black; font-weight: lighter; position: absolute; margin-left: 40px; margin-top: 0px; opacity: 0.3; transition: 1s; [/class] [class name=tab3 state=hover] opacity: 0.8; transition: opacity 1s; cursor: default; [/class] [class=tab4] font-size: 14px; font-family: 'Cardo', serif; color: black; font-weight: lighter; position: absolute; margin-left: 65px; margin-top: 0px; opacity: 0.3; transition: 1s; [/class] [class name=tab4 state=hover] opacity: 0.8; transition: opacity 1s; cursor: default; [/class] [class=content1] height: 250px; width: 200px; background-color: transparent; overflow-y: scroll; padding-right: 20px; position: absolute; opacity: 0; transition: 1s; [/class] [class=content2] height: 250px; width: 200px; background-color: transparent; overflow-y: scroll; padding-right: 20px; position: absolute; opacity: 0; transition: 1s; [/class] [class=content3] height: 250px; width: 200px; background-color: transparent; overflow-y: scroll; padding-right: 20px; position: absolute; opacity: 0; transition: 1s; [/class] [class=content4] height: 250px; width: 200px; background-color: transparent; overflow-y: scroll; padding-right: 20px; position: absolute; opacity: 0; transition: 1s; [/class] [class=para] font-size: 11px; text-align: justify; color: black; padding: 5px; opacity: 0.7; [/class] [class name=para state=hover] cursor: default; [/class] [class=show] opacity: 1; transition: 1s; z-index: 1; [/class] [class=g1] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://66.media.tumblr.com/e535224f0deb6fe85b29dc407757721f/tumblr_inline_poiuziTGDG1td3ts4_400.gifv'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 75px; [/class] [class name=g1 state=hover] cursor: default; [/class] [class=g2] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://em.wattpad.com/4ee5e83719f7700fff08fefff7c7e9989047fcbc/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f2d796158545a4f6f67706c4550513d3d2d3639373135343531322e313538343961643039353836383939363131343932393137393433302e676966?s=fit&w=720&h=720'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 75px; [/class] [class name=g2 state=hover] cursor: default; [/class] [class=g3] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://66.media.tumblr.com/4cb46d89435357ba324a4ab72bb6fba9/tumblr_plc60zmzJ81y316nto2_500.gifv'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 55px; [/class] [class name=g3 state=hover] cursor: default; [/class] [class=credit] font-size: 10px; color: rgba(0,0,0,0.3); font-family: 'Arial', sans-serif; font-style: italic; position: absolute; margin-top: 295px; margin-left: 200px; [/class] [script class=image on=init] addClass showimg image removeClass show content1 removeClass show content2 removeClass show content3 removeClass show content4 [/script] [script class=name on=click] addClass showimg image removeClass show content1 removeClass show content2 removeClass show content3 removeClass show content4 [/script] [script class=tab1 on=click] addClass show content1 removeClass show content2 removeClass show content3 removeClass show content4 removeClass showimg image [/script] [script class=tab2 on=click] addClass show content2 removeClass show content1 removeClass show content3 removeClass show content4 removeClass showimg image [/script] [script class=tab3 on=click] addClass show content3 removeClass show content1 removeClass show content2 removeClass show content4 removeClass showimg image [/script] [script class=tab4 on=click] addClass show content4 removeClass show content1 removeClass show content2 removeClass show content3 removeClass showimg image [/script] [script class=tab1 on=mouseenter] addClass slide personality [/script] [script class=tab1 on=mouseleave] removeClass slide personality [/script] [script class=tab2 on=mouseenter] addClass slide history [/script] [script class=tab2 on=mouseleave] removeClass slide history [/script] [script class=tab3 on=mouseenter] addClass slide extra [/script] [script class=tab3 on=mouseleave] removeClass slide extra [/script] [script class=tab4 on=mouseenter] addClass slide gallery [/script] [script class=tab4 on=mouseleave] removeClass slide gallery [/script] [div class=container] [div class=box1] [div class=image][/div] [div class=content1] [div class=image1][/div] [div class=para]name
nicknames
age
gender
sexuality
role
power

height
f.c.
d.f.
c.s. [/div] [/div] [div class=content2] [div class=image2][/div] [div class=para]pos. traits a tape recorder with one spare blank tape, half a sheet of 3d stickers, a tube of cherry lipgloss, a novelty invisible ink pen, a packet of patterned bandaids, and a spare set of headphones
neg. traits single white female
likes baked salmon
dislikes pillarbox red
hobbies living la vida loca
[/div] [/div] [div class=content3] [div class=image3][/div] [div class=para]summary here [/div] [/div] [div class=content4] [div class=g1][/div] [div class=g2][/div] [div class=g3][/div] [/div] [/div] [div class=credit]code by wonhae[/div] [div class=name]beckham gray[/div] [div class=tabcontainer] [div class=tab1]i.[/div] [div class=tab2]ii.[/div] [div class=tab3]iii.[/div] [div class=tab4]vi.[/div] [/div] [div class=basics][/div] [div class=meme][/div] [div class=description][/div] [div class=gallery][/div] [/div]

 

[caramel]

[class=variables] --color: #065535; cursor: url('http://i.imgur.com/ZOrzC.png'), auto !important [/class] [class=container] width: 460px; height: 300px; display: flex; margin: auto; [/class] [class=left] background-color: var(--color); height: 300px; width: 220px; padding: 10px; box-sizing: border-box; [/class] [class name=left maxWidth=450px] width: 135px; padding: 5px; height: 290px; [/class] [class=img] height: 280px; width: 200px; background-image: url('https://lh3.googleusercontent.com/proxy/YED-RSRqxxsAmzLLh2dHpdWtpClJ2aExgPvwGxym2ercy7TEtwHiQSj5pVHvEe0orur_8rAX5rWxpXCiy2DLSmH8nzcwwAMldPTpNr35hJjVp4IkvN4VHEbZTzQSB7U156wR5TezeoTFv78vOKTh'); filter: saturate(0%); background-size: cover; padding: 20px; box-sizing: border-box; background-position: 50% 50%; [/class] [class name=img maxWidth=450px] width: 125px; [/class] [class=brackets] height: 100%; width: 100%; background: linear-gradient(to right, white 2px, transparent 2px) 0 100%, linear-gradient(to left, white 2px, transparent 2px) 100% 0, linear-gradient(to bottom, white 2px, transparent 2px) 100% 0, linear-gradient(to top, white 2px, transparent 2px) 0 100%; background-repeat: no-repeat; background-size: 20px 20px; [/class] [class name=brackets maxWidth=450px] opacity: 0; [/class] [class=right] width: 240px; height: 300px; display: flex; flex-direction: column; [/class] [class=contentContainer] position: relative; width: 240px; height: 270px; [/class] [class name=contentContainer maxWidth=450px] left: -5px; [/class] [class=content] position: absolute; opacity: 0; transition: 0.5s; width: 240px; height: 270px; font-size: 12px; padding-left: 10px; box-sizing: border-box; overflow: hidden; [/class] [class=scroll] width: 100%; padding-right: 150px; height: 100%; overflow-y: scroll; [/class] [class=name] font-weight: 900; text-align: center; border-bottom: 4px solid var(--color); width: 120px; display: block; margin: 10% auto; font-size: 18px; position: relative; [/class] [class=textHome] font-size: 12px; text-align: center; text-transform: uppercase; width: 200px; margin: 0 6.5%; [/class] [class=title] text-align: center; font-size: 16px; text-transform: uppercase; font-weight: 900; [/class] [class=tag] display: inline-block; border-bottom: 1px solid var(--color); height: 15px; font-size: 10px; text-transform: uppercase; [/class] [class=imgSmallContainer] width: 80%; height: 70px; display: flex; justify-content: space-between; margin: 10px auto; [/class] [class=imgSmall] width: 70px; height: 70px; background-size: cover; background-position: 50% 50%; filter: saturate(70%); [/class] [class=tabs] display: flex; width: 150px; margin: 0 23%; justify-content: space-between; [/class] [class name=tabs maxWidth=450px] position: relative; left: -10px; [/class] [class=tab] border-radius: 50%; height: 20px; width: 20px; border: 1px solid black; transition: 0.5s; [/class] [class name=tab state=hover] cursor: url('https://i.imgur.com/8akxkMH.png'), auto !important; border: 1px solid var(--color); [/class] [class=show] z-index: 1; opacity: 1; [/class] [class=click] border: 1px solid var(--color); background-color: var(--color); [/class] [script class=tab01 on=click] addClass click tab01 removeClass click tab02 removeClass click tab03 removeClass click tab04 addClass show content01 removeClass show content02 removeClass show content03 removeClass show content04 removeClass show contentHome [/script] [script class=tab02 on=click] addClass click tab02 removeClass click tab01 removeClass click tab03 removeClass click tab04 addClass show content02 removeClass show content01 removeClass show content03 removeClass show content04 removeClass show contentHome [/script] [script class=tab03 on=click] addClass click tab03 removeClass click tab01 removeClass click tab02 removeClass click tab04 addClass show content03 removeClass show content01 removeClass show content02 removeClass show content04 removeClass show contentHome [/script] [script class=tab04 on=click] addClass click tab04 removeClass click tab01 removeClass click tab02 removeClass click tab03 addClass show content04 removeClass show content01 removeClass show content02 removeClass show content03 removeClass show contentHome [/script] [div class=variables] [div class=container] [div class=left] [div class=img] [div class=brackets][/div] [/div] [/div] [div class=right] [div class=contentContainer] [div class="show content contentHome"] [div class=name]BELA LUGOSI.[/div] [div class=textHome]you’re the only one i want

by my side

when I fall asleep[/div] [/div] [div class="content content01"] [div class=scroll] [div class=title]basics[/div] [div class=tag]name[/div] bela lugosi
[div class=tag]nicknames[/div] n/a
[div class=tag]age[/div] 20
[div class=tag]gender[/div] cismale
[div class=tag]sexuality[/div] bisexual
[div class=tag]role[/div] n/a
[div class=tag]power[/div] x
[div class=imgSmallContainer] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/cf894ace51d658a7b785f8fe4b373e3e/tumblr_pnvep6fsWg1y0n0ino3_250.png');"][/div] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/26ca6ca6ca691294c035bd8374ec467e/tumblr_pnvep6fsWg1y0n0ino2_250.png');"][/div] [/div] [div class=title]appearance[/div] [div class=tag]height[/div] five foot elven inches.
[div class=tag]fc[/div] aidan alexander
[div class=tag]distinguishing features[/div] his nose has been broken a few times and it’s crooked as shit, he has the deepest dark circles, and there’s a significant gap between his two front teeth.
[div class=tag]clothing style[/div] white tees, jeans, work boots, iron jewelry, denim aviator jackets, blank crew necks, wife beaters
[/div] [/div] [div class="content content02"] [div class=scroll] [div class=title]persona[/div] [div class=tag]postive traits[/div] physically capable, intuitive, calm, levelheaded [div class=tag]negative traits[/div] stoic, distrustful, envious [div class=imgSmallContainer] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/8bef457a7401a0fb045e57eeab51651b/tumblr_pnvep6fsWg1y0n0ino1_250.png');"][/div] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/efb2111c0b9267b684030bba382629fb/tumblr_pnvep6fsWg1y0n0ino4_250.png');"][/div] [/div] [div class=tag]likes[/div] plain jewelry, smoke, auto mechanics, dawn, brisk weather, ice
[div class=tag]dislikes[/div] getting involved in other people’s problems, the hospital, marijuana, festivities
[/div] [/div] [div class="content content03"] [div class=scroll] [div class=title]special[/div] [div class=imgSmallContainer] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/789092e06343f18223561313630a6b09/tumblr_pnvep6fsWg1y0n0ino9_250.png');"][/div] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/9cb82cce6e422fd6666afde1b48e8d4c/tumblr_pnvep6fsWg1y0n0ino8_250.png');"][/div] [/div] [div class=tag]hobbies[/div] fixing up cars, attempting to write love letters, drumming, sleeping on his porch
[div class=tag]playlist[/div] x
[/div] [/div] [div class="content content04"] [div class=scroll] [div class=title]background[/div] [div class=tag]favorite song[/div] cave by balkans [div class=imgSmallContainer] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/9b7a2173447710abfd47751734d27585/tumblr_pnvep6fsWg1y0n0ino5_250.png');"][/div] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/85e14b6e434727fc7f11e05f059f22f6/tumblr_pnvep6fsWg1y0n0ino7_250.png');"][/div] [/div] [div class=tag]aesthetic[/div] coming soon
[div class=tag]summary/relationships [/div]
xx → b + f = love
xx → etc. [/div] [/div] [/div] [div class=tabs] [div class="tab tab01"][/div] [div class="tab tab02"][/div] [div class="tab tab03"][/div] [div class="tab tab04"][/div] [/div] [/div] [/div] [/div]

coded by shady.

 

[eclipsa]

[class=main] cursor: url(https://66.media.tumblr.com/def8729b4eaed6fe2ae6dd6b5e52f2ad/tumblr_inline_nrkbg8htJ11ry72eo_75sq.png), auto!important; font-family: 'Sulphur Point', sans-serif; font-size: 11px; text-align: justify; color: #000 [/class] [class=twit] width: 400px; padding: 10px; background: white; margin: auto; border: 1px solid #e3e3e3 [/class] [class=icon] background-image: url(https://i.pinimg.com/originals/ea/29/98/ea2998641291fab52cacbb5e39f3325c.jpg); background-size: 120% auto; height: 75px; width: 75px; display: inline-block; border-radius: 100%; margin-left: 10px [/class] [class=name] display: inline-block; margin-left: 10px [/class] [class=tweet1] width: 390px; height: 75px; margin: auto; overflow: hidden; border-bottom: 1px solid #e3e3e3 [/class] [class=tweet2] width: 410px; height: 75px; overflow: auto [/class] [class=tweet3] margin-right: 20px [/class] [class=notes] border-bottom: 1px solid #e3e3e3; padding-top: 2px; padding-bottom: 2px; width: 390px; margin: auto [/class] [class=buttons] text-align: center; letter-spacing: 50px [/class] [div class=main][div class=twit][div class=icon][/div][div class=name]salvatore
resident


[/div]
[div class=tweet1][div class=tweet2][div class=tweet3]whomst — at deviltown


just now[/div][/div][/div][div class=notes]45k retweets 65k likes[/div][div class=buttons][/div]

milk inc​

[/div][/div]

 

[adored]

RESIDENT ............................................................................

[NAME] giovanni ‘casimir’ ribisi.
[NICKNAMES] none.
[AGE] nineteen.
[GENDER] cismale.
[SEXUALITY] heterosexual.
[ROLE] resident.

[HEIGHT] 5' 11.
[FC] lorenzo zurzolo.
[DISTINGUISHING FEATURES] piercing blue eyes.
[CLOTHING STYLE] the way he dresses matters little to gio, as he has a rather basic style—basic tees, hoodies, jackets, etc.

[POSITIVE] protective, charming, confident, kind (when he chooses to be)
[NEGATIVE] hard–headed, emotional, impulsive, unpredictable.
[LIKES] cherry pepsi, smell of lavender, horror movies, children.
[DISLIKES] checkered patterns, grape–flavored candy, waking up late, snobs, overpowering cologne, touchy people.
[HOBBIES] learning languages, running.

there’s a magnetic aura around giovanni that one can’t deny; it’s intoxicating and draws people in like a moth to a flame. he’s very charming, and has a past history of flirtatious relationships with girls in the past due to his inability of controlling himself. however, all that glitters isn’t gold.

beneath the surface of his honeyed words and smirks, is an anger that simmers during his every waking moment. he suffers from anger issues, and is prone to lashing out. he tends to feel emotions intensely, and is quick to retaliate in anger. these days he’s attempted to keep himself under the wraps, but it’s become quite hard in a town like this.

dreambot

 

[caramel]

[class=variables] --color: #0A175B; cursor: url('http://i.imgur.com/ZOrzC.png'), auto !important [/class] [class=container] width: 460px; height: 300px; display: flex; margin: auto; [/class] [class=left] background-color: var(--color); height: 300px; width: 220px; padding: 10px; box-sizing: border-box; [/class] [class name=left maxWidth=450px] width: 135px; padding: 5px; height: 290px; [/class] [class=img] height: 280px; width: 200px; background-image: url('https://66.media.tumblr.com/b74c7fff6b5e552a8298b31e41027121/c556d18902609779-06/s640x960/9ff3a45830c9f2684922463abff366a32fe2d0a7.jpg'); filter: saturate(0%); background-size: cover; padding: 20px; box-sizing: border-box; background-position: 50% 50%; [/class] [class name=img maxWidth=450px] width: 125px; [/class] [class=brackets] height: 100%; width: 100%; background: linear-gradient(to right, white 2px, transparent 2px) 0 100%, linear-gradient(to left, white 2px, transparent 2px) 100% 0, linear-gradient(to bottom, white 2px, transparent 2px) 100% 0, linear-gradient(to top, white 2px, transparent 2px) 0 100%; background-repeat: no-repeat; background-size: 20px 20px; [/class] [class name=brackets maxWidth=450px] opacity: 0; [/class] [class=right] width: 240px; height: 300px; display: flex; flex-direction: column; [/class] [class=contentContainer] position: relative; width: 240px; height: 270px; [/class] [class name=contentContainer maxWidth=450px] left: -5px; [/class] [class=content] position: absolute; opacity: 0; transition: 0.5s; width: 240px; height: 270px; font-size: 12px; padding-left: 10px; box-sizing: border-box; overflow: hidden; [/class] [class=scroll] width: 100%; padding-right: 150px; height: 100%; overflow-y: scroll; [/class] [class=name] font-weight: 900; text-align: center; border-bottom: 4px solid var(--color); width: 120px; display: block; margin: 10% auto; font-size: 18px; position: relative; [/class] [class=textHome] font-size: 12px; text-align: center; text-transform: uppercase; width: 200px; margin: 0 6.5%; [/class] [class=title] text-align: center; font-size: 16px; text-transform: uppercase; font-weight: 900; [/class] [class=tag] display: inline-block; border-bottom: 1px solid var(--color); height: 15px; font-size: 10px; text-transform: uppercase; [/class] [class=imgSmallContainer] width: 80%; height: 70px; display: flex; justify-content: space-between; margin: 10px auto; [/class] [class=imgSmall] width: 70px; height: 70px; background-size: cover; background-position: 50% 50%; filter: saturate(70%); [/class] [class=tabs] display: flex; width: 150px; margin: 0 23%; justify-content: space-between; [/class] [class name=tabs maxWidth=450px] position: relative; left: -10px; [/class] [class=tab] border-radius: 50%; height: 20px; width: 20px; border: 1px solid black; transition: 0.5s; [/class] [class name=tab state=hover] cursor: url('https://i.imgur.com/8akxkMH.png'), auto !important; border: 1px solid var(--color); [/class] [class=show] z-index: 1; opacity: 1; [/class] [class=click] border: 1px solid var(--color); background-color: var(--color); [/class] [script class=tab01 on=click] addClass click tab01 removeClass click tab02 removeClass click tab03 removeClass click tab04 addClass show content01 removeClass show content02 removeClass show content03 removeClass show content04 removeClass show contentHome [/script] [script class=tab02 on=click] addClass click tab02 removeClass click tab01 removeClass click tab03 removeClass click tab04 addClass show content02 removeClass show content01 removeClass show content03 removeClass show content04 removeClass show contentHome [/script] [script class=tab03 on=click] addClass click tab03 removeClass click tab01 removeClass click tab02 removeClass click tab04 addClass show content03 removeClass show content01 removeClass show content02 removeClass show content04 removeClass show contentHome [/script] [script class=tab04 on=click] addClass click tab04 removeClass click tab01 removeClass click tab02 removeClass click tab03 addClass show content04 removeClass show content01 removeClass show content02 removeClass show content03 removeClass show contentHome [/script] [div class=variables] [div class=container] [div class=left] [div class=img] [div class=brackets][/div] [/div] [/div] [div class=right] [div class=contentContainer] [div class="show content contentHome"] [div class=name]OMAR CHASTAIN.[/div] [div class=textHome]I’M NOT A HEATHEN, THAT’S A LABEL THEY GAVE ME

I DON’T WORSHIP SATAN

I’M TOO EVIL AND HE HATES ME[/div] [/div] [div class="content content01"] [div class=scroll] [div class=title]basics[/div] [div class=tag]name[/div] omar chastain
[div class=tag]nicknames[/div] n/a
[div class=tag]age[/div] 18
[div class=tag]gender[/div] cismale
[div class=tag]sexuality[/div] bisexual
[div class=tag]role[/div] n/a
[div class=tag]power[/div] x
[div class=imgSmallContainer] [div class=imgSmall style="background-image: url('https://pbs.twimg.com/media/EKtHG99WsAAyQ_2.jpg');"][/div] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/6371f8c0af2e0fd81f060f0543bf3dd9/c35e081f14c4aa92-9c/s640x960/a9466464513fdef434f617e7d2dda7643fa47812.jpg');"][/div] [/div] [div class=title]appearance[/div] [div class=tag]height[/div] six foot
[div class=tag]fc[/div] carl malappa
[div class=tag]distinguishing features[/div] scars on his hands, knees, shoulders and face, a nearly constant black eye or split lip, perpetual glare, faint freckles on his cheeks
[div class=tag]clothing style[/div] black, puffer jackets, sweatpants, chains, colorful sneakers, some sort of hat
[/div] [/div] [div class="content content02"] [div class=scroll] [div class=title]persona[/div] [div class=tag]postive traits[/div] self aware, energetic, quick witted, artistic, charasmatic [div class=tag]negative traits[/div] petulant, antsy, the most emotional constipated person in existence, restless, aggressive [div class=imgSmallContainer] [div class=imgSmall style="background-image: url('https://medias.spotern.com/spots/w640/259/259098-1575275897.jpg');"][/div] [div class=imgSmall style="background-image: url('https://www.glamourparis.com/uploads/images/thumbs/201943/56/_mortel____la_nouvelle_s__rie_fran__aise_d___horreur_sign__e_netflix_632.jpeg_north_414x_white.jpg');"][/div] [/div] [div class=tag]likes[/div] cool colors, curly hair, gold jewelry, drinking a little too much, tattoos
[div class=tag]dislikes[/div] sweet food, small talk, authority, apologizing, himself
[/div] [/div] [div class="content content03"] [div class=scroll] [div class=title]special[/div] [div class=imgSmallContainer] [div class=imgSmall style="background-image: url('https://pbs.twimg.com/profile_images/1198710422867730438/5XFbQHY0_400x400.jpg');"][/div] [div class=imgSmall style="background-image: url('https://em.wattpad.com/83ea09e200293d14332b2d94e8b331885d145166/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f664164564c436e333148717750673d3d2d3832323233353937302e313565353737356138643232363431613637363033363332373039302e6a7067?s=fit&w=720&h=720');"][/div] [/div] [div class=tag]hobbies[/div] drawing, painting, graffiti, getting arrested, public intoxication
[div class=tag]playlist[/div] coming soon
[/div] [/div] [div class="content content04"] [div class=scroll] [div class=title]background[/div] [div class=tag]favorite song[/div] nitro cell by city morgue [div class=imgSmallContainer] [div class=imgSmall style="background-image: url('https://pbs.twimg.com/profile_images/1208777293214162944/2MS4V1DX_400x400.jpg');"][/div] [div class=imgSmall style="background-image: url('https://i.pinimg.com/originals/c1/36/59/c1365915e7fdee74d2a3b20d4d4c57b5.jpg');"][/div] [/div] [div class=tag]aesthetic[/div] coming soon
[div class=tag]summary/relationships [/div]
xx → “after i fuck, bitch i’m dippin!”
xx → etc. [/div] [/div] [/div] [div class=tabs] [div class="tab tab01"][/div] [div class="tab tab02"][/div] [div class="tab tab03"][/div] [div class="tab tab04"][/div] [/div] [/div] [/div] [/div]

coded by shady.

 

[caramel]

[class=variables] --color: #FEB5DC; cursor: url('http://i.imgur.com/ZOrzC.png'), auto !important [/class] [class=container] width: 460px; height: 300px; display: flex; margin: auto; [/class] [class=left] background-color: var(--color); height: 300px; width: 220px; padding: 10px; box-sizing: border-box; [/class] [class name=left maxWidth=450px] width: 135px; padding: 5px; height: 290px; [/class] [class=img] height: 280px; width: 200px; background-image: url('https://66.media.tumblr.com/24b47785440d95540e37258dfc778ded/097e981b30a1570c-a4/s400x600/9de1483fc9cdb393d8c62b21d0291eb401101261.jpg'); filter: saturate(0%); background-size: cover; padding: 20px; box-sizing: border-box; background-position: 50% 50%; [/class] [class name=img maxWidth=450px] width: 125px; [/class] [class=brackets] height: 100%; width: 100%; background: linear-gradient(to right, white 2px, transparent 2px) 0 100%, linear-gradient(to left, white 2px, transparent 2px) 100% 0, linear-gradient(to bottom, white 2px, transparent 2px) 100% 0, linear-gradient(to top, white 2px, transparent 2px) 0 100%; background-repeat: no-repeat; background-size: 20px 20px; [/class] [class name=brackets maxWidth=450px] opacity: 0; [/class] [class=right] width: 240px; height: 300px; display: flex; flex-direction: column; [/class] [class=contentContainer] position: relative; width: 240px; height: 270px; [/class] [class name=contentContainer maxWidth=450px] left: -5px; [/class] [class=content] position: absolute; opacity: 0; transition: 0.5s; width: 240px; height: 270px; font-size: 12px; padding-left: 10px; box-sizing: border-box; overflow: hidden; [/class] [class=scroll] width: 100%; padding-right: 150px; height: 100%; overflow-y: scroll; [/class] [class=name] font-weight: 900; text-align: center; border-bottom: 4px solid var(--color); width: 120px; display: block; margin: 10% auto; font-size: 18px; position: relative; [/class] [class=textHome] font-size: 12px; text-align: center; text-transform: uppercase; width: 200px; margin: 0 6.5%; [/class] [class=title] text-align: center; font-size: 16px; text-transform: uppercase; font-weight: 900; [/class] [class=tag] display: inline-block; border-bottom: 1px solid var(--color); height: 15px; font-size: 10px; text-transform: uppercase; [/class] [class=imgSmallContainer] width: 80%; height: 70px; display: flex; justify-content: space-between; margin: 10px auto; [/class] [class=imgSmall] width: 70px; height: 70px; background-size: cover; background-position: 50% 50%; filter: saturate(70%); [/class] [class=tabs] display: flex; width: 150px; margin: 0 23%; justify-content: space-between; [/class] [class name=tabs maxWidth=450px] position: relative; left: -10px; [/class] [class=tab] border-radius: 50%; height: 20px; width: 20px; border: 1px solid black; transition: 0.5s; [/class] [class name=tab state=hover] cursor: url('https://i.imgur.com/8akxkMH.png'), auto !important; border: 1px solid var(--color); [/class] [class=show] z-index: 1; opacity: 1; [/class] [class=click] border: 1px solid var(--color); background-color: var(--color); [/class] [script class=tab01 on=click] addClass click tab01 removeClass click tab02 removeClass click tab03 removeClass click tab04 addClass show content01 removeClass show content02 removeClass show content03 removeClass show content04 removeClass show contentHome [/script] [script class=tab02 on=click] addClass click tab02 removeClass click tab01 removeClass click tab03 removeClass click tab04 addClass show content02 removeClass show content01 removeClass show content03 removeClass show content04 removeClass show contentHome [/script] [script class=tab03 on=click] addClass click tab03 removeClass click tab01 removeClass click tab02 removeClass click tab04 addClass show content03 removeClass show content01 removeClass show content02 removeClass show content04 removeClass show contentHome [/script] [script class=tab04 on=click] addClass click tab04 removeClass click tab01 removeClass click tab02 removeClass click tab03 addClass show content04 removeClass show content01 removeClass show content02 removeClass show content03 removeClass show contentHome [/script] [div class=variables] [div class=container] [div class=left] [div class=img] [div class=brackets][/div] [/div] [/div] [div class=right] [div class=contentContainer] [div class="show content contentHome"] [div class=name]CHANEL CAWEIN.[/div] [div class=textHome]I’M THE SWEETEST GIRL IN TOWN

SO WHY ARE YOU SO MEAN ?

IT’S ME YOU WANT AND NEED[/div] [/div] [div class="content content01"] [div class=scroll] [div class=title]basics[/div] [div class=tag]name[/div] chanel cawein
[div class=tag]nicknames[/div] everyone calls her coco
[div class=tag]age[/div] 18
[div class=tag]gender[/div] cisfemale
[div class=tag]sexuality[/div] bisexual
[div class=tag]role[/div] n/a
[div class=tag]power[/div] x
[div class=imgSmallContainer] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/b5453c379abc95ee0039e8030324616e/tumblr_inline_pi3yjptaIq1uqrddv_540.gif');"][/div] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/4eb97cd0c363b0da568f6257291daaf4/tumblr_inline_pi3yjrptgg1uqrddv_540.gif');"][/div] [/div] [div class=title]appearance[/div] [div class=tag]height[/div] five foot
[div class=tag]fc[/div] jaz sinclair
[div class=tag]distinguishing features[/div] embrassingly big glasses, limp from her right leg, her hair is nearly half her body
[div class=tag]clothing style[/div] turtlenecks, miniskirts, sheer stockings, headbands or bandannas, bardot tops, aviator jackets
[/div] [/div] [div class="content content02"] [div class=scroll] [div class=title]persona[/div] [div class=tag]postive traits[/div] booksmart, eager, reliable, happy-go-lucky, trustworthy [div class=tag]negative traits[/div] mellow, without a cause, underestimated, desperate for acceptance [div class=imgSmallContainer] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/e7503380189934e6615a06f24cedab99/tumblr_inline_pi477owQzS1uqrddv_1280.gif');"][/div] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/6c491bc81466f52d1d4a444b949d8557/tumblr_inline_pi477ay53h1uqrddv_1280.gif');"][/div] [/div] [div class=tag]likes[/div] the morning cartoons, libraries, tagging along on errands, pearls, self care, record players, boys
[div class=tag]dislikes[/div] being alone at night, being alone in general, watching from the outside in, bootcut jeans, blood, lazy days, parties no matter how hard she pretends to like them, a whole handful of authors
[/div] [/div] [div class="content content03"] [div class=scroll] [div class=title]special[/div] [div class=imgSmallContainer] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/b7afacedc00c5fb00d018a572202c0f9/tumblr_inline_pikow6yRqy1uqrddv_1280.gif');"][/div] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/6b544081307f46a1280ebf9fd9e710a2/tumblr_inline_pikovzBPrr1uqrddv_1280.gif');"][/div] [/div] [div class=tag]hobbies[/div] volunteering at the hospital, sewing, offering to braid everyone’s hair, making fanfiction out of seventy year old books
[div class=tag]playlist[/div] coming soon
[/div] [/div] [div class="content content04"] [div class=scroll] [div class=title]background[/div] [div class=tag]favorite song[/div] be my baby by the ronettes [div class=imgSmallContainer] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/7de68d1c79bfa5731035f8ffcb74a8f5/tumblr_inline_pj1ifjbKkz1uqrddv_540.gif');"][/div] [div class=imgSmall style="background-image: url('https://66.media.tumblr.com/5a5437d10f755a5b49c74a1511d779fe/tumblr_inline_pj1ifmJEke1uqrddv_540.gif');"][/div] [/div] [div class=tag]aesthetic[/div] coming soon
[div class=tag]summary/relationships [/div]
xx → b + c = love
xx → etc. [/div] [/div] [/div] [div class=tabs] [div class="tab tab01"][/div] [div class="tab tab02"][/div] [div class="tab tab03"][/div] [div class="tab tab04"][/div] [/div] [/div] [/div] [/div]

coded by shady.

 

[sophie.]

[class=yeah] width:341px; height:270px; margin:auto; border:1px solid #006400; [/class] [div class=yeah][class=big] height:270px; width:120px; background:#2E8B57; float:left; [/class] [div class=big] [class=img] height:118px; width:98px; background:url('https://cdn.discordapp.com/attachments/594320889609191456/679168251506196499/image0.gif'); background-size: 220%; background-position: -8vw 0vw; margin:auto; margin-top:10px; border:1px solid #fff; [/class] [class=img2] height:118px; width:98px; background:url('https://cdn.discordapp.com/attachments/594320889609191456/679168510227775508/image0.gif'); background-size: 210%; background-position: -8vw 0vw; margin:auto; margin-top:10px; border:1px solid #fff; [/class] [div class=img][/div][div class=img2][/div] [/div][class=wrap] height:270px; width:221px; background:#EEE8AA; float:left; [/class] [div class=wrap] [class=title] height:40px; width:200px; background:#2E8B57; border-top:1px solid #fff; border-right:1px solid #fff; border-left:1px solid #fff; float:left; margin:10px 10px; [/class] [div class=title][div style="color:#EEE8AA;font-size:25px;font-family:'Times New Roman';float:left;margin-left:5px;line-height:40px;font-weight:800;"]resident ✦[/div][/div] [class=tabhold] height:8px; background:#EEE8AA; width:202px; float:left; margin-left:10px; margin-top:-10px; [/class] [div class=tabhold][class=tab1] height:8px; width:49px; border-right:1px solid #006400; float:left; cursor:pointer; [/class] [class name=tab1 state=hover] background:#2E8B57; color:#fff; transition:1s [/class] [class=tab2] height:8px; width:49px; border-right:1px solid #006400; float:left; cursor:pointer; [/class] [class name=tab2 state=hover] background:#2E8B57; color:#fff; transition:1s [/class] [class=tab3] height:8px; width:49px; border-right:1px solid #006400; float:left; cursor:pointer; [/class] [class name=tab3 state=hover] background:#2E8B57; color:#fff; transition:1s [/class] [class=tab4] height:8px; width:50px; float:left; cursor:pointer; [/class] [class name=tab4 state=hover] background:#2E8B57; color:#fff; transition:1s [/class] [div class=tab1][div style="color:#006400;font-size:7px;line-height:8px;font-weight:800;text-align:center;"]BASICS[/div][/div] [div class=tab2][div style="color:#006400;font-size:7px;line-height:8px;font-weight:800;text-align:center;"]APPEARANCE[/div][/div] [div class=tab3][div style="color:#006400;font-size:7px;line-height:8px;font-weight:800;text-align:center;"]PERSONA[/div][/div] [div class=tab4][div style="color:#006400;font-size:7px;line-height:8px;font-weight:800;text-align:center;"]STORY[/div][/div][/div] [script class=tab1 on=click] hide tabcontentbox hide tabcontent2 hide tabcontent3 hide tabcontent4 fadeIn 1000 tabcontent11 addClass Tabs [/script] [script class=tab2 on=click] hide tabcontentbox fadeIn 1000 tabcontent2 hide tabcontent3 hide tabcontent4 hide tabcontent11 addClass Tabs [/script] [script class=tab3 on=click] hide tabcontentbox hide tabcontent2 fadeIn 1000 tabcontent3 hide tabcontent4 hide tabcontent11 addClass Tabs [/script] [script class=tab4 on=click] hide tabcontentbox hide tabcontent2 hide tabcontent3 fadeIn 1000 tabcontent4 hide tabcontent11 addClass Tabs [/script] [class=tabcontent11] height:135px; width:200px; float:left; background:#2E8B57; border-bottom:1px solid #fff; border-right:1px solid #fff; border-left:1px solid #fff; margin-left:10px; margin-top:-2px; [/class] [class=tabcontent2] height:135px; width:200px; float:left; background:#2E8B57; border-bottom:1px solid #fff; border-right:1px solid #fff; border-left:1px solid #fff; margin-left:10px; margin-top:-2px; display:none; [/class] [class=tabcontent3] height:135px; width:200px; float:left; background:#2E8B57; border-bottom:1px solid #fff; border-right:1px solid #fff; border-left:1px solid #fff; margin-left:10px; margin-top:-2px; display:none [/class] [class=tabcontent4] height:135px; width:200px; float:left; background:#2E8B57; border-bottom:1px solid #fff; border-right:1px solid #fff; border-left:1px solid #fff; margin-left:10px; margin-top:-2px; display:none; [/class] [div class=tabcontent11][class=container1] width:200px; height:125px; margin:0px -0px; overflow:hidden; color:#fff; font-size:10px; font-family:Arial; text-align:justify; line-height:12px; [/class] [class=scrollbar1] width:105%; height:125px; float:left; margin:10px 10px; overflow-y:scroll; [/class] [class=textbox1]width:92%; [/class] [div class=container1][div class=scrollbar1][div class=textbox1]
NAME: antoinette astrello

NICKNAME: anne, toni

AGE: twenty-two

GENDER: female

SEXUALITY: heterosexual

ROLE: resident

POWER: n/a

[/div][/div] [/div][/div] [div class=tabcontent2] [div class=container1][div class=scrollbar1][div class=textbox1]
HEIGHT: five feet, five inches

FC: quintessa swindell

DISTINGUISHING FEATURES: curly hair, calloused hands

CLOTHING STYLE: here.

[/div][/div] [/div][/div] [div class=tabcontent3] [div class=container1][div class=scrollbar1][div class=textbox1]
POS. TRAITS: elegant, well-spoken, comforting, warm

NEG. TRAITS: indecisive, mutable, easily influenced

LIKES: big sweaters, sunny weather, bass guitar, dry cereal

DISLIKES: silence, running, tomatoes, old movies

HOBBIES: singing, playing bass, writing, sleeping

[/div][/div] [/div][/div] [div class=tabcontent4] [div class=container1][div class=scrollbar1][div class=textbox1]
SHORT SUMMARY:



[/div][/div][/div][/div] [class=lilimg] height:50px; width:200px; float:left; margin:10px 10px; background:url('https://au.yamaha.com/en/files/overview_playability_638x480_58175b66acfa060d919617552ed5f7de.jpg'); background-size:120%; border:1px solid #fff; background-position: -4px; [/class] [div class=lilimg][/div][/div][/div]

code by @pasta​

 

[eclipsa]

[class=main] cursor: url(https://66.media.tumblr.com/def8729b4eaed6fe2ae6dd6b5e52f2ad/tumblr_inline_nrkbg8htJ11ry72eo_75sq.png), auto!important; font-family: 'Sulphur Point', sans-serif; font-size: 11px; text-align: justify; color: #000 [/class] [class=twit] width: 400px; padding: 10px; background: white; margin: auto; border: 1px solid #e3e3e3 [/class] [class=icon] background-image: url(https://p16.muscdn.com/img/musically-maliva-obj/1655746732293125~c5_720x720.jpeg); background-size: 120% auto; height: 75px; width: 75px; display: inline-block; border-radius: 100%; margin-left: 10px [/class] [class=name] display: inline-block; margin-left: 10px [/class] [class=tweet1] width: 390px; height: 75px; margin: auto; overflow: hidden; border-bottom: 1px solid #e3e3e3 [/class] [class=tweet2] width: 410px; height: 75px; overflow: auto [/class] [class=tweet3] margin-right: 20px [/class] [class=notes] border-bottom: 1px solid #e3e3e3; padding-top: 2px; padding-bottom: 2px; width: 390px; margin: auto [/class] [class=buttons] text-align: center; letter-spacing: 50px [/class] [div class=main][div class=twit][div class=icon][/div][div class=name]ambrose
resident


[/div]
[div class=tweet1][div class=tweet2][div class=tweet3]god fears their creation, and honestly? fair of them. #godisapussytho — at deviltown

just now[/div][/div][/div][div class=notes]45k retweets 65k likes[/div][div class=buttons][/div]

milk inc​

[/div][/div]

 

[teenage witch]

.

.

[class=container] height: 310px; width: 360px; margin: auto; background-color: white; overflow: hidden; [/class] [class=box1] height: 250px; width: 200px; background-color: white; margin-left: 140px; margin-top: 40px; position: absolute; border: 1px solid lightgray; overflow: hidden; [/class] [class=image] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; position: absolute; opacity: 0; transition: 1s; z-index: 1; background-image: url('https://66.media.tumblr.com/61e42562f61b46239347ff9e10c44fbb/tumblr_p3eg0jy6IZ1viscfqo1_250.png'); background-size: cover; background-position: center center; background-repeat: no-repeat; [/class] [class name=image state=hover] cursor: default; [/class] [class=personality] width: 80px; height: 20px; font-size: 10px; font-family: 'Arial', sans-serif; font-weight: bold; color: black; opacity: 0; position: absolute; background-color: transparent; margin-top: 168px; margin-left: 5px; transform: translateY(-10px); transition: 1s; z-index: 0; pointer-events: none; letter-spacing: 0.5px; [/class] [class=history] width: 80px; height: 20px; font-size: 10px; font-family: 'Arial', sans-serif; font-weight: bold; color: black; opacity: 0; position: absolute; background-color: transparent; margin-top: 168px; margin-left: 40px; transform: translateY(-10px); transition: 1s; z-index: 0; pointer-events: none; letter-spacing: 0.5px; [/class] [class=extra] width: 80px; height: 20px; font-size: 10px; font-family: 'Arial', sans-serif; font-weight: bold; color: black; opacity: 0; position: absolute; background-color: transparent; margin-top: 168px; margin-left: 65px; transform: translateY(-10px); transition: 1s; z-index: 0; pointer-events: none; letter-spacing: 0.5px; [/class] [class=gallery] width: 80px; height: 20px; font-size: 10px; font-family: 'Arial', sans-serif; font-weight: bold; color: black; opacity: 0; position: absolute; background-color: transparent; margin-top: 168px; margin-left: 85px; transform: translateY(-10px); transition: 1s; z-index: 0; pointer-events: none; letter-spacing: 0.5px; [/class] [class=slide] transform: translateX(0); opacity: 0.2; transition: opacity 0.5s , transform 1s; [/class] [class=image1] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://em.wattpad.com/486754e675c79bdec68e7e4564afdac2ca6f03b3/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f625476307658394669304a2d32673d3d2d3637353633383439372e313537396535646263373864363730373632393936313539333439322e676966'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 47px; [/class] [class name=image1 state=hover] cursor: default; [/class] [class=image2] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://em.wattpad.com/9d9ff39fc22b3724f644485ed9c282fb0bc63b32/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f4a6a6649456f5f32694346526f773d3d2d3734323838343130332e313561363861666466383565333466653335303334383637383636342e676966?s=fit&w=720&h=720'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 47px; [/class] [class name=image2 state=hover] cursor: default; [/class] [class=image3] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://em.wattpad.com/d0b05f9ec11c0f99ed84ddbb09bfd08212b3e8c6/68747470733a2f2f37382e6d656469612e74756d626c722e636f6d2f34653431313935666664613433366433373664313135386465636666373738352f74756d626c725f696e6c696e655f6f76773335637852504131756f677532365f3534302e676966?s=fit&h=360&w=360&q=80'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 47px; [/class] [class name=image3 state=hover] cursor: default; [/class] [class=showimg] opacity: 0.8; transition: 1s; [/class] [class=name] font-size: 18px; font-family: 'Arial', sans-serif; font-style: italic; font-weight: bold; margin-left: 20px; margin-top: 120px; color: black; position: absolute; opacity: 0.3; transition: 1s; [/class] [class name=name state=hover] cursor: default; [/class] [class=tabcontainer] height: 20px; width: 80px; position: absolute; margin-top: 140px; margin-left: 25px; background-color: transparent; padding: 5px; [/class] [class=tab1] font-size: 14px; font-family: 'Cardo', serif; color: black; font-weight: lighter; position: absolute; margin-left: 0px; margin-top: 0px; opacity: 0.3; transition: 1s; [/class] [class name=tab1 state=hover] opacity: 0.8; transition: opacity 1s; cursor: default; [/class] [class=tab2] font-size: 14px; font-family: 'Cardo', serif; color: black; font-weight: lighter; position: absolute; margin-left: 20px; margin-top: 0px; opacity: 0.3; transition: 1s; [/class] [class name=tab2 state=hover] opacity: 0.8; transition: opacity 1s; cursor: default; [/class] [class=tab3] font-size: 14px; font-family: 'Cardo', serif; color: black; font-weight: lighter; position: absolute; margin-left: 40px; margin-top: 0px; opacity: 0.3; transition: 1s; [/class] [class name=tab3 state=hover] opacity: 0.8; transition: opacity 1s; cursor: default; [/class] [class=tab4] font-size: 14px; font-family: 'Cardo', serif; color: black; font-weight: lighter; position: absolute; margin-left: 65px; margin-top: 0px; opacity: 0.3; transition: 1s; [/class] [class name=tab4 state=hover] opacity: 0.8; transition: opacity 1s; cursor: default; [/class] [class=content1] height: 250px; width: 200px; background-color: transparent; overflow-y: scroll; padding-right: 20px; position: absolute; opacity: 0; transition: 1s; [/class] [class=content2] height: 250px; width: 200px; background-color: transparent; overflow-y: scroll; padding-right: 20px; position: absolute; opacity: 0; transition: 1s; [/class] [class=content3] height: 250px; width: 200px; background-color: transparent; overflow-y: scroll; padding-right: 20px; position: absolute; opacity: 0; transition: 1s; [/class] [class=content4] height: 250px; width: 200px; background-color: transparent; overflow-y: scroll; padding-right: 20px; position: absolute; opacity: 0; transition: 1s; [/class] [class=para] font-size: 11px; text-align: justify; color: black; padding: 5px; opacity: 0.7; [/class] [class name=para state=hover] cursor: default; [/class] [class=show] opacity: 1; transition: 1s; z-index: 1; [/class] [class=g1] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://66.media.tumblr.com/3c61be912575d9c2de0282e634378d35/tumblr_inline_ovw107gbC11uogu26_540.gif'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 75px; [/class] [class name=g1 state=hover] cursor: default; [/class] [class=g2] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://em.wattpad.com/f957ae30a8dd030bbc2476ab046cd52bb2df8bd6/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f586e384b377447763245315a36413d3d2d3736353336303835332e3135623734636261373265633761316138313636383939353633302e676966?s=fit&w=720&h=720'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 75px; [/class] [class name=g2 state=hover] cursor: default; [/class] [class=g3] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://em.wattpad.com/87a7570e146a78bf927f12387d252356eb5baa8d/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f594a5a66354d52624670724a48673d3d2d3535303533333335332e313531653063636138626135383331393439343131353931303930302e676966'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 55px; [/class] [class name=g3 state=hover] cursor: default; [/class] [class=credit] font-size: 10px; color: rgba(0,0,0,0.3); font-family: 'Arial', sans-serif; font-style: italic; position: absolute; margin-top: 295px; margin-left: 200px; [/class] [script class=image on=init] addClass showimg image removeClass show content1 removeClass show content2 removeClass show content3 removeClass show content4 [/script] [script class=name on=click] addClass showimg image removeClass show content1 removeClass show content2 removeClass show content3 removeClass show content4 [/script] [script class=tab1 on=click] addClass show content1 removeClass show content2 removeClass show content3 removeClass show content4 removeClass showimg image [/script] [script class=tab2 on=click] addClass show content2 removeClass show content1 removeClass show content3 removeClass show content4 removeClass showimg image [/script] [script class=tab3 on=click] addClass show content3 removeClass show content1 removeClass show content2 removeClass show content4 removeClass showimg image [/script] [script class=tab4 on=click] addClass show content4 removeClass show content1 removeClass show content2 removeClass show content3 removeClass showimg image [/script] [script class=tab1 on=mouseenter] addClass slide personality [/script] [script class=tab1 on=mouseleave] removeClass slide personality [/script] [script class=tab2 on=mouseenter] addClass slide history [/script] [script class=tab2 on=mouseleave] removeClass slide history [/script] [script class=tab3 on=mouseenter] addClass slide extra [/script] [script class=tab3 on=mouseleave] removeClass slide extra [/script] [script class=tab4 on=mouseenter] addClass slide gallery [/script] [script class=tab4 on=mouseleave] removeClass slide gallery [/script] [div class=container] [div class=box1] [div class=image][/div] [div class=content1] [div class=image1][/div] [div class=para]name katherine maria russo
nicknames kitty (on account of her flexibility and the fact that she always lands on her feet)
age 19
gender female
sexuality heterosexual
role resident
power n/a

height 5'5
f.c. samantha boscarino
d.f.
c.s. [/div] [/div] [div class=content2] [div class=image2][/div] [div class=para]pos. traits
neg. traits
likes
dislikes
hobbies
[/div] [/div] [div class=content3] [div class=image3][/div] [div class=para]summary here [/div] [/div] [div class=content4] [div class=g1][/div] [div class=g2][/div] [div class=g3][/div] [/div] [/div] [div class=credit]code by wonhae[/div] [div class=name]katherine russo[/div] [div class=tabcontainer] [div class=tab1]i.[/div] [div class=tab2]ii.[/div] [div class=tab3]iii.[/div] [div class=tab4]vi.[/div] [/div] [div class=basics][/div] [div class=meme][/div] [div class=description][/div] [div class=gallery][/div] [/div]

 

[teenage witch]

.

.

[class=container] height: 310px; width: 360px; margin: auto; background-color: white; overflow: hidden; [/class] [class=box1] height: 250px; width: 200px; background-color: white; margin-left: 140px; margin-top: 40px; position: absolute; border: 1px solid lightgray; overflow: hidden; [/class] [class=image] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; position: absolute; opacity: 0; transition: 1s; z-index: 1; background-image: url('https://pbs.twimg.com/profile_images/853647232742162432/MVET-Oia_400x400.jpg'); background-size: cover; background-position: center center; background-repeat: no-repeat; [/class] [class name=image state=hover] cursor: default; [/class] [class=personality] width: 80px; height: 20px; font-size: 10px; font-family: 'Arial', sans-serif; font-weight: bold; color: black; opacity: 0; position: absolute; background-color: transparent; margin-top: 168px; margin-left: 5px; transform: translateY(-10px); transition: 1s; z-index: 0; pointer-events: none; letter-spacing: 0.5px; [/class] [class=history] width: 80px; height: 20px; font-size: 10px; font-family: 'Arial', sans-serif; font-weight: bold; color: black; opacity: 0; position: absolute; background-color: transparent; margin-top: 168px; margin-left: 40px; transform: translateY(-10px); transition: 1s; z-index: 0; pointer-events: none; letter-spacing: 0.5px; [/class] [class=extra] width: 80px; height: 20px; font-size: 10px; font-family: 'Arial', sans-serif; font-weight: bold; color: black; opacity: 0; position: absolute; background-color: transparent; margin-top: 168px; margin-left: 65px; transform: translateY(-10px); transition: 1s; z-index: 0; pointer-events: none; letter-spacing: 0.5px; [/class] [class=gallery] width: 80px; height: 20px; font-size: 10px; font-family: 'Arial', sans-serif; font-weight: bold; color: black; opacity: 0; position: absolute; background-color: transparent; margin-top: 168px; margin-left: 85px; transform: translateY(-10px); transition: 1s; z-index: 0; pointer-events: none; letter-spacing: 0.5px; [/class] [class=slide] transform: translateX(0); opacity: 0.2; transition: opacity 0.5s , transform 1s; [/class] [class=image1] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://66.media.tumblr.com/c644d6782df13582dfe13dddc69ed3e9/tumblr_oo5mhbH36G1rwdxeio5_250.gif'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 47px; [/class] [class name=image1 state=hover] cursor: default; [/class] [class=image2] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://media1.tenor.com/images/c5749e16bfe08b8c8c40f5624f48deb5/tenor.gif?itemid=15630740'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 47px; [/class] [class name=image2 state=hover] cursor: default; [/class] [class=image3] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://media1.tenor.com/images/7bd242fe4818cc3def73ac7e2d58580c/tenor.gif?itemid=15629123'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 47px; [/class] [class name=image3 state=hover] cursor: default; [/class] [class=showimg] opacity: 0.8; transition: 1s; [/class] [class=name] font-size: 18px; font-family: 'Arial', sans-serif; font-style: italic; font-weight: bold; margin-left: 20px; margin-top: 120px; color: black; position: absolute; opacity: 0.3; transition: 1s; [/class] [class name=name state=hover] cursor: default; [/class] [class=tabcontainer] height: 20px; width: 80px; position: absolute; margin-top: 140px; margin-left: 25px; background-color: transparent; padding: 5px; [/class] [class=tab1] font-size: 14px; font-family: 'Cardo', serif; color: black; font-weight: lighter; position: absolute; margin-left: 0px; margin-top: 0px; opacity: 0.3; transition: 1s; [/class] [class name=tab1 state=hover] opacity: 0.8; transition: opacity 1s; cursor: default; [/class] [class=tab2] font-size: 14px; font-family: 'Cardo', serif; color: black; font-weight: lighter; position: absolute; margin-left: 20px; margin-top: 0px; opacity: 0.3; transition: 1s; [/class] [class name=tab2 state=hover] opacity: 0.8; transition: opacity 1s; cursor: default; [/class] [class=tab3] font-size: 14px; font-family: 'Cardo', serif; color: black; font-weight: lighter; position: absolute; margin-left: 40px; margin-top: 0px; opacity: 0.3; transition: 1s; [/class] [class name=tab3 state=hover] opacity: 0.8; transition: opacity 1s; cursor: default; [/class] [class=tab4] font-size: 14px; font-family: 'Cardo', serif; color: black; font-weight: lighter; position: absolute; margin-left: 65px; margin-top: 0px; opacity: 0.3; transition: 1s; [/class] [class name=tab4 state=hover] opacity: 0.8; transition: opacity 1s; cursor: default; [/class] [class=content1] height: 250px; width: 200px; background-color: transparent; overflow-y: scroll; padding-right: 20px; position: absolute; opacity: 0; transition: 1s; [/class] [class=content2] height: 250px; width: 200px; background-color: transparent; overflow-y: scroll; padding-right: 20px; position: absolute; opacity: 0; transition: 1s; [/class] [class=content3] height: 250px; width: 200px; background-color: transparent; overflow-y: scroll; padding-right: 20px; position: absolute; opacity: 0; transition: 1s; [/class] [class=content4] height: 250px; width: 200px; background-color: transparent; overflow-y: scroll; padding-right: 20px; position: absolute; opacity: 0; transition: 1s; [/class] [class=para] font-size: 11px; text-align: justify; color: black; padding: 5px; opacity: 0.7; [/class] [class name=para state=hover] cursor: default; [/class] [class=show] opacity: 1; transition: 1s; z-index: 1; [/class] [class=g1] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://media1.tenor.com/images/b2e144afc5ddcc0dba28cd5fa95fe6b6/tenor.gif?itemid=15630733'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 75px; [/class] [class name=g1 state=hover] cursor: default; [/class] [class=g2] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://media1.tenor.com/images/3ac0459c717135543c1bee824a31bea2/tenor.gif?itemid=14795091'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 75px; [/class] [class name=g2 state=hover] cursor: default; [/class] [class=g3] height: 140px; width: 160px; margin-top: 55px; margin-left: 20px; opacity: 0.8; transition: 1s; background-image: url('https://em.wattpad.com/a6c8122ea7c56bb9ed8d1b7398f541bd8b3f86d2/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f776174747061642d6d656469612d736572766963652f53746f7279496d6167652f7077457146313479663450684d673d3d2d3433393437323032322e313464303839623462356561636264343530313038383730363233302e676966?s=fit&w=720&h=720'); background-size: cover; background-position: center center; background-repeat: no-repeat; margin-bottom: 55px; [/class] [class name=g3 state=hover] cursor: default; [/class] [class=credit] font-size: 10px; color: rgba(0,0,0,0.3); font-family: 'Arial', sans-serif; font-style: italic; position: absolute; margin-top: 295px; margin-left: 200px; [/class] [script class=image on=init] addClass showimg image removeClass show content1 removeClass show content2 removeClass show content3 removeClass show content4 [/script] [script class=name on=click] addClass showimg image removeClass show content1 removeClass show content2 removeClass show content3 removeClass show content4 [/script] [script class=tab1 on=click] addClass show content1 removeClass show content2 removeClass show content3 removeClass show content4 removeClass showimg image [/script] [script class=tab2 on=click] addClass show content2 removeClass show content1 removeClass show content3 removeClass show content4 removeClass showimg image [/script] [script class=tab3 on=click] addClass show content3 removeClass show content1 removeClass show content2 removeClass show content4 removeClass showimg image [/script] [script class=tab4 on=click] addClass show content4 removeClass show content1 removeClass show content2 removeClass show content3 removeClass showimg image [/script] [script class=tab1 on=mouseenter] addClass slide personality [/script] [script class=tab1 on=mouseleave] removeClass slide personality [/script] [script class=tab2 on=mouseenter] addClass slide history [/script] [script class=tab2 on=mouseleave] removeClass slide history [/script] [script class=tab3 on=mouseenter] addClass slide extra [/script] [script class=tab3 on=mouseleave] removeClass slide extra [/script] [script class=tab4 on=mouseenter] addClass slide gallery [/script] [script class=tab4 on=mouseleave] removeClass slide gallery [/script] [div class=container] [div class=box1] [div class=image][/div] [div class=content1] [div class=image1][/div] [div class=para]name clark st. andrews
nicknames n/a
age 19
gender male
sexuality heterosexual (allegedly)
role resident
power n/a

height 5'11
f.c. justin prentice
d.f.
c.s. [/div] [/div] [div class=content2] [div class=image2][/div] [div class=para]pos. traits
neg. traits
likes
dislikes
hobbies
[/div] [/div] [div class=content3] [div class=image3][/div] [div class=para]summary here [/div] [/div] [div class=content4] [div class=g1][/div] [div class=g2][/div] [div class=g3][/div] [/div] [/div] [div class=credit]code by wonhae[/div] [div class=name]clark st. andrews[/div] [div class=tabcontainer] [div class=tab1]i.[/div] [div class=tab2]ii.[/div] [div class=tab3]iii.[/div] [div class=tab4]vi.[/div] [/div] [div class=basics][/div] [div class=meme][/div] [div class=description][/div] [div class=gallery][/div] [/div]

 

[mikaluvkitties]

***WIP***

NAME: Lucille Clare Valentine Smith-Laine
NICKNAMES: Lucy, TBA
AGE: 19
GENDER: Presumably female (she/her)
SEXUALITY: Unknown
ROLE: New resident

HEIGHT: 5'9"
FC: Iva Varvarchuk

DISTINGUISHING FEATURES: TBA
CLOTHING STYLE: Mom jeans, overall shorts, knee-length skirts. Cute crew-neck t-shirts in either whites or faded pastels. Gray cardigan sweaters. Scrunchies that her hair just isn't quite long enough for.

POS. TRAITS: Highly perceptive, so good at socializing, pragmatic, excellent with her words, excellent liar, knowledgeable
NEG. TRAITS: Bit of a temper, sadistic streak, kind of terrified of who she is and disappointing... she's not sure who, no morals, manipulative on impulse
LIKES: TBA
DISLIKES: TBA
HOBBIES: Reading, writing poetry, participating in soft girl book club, serving at the diner(?), TBA

SHORT SUMMARY:
-Says the darnedest things!
-Been here a month
-She's been pretty low profile so far, trying to make friends and allies, though it's more impulse than anything
-Kind of forgettable honestly?
-She's a fan of a lot of the other residents, but she's caught on to quite a few being, for lack of a better term, fake as FUCK! That won't stop her from playing nice.
-TBA

RELATIONSHIPS:
-TBA

 

[fIora]

daniel springsdaniel springs [class name="loveContainerMajor"] --accent: #7D8DB0 [/class] [div class="loveContainerMajor"] [div class="loveImageContainer"] [div class="loveMainImage" style="background:url(https://imgur.com/QDUYmTd.png)"][/div] [/div] [div class="loveRightContainer"] [div class="loveTitleContainer"] [div class="loveStudentProfile"]new arrival[/div] [div class="loveStudentName"]daniel springs[/div] [/div] [div class="loveTabbedcontent"] [div class="lovePageContainer"] [div class="lovePage pageOne"] [div class="loveInfoBox"] [div class="loveInfoTitle"]nickname[/div] [div class="loveInfoText"]n/a[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]age[/div] [div class="loveInfoText"]twenty[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]gender[/div] [div class="loveInfoText"]male[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]sexuality[/div] [div class="loveInfoText"]bisexual[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]role[/div] [div class="loveInfoText"]new arrival[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]power[/div] [div class="loveInfoText"]none[/div] [/div] [div class="pageOneFlex"] [div class="pageFourImages"] [div class=" pageFourImage2 " style="background:url(https://i.imgur.com/yDuElfM.png)"][/div] [div class=" pageFourImage2 " style="background:url(https://i.imgur.com/ftlfsNT.png)"][/div] [div class=" pageFourImage2 " style="background:url(https://i.imgur.com/R7HbMwV.png)"][/div] [/div] [/div] [/div] [div class="lovePage pageTwo"] [div class="pageTwoText"] [div class="loveHeader"]appearance[/div] [div class="loveSubheader"]height[/div] 5' 9", 180 cm

[div class="loveSubheader"]faceclaim[/div] neil shibata

[div class="loveSubheader"]dinstinguishing features[/div] his eyes

[div class="loveSubheader"]clothing style[/div] necklaces, graphic tees, sweaters, blues and greys, short shorts [/div] [div class="pageFourImages"] [div class=" pageFourImage " style="background:url(https://i.imgur.com/fsnErlg.png)"][/div] [div class=" pageFourImage " style="background:url(https://i.pinimg.com/564x/b1/60/56/b160563214a3bd9bb863f3b17015d20c.jpg)"][/div] [div class=" pageFourImage " style="background:url(https://i.imgur.com/TwjfHhb.png)"][/div] [/div] [/div] [div class="lovePage pageThree"] [div class="loveInfoBox"] [div class="loveInfoTitle"]pos. traits[/div] [div class="loveInfoText"]intelligent, level headed, creative, mellow[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]negative traits[/div] [div class="loveInfoText"]quiet, unhelpful, closed off, abrasive[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]likes[/div] [div class="loveInfoText"]rain, staying in, reading, gloomy days[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]dislikes[/div] [div class="loveInfoText"]dirt and germs, travelling, getting lost[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]hobbies[/div] [div class="loveInfoText"]staying home, sketching, writing, swimming[/div] [/div] [div class="pageThreeSelect"][/div] [div class="loveHeader"]summary[/div] [div class="pageThreeText"] arriving about a month ago, he arrived along with multiple other new residents, waking up in an unfamiliar location. in reaction to his new environment, he avoided contact and stayed as confined in his home as possible. now, he is starting to open up and leave his home. some residents still find him quite strange and mysterious due to his introverted nature. [/div] [/div] [div class="lovePage pageFour"] [div class="pageFourFlex"] [/div] [div class="loveHeader"]gallery[/div] [div class="pageFourRight"][/div] [div class="pageFourImages"] [div class=" pageFourImage " style="background:url(https://i.imgur.com/NAgr8Ga.png)"][/div] [div class=" pageFourImage " style="background:url(https://i.imgur.com/WZtp9C4.png)"][/div] [div class=" pageFourImage " style="background:url(https://i.imgur.com/mEs9Ls5.png)"][/div] [/div] [div class="pageFourLeft"][/div] [div class="pageFourQuote"] "it's been a while since
i've been able to be this calm." [/div] [div class="pageFourRight"][/div] [div class="pageFourImages"] [div class=" pageFourImage " style="background:url(https://i.imgur.com/v4yUunD.png)"][/div] [div class=" pageFourImage " style="background:url(https://imgur.com/h2AkOSg.png)"][/div] [div class=" pageFourImage " style="background:url(https://i.imgur.com/3FyaqTd.png)"][/div] [/div] [/div] [/div] [div style="color:#555;padding-left:10px"] [div class="loveIconTabs tabOne"][/div] [div class="loveIconTabs tabTwo"][/div] [div class="loveIconTabs tabThree"][/div] [div class="loveIconTabs tabFour"][/div] [/div] [/div] [/div] [/div] [class name="loveContainerMajor" minWidth="820px"] width:800px; background:#fff; padding:10px; border:0.1px solid #f1f1f1; margin:auto; position:relative; display:flex; height:520px; [/class] [class name="loveContainerMajor" maxWidth="819px"] width:calc(100% - 20px) background:#fff; padding:10px; border:0.1px solid #f1f1f1; margin:auto; position:relative; display:flex; [/class] [class name="loveRightContainer" minWidth="820px"] width:calc(100% - 10px); margin-left:10px; [/class] [class name="loveImageContainer" minWidth="820px"] padding:10px; border:0.1px solid #f1f1f1; [/class] [class name="loveMainImage" minWidth="820px"] width:300px; height:500px; background-position: left; [/class] [class name="loveImageContainer" maxWidth="819px"] display:none; [/class] [class name="loveTitleContainer"] padding:25px; color:#555; align:right; text-transform:uppercase; border:0.1px solid #f1f1f1; height:75px; [/class] [class name="loveStudentProfile"] width:fit-content; padding:10px 10px 5px 10px; border-bottom:0.1px solid #f1f1f1; font-size:12px; [/class] [class name="loveStudentName"] font-size:25px; letter-spacing:1px; font-family:'Raleway', sans-serif; [/class] [class name="loveTabbedcontent" minWidth="820px"] width:100%; padding-top:10px; display:flex; height:365px; [/class] [class name="lovePageContainer" minWidth="820px"] width:360px; padding:10px; border:0.1px solid #f1f1f1; height:calc(100% - 0.1px); overflow:hidden; [/class] [class name="lovePage" minWidth="820px"] width:360px; height:100%; overflow:auto; padding-right:100px; margin-bottom:10px; [/class] [class name="loveIconTabs" minWidth="820px"] padding:27.5px; font-size:20px; text-align:center; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); transition:color 0.5s; [/class] [class name="loveIconTabs" maxWidth="819px"] display:none; [/class] [class name="loveIconTabs" state="hover" minWidth="820px"] color: var(--accent); animation-name: {post_id}loveIconPush; animation-duration: 0.5s; cursor:pointer; [/class] [class name="loveInfoTitle"] text-transform:uppercase; letter-spacing:1px; font-weight:bold; font-family:'Open Sans', sans-serif; font-size:10px; color:#555; [/class] [class name="loveInfoText"] text-transform: lowercase; font-family:'Open Sans', sans-serif; font-size:10.5px; color:#555; [/class] [class name="loveInfoBox" minWidth:"820px"] padding:10px 20px; display:flex; justify-content:space-between; border:1px solid #f1f1f1; margin-bottom:5px [/class] [class name="loveInfoBox" maxWidth:"819px"] padding:10px 20px; display:flex; justify-content:space-between; border:1px solid #f1f1f1; margin-top:5px [/class] [class name="loveInfoBox"] padding:10px 20px; display:flex; justify-content:space-between; border:1px solid #f1f1f1; margin-bottom:5px [/class] [class name="loveHeader"] width:fit-content; padding:0px 10px 0px 10px; border-bottom:0.1px solid #f1f1f1; text-transform:lowercase; font-size:20px; font-weight:bold; margin:auto; color: var(--accent) [/class] [class name="loveSubheader"] padding:5px; text-align:left; text-transform: uppercase; font-size:10px; letter-spacing:1px color:#555 [/class] [class name="loveMusicContainer" minWidth="820px"] border:1px solid #f1f1f1; display:inline-block; padding:0px 15px 20px 10px; [/class] [class name="loveMusicContainer" maxWidth="819px"] display:none; [/class] [class name="loveMusicSquare" minWidth="820px"] padding:20px; pointer-events:none; height:80px; width:80px; [/class] [class name="loveMusicSymbol" minWidth="820px"] box-sizing: border-box; height: 50px; border-color: transparent transparent transparent var(--accent); transition: 100ms all ease; will-change: border-width; cursor: pointer; border-style: solid; border-width: 25px 0 25px 40px; pointer-events:none; position:absolute; z-index:2; margin:25px 0px 0px 25px; background:#fff; [/class] [class name="loveMusicBox" minWidth="820px"] width:40px; height:40px; overflow:hidden; position:absolute; margin-top:-68px; margin-left:45px; z-index:1; cursor: pointer; border-radius:100% [/class] [class name="loveMusicHide" minWidth="820px"] width:100px; height:100px; position:absolute; margin-left:-10px; margin-top:-10px [/class] [class name="pause" minWidth="820px"] border-style:double!important; border-width: 0px 0px 0px 40px!important; [/class] [class name="pageOneFlex"] display:flex; justify-content:space-between; [/class] [class name="pageOneList"] border:0.1px solid #f1f1f1; padding:5px; text-align:justify; font-size:11px; color:#555; width:calc(50% - 15px); [/class] [class name="pageTwoText" minWidth="820px"] font-family:'Open Sans', sans-serif; font-size:11px;color:#555; text-align:justify; padding:10px; width:calc(100% - 5px) [/class] [class name="pageThreeSelect"] margin-top:-1px; width:90px; height:1px; background:#555; transition:0.4s ease; [/class] [class name="pageThreePage" minWidth="820px"] width:calc(100% + 17px);height:145px;overflow:auto;margin-top:5px;padding-right:30px;display:none; [/class] [class name="pageThreePage" maxWidth="819px"] width:calc(100% - 10px);margin-top:5px;padding:5px [/class] [class name="pageThreeText"] padding:10px;font-family:'Open Sans', sans-serif;font-size:11px;color:#555;text-align:justify; [/class] [class name="pageThreeTitle"] padding:20px;float:left; font-size:15px;font-weight:bold; [/class] [class name="pageThreeContainer"] display:flex; margin-top:10px [/class] [class name="pageThreeTab"] flex-grow:1; text-transform:uppercase; font-size:10px; color:#555; text-align:center; cursor:pointer; padding-bottom:5px; [/class] [class name="pageThreeTab" maxWidth="819px"] display:none [/class] [class name="selectedTwo"] margin-left:89px [/class] [class name="selectedThree"] margin-left:178px [/class] [class name="selectedFour"] margin-left:267px [/class] [class name="tabSelect"] border-bottom:1px solid #f1f1f1; [/class] [class name="pageFourFlex" minWidth="820px"] display:flex; position:relative; [/class] [class name="pageFourInfo" minWidth="820px"] padding:5px; flex-grow:1; padding-top:8px; [/class] [class name="pageFourLeft" minWidth="820px"] width:20px; height:20px; border-top:0.1px solid #e1e1e1; border-left:1px solid #e1e1e1; margin-left: 25px; [/class] [class name="pageFourRight" minWidth="820px"] width:20px; height:20px; border-bottom:0.1px solid #e1e1e1; border-right:1px solid #e1e1e1; margin-left:calc(100% - 50px); [/class] [class name="pageFourQuote"] text-align:center; font-size:10px; color:#555; text-transform:uppercase; margin:auto; font-family:'open sans', sans serif; margin:auto; width:250px [/class] [class name="pageFourImages" minWidth="820px"] margin:auto; display:flex; width:fit-content; margin-top:20px background-repeat:no-repeat; [/class] [class name="pageFourImage" minWidth="820px"] width:100px; height:100px; background-size: 110px!important; overflow: hidden; margin:5px; background-repeat: no-repeat; [/class] [class name="pageFourImage2" minWidth="820px"] width:100px; height:100px; background-size: 99px!important; overflow: hidden; margin:5px; background-repeat: no-repeat; [/class] [animation=loveIconPush] [keyframe=50] -webkit-transform: scale(0.8); transform: scale(0.8); [/keyframe] [keyframe=100] -webkit-transform: scale(1); transform: scale(1); [/keyframe] [/animation] [script class="tabTwo" on="click"] hide lovePage show pageTwo [/script] [script class="tabThree" on="click"] hide lovePage show pageThree [/script] [script class="tabFour" on="click"] hide lovePage show pageFour [/script] [script class="tabOne" on="click"] hide lovePage show pageOne [/script]
[div style="max-width:800px;margin:auto;width:100%;font-size:8px;text-transform:uppercase;opacity:0.6;text-align:right"]cheers, koschei[/div]

 

[sophie.]

[class=yeah] width:341px; height:270px; margin:auto; border:1px solid #800000; [/class] [div class=yeah][class=big] height:270px; width:120px; background:#B22222; float:left; [/class] [div class=big] [class=img] height:118px; width:98px; background:url('https://66.media.tumblr.com/738a270962ff0dc2580f72ffee621997/tumblr_inline_pjk1s77Tj71uvjxgr_250.gif'); background-size: 220%; background-position: -6vw -1vw; margin:auto; margin-top:10px; border:1px solid #fff; [/class] [class=img2] height:118px; width:98px; background:url('https://66.media.tumblr.com/7af1a5a48ee7ce7ff902ea6febbcd59b/tumblr_inline_pjgpo2AyUR1uvjxgr_250.gif'); background-size: 220%; background-position: -6vw -0.75vw; margin:auto; margin-top:10px; border:1px solid #fff; [/class] [div class=img][/div][div class=img2][/div] [/div][class=wrap] height:270px; width:221px; background:#CD5C5C; float:left; [/class] [div class=wrap] [class=title] height:40px; width:200px; background:#B22222; border-top:1px solid #fff; border-right:1px solid #fff; border-left:1px solid #fff; float:left; margin:10px 10px; [/class] [div class=title][div style="color:#CD5C5C;font-size:25px;font-family:'Times New Roman';float:left;margin-left:5px;line-height:40px;font-weight:800;"]resident ✦[/div][/div] [class=tabhold] height:8px; background:#CD5C5C; width:202px; float:left; margin-left:10px; margin-top:-10px; [/class] [div class=tabhold][class=tab1] height:8px; width:49px; border-right:1px solid #800000; float:left; cursor:pointer; [/class] [class name=tab1 state=hover] background:#B22222; color:#fff; transition:1s [/class] [class=tab2] height:8px; width:49px; border-right:1px solid #800000; float:left; cursor:pointer; [/class] [class name=tab2 state=hover] background:#B22222; color:#fff; transition:1s [/class] [class=tab3] height:8px; width:49px; border-right:1px solid #800000; float:left; cursor:pointer; [/class] [class name=tab3 state=hover] background:#B22222; color:#fff; transition:1s [/class] [class=tab4] height:8px; width:50px; float:left; cursor:pointer; [/class] [class name=tab4 state=hover] background:#B22222; color:#fff; transition:1s [/class] [div class=tab1][div style="color:#800000;font-size:7px;line-height:8px;font-weight:800;text-align:center;"]BASICS[/div][/div] [div class=tab2][div style="color:#800000;font-size:7px;line-height:8px;font-weight:800;text-align:center;"]APPEARANCE[/div][/div] [div class=tab3][div style="color:#800000;font-size:7px;line-height:8px;font-weight:800;text-align:center;"]PERSONA[/div][/div] [div class=tab4][div style="color:#800000;font-size:7px;line-height:8px;font-weight:800;text-align:center;"]STORY[/div][/div][/div] [script class=tab1 on=click] hide tabcontentbox hide tabcontent2 hide tabcontent3 hide tabcontent4 fadeIn 1000 tabcontent11 addClass Tabs [/script] [script class=tab2 on=click] hide tabcontentbox fadeIn 1000 tabcontent2 hide tabcontent3 hide tabcontent4 hide tabcontent11 addClass Tabs [/script] [script class=tab3 on=click] hide tabcontentbox hide tabcontent2 fadeIn 1000 tabcontent3 hide tabcontent4 hide tabcontent11 addClass Tabs [/script] [script class=tab4 on=click] hide tabcontentbox hide tabcontent2 hide tabcontent3 fadeIn 1000 tabcontent4 hide tabcontent11 addClass Tabs [/script] [class=tabcontent11] height:135px; width:200px; float:left; background:#B22222; border-bottom:1px solid #fff; border-right:1px solid #fff; border-left:1px solid #fff; margin-left:10px; margin-top:-2px; [/class] [class=tabcontent2] height:135px; width:200px; float:left; background:#B22222; border-bottom:1px solid #fff; border-right:1px solid #fff; border-left:1px solid #fff; margin-left:10px; margin-top:-2px; display:none; [/class] [class=tabcontent3] height:135px; width:200px; float:left; background:#B22222; border-bottom:1px solid #fff; border-right:1px solid #fff; border-left:1px solid #fff; margin-left:10px; margin-top:-2px; display:none [/class] [class=tabcontent4] height:135px; width:200px; float:left; background:#B22222; border-bottom:1px solid #fff; border-right:1px solid #fff; border-left:1px solid #fff; margin-left:10px; margin-top:-2px; display:none; [/class] [div class=tabcontent11][class=container1] width:200px; height:125px; margin:0px -0px; overflow:hidden; color:#fff; font-size:10px; font-family:Arial; text-align:justify; line-height:12px; [/class] [class=scrollbar1] width:105%; height:125px; float:left; margin:10px 10px; overflow-y:scroll; [/class] [class=textbox1]width:92%; [/class] [div class=container1][div class=scrollbar1][div class=textbox1]
NAME: marius conway

NICKNAME: mari, mare

AGE: 21

GENDER: male

SEXUALITY: heterosexual

ROLE: resident

POWER: n/a

[/div][/div] [/div][/div] [div class=tabcontent2] [div class=container1][div class=scrollbar1][div class=textbox1]
HEIGHT: six feet, two inches

FC: arón piper

DISTINGUISHING FEATURES: curly hair, devious smile

CLOTHING STYLE: tbd

[/div][/div] [/div][/div] [div class=tabcontent3] [div class=container1][div class=scrollbar1][div class=textbox1]
POS. TRAITS: clever, observant, social, truthful, surprisingly empathetic

NEG. TRAITS: egotistical, angry, reckless, stubborn, jealous

LIKES: bonfires, smoking, hiking, adventures, long car rides

DISLIKES: not being payed attention to, debating, coffee, manipulation

HOBBIES: helping out in the hospital, biking, swimming

[/div][/div] [/div][/div] [div class=tabcontent4] [div class=container1][div class=scrollbar1][div class=textbox1]
SHORT SUMMARY:

he bouta fuck shit up. that's it. [/div][/div][/div][/div] [class=lilimg] height:50px; width:200px; float:left; margin:10px 10px; background:url('https://ak5.picdn.net/shutterstock/videos/29501875/thumb/1.jpg'); background-size:100%; border:1px solid #fff; background-position:0px; [/class] [div class=lilimg][/div][/div][/div]

code by @pasta​