AbsyintheCode2

[div=
background: #580826 url(https://img.nickpic.host/q0uGfn.png) repeat center;
border: 5px solid transparent;
border-image: url(https://img.nickpic.host/q0uGfn.png) 30 stretch;
width: 800px;
justify-content: center;]
[div=
width: 800px;
margin: auto;
overflow: hidden;][div=
margin-top: -40px;
color: black;][TABS=800]
{slide=1}[div=
/* NAV BAR */
display: flex;
height: 50px;][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]Basics[/div][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]{tab=2}Personality{/tab}[/div][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]{tab=3}Biography{/tab}[/div][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]{tab=4}Misc{/tab}[/div][/div][div=
/* BODY 1 */
display: flex;
flex-wrap: wrap;
gap: 5px;
margin-top: 5px;][div=
flex: 1;
min-width: 230px;
height: 400px;
/* PICTURE 1 */
background: url(https://i.imgur.com/CelzVfK.png) 50% 50%/cover;][/div][div=
flex: 2;
min-width: 230px;
height: 400px;
/* TEXT BG 1 */
background: white;
padding: 10px;
overflow-y: scroll;]Lorem[/div][/div]{/slide}
{slide=2}[div=
/* TAB 2 NAV BAR */
display: flex;
height: 50px;][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]{tab=1}Basics{/tab}[/div][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]Personality[/div][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]{tab=3}Biography{/tab}[/div][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]{tab=4}Misc{/tab}[/div][/div][div=
/* BODY 2 */
display: flex;
flex-wrap: wrap;
gap: 5px;
margin-top: 5px;][div=
flex: 1;
min-width: 230px;
height: 400px;
/* PICTURE 2 */
background: url(https://i.imgur.com/CelzVfK.png) 50% 50%/cover;][/div][div=
flex: 2;
min-width: 230px;
height: 400px;
/* TEXT BG 2 */
background: white;
padding: 10px;
overflow-y: scroll;]Lorem 2[/div][/div]{/slide}
{slide=3}[div=
/* TAB 3 NAV BAR */
display: flex;
height: 50px;][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]{tab=1}Basics{/tab}[/div][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]{tab=2}Personality{/tab}[/div][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]Biography[/div][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]{tab=4}Misc{/tab}[/div][/div][div=
/* BODY 3 */
display: flex;
flex-wrap: wrap;
gap: 5px;
margin-top: 5px;][div=
flex: 1;
min-width: 230px;
height: 400px;
/* PICTURE 3 */
background: url(https://i.imgur.com/CelzVfK.png) 50% 50%/cover;][/div][div=
flex: 2;
min-width: 230px;
height: 400px;
/* TEXT BG 3 */
background: white;
padding: 10px;
overflow-y: scroll;]Lorem 3[/div][/div]{/slide}
{slide=4}[div=
/* TAB 4 NAV BAR */
display: flex;
height: 50px;][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]{tab=1}Basics{/tab}[/div][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]{tab=2}Personality{/tab}[/div][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]{tab=3}Biography{/tab}[/div][div=
flex: 1;
background: white;
display: flex;
justify-content: center;
align-items: center;]Misc[/div][/div][div=
/* BODY 4 */
display: flex;
flex-wrap: wrap;
gap: 5px;
margin-top: 5px;][div=
flex: 1;
min-width: 230px;
height: 400px;
/* PICTURE 4 */
background: url(https://i.imgur.com/CelzVfK.png) 50% 50%/cover;][/div][div=
flex: 2;
min-width: 230px;
height: 400px;
/* TEXT BG 4 */
background: white;
padding: 10px;
overflow-y: scroll;]Lorem 4[/div][/div]{/slide}


[/TABS][/div][/div][/div]