/* 
    Created on : May 24, 2022, 6:37:11 AM
    Author     : Bob Shaw
*/

    #container  { display: flex; flex-direction: column; }
        .first      { order: 1; }
        .second     { order: 2; }
        .third      { order: 3; }
        .forth      { order: 4; }
        .fifth      { order: 5; }

    .collapsible {
        background-color: #777;
        color: white;
        cursor: pointer;
        padding: 18px;
        width: 100%;
        border: none;
        text-align: left;
        outline: none;
        font-size: 20px;
    }

    .focus, 
    .collapsible:hover {
        background-color: #555;
    }

    .collapsible:after {
        content: "\002B";
        color: white;
        font-weight: bold;
        float: right;
        margin-left: 5px;
    }

    .focus:after {
      content: "\2212";
    }

    .content {
      padding: 0;
      width: 100%;
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.2s ease-out;
      background-color: #ffffff;
    }