css folded corner

1.back-ground
2{
3    background-image: url('http://pencil.my/assets/img/dashboard/bg.png');
4    background-repeat: repeat;
5    overflow-x: hidden;
6}
7.note {
8    position: relative;
9    width: 30px;
10    padding: 1em 1.5em;
11    margin: 2em auto;
12    color: #fff;
13    background: #97C02F;
14    overflow: hidden;
15    border-radius: 4px;
16}
17
18.note:before {
19    content: "";
20    position: absolute;
21    top: 0;
22    right: 0;
23    border-width: 0 16px 16px 0;
24    border-style: solid;
25    border-color: #fff #fff #658E15 #658E15;
26    background: #658E15;
27    display: block;
28    width: 0;
29    -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2);
30    -moz-box-shadow: 0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2);
31    box-shadow: 0 1px 1px rgba(0,0,0,0.3), -1px 1px 1px rgba(0,0,0,0.2);
32}

1<div class="back-ground">
2 <div class="note">
3    Sample note
4 </div>
5</div>