/** general **/ body, html { margin: 0; padding: 0; } body { background: #BADEFC; color: #000; } body, table {font: 14px sans-serif;} a {color: #003399;} h1, h2, h3 {background: #426bba;} h1, h2, h3, th { box-sizing: border-box; color: #000; margin: 0; padding: 2px 4px; } h1, h2 { font-size: 16px; width: 100%; } h3 { display: inline-block; font-size: 15px; margin: 2px 3px; padding: 2px 4px; } img, iframe {max-width: 100%;} table {width: 100%;} th { background: #97beec; color: #203670; text-align: left; width: auto; } /** class **/ .box { background: #fff; border: #426bba 2px solid; margin: 10px 0; padding: 3px; } .center {text-align: center;} .container, .footer, .header { background: #fff; box-sizing: border-box; border-left: #426bba 2px solid; border-right: #426bba 2px solid; box-sizing: border-box; margin: 0 auto; width: 850px; } .container { height: 100%; padding: 0 1em 1em; } .columns { display: grid; grid-column-gap: 1em; grid-template-columns: 292px auto; width: 100%; } .curve {border-radius: 7px;} .footer, .header { background: #d7e4ff; box-sizing: border-box; font-family: sans-serif; } .footer { border-top: #426bba 2px solid; padding: 10px 30px 10px; } .header { border-bottom: #426bba 2px solid; padding: 0 30px 10px; } .header span { padding: 0 15px; } .header .title { color: #000; font-size: 200% ; text-align: left; text-decoration: none; } .profimg { float: left; padding: 5px 5px 0 0; } /** id **/ #contact a { font-weight: bold; text-decoration: none; } #contact a::before { content: url('https://placehold.co/16'); padding: 0 1em 0 0; } #interests td, #details td {width: 70%;} #url span {font: 12px monospace;} /** Small screens **/ @media (max-width: 865px) { .container, .navbar, .footer, .header {width: 100%;} .columns {grid-template-columns: 100%;} .box {margin: 1em 0;} .box:last-child {margin: 0;}; }

NAME

Silly text!

Gender
Pro/nouns
500 years old
Location
Online Now!

Last login: 2025-05-19

Contacting NAME

Link 1	Link 2
Link 3	Link 4

Contacting NAME

NAME's Interests

General	Stuff
Music	Stuff
Movies	Stuff
Television	Stuff
Anime/Manga	Stuff
Games	Stuff
Heroes	Stuff

NAME's Details

Here for...	Stuff
Weight	Stuff
Height	Stuff
Orientation	Stuff
Hometown	Stuff
Ethinicity	Stuff
Education	Stuff
Occupation	Stuff
Status	Stuff
Member since	Stuff

NAME's Blurbs

About me:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Another cool header:

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

NAME's 2nd box

Put whatever you want here! Or you can remove it. Or add another box. Go nuts.

More boxes can be added by adding more divs with the "box" class.