title: Override CSS class of primefaces component for specific element
body: <p>i want to override the style attribute .<code>ui-state-disabled</code> of the primefaces component SelectCheckboxMenu. The overriding is easy if i define a new style for .<code>ui-state-disabled</code> but the problem is that all other primefaces components with this style class will be overridden too, which i don't want.
  How can a specify that the class .<code>ui-state-disabled</code> will be overridden for a specific primefaces component ? (in my case a SelectCheckboxMenu)</p>
  
  <p>Style:</p>
  
  <pre><code> .ui-state-disabled
      {
              visibility: hidden!important;
      } 
  </code></pre>
  
  <p>Component which should be overridden:</p>
  
  <pre><code>&lt;p:selectCheckboxMenu id="overview" style="width: 130px; margin-right: 10px;"
              value="#{overviewModel.filterCompilation.selectedCareUnits}"
              filter="true" filterMatchMode="startsWith" panelStyle="width:250px"
              label="checkbox"&gt;
              &lt;f:selectItems value="#{overviewModel.items}" /&gt;
          &lt;/p:selectCheckboxMenu&gt;
  </code></pre>