* { margin: 0; padding: 0; box-sizing: border-box; } .accordion { width: 100%; } .chevron { margin: 10px; width: 25px; transition: transform 0.5s ease; } .accordion-icon { width: 50px; margin-right: 10px; border-radius: 50%; } .accordion-item { background-color: #333; border-radius: 10px; margin: 10px 0; } .accordion-item input { display: none; } .accordion-item label { display: block; padding: 10px; cursor: pointer; } .accordion-content { max-height: 0px; overflow: hidden; background-color: #555; border-radius: 0 0 10px 10px; } .accordion-item input:checked ~ .accordion-content { max-height: 100%; /* You can adjust this value depending on your content */ } .accordion-item input:checked ~ label .chevron { transform: rotate(90deg); } .accordion-title { display: flex; align-items: center; } .accordion-content p { padding: 10px; color: white; } .client-item { display: flex; align-items: center; padding: 10px; border-bottom: 1px solid #555; } .client-item * { display: flex; align-items: center; } .client-item img { width: 50px; height: 50px; border-radius: 50%; background-color: #333; } .client-item-buttons { margin-left: auto; } .client-item-buttons a { margin: 0 5px; padding: 10px; text-decoration: none; border-radius: 10px; background-color: #333; color: white; cursor: pointer; }