.app {
    background:url(../img/logo.png) no-repeat center top; /* 170px x 200px */
    position:absolute!important;             /* position in the center of the screen */
    left:50%!important;
    top:50%!important;
    height:50px!important;                   /* text area height */
    width:225px!important;                   /* text area width */
    text-align:center!important;
    padding:180px 0px 0px 0px!important;     /* image height is 200px (bottom 20px are overlapped with text) */
    margin:-115px 0px 0px -112px!important;  /* offset vertical: half of image height and text area height */
                                   /* offset horizontal: half of text area width */
}

/* Landscape layout (with min-width) */
@media screen and (min-aspect-ratio: 1/1) and (min-width:400px) {
    .app {
        background-position:left center!important;
        padding:75px 0px 75px 170px!important;  /* padding-top + padding-bottom + text area = image height */
        margin:-90px 0px 0px -198px!important;  /* offset vertical: half of image height */
                                      /* offset horizontal: half of image width and text area width */
    }
}