[comment][font=Abril Fatface][font=Poppins]dj, spin it![/font][/font]

[/comment][border=0px;
padding:0px;
display:block;
font-smoothing:antialiased;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
position:relative;
text-align:justify;
white-space:nowrap;
box-sizing:border-box;
width:100%;
height:auto;
overflow:hidden;
line-height:0px;
padding-top:60px;
padding-bottom:80px;
font-size:0px;
color: black;

/*background color*/
background-color:#f9f9f9;

/*main bg and texture*/
--textbg1: #95a360;
--bg: #f1f1f1;
--icon: #f1f1f1;

/*fonts and colours*/
--font: Poppins;
--title:Abril Fatface;


/*the images*/
--image1: URL(https://i.pinimg.com/564x/05/27/19/05271955171d3ed6f5af13b6ddd14961.jpg) center/cover no-repeat;
--image2: URL(https://i.pinimg.com/564x/07/84/ca/0784ca58612b32de1b60ac00d4387426.jpg) center/cover no-repeat;
--image3: URL(https://i.pinimg.com/564x/70/9b/1c/709b1c85a4ee46b7b84f8004aa39ca4b.jpg) center/cover no-repeat;

/*cursor*/
cursor: url(https://66.media.tumblr.com/232c090ebdd37ae4bc17adb54e1e0344/tumblr_inline_ol4nwhvSwg1uxxza6_75sq.png), auto!important;]

[border=0px; padding:0px; max-width:450px; width:100%; height:480px; margin:auto; box-sizing:border-box; overflow:hidden; background:var(--bg); border-top:30px solid #dedede; border-radius:5px; box-shadow: 0px 10px 13px -7px #000000, 5px 5px 15px 5px rgba(0,0,0,0);]
[border=0px; padding:10px;box-sizing:border-box;  max-width:450px; width:100%; height:10px; margin-top:-30px; position:absolute; font-size:10px; line-height:5px; letter-spacing:0px;white-space:normal; font-family: var(--font);  display:flex; flex-direction:row][border=0px; padding:5px; width:50%; box-sizing:border-box; height:15px; border-radius:10px; background:white; margin-top:-2px; padding-left:10px;display:flex; flex-direction:row; justify-content: space-between][border=0px; padding:0px;width:90%;

/*charater name here*/]Yang Hui [/border]
[border=0px; padding:0px;width:10%; font-size:8px; margin-top:-2px;][fa]fas fa-search[/fa][/border] [/border]


[border=0px; padding:0px; width:50%; box-sizing:border-box; display:flex; justify-content:flex-end; flex-direction:row;  letter-spacing:20px; margin-left:10px;]
[border=0px; padding:0px;font-size:7px; margin-top:2px][fa]fal fa-window-minimize[/fa][/border]
[border=0px; padding:0px; font-size:7px; margin-top:2px] [fa]fal fa-window-maximize[/fa] [/border]
[border=0px; padding:0px;][fa]fal fa-times[/fa][/border][/border][/border]



[border=0px; padding:0px; height:calc(100% + 90px); width:100%;overflow-x:scroll;overflow-y:hidden; ][border=0; padding:0px;height:auto; width:51%; box-sizing:border-box; ][border=0px; padding:0px;width:1350px;  height:450px; margin-left:-1px; display:flex; flex-direction:row]

[border=0px; width:450px; height:450px; background:var(--image1); ][/border]

[border=0px;padding:0px; width:450px; height:450px; display:flex; flex-direction:column]
[border=0px; padding:30px; width:450px; height:200px; box-sizing:border-box;] [border=0px; padding:0px; height:100%; width:100%; background:var(--image2);border-radius:10px; display:flex;  justify-content: flex-end; align-items: flex-end;]

[border=0px; padding:0px; padding-right:20px; box-sixing:border-box; width:100%; height:20px; text-align:right;font-size:30px; line-height:5px; letter-spacing:0px;white-space:normal; font-family: var(--title); color:var(--icon)]basics.[/border][/border][/border]


[border=0px; padding:10px; width:410px; height:260px; box-sizing:border-box; margin:auto; margin-top:-20px;] 
[border=0px; padding:0px; height:100%; width:100%; background:var(--textbg1);display:flex;  flex-flow:row wrap; border-radius:10px;]

[border=0px; padding:20px; height:100%; width:50%;display:flex;  flex-flow:row wrap;font-size:10px; line-height:5px; letter-spacing:0px;white-space:normal; font-family: var(--font);  box-sizing:border-box;


/*all your info here*/]
[border=0px; padding:5px; width:fit-content; height:20px;display: flex;justify-content:center; align-items:center;  background:var(--icon);  font-weight:bold;]name[/border]
[border=0px; padding:5px;width:90px; height:25px; margin-left:10px;box-sizing:border-box;  line-height:20px]Yang Hui (杨慧)[/border] 
[border=0px; padding:5px; width:fit-content; height:20px;display: flex;justify-content:center; align-items:center;  background:var(--icon); font-weight:bold; ]age[/border]
[border=0px; padding:5px;width: 100px;height:20px;box-sizing:border-box;  margin-left:10px;  line-height:20px ]Twenty Three[/border] 
[border=0px; padding:5px; width:fit-content; height:20px;display: flex;justify-content:center; align-items:center;  background:var(--icon);font-weight:bold;  ]nick name[/border]
[border=0px; padding:5px;width: 80px; height:20px; box-sizing:border-box;   margin-left:10px;   line-height:20px]Henry [/border] 
[border=0px; padding:5px; width:fit-content; height:20px;display: flex;justify-content:center; align-items:center;  background:var(--icon); font-weight:bold; ]job[/border]
[border=0px; padding:5px;width: 100px; height:20px; box-sizing:border-box;  margin-left:10px; line-height:20px  ]Unemployed[/border] 
[border=0px; padding:5px; width:fit-content; height:20px;display: flex;justify-content:center; align-items:center;  background:var(--icon); font-weight:bold; ]status[/border]
[border=0px; padding:5px;width: 100px; height:20px;box-sizing:border-box;  margin-left:10px;  line-height:20px ]Married[/border] 
[/border]

[border=0px; padding:20px; height:100%; width:50%;display:flex;  flex-flow:row wrap;font-size:10px; line-height:5px; letter-spacing:0px;white-space:normal; font-family: var(--font);  box-sizing:border-box]
[border=0px; padding:5px; width:fit-content;  height:20px;display: flex;justify-content:center; align-items:center;  background:var(--icon); font-weight:bold;  ]birthday[/border]
[border=0px; padding:5pxbox-sizing:border-box; width: 90px; height:20px;  box-sizing:border-box; margin-left:10px;  line-height:10px ]31st October[/border] 
[border=0px; padding:5px; width:fit-content;  height:20px;display: flex;justify-content:center; align-items:center;  background:var(--icon); font-weight:bold; ]gender[/border]
[border=0px; padding:5px;width: 90px; height:20px;box-sizing:border-box;  margin-left:10px;  line-height:20px ]Male[/border] 
[border=0px; padding:5px; width:fit-content;  height:20px;display: flex;justify-content:center; align-items:center;  background:var(--icon); font-weight:bold; ]born[/border]
[border=0px; padding:5px;width: 90px; height:20px; box-sizing:border-box;  margin-left:10px;  line-height:20px ]Xi'an, China[/border] 
[border=0px; padding:5px; width:fit-content;  height:20px;display: flex;justify-content:center; align-items:center;  background:var(--icon);  font-weight:bold;]sexuality[/border]
[border=0px; padding:5px;width: 80px; height:20px;box-sizing:border-box;   margin-left:10px;  line-height:20px ]Demisexual[/border] 
[border=0px; padding:5px; width:fit-content; height:20px;display: flex;justify-content:center; align-items:center;  background:var(--icon); font-weight:bold; ]pronouns[/border]
[border=0px; padding:5px;width: 80px; height:20px; box-sizing:border-box;  margin-left:10px;  line-height:20px ]He/Him[/border] 

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

[border=0px; padding:0px; height:100%; width:200px; background:var(--image3); background-position:50% 1%;][/border]


[border=0px; padding:10px;max-width:250px; height:fit-content; white-space:normal;  height:450px;background:var(--hidden); box-sizing:border-box; overflow:hidden; ][border=0px; padding:0px; height:calc(100%); width:200%; overflow-y:scroll;overflow-x:hidden; line-height:14px; font-size:10px; letter-spacing:0px;white-space:normal; font-family: var(--font);backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); margin-left:-5px; ][border=0; height:auto; width:51%; box-sizing:border-box; margin-left:5px;

/*beginning of text area*/][border=0px; padding:0px; font-family: var(--title); color:var(--textbg1); font-size:20px;]information.[/border]
 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus sem enim, pellentesque nec nibh vitae, pretium aliquam arcu. Cras facilisis nibh purus, nec pretium purus sollicitudin porttitor. Duis ut tellus scelerisque, mattis diam id, condimentum velit. Vestibulum consequat, metus eu commodo facilisis, tellus nunc laoreet arcu, at ullamcorper felis turpis nec elit. Vivamus dapibus vel metus ac ultrices. Praesent faucibus sapien quis magna venenatis dapibus. Sed rhoncus tortor ut dolor semper, vitae posuere urna rutrum. Nunc eu nulla congue, suscipit diam vitae, hendrerit mi. Nullam volutpat augue eget ligula hendrerit, sit amet pretium augue consectetur. In vitae tempor nunc. Fusce et nisi tellus. Quisque mollis ornare ex, ac aliquam mauris tempus nec. Aenean a orci viverra, rhoncus mi ac, finibus nisi. Morbi ullamcorper velit sed lectus aliquet venenatis sit amet sit amet sapien. Suspendisse sit amet mauris sodales, eleifend ligula et, feugiat lorem.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus sem enim, pellentesque nec nibh vitae, pretium aliquam arcu. Cras facilisis nibh purus, nec pretium purus sollicitudin porttitor. Duis ut tellus scelerisque, mattis diam id, condimentum velit. Vestibulum consequat, metus eu commodo facilisis, tellus nunc laoreet arcu, at ullamcorper felis turpis nec elit. Vivamus dapibus vel metus ac ultrices. Praesent faucibus sapien quis magna venenatis dapibus. Sed rhoncus tortor ut dolor semper, vitae posuere urna rutrum. Nunc eu nulla congue, suscipit diam vitae, hendrerit mi. Nullam volutpat augue eget ligula hendrerit, sit amet pretium augue consectetur. In vitae tempor nunc. Fusce et nisi tellus. Quisque mollis ornare ex, ac aliquam mauris tempus nec. Aenean a orci viverra, rhoncus mi ac, finibus nisi. Morbi ullamcorper velit sed lectus aliquet venenatis sit amet sit amet sapien. Suspendisse sit amet mauris sodales, eleifend ligula et, feugiat lorem.[/border][/border][/border][/border][/border][/border]
[/border]

/*do not remove credit*/
[border=0px; padding:0px; margin:auto;white-space:normal; font-size:6px; line-height:8px;  letter-spacing:2px; text-align:center; margin-top:30px; font-family:var(-name); color:grey]coded by weldherwings[/border]
[/border]