List

                    
    <ul class ="list-style-1">
        <li>
            <div class="icon">
                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="150" viewBox="0 0 150 150">
                    <circle cx="75" cy="75" r="75" fill="#f9593a"/>
                </svg>
            </div>
            Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus. Nullam accumsan lorem in dui. Cras
            ultricies mi eu turpis hend rerit fringilla. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In ac dui quis mi
            consectetuer lacinia. Nam pretium turpis et arcu.
        </li>
        <li>
            <div class="icon">
                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="150" viewBox="0 0 150 150">
                    <circle cx="75" cy="75" r="75" fill="#f9593a"/>
                </svg>
            </div>
            Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus. Nullam accumsan lorem in dui. Cras
            ultricies mi eu turpis hend rerit fringilla.
        </li>
        <li>
            <div class="icon">
                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="150" viewBox="0 0 150 150">
                    <circle cx="75" cy="75" r="75" fill="#f9593a"/>
                </svg>
            </div>
            Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus
        </li>
    </ul>
                       Copy to clipboard
                   

                       
    <ul class="list-style-2">
        <li>
            <div class="icon">
                <svg xmlns="http://www.w3.org/2000/svg" width="206.25" height="150" viewBox="0 0 206.25 150">
                    <g transform="translate(0 -0.004)">
                        <path d="M3.02,81.68a9.883,9.883,0,0,1,0-14.224L17.6,53.233a10.5,10.5,0,0,1,14.584,0L77.344,97.272,174.062,2.946a10.5,10.5,0,0,1,14.584,0L203.23,17.169a9.883,9.883,0,0,1,0,14.224L84.636,147.054a10.5,10.5,0,0,1-14.584,0Z" transform="translate(0 0.004)" fill="#222"/>
                    </g>
                </svg>
            </div>
            Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus. Nullam accumsan lorem in dui. Cras
            ultricies mi eu turpis hend rerit fringilla. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In ac dui quis mi
            consectetuer lacinia. Nam pretium turpis et arcu. 
        </li>
        <li>
            <div class="icon">
                <svg xmlns="http://www.w3.org/2000/svg" width="206.25" height="150" viewBox="0 0 206.25 150">
                <g transform="translate(0 -0.004)">
                    <path d="M3.02,81.68a9.883,9.883,0,0,1,0-14.224L17.6,53.233a10.5,10.5,0,0,1,14.584,0L77.344,97.272,174.062,2.946a10.5,10.5,0,0,1,14.584,0L203.23,17.169a9.883,9.883,0,0,1,0,14.224L84.636,147.054a10.5,10.5,0,0,1-14.584,0Z" transform="translate(0 0.004)" fill="#222"/>
                </g>
                </svg>
            </div>
            Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus. Nullam accumsan lorem in dui. Cras
            ultricies mi eu turpis hend rerit fringilla.
        </li>
        <li>
            <div class="icon">
                <svg xmlns="http://www.w3.org/2000/svg" width="206.25" height="150" viewBox="0 0 206.25 150">
                    <g transform="translate(0 -0.004)">
                        <path d="M3.02,81.68a9.883,9.883,0,0,1,0-14.224L17.6,53.233a10.5,10.5,0,0,1,14.584,0L77.344,97.272,174.062,2.946a10.5,10.5,0,0,1,14.584,0L203.23,17.169a9.883,9.883,0,0,1,0,14.224L84.636,147.054a10.5,10.5,0,0,1-14.584,0Z" transform="translate(0 0.004)" fill="#222"/>
                    </g>
                </svg>
            </div>
            Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus
        </li>
    </ul>
                       Copy to clipboard
                   

                       
    <ul class="list-style-3">
        <li>
            <div class="icon">
                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="150" viewBox="0 0 150 150">
                    <path data-name="Union 7" d="M0,75.007A75,75,0,1,1,75.007,150,75.085,75.085,0,0,1,0,75.007Zm15,0A60,60,0,1,0,75.007,15,60.073,60.073,0,0,0,15,75.007Zm15,0a45,45,0,1,1,45.009,45A45.015,45.015,0,0,1,30,75.007Z" fill="#333"/>
                </svg>
            </div>
                Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus. Nullam accumsan lorem in dui. Cras
                ultricies mi eu turpis hend rerit fringilla. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In ac dui quis mi
                consectetuer lacinia. Nam pretium turpis et arcu. 
        </li>
        <li>
            <div class="icon">
                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="150" viewBox="0 0 150 150">
                    <path data-name="Union 7" d="M0,75.007A75,75,0,1,1,75.007,150,75.085,75.085,0,0,1,0,75.007Zm15,0A60,60,0,1,0,75.007,15,60.073,60.073,0,0,0,15,75.007Zm15,0a45,45,0,1,1,45.009,45A45.015,45.015,0,0,1,30,75.007Z" fill="#333"/>
                </svg>
            </div>
            Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus. Nullam accumsan lorem in dui. Cras
            ultricies mi eu turpis hend rerit fringilla.
        </li>
        <li>
            <div class="icon">
                <svg xmlns="http://www.w3.org/2000/svg" width="150" height="150" viewBox="0 0 150 150">
                    <path data-name="Union 7" d="M0,75.007A75,75,0,1,1,75.007,150,75.085,75.085,0,0,1,0,75.007Zm15,0A60,60,0,1,0,75.007,15,60.073,60.073,0,0,0,15,75.007Zm15,0a45,45,0,1,1,45.009,45A45.015,45.015,0,0,1,30,75.007Z" fill="#333"/>
                </svg>
            </div>
            Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus
        </li>
    </ul>
                       Copy to clipboard
                   

                       
    <ul class="list-style-4">
        <li>
            <div class="icon">
            <svg xmlns="http://www.w3.org/2000/svg" width="150" height="200" viewBox="0 0 150 200">
                <g transform="translate(0 200) rotate(-90)">
                    <path d="M13.457,0H186.543c11.974,0,17.961,19.122,9.485,30.329L109.519,144.8c-5.247,6.937-13.79,6.937-19.037,0L3.972,30.329C-4.5,19.122,1.483,0,13.457,0Z" transform="translate(0)" fill="#222"/>
                </g>
            </svg>
            </div>
            Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus. Nullam accumsan lorem in dui. Cras
            ultricies mi eu turpis hend rerit fringilla. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In ac dui quis mi
            consectetuer lacinia. Nam pretium turpis et arcu. 
        </li>
        <li>
            <div class="icon">
            <svg xmlns="http://www.w3.org/2000/svg" width="150" height="200" viewBox="0 0 150 200">
                <g transform="translate(0 200) rotate(-90)">
                    <path d="M13.457,0H186.543c11.974,0,17.961,19.122,9.485,30.329L109.519,144.8c-5.247,6.937-13.79,6.937-19.037,0L3.972,30.329C-4.5,19.122,1.483,0,13.457,0Z" transform="translate(0)" fill="#222"/>
                </g>
            </svg>
            </div>
            Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus. Nullam accumsan lorem in dui. Cras
            ultricies mi eu turpis hend rerit fringilla.    
        </li>
        <li>
            <div class="icon">
            <svg xmlns="http://www.w3.org/2000/svg" width="150" height="200" viewBox="0 0 150 200">
                <g transform="translate(0 200) rotate(-90)">
                    <path d="M13.457,0H186.543c11.974,0,17.961,19.122,9.485,30.329L109.519,144.8c-5.247,6.937-13.79,6.937-19.037,0L3.972,30.329C-4.5,19.122,1.483,0,13.457,0Z" transform="translate(0)" fill="#222"/>
                </g>
            </svg>
            </div>
            Fusce vulputate eleifend sapien. Vestibulum purus quam, scelerisque ut, mollis sed, nonummy id, metus
        </li>
    </ul>
                       Copy to clipboard