Shrink Logo on Scroll

Use code to Custom CSS box

@media screen and (min-width: 992px) {
    .header-title {
        position:fixed;
        top: 700px;
        left: 50%;
        transform: translatex(-50%) !important;
        height: fit-content;
        transition: all 0.9s;
    }

    .header-title-logo img {
        transition: all .8s;
        max-height: unset;
        max-width: 100%;
        height: 100%;
        margin: 0 auto
    }

    .header-title-logo a {
        max-height: unset;
        max-width: unset;
        text-align: center
    }

    header#header.shrink .header-title {
        bottom: unset;
        top: 0;
        transition: all 0.9s;
    }

    header#header.shrink img {
        max-width: 40%;
    }
}