css-bootstrap.css

/**
 * iPhone X notch: Remove the white bars in Safari
 * It's needed to include the "viewport-fit=cover" directive in the html. For example:
 * <meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover">
 *
 * More info: http://stephenradford.me/removing-the-white-bars-in-safari-on-iphone-x/
 */
.wrapper {
    background-color: red;
	padding: env(safe-area-inset-top) 
			 env(safe-area-inset-right) 
			 env(safe-area-inset-bottom) 
			 env(safe-area-inset-left);
}

/**
 * Customize the scroll overflow effect
 * Possible values are auto, contain and none
 *
 * More info: https://developers.google.com/web/updates/2017/11/overscroll-behavior
 */
body {
    overscroll-behavior: contain;
}

/**
 * Fixed blurred images on scale in chrome
 *
 * More info: https://medium.freecodecamp.org/-898b38a6c0e1
 */
img {
    image-rendering: -webkit-optimize-contrast;
}

thanks for letting me know.
Fixed!