What's new
  • This section is for roleplays only.
    ALL interest checks/recruiting threads must go in the Recruit Here section.

    Please remember to credit artists when using works not your own.

Fandom Order of the Thestrals CS

Main
Here

Nornslayer

sugar is my wife and gold is best child
INFO: only post here if you have been approved in the discord

Code:
[comment]
[font=Oswald]title[/font]
[font=Montserrat]subtitles & headings[/font]
[font=Roboto]body[/font]
[/comment][border=none; padding: 0px;

--accent: #d13f3f;
--bg: #111;
--header: #000;
--color: #ddd;
--unselected: #444;
--credit: #fff;

--title: Oswald;
--heading: Montserrat;
--body: Roboto;

--img1: url(https://i.stack.imgur.com/y9DpT.jpg);
--img2: url(https://i.stack.imgur.com/y9DpT.jpg);
--img3: url(https://i.stack.imgur.com/y9DpT.jpg);
--img4: url(https://i.stack.imgur.com/y9DpT.jpg);

max-width: 700px; margin: auto; font-smoothing: antialiased; -webkit-font-smoothing: antialiased; font-family: var(--body); color: var(--color); font-size: 12px;][border=none; padding: 0px; position: relative; background: var(--bg);][border=none; padding: 0px; display: flex; flex-direction: row;  justify-content: center; flex-wrap: wrap; padding: 10px;][comment]

------character name and role ------[/comment][border=none; padding: 0px; margin: 10px; width: 500px; height: 100px; background: var(--bg); flex-grow: 1; line-height: 20px; box-sizing: border-box;][border=none; padding: 0px; font-size: 40px; font-family: var(--title); text-transform: uppercase; color: var(--accent); margin-top: 25px;]character name[/border][border=none; padding: 0px; text-transform: uppercase; font-family: var(--heading);  font-size: 13px; letter-spacing: 3px; font-weight: bold; margin-top: 20px; padding-left: 5px;]the role name[/border][/border][comment]

------tabs start here------[/comment][border=none; padding: 0px; margin: 10px; width: 140px; flex-grow: 1;][border=none; padding: 0px; height: 70px; max-width: 255px; overflow: hidden; margin: auto; margin-top: 15px;][border=none; padding: 0px; margin: auto; margin: -7px 0px 0px 0px; letter-spacing: -10px; line-height: 40px;][tabs][comment]



-----first tab------[/comment][tab=.][border=none; padding: 0px; position: absolute; bottom: 0; left:0; right: 0; top: 0;  letter-spacing: 0px; line-height: 20px; pointer-events: none;][border=none; padding: 0px; display: flex; flex-direction: row; justify-content: center; flex-wrap: wrap; padding: 10px;][comment]

-----filler (ignore)-----[/comment][border=none; padding: 0px; margin: 10px; width: 500px; height: 100px; flex-grow: 1;][/border][comment]

-------tab buttons-----[/comment][border=none; padding: 0px; margin: 10px; width: 140px; flex-grow: 1; background: var(--bg);][border=none; padding: 0px; height: 90px; margin-top: -5px;box-sizing: border-box; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center;][comment]
-------button one------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--accent); border: 1px solid var(--accent); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]i[/border][comment]
-------button two------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--unselected); border: 1px solid var(--unselected); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]ii[/border][comment]
-------button three------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--unselected); border: 1px solid var(--unselected); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]iii[/border][comment]
-------button four------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--unselected); border: 1px solid var(--unselected); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]iv[/border][comment]
-----end of buttons------[/comment][/border][/border][comment]

---------end of the header-------[/comment][/border][comment]


------beginning of main content area------[/comment][border=none; padding: 0px; display: flex; flex-direction: row; flex-wrap: wrap; background: var(--bg); padding: 10px; box-sizing: border-box; border-top: 1px solid #333;][comment]

-------first image-------[/comment][border=none; padding: 0px; margin: 10px; width: 230px; height: 399px; background: var(--img1); background-size: cover; background-position: 50% 0%; flex-grow: 1;][/border][comment]

-------right side-------[/comment][border=none; padding: 0px; width: 430px; height: 419px; background: var(--bg); flex-grow: 1; pointer-events: auto;][border=none; padding: 0px; box-sizing: border-box; width: 100%; height: 419px; overflow: hidden;][border=none; padding: 0px; height: 100%; width: 200%; overflow-y: auto;][border=none; padding: 0px; height: auto; width: 50%; box-sizing: border-box; text-align: justify; line-height: 22px;][comment]


-----------full name------[/comment][border=none; padding: 0px; margin: 10px; height: 63.8px; display: flex; flex-direction: column; justify-content: space-evenly; box-sizing: border-box; border: 1px solid var(--unselected); padding: 15px;][border=none; padding: 0px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; font-size: 13px;]full name[/border] full name comes here[/border][comment]

-----------nicknames------[/comment][border=none; padding: 0px; margin: 10px; margin-top: 20px; height: 63.8px; display: flex; flex-direction: column; justify-content: space-evenly; box-sizing: border-box; border: 1px solid var(--unselected); padding: 15px;][border=none; padding: 0px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; font-size: 13px;]nicknames[/border] nicknames come here[/border][comment]

--------age--------[/comment][border=none; padding: 0px; display: flex; flex-direction: row; flex-wrap: wrap;][border=none; padding: 0px; width: 195px; margin: 10px; height: 63.8px; display: flex; flex-direction: column; justify-content: space-evenly; box-sizing: border-box; border: 1px solid var(--unselected); padding: 15px; flex-grow: 1;][border=none; padding: 0px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; font-size: 13px;]age[/border] age comes here[/border][comment]

--------date of birth--------[/comment][border=none; padding: 0px; width: 195px; margin: 10px; height: 63.8px; display: flex; flex-direction: column; justify-content: space-evenly; box-sizing: border-box; border: 1px solid var(--unselected); padding: 15px; flex-grow: 1;][border=none; padding: 0px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; font-size: 13px;]date of birth[/border] date of birth comes here[/border][/border][comment]

--------gender--------[/comment][border=none; padding: 0px; display: flex; flex-direction: row; flex-wrap: wrap;][border=none; padding: 0px; width: 195px; margin: 10px; height: 63.8px; display: flex; flex-direction: column; justify-content: space-evenly; box-sizing: border-box; border: 1px solid var(--unselected); padding: 15px; flex-grow: 1;][border=none; padding: 0px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; font-size: 13px;]gender[/border] gender comes here[/border][comment]

--------sexuality--------[/comment][border=none; padding: 0px; width: 195px; margin: 10px; height: 63.8px; display: flex; flex-direction: column; justify-content: space-evenly; box-sizing: border-box; border: 1px solid var(--unselected); padding: 15px; flex-grow: 1;][border=none; padding: 0px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; font-size: 13px;]sexuality[/border] sexuality comes here[/border][/border][comment]

-----------ethnicity------[/comment][border=none; padding: 0px; margin: 10px; height: 63.8px; display: flex; flex-direction: column; justify-content: space-evenly; box-sizing: border-box; border: 1px solid var(--unselected); padding: 15px;][border=none; padding: 0px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; font-size: 13px;]blood status[/border] blood status comes here[/border][comment]

-----------occupation (copy this entire thing and paste below this if you'd like another piece of info in this section!)------[/comment][border=none; padding: 0px; margin: 10px; margin-top: 20px; height: 63.8px; display: flex; flex-direction: column; justify-content: space-evenly; box-sizing: border-box; border: 1px solid var(--unselected); padding: 15px;][border=none; padding: 0px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; font-size: 13px;]occupation[/border] occupation comes here[/border][comment]

-----------occupation (copy this entire thing and paste below this if you'd like another piece of info in this section!)------[/comment][border=none; padding: 0px; margin: 10px; margin-top: 20px; height: 63.8px; display: flex; flex-direction: column; justify-content: space-evenly; box-sizing: border-box; border: 1px solid var(--unselected); padding: 15px;][border=none; padding: 0px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; font-size: 13px;]magic speciality[/border] speciality comes here[/border][comment]

-----------occupation (copy this entire thing and paste below this if you'd like another piece of info in this section!)------[/comment][border=none; padding: 0px; margin: 10px; margin-top: 20px; height: 63.8px; display: flex; flex-direction: column; justify-content: space-evenly; box-sizing: border-box; border: 1px solid var(--unselected); padding: 15px;][border=none; padding: 0px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; font-size: 13px;]unique ability[/border] unique ability goes here[/border][comment]

-------end of general details------[/comment][/border][/border][/border][/border][comment]

-------end of main content area-------[/comment][/border][comment]

-------end of tab one-------[/comment][/border][/tab][comment]




-----second tab------[/comment][tab=.][border=none; padding: 0px; position: absolute; bottom: 0; left:0; right: 0; top: 0;  letter-spacing: 0px; line-height: 20px; pointer-events: none;][border=none; padding: 0px; display: flex; flex-direction: row; justify-content: center; flex-wrap: wrap; padding: 10px;][comment]
-----filler (ignore)-----[/comment][border=none; padding: 0px; margin: 10px; width: 500px; height: 100px; flex-grow: 1;][/border][comment]

-------tab buttons-----[/comment][border=none; padding: 0px; margin: 10px; width: 140px; flex-grow: 1; background: var(--bg);][border=none; padding: 0px; height: 90px; margin-top: -5px;box-sizing: border-box; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center;][comment]
-------button one------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--unselected); border: 1px solid var(--unselected); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]i[/border][comment]
-------button two------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--accent); border: 1px solid var(--accent); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]ii[/border][comment]
-------button three------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--unselected); border: 1px solid var(--unselected); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]iii[/border][comment]
-------button four------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--unselected); border: 1px solid var(--unselected); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]iv[/border][comment]
-----end of buttons------[/comment][/border][/border][comment]
---------end of the header-------[/comment][/border][comment]


------beginning of main content area------[/comment][border=none; padding: 0px; display: flex; flex-direction: row; flex-wrap: wrap; padding: 10px; box-sizing: border-box; border-top: 1px solid #333;][comment]


-------appearance info-------[/comment][border=none; padding: 0px; margin: 10px; width: 400px; height: 399px; background: var(--bg); flex-grow: 1; pointer-events: auto;][border=none; padding: 0px; box-sizing: border-box; width: 100%; height: 399px; overflow: hidden;][border=none; padding: 0px; height: 100%; width: 200%; overflow-y: auto;][border=none; padding: 0px; height: auto; width: 50%; box-sizing: border-box; text-align: justify; line-height: 22px;][comment]

----------height & weight------[/comment][border=none; padding: 0px; font-size: 13px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold;]height[/border][border=none; padding: 0px; border-left: 1px dashed var(--unselected); padding-left: 10px; margin-top: 5px;]height"[/border][comment]

----------hair------[/comment][border=none; padding: 0px; font-size: 13px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; margin-top: 20px;]hair[/border][border=none; padding: 0px; border-left: 1px dashed var(--unselected); padding-left: 10px; margin-top: 5px;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam imperdiet, ipsum nec rutrum luctus, metus est euismod justo, elementum mollis turpis ipsum ac diam.[/border][comment]

----------eyes------[/comment][border=none; padding: 0px; font-size: 13px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; margin-top: 20px;]eyes[/border][border=none; padding: 0px; border-left: 1px dashed var(--unselected); padding-left: 10px; margin-top: 5px;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam imperdiet, ipsum nec rutrum luctus, metus est euismod justo, elementum mollis turpis ipsum ac diam.[/border][comment]

----------physique------[/comment][border=none; padding: 0px; font-size: 13px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; margin-top: 20px;]physique[/border][border=none; padding: 0px; border-left: 1px dashed var(--unselected); padding-left: 10px; margin-top: 5px;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam imperdiet, ipsum nec rutrum luctus, metus est euismod justo, elementum mollis turpis ipsum ac diam. Nunc ac gravida dolor, non feugiat nunc. Morbi pellentesque et lorem ac sollicitudin. Curabitur euismod vehicula urna ut eleifend.[/border][comment]

----------style------[/comment][border=none; padding: 0px; font-size: 13px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; margin-top: 20px;]style[/border][border=none; padding: 0px; border-left: 1px dashed var(--unselected); padding-left: 10px; margin-top: 5px;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam imperdiet, ipsum nec rutrum luctus, metus est euismod justo, elementum mollis turpis ipsum ac diam. Nunc ac gravida dolor, non feugiat nunc. [/border][comment]

----------modifications------[/comment][border=none; padding: 0px; font-size: 13px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; margin-top: 20px;]modifications[/border][border=none; padding: 0px; border-left: 1px dashed var(--unselected); padding-left: 10px; margin-top: 5px;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam imperdiet, ipsum nec rutrum luctus, metus est euismod justo.[/border][comment]

----------face claim (copy this whole thing and paste it below this to get another info section!------[/comment][border=none; padding: 0px; font-size: 13px; font-family: var(--heading); color: var(--accent); text-transform: uppercase; font-weight: bold; margin-top: 20px;]face claim[/border][border=none; padding: 0px; border-left: 1px dashed var(--unselected); padding-left: 10px; margin-top: 5px;]Lorem ipsum dolor sit amet, consectetur adipiscing elit. [/border][comment]

--------end of appearance info------[/comment][/border][/border][/border][/border][comment]


-------right side-------[/comment][border=none; padding: 0px; margin: 10px; width: 240px; height: 399px; flex-grow: 1; pointer-events: auto;][comment]

-------second image------[/comment][border=none; padding: 0px; height: 259px; background: var(--img2); background-size: cover; background-position: 50% 50%;][/border][comment]

--------music player--------[/comment][border=none; padding: 0px; margin-top: 20px; height: 120px; box-sizing: border-box; background: linear-gradient(to right, var(--accent) 1px, transparent 1px) 0 0, linear-gradient(to right, var(--accent) 1px, transparent 1px) 0 100%, linear-gradient(to left, var(--accent) 1px, transparent 1px) 100% 0, linear-gradient(to left, var(--accent) 1px, transparent 1px) 100% 100%, linear-gradient(to bottom, var(--accent) 1px, transparent 1px) 0 0, linear-gradient(to bottom, var(--accent) 1px, transparent 1px) 100% 0, linear-gradient(to top, var(--accent) 1px, transparent 1px) 0 100%, linear-gradient(to top, var(--accent) 1px, transparent 1px) 100% 100%; background-repeat: no-repeat; background-size: 15px 15px; text-align: center;  padding: 10px;][comment]

-------song title & artist------[/comment][border=none; padding: 0px; font-family: var(--title); font-size: 20px; text-transform: uppercase; padding-top: 10px; color: var(--accent);]paradise[/border][border=none; padding: 0px; font-size: 10px; font-family: var(--heading); letter-spacing: 1px; text-transform: uppercase; font-weight: bold;]bazzi[/border][comment]

-------media player buttons------[/comment][border=none; padding: 0px; display: flex; flex-direction: row; justify-content: space-evenly; margin-top: 10px;][border=none; padding: 0px; font-size: 16px; padding-top: 5px; margin-right: 5px;][fa]fas fa-backward[/fa][/border][border=none; padding: 0px; width: 30px; height: 30px; overflow: hidden; position: relative;][border=none; padding: 0px; height: 100px; width: 100px; padding: 0; margin-top: -15px; margin-left:-15px;][comment]

--------put your soundcloud link here!------[/comment][media=soundcloud]https://soundcloud.com/bazziworldwide/paradise[/media][comment]

---------[/comment][/border][border=none; padding: 0px; height: 30px; width: 30px; background: var(--bg); text-align: center; display: flex; flex-direction: column; justify-content: space-evenly; font-size: 20px; position: absolute; top: 0; left: 0; pointer-events: none; color: var(--accent);][fa]fas fa-play[/fa][/border][/border][comment]-------additional button (ignore)-----[/comment][border=none; padding: 0px; font-size: 16px; padding-top: 5px;][fa]fas fa-forward[/fa][/border][comment]

---------end of media player-----[/comment][/border][/border][comment]
--------end of right side------[/comment][/border][comment]


-------end of main content area-------[/comment][/border][comment]

-------end of tab two-------[/comment][/border][/tab][comment]




-----third tab------[/comment][tab=.][border=none; padding: 0px; position: absolute; bottom: 0; left:0; right: 0; top: 0;  letter-spacing: 0px; line-height: 20px; pointer-events: none;][border=none; padding: 0px; display: flex; flex-direction: row; justify-content: center; flex-wrap: wrap; padding: 10px;][comment]

-----filler (ignore)-----[/comment][border=none; padding: 0px; margin: 10px; width: 500px; height: 100px; flex-grow: 1;][/border][comment]

-------tab buttons-----[/comment][border=none; padding: 0px; margin: 10px; width: 140px; flex-grow: 1; background: var(--bg);][border=none; padding: 0px; height: 90px; margin-top: -5px;box-sizing: border-box; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center;][comment]
-------button one------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--unselected); border: 1px solid var(--unselected); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]i[/border][comment]
-------button two------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--unselected); border: 1px solid var(--unselected); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]ii[/border][comment]
-------button three------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--accent); border: 1px solid var(--accent); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]iii[/border][comment]
-------button four------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--unselected); border: 1px solid var(--unselected); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]iv[/border][comment]
-----end of buttons------[/comment][/border][/border][comment]

---------end of the header-------[/comment][/border][comment]

------beginning of main content area------[/comment][border=none; padding: 0px; display: flex; flex-direction: row; flex-wrap: wrap; padding: 10px; box-sizing: border-box; border-top: 1px solid #333;][comment]

-------third image-------[/comment][border=none; padding: 0px; margin: 10px; width: 240px; height: 399px; background: var(--bg); flex-grow: 1;][border=none; padding: 0px; height: 140px; background: var(--img3); background-size: cover; background-position: 50% 50%;][/border][comment]

--------personality misc------[/comment][border=none; padding: 0px; margin-top: 20px; height: 239px; pointer-events: auto;][border=none; padding: 0px; box-sizing: border-box; width: 100%; height: 239px; overflow: hidden;][border=none; padding: 0px; height: 100%; width: 200%; overflow-y: auto;][border=none; padding: 0px; height: auto; width: 50%; box-sizing: border-box; text-align: justify; line-height: 22px;][comment]

-------likes-------[/comment][border=none; padding: 0px; height: 40px; background: var(--bg); position: sticky; top: 0px;][border=none; padding: 0px; text-align: center; background: var(--accent); font-size: 13px; font-family: Montserrat; padding: 5px; text-transform: uppercase; font-weight: bold;]likes[/border][/border]3 likes here, no more no less

[comment]-------dislikes-------[/comment][border=none; padding: 0px; height: 40px; background: var(--bg); position: sticky; top: 0px;][border=none; padding: 0px; text-align: center; background: var(--accent); font-size: 13px; font-family: Montserrat; padding: 5px; text-transform: uppercase; font-weight: bold;]dislikes[/border][/border]3 dislikes here, no more no less

[comment]-------misc info (copy this whole thing and paste it below for another section of info!)-------[/comment][border=none; padding: 0px; height: 40px; background: var(--bg); position: sticky; top: 0px;][border=none; padding: 0px; text-align: center; background: var(--accent); font-size: 13px; font-family: Montserrat; padding: 5px; text-transform: uppercase; font-weight: bold;]persona[/border][/border]briefly describe their personality
[/border][/border][/border][/border][/border][comment]

-------personality comes here-------[/comment][border=none; padding: 0px; margin: 10px; width: 400px; height: 399px; background: var(--bg); flex-grow: 1; pointer-events: auto;][border=none; padding: 0px; box-sizing: border-box; width: 100%; height: 399px; overflow: hidden;][border=none; padding: 0px; height: 100%; width: 200%; overflow-y: auto;][border=none; padding: 0px; height: auto; width: 50%; box-sizing: border-box; text-align: justify; line-height: 22px;][border=none; padding: 0px; width: 150px; text-align: center; background: var(--accent); font-size: 17px; font-family: Montserrat; padding: 7px; margin-right: 10px; text-transform: uppercase; float: left; font-weight: bold; margin-top: 3px;]hcs.[/border]have at least 15 hcs please
[/border][/border][/border][/border][comment]

-------end of main content area-------[/comment][/border][comment]

-------end of tab three-------[/comment][/border][/tab][comment]




-----fourth tab------[/comment][tab=.][border=none; padding: 0px; position: absolute; bottom: 0; left:0; right: 0; top: 0;  letter-spacing: 0px; line-height: 20px; pointer-events: none;][border=none; padding: 0px; display: flex; flex-direction: row; justify-content: center; flex-wrap: wrap; padding: 10px;][comment]

-----filler (ignore)-----[/comment][border=none; padding: 0px; margin: 10px; width: 500px; height: 100px; flex-grow: 1;][/border][comment]

-------tab buttons-----[/comment][border=none; padding: 0px; margin: 10px; width: 140px; flex-grow: 1; background: var(--bg);][border=none; padding: 0px; height: 90px; margin-top: -5px;box-sizing: border-box; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center;][comment]
-------button one------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--unselected); border: 1px solid var(--unselected); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]i[/border][comment]
-------button two------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--unselected); border: 1px solid var(--unselected); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]ii[/border][comment]
-------button three------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--unselected); border: 1px solid var(--unselected); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]iii[/border][comment]
-------button four------[/comment][border=none; padding: 0px; width: 45px; height: 45px; box-sizing: border-box; background: var(--bg); color: var(--accent); border: 1px solid var(--accent); text-align: center; align-items: center; font-size: 20px; margin: 5px; display: flex; flex-direction: column; justify-content: space-evenly; font-family: var(--title); text-transform: uppercase; font-weight: bold;]iv[/border][comment]
-----end of buttons------[/comment][/border][/border][comment]

---------end of the header-------[/comment][/border][comment]

------beginning of main content area------[/comment][border=none; padding: 0px; display: flex; flex-direction: row; flex-wrap: wrap; padding: 10px; box-sizing: border-box; border-top: 1px solid #333;][comment]

-------background info starts here-------[/comment][border=none; padding: 0px; margin: 10px; width: 440px; height: 399px; background: var(--bg); flex-grow: 1; pointer-events: auto;][border=none; padding: 0px; box-sizing: border-box; width: 100%; height: 399px; overflow: hidden;][border=none; padding: 0px; height: 100%; width: 200%; overflow-y: auto;][border=none; padding: 0px; height: auto; width: 50%; box-sizing: border-box; text-align: justify; line-height: 22px;][comment]

--------first main event (you can change the heart icon next to the title to anything you want by looking up font awesome icons on google!)-------[/comment][border=none; padding: 0px; height: 40px; background: var(--bg); display: flex; flex-direction: row; position: sticky; top: 0px;][border=none; padding: 0px; min-width: 30px; height: 30px; box-sizing: border-box; border: 1px solid var(--accent); text-align: center; font-size: 15px; display: flex; flex-direction: column; justify-content: space-evenly; margin-right: 10px;][fa]far fa-heart[/fa][/border][border=none; padding: 0px; width: 100%; height: 30px; box-sizing: border-box; border: 1px solid var(--accent); text-align: center; font-size: 14px; font-family: var(--heading); display: flex; flex-direction: column; justify-content: space-evenly; text-transform: uppercase;]before hogwarts[/border][/border]briefly explain their early childhood years

[comment]--------second main event-------[/comment][border=none; padding: 0px; height: 40px; background: var(--bg); display: flex; flex-direction: row; position: sticky; top: 0px;][border=none; padding: 0px; min-width: 30px; height: 30px; box-sizing: border-box; border: 1px solid var(--accent); text-align: center; font-size: 15px; display: flex; flex-direction: column; justify-content: space-evenly; margin-right: 10px;][fa]far fa-heart[/fa][/border][border=none; padding: 0px; width: 100%; height: 30px; box-sizing: border-box; border: 1px solid var(--accent); text-align: center; font-size: 14px; font-family: var(--heading); display: flex; flex-direction: column; justify-content: space-evenly; text-transform: uppercase;]hogwarts years[/border][/border]briefly explain what their life was like at hogwarts

[comment]--------third main event-------[/comment][border=none; padding: 0px; height: 40px; background: var(--bg); display: flex; flex-direction: row; position: sticky; top: 0px;][border=none; padding: 0px; min-width: 30px; height: 30px; box-sizing: border-box; border: 1px solid var(--accent); text-align: center; font-size: 15px; display: flex; flex-direction: column; justify-content: space-evenly; margin-right: 10px;][fa]far fa-heart[/fa][/border][border=none; padding: 0px; width: 100%; height: 30px; box-sizing: border-box; border: 1px solid var(--accent); text-align: center; font-size: 14px; font-family: var(--heading); display: flex; flex-direction: column; justify-content: space-evenly; text-transform: uppercase;]order life[/border][/border]why did they join the order and what have they been doing the two months before the thread starts
[/border][/border][/border][/border][comment]

-------fourth image-------[/comment][border=none; padding: 0px; margin: 10px; width: 200px; height: 399px; background: var(--img4); background-size: cover; background-position: 50% 0%; flex-grow: 1;][/border][comment]

-------end of main content area-------[/comment][/border][comment]

-------end of tab four-------[/comment][/border][/tab][comment]




--------end of tabs-----[/comment][/tabs][/border][/border][/border][comment]

-------end of header-------[/comment][/border][comment]


------filler tabs (ignore)------[/comment][border=none; padding: 0px; display: flex; flex-direction: row; flex-wrap: wrap; padding: 10px;][border=none; padding: 0px; margin: 10px; width: 320px; height: 400px; flex-grow: 1;][/border][border=none; padding: 0px; margin: 10px; width: 320px; height: 400px;  flex-grow: 1;][/border][/border][comment]
------end of filler tabs-----[/comment][comment]


-------end of code-----[/comment][/border][comment]

------credit (don't remove!)-----[/comment][border=none; padding: 0px; margin-top: 10px; text-align: center;][border=none; padding: 0px; display: inline-block; background: var(--accent); text-transform: uppercase; font-size: 9px; letter-spacing: 1px; font-weight: bold; padding: 4px 7px; color: var(--credit);]coded by natasha.[/border][/border][/border]
 

myrkwise

New Member
Evelyn
Second In Command
  • i
    ii
    iii
    iv
    full name
    Evelyn Wright
    nickname
    Evie, Eve
    age
    27
    date of birth
    March 15
    gender
    Female
    sexuality
    Bisexual
    blood status
    Muggleborn
    occupation
    Librarian
    magic speciality
    Defensive Charms
    unique ability
    Future Sight
coded by natasha.
 

Attachments

  • 1632361373193.png
    1632361373193.png
    537.8 KB · Views: 0
  • 1632361425114.png
    1632361425114.png
    663.6 KB · Views: 0
Last edited:

Majestic..

Bust :(

  • Nicolette Slater
    Fighter
    • i
      ii
      iii
      iv
      full name
      Nicolette Slater
      nicknames
      Lettie, Nic
      age
      25
      date of birth
      August 7
      GENDER
      Female
      sexuality
      Bisexual
      blood status
      Pureblood
      occupation
      Day drinker
      magic speciality
      Offensive Charms
      unique ability
      Animagus: Fox
    coded by natasha.

 
Last edited:

SUGAR.

norn is my wife + goldie is the best daughter

  • westerly north
    spy
    • i
      ii
      iii
      iv
      full name
      westerly north
      nicknames
      wes, northwest, compass
      age
      29
      date of birth
      december 24th
      gender
      female
      sexuality
      bisexual
      blood status
      pureblood
      occupation
      member of the muggleborn capture unit. no other job.
      magic speciality
      jinxes + offensive magic
      unique ability
      metamorphmagus
    coded by natasha.

 
Last edited:

explosiveKitten

Fanfic Kitty
Johanna Hayes
Fighter
  • i
    ii
    iii
    iv
    full name
    Johanna Grace Hayes
    nicknames
    Joey, Jojo, Cap from her school days.
    age
    27 years old.
    date of birth
    October 14th
    gender
    Cisgender Female
    sexuality
    Bisexual Biromantic
    blood status
    Irish Muggleborn
    occupation
    Professional Seeker for the Irish National Quidditch Team.
    magic speciality
    Offensive Tranfiguration
    unique ability
    Barn Owl Animagus
coded by natasha.
 
Last edited:

Users who are viewing this thread

Top