details{margin:20px auto;width:800px}details,summary{display:block;padding:5px}summary{background:#99b92c;border-radius:5px;color:#fff;cursor:pointer;font-weight:700}summary::-webkit-details-marker{display:none}summary:after{color:#fff;content:"▼";float:right;font-size:1.5em;margin:5px;text-align:center;width:20px}details[open] summary:after{content:"▲"}@media screen and (max-width:600px){details{margin:10px 0;width:100%}summary:after{font-size:1em}}