How can I adjust the newsletter block to have text aligned left and form and button aligned right?

I've been able to align the header title and description to the left and used a max-width of 50% to keep the text only on the left of the block but in trying to align the email form and submit button to float to the right beside the text it doesn't work. On further inspection I realized that even though the max-width is set to 50% the header title and description space still occupies the entire newsletter block. Is there a CSS workaround to achieve the layout that I want? I'm at my wits end and super frustrated at this point.

@kimcroach can you share site url?

The site isn't live and the page isn't linked...this is my first site build www.legatumco.squarespace.com/about-us

You can setup password and share url: https://beaverhero.com/squarespace-how-to/#HowtoSetupPasswordShareSiteURL

https://legatumco.squarespace.com/

@kimcroach Need access password

@tuanphan sorry about that Czk-V8A-SHy-QBB

@kimcroach When i click on about us page (you sent above)

We couldn't find the page you were looking for. This is either because:

There is an error in the URL entered into your web browser. Please check the URL and try again.The page you are looking for has been moved or deleted.You can return to our homepage by clicking here, or you can try searching for the content you are seeking by clicking here.

The page was not enabled. I've rectified that so please try again

@kimcroach Can you delete the css you used to align this form? I think so I will easily check and send new css

I've deleted the css

@kimcroach Like this? or? 1 am here. Bedtime. Which screenshot do you want?, I'll send CSS tomorrow.

@tuanphan I can't see the screenshots

@kimcroach

With the font styles of the second image, and I'd like the consent statement to be a small checkbox under the email form like the first image but with a link to our privacy policy and the subscribe button below that next to a reCAPTCHA button (but I'm not sure how to build in the reCAPTCHA.Also I'd prefer for the newsletter block to be a statement on the page - same height as width and how would I round the corners similar to the subscribe button?

I know this is a lot but I'm a complete novice here but eager to learn. You should get some rest too. Thanks!

@kimcroach Maybe font style should be the same, I have never edited the font, maybe I did something wrong so the font in the two screenshots was different

1. Checkbox: CSS can't do that. You need to edit the form, and find checkbox option...
2. Captcha: https://answers.squarespace.com/questions/166076/how-can-i-put-captcha-on-contact-forms.html
3. Round corners: Just a line of CSS

Thanks for the pointers and the captcha info.... I look forward to you sending the CSS to build this block into what I actually want

@kimcroach Add to Home > Design > Custom CSS

@media screen and (min-width:992px) {
   header.newsletter-form-header {
       float: left !important;
       width: 50% !important;
       margin-right: 20px !important;
   }
   form.newsletter-form:after {
       content: "";
       display: table;
       clear: both;
   }
   }

@tuanphan thanks so much this worked exactly as you outlined in screenshot 1, but I did go back in and add in the CSS to modify the font style.

One more thing I did set up Captcha but realized that it doesn't work on the specific newsletter form block, only the regular form block and that also goes for the checkbox too.

@tuanphan If possible, a couple more things:

1. I understand the first part of the code but I would also like to know what the second part specifically addresses (just for future reference)

2. What CSS would make the height of the newsletter block the same as the width of the block?

3. What CSS would round the corners of the entire newsletter block?

@kimcroach

@media screen and (min-width:992px) {
/* Corner */
.newsletter-block .newsletter-form-wrapper {
   border-radius: 42px;
}
/* Same height and width */
.newsletter-block .newsletter-form-wrapper {
   width: 1000px;
   height: 1000px;
}
}

This gave me the rounded corners and matching height and width but its aligned the entire block to the right of the page instead of the center. How can I fix this to ensure the block remains in the center of the page?

@kimcroach Can you resend url? I can't access about us & about page

https://legatumco.squarespace.com/ I made some adjustments to the configuration so it's now on the brand styles index page in the not linked section at the bottom - I created that to test the content blocks before I started adding them into the individual pages

@kimcroach Where is form block? I can't find....

You can send me message via contact form. There are no notifications from SS answer forum....