Image and text run into next column

Firstly, I think List Category Posts is a terrific plugin – many thanks for it!

However, I can’t get the CSS right for the home page of https://www.rmrg.org.uk – it’s fine on phone or PC, but on tablet the image and text extend outside the column. Can anyone advise what CSS I need to stop this happening?

Here’s the shortcode and the relevant CSS.

[catlist name=activities numberposts=1 excerpt=full excerpt_tag=p excerpt_class=lcp_excerpt_side thumbnail=yes thumbnail_class=lcp_thumbnail_side thumbnail_size=270,200 title_tag=h4 title_class=lcp_title_side ]

/* Formatting for List Category Post calls (home page): */

.entry-content ul.lcp_catlist {
list-style-type: none;
clear: both;
overflow: auto;
padding-left: 160px;
padding-top: 20px;
margin-bottom: 10px;
display: inline-table;
position: relative;
bottom: 22px;
}

.entry-content h4.lcp_title_side {
line-height: normal;
margin: 0;
padding: 210px 0 10px 0;
width: 280px;
font-size: 14px;
color: white;
position: relative;
left: -165px;
top: 0px;
}

.entry-content h4.lcp_title_side a {
color: white;
text-decoration: underline;}

.entry-content h4.lcp_title_side a:hover {
color: #003310 !important;
background-color: #fffdf4;
text-decoration: underline;
}
.entry-content p.lcp_excerpt_side {
margin: 0;
padding: 0;
width:100%;
font-size: 13px;
line-height: normal;
color: white;
position: relative;
left: -165px;
top: 0px;
}

.entry-content a.lcp_posts_morelink_side {
display: none;
line-height: normal;
margin: 0;
padding: 0;
color: white;
font-size: 90%;
position: relative;
left: -100px;
}

.entry-content .lcp_thumbnail_side {
float: left;
border: none;
padding: 0 0 0 0;
margin: 0 0 40px 0;
position: absolute;
left: -148px;
top: 20px;
}

.entry-content span.lcp_excerpt_side {
display: blockquote;
}

The page I need help with: [log in to see the link]