<div class="diagonal"></div>
.diagonal {
position: absolute;
height: 50rem;
width: 100%;
display: inline-block;
}
.diagonal:before {
position: absolute;
content: '';
border-style: solid;
border-width: 0 0 66vw 100vw;
border-color: #002b37 #409cdc #409cdc #002b37;
}
.diagonal:after {
position: absolute;
content: '';
border-style: solid;
border-width: 0 100vw 66vw 0;
border-color: #2ba198 transparent #2ba198 transparent;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.