CSS
.trampos{
width: 300px;
height: 300px;
top:calc(50% - 150px);
left:calc(50% - 150px);
position: absolute;
}
.triangle{
width: 150px;
height: 100px;
float:left;
}
.red:before, .black:before, .green:before{
content: "";
width: 0;
height: 0;
display: block;
}
.red:before, .green:before{
top: 75px;
position: relative;
z-index: -1;
border-left: 103px solid transparent;
border-right: 103px solid transparent;
}
.red:before {
border-bottom: 165px solid #DF6B54;
}
.black:before {
z-index: 9999;
margin-top: 150px;
right: 60px;
position: relative;
border-left: 60px solid transparent;
border-right: 60px solid transparent;
border-bottom: 90px solid #564E4D;
}
.green:before {
position: absolute;
right: 0px;
top: 75px;
border-bottom: 165px solid #63C193;
}
