﻿

.stack-top {
    /* adjust the below to control the shape */
    --d: 0px;
    --g: 21px;
    --c: green;
    --w: 120px;
    /**/
    width: var(--w) !important;
    position: absolute;
    bottom: 7px;
    left:0px;
    transform: translate(29.29%, -100%) rotate(-45deg); /* 29.29% = 100%*(1 - cos(45deg)) */
    /*-webkit-transform: scaleX(-1);
    transform: scaleX(-1);*/
    text-align: center;
    width: 100px;
    transform-origin: top left;
    padding: 5px 0 calc(var(--d) + 5px);
    background: linear-gradient(135deg, transparent var(--g), var(--c) calc(var(--g) - 0.3px)) left, linear-gradient(-135deg,transparent var(--g), var(--c) calc(var(--g) - 0.3px)) right;
    background-size: 51% 100%;
    background-repeat: no-repeat;
    clip-path: polygon(0 0,100% 0,100% 100%, calc(100% - var(--d)) calc(100% - var(--d)), var(--d) calc(100% - var(--d)),0 100%);
    color:white;
   

}
