.ac {
--color-white: #fff;
--color-light-grey: #eee;
--color-grey: #8a8a8a;
--color-black: #111;  background-color: var(--color-white);
box-sizing: border-box;
}
.ac .ac-header {
margin: 0;
padding: 0;
}
.ac .ac-trigger {
font: bold 16px Arial, sans-serif;
color: var(--color-black);
text-align: left;
width: 100%;
padding: 0px 32px 0px 0px;
display: block;
cursor: pointer;
background-color: transparent;
transition: color 0.25s ease;
position: relative;
text-decoration: none;
margin: 0;
border: 0;
}
.ac .ac-trigger::after {
content: "+";
text-align: center;
width: 15px;
transform: translate(0, -50%);
position: absolute;
right: 0px;
top: 50%;
}
.ac .ac-trigger:focus { }
.ac .ac-panel {
overflow: hidden;
transition-property: height, visibility;
transition-timing-function: ease;
}
.ac .ac-panel .ac-text {
font: 15px/24px Arial, sans-serif;
color: var(--color-black);
padding: 8px;
margin: 0;
}
.ac.js-enabled .ac-panel {
visibility: hidden;
}
.ac.is-active .ac-panel {
visibility: visible;
}
.ac.is-active > .ac-header .ac-trigger::after {
content: "\2013";
}