Собственно вопрос в теме, возможно сделать 2 прозрачных блока наложенных друг на друга, но что бы один из них не накладывался на другой, а дополнял.

https://jsfiddle.net/h5zhju8n/

.heart {
    position: relative;
    width: 100px;
    height: 90px;
}
.heart:before {
	border-left: 1px solid;
	border-bottom: 1px solid;
	border-top: 1px solid;
    position: absolute;
	background: rgba(0, 0, 0, 0.5) none repeat scroll 0% 0%;
    content: "";
    left: 50px;
    top: 0;
    width: 50px;
    height: 80px; 
    -moz-border-radius: 50px 50px 0 0;
    border-radius: 50px 50px 0 0;
    -webkit-transform: rotate(-45deg);
       -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
         -o-transform: rotate(-45deg);
            transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
       -moz-transform-origin: 0 100%;
        -ms-transform-origin: 0 100%;
         -o-transform-origin: 0 100%;
            transform-origin: 0 100%;
}


.heart:after {
	border-right: 1px solid;
	border-top: 1px solid;
    position: absolute;
	background: rgba(0, 0, 0, 0.5) none repeat scroll 0% 0%;
    content: "";
    left: 50px;
    top: 0;
    width: 50px;
    height: 80px; 
    -moz-border-radius: 50px 50px 0 0;
    border-radius: 50px 50px 0 0;
    -webkit-transform: rotate(-45deg);
       -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
         -o-transform: rotate(-45deg);
            transform: rotate(-45deg);
    -webkit-transform-origin: 0 100%;
       -moz-transform-origin: 0 100%;
        -ms-transform-origin: 0 100%;
         -o-transform-origin: 0 100%;
            transform-origin: 0 100%;	
    left: 0;
    -webkit-transform: rotate(45deg);
       -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
         -o-transform: rotate(45deg);
            transform: rotate(45deg);
    -webkit-transform-origin: 100% 100%;
       -moz-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
         -o-transform-origin: 100% 100%;
            transform-origin :100% 100%;
}

<div class="heart"></div>