How can I align text in images with text overlay section?

[AntonC]

Hi All

Would anyone know if this could be made to work for text alignment in the images-with-text-overlay section?

  {

    "type": "textarea",    

    "id": "text",

    "label": "Text",

    "default": "Use overlay text to give your customers insight into your brand. Select imagery and text that relates to your style and story."

    },

    {

    "type": "select",

    "id": "align_text",

    "label": "Text alignment",

    "default": "left",

    "options": [

    {

    "value": "left",

    "label": "Left"

    },

    {

    "value": "center",

    "label": "Centered"

    },

    {

    "value": "right",

    "label": "Right"

    }

    ]

    },

I know it will also need <div class="align-the-text_{{ section.settings.align_text }}">

tnx all

[AntonC]

https://mentmore-power-services.myshopify.com/
vickit

this is the 'image-with-text-overlay' section

{% schema %}
{
"name": "Image with text overlay",
"class": "section section_homepage section_image-with-text-overlay",
"settings": [
{

[Hardik29418]

Please place this code at the end of theme.scss

#shopify-section-161115940755f5cee8 .section_wrap flexible_block__small  .container .row {
margin: 0px;
}

#shopify-section-161115940755f5cee8 .section_wrap flexible_block__small  .container .row .col-md-6 {
width: 100%;
}
#shopify-section-161115940755f5cee8 .section_wrap flexible_block__small  .container .row .col-md-6 h1,
#shopify-section-161115940755f5cee8 .section_wrap flexible_block__small  .container .row .col-md-6 p {
text-align: center;
margin: 0px;
}