Bedford/Bryant template - banner button alignment (horizontal and vertical)

Hi,

The client I'm building the site for inexplicably wants the call to action button on the main/index page's banner to be not as noticeable. They would like it as close to the lower right corner of the banner image as possible. I can't figure out how to position the button without also affecting the banner text (page description), which they want to remain centered, and the responsiveness of the banner image poses a problem as well. I tried customizing the .desc-wrapper element in CSS but haven't been able to make it look how they want.Here's the site:https://hyperboloid-guava-pw2m.squarespace.com

Thank you!

@alisonb That button has class: .desc-wrapper p:last-child or .desc-wrapper p:last-child a

.desc-wrapper p:last-child {
   text-align: right;
}

@tuanphan Thank you - this does align it to the right within the confines of this particular "wrapper" (for lack of a better term). How would I adjust the code/characteristics so that the padding between the button and the right and bottom edges of the banner image is almost zero? That way it's sitting as close to the bottom-right edge of the banner image as possible. Thanks!

@alisonb I thought you knew a little CSS so I just sent the class of the button. :bb:In this case you need to adjust the width of both "The right ..." and the button to 100% (currently 90%), ( .desc-wrapper)Then adjust the margin bottom and margin right of the button to 0 (.desc-wrapper p:last-child)Since the width of the entire block is 100%, you may need to adjust the margin left/right or padding left/right of "the right co .." (.desc-wrapper p:first-child)

I was able to modify this code (taken from this original Answers post: https://answers.squarespace.com/questions/203098/change-banner-text-positioning-on-bryant.html) to have the button be aligned on the bottom right. It unfortunately also made the banner text be right-aligned as well, but this should do for now until I can figure out how to align the text separately from the button. Hopefully, they'll decide that centering the text isn't as necessary as their preferred button positioning.

 .view-list main #content div.index-section:nth-child(1) .banner-thumbnail-wrapper
{
min-height: 0;
padding: 325px 0 0 0;
}
.view-list main #content div.index-section:nth-child(1) .banner-thumbnail-wrapper .desc-wrapper
{
padding: 0 0;
text-align: right;
margin: 0 40px;
max-width: 90%;
}

@alisonb

div#communities-all .desc-wrapper {
   max-width: 100% !important;
   margin: 0 !important;
}
div#communities-all .desc-wrapper p:first-child {
   margin-right: 10%;
}
div#communities-all .desc-wrapper p:last-child {
   margin-bottom: 0;
}
.desc-wrapper p:last-child>a {
   margin-bottom: 0;
}

@tuanphan thank you! this is perfect.