[comment]coded by xayah.ღ - change the border hexcode below to your accent color![/comment] [border=1px solid #77b77b; /*color - variables*/ --background: #000; --header: #dadada; --accent: #77b77b; --text: #fff; /*picture - variables - change the X% Y% to adjust what part of the picture is focused */ --mugshot1: url('https://media.istockphoto.com/vectors/thumbnail-image-vector-graphic-vector-id1147544807?k=20&m=1147544807&s=612x612&w=0&h=pBhz1dkwsCMq37Udtp9sfxbjaMl27JUapoyYpQm0anc=') 50% 20%; --mugshot2: url('https://media.istockphoto.com/vectors/thumbnail-image-vector-graphic-vector-id1147544807?k=20&m=1147544807&s=612x612&w=0&h=pBhz1dkwsCMq37Udtp9sfxbjaMl27JUapoyYpQm0anc=') 30% 0%; --mugshot3: url('https://media.istockphoto.com/vectors/thumbnail-image-vector-graphic-vector-id1147544807?k=20&m=1147544807&s=612x612&w=0&h=pBhz1dkwsCMq37Udtp9sfxbjaMl27JUapoyYpQm0anc='); --mugshot4: url('https://media.istockphoto.com/vectors/thumbnail-image-vector-graphic-vector-id1147544807?k=20&m=1147544807&s=612x612&w=0&h=pBhz1dkwsCMq37Udtp9sfxbjaMl27JUapoyYpQm0anc='); /*fonts*/ basics: Arial; section_titles: Oswald; answers: Barlow; subtitles: Ubuntu; height: 500px; width: 300px; background: var(--background); margin: auto; padding: 0; line-height: 0; overflow: hidden; resize: none;][border=0; height: 10px; width: 300px; color: #fff; padding: 10px 0 0 0; word-spacing: 2px; text-transform: uppercase; font-size: 10px; background: var(--background); font-weight: normal; white-space: nowrap;][font=Arial]classified keep out classified keep out classified[/font][/border] [border=0; height: 95%; width: 300px; overflow-y: scroll; overflow-x: hidden; padding: 0 15px 15px 0; background: var(--background);] [comment]/*OVERVIEW/BASICS*/[/comment] [border=1px solid #dadada; height: 12px; width: 47%; background: var(--header); float: left; margin-top: 8px; color: var(--text); text-align: left; text-transform: uppercase; font-size: 1.5rem; padding: 10px 0 0 0; letter-spacing: 2px; font-weight: 100; font-family: "Oswald", sans-serif; text-shadow: 1px 1px 1px black;][font=Oswald]overview[/font][/border] [comment]BASICS INFO IN A CUTE CRIMINAL PROFILE SUMMARY HERE[/comment] [border=0; height: 25%; width: 43%; line-height: 10px; margin-top: 35px; padding: 2px 2px 2px 7px; font-family: Arial, sans-serif; font-weight: 550; text-transform: uppercase; font-size:8px; word-spacing: 1px; letter-spacing: 0.3px; color: var(--text); white-space: normal; text-align: left;]text here ~ about 3 lines, not sentences, long? [/border] [border=0; height: 25px; width: 65px; background: var(--accent); opacity: 80%; padding: 0; position: relative; z-index: 2; float: right; margin-top: -155px; margin-right: 30px; transform: rotate(5deg);][/border] [border=0; height: 30%; width: 45%; background: white; margin-top: -147px; transform: rotate(5deg); z-index: 1; padding: 5px; margin-left: 145px;][border=0; height: 84%; width: 84%; background: var(--mugshot1); background-size: cover; filter: brightness(59%) contrast(73%) saturate(79%);][/border][/border] [comment]/*APPEARANCE*/[/comment] [border=1px solid #dadada; height: 12px; width: 87%; background: var(--header); float: left; margin-top: 20px; color: var(--text); text-align: left; text-transform: uppercase; font-size: 1.5rem; padding: 10px 0 0 0; letter-spacing: 2px; font-weight: 100; font-family: "Oswald", sans-serif; text-shadow: 1px 1px 1px black;][font=Oswald]appearance[/font][/border] [comment]TRAITS/SHORT ANSWERS[/comment] [border=0; height: 37%; width: 100%; padding: 0; margin: auto; margin-top: 0px; overflow: hidden;][border=0; height: 100%; width: 105%; overflow-y: scroll; overflow-x: hidden; padding: 5px 10px 0 20px; color: var(--text);] [comment]---copy for new trait---[/comment] [border=0; height: 50px; width: 45%; padding: 0; float: left;] [border=0; height: 35%; width: 100%; padding: 2px; box-sizing: border-box; text-align: center; font-size: 10px; text-transform: uppercase; line-height: 9px;][font=Barlow]answer[/font][/border] [border=0; height: 65%; width: 100%; padding: 2px; box-sizing: border-box; text-align: center; color: var(--text); font-size: 15px; text-transform: uppercase; line-height: 15px; font-weight: bold; word-spacing: 2px;][font=Ubuntu]height[/font][/border] [/border] [comment]---copy this too---[/comment] [comment]---copy for new trait---[/comment] [border=0; height: 50px; width: 45%; padding: 0; float: left;] [border=0; height: 35%; width: 100%; padding: 2px; box-sizing: border-box; text-align: center; font-size: 10px; text-transform: uppercase; line-height: 9px;][font=Barlow]answer[/font][/border] [border=0; height: 65%; width: 100%; padding: 2px; box-sizing: border-box; text-align: center; color: var(--text); font-size: 15px; text-transform: uppercase; line-height: 15px; font-weight: bold; word-spacing: 2px;][font=Ubuntu]weight[/font][/border] [/border] [comment]---copy this too---[/comment] [comment]---copy for new trait---[/comment] [border=0; height: 50px; width: 45%; padding: 0; float: left;] [border=0; height: 35%; width: 100%; padding: 2px; box-sizing: border-box; text-align: center; font-size: 10px; text-transform: uppercase; line-height: 9px;][font=Barlow]answer[/font][/border] [border=0; height: 65%; width: 100%; padding: 2px; box-sizing: border-box; text-align: center; color: var(--text); font-size: 15px; text-transform: uppercase; line-height: 15px; font-weight: bold; word-spacing: 2px;][font=Ubuntu]hair color[/font][/border] [/border] [comment]---copy this too---[/comment] [comment]---copy for new trait---[/comment] [border=0; height: 50px; width: 45%; padding: 0; float: left;] [border=0; height: 35%; width: 100%; padding: 2px; box-sizing: border-box; text-align: center; font-size: 10px; text-transform: uppercase; line-height: 9px;][font=Barlow]answer[/font][/border] [border=0; height: 65%; width: 100%; padding: 2px; box-sizing: border-box; text-align: center; color: var(--text); font-size: 15px; text-transform: uppercase; line-height: 15px; font-weight: bold; word-spacing: 2px;][font=Ubuntu]skin tone[/font][/border] [/border] [comment]---copy this too---[/comment] [comment]---copy for new trait---[/comment] [border=0; height: 50px; width: 45%; padding: 0; float: left;] [border=0; height: 35%; width: 100%; padding: 2px; box-sizing: border-box; text-align: center; font-size: 10px; text-transform: uppercase; line-height: 9px;][font=Barlow]answer[/font][/border] [border=0; height: 65%; width: 100%; padding: 2px; box-sizing: border-box; text-align: center; color: var(--text); font-size: 15px; text-transform: uppercase; line-height: 15px; font-weight: bold; word-spacing: 2px;][font=Ubuntu]eyes[/font][/border] [/border] [comment]---copy this too---[/comment] [comment]---copy for new trait---[/comment] [border=0; height: 50px; width: 45%; padding: 0; float: left;] [border=0; height: 35%; width: 100%; padding: 2px; box-sizing: border-box; text-align: center; font-size: 10px; text-transform: uppercase; line-height: 9px;][font=Barlow]answer[/font][/border] [border=0; height: 65%; width: 100%; padding: 2px; box-sizing: border-box; text-align: center; color: var(--text); font-size: 15px; text-transform: uppercase; line-height: 15px; font-weight: bold; word-spacing: 2px;][font=Ubuntu]faceclaim[/font][/border] [/border] [comment]---copy this too---[/comment] [/border][/border] [comment]DESCRIPTION[/comment] [border=0; height: 20%; width: 260px; padding: 0 25px 0 0; margin: auto; margin-top: -20px; overflow: hidden;][border=0; height: 100%; width: 103.5%; overflow-y: scroll; overflow-x: hidden; font-size: 10px; line-height: 10px; text-transform: uppercase; padding: 0 45px 0 15px; box-sizing: content-box; text-align: justify; white-space: normal; margin: auto; position: relative; color: var(--text);][font=Barlow]appearance description here! as long as you want cause it scrolls [/font][/border][/border] [border=0; height: 3%; width: 13%; float: right; color: var(--text); line-height: 0; text-transform: uppercase; font-size: 12px; font-weight: bold; white-space: nowrap;][font=Ubuntu]notes[/font][/border] [border=0; height: 25px; width: 65px; background: var(--accent); opacity: 80%; padding: 0; position: relative; z-index: 2; margin-left: 45px; margin-top: 30px; transform: rotate(5deg);][/border] [border=0; height: 30%; width: 45%; background: white; z-index: 1; padding: 5px; margin-left: 10px; margin-top: -15px;][border=0; height: 84%; width: 84%; background: var(--mugshot2); background-size: cover; filter: brightness(59%) contrast(73%) saturate(79%);][/border][/border] [comment]/*PERSONALITY*/[/comment] [border=1px solid #dadada; height: 12px; width: 45%; background: var(--header); float: right; margin-top: -153px; color: var(--text); text-align: left; text-transform: uppercase; font-size: 1.5rem; padding: 10px 0 0 0; letter-spacing: 2px; font-weight: 100; font-family: "Oswald", sans-serif; text-shadow: 1px 1px 1px black;][font=Oswald]psyche[/font][/border] [comment]LIST OF TRAITS[/comment] [border=0; height: 26.5%; width: 45%; float: right; margin-top: -125px; padding: 0; overflow: hidden;][border=0; height: 99%; width: 101%; box-sizing: content-box; overflow-y: scroll; overflow-x: hidden; padding: 0 20px 0 0; line-height: 5px;][comment] ---copy this for a new trait---[/comment][border=0; height: fit-content; width: fit-content; background: var(--accent); color: white; box-shadow: 3px 3px 1px white; font-weight: bold; text-transform: uppercase; font-size: 9px; letter-spacing: 2px; float: left; padding: 4px;][font=Barlow]trait[/font][/border] [comment]---copy this too---[/comment] [comment]---copy this for a new trait---[/comment] [border=0; height: fit-content; width: fit-content; background: var(--accent); color: white; box-shadow: 3px 3px 1px white; font-weight: bold; text-transform: uppercase; font-size: 9px; letter-spacing: 2px; float: left; padding: 4px;][font=Barlow]trait[/font][/border] [comment]---copy this too---[/comment] [comment]---copy this for a new trait---[/comment] [border=0; height: fit-content; width: fit-content; background: var(--accent); color: white; box-shadow: 3px 3px 1px white; font-weight: bold; text-transform: uppercase; font-size: 9px; letter-spacing: 2px; float: left; padding: 4px;][font=Barlow]trait[/font][/border] [comment]---copy this too---[/comment] [comment]---copy this for a new trait---[/comment] [border=0; height: fit-content; width: fit-content; background: var(--accent); color: white; box-shadow: 3px 3px 1px white; font-weight: bold; text-transform: uppercase; font-size: 9px; letter-spacing: 2px; float: left; padding: 4px;][font=Barlow]trait[/font][/border] [comment]---copy this too---[/comment] [comment]---copy this for a new trait---[/comment] [border=0; height: fit-content; width: fit-content; background: var(--accent); color: white; box-shadow: 3px 3px 1px white; font-weight: bold; text-transform: uppercase; font-size: 9px; letter-spacing: 2px; float: left; padding: 4px;][font=Barlow]trait[/font][/border] [comment]---copy this too---[/comment] [comment]---copy this for a new trait---[/comment] [border=0; height: fit-content; width: fit-content; background: var(--accent); color: white; box-shadow: 3px 3px 1px white; font-weight: bold; text-transform: uppercase; font-size: 9px; letter-spacing: 2px; float: left; padding: 4px;][font=Barlow]trait[/font][/border] [comment]---copy this too---[/comment] [comment]---copy this for a new trait---[/comment] [border=0; height: fit-content; width: fit-content; background: var(--accent); color: white; box-shadow: 3px 3px 1px white; font-weight: bold; text-transform: uppercase; font-size: 9px; letter-spacing: 2px; float: left; padding: 4px;][font=Barlow]trait[/font][/border] [comment]---copy this too---[/comment] [/border][/border] [comment]DESCRIPTION[/comment] [border=0; height: 20%; width: 260px; padding: 0 25px 0 0; margin: auto; margin-top: 10px; overflow: hidden;][border=0; height: 100%; width: 103.5%; overflow-y: scroll; overflow-x: hidden; font-size: 10px; line-height: 10px; text-transform: uppercase; padding: 0 45px 0 15px; box-sizing: content-box; text-align: justify; white-space: normal; margin: auto; position: relative; color: var(--text);][font=Barlow] personality here ~ as long as you want [/font][/border][/border] [comment]MISCELLANEOUS[/comment] [border=0; height: 43%; width: 85%; background: var(--accent); margin: auto; margin-top: 5px; padding: 0; overflow: hidden;] [border=0; height: 100%; width: 96%; overflow-y: scroll; overflow-x: hidden; padding: 7px 26px 0 5px; line-height: 14px; font-size: 12px; color: var(--text);]answer[comment] ---copy this for a new section of info--- [/comment][border=0; height: fit-content; width: fit-content; color: var(--text); text-transform: uppercase; font-weight: bold; font-size: 15px; letter-spacing: 1px; margin-top: -6px; float: left; padding: 3px 5px 0 0;][font=Ubuntu]alignment/mbti[/font][/border] [comment]---copy to here---[/comment] [comment] ---copy this for a new section of info--- [/comment][border=0; height: fit-content; width: fit-content; color: var(--text); text-transform: uppercase; font-weight: bold; font-size: 15px; letter-spacing: 1px; margin-top: -6px; float: left; padding: 3px 5px 0 0;][font=Ubuntu]likes[/font][/border]answer [comment]---copy to here---[/comment] [comment] ---copy this for a new section of info--- [/comment][border=0; height: fit-content; width: fit-content; color: var(--text); text-transform: uppercase; font-weight: bold; font-size: 15px; letter-spacing: 1px; margin-top: -6px; float: left; padding: 3px 5px 0 0;][font=Ubuntu]dislikes[/font][/border]answer [comment]---copy to here---[/comment] [comment] ---copy this for a new section of info--- [/comment][border=0; height: fit-content; width: fit-content; color: var(--text); text-transform: uppercase; font-weight: bold; font-size: 15px; letter-spacing: 1px; margin-top: -6px; float: left; padding: 3px 5px 0 0;][font=Ubuntu]fears[/font][/border]answer [comment]---copy to here---[/comment] [comment] ---copy this for a new section of info--- [/comment][border=0; height: fit-content; width: fit-content; color: var(--text); text-transform: uppercase; font-weight: bold; font-size: 15px; letter-spacing: 1px; margin-top: -6px; float: left; padding: 3px 5px 0 0;][font=Ubuntu]reputation[/font][/border]answer [comment]---copy to here---[/comment] [/border] [/border] [comment]/*BACKGROUND*/[/comment] [border=1px solid #dadada; height: 12px; width: 87%; background: var(--header); float: left; margin-top: 20px; color: var(--text); text-align: left; text-transform: uppercase; font-size: 1.5rem; padding: 10px 0 0 0; letter-spacing: 2px; font-weight: 100; font-family: "Oswald", sans-serif; text-shadow: 1px 1px 1px black;][font=Oswald]background[/font][/border] [comment]TIMELINE/DESCRIPTION[/comment] [border=0; height: 20%; width: 260px; padding: 0 25px 0 0; margin: auto; margin-top: 50px; overflow: hidden;][border=0; height: 100%; width: 103.5%; overflow-y: scroll; overflow-x: hidden; font-size: 10px; line-height: 10px; text-transform: uppercase; padding: 0 45px 0 15px; box-sizing: content-box; text-align: justify; white-space: normal; margin: auto; position: relative; color: var(--text);][comment]---copy this for a new section---[/comment][border=0; height: fit-content; width: fit-content; background: var(--accent); color: white; box-shadow: 3px 3px 1px white; font-weight: bold; text-transform: uppercase; font-size: 9px; letter-spacing: 2px; float: left; padding: 4px;][font=Barlow]section title[/font][/border] [comment]---copy this too---[/comment] [font=Barlow] background part 1 [/font] [comment]---copy this for a new section---[/comment][border=0; height: fit-content; width: fit-content; background: var(--accent); color: white; box-shadow: 3px 3px 1px white; font-weight: bold; text-transform: uppercase; font-size: 9px; letter-spacing: 2px; float: left; padding: 4px;][font=Barlow]section title[/font][/border] [comment]---copy this too---[/comment] [font=Barlow] background part 2 [/font] [/border][/border] [comment]ADDITIONAL INFO[/comment] [border=1px solid #dadada; height: 12px; width: 87%; background: var(--header); float: left; margin-top: 20px; color: var(--text); text-align: left; text-transform: uppercase; font-size: 1.5rem; padding: 10px 0 0 0; letter-spacing: 2px; font-weight: 100; font-family: "Oswald", sans-serif; text-shadow: 1px 1px 1px black;][font=Oswald]ADDITIONAL INFO[/font][/border] [border=0; height: 30%; width: 45%; background: white; z-index: 1; padding: 5px; margin-left: 10px; margin-top: 50px;][border=0; height: 84%; width: 84%; background: var(--mugshot3); background-size: cover; filter: brightness(59%) contrast(73%) saturate(79%);][/border][/border] [border=0; height: 25px; width: 65px; background: var(--accent); opacity: 80%; padding: 0; position: relative; z-index: 2; margin-left: 45px; margin-top: -10px; transform: rotate(5deg);][/border] [border=0; height: 30%; width: 45%; background: white; z-index: 1; padding: 5px; margin-left: 10px; margin-top: -10px;][border=0; height: 84%; width: 84%; background: var(--mugshot4); background-size: cover; filter: brightness(59%) contrast(73%) saturate(79%);][/border][/border] [comment]DESCRIPTION[/comment] [border=0; height: 65%; width: 48%; padding: 0 0px 0 0; margin: auto; margin-top: -310px; overflow: hidden; float: right;][border=0; height: 100%; width: 90%; overflow-y: scroll; overflow-x: hidden; font-size: 10px; line-height: 10px; text-transform: uppercase; padding: 0 45px 0 15px; box-sizing: content-box; text-align: justify; white-space: normal; margin: auto; position: relative; color: var(--text);][font=Barlow]—headcanon uno —headcanon dos —headcanon tres —headcanon quatro [/font][/border][/border] [/border] [/border] [border=0; height: fit-content; width: 100px; margin: auto; font-size: 9px; text-transform: lowercase; padding: 0; text-align: center; margin-top: -20px;]coded by xayah.ღ [/border]