MatDialog moved after switching to custom theme

Question

I'm developing a project using Angular Material. I'm using MatDialog to open a dialog box. All of this worked perfectly.

Now I created my own theme because I wanted to change colors and typography. But when I activate this new theme, the dialog box is moved down.

Do I have to define something in the theme for MatDialog?

Excerpt from angular.json

"architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:application",
          "options": {
            "outputPath": "dist/vp-1-frontend",
            "index": "src/index.html",
            "browser": "src/main.ts",
            "polyfills": ["zone.js"],
            "tsConfig": "tsconfig.app.json",
            "inlineStyleLanguage": "scss",
            "assets": ["src/favicon.ico", "src/assets"],
            "styles": [
              "src/my-theme.scss",
              "src/styles.scss"
            ],
            "scripts": []
          },

my-theme.scss

@use '@angular/material' as mat;

$md-planavitapalette: (
    50 : #e1e5e8,
    100 : #b3bfc6,
    200 : #8094a0,
    300 : #4d6979,
    400 : #27485d,
    500 : #012840,
    600 : #01243a,
    700 : #011e32,
    800 : #01182a,
    900 : #000f1c,
    A100 : #5a98ff,
    A200 : #2778ff,
    A400 : #005bf3,
    A700 : #0052da,
    contrast: (
        50 : #000000,
        100 : #000000,
        200 : #000000,
        300 : #ffffff,
        400 : #ffffff,
        500 : #ffffff,
        600 : #ffffff,
        700 : #ffffff,
        800 : #ffffff,
        900 : #ffffff,
        A100 : #000000,
        A200 : #ffffff,
        A400 : #ffffff,
        A700 : #ffffff,
    )
);

$my-primary: mat.define-palette($md-planavitapalette);
$my-accent: mat.define-palette(mat.$indigo-palette, A200, A100, A400);
$my-warn: mat.define-palette(mat.$red-palette);

$my-typography: mat.define-typography-config(
    $headline-6: mat.define-typography-level($font-family: Helvetica, $font-size: 1.6rem)
);


$my-theme: mat.define-light-theme((
 color: (
   primary: $my-primary,
   accent: $my-accent,
   warn: $my-warn,
 ),
 density: 0,
));

@include mat.all-component-themes($my-theme);
@include mat.typography-hierarchy($my-typography);

I just figured out that the container with the content is simply added to the end of the content and not above it.