.polygon-tr-bl {
    -webkit-clip-path: polygon(0% 0%, 90% 0%, 100% 10%, 100% 100%, 10% 100%, 0% 90%);
    clip-path: polygon(0% 0%, 90% 0%, 100% 10%, 100% 100%, 10% 100%, 0% 90%);
}

.polygon-tl-br {
    -webkit-clip-path: polygon(10% 0%, 100% 0%, 100% 90%, 90% 100%, 0% 100%, 0% 10%);
    clip-path: polygon(10% 0%, 100% 0%, 100% 90%, 90% 100%, 0% 100%, 0% 10%);
}

.polygon-all {
    -webkit-clip-path: polygon(10% 0%,
            90% 0%,
            100% 10%,
            100% 90%,
            90% 100%,
            10% 100%,
            0% 90%,
            0% 10%);
    clip-path: polygon(10% 0%,
            90% 0%,
            100% 10%,
            100% 90%,
            90% 100%,
            10% 100%,
            0% 90%,
            0% 10%);
}

.msg-id {
    -webkit-clip-path: polygon(0% 0%, calc(95% - 5px) 0%, 100% 30%, 100% 100%, calc(5% + 5px) 100%, 0% 70%);
    clip-path: polygon(0% 0%, calc(95% - 5px) 0%, 100% 30%, 100% 100%, calc(5% + 5px) 100%, 0% 70%);
}

.msg-msg {
    -webkit-clip-path: polygon(calc(5% + 5px) 0%, 100% 0%, 100% 70%, calc(95% - 5px) 100%, 0% 100%, 0% 30%);
    clip-path: polygon(calc(5% + 5px) 0%, 100% 0%, 100% 70%, calc(95% - 5px) 100%, 0% 100%, 0% 30%);
}

.item-all-btn {
    -webkit-clip-path: polygon(0% 0%, calc(95% - 5px) 0%, 100% 30%, 100% 100%, calc(5% + 5px) 100%, 0% 70%);
    clip-path: polygon(0% 0%, calc(95% - 5px) 0%, 100% 30%, 100% 100%, calc(5% + 5px) 100%, 0% 70%);
}