Q:

Jquery mobile- Change content color of collapsible list

I would like to change the content color of a collapsile list. 
Here is an example:

As you can see I have a collapsible list with a table and 2 ohter collapsible elements.  I would like to have the outer collapsible list to be lightgray as shown, but the collapsible elements inside it should have the content white (like data-content-theme="a"). 
In order to have it lightgray I did so:
.ui-collapsible-themed-content .ui-collapsible-content {
    background-color: lightgray;
 }

but in this way all collapsible elements have the content gray..
Another way would be to make a custom theme with Theme Roller of JQuery, I did it but then the collapsible elements become gigantic (more than double):

A:

If you only want to affect collapsible content that is within a parent collapsible, you can try this CSS:
.ui-collapsible-content .ui-collapsible-content {
    background-color: lightgray;
}

DEMO

Another way could be to assign a class to all child collapsibles
<div data-role="collapsible" data-collapsed="false" class="childCollapsible">

And then use that class in the CSS:
.childCollapsible .ui-collapsible-content {
    background-color: lightgray;
}

DEMO

