Fold transition effect with CSS

Question

I’m using the code http://codepen.io/rsvaz83/pen/aORzBy below to create a fold transition effect on a button, but I can’t avoid the white background that is in the top left corner of the button. Which class could use to make this part transparent and thus show the yellow color, which is the background of the main DIV?

<div class="back">
    <a href="#" class="button curl-top-left">BUTTON EFFECT</a>
</div>

.back {
    background: #fc0;
}

.button {  
    display: inline-block;  
    padding: 1em;  
    margin: 1em;  
    background-color:#007E9F;  
    text-decoration: none;  
    color: white;  
}  

.curl-top-left {  
    display: inline-block;  
    position: relative;  
    -webkit-transform: translateZ(0);  
    transform: translateZ(0);  
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);  
}  

.curl-top-left:before {  
    pointer-events: none;  
    position: absolute;  
    content: '';  
    height: 0;  
    width: 0;  
    top: 0;  
    left: 0;  
    /* IE9 */  
    background: linear-gradient(135deg, white 45%, #aaaaaa 50%, #cccccc 56%, white 80%);  
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffff', endColorstr='#000000');  
    /*For IE7-8-9*/  
    z-index: 1000;  
    box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);  
    -webkit-transition-duration: 0.3s;  
    transition-duration: 0.3s;  
    -webkit-transition-property: width, height;  
    transition-property: width, height;  
}  
.curl-top-left:hover:before,
.curl-top-left:focus:before,
.curl-top-left:active:before {  
    width: 40px;  
    height: 40px; 
}  

Answer 1

You can change the background-color of the effect to yellow combined with opacity of css3.

.curl-top-left:before {
    /*alteração*/
    background: linear-gradient(135deg, transparent 45%, #fc0 30%, #fc0 50%, #fc0 60%);
    /*nova propriedade*/
    opacity: 0.7; 
}

Take a look at the Codepen

Answer 2

Missing a tag or tag p with class .btn

It wouldn’t be like this?

<div class="back">
    <p class="btn">
        <a href="#" class="button curl-top-left">BUTTON EFFECT</a>
    </p>
</div>