Applying SVG and Path to a color section.

I am trying to duplicate a template I found online and don’t know how to achieve the same effect in enfold. I’m trying to copy the transitions in sections with the slanted down arrow.

Here is the site: http://cleanco-demo.detheme.com/

I see this is done using SVG and Paths but dont know enough CSS to know how to impliment this. Is it possible through the Custom CSS section and assigning IDs and Classes to color sections?

<div id=”module_dt_separator_8″ class=”module_dt_separator”>
<section style=”height: 100px; position: relative;” class=”vc_custom_1415591662848″>
<svg class=”separator_type_5_path” preserveAspectRatio=”none” viewBox=”0 0 100 100″ height=”100″ width=”100%” version=”1.1″ xmlns=”http://www.w3.org/2000/svg”&gt; <path d=”M0 0 L50 100 L100 0 L100 101 L0 101 Z” fill=”#ffffff”></path>
<path d=”M0 -1 L0 0 L50 100 L100 0 L100 -1 Z” fill=”#35495d”></path> <path d=”M0 0 L50 100 L100 0″ fill=”none” stroke=”#ffffff” stroke-width=”0″></path> </svg> <h6> </h6>
</section>
</div>