CSS to display a zigzag profile on top and bottom of an HTML element. Class 'zigzag'

zizag.css

.zigzag::after {
    content:'';
    display:block;
    height:10px;
    background:repeating-linear-gradient(
            -45deg,
            transparent ,
            transparent  50%,
            #006ab7 50%,
            #006ab7
    )
    bottom,
    repeating-linear-gradient(
            45deg,
            transparent ,
            transparent  50%,
            #006ab7 50%,
            #006ab7
    )
    bottom;
    background-size:10px 10px;
    background-repeat:repeat-x;
    box-shadow:0 -100px/* or bigger */ 0 100px transparent;/* this to fill background of parent div */
}

.zigzag::before {
    content:'';
    display:block;
    height:10px;
    background:repeating-linear-gradient(
            -135deg,
            transparent ,
            transparent  50%,
            #006ab7 50%,
            #006ab7
    )
    top,
    repeating-linear-gradient(
            135deg,
            transparent ,
            transparent  50%,
            #006ab7 50%,
            #006ab7
    )
    top;
    background-size:10px 10px;
    background-repeat:repeat-x;
    box-shadow:0 -100px/* or bigger */ 0 100px transparent;/* this to fill background of parent div */
}

thanks!