Opacity and Pointer

by Blueprinter

HTML

<div id="idMainContainer">
<div id="idInnerGraphics_Prompts">
    <div class="graphicsPanels">
        Some Content
    </div>

    <div class="graphicsPanels">
        Content Two
    </div>
    
    <div class="graphicsPanels">
        Content Three
    </div>
</div>    
</div>

CSS

#idMainContainer {
    background-color: lightgray;
    width: 100%;
    border: solid red;
    height: 70px;
    z-index: -2;
  }
  
  #idInnerGraphics_Prompts {
    width: 74%;
    height: 50px;
    margin-left: 13%;
    border: solid blue; 
    margin-top: 5px;
    background: yellow;
    opacity: 0.3;
    z-index: -1;
  }

  .graphicsPanels {
    width: 30%;
    display: inline-block;
    border: solid green;
    margin-top: 2%;
    cursor: pointer;
    opacity: 0.99;
    z-index: 0;
  }