HELP with the CSS code to align top and bottom of two, separate, side by side image blocks.

Looking for HELP with the CSS code to align top and bottom of two side by side image blocks.

One img is a single image block the second is a gallery block slideshow. On desktop and tablet they need to be side by side and same height with a small space between them - top and bottom aligned. See images. 

Mobile  - phone is fine - images can stack. No action needed.

For the Tablet view I cannot get the two blocks to align on the bottom, see images for details.

Help?

Thx.

Password to site Browne

Website: https://dbmd.squarespace.com

PW Browne

Home page issue 

It looks like you figured it out. Can you share the solution?

//Align image block/slideshow on Tablet 
@media only screen and (min-width: 768px) {
.fe-block-yui_3_17_2_1_1678489122954_35635 .sqs-block { 
  justify-content: flex-end!important;
  }
}

I have a new question - I have this: Fire is a Tool®. How do you make the ® smaller and located at the top right side of a H1. And add color....

<h1>Fire is a Tool<span style="color: #E01D38; vertical-align: super; font-size: 27px">®</span></h1> 

Fire is a tool ends up being black and the ® is red... I need the entire phrase to be red.

On 4/12/2023 at 5:33 AM, IcIt said:

I have a new question - I have this: Fire is a Tool®. How do you make the ® smaller and located at the top right side of a H1. And add color....

<h1>Fire is a Tool<span style="color: #E01D38; vertical-align: super; font-size: 27px">®</span></h1> 

 

Fire is a tool ends up being black and the ® is red... I need the entire phrase to be red.

Can you share link to page where you added this text?