@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap');

.customheader {
    display: flex;
    align-items: center;
    justify-content: center; /* Center the entire content */
    position: relative; /* Establish a positioning context for absolute positioning */
    width: 100%;
    padding-top: 10px; /* Adjust padding as needed */
    padding-bottom: 10px; /* Adjust padding as needed */
}

.customheader > h1 {
    font-family: 'Manrope', sans-serif !important;
    color: #164293 !important;
    font-size: 3em !important;
    margin: 0px;
    text-align: center; /* Center the h1 text */
    position: relative; /* Can be set but isn't strictly necessary */
    flex-grow: 1; /* Ensure it takes up available space */
    z-index: 1; /* Set a lower z-index for the h1 */
}

.customheader > a {
    position: absolute; /* Remove the image from the document's flow */
    left: 10px; /* Positioning based on the desired left margin */
    top: 50%; /* Center vertically based on the height of the parent */
    transform: translateY(-50%); /* Adjust for the height of the image */
    z-index: 2; /* Set a higher z-index for the anchor so it's in front */
}

.customheader > a > img {
    vertical-align: top;
    width: 180px;
    height: 52.5px; /* Fixed size */
}

/* Media Query to stack image and text on smaller screens */
@media (max-width: 1000px) {
    .customheader {
        flex-direction: row; /* Stack elements vertically */
        align-items: center; /* Center elements horizontally */
    }

    .customheader > a {
        position: relative; /* Return to normal flow */
        top: auto; /* Remove top positioning */
        transform: none; /* Remove transform */
        padding-right: 10px;
    }

    .customheader > h1 {
        text-align: center; /* Ensure text remains centered */
        margin: 0; /* No margin */
    }
}
/* Not sure what this is - hus1yok@bosch.com */
#likes-section  {  
display:none;  
}