/* Style the buttons that are used to open and close the accordion panel */
.accordion{
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 18px;
    padding-right: 3rem;
    width: 100%;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s; }
.accordion p{ display: inline; }
.accordion p:first-child{ margin-right: 0.5rem; }

/* Change background color of active and hovered buttons */
.active, .accordion:hover{ background-color: #ccc; }

/* Icons */
.accordion:after{
    content: '\02795'; /* Unicode "plus" sign (+) */
    font-size: 13px;
    color: #777;
    float: right;
    margin-left: 5px;
    margin-right: -2rem; }

.active:after{ content: "\2796"; /* Unicode "minus" sign (-) */ }

/* Style the accordion panel. Note: hidden by default */
.panel{
    padding: 0 18px;
    background-color: white;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out; }