Alerts

                            
<section class="alerts elements-page">
    <div class="container">
        <div class="alerts-block">    
            <div class="alert1">
                <div class="alert-area">
                    <h3><i class="fas fa-info"></i> Info: Lorem ipsum dolor sit amet, consectetur adipisicing elit</h3>
                    <button type="button" class="close">
                        <svg class="svg-close" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
                            <path d="M12.412,9l5.117-5.117a1.609,1.609,0,0,0,0-2.275L16.392.471a1.609,1.609,0,0,0-2.275,0L9,5.588,3.883.471a1.609,1.609,0,0,0-2.275,0L.471,1.608a1.609,1.609,0,0,0,0,2.275L5.588,9,.471,14.117a1.609,1.609,0,0,0,0,2.275l1.137,1.137a1.609,1.609,0,0,0,2.275,0L9,12.412l5.117,5.117a1.609,1.609,0,0,0,2.275,0l1.137-1.137a1.609,1.609,0,0,0,0-2.275Z" fill="#111"></path>
                        </svg>
                    </button>
                </div>
                <div class="alert-area">
                    <h3><i class="fas fa-exclamation-triangle"></i> Warning: Lorem ipsum dolor sit amet, consectetur adipisicing elit</h3>
                    <button type="button" class="close">
                        <svg class="svg-close" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
                            <path d="M12.412,9l5.117-5.117a1.609,1.609,0,0,0,0-2.275L16.392.471a1.609,1.609,0,0,0-2.275,0L9,5.588,3.883.471a1.609,1.609,0,0,0-2.275,0L.471,1.608a1.609,1.609,0,0,0,0,2.275L5.588,9,.471,14.117a1.609,1.609,0,0,0,0,2.275l1.137,1.137a1.609,1.609,0,0,0,2.275,0L9,12.412l5.117,5.117a1.609,1.609,0,0,0,2.275,0l1.137-1.137a1.609,1.609,0,0,0,0-2.275Z" fill="#111"></path>
                        </svg>
                    </button>
                </div>
                <div class="alert-area">
                    <h3><i class="fas fa-check"></i> Success: Lorem ipsum dolor sit amet, consectetur adipisicing elit</h3>
                    <button type="button" class="close">
                        <svg class="svg-close" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
                            <path d="M12.412,9l5.117-5.117a1.609,1.609,0,0,0,0-2.275L16.392.471a1.609,1.609,0,0,0-2.275,0L9,5.588,3.883.471a1.609,1.609,0,0,0-2.275,0L.471,1.608a1.609,1.609,0,0,0,0,2.275L5.588,9,.471,14.117a1.609,1.609,0,0,0,0,2.275l1.137,1.137a1.609,1.609,0,0,0,2.275,0L9,12.412l5.117,5.117a1.609,1.609,0,0,0,2.275,0l1.137-1.137a1.609,1.609,0,0,0,0-2.275Z" fill="#111"></path>
                        </svg>
                    </button>
                </div>
            </div>
        </div>
    </div>
</section>
                            
                        Copy to clipboard
                        

                            
<section class="alerts elements-page">
    <div class="container">
        <div class="alerts-block">    
            <div class="alert2">
                <div class="alert-area">
                    <h3><i class="fas fa-info"></i> Info: Lorem ipsum dolor sit amet, consectetur adipisicing elit</h3>
                    <button type="button" class="close">
                        <svg class="svg-close" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
                            <path d="M12.412,9l5.117-5.117a1.609,1.609,0,0,0,0-2.275L16.392.471a1.609,1.609,0,0,0-2.275,0L9,5.588,3.883.471a1.609,1.609,0,0,0-2.275,0L.471,1.608a1.609,1.609,0,0,0,0,2.275L5.588,9,.471,14.117a1.609,1.609,0,0,0,0,2.275l1.137,1.137a1.609,1.609,0,0,0,2.275,0L9,12.412l5.117,5.117a1.609,1.609,0,0,0,2.275,0l1.137-1.137a1.609,1.609,0,0,0,0-2.275Z" fill="#111"></path>
                        </svg>
                    </button>
                </div>
                <div class="alert-area">
                    <h3><i class="fas fa-exclamation-triangle"></i> Warning: Lorem ipsum dolor sit amet, consectetur adipisicing elit</h3>
                    <button type="button" class="close">
                        <svg class="svg-close" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
                            <path d="M12.412,9l5.117-5.117a1.609,1.609,0,0,0,0-2.275L16.392.471a1.609,1.609,0,0,0-2.275,0L9,5.588,3.883.471a1.609,1.609,0,0,0-2.275,0L.471,1.608a1.609,1.609,0,0,0,0,2.275L5.588,9,.471,14.117a1.609,1.609,0,0,0,0,2.275l1.137,1.137a1.609,1.609,0,0,0,2.275,0L9,12.412l5.117,5.117a1.609,1.609,0,0,0,2.275,0l1.137-1.137a1.609,1.609,0,0,0,0-2.275Z" fill="#111"></path>
                        </svg>
                    </button>
                </div>
                <div class="alert-area">
                    <h3><i class="fas fa-check"></i> Success: Lorem ipsum dolor sit amet, consectetur adipisicing elit</h3>
                    <button type="button" class="close">
                        <svg class="svg-close" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
                            <path d="M12.412,9l5.117-5.117a1.609,1.609,0,0,0,0-2.275L16.392.471a1.609,1.609,0,0,0-2.275,0L9,5.588,3.883.471a1.609,1.609,0,0,0-2.275,0L.471,1.608a1.609,1.609,0,0,0,0,2.275L5.588,9,.471,14.117a1.609,1.609,0,0,0,0,2.275l1.137,1.137a1.609,1.609,0,0,0,2.275,0L9,12.412l5.117,5.117a1.609,1.609,0,0,0,2.275,0l1.137-1.137a1.609,1.609,0,0,0,0-2.275Z" fill="#111"></path>
                        </svg>
                    </button>
                </div>
            </div>
        </div>
    </div>
</section>
                            
                        Copy to clipboard
                        

                            
<section class="alerts elements-page">
    <div class="container">
        <div class="alerts-block">    
            <div class="alert3">
                <div class="alert-area">
                    <h3><i class="fas fa-info"></i> Info: Lorem ipsum dolor sit amet, consectetur adipisicing elit</h3>
                    <button type="button" class="close">
                        <svg class="svg-close" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
                            <path d="M12.412,9l5.117-5.117a1.609,1.609,0,0,0,0-2.275L16.392.471a1.609,1.609,0,0,0-2.275,0L9,5.588,3.883.471a1.609,1.609,0,0,0-2.275,0L.471,1.608a1.609,1.609,0,0,0,0,2.275L5.588,9,.471,14.117a1.609,1.609,0,0,0,0,2.275l1.137,1.137a1.609,1.609,0,0,0,2.275,0L9,12.412l5.117,5.117a1.609,1.609,0,0,0,2.275,0l1.137-1.137a1.609,1.609,0,0,0,0-2.275Z" fill="#111"></path>
                        </svg>
                    </button>
                </div>
                <div class="alert-area">
                    <h3><i class="fas fa-exclamation-triangle"></i> Warning: Lorem ipsum dolor sit amet, consectetur adipisicing elit</h3>
                    <button type="button" class="close">
                        <svg class="svg-close" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
                            <path d="M12.412,9l5.117-5.117a1.609,1.609,0,0,0,0-2.275L16.392.471a1.609,1.609,0,0,0-2.275,0L9,5.588,3.883.471a1.609,1.609,0,0,0-2.275,0L.471,1.608a1.609,1.609,0,0,0,0,2.275L5.588,9,.471,14.117a1.609,1.609,0,0,0,0,2.275l1.137,1.137a1.609,1.609,0,0,0,2.275,0L9,12.412l5.117,5.117a1.609,1.609,0,0,0,2.275,0l1.137-1.137a1.609,1.609,0,0,0,0-2.275Z" fill="#111"></path>
                        </svg>
                    </button>
                </div>
                <div class="alert-area">
                    <h3><i class="fas fa-check"></i> Success: Lorem ipsum dolor sit amet, consectetur adipisicing elit</h3>
                    <button type="button" class="close">
                        <svg class="svg-close" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18">
                            <path d="M12.412,9l5.117-5.117a1.609,1.609,0,0,0,0-2.275L16.392.471a1.609,1.609,0,0,0-2.275,0L9,5.588,3.883.471a1.609,1.609,0,0,0-2.275,0L.471,1.608a1.609,1.609,0,0,0,0,2.275L5.588,9,.471,14.117a1.609,1.609,0,0,0,0,2.275l1.137,1.137a1.609,1.609,0,0,0,2.275,0L9,12.412l5.117,5.117a1.609,1.609,0,0,0,2.275,0l1.137-1.137a1.609,1.609,0,0,0,0-2.275Z" fill="#111"></path>
                        </svg>
                    </button>
                </div>
            </div>
        </div>
    </div>
</section>
                            
                        Copy to clipboard