Custom background woocommerce related pages

Hi Radu,,

Based on guidance you gave me earlier I use this CSS to set a background for the woocommerce shop and single product page and it works.  However I believe is also set the default background for the Cart and Checkout page.

/********************     shop   and single product page default  ************/
/* body.woocommerce-page #main section.container-wrap.main-color {  */
body.page-id-123 .main-color {
background-image: url(place image URL here);
background-repeat:no-repeat;
background-attachment:fixed;
}

I tried to change background of these two pages to something different than shop page above with code below with correct page ID,  but I believe its inheriting the shop page background still.

Any suggestions on how to have the pages below different than the shop page.  All three pages will have a different background the one set in Theme Options.

/********************      cart  but doesnt work,  defaults to above shop background  ************/
body.page-id-124 .main-color {
background-image: url(place second image URL here);
background-repeat: repeat;
background-attachment:fixed;
}
/********************      checkout but doesnt work, default to above shop background   ************/
body.page-id-125 .main-color {
background-image: url(place second image URL here);
background-repeat: repeat;
background-attachment:fixed;
}