• When posting, please be aware that artistic nudity is still nudity and not allowed under RpNation rules. Please edit your pictures accordingly!

    Remember to credit artists when using work not your own.

Accepting Requests ๐œ๐จ๐ซ๐ง๐Ÿ๐ฅ๐จ๐ฐ๐ž๐ซ ๐›๐ฅ๐ฎ๐ž - kosc's things;

koschei.

(ใฃโ€™-โ€˜)โ•ฎ =อŸอŸอžอž ๐Ÿฆ† ๏พŒ๏พž๏ฝซ๏พ
[class name="cornflower" minWidth="800px"] width:80vw;height:600px;background:url(https://images2.imgbox.com/71/75/tqMS7axg_o.png);background-size:cover;background-position:right;display:flex;overflow:hidden [/class] [class name="cornflower" maxWidth="800px"] background:url(https://images2.imgbox.com/71/75/tqMS7axg_o.png);background-size:cover;background-position:right;display:flex;flex-wrap: wrap;justify-content:center [/class] [class name="cornflowerbox"] padding-top:130px;margin-left:7vw;transition:1.1s!important;[/class] [class name="hover"] border-radius:50%;border:1px solid white;width:55px;height:55px;text-align:center;padding:50px;color:white;line-height:55px;transition:0.5s;margin-top:-50px; [/class] [class name="tabbox" minWidth="1000px"] margin:150px 0 0 10vw; [/class] [class name="tabbox" maxWidth="1000px"] display:none [/class] [class name="mobilepls" minWidth="800px"]display:flex;width:200%[/class][class name="mobilepls" maxWidth="800px"][/class][class name="mobilebls" maxWidth="800px"]display:none[/class] [div class="cornflower"] [div class="change cornflowerbox"] [div style="position:relative;width:40vw;margin-left:4vw"] [div style="font-size:8vw;color:transparent;-webkit-text-stroke:1px white;opacity:0.3;line-height:4.9vw;position:absolute"]corn /
[div style="margin-left:10vw;"]/ flower[/div] [/div] [/div] [div style="overflow:hidden;margin:17vh 0 0 5vw;width:30vw;height:22vh;opacity:0.7;min-width:300px"][div class="mobilepls"] [div style="width:50%;height:22vh;overflow:hidden;transition:0.5s;margin-right:20px;min-width:300px!important" class="moveover"][div style="padding-right:100px;width:30vw;min-width:300px;height:100%;overflow:auto;font-size:12px;text-align:justify;color:white"]heyo all and welcome to this corner of the bbcode forums where i dump all my attempts at wrangling code. i'm koschei, lurker and (very occasionally) i code and write. coding's a fun hobby for me but geez i wish i knew what i was doing even 1% of the time (i.e codes are supposed to be mobile friendly but mostly they're just ???). please excuse my weird creations as i relearn this stuff again and again im afflicted with chronic dumbass syndrome

all of my codes here are free to use, take apart, change, idc really as long as you keep the credit in the corner (it's really small, i promise), i just really love seeing my codes used! please do mind the mess though haha, i never manage to keep anything neat, and if you have any questions/critiques/whatever please tell me![/div][/div] [div style="width:calc(50% - 20px);height:22vh;overflow:hidden;margin-right:20px" class="mobilebls"][div style="width:100%;padding-right:100px;height:100%;overflow:auto;font-size:12px;text-align:justify;color:white"]this is a sort of test run for requesting codes. i don't have any sort of formal template or rules or anything for these for now, just shoot me a pm with what you want.

please make sure your pm is as detailed as possible, including type of code (ic/character sheet/idk), color palette/overall theme, size of template, number of tabs/subsections (if any), anything you absolutely must have included, as much information as you can provide!

i'll accept requests that i feel confident completing, as i said, this is mostly a test run so apologies if things don't turn out perfect first time. if you want any edits made to the code just let me know and i'll get onto it! i'm fairly busy most of the time, so it might take a while for me to complete requests, so please, please be patient with me.

all codes will be free to use for everyone with credit to me, this is non-negotiable.[/div][/div] [/div][/div][/div] [div class="change tabbox"] [div class="hover about"]home[/div] [div class="hover comms"]request[/div] [div class="hover codes"]codes[/div] [/div] [div style="margin-left:50px;padding-top:50px;padding-bottom:50px;height:500px;overflow:hidden;width:300px" class="appear"] [div style="overflow-y:auto;overflow-x:hidden;padding-right:1000px;width:100%;height:500px;"] [div class="linkBox"] [div class="linkNum"]01[/div] [div class="linkTitle"]skylight[/div] [div class="linkDesc"]app template[/div] [/div] [div class="linkBox"] [div class="linkNum"]02[/div] [div class="linkTitle"]stands for secret[/div] [div class="linkDesc"]app template[/div] [/div] [div class="linkBox"] [div class="linkNum"]03[/div] [div class="linkTitle"]all's fair[/div] [div class="linkDesc"]app template[/div] [/div] [div class="linkBox"] [div class="linkNum"]04[/div] [div class="linkTitle"]name[/div] [div class="linkDesc"]description[/div] [/div] [div class="linkBox"] [div class="linkNum"]05[/div] [div class="linkTitle"]name[/div] [div class="linkDesc"]description[/div] [/div] [/div] [/div] [/div] [class name="hover" state="hover"] background:white; color:black!important; cursor:pointer [/class] [class name="width"] margin-left:50px!important;transition:0.5s; [/class] [class name="select"] background:white; color:black!important; cursor:pointer [/class] [class name="change"] transition:0.5s [/class] [class name="appear" minWidth="1000px"] transition:0.5s!important; transition-delay:0.7s; opacity:0 [/class] [class name="appear" maxWidth="1000px"] opacity:1; [/class] [class name="Opacity"] transition-delay:1s!important; opacity:1!important [/class] [class name="moving"] margin-left:-50% [/class] [script class="codes" on="click"] addClass width change addClass select codes removeClass select about addClass Opacity appear removeClass select comms [/script] [script class="comms" on="click"] removeClass select codes removeClass select about addClass select comms addClass moving moveover [/script] [script class="about" on="click"] removeClass width change removeClass select codes removeClass moving moveover removeClass select comms addClass select about removeClass Opacity appear [/script] [class name="linkBox"]transition:0.5s;margin-top:30px;width:fit-content[/class] [class name="linkBox" state="hover"]margin-left:20px[/class] [class name="linkNum"]font-size:50px!important;font-weight:bold!important;font-family:'Open Sans', sans serif!important;float:left;margin-right:5px;color:transparent;-webkit-text-stroke:1px white;[/class] [class name="linkTitle"]font:light 10px Open Sans!important;letter-spacing:1px!important;text-transform:uppercase;width:300px;padding-top:20px;color:white[/class] [class name="linkDesc"]font:lighter 10px Open Sans!important;width:300px;color:#fff!important;[/class]
 
Last edited:
[div class="aboutcontainer"] [div class="abouttext"] [div class="abouttitle"]skylight[/div] [div class="abouttagscont"] [div class="abouttags"]app template[/div] [div class="abouttags"]mobile friendly[/div] [div class="abouttags"]nobr[/div] [/div] [/div] [/div] [class name="aboutcontainer"]width:30%;padding:50px;min-width:200px;margin:auto;overflow:hidden;[/class][class name="abouttext"]padding:50px;background:#7C1B24;color:#fff!important;font-weight:bold;font-size:30px;border-radius:5px;transition:0.5s;margin-top:0%;width:calc(100% -50px);[/class][class name="abouttagscont"]min-width:200px;display:flex;flex-wrap:wrap;margin-top:-10px[/class][class name="abouttags"]color:#7C1B24;background:#fff;letter-spacing:1px;text-transform:uppercase;font-weight:100;font-size:10px;margin:2.5px;padding:5px;width:fit-content[/class][class name="abouttitle"]color:#fff!important;[/class]
[class name="majorContainer" minWidth="500px"] width:500px; background:#fff; margin:auto; border:1px solid #f1f1f1; padding:50px; --accent:#555 [/class] [class name="majorContainer" maxWidth="499px"] width:250px; background:#fff; margin:auto; border:1px solid #f1f1f1; padding:50px; --accent:#555 [/class] [class name="colorChange"] --accent:#9D0F0D [/class] [div class="majorContainer"] [div class="titleText"]ไนฐๆคŸ่ฟ˜็  [div class="quoteContainer"] [div style="font-size:10px"]i believe in love but love won't believe in me[/div] [/div] [/div] [div style="padding:10px;border:1px solid #f1f1f1"] [div class="imageHover"] [div class="goBack"]goiback[/div] [div class="flexright"] [div class="infobox"] [div class="pageContainers"] [div class="tabContainers"] [div class="tabStyle taba"]basics[/div] [div class="tabStyle tabb"]character[/div] [div class="tabStyle tabc"]extra[/div] [div class="goBackMobile"]goiback[/div] [/div] [div class="containerPages pageOne"] [div class="basicInfo"] [div class="basicInfoLabel"]name[/div] [div class="basicInfoText"]william shakespeare[/div] [/div] [div class="basicInfo"] [div class="basicInfoLabel"]n.name[/div] [div class="basicInfoText"]bill[/div] [/div] [div class="basicInfo"] [div class="basicInfoLabel"]age[/div] [div class="basicInfoText"]centuries[/div] [/div] [div class="basicInfo"] [div class="basicInfoLabel"]gender[/div] [div class="basicInfoText"]male [/div] [/div] [div class="basicInfo"] [div class="basicInfoLabel"]sexuality[/div] [div class="basicInfoText"]dunno[/div] [/div] [div class="basicInfo"] [div class="basicInfoLabel"]class[/div] [div class="basicInfoText"]varies[/div] [/div] [div class="basicInfo"] [div class="basicInfoLabel"]spare[/div] [div class="basicInfoText"]other info[/div] [/div] [/div] [div class="containerPages pageTwo"] [div class="personContainer"] [div style="padding:5px"] [div class="basicInfoLabel"]likes[/div] [/div] [div class="personFlex"] [div class="personWrap"] [div class="likeDislike"]#likes[/div] [div class="likeDislike"]here[/div] [div class="likeDislike"]#at[/div] [div class="likeDislike"]#least[/div] [div class="likeDislike"]#five[/div] [/div] [/div] [/div] [div class="personContainer"] [div style="padding:5px"] [div class="basicInfoLabel"]dislikes[/div] [/div] [div class="personFlex"] [div class="personWrap"] [div class="likeDislike"]#dislikes[/div] [div class="likeDislike"]here[/div] [div class="likeDislike"]#at[/div] [div class="likeDislike"]#least[/div] [div class="likeDislike"]#five[/div] [/div] [/div] [/div] [div class="personContainer"] [div class="traitLeftContainer"] [div class="traitName"]outgoing[/div] [div class="traitMeterOut"] [div class="traitMeter" style="width:95%;"][/div] [/div] [div class="traitName"]enthusiastic[/div] [div class="traitMeterOut"] [div class="traitMeter" style="width:50%;"][/div] [/div] [div class="traitName"]dedicated[/div] [div class="traitMeterOut"] [div class="traitMeter" style="width:45%;"][/div] [/div] [div class="traitName"]truthful[/div] [div class="traitMeterOut"] [div class="traitMeter" style="width:95%;"][/div] [/div] [div class="traitName"]observant[/div] [div class="traitMeterOut"] [div class="traitMeter" style="width:5%;"][/div] [/div] [div class="traitName"]protective[/div] [div class="traitMeterOut"] [div class="traitMeter" style="width:35%;"][/div] [/div] [/div] [div class="traitLeftContainer"] [div class="traitName"]forgetful[/div] [div class="traitMeterOut"] [div class="traitMeter" style="width:35%;"][/div] [/div] [div class="traitName"]brash[/div] [div class="traitMeterOut"] [div class="traitMeter" style="width:85%;"][/div] [/div] [div class="traitName"]incautious[/div] [div class="traitMeterOut"] [div class="traitMeter" style="width:45%;"][/div] [/div] [div class="traitName"]manipulative[/div] [div class="traitMeterOut"] [div class="traitMeter" style="width:65%;"][/div] [/div] [div class="traitName"]vindictive[/div] [div class="traitMeterOut"] [div class="traitMeter" style="width:58%;"][/div] [/div] [div class="traitName"]impatient[/div] [div class="traitMeterOut"] [div class="traitMeter" style="width:75%;"][/div] [/div] [/div] [/div] [/div] [div class="containerPages pageThree"] [div class="imgContainers"] [div class="imgBox"]
4KGy2SuU_o.jpg
[/div] [div class="imgBox"]
P0lUnEP7_o.jpg
[/div] [div class="imgBox"]
GXvJUkTt_o.jpg
[/div] [div class="imgBox"]
GiHS6BBT_o.png
[/div] [/div] [div class="oocBox"] @ooc name [/div] [div class="oocInfo"]pronouns, gmt +etc, discord[/div] [/div] [/div] [/div] [/div] [/div] [/div] [/div] [div style="max-width:500px;margin:auto;width:100%;font-size:8px;text-transform:uppercase;opacity:0.6;text-align:right"]cheers, lamb[/div] [class name="titleText" minWidth="500px"] font-size:5em; color:var(--accent); transition:1s; [/class] [class name="titleText" maxWidth="499px"] font-size:4em; color:var(--accent); transition:1s; [/class] [class name="quoteContainer" minWidth="500px"] margin-top:-0.9em; margin-left:3em; background:#fff; color:#555; text-transform:uppercase; position:absolute; z-index:1; letter-spacing:0.5px; padding:5px; [/class] [class name="quoteContainer" maxWidth="499px"] margin-top:-0.9em; background:#fff; color:#555; text-transform:uppercase; position:absolute; z-index:1; padding:5px; [/class] [class name="imageHover" minWidth="500px"] width:100%; height:300px; background:url(https://images2.imgbox.com/13/f6/zWjpZqlS_o.jpg); background-position:center; background-size:150%; transition:0.5s ease all; filter:grayscale(100%); overflow:hidden; display:flex; transition-duration:1s; cursor:crosshair; [/class] [class name="imageHover" maxWidth="499px"] width:100%; height:300px; background:url(https://images2.imgbox.com/13/f6/zWjpZqlS_o.jpg); background-position:center; background-size:cover; transition:0.5s ease all; filter:grayscale(100%); overflow:hidden; display:flex; transition-duration:1s; cursor:crosshair; [/class] [class name="goBack" minWidth="500px"] margin-left:calc(50% - 50px); color:#fff; text-transform:uppercase; font-size:10px; margin-top:285px; font-weight:bold; transition:1s; opacity:0; [/class] [class name="goBack" maxWidth="499px"] display:none [/class] [class name="goBackMobile" minWidth="500px"] display:none [/class] [class name="goBackMobile" maxWidth="499px"] color:#555; text-transform:uppercase; font-size:10px; font-weight:bold; transition:1s; opacity:1; padding:5px; cursor:pointer; [/class] [class name="flexright" minWidth="500px"] width:250px; height:100%; transition-duration:1s; margin-left:calc(50% + 10px); [/class] [class name="flexright" maxWidth="499px"] width:250px; height:100%; transition-duration:1s; margin-left:100%; [/class] [class="infobox"] width:250px; height:100%; background:#fff; overflow:hidden; cursor:auto; [/class] [class name="pageContainers"] width:calc(100% - 25px); padding:0px 0px 0px 10px; height:100%; overflow:hidden; [/class] [class name="containerPages"] font-size:11px; text-align:justify; color:#555; height:265px; overflow:auto; width:220px; padding-right:17px; padding-left:3px; [/class] [class name="tabContainers"] display:flex; margin-bottom:7px; height:22px; [/class] [class name="tabStyle"] font-size:10px; text-transform:uppercase; color:#555; font-weight:bold; padding:5px; transition:0.1s; cursor:pointer; [/class] [class name="basicInfo"] padding:6px; border:1px solid #f1f1f1; display:flex; justify-content:space-between; margin-bottom:5px; [/class] [class name="basicInfoLabel"] font-size:9.5px; text-transform:uppercase; color:#fff; font-weight:bold; padding:2px 5px 2px 5px; background:var(--accent); [/class] [class name="basicInfoText"] font-size:11px; color:#555; [/class] [class name="personContainer"] display:flex; width:100%; font-size:9.5px; margin-top:5px; [/class] [class name="personFlex"] width:100px; flex-grow:1; padding:5px; [/class] [class name="personWrap"] display:flex; flex-wrap:wrap; width:100%; [/class] [class name="traitLeftContainer"] width:calc(50% - 15px); margin:5px; [/class] [class name="traitName"] text-transform:uppercase; font-weight:bold; margin-bottom:-5px; color:#000; [/class] [class name="traitMeterOut"] border:1px solid var(--accent); width:100%; height:5px; border-radius:5px; padding:1px; margin-bottom:5px; [/class] [class name="traitMeter"] background:var(--accent); height:5px; [/class] [class name="likeDislike"] background-color:#eeeeee; color:#555; text-transform:uppercase; width:fit-content; padding:2px 5px 2px 5px; border-radius:5px; margin:1px; [/class] [class name="imgContainers"] display:flex; width:223px; flex-wrap:wrap; pointer-events:none; justify-content:space-between; [/class] [class name="imgBox"] border:5px solid #fff; box-shadow:1px 1px #ddd; width:100px; height:100px; filter:saturate(200%); [/class] [class name="oocBox"] width:100%; padding-right:10px; border-top:3px solid var(--accent); margin-top:3px; text-align:right; text-transform:uppercase; color:#555; font-size:15px; font-weight:bold; [/class] [class name="oocInfo"] width:100%; text-align:right; [/class] [class name="animate" minWidth="500px"] animation-name:{post_id}imageAnimate; animation-duration: 2s; animation-fill-mode: forwards; [/class] [class name="animate" maxWidth="499px"] animation-name:{post_id}mobileAnimate; animation-duration: 2s; animation-fill-mode: forwards; [/class] [class name="backAnimate" minWidth="500px"] animation-name:{post_id}postAnimate; animation-duration: 2s; animation-fill-mode: forwards; [/class] [class name="backAnimate" maxWidth="499px"] animation-name:{post_id}postMobile; animation-duration: 2s; animation-fill-mode: forwards; [/class] [class name="movers" minWidth="500px"] margin-left:calc(0% + 5px); transition-delay:1s; [/class] [class name="movers" maxWidth="499px"] margin-left:calc(0% - 10px); transition-delay:1s; [/class] [class name="opacityChange"] opacity:1; transition-delay:2s; cursor: pointer; [/class] [script class="imageHover" on="mouseenter"] addClass animate imageHover removeClass backAnimate imageHover addClass movers flexright addClass opacityChange goBack addClass colorChange majorContainer [/script] [script class="goBack" on="click"] removeClass animate imageHover addClass backAnimate imageHover removeClass movers flexright removeClass opacityChange goBack removeClass colorChange majorContainer [/script] [script class="goBackMobile" on="click"] removeClass animate imageHover addClass backAnimate imageHover removeClass movers flexright removeClass opacityChange goBack removeClass colorChange majorContainer [/script] [script class="containerPages"] hide containerPages show pageOne removeClass tabSelect tabStyle addClass tabSelect taba [/script] [class name="tabSelect"] border-bottom:2px solid var(--accent); margin-left:0px; [/class] [script class="taba" on="click"] hide containerPages show pageOne removeClass tabSelect tabStyle addClass tabSelect taba [/script] [script class="tabb" on="click"] hide containerPages show pageTwo removeClass tabSelect tabStyle addClass tabSelect tabb [/script] [script class="tabc" on="click"] hide containerPages show pageThree removeClass tabSelect tabStyle addClass tabSelect tabc [/script] [animation=imageAnimate] [keyframe=50] background-size:130%;filter:grayscale(0%);background-position:center; [/keyframe] [keyframe=100] background-size:130%;filter:grayscale(0%);background-position:center right; [/keyframe] [/animation] [animation=postAnimate] [keyframe=0] background-size:130%;filter:grayscale(0%);background-position:center right; [/keyframe] [keyframe=50] background-size:130%;filter:grayscale(0%);background-position:center; [/keyframe] [keyframe=100] background-size:150%;filter:grayscale(100%);background-position:center; [/keyframe] [/animation] [animation=mobileAnimate] [keyframe=50] filter:grayscale(0%);background-position:center; [/keyframe] [keyframe=100] filter:grayscale(0%);background-position:center right; [/keyframe] [/animation] [animation=postMobile] [keyframe=0] filter:grayscale(0%);background-position:center right; [/keyframe] [keyframe=50] filter:grayscale(0%);background-position:center; [/keyframe] [keyframe=100] filter:grayscale(100%);background-position:center; [/keyframe] [/animation]
 
Last edited:
[div class="aboutcontainer"] [div class="abouttext"] [div class="abouttitle"]s stands for secret[/div] [div class="abouttagscont"] [div class="abouttags"]app template[/div] [div class="abouttags"]mobile friendly[/div] [div class="abouttags"]nobr[/div] [/div] [/div] [/div] [class name="aboutcontainer"]width:30%;padding:50px;min-width:200px;margin:auto;overflow:hidden;[/class][class name="abouttext"]padding:50px;background:#7C1B24;color:#fff!important;font-weight:bold;font-size:30px;border-radius:5px;transition:0.5s;margin-top:0%;width:calc(100% -50px);[/class][class name="abouttagscont"]min-width:200px;display:flex;flex-wrap:wrap;margin-top:-10px[/class][class name="abouttags"]color:#7C1B24;background:#fff;letter-spacing:1px;text-transform:uppercase;font-weight:100;font-size:10px;margin:2.5px;padding:5px;width:fit-content[/class][class name="abouttitle"]color:#fff!important;[/class]
[div class="majorContainer"] [div class="fileGridSize"] [div class="fileTitle"] character file #001 [/div] [div class="fileQuote"] one quick line of quote here [/div] [/div] [div class="infoGridOne"] [div class="infoBoxLeft"] [div class="infoHeight"] [div class="infoNumber"]01[/div] [div class="infoTitle"]name[/div] [div class="infoField"]cecile lalond[/div] [/div] [/div] [div class="infoBoxLeft"] [div class="infoHeight"] [div class="infoNumber"]02[/div] [div class="infoTitle"]age[/div] [div class="infoField"]here[/div] [/div] [/div] [div class="infoBoxLeft"] [div class="infoHeight"] [div class="infoNumber"]03[/div] [div class="infoTitle"]gender[/div] [div class="infoField"]here[/div] [/div] [/div] [div class="infoBoxLeft"] [div class="infoHeight"] [div class="infoNumber"]04[/div] [div class="infoTitle"]sexuality[/div] [div class="infoField"]here[/div] [/div] [/div] [/div] [div class="infoGridTwo"] [div class="infoBoxRight"] [div class="infoHeight"] [div class="infoNumber"]05[/div] [div class="infoTitle"]occupation[/div] [div class="infoField"]cecile lalond[/div] [/div] [/div] [div class="infoBoxRight"] [div class="infoHeight"] [div class="infoNumber"]06[/div] [div class="infoTitle"]height[/div] [div class="infoField"]here[/div] [/div] [/div] [div class="infoBoxRight"] [div class="infoHeight"] [div class="infoNumber"]07[/div] [div class="infoTitle"]weight[/div] [div class="infoField"]here[/div] [/div] [/div] [div class="infoBoxRight"] [div class="infoHeight"] [div class="infoNumber"]08[/div] [div class="infoTitle"]sexuality[/div] [div class="infoField"]here[/div] [/div] [/div] [/div] [div class="aestheticGrid"] [div class="aestheticImage"]
qmvBXuN.png
[/div] [div class="aestheticImage"]
97Q5bGH.png
[/div] [div class="aestheticImage"]
9dSwbqS.png
[/div] [div class="aestheticImage"]
CFPPvwX.png
[/div] [/div] [div class="characterGrid"] [div class="characterImage"]
Dq9iRbx.png
[/div] [/div] [div class="overviewGrid"] [div class="overviewContainer"] [div class="overviewScroll"] Turtle merry nutria as less amongst gosh jeepers salmon thanks frog a porpoise beneath much combed caribou ouch so hypnotic therefore.Wherever alas dear stupid snapped groundhog fetching more as flailed meekly petulantly far bet concentrically slick pious merrily less much from far gosh together including much hello silently until well amoral since. [/div] [/div] [/div] [div class="personalityColumn"] [div class="textContainer"] [div class="textTitle"]personality[/div] [div class="textNoscroll"] [div class="textScroll"] Turtle merry nutria as less amongst gosh jeepers salmon thanks frog a porpoise beneath much combed caribou ouch so hypnotic therefore. Wherever alas dear stupid snapped groundhog fetching more as flailed meekly petulantly far bet concentrically slick pious merrily less much from far gosh together including much hello silently until well amoral since. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. [/div] [/div] [/div] [/div] [div class="dividerGrid"] [div class="dividerImage"]
rBhA7IYd_o.png
[/div] [/div] [div class="historyColumn"] [div class="textContainer"] [div class="textTitle"]history[/div] [div class="textNoscroll"] [div class="textScroll"] Turtle merry nutria as less amongst gosh jeepers salmon thanks frog a porpoise beneath much combed caribou ouch so hypnotic therefore. Wherever alas dear stupid snapped groundhog fetching more as flailed meekly petulantly far bet concentrically slick pious merrily less much from far gosh together including much hello silently until well amoral since. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. [/div] [/div] [/div] [/div] [/div] [class name="majorContainer" minWidth="900px"] width:750px; height:505px; padding:25px; margin:5px auto; border:0.1px solid #f1f1f1; display:grid; grid-gap:5px; grid-template-columns: 120px 120px 120px 120px 120px 120px; grid-template-rows: 120px 120px 120px 120px [/class] [class name="majorContainer"] --accent:#864052 [/class] [class name="majorContainer" maxWidth="900px"] width:245px; height:1245px; padding:25px; margin:5px auto; border:0.1px solid #f1f1f1; display:grid; grid-gap:5px; grid-template-columns: 120px 120px; grid-template-rows: 120px 120px 120px 120px 120px 120px 120px 120px 120px 120px; [/class] [class name="fileGridSize" minWidth="900px"] grid-column: 1 / span 3; grid-row: 1 / 1; [/class] [class name="fileGridSize" maxWidth="900px"] grid-column: 1 / span 2; grid-row: 1 / 1; [/class] [class name="fileTitle"] border:0.1px solid #f1f1f1; border-bottom:0px; padding:40px 50px 37px 50px; font-size:10px; font-weight:150; text-transform:uppercase; letter-spacing:1px; height:calc(1.3em - 0.2px) [/class] [class name="fileQuote"] border-left:0.1px solid var(--accent); border-right:0.1px solid var(--accent); padding:10px; background:var(--accent); font-size:8px; font-weight:150; text-transform:uppercase; color:#fff; letter-spacing:1px; height:1.3em; [/class] [class name="infoGridOne" minWidth="900px"] grid-column: 4 / span 1; grid-row: 1 / 3; [/class] [class name="infoGridTwo" minWidth="900px"] grid-column: 5 / span 1; grid-row: 1 / 3; [/class] [class name="infoGridOne" maxWidth="900px"] grid-column: 1 / span 1; grid-row: 3 / span 2; [/class] [class name="infoGridTwo" maxWidth="900px"] grid-column: 2 / span 1; grid-row: 3 / span 2; [/class] [class name="infoBoxLeft"] width:100px; padding:10px 5px 10px 15px; [/class] [class name="infoHeight"] height:40px [/class] [class name="infoNumber"] color:var(--accent); font-family:serif; font-size:20px; font-weight:bold; float:left; margin-right:5px; [/class] [class name="infoTitle"] font-weight:bold; font-size:10px; text-transform:uppercase; padding-top:2px; [/class] [class name="infoField"] font-size:10px; text-transform:uppercase; [/class] [class name="infoBoxRight"] width:100px; padding:10px 15px 10px 5px; [/class] [class name="aestheticGrid" minWidth="900px"] grid-column: 6 / span 1; grid-row: 1 / 5; border:0.1px solid #f1f1f1; [/class] [class name="aestheticGrid" maxWidth="900px"] grid-column: 1 / span 2; grid-row: 9 / span 2; border:0.1px solid #f1f1f1; display:flex; flex-wrap:wrap; justify-content:space-evenly; [/class] [class name="aestheticImage" minWidth="900px"] margin:35px 20px 30px 20px; padding:10px; pointer-events:none; width:60px; height:60px; border:0.1px solid #f1f1f1; [/class] [class name="aestheticImage" maxWidth="900px"] margin:20px; padding:10px; pointer-events:none; width:60px; height:60px; border:0.1px solid #f1f1f1; [/class] [class name="characterGrid"] grid-column: 1 / span 1;grid-row: 2 / span 1; border:0.1px solid #f1f1f1; [/class] [class name="characterImage"] padding:20px; pointer-events:none; width:80px; height:80px [/class] [class name="overviewGrid" minWidth="900px"] grid-column: 2 / span 2; grid-row: 2 / 2; border:0.1px solid #f1f1f1; [/class] [class name="overviewGrid" maxWidth="900px"] grid-column: 2 / span 1; grid-row: 2 / 2; border:0.1px solid #f1f1f1; [/class] [class name="overviewContainer"] width:calc(100% - 50px); height:calc(100% - 50px); margin:15px; padding:10px; border:0.1px solid #f1f1f1; overflow:hidden; [/class] [class name="overviewScroll"] font-size:11px; width:calc(100% + 17px); height:100%; overflow:auto; padding-right:100px; text-align:justify; [/class] [class name="personalityColumn" minWidth="900px"] grid-column: 1 / span 2; grid-row: 3 / span 2; [/class] [class name="historyColumn" minWidth="900px"] grid-column: 4 / span 2; grid-row: 3 / span 2; [/class] [class name="personalityColumn" maxWidth="900px"] grid-column: 1 / span 2; grid-row: 5 / span 2; [/class] [class name="historyColumn" maxWidth="900px"] grid-column: 1 / span 2; grid-row: 7 / span 2; [/class] [class name="textContainer" minWidth="900px"] width:200px; border:0.1px solid #f1f1f1; padding:20px; height:205px [/class] [class name="textTitle" minWidth="900px"] color:var(--accent); font-family:serif; font-size:25px; font-weight:bold; margin-left:5px; margin-top:-10px; [/class] [class name="textNoscroll" minWidth="900px"] width:180px; border:0.1px solid #f1f1f1; padding:10px; margin-top:-15px; height:175px; overflow:hidden; [/class] [class name="textScroll" minWidth="900px"] width:197px; height:175px; overflow:auto; font-size:11px; padding-right:100px; text-align:justify; [/class] [class name="textContainer" maxWidth="900px"] width:205px; border:0.1px solid #f1f1f1; padding:20px; height:205px [/class] [class name="textTitle" maxWidth="900px"] color:var(--accent); font-family:serif; font-size:25px; font-weight:bold; margin-left:5px; margin-top:-10px; [/class] [class name="textNoscroll" maxWidth="900px"] width:185px; border:0.1px solid #f1f1f1; padding:10px; margin-top:-15px; height:175px; overflow:hidden; [/class] [class name="textScroll" maxWidth="900px"] width:202px; height:175px; overflow:auto; font-size:11px; padding-right:100px; text-align:justify; [/class] [class name="dividerGrid" minWidth="900px"] grid-column: 3 / span 1; grid-row:3 / span 2; border:0.1px solid #f1f1f1; [/class] [class name="dividerGrid" maxWidth="900px"] display:none [/class] [class name="dividerImage"] margin:10px; padding:10px; pointer-events:none; width:80px; height:205px; filter:brightness(120%); [/class]
 
Last edited:
[div class="aboutcontainer"] [div class="abouttext"] [div class="abouttitle"]all's fair[/div] [div class="abouttagscont"] [div class="abouttags"]app template[/div] [div class="abouttags"]mobile compatible[/div] [div class="abouttags"]nobr[/div] [/div] [/div] [/div] [class name="aboutcontainer"]width:30%;padding:50px;min-width:200px;margin:auto;overflow:hidden;[/class][class name="abouttext"]padding:50px;background:#7C1B24;color:#fff!important;font-weight:bold;font-size:30px;border-radius:5px;transition:0.5s;margin-top:0%;width:calc(100% -50px);[/class][class name="abouttagscont"]min-width:200px;display:flex;flex-wrap:wrap;margin-top:-10px[/class][class name="abouttags"]color:#7C1B24;background:#fff;letter-spacing:1px;text-transform:uppercase;font-weight:100;font-size:10px;margin:2.5px;padding:5px;width:fit-content[/class][class name="abouttitle"]color:#fff!important;[/class]


mitchelle springsmitchelle springs [class name="loveContainerMajor"] --accent: #aecc42 [/class] [div class="loveContainerMajor"] [div class="loveImageContainer"] [div class="loveMainImage" style="background:url(https://images2.imgbox.com/5b/8e/5Cfj373b_o.png)"][/div] [/div] [div class="loveRightContainer"] [div class="loveTitleContainer"] [div class="loveStudentProfile"]Student profile[/div] [div class="loveStudentName"]mitchelle springs[/div] [/div] [div class="loveTabbedcontent"] [div class="lovePageContainer"] [div class="lovePage pageOne"] [div class="loveInfoBox"] [div class="loveInfoTitle"]nickname[/div] [div class="loveInfoText"]mitch[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]age[/div] [div class="loveInfoText"]sixteen[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]grade[/div] [div class="loveInfoText"]eleventy nine[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]gender[/div] [div class="loveInfoText"]female [/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]sexuality[/div] [div class="loveInfoText"]lgbt speedrun[/div] [/div] [div class="pageOneFlex"] [div class="pageOneList"]
  • five
  • positive
  • personality traits
  • or
  • likes
[/div] [div class="pageOneList"]
  • five
  • negative
  • personality traits
  • or
  • dislikes
[/div] [/div] [/div] [div class="lovePage pageTwo"] [div class="pageTwoText"] Freeform character application. use
[div class="loveHeader"]text here[/div]​

for headers, and
[div class="loveSubheader"]text here[/div]​

for subheaders, as well as br tags for paragraph breaks. although freeform, please write at least 500 words, encompassing a little about history as well as personality!
[div class="loveHeader"]header example[/div] [div class="loveSubheader"]subheader example[/div] Turtle merry nutria as less amongst gosh jeepers salmon thanks frog a porpoise beneath much combed caribou ouch so hypnotic therefore.

Wherever alas dear stupid snapped groundhog fetching more as flailed meekly petulantly far bet concentrically slick pious merrily less much from far gosh together including much hello silently until well amoral since.

The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst.

One far far congratulated hence blushed goldfish frowned emu crab much chameleon handsome bluebird wolf heron pitifully and between imminently underwrote then beyond that. [/div] [/div] [div class="lovePage pageThree"] [div class="loveInfoBox"] [div class="loveInfoTitle"]height[/div] [div class="loveInfoText"]inch/cm[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]weight[/div] [div class="loveInfoText"]kg/lb[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]figure[/div] [div class="loveInfoText"]go figure[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]markings[/div] [div class="loveInfoText"]earrings, tattoos, etc[/div] [/div] [div class="pageThreeContainer"] [div class="pageThreeTab friends"]friends[/div] [div class="pageThreeTab foes"]foes[/div] [div class="pageThreeTab lovers"]lovers[/div] [div class="pageThreeTab others"]others[/div] [/div] [div class="pageThreeSelect"][/div] [div class="pageThreePage friendsPage"] [div class="pageThreeText"] Turtle merry nutria as less amongst gosh jeepers salmon thanks frog a porpoise beneath much combed caribou ouch so hypnotic therefore. Wherever alas dear stupid snapped groundhog fetching more as flailed meekly petulantly far bet concentrically slick pious merrily less much from far gosh together including much hello silently until well amoral since. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. [/div] [div class="pageThreeText"] [div class="pageThreeTitle"]friend #1[/div] Turtle merry nutria as less amongst gosh jeepers salmon thanks frog a porpoise beneath much combed caribou ouch so hypnotic therefore. Wherever alas dear stupid snapped groundhog fetching more as flailed meekly petulantly far bet concentrically slick pious merrily less much from far gosh together including much hello silently until well amoral since. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. [/div] [/div] [div class="pageThreePage foesPage"] [div class="pageThreeText"] Turtle merry nutria as less amongst gosh jeepers salmon thanks frog a porpoise beneath much combed caribou ouch so hypnotic therefore. Wherever alas dear stupid snapped groundhog fetching more as flailed meekly petulantly far bet concentrically slick pious merrily less much from far gosh together including much hello silently until well amoral since. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. [/div] [div class="pageThreeText"] [div class="pageThreeTitle"]foe #1[/div] Turtle merry nutria as less amongst gosh jeepers salmon thanks frog a porpoise beneath much combed caribou ouch so hypnotic therefore. Wherever alas dear stupid snapped groundhog fetching more as flailed meekly petulantly far bet concentrically slick pious merrily less much from far gosh together including much hello silently until well amoral since. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. [/div] [/div] [div class="pageThreePage loversPage"] [div class="pageThreeText"] Turtle merry nutria as less amongst gosh jeepers salmon thanks frog a porpoise beneath much combed caribou ouch so hypnotic therefore. Wherever alas dear stupid snapped groundhog fetching more as flailed meekly petulantly far bet concentrically slick pious merrily less much from far gosh together including much hello silently until well amoral since. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. [/div] [div class="pageThreeText"] [div class="pageThreeTitle"]love #1[/div] Turtle merry nutria as less amongst gosh jeepers salmon thanks frog a porpoise beneath much combed caribou ouch so hypnotic therefore. Wherever alas dear stupid snapped groundhog fetching more as flailed meekly petulantly far bet concentrically slick pious merrily less much from far gosh together including much hello silently until well amoral since. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. [/div] [/div] [div class="pageThreePage othersPage"] [div class="pageThreeText"] Turtle merry nutria as less amongst gosh jeepers salmon thanks frog a porpoise beneath much combed caribou ouch so hypnotic therefore. Wherever alas dear stupid snapped groundhog fetching more as flailed meekly petulantly far bet concentrically slick pious merrily less much from far gosh together including much hello silently until well amoral since. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. [/div] [div class="pageThreeText"] [div class="pageThreeTitle"]other #1[/div] Turtle merry nutria as less amongst gosh jeepers salmon thanks frog a porpoise beneath much combed caribou ouch so hypnotic therefore. Wherever alas dear stupid snapped groundhog fetching more as flailed meekly petulantly far bet concentrically slick pious merrily less much from far gosh together including much hello silently until well amoral since. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. The and wove yet considering across following the darn more snootily despite hello ate seagull jeepers whale hugely a grumbled wherever and panda that well amongst. [/div] [/div] [/div] [div class="lovePage pageFour"] [div class="pageFourFlex"] [div class="pageFourInfo"] [div class="loveInfoBox"] [div class="loveInfoTitle"]hobbies[/div] [div class="loveInfoText"]fly fishing[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]fav. color[/div] [div class="loveInfoText"]octarine[/div] [/div] [div class="loveInfoBox"] [div class="loveInfoTitle"]family[/div] [div class="loveInfoText"]playable only[/div] [/div] [/div] [div class="loveMusicContainer"] [div class="loveMusicSquare"] [div class="loveMusicSymbol"][/div] [/div] [div class="loveMusicBox"] [div class="loveMusicHide"] [/div] [/div] [/div] [/div] [div class="pageFourLeft"][/div] [div class="pageFourQuote"] I want my father back, you son of a bitch!
max two line quote [/div] [div class="pageFourRight"][/div] [div class="pageFourImages"] [div class=" pageFourImage " style="background:url(https://78.media.tumblr.com/812863ac1ba04949356a3f2194cc834f/tumblr_o7sw5yTsFk1ug2laoo4_r2_250.gif)"][/div] [div class=" pageFourImage " style="background:url(https://image.ibb.co/mxQHiF/62.jpg)"][/div] [div class=" pageFourImage " style="background:url(https://78.media.tumblr.com/f5f714cbd75054e5b9934c80d3809646/tumblr_inline_p0li81kQvH1v0ahz0_540.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; [/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:10px; [/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:center; 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; margin-top:20px ; [/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 [/class] [class name="pageFourImage" minWidth="820px"] width:100px; height:100px; background-size:100px!important; 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] [script class="loveMusicHide"] set onPlay 0 [/script] [script class="loveMusicBox" on="mouseenter"] inc onPlay if (eq ${onPlay} 1) (addClass pause loveMusicSymbol) if (eq ${onPlay} 2) (set onPlay 0) if (eq ${onPlay} 0) (removeClass pause loveMusicSymbol) [/script] [script class="loveMusicBox" on="mouseleave"] inc onPlay if (eq ${onPlay} 1) (addClass pause loveMusicSymbol) if (eq ${onPlay} 2) (set onPlay 0) if (eq ${onPlay} 0) (removeClass pause loveMusicSymbol) [/script] [script class="friends"] addClass tabSelect foes addClass tabSelect lovers addClass tabSelect others show friendsPage [/script] [script class="friends" on="click"] removeClass tabSelect friends addClass tabSelect foes addClass tabSelect lovers addClass tabSelect others removeClass selectedTwo pageThreeSelect removeClass selectedThree pageThreeSelect removeClass selectedFour pageThreeSelect hide pageThreePage show friendsPage [/script] [script class="foes" on="click"] addClass tabSelect friends removeClass tabSelect foes addClass tabSelect lovers addClass tabSelect others addClass selectedTwo pageThreeSelect removeClass selectedThree pageThreeSelect removeClass selectedFour pageThreeSelect hide pageThreePage show foesPage [/script] [script class="lovers" on="click"] addClass tabSelect friends addClass tabSelect foes removeClass tabSelect lovers addClass tabSelect others removeClass selectedTwo pageThreeSelect addClass selectedThree pageThreeSelect removeClass selectedFour pageThreeSelect hide pageThreePage show loversPage [/script] [script class="others" on="click"] addClass tabSelect friends addClass tabSelect foes addClass tabSelect lovers removeClass tabSelect others removeClass selectedTwo pageThreeSelect removeClass selectedThree pageThreeSelect addClass selectedFour pageThreeSelect hide pageThreePage show othersPage [/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]
 
Last edited:
I love how interactive this template is! It's so prettyy โ™ฅ โ™ฅ Would it be alright if I used it? I know you said these are your freebies, but I like to ask anyways..
 
[div style="max-Width:500px;margin:auto;font-size:12px;"] Asuhra Asuhra ahh thank you so much for your praise! yes, feel free to use any of my templates wherever you like, I don't mind![/div]
 
oof all of your codes are super gorgeous! i hope you continue to code, and have fun doing it ๐Ÿ’•
 
These are some of the best coding through xenforo I have seen in the last like half decade...
 

Users who are viewing this thread

Back
Top