Change "Read More" size

You have a file named: NEW/media/readmorejs/assets/readmore.css?v=0.1

on line 4, change the width: 100% to something like width: 110%, and adjust that value to taste.

the problem is   .readmore-js-toggle and .readmore-js-section  are the same and override the button
so if you reduce the style it will reduce the words as well. not good.

i.e it is in your style sheet as:

.readmore-js-toggle, .readmore-js-section {
    display: block;
    width: 100%;
}

if you separate them into 2 styles and the and adjust the .readmore-js-toggle to a hard number like 80px.   so replace the above with:

.readmore-js-toggle {
    display: block;
    width: 80px;
}

.readmore-js-section {
    display: block;
    width: 100%;
}

Ok. Give me a day or two. I have other projects I'm working on. Thanks!

So what I have is:

.readmorejs-block{

}
.readmore-js-toggle {
    display: block;
    width: 50px;
}
.readmore-js-section {
    display: block;
    width: 50%;
}
.readmore-js-section {
  overflow: hidden;
}

But nothing changed.

I've checked the site and it has the same styles.
can't see the ones you state above.
maybe there are defined in several places?

actually - I can see your changes but they are still overridden by the original styles we are trying to change
so.. that means..
is your theme creating these styles dynamically?
or you need to search all the source code and make sure you  replace the All  styles I mentioned above with the ones I stated.

as far as I can see the style

.readmore-js-toggle, .readmore-js-section {
    display: block;
    width: 100%;
}

is defined somewhere  and comes after your new styles

All  I can manage to do is change

sectionCSS: 'display: block; width: 100%;', in readmore.js

But as you know that changes the content width also.

Ok. I will try that later. Thanks.