Initial Accordion CSS--original

/*  ===============================================================
    A few base styles    
    =========================================================== */
ul, p {
    color: #333;
    margin-top: 0;
    margin-bottom: 1em;
}

a {
    color: #369;
}

/*  ===============================================================
    Our "separator" styles, from earlier    
    =========================================================== */
/* Shorthand is great, but when you just want to tweak one value elsewhere -- long form is your friend */

.separator {
    border-bottom-color: #bbb;
    border-bottom-width: 1px;
    border-bottom-style: dashed;
}

/*  ===============================================================
    The Accordion  
    =========================================================== */
.accordion {
    font-family: sans-serif;
    line-height: 1.5;
}

.accordion__head {
    line-height: 1;
    overflow: hidden; /* to contain floats */
}

.accordion__title {
    font-size: 18px;
    margin: 0;
}

.accordion__toggle {
    color: #004f95;
    display: block;
    padding: 10px 0;
}

.accordion__body {
    overflow: hidden;
    padding-left: 23px;
    -webkit-transition: all .5s ease-in-out;
       -moz-transition: all .5s ease-in-out;
        -ms-transition: all .5s ease-in-out;
         -o-transition: all .5s ease-in-out;
            transition: all .5s ease-in-out;
    visibility: hidden;
}

.accordion__body > * {
    margin-top: 0; /* this might normally be addressed in reset styles */
}

.accordion__body > :last-child {
    margin-bottom: 1em;
}

.icn {
    background-position: left top;
    background-repeat: no-repeat;
    float: left;
    margin-right: 5px;
    /* image replacement styles in next 3 declarations */
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
}

.icn--accordion {
    background-color: #004f95;
    background-image: url("img/icn-accordion.png");
    border-radius: 50%;
    height: 18px;
    width: 18px;
}

.icn--is-selected {
    background-position: left bottom;
}

.is-closed {
    max-height: 0 !important;
}

.is-open {
    max-height: 999px !important; /* work-around to animate unknown height */
    visibility: visible !important;
}

.list--unstyled {
    list-style: none;
    margin-bottom: 0;
    padding-left: 0;
}