Bootstrap - alert

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/css/bootstrap.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"></script>
<div class="container">
    <h1>Hello</h1>
    <div class="alert alert-warning" role="alert">
        <b>Aviso:</b> Senha incorreta
    </div>
    
    <h2>Olar:    </h2>
    <div class="alert alert-danger" role="alert">
      <b>Zona Perigosa: </b> Tu é um Otário
    </div>
    
    <h2>Rapaz...    </h2>
    <div class="alert alert-success" role="alert">
      <b> Vamo queimar: </b> 1
    </div>
</div>

CSS

.container {
    background: #f0f0f0;
}