I hope you can help with this. There are several layers of divs, classes, etc here and I'm not getting anywhere.

I am trying to overide the size limit in the code below to make the image smaller. It's set as it is by a wordpress plugin and I can't change the size for this page without changing it on another that I need to stay as the plugin dictates. I want it 150 px here and the default 200px there.

The page code looks like this:

<div id="wpbdp-view-listings-page" class="wpbdp-view-listings-page wpbdp-page">
	<div class="wpbdp-page-content">
	<div class="listings">
	<div id="wpbdp-listing-17" class="wpbdp-listing excerpt wpbdp-listing-excerpt normal even cf">
	<div class="listing-thumbnail"><a href="http://websitenamehere.com/testcart/calendar-of-events/17/dancealot/"><img class="wpbdmthumbs" src="http://websitenamehere.com/testcart/wp-content/uploads/2013/02/ericmoschnau-sepia-200x159.jpg" style="max-width: 200px;" alt="Dancealot" title="Dancealot" border="0" /></a></div>
I need to make the image 150px max width, but also have a max height of 150. The override cannot be specific to div id wpbdp-listing-17 as there are other listings with different div id numbers that will have the same style to overide.

I tried the following but it didn't work:

#wpbdp-view-listings-page .wpbdp-view-listings-page wpbdp-page .wpbdp-page-content .listings .listing-thumbnail img [style] { max-width: 150px !important; }
Or what? Of course, needs to work in all browsers...

(DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN")

Thank you for your efforts with this.