+30 698826 6263
Main street, Avliotes, 49081 Corfu, Greece
Book with us

Alerts

Alerts Style 1

                        
<section class="alerts">
    <div class="container">
        <div class="alerts-block">
            <h2>Alerts Style 1</h2>
            <div class="alert1">
                <div class="alert alert-info alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <svg class="svg-inline--fa fa-info" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="info" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 512" data-fa-i2svg=""><path fill="currentColor" d="M160 448h-32V224c0-17.69-14.33-32-32-32L32 192c-17.67 0-32 14.31-32 32s14.33 31.1 32 31.1h32v192H32c-17.67 0-32 14.31-32 32s14.33 32 32 32h128c17.67 0 32-14.31 32-32S177.7 448 160 448zM96 128c26.51 0 48-21.49 48-48S122.5 32.01 96 32.01s-48 21.49-48 48S69.49 128 96 128z"></path></svg>
                        <h3>Info: Lorem ipsum dolor sit amet, consectetur adipisicing elit.</h3> 
                    </div>    
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
                    <div class="alert alert-warning alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <svg class="svg-inline--fa fa-triangle-exclamation" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="triangle-exclamation" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><path fill="currentColor" d="M506.3 417l-213.3-364c-16.33-28-57.54-28-73.98 0l-213.2 364C-10.59 444.9 9.849 480 42.74 480h426.6C502.1 480 522.6 445 506.3 417zM232 168c0-13.25 10.75-24 24-24S280 154.8 280 168v128c0 13.25-10.75 24-23.1 24S232 309.3 232 296V168zM256 416c-17.36 0-31.44-14.08-31.44-31.44c0-17.36 14.07-31.44 31.44-31.44s31.44 14.08 31.44 31.44C287.4 401.9 273.4 416 256 416z"></path></svg>
                        <h3>Warning: Lorem ipsum dolor sit amet, consectetur adipiscing elit</h3>
                    </div>
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
                    <div class="alert alert-error alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <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>
                        <h3>Error: Lorem ipsum dolor sit amet, consectetur adipiscing elit</h3>
                    </div>    
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
                    <div class="alert alert-success alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <svg class="svg-inline--fa fa-check" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M438.6 105.4C451.1 117.9 451.1 138.1 438.6 150.6L182.6 406.6C170.1 419.1 149.9 419.1 137.4 406.6L9.372 278.6C-3.124 266.1-3.124 245.9 9.372 233.4C21.87 220.9 42.13 220.9 54.63 233.4L159.1 338.7L393.4 105.4C405.9 92.88 426.1 92.88 438.6 105.4H438.6z"></path></svg> 
                        <h3>success: Lorem ipsum dolor sit amet, consectetur adipiscing elit</h3>
                    </div>  
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
            </div>
        </div>
    </div>
</section>

Alerts Style 2

                        
<section class="alerts">
    <div class="container">
        <div class="alerts-block">
                <h2>Alerts Style 2</h2>
            <div class="alert2">
                <div class="alert alert-info alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <svg class="svg-inline--fa fa-info" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="info" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 512" data-fa-i2svg=""><path fill="currentColor" d="M160 448h-32V224c0-17.69-14.33-32-32-32L32 192c-17.67 0-32 14.31-32 32s14.33 31.1 32 31.1h32v192H32c-17.67 0-32 14.31-32 32s14.33 32 32 32h128c17.67 0 32-14.31 32-32S177.7 448 160 448zM96 128c26.51 0 48-21.49 48-48S122.5 32.01 96 32.01s-48 21.49-48 48S69.49 128 96 128z"></path></svg>
                        <h3>Info: Lorem ipsum dolor sit amet, consectetur adipisicing elit.</h3> 
                    </div>    
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
                    <div class="alert alert-warning alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <svg class="svg-inline--fa fa-triangle-exclamation" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="triangle-exclamation" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><path fill="currentColor" d="M506.3 417l-213.3-364c-16.33-28-57.54-28-73.98 0l-213.2 364C-10.59 444.9 9.849 480 42.74 480h426.6C502.1 480 522.6 445 506.3 417zM232 168c0-13.25 10.75-24 24-24S280 154.8 280 168v128c0 13.25-10.75 24-23.1 24S232 309.3 232 296V168zM256 416c-17.36 0-31.44-14.08-31.44-31.44c0-17.36 14.07-31.44 31.44-31.44s31.44 14.08 31.44 31.44C287.4 401.9 273.4 416 256 416z"></path></svg>
                        <h3>Warning: Lorem ipsum dolor sit amet, consectetur adipiscing elit</h3>
                    </div>
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
                    <div class="alert alert-error alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <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>
                        <h3>Error: Lorem ipsum dolor sit amet, consectetur adipiscing elit</h3>
                    </div>
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
                    <div class="alert alert-success alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <svg class="svg-inline--fa fa-check" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M438.6 105.4C451.1 117.9 451.1 138.1 438.6 150.6L182.6 406.6C170.1 419.1 149.9 419.1 137.4 406.6L9.372 278.6C-3.124 266.1-3.124 245.9 9.372 233.4C21.87 220.9 42.13 220.9 54.63 233.4L159.1 338.7L393.4 105.4C405.9 92.88 426.1 92.88 438.6 105.4H438.6z"></path></svg> 
                        <h3>success: Lorem ipsum dolor sit amet, consectetur adipiscing elit</h3>
                    </div>
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
            </div>
        </div>
    </div>
</section>

Alerts Style 3

                        
<section class="alerts">
    <div class="container">
        <div class="alerts-block">
                <h2>Alerts Style 3</h2>
            <div class="alert2">
                <div class="alert alert-info alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <svg class="svg-inline--fa fa-info" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="info" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 512" data-fa-i2svg=""><path fill="currentColor" d="M160 448h-32V224c0-17.69-14.33-32-32-32L32 192c-17.67 0-32 14.31-32 32s14.33 31.1 32 31.1h32v192H32c-17.67 0-32 14.31-32 32s14.33 32 32 32h128c17.67 0 32-14.31 32-32S177.7 448 160 448zM96 128c26.51 0 48-21.49 48-48S122.5 32.01 96 32.01s-48 21.49-48 48S69.49 128 96 128z"></path></svg>
                        <h3>Info: Lorem ipsum dolor sit amet, consectetur adipisicing elit.</h3> 
                    </div>
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
                    <div class="alert alert-warning alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <svg class="svg-inline--fa fa-triangle-exclamation" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="triangle-exclamation" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><path fill="currentColor" d="M506.3 417l-213.3-364c-16.33-28-57.54-28-73.98 0l-213.2 364C-10.59 444.9 9.849 480 42.74 480h426.6C502.1 480 522.6 445 506.3 417zM232 168c0-13.25 10.75-24 24-24S280 154.8 280 168v128c0 13.25-10.75 24-23.1 24S232 309.3 232 296V168zM256 416c-17.36 0-31.44-14.08-31.44-31.44c0-17.36 14.07-31.44 31.44-31.44s31.44 14.08 31.44 31.44C287.4 401.9 273.4 416 256 416z"></path></svg>
                        <h3>Warning: Lorem ipsum dolor sit amet, consectetur adipiscing elit</h3>
                    </div>
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
                    <div class="alert alert-error alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <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>
                        <h3>Error: Lorem ipsum dolor sit amet, consectetur adipiscing elit</h3>
                    </div>
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
                    <div class="alert alert-success alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <svg class="svg-inline--fa fa-check" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M438.6 105.4C451.1 117.9 451.1 138.1 438.6 150.6L182.6 406.6C170.1 419.1 149.9 419.1 137.4 406.6L9.372 278.6C-3.124 266.1-3.124 245.9 9.372 233.4C21.87 220.9 42.13 220.9 54.63 233.4L159.1 338.7L393.4 105.4C405.9 92.88 426.1 92.88 438.6 105.4H438.6z"></path></svg> 
                        <h3>success: Lorem ipsum dolor sit amet, consectetur adipiscing elit</h3>
                    </div>
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
            </div>
        </div>
    </div>
</section>

Alerts Style 4

                        
<section class="alerts">
    <div class="container">
        <div class="alerts-block">
                <h2>Alerts Style 4</h2>
            <div class="alert4">
                <div class="alert alert-info alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <svg class="svg-inline--fa fa-info" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="info" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 512" data-fa-i2svg=""><path fill="currentColor" d="M160 448h-32V224c0-17.69-14.33-32-32-32L32 192c-17.67 0-32 14.31-32 32s14.33 31.1 32 31.1h32v192H32c-17.67 0-32 14.31-32 32s14.33 32 32 32h128c17.67 0 32-14.31 32-32S177.7 448 160 448zM96 128c26.51 0 48-21.49 48-48S122.5 32.01 96 32.01s-48 21.49-48 48S69.49 128 96 128z"></path></svg>
                        <h3>Info: Lorem ipsum dolor sit amet, consectetur adipisicing elit.</h3> 
                    </div>
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
                    <div class="alert alert-warning alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                    <svg class="svg-inline--fa fa-triangle-exclamation" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="triangle-exclamation" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-fa-i2svg=""><path fill="currentColor" d="M506.3 417l-213.3-364c-16.33-28-57.54-28-73.98 0l-213.2 364C-10.59 444.9 9.849 480 42.74 480h426.6C502.1 480 522.6 445 506.3 417zM232 168c0-13.25 10.75-24 24-24S280 154.8 280 168v128c0 13.25-10.75 24-23.1 24S232 309.3 232 296V168zM256 416c-17.36 0-31.44-14.08-31.44-31.44c0-17.36 14.07-31.44 31.44-31.44s31.44 14.08 31.44 31.44C287.4 401.9 273.4 416 256 416z"></path></svg>
                        <h3>Warning: Lorem ipsum dolor sit amet, consectetur adipiscing elit</h3>
                    </div>
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
                    <div class="alert alert-error alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                        <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>
                        <h3>Error: Lorem ipsum dolor sit amet, consectetur adipiscing elit</h3>
                    </div>
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
                    <div class="alert alert-success alert-dismissible fade show" role="alert">
                    <div class="alert_wrapper">
                            <svg class="svg-inline--fa fa-check" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="check" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512" data-fa-i2svg=""><path fill="currentColor" d="M438.6 105.4C451.1 117.9 451.1 138.1 438.6 150.6L182.6 406.6C170.1 419.1 149.9 419.1 137.4 406.6L9.372 278.6C-3.124 266.1-3.124 245.9 9.372 233.4C21.87 220.9 42.13 220.9 54.63 233.4L159.1 338.7L393.4 105.4C405.9 92.88 426.1 92.88 438.6 105.4H438.6z"></path></svg> 
                        <h3>success: Lorem ipsum dolor sit amet, consectetur adipiscing elit</h3>
                    </div>
                    <button type="button" class="alert-close">
                        <i class="fa-solid fa-xmark"></i>
                    </button>
                    </div>
            </div>
        </div>
    </div>
</section>
HEADER STYLE
Sticky Menu
COLOR SKINS
COLOR SCHEMES
Combo 1
Combo 2
Combo 3
Combo 4
Combo 5
Combo 6
Combo 7
Combo 8
Combo 9
Combo 10