.component.logo, .component.logo a, .component.logo h1, .component.logo img {
    width: 100%;
}
/*
    This rule makes the component follow the width of the content of its surroundings rather than itself
    Useful when we want to follow the dimensions of text in footer 
*/
.component.logo.min-content {
    width: 0;
    min-width: 100%;
}

.logo img {
    object-fit: contain;
    display: block;
}