what code do I need to resize an image for mobile view?

Site URL: http://regenhealth.nz/home

Hi, I have a couple of images that show up too large on mobile view. One is in the footer and the other an image block.

What code do I need to make them smaller by about 50% please? and where do I put the code?

Thanks in advance for help!

Add to Design > Custom CSS

/* resize mobile images */
@media screen and (max-width:767px) {
/* above footer */
div#block-yui_3_17_2_1_1632373605867_15842 {
    width: 50%;
    margin: 0 auto;
}
/* footer image */
div#block-yui_3_17_2_1_1629767836842_31920 {
    width: 50%;
    margin: 0 auto;
}
}