Hello,

Sorry for the late reply.
Please try adding this code:

@media (max-width: 979px) and (min-width: 768px){
.container{
width: auto !important;
}
.list li.simple:first-child:last-child {
    width: 55%;
}
}

Let us know.
Best regards!

Hello,

1-I added a custom css class to the column’s containing the lists. And i set up the empty middle column to be hidden in ipad and mobile. The i added these code to the ipad block code in the Custom Css:

.vc_col-sm-4.contact_us.wpb_column.column_container {
    margin-left: 55px;
}
div.wpcf7 {
    margin: 45px !important;
}
.row > .span3 {
    padding-left: 0 !important;
    padding-right: 20px !important;
}

Result: https://ibb.co/1mDyTSB

2-This alignment is due to the different length of the title above. To make them same line, you need to add a minimal height. I added it as custom css in the page’s custom css box. So it’s effective only in this page.
Screenshot: https://ibb.co/CK2srs5

3-Same here. I added a css only for this page.

Please check your site.
Best regards!

Hello,

1-I don’t see overlapping, except for maybe more padding left. Add this css if that’s what you want:

@media (max-width: 979px) and (min-width: 768px){
.container {
    padding-left: 10px;
}}

Result: https://ibb.co/tD1qxbK
2-I don’t see any overlapping except the minimum distance from header to content. For that add this:

@media(max-width: 1024px){
#content {
    padding-top: 120px;
}}

Result: https://ibb.co/2hKfSgK

3-This is what i see: https://ibb.co/MkP6701
The tables are in distance and not overlapping. To make them further bigger, just edit the values for the code suggested in previous replies.

Regards!