/* == =======================================
    == Show how to use a style to target specific columns of a container block - lslater
   === ======================================
  A typical container block for style cbTest  is:
        <div id="cont_1058" class="container_box cbTest_container_box">
 <div class="row cb_r row cb_r_sm cb_r_first cb_r_last">
  <div class="col-md-3 cb_c cb_c_first cb_c_notlast" >
  <div class="col-md-9 cb_c cb_c_last" >

    So the class order is div.tmTest_container_box   div.cb_r   div.c_bc
*/

{declare_style style=cbTest name='cbTest' cat='Special' rev=1 order=975 desc=''}
div.cbTest_container_box [
 background-color: Orchid;
        border: 4px solid red;
]

/* This targets the first col.    But it also targets ANY first col in an embedded block
    You will see that blue border and goldenrod where it does not belong
 */
div.cbTest_container_box    div.cb_r   div.cb_c_first [
     border: 10px solid blue;
     background-color: goldenrod;
]

/* This targets ONLY the last col that is DIRECTLY held by the container with cbTest
    You will see the green border ONLY on the outermost

    IMPORTANT: In the top blocks in the cols set Ignore Parent Styles
*/
div.cbTest_container_box > div.cb_r > div.cb_c_last [
     border: 10px solid green;
     background-color: PowderBlue ;
]