Align Hover Text on Inline Image Block

Any ideas on how I can have the hover text be positioned at the top of the block?

Thanks so much in advance!

@dplumb you can use custom code. Can you share url?

Yes, it's https://theifproject.squarespace.com/programs pw:renata

Under "internal programs", the images with the pink arrows have the hover text I'd like to be at the top of the block.

Thanks so much!Denise

@dplumb Add to Home > Design > Custom CSS

body#collection-5c59e8c1ee6eb0429890147c .sqs-block-image .image-block-outer-wrapper.layout-caption-overlay-hover .image-caption-wrapper {
   top: -50px;
}

That's so great, thank you! One last question is there a way to make the text box fill the image block? So that no scroll bar is necessary?

I so appreciate your help!

Best,Denise

@dplumb

@media screen and (min-width:901px) {
body#collection-5c59e8c1ee6eb0429890147c .sqs-block-image .image-block-outer-wrapper.layout-caption-overlay-hover .intrinsic {
   height: 20em !important;
}
}
@media screen and (max-width:900px) {
body#collection-5c59e8c1ee6eb0429890147c .sqs-block-image .image-block-outer-wrapper.layout-caption-overlay-hover .intrinsic {
   height: 32em !important;
}
}

Amazing! Thank you so much!

@dplumb You can Accept Answer if it worked. Thanks