.accordion-icon-holder {
    background-color: #45D6D6;
    width: 28px;
    min-width: 28px;
    height: 28px;
    border: 0;
    position: relative;
    outline: 0px;
    cursor: pointer;
    transform: rotate( 45deg );
    padding: 0;
    margin-right: 8px;
    margin-left: 6px;
    margin-top: -3px;
}

.accordion-icon-holder.accordion-icon-small {
    width: 17px;
    min-width: 17px;
    height: 17px;
    margin-right: 6px;
    margin-left: 4px;
}

.accordion-icon-holder:focus {
    outline: 0px;
}

.accordion-icon-holder:hover {
    background-color: #00818F;
}

.accordion-icon-holder:not(.collapsed):hover .accordion-icon {
    background-image: url(/Content/images/icons/accordion-minus-white.svg);
}

.accordion-icon-holder.collapsed:hover .accordion-icon {
    background-image: url(/Content/images/icons/accordion-plus-white.svg);
}

.accordion-icon-holder:not(.collapsed) .accordion-icon {
    background-image: url(/Content/images/icons/accordion-minus-black.svg);
    width: 12px;
    height: 2px;
    top: 13px;
    left: 8px;
    position: absolute;
    transform: rotate( -45deg );
}

.accordion-icon-holder.collapsed .accordion-icon {
    background-image: url(/Content/images/icons/accordion-plus-black.svg);
    width: 12px;
    height: 13px;
    top: 8px;
    left: 8px;
    position: absolute;
    transform: rotate( -45deg );
}

.accordion-icon-holder.accordion-icon-small:not(.collapsed) .accordion-icon {
    width: 8px;
    height: 2px;
    top: 7px;
    left: 4px;
}

.accordion-icon-holder.accordion-icon-small.collapsed .accordion-icon {
    width: 8px;
    height: 9px;
    top: 4px;
    left: 4px;
}

/* compensate for additional space taken by rotated square */
.fds-accordion-header {
    padding-top: 8px;
    padding-bottom: 8px;
}