Alert Bootstrap4 style02

<!DOCTYPE html>
<html>
<head>
	<title>ALERT BOOTSTRAP4 STYLE02 | par NGLESSON</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta name="keyword" content="ALERT BOOTSTRAP4 STYLE02">
	<meta name="author" content="Mezgani said">
	<meta name="copyright" content="NGLESSON">
	<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
	<link href="style.css" rel="stylesheet">
</head>
<body>
	<div class="notif-msg">
		<div class="alert alert-success alert-dismissible">
			<button type="button" class="close" data-dismiss="alert">&times;</button>
			<strong><i class="fa fa-check"></i> Aththentification avec succéss.</strong>
		</div>
		<div class="alert alert-danger alert-dismissible">
			<button type="button" class="close" data-dismiss="alert">&times;</button>
			<strong><i class="fa fa-warning"></i> Le nom de l'utilisateur ou le mot de passe est incorrect.</strong>
		</div>
		<div class="alert alert-warning alert-dismissible">
			<button type="button" class="close" data-dismiss="alert">&times;</button>
			<strong><i class="fa fa-signal"></i> Vérifiez votre connexion.</strong>
		</div>
	</div>

	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>                       
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script> 
</body>
</html>
.notif-msg{
    position: fixed;
    top: 0px;
    right: 0px;
    z-index: 999;
    width: 40%;
}
.alert{
    border-radius: 0px;
    padding: 15px;
    background-color: #fafafa;
    border-left: 6px solid #fafafa;
    margin-bottom: 10px;
    -webkit-box-shadow: 0 5px 8px -6px rgba(0,0,0,.2);
    -moz-box-shadow: 0 5px 8px -6px rgba(0,0,0,.2);
    box-shadow: 0 5px 8px -6px rgba(0,0,0,.2);
}
.alert-danger{border-left: 6px solid #DC143C;color: #DC143C;}
.alert-warning{border-left: 6px solid #F4821F;color: #F4821F;}
.alert-success{border-left: 6px solid #33b35a;color: #33b35a;}

                                    
Triangle Background css 01

Triangle Background css 01

Scroll down button 01

Scroll down button 01

Page construction avec compte à rebours style02

Page construction avec compte à rebours style02

Lightbox gallery style01

Lightbox gallery style01

Image hover Inspiration styles

Image hover Inspiration styles

Image hover 03

Image hover 03

Gallery images with bootstrap4 Flexbox

Gallery images with bootstrap4 Flexbox

Footer Responsive avec Bootstrap4

Footer Responsive avec Bootstrap4

Cards box with title

Cards box with title

Card Profile Style01

Card Profile Style01

Card Panel Bootstrap4 with header and footer

Card Panel Bootstrap4 with header and footer

Bootstrap Cookie Alert pages

Bootstrap Cookie Alert pages