/* to give space between the menu and picture by adding a ghost element with 60px*/
 body::before {
    display: block;
    content: '';
    height: 60px;
}  

@media(min-width: 576px) {
    .shortBrandName {
        display: none;
        content: '';
    }
    .brandName {
        display: inline;
        content: '';
    }

}

@media(max-width: 576px) {
    .shortBrandName {
        display: inline;
        content: '';
    }
    .brandName {
        display: none;
        content: '';
    }

}