Scribbled.On.Code

[comment]
Designed and coded by Nano.
Please do not remove the credits or claim the code as your own work.

[font=Mr Dafoe].[/font]
[font=Montserrat].[/font]
[font=Lato].[/font]
[font=Vidaloka].[/font]
[/comment][comment]

// accents

[/comment][border=0px; padding: 0;
     --main: #a6c7a7;
     --firstname: #8c3960;
     --lastname: #fefefe;
     --quote: #fefefe;
     --basebg: #f5f5f5;
     --blockbg: #fefefe;
     --blockborder: #dddddd;
     --textcolor: #aaaaaa;
][border=0px; margin: 0 auto; padding: 0; width: 100%; max-width: 950px; background: var(--basebg); font-size: initial; overflow: hidden;][comment]

// top //

[/comment][border=0px; box-sizing: border-box; display: flex; flex-flow: row-reverse wrap; margin-left: -40px; padding: calc(10px + 3%); position: relative;][comment]

// "green" bg + texture image //

[/comment][border=0px; padding: 0; width: 100%; background: var(--main); top: 0; left: 0; bottom: 0; position: absolute;][border=0px; display: flex; flex-flow: row wrap; justify-content: center; padding: 0; width: 100%; background: url('<!--              the texture image goes here. it can be any wide image, and the code will automatically adjust to fit it! you can also keep if blank if you don't mind just a flat color. replace everything including the < to > with your image url            -->') center/cover no-repeat; top: 0; left: 0; bottom: 0; position: absolute; opacity: .03;][/border][/border][comment]

// name + filler text //

[/comment][border=0px; margin-top: 20px; margin-left: 40px; padding: 0; flex: 2; width: 100%; min-width: 250px; position: relative; ][border=0px; margin: 0 auto; padding: 0; width: 85%; min-width: 250px; font-family: 'Mr Dafoe', cursive; font-weight: 400; font-size: 3.8em; line-height: 40%; text-align: right; text-transform: lowercase; position: relative; z-index: 1;][border=0px; padding: 0; display: inline; color: var(--firstname);][comment]

// first name

[/comment]firstname[/border][border=0px; padding: 0; display: inline-block; width: 0;][/border][border=0px; padding: 0; display: inline; color: var(--lastname);][comment]

// last name

[/comment]last[/border][/border][border=0px; margin: -4px auto 0; padding: 0; width: 85%; min-width: 250px; height: 80px; overflow: hidden;][border=0px; padding: 0 18px 0 0; width: 100%; height: 80px; font-family: 'Lato', sans-serif; font-size: .6em; line-height: 115%; color: var(--quote); text-align: justify; overflow-y: auto;]“We believe that we can change the things around us in accordance with our desires—we believe it because otherwise we can see no favourable outcome. We do not think of the outcome which generally comes to pass and is also favourable: we do not succeed in changing things in accordance with our desires, but gradually our desires change. The situation that we hoped to change because it was intolerable becomes unimportant to us. We have failed to surmount the obstacle, as we were absolutely determined to do, but life has taken us round it, led us beyond it, and then if we turn round to gaze into the distance of the past, we can barely see it, so imperceptible has it become.” – Marcel Proust, [i]In Search of Lost Time[/i][/border][/border][/border][comment]

// main image //

[/comment][border=0px; margin-top: 25px; margin-left: 40px; padding: 0; flex: 1; width: 100%; min-width: 200px; position: relative;][border=0px; box-sizing: border-box; padding: calc(100% * 3/2 * 1/3 - 25px) 0 0 0; width: 100%; height: 0;][border=15px solid var(--blockbg); box-sizing: border-box; padding: 0; width: 100%; position: absolute; top: 0; left: 0;][border=0px; padding: calc(100% * 3/2) 0 0 0; width: 100%; background: url('<!--              the main image goes here. it can be any size, but a 3:2 aspect ratio is suggested            -->') center/cover no-repeat; position: relative;][/border][/border][/border][/border][/border][comment]

// bottom //

[/comment][border=0px; padding: 0; width: 100%; background: var(--basebg);][border=0px; box-sizing: border-box; display: flex; flex-flow: row wrap; margin-left: -40px; padding: calc(10px + 3%);][comment]

// dummy box -- ignore //

[/comment][border=0px; margin-left: 40px; padding: 0; flex: 1; width: 100%; min-width: 200px;][border=0px; padding: calc(100% * 3/2 * 2/3) 0 0 0; width: 100%;][/border][/border][comment]

// content wrapper //

[/comment][border=0px; margin-left: 40px; padding: 0; flex: 2; width: 100%; min-width: 250px; height: 500px; overflow: hidden;][border=0px; padding: 0 18px 0 0; width: 100%; height: 500px; overflow-y: auto; position: relative;][comment]

// header 1 //

[/comment][border=0px; padding: 0; font-family: 'Vidaloka', serif; font-size: 3.5em; line-height: 100%; -webkit-text-stroke: 1px var(--main); color: transparent; position: absolute;]01[/border][border=0px; display: flex; flex-flow: row nowrap; align-items: center; margin-left: 20px; padding: 0; width: calc(100% - 20px); height: 3.5em; position: relative;][border=0px; padding: 0; flex: 0 1 auto; font-family: 'Montserrat', sans-serif; font-size: 1.0em; line-height: .9em; color: var(--textcolor); font-weight: 700; text-transform: lowercase; background: var(--basebg);]basic information[/border][border=0px; margin-left: 5px; padding: 0; flex: 1; height: 1px; background: var(--blockborder);][/border][/border][comment]

// content 1 //

[/comment][border=1px solid var(--blockborder); border-radius: 5px; box-sizing: border-box; margin-top: -1.2em; margin-left: 18px; padding: calc(10px + 3%); width: calc(100% - 18px); font-family: 'Lato', sans-serif; font-size: calc(1em - 1px); line-height: 125%; color: var(--textcolor); text-align: left; background: var(--blockbg);][comment]
// question one //
[/comment][border=0px; margin-top: 3px; margin-left: -10px; padding: 0; display: flex; flex-flow: row wrap;][border=0px; margin-left: 10px; padding: 0; flex: 1; color: var(--main); font-size: .9em; font-weight: 600; text-transform: uppercase;]name[/border][border=0px; margin-left: 10px; padding: 0; flex: 2; text-transform: capitalize;]firsname surname[/border][/border][comment]
// question two //
[/comment][border=0px; margin-top: 3px; margin-left: -10px; padding: 0; display: flex; flex-flow: row wrap;][border=0px; margin-left: 10px; padding: 0; flex: 1; color: var(--main); font-size: .9em; font-weight: 600; text-transform: uppercase;]nickname[/border][border=0px; margin-left: 10px; padding: 0; flex: 2; text-transform: capitalize;]answer[/border][/border][comment]
// question three //
[/comment][border=0px; margin-top: 3px; margin-left: -10px; padding: 0; display: flex; flex-flow: row wrap;][border=0px; margin-left: 10px; padding: 0; flex: 1; color: var(--main); font-size: .9em; font-weight: 600; text-transform: uppercase;]gender[/border][border=0px; margin-left: 10px; padding: 0; flex: 2; text-transform: capitalize;]answer[/border][/border][comment]
// question four //
[/comment][border=0px; margin-top: 3px; margin-left: -10px; padding: 0; display: flex; flex-flow: row wrap;][border=0px; margin-left: 10px; padding: 0; flex: 1; color: var(--main); font-size: .9em; font-weight: 600; text-transform: uppercase;]age[/border][border=0px; margin-left: 10px; padding: 0; flex: 2; text-transform: capitalize;]number (##)[/border][/border][comment]
// question five //
[/comment][border=0px; margin-top: 3px; margin-left: -10px; padding: 0; display: flex; flex-flow: row wrap;][border=0px; margin-left: 10px; padding: 0; flex: 1; color: var(--main); font-size: .9em; font-weight: 600; text-transform: uppercase;]date of birth[/border][border=0px; margin-left: 10px; padding: 0; flex: 2; text-transform: capitalize;]answer[/border][/border][comment]
// question six //
[/comment][border=0px; margin-top: 3px; margin-left: -10px; padding: 0; display: flex; flex-flow: row wrap;][border=0px; margin-left: 10px; padding: 0; flex: 1; color: var(--main); font-size: .9em; font-weight: 600; text-transform: uppercase;]position[/border][border=0px; margin-left: 10px; padding: 0; flex: 2; text-transform: capitalize;]staff[/border][/border][comment]
// question seven //
[/comment][border=0px; margin-top: 3px; margin-left: -10px; padding: 0; display: flex; flex-flow: row wrap;][border=0px; margin-left: 10px; padding: 0; flex: 1; color: var(--main); font-size: .9em; font-weight: 600; text-transform: uppercase;]years working[/border][border=0px; margin-left: 10px; padding: 0; flex: 2; text-transform: capitalize;]#[/border][/border][/border][comment]

// spacer 1 -> 2 //

[/comment][border=0px; height: 20px;][/border][comment]

// header 2 //

[/comment][border=0px; padding: 0; font-family: 'Vidaloka', serif; font-size: 3.5em; line-height: 100%; -webkit-text-stroke: 1px var(--main); color: transparent; position: absolute;]02[/border][border=0px; display: flex; flex-flow: row nowrap; align-items: center; margin-left: 20px; padding: 0; width: calc(100% - 20px); height: 3.5em; position: relative;][border=0px; padding: 0; flex: 0 1 auto; font-family: 'Montserrat', sans-serif; font-size: 1.0em; line-height: .9em; color: var(--textcolor); font-weight: 700; text-transform: lowercase; background: var(--basebg);]appearance[/border][border=0px; margin-left: 5px; padding: 0; flex: 1; height: 1px; background: var(--blockborder);][/border][/border][comment]

// content 2 //

[/comment][border=1px solid var(--blockborder); border-radius: 5px; box-sizing: border-box; margin-top: -1.2em; margin-left: 18px; padding: calc(10px + 3%); width: calc(100% - 18px); font-family: 'Lato', sans-serif; font-size: calc(1em - 1px); line-height: 125%; color: var(--textcolor); text-align: justify; background: var(--blockbg);][comment]
// question one //
[/comment][border=0px; margin-top: 3px; margin-left: -10px; padding: 0; display: flex; flex-flow: row wrap;][border=0px; margin-left: 10px; padding: 0; flex: 1; color: var(--main); font-size: .9em; font-weight: 600; text-transform: uppercase;]height[/border][border=0px; margin-left: 10px; padding: 0; flex: 2; text-transform: capitalize;]answer[/border][/border][comment]
// question two //
[/comment][border=0px; margin-top: 3px; margin-left: -10px; padding: 0; display: flex; flex-flow: row wrap;][border=0px; margin-left: 10px; padding: 0; flex: 1; color: var(--main); font-size: .9em; font-weight: 600; text-transform: uppercase;]hair[/border][border=0px; margin-left: 10px; padding: 0; flex: 2; text-transform: capitalize;]answer[/border][/border][comment]
// question three //
[/comment][border=0px; margin-top: 3px; margin-left: -10px; padding: 0; display: flex; flex-flow: row wrap;][border=0px; margin-left: 10px; padding: 0; flex: 1; color: var(--main); font-size: .9em; font-weight: 600; text-transform: uppercase;]eyes[/border][border=0px; margin-left: 10px; padding: 0; flex: 2; text-transform: capitalize;]answer[/border][/border]
“We believe that we can change the things around us in accordance with our desires—we believe it because otherwise we can see no favourable outcome. We do not think of the outcome which generally comes to pass and is also favourable: we do not succeed in changing things in accordance with our desires, but gradually our desires change. The situation that we hoped to change because it was intolerable becomes unimportant to us. We have failed to surmount the obstacle, as we were absolutely determined to do, but life has taken us round it, led us beyond it, and then if we turn round to gaze into the distance of the past, we can barely see it, so imperceptible has it become.” – Marcel Proust, In Search of Lost Time[/border][comment]

// spacer 2 -> 3 //

[/comment][border=0px; height: 20px;][/border][comment]

// header 3 //

[/comment][border=0px; padding: 0; font-family: 'Vidaloka', serif; font-size: 3.5em; line-height: 100%; -webkit-text-stroke: 1px var(--main); color: transparent; position: absolute;]03[/border][border=0px; display: flex; flex-flow: row nowrap; align-items: center; margin-left: 20px; padding: 0; width: calc(100% - 20px); height: 3.5em; position: relative;][border=0px; padding: 0; flex: 0 1 auto; font-family: 'Montserrat', sans-serif; font-size: 1.0em; line-height: .9em; color: var(--textcolor); font-weight: 700; text-transform: lowercase; background: var(--basebg);]personality[/border][border=0px; margin-left: 5px; padding: 0; flex: 1; height: 1px; background: var(--blockborder);][/border][/border][comment]

// content 3 //

[/comment][border=1px solid var(--blockborder); border-radius: 5px; box-sizing: border-box; margin-top: -1.2em; margin-left: 18px; padding: calc(10px + 3%); width: calc(100% - 18px); font-family: 'Lato', sans-serif; font-size: calc(1em - 1px); line-height: 125%; color: var(--textcolor); text-align: justify; background: var(--blockbg);]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac sapien feugiat, dignissim nunc vel, egestas lacus. Sed in posuere tortor. Phasellus at ipsum enim. Aliquam euismod nisi nibh, nec rhoncus nunc vehicula nec. Aenean vel metus faucibus, venenatis justo quis, hendrerit nisi. Sed ultricies laoreet maximus. Sed ac orci et augue maximus consectetur. Pellentesque imperdiet justo non diam convallis malesuada. Suspendisse vitae mi eros. Etiam dignissim, tortor vitae hendrerit sollicitudin, risus sapien consectetur dolor, in suscipit velit ligula eget risus. Proin vulputate lacus non turpis luctus, et suscipit sem malesuada. Nunc auctor libero in consectetur cursus.

In purus ipsum, lacinia eu elementum volutpat, mollis non mauris. Morbi pretium consectetur sagittis. Pellentesque blandit congue lobortis. Donec a mi nunc. Proin magna justo, porttitor ac sollicitudin tincidunt, scelerisque et libero. Aliquam erat volutpat. Integer eu lorem interdum, aliquet eros dapibus, rutrum mi. Aenean cursus eleifend dictum. Sed mi est, imperdiet vitae dolor eu, consequat tincidunt eros. Maecenas dictum hendrerit posuere.[/border][comment]

// spacer 3 -> 4 //

[/comment][border=0px; height: 20px;][/border][comment]

// header 4 //

[/comment][border=0px; padding: 0; font-family: 'Vidaloka', serif; font-size: 3.5em; line-height: 100%; -webkit-text-stroke: 1px var(--main); color: transparent; position: absolute;]04[/border][border=0px; display: flex; flex-flow: row nowrap; align-items: center; margin-left: 20px; padding: 0; width: calc(100% - 20px); height: 3.5em; position: relative;][border=0px; padding: 0; flex: 0 1 auto; font-family: 'Montserrat', sans-serif; font-size: 1.0em; line-height: .9em; color: var(--textcolor); font-weight: 700; text-transform: lowercase; background: var(--basebg);]backstory[/border][border=0px; margin-left: 5px; padding: 0; flex: 1; height: 1px; background: var(--blockborder);][/border][/border][comment]

// content 4 //

[/comment][border=1px solid var(--blockborder); border-radius: 5px; box-sizing: border-box; margin-top: -1.2em; margin-left: 18px; padding: calc(10px + 3%); width: calc(100% - 18px); font-family: 'Lato', sans-serif; font-size: calc(1em - 1px); line-height: 125%; color: var(--textcolor); text-align: justify; background: var(--blockbg);]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac sapien feugiat, dignissim nunc vel, egestas lacus. Sed in posuere tortor. Phasellus at ipsum enim. Aliquam euismod nisi nibh, nec rhoncus nunc vehicula nec. Aenean vel metus faucibus, venenatis justo quis, hendrerit nisi. Sed ultricies laoreet maximus. Sed ac orci et augue maximus consectetur. Pellentesque imperdiet justo non diam convallis malesuada. Suspendisse vitae mi eros. Etiam dignissim, tortor vitae hendrerit sollicitudin, risus sapien consectetur dolor, in suscipit velit ligula eget risus. Proin vulputate lacus non turpis luctus, et suscipit sem malesuada. Nunc auctor libero in consectetur cursus.

In purus ipsum, lacinia eu elementum volutpat, mollis non mauris. Morbi pretium consectetur sagittis. Pellentesque blandit congue lobortis. Donec a mi nunc. Proin magna justo, porttitor ac sollicitudin tincidunt, scelerisque et libero. Aliquam erat volutpat. Integer eu lorem interdum, aliquet eros dapibus, rutrum mi. Aenean cursus eleifend dictum. Sed mi est, imperdiet vitae dolor eu, consequat tincidunt eros. Maecenas dictum hendrerit posuere.[/border][comment]

// spacer 4 -> 5 //

[/comment][border=0px; height: 20px;][/border][comment]

// header 5 //

[/comment][border=0px; padding: 0; font-family: 'Vidaloka', serif; font-size: 3.5em; line-height: 100%; -webkit-text-stroke: 1px var(--main); color: transparent; position: absolute;]05[/border][border=0px; display: flex; flex-flow: row nowrap; align-items: center; margin-left: 20px; padding: 0; width: calc(100% - 20px); height: 3.5em; position: relative;][border=0px; padding: 0; flex: 0 1 auto; font-family: 'Montserrat', sans-serif; font-size: 1.0em; line-height: .9em; color: var(--textcolor); font-weight: 700; text-transform: lowercase; background: var(--basebg);]relationships[/border][border=0px; margin-left: 5px; padding: 0; flex: 1; height: 1px; background: var(--blockborder);][/border][/border][comment]

// content 5 //

[/comment][border=1px solid var(--blockborder); border-radius: 5px; box-sizing: border-box; margin-top: -1.2em; margin-left: 18px; padding: calc(10px + 3%); width: calc(100% - 18px); font-family: 'Lato', sans-serif; font-size: calc(1em - 1px); line-height: 125%; color: var(--textcolor); text-align: justify; background: var(--blockbg);]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac sapien feugiat, dignissim nunc vel, egestas lacus. Sed in posuere tortor. Phasellus at ipsum enim. Aliquam euismod nisi nibh, nec rhoncus nunc vehicula nec. Aenean vel metus faucibus, venenatis justo quis, hendrerit nisi. Sed ultricies laoreet maximus. Sed ac orci et augue maximus consectetur. Pellentesque imperdiet justo non diam convallis malesuada. Suspendisse vitae mi eros. Etiam dignissim, tortor vitae hendrerit sollicitudin, risus sapien consectetur dolor, in suscipit velit ligula eget risus. Proin vulputate lacus non turpis luctus, et suscipit sem malesuada. Nunc auctor libero in consectetur cursus.

In purus ipsum, lacinia eu elementum volutpat, mollis non mauris. Morbi pretium consectetur sagittis. Pellentesque blandit congue lobortis. Donec a mi nunc. Proin magna justo, porttitor ac sollicitudin tincidunt, scelerisque et libero. Aliquam erat volutpat. Integer eu lorem interdum, aliquet eros dapibus, rutrum mi. Aenean cursus eleifend dictum. Sed mi est, imperdiet vitae dolor eu, consequat tincidunt eros. Maecenas dictum hendrerit posuere.[/border][comment]

// spacer 5 -> 6 //

[/comment][border=0px; height: 20px;][/border][comment]

// header 6 //

[/comment][border=0px; padding: 0; font-family: 'Vidaloka', serif; font-size: 3.5em; line-height: 100%; -webkit-text-stroke: 1px var(--main); color: transparent; position: absolute;]06[/border][border=0px; display: flex; flex-flow: row nowrap; align-items: center; margin-left: 20px; padding: 0; width: calc(100% - 20px); height: 3.5em; position: relative;][border=0px; padding: 0; flex: 0 1 auto; font-family: 'Montserrat', sans-serif; font-size: 1.0em; line-height: .9em; color: var(--textcolor); font-weight: 700; text-transform: lowercase; background: var(--basebg);]last words[/border][border=0px; margin-left: 5px; padding: 0; flex: 1; height: 1px; background: var(--blockborder);][/border][/border][comment]

// content 6 //

[/comment][border=1px solid var(--blockborder); border-radius: 5px; box-sizing: border-box; margin-top: -1.2em; margin-left: 18px; padding: calc(10px + 3%); width: calc(100% - 18px); font-family: 'Lato', sans-serif; font-size: calc(1em - 1px); line-height: 125%; color: var(--textcolor); text-align: justify; background: var(--blockbg);][border=0px; margin-top: 3px; margin-left: -10px; padding: 0; display: flex; flex-flow: row wrap;][border=0px; margin-left: 10px; padding: 0; flex: 1; color: var(--main); font-size: .9em; font-weight: 600; text-transform: uppercase;]Ability Type[/border][border=0px; margin-left: 10px; padding: 0; flex: 2; text-transform: capitalize;]answer[/border][/border]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ac sapien feugiat, dignissim nunc vel, egestas lacus. Sed in posuere tortor. Phasellus at ipsum enim. Aliquam euismod nisi nibh, nec rhoncus nunc vehicula nec. Aenean vel metus faucibus, venenatis justo quis, hendrerit nisi. Sed ultricies laoreet maximus. Sed ac orci et augue maximus consectetur. Pellentesque imperdiet justo non diam convallis malesuada. Suspendisse vitae mi eros. Etiam dignissim, tortor vitae hendrerit sollicitudin, risus sapien consectetur dolor, in suscipit velit ligula eget risus. Proin vulputate lacus non turpis luctus, et suscipit sem malesuada. Nunc auctor libero in consectetur cursus.

In purus ipsum, lacinia eu elementum volutpat, mollis non mauris. Morbi pretium consectetur sagittis. Pellentesque blandit congue lobortis. Donec a mi nunc. Proin magna justo, porttitor ac sollicitudin tincidunt, scelerisque et libero. Aliquam erat volutpat. Integer eu lorem interdum, aliquet eros dapibus, rutrum mi. Aenean cursus eleifend dictum. Sed mi est, imperdiet vitae dolor eu, consequat tincidunt eros. Maecenas dictum hendrerit posuere.[/border][comment]

// spacer 6 -> 7 //

[/comment][border=0px; height: 20px;][/border][comment]

// header 7 //

[/comment][border=0px; padding: 0; font-family: 'Vidaloka', serif; font-size: 3.5em; line-height: 100%; -webkit-text-stroke: 1px var(--main); color: transparent; position: absolute;]07[/border][border=0px; display: flex; flex-flow: row nowrap; align-items: center; margin-left: 20px; padding: 0; width: calc(100% - 20px); height: 3.5em; position: relative;][border=0px; padding: 0; flex: 0 1 auto; font-family: 'Montserrat', sans-serif; font-size: 1.0em; line-height: .9em; color: var(--textcolor); font-weight: 700; text-transform: lowercase; background: var(--basebg);]extras[/border][border=0px; margin-left: 5px; padding: 0; flex: 1; height: 1px; background: var(--blockborder);][/border][/border][comment]

// content 7 //

[/comment][border=1px solid var(--blockborder); border-radius: 5px; box-sizing: border-box; margin-top: -1.2em; margin-left: 18px; padding: calc(10px + 3%); width: calc(100% - 18px); font-family: 'Lato', sans-serif; font-size: calc(1em - 1px); line-height: 125%; color: var(--textcolor); text-align: justify; background: var(--blockbg);][comment]
// extra point 1 //
[/comment][border=0px; display: flex; flex-flow: row wrap; margin: 0 auto; width: 100%; padding: 0;][border=0px; flex: 1; padding: 0; min-width: 25px; font-weight: 700;]1. [/border][border=0px; flex: 20; padding: 0; min-width: 100px;]Class D abilities lie within the scope of natural human ability, and the holder usually just becomes suddenly skilled at a particular subject, field, or action (e.g. becoming a human calculator). As a result, most Class D ability holders go undetected by the government, fellow Elegies, and themselves. (Examples: human calculator, speedster [~28mph range], pain nullification)[/border][/border]
[comment]
// extra point 2 //
[/comment][border=0px; display: flex; flex-flow: row wrap; margin: 0 auto; width: 100%; padding: 0;][border=0px; flex: 1; padding: 0; min-width: 25px; font-weight: 700;]2. [/border][border=0px; flex: 20; padding: 0; min-width: 100px;]Class D abilities lie within the scope of natural human ability, and the holder usually just becomes suddenly skilled at a particular subject, field, or action (e.g. becoming a human calculator). As a result, most Class D ability holders go undetected by the government, fellow Elegies, and themselves. (Examples: human calculator, speedster [~28mph range], pain nullification)[/border][/border][comment]
// end of extras //
[/comment][/border][comment]

// end of contents //

[/comment][/border][/border][/border][/border][/border][comment]

// visible credit -- please don't remove!!! //

[/comment][border=0px; margin: 5px auto 0; padding: 0; width: 100%; max-width: 1000px; font-size: .6em; text-align: center; text-transform: uppercase; opacity: .5;]code by [USER=20950]@Nano[/USER][/border][/border]