Make image higher than wrapping div and starting from very bottom

I am not able to position an image within a div so that:

1. it's higher than the div and sticks out
2. starts at the very bottom of the div (there is a small gap that I can't close)

This is the relevant HTML:

 <div class="teaser-image-wrapper">
   <div class="wrap">
    <img class="image2 more-height" src="images/svg/creativeyou.svg" alt="Creative You! Title Image">
   </div>
 </div>

And the CSS I have:

.teaser-image-wrapper {
    background-color: #83ffcd;
    width: 100% !important;
    margin: 
}

.wrap {
    width: 80%;
}

.teaser-image-wrapper img {
    padding: 0 !important;
    object-fit: contain;
    max-height: 75vh;
    max-width: 100%;
    line-height: 0;
}

Here is an image for reference: The greenish background of the wrapper (.teaser-image-wrapper) should be lower than the image (svg) that should stick out on the top. Also, notice the little gap at the bottom.

Thank you for any hints

The easiest way to achieve something like this could be to use position absolute and relative. Maybe try setting the class wrap to relative and the image absolute, with

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-html -->

left:0;
right:0;
bottom:0;

<!-- end snippet -->

and then play around with the position of 'top', can then set a height of the wrap class to try and achieve the desired effect. May be better ways to do this but without playing about with it this is what is off the top of my head. hope this helps

OK, after some tinkering solved it.

I wanted to achieve this:

This is the CSS. I basically push the wrapper - div down while pulling the image inside up.

.teaser-image-wrapper {
    max-width: 80%;
    margin: 40vh 10% 0;
    padding: 0;
    line-height: 0;
}

.wrap {
    width: 100%;
    background-color: #83ffcd;
    height: 50vh;
    margin-top: 25vh;
}


.teaser-image-wrapper img {
    padding: 0 !important;
    object-fit: cover;
    height: 75vh;
    width: 100%;
    line-height: 0;
    position: relative;
    margin-top: -25vh;
}