JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" type="text/css" href="stylel.css" />
<div class="logo"><img src="http://testid.ardorgamer.com/templates/tdlstream/style/menu1_top.png"></div>
<aside class="lcol">
	<div class="block">
       <div class="block_h"></div>
        <div class="block_c">
            <ul class="navi_c">
                <li><div><a href="/">111</a></div></li>                
                <li><div><a href="/">222</a></div></li>
                <li><div><a href="/">333</a></div></li>
                <li><div><a href="/">444</a></div></li>
                <li><div><a href="/">555</a></div></li>
            </ul>
        </div>
    </div>

CSS

.logo img {
    display: block;
}

aside.lcol, aside.rcol {
    width: 240px;
}
aside.lcol .block, aside.rcol .block {
    position: relative;
    width: 240px;
    margin: 0 0 17px 0;
    background: #fff;
    -webkit-box-shadow: 0 0 4px 0 rgba(220,230,232,0.69);
    box-shadow: 0 0 4px 0 rgba(220,230,232,0.69);
    -moz-border-radius: 9px;
    -webkit-border-radius: 9px;
    border-radius: 1px;
	border-bottom-right-radius: 9px;
    border-bottom-left-radius: 9px;
}
aside.lcol .block .block_h, aside.rcol .block .block_h {

    font-family: 'NeoSansCyr-Medium', sans-serif;
    font-size: 18px;

}
aside.lcol .block .block_h span, aside.rcol .block .block_h span {
    color: #e84c3d;
    display: block;
}
aside.lcol .block .block_h::after, aside.rcol .block .block_h::after {
    position: absolute;
    right: 8px;
    bottom: 0;
    content: '';
    width: 70px;
    height: 64px;
}
aside.rcol .block:nth-child(1) .block_h::after {
    position: absolute;
    right: 9px;
    bottom: 0;
    content: '';
    background: url("images/block_4_h.png") no-repeat;
    width: 73px;
    height: 64px;
}
aside.lcol .block .block_c, aside.rcol .block .block_c {
    background: url("images/sep_12.png") repeat-x;
    position: relative;
    overflow: hidden;
}
aside.lcol .block .block_c.padd, aside.rcol .block .block_c.padd {
    padding: 10px 7px;
}
aside.lcol .block:nth-child(1) {
    background: #e84c3d;
    -webkit-box-shadow: none;
    box-shadow: none;
}
aside.lcol .block:nth-child(1)::before {
    position: absolute;
    left: -37px;
    top: -21px;
    content: '';

    width: 143px;
    height: 167px;
}
aside.lcol .block:nth-child(1)::after {
    position: absolute;
    left: -29px;
    bottom: -18px;
    content: '';

    width: 110px;
    height: 129px;
    z-index: -1;
}
aside.lcol .block:nth-child(1) .block_h {
    color: #ffffff;
    text-shadow: 1px 1px 0 rgba(0,0,0,0.29);
}
aside.lcol .block:nth-child(1) .block_h span {
    color: #ffd200;
}
aside.lcol...