[comment] [font=Yeseva One] titles[/font] [font=Gochi Hand] note[/font] [font=Rubik] body text[/font] [/comment] [border=1px solid var(--outlines); /*coded by kanichen*/ /*pictures*/ --cspic:URL('https://i.pinimg.com/564x/5c/d1/69/5cd169e68b718be65e080e1ed200df84.jpg'); --oocpic:URL('https://i.pinimg.com/564x/81/dc/b0/81dcb082f20032078af040b593176473.jpg'); --lorepic:URL('https://i.pinimg.com/564x/73/5c/c6/735cc6dc64b40fb2186b5abd2dbc7307.jpg'); /*the bg pictures*/ --outermostbg:URL('https://i.pinimg.com/originals/cb/3d/04/cb3d0460161b3b6e77a115b11258feb7.jpg'); --paperbox:URL('https://www.seekpng.com/png/full/848-8484791_paper-grain-texture-old-vintage-paper-png.png'); /*pics for the roles. when you want to add another one, just copy the variable, and change the number in both the code and variable*/ --rolepic1:URL('https://i.pinimg.com/564x/0a/e1/6d/0ae16deabe266d66c4d5a7c4f71fbc9b.jpg'); --rolepic2:URL('https://i.pinimg.com/564x/db/8e/01/db8e01430a5f938fe3e3525c7242b368.jpg'); --rolepic3:URL('https://i.pinimg.com/564x/83/f2/9c/83f29cee20e68e62ce029ea9cd6975eb.jpg'); /*colors*/ --bgcolor: #292929; --zbgcolor: #640000; --titlecolor: antiquewhite; --mainfont: antiquewhite; --notepaper: darkred; --outlines: darkred; --accentoutlines: beige; /*fonts*/ --bodytext: "Rubik"; --bodyfont: "Gochi Hand"; --titlefont: "Yeseva One", cursive; /*to change the fonts change them here and above!*/ padding:5px; height:fit-content; max-width:700px; background:var(--outermostbg); background-size:cover; margin:auto;][border=0; padding:10px; height:fit-content; max-width:700px; display:flex; flex-flow:row wrap; gap:10px 10px;][comment] **title is below [/comment][border=0; height:fit-content; padding:0px; max-width:400px; min-width:250px; flex:2;][border=0; padding:0; height:fit-content; width:fit-content; font-size:40px; color:var(--titlecolor); margin:5px; line-height:40px; font-family: var(--titlefont);]run rabbit run.[/border][comment] large box and first link ahead [/comment][border=1px solid var(--outlines); padding:5px; height:440px; width:100%; min-width:300px; box-sizing:border-box; background:var(--bgcolor); display:flex; flex-flow:row wrap; row-gap:5px; align-content:center; justify-content:center;][border=1px dotted var(--outlines); height:50px; padding:5px; max-width:370px; margin:auto; display:flex; flex-flow:row nowrap; justify-content:space-evenly; align-items:center; flex:1;][border=1px solid var(--outlines); height:40px; max-width:100px; background:var(--cspic)50% 50%; background-size:cover; padding:5px; display:flex; align-items:flex-end; justify-content:flex-end; flex:1;][border=0; height:20px; width:50px; padding:0; color:var(--titlecolor); font-size:15px; text-align:right; font-family: var(--titlefont);][comment] ** first link [/comment][url=link here][b]CS[/b][/url][/border][/border][comment] 2nd link below [/comment][border=1px solid var(--outlines); height:40px; max-width:100px; background:var(--lorepic)50% 50%; background-size:cover; padding:5px; display:flex; align-items:flex-end; justify-content:flex-end; flex:1;][border=0; height:20px; width:50px; padding:0; color:var(--titlecolor); font-size:15px; text-align:right; font-family: var(--titlefont);][comment] ** second link [/comment][url=link here][b]LORE[/b][/url][/border][/border][comment] 3rd link below [/comment][border=1px solid var(--outlines); height:40px; max-width:100px; background:var(--oocpic)50% 50%; background-size:cover; padding:5px; display:flex; align-items:flex-end; justify-content:flex-end; flex:1;][border=0; height:20px; width:50px; padding:0; color:var(--titlecolor); font-size:15px; text-align:right; font-family: var(--titlefont);][comment] **third link [/comment][url=link here][b]OOC[/b][/url][/border][/border][/border][comment] main content box [/comment][border=0; padding:0; height:350px; max-width:370px; min-width:260px; overflow:hidden; box-sizing:border-box;][border=0; padding:0; width:200%; height:100%; overflow-y:scroll;][border=0; padding:2px 1px 5px 4px; box-sizing:border-box; height:auto; width:50%;][border=0px; height:30px; max-width:360px; padding:4px 5px 5px 5px; box-sizing:border-box; margin:auto;][border=0; padding:unset; height:fit-content: max-width:255px; display:flex; justify-content:flex-end;][border=0; height:fit-content; margin:right; width:350px; font-size:30px; text-align:right; display:inline-block; color:var(--titlecolor); line-height:25px; padding:0; font-family: var(--titlefont);][font="Yeseva One"]the premise[/font][/border][/border][/border][border=0; height:fit-content; max-width:360px; padding:5px 1px 5px 0; color:var(--mainfont); font-family:var(--bodytext); text-align:justify; font-size:11px; line-height:12px; box-sizing:border-box;][comment] **put your plot or concept here[/comment][color=orangered]Duis luctus metus erat, vel dictum lorem aliquam vel.[/color] Donec nisl turpis, hendrerit eu maximus vitae, condimentum vel sem. Morbi eget odio viverra, euismod risus vitae, viverra nisl. Aenean volutpat ultricies gravida. Etiam non pretium lorem. Duis egestas, nunc nec fermentum elementum, dolor mi eleifend sapien, rutrum finibus est massa a augue. Integer ultricies augue vel felis pellentesque venenatis. Vestibulum ultricies lobortis turpis, quis placerat turpis mattis et. In volutpat tincidunt posuere. Integer nec varius purus. Vestibulum rutrum sem congue eros malesuada, lobortis vestibulum libero commodo. Duis semper lacinia maximus. Vestibulum et nisi nec dolor accumsan sagittis. Nullam elementum magna posuere volutpat semper. Sed tempor, metus eget placerat rutrum, lacus lectus scelerisque dui, eu bibendum diam erat sed nulla. Fusce ultrices hendrerit quam, ac cursus lacus tempor id. Maecenas suscipit dui id tincidunt semper. Fusce laoreet massa non massa sollicitudin, vulputate egestas mauris tincidunt. Donec leo justo, efficitur sed felis tincidunt, molestie fringilla ligula. Aliquam eget velit neque. Cras a tincidunt tortor. In eget sapien fermentum diam viverra fermentum. Cras lacinia blandit massa vitae tincidunt.[/border][comment] **rules. you can change the format if you would like, i just kept it simple, nothing special. [/comment][border=0px; height:30px; max-width:360px; padding:4px 5px 5px 5px; box-sizing:border-box; margin:auto;][border=0; padding:unset; height:fit-content: max-width:255px; display:flex; justify-content:flex-end;][border=0; height:fit-content; margin:right; width:350px; font-size:30px; text-align:right; display:inline-block; color:var(--titlecolor); line-height:25px; padding:0; font-family: var(--titlefont);][font="Yeseva One"]the rules[/font][/border][/border][/border][border=0; height:fit-content; max-width:360px; padding:5px 1px 5px 0; color:var(--mainfont); font-family:var(--bodytext); text-align:justify; font-size:11px; line-height:12px; box-sizing:border-box;][comment] **here you are[/comment][color=orangered][b][i]1. RESPECT THE RPN RULES[/i][/b][/color] here is where the blurb about the rule goes. repeat. [color=orangered][b][i]2. ANY OTHER RULES YOU WANT[/i][/b][/color] here is where the blurb about the rule goes. repeat. [color=orangered][b][i]3. THIS WHOLE THING SCROLLS![/i][/b][/color] here is where the blurb about the rule goes. repeat. [/border][comment] - [/comment][/border][/border][/border][/border][/border][comment] right side [/comment][border=0; padding:0px; height:fit-content; width:250px; flex:1;][border=0; padding:0; margin:auto; height:230px; width:250px; background:var(--paperbox)50% 50%; background-size:contain; background-repeat:no-repeat; display:flex; align-items:center;][border=0px; padding:5px; height:170px; width:240px; overflow:hidden;][border=0; padding:0; width:200%; height:100%; overflow-y:scroll;][border=0; padding:0 0 10px 8px; box-sizing:border-box; height:auto; width:50%; color:var(--notepaper); font-size:15px; line-height:19px; text-align:justify; font-family:var(--bodyfont);][comment] **you can put whatever you like in this box. [/comment]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed vitae blandit enim, a ultrices tellus. Sed vitae lectus id magna varius facilisis a vitae urna. Aliquam magna est, mollis ut neque in, fringilla posuere turpis. Fusce vel rutrum orci. Maecenas eget malesuada neque. Sed iaculis, felis nec vulputate dapibus, urna est eleifend erat, at vulputate massa odio et sem. Sed vitae nulla vel ex semper pretium placerat vel ligula. In vitae lobortis arcu, sed ultricies dolor. Donec nulla lacus, sollicitudin eget nunc quis, imperdiet ornare nibh. Curabitur venenatis gravida pharetra. Duis odio urna, malesuada quis mauris quis, hendrerit ullamcorper nisi. Aliquam accumsan lorem sed eros finibus, sit amet sagittis nibh lacinia. Nulla lacus massa, luctus non erat eget, efficitur blandit neque. Nam pulvinar velit id lectus dictum, sed sodales odio luctus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Quisque quam tortor, euismod non dolor at, pretium auctor erat. Proin vitae euismod est. Mauris a euismod mi. Fusce luctus mollis lorem, eu consequat lacus tristique nec. Maecenas volutpat nisl nec imperdiet iaculis. Curabitur eu hendrerit lacus. Phasellus sodales massa ac dolor rutrum, at imperdiet enim rhoncus.[/border][/border][/border][/border][comment] 2nd box on the lower right [/comment][border=0; padding:5px; margin:auto; height:252px; width:260px; background:var(--zbgcolor);][border=0; padding:0; height:260px; width:260px; overflow:hidden;][border=0; padding:0; width:200%; height:97%; overflow-y:scroll;][border=0; padding:2px 0 5px 5px; box-sizing:border-box; height:auto; width:50%;][comment] role blurb, copy until the asterisk. the desc will be as long or as short as you write it. the whole box scrolls so you can have as many roles as you please! [/comment][border=1px dotted var(--accentoutlines); height:75px; width:250px; padding:4px 5px 5px 5px; box-sizing:border-box;][border=1px solid var(--accentoutlines); height:65px; width:65px; background:var(--rolepic1)50% 50%; background-size:cover; box-sizing:border-box; display:inline-block; float:left;][/border][border=0; height:fit-content; width:170px; font-size:30px; text-align:right; display:inline-block; color:var(--titlecolor); line-height:30px; padding:0; font-family: var(--titlefont);]mad hatter.[/border][/border][border=0; height:fit-content; width:250px; padding:5px 0 5px 0; color:var(--titlecolor); font-family:var(--bodytext); text-align:justify; font-size:11px; line-height:12px; box-sizing:border-box;]In vitae lobortis arcu, sed ultricies dolor. Donec nulla lacus, sollicitudin eget nunc quis, imperdiet ornare nibh. Curabitur venenatis gravida pharetra. Duis odio urna, malesuada quis mauris quis, hendrerit ullamcorper nisi.[/border][comment] ***copy until here. include comment end tag so you can see the end easier! [/comment][border=1px dotted var(--accentoutlines); height:75px; width:250px; padding:4px 5px 5px 5px; box-sizing:border-box;][border=1px solid var(--accentoutlines); height:65px; width:65px; background:var(--rolepic2)50% 50%; background-size:cover; box-sizing:border-box; display:inline-block; float:left;][/border][border=0; height:fit-content; width:170px; font-size:30px; text-align:right; display:inline-block; color:var(--titlecolor); line-height:30px; padding:0; font-family: var(--titlefont);]red queen.[/border][/border][border=0; height:fit-content; width:250px; padding:5px 0 5px 0; color:var(--mainfont); font-family:var(--bodytext); text-align:justify; font-size:11px; line-height:12px; box-sizing:border-box;]In vitae lobortis arcu, sed ultricies dolor. Donec nulla lacus, sollicitudin eget nunc quis, imperdiet ornare nibh. Curabitur venenatis gravida pharetra. Duis odio urna, malesuada quis mauris quis, hendrerit ullamcorper nisi.[/border][comment] ***another [/comment][border=1px dotted var(--accentoutlines); height:75px; width:250px; padding:4px 5px 5px 5px; box-sizing:border-box;][border=1px solid var(--accentoutlines); height:65px; width:65px; background:var(--rolepic3)50% 50%; background-size:cover; box-sizing:border-box; display:inline-block; float:left;][/border][border=0; height:fit-content; width:170px; font-size:30px; text-align:right; display:inline-block; color:var(--titlecolor); line-height:30px; padding:0; font-family: var(--titlefont);]the alice.[/border][/border][border=0; height:fit-content; width:250px; padding:5px 0 5px 0; color:var(--mainfont); font-family:var(--bodytext); text-align:justify; font-size:11px; line-height:12px; box-sizing:border-box;]In vitae lobortis arcu, sed ultricies dolor. Donec nulla lacus, sollicitudin eget nunc quis, imperdiet ornare nibh. Curabitur venenatis gravida pharetra. Duis odio urna, malesuada quis mauris quis, hendrerit ullamcorper nisi.[/border][comment] [/comment][/border][/border][/border][/border][/border][/border][/border][border=0; padding:0; margin:auto; width:90px; text-transform:lowercase; font-size:8px; text-align:center]coded by kaninchen[/border]