CHAN CODE [WIP]

<style type="text/css">
@import url('https://fonts.googleapis.com/css?family=Antic+Slab|Niconne|Lobster+Two|Poiret+One');

body {
background-color: white;
background-image: linear-gradient(to top right, #c11d3c, #814142);
background-position: center;
background-size: 100%;
background-repeat:no-repeat;
}

#thaibrows {
position: fixed;
left: 0px;
right: 0px;
top: 0px;
bottom: 0px;
}

::-webkit-scrollbar-track {
background-color:;
}

::-webkit-scrollbar-thumb {
background-color:;
}

::-webkit-scrollbar {
width:0px;
height:0px;
}

#overlay {
background: url('');
z-index: -1;
position: fixed;
background-repeat: no-repeat;
background-size: 100%;
background-position: top;
left: 0px;
top: 0px;
right: 0px;
bottom: 0px;
}

#container {
position: absolute;
left: 38%;
bottom: 8%;
height: 430px;
width: 300px;
border-radius: 70%;
border: 5px solid #814142;
box-shadow: 0px 0px 7px 7px #59292a;
background-image: url('https://www.cosmopolitan.co.id/onlyincosmo/mew-suppasit-cosmopolitan/img/mew_suppasit_2a.jpg?random&x=2');
background-size: 110%;
filter: grayscale(10%);
}

#box1 {
position: absolute;
z-index: 1;
right: -280px;
bottom: -3px;
transform: skew(-20deg);
border: 1px dotted #814142;
height: 190px;
width: 260px;
background: #d14f68;
box-shadow: 0px 0px 3px 3px #59292a;
padding: 5px;
background-image: url('http://pa1.narvii.com/7019/442199c47d936e48715298c5edca7fbb91ed0588r1-200-200_00.gif');
background-size: 100%;
background-repeat: no-repeat:
}

#raisedbox1 {
position: absolute;
z-index: 2;
right: -254px;
bottom: 7px;
width: 247px;
height: 88px;
box-shadow: 0px 0px 1px 1px #59292a;
padding: 2.5px;
transform: skew(-20deg);
background: #e687ae;
overflow-y: auto;
font-family: 'Antic Slab';
color: #59292a;
font-size: 10px;
line-height: 12px;
}

#box2 {
position: absolute;
z-index: 1;
right: -280px;
top: -3px;
transform: skew(20deg);
border: 1px dotted #814142;
height: 190px;
width: 260px;
background: #d14f68;
box-shadow: 0px 0px 3px 3px #59292a;
padding: 5px;
}

#raisedbox4 {
position: absolute;
z-index: 2;
right: -257px;
top: 7px;
width: 247px;
height: 108px;
box-shadow: 0px 0px 1px 1px #59292a;
padding: 2.5px;
transform: skew(20deg);
background: #e687ae;
overflow-y: auto;
font-family: 'Antic Slab';
color: #59292a;
font-size: 10px;
line-height: 12px;
}

#box3 {
position: absolute;
z-index: 1;
left: -280px;
top: -3px;
transform: skew(-20deg);
border: 1px dotted #814142;
height: 190px;
width: 260px;
background: #d14f68;
box-shadow: 0px 0px 3px 3px #59292a;
padding: 5px;
background-image: url('');
background-size: 90%;
background-position: top right;
background-repeat: no-repeat;
}

#raisedbox3 {
position: absolute;
z-index: 2;
left: -257px;
top: 7px;
width: 247px;
height: 108px;
box-shadow: 0px 0px 1px 1px #59292a;
padding: 2.5px;
transform: skew(-20deg);
background: #e687ae;
overflow-y: auto;
font-family: 'Antic Slab';
color: #59292a;
font-size: 10px;
line-height: 12px;
}

#box4 {
position: absolute;
z-index: 1;
left: -280px;
bottom: -3px;
transform: skew(20deg);
border: 1px dotted #814142;
height: 190px;
width: 260px;
background: #d14f68;
box-shadow: 0px 0px 3px 3px #59292a;
padding: 5px;
background-image: url('http://pa1.narvii.com/7019/442199c47d936e48715298c5edca7fbb91ed0588r1-200-200_00.gif');
background-size: 100%;
background-repeat: no-repeat;
}

#raisedbox2 {
position: absolute;
z-index: 2;
left: -254px;
bottom: 7px;
width: 247px;
height: 88px;
box-shadow: 0px 0px 1px 1px #59292a;
padding: 2.5px;
transform: skew(20deg);
background: #e687ae;
overflow-y: auto;
font-family: 'Antic Slab';
color: #59292a;
font-size: 10px;
line-height: 12px;
}

</style>
<div id="thaibrows" oncontextmenu="return false;">
<div id="overlay"></div>
<div id="container">

<div id="box1"></div>
<div id="raisedbox1">Words, words. Words.

</div>

<div id="box2"></div>
<div id="raisedbox4">

</div>

<div id="box3"></div>
<div id="raisedbox3">
<B>Surname:</B> <font style=float:right>Luo-Bunchai.</font><br>
<B>Name:</B> <font style=float:right>Channarong.</font><br>
<B>Nickname:</B> <font style=float:right>Chan.</font><br>
<B>Age:</B> <font style=float:right>28.</font><br>
<B>D.o.B.:</B> <font style=float:right>November 16th.</font><br>
<B>Zodiac:</B> <font style=float:right>Scorpio, Monkey.</font><br>
<B>P.o.B.:</B> <font style=float:right>.<font>
</div>

<div id="box4"></div>
<div id="raisedbox2">

</div>
</div>