bootstrap formを中央揃えする方法が知りたい

提示コードですがbootstrapライブラリを使ってformを使ってログインフォームを作ってるんですが画面中央揃えにする方法がわかりません。center-blockをdivタグで囲いましたが変化がありません。このような場合はどこにcenter-blockを記述するのでしょうか？

参考サイト：https://getbootstrap.jp/docs/5.0/forms/layout/

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width">    
6    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
7    <link rel="stylesheet" href="style.css">
8
9    <title> ログイン</title>
10</head>
11    <body>
12
13    <div class="container">
14        <header>
15                <h1 class="text-center">ログイン</h1>               
16        </header>
17    </div>
18
19    <hr>
20    <hr>
21        <div class="container">
22
23        <form action="login.php" method="post">
24            <div class="mb-3 mx-auto">
25                <label for="exampleInputEmail1" class="form-label text">Email address</label>
26                <input type="email" class="form-control mailInput" name="mail">
27            </div>
28
29            <div class="mb-3">
30                <label class="form-label text">Password</label>
31                <input type="password" class="form-control text passwordInput" name="password">
32            </div>
33
34            <button type="submit" class="btn btn-primary">Submit</button>
35        </form>
36
37        </div>
38        <div class="container">
39            <footter>
40                <p>フッダー</p>
41            </footter>
42
43        </div>
44
45    </body>
46</html>
47
48
49
50