/* Accordion styles */

.faq-container {
    width: 80%;
    margin: 20px auto auto auto;
}

.promo-entry .accordioncomponent .faq-container {
    width: 100%;
    margin: 20px auto auto auto;
}

.accordion .card {
    border: 1px solid #E7E7E7;	
    border-radius: 4px;
    background-color: rgba(9,19,33,0.06);
    margin-bottom: 15px;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.05);
}

.accordion .card-header {
    border: none;
    background-color: #fff;
}

.collapse.show + .card-header {
    background: grey;
}

.accordion .card-header button {
    color: #000;
}

.accordion .card-body {
    background: #fff;
    border: 1px solid #e7e7e7;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    padding: 15px 20px;
    font-size: 14px;	
    line-height: 20px;
}

.accordion .card-body ul {
    padding: 8px 50px;
}

.accordion h5 {
    cursor: pointer;
    padding: 8px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.accordion h5[aria-expanded="true"] {
    background-color: #EBECED;
}

.accordion h5[aria-expanded="true"] button {
    color: #0173B9;
    font-size: 12px;
    font-weight: bold;
    line-height: 16px;
}

.accordion h5[aria-expanded="false"] button {
    color: #383838;
    font-size: 12px;	
    font-weight: 500;	
    line-height: 16px;
}

.collapse, .collapsing {
    background-color: rgba(9,19,33,0.06);
}

.accordion-arrow {
    transition: 0.3s ease-in;
    transform-origin: center;
}

.btn-link.collapsed {
    color: rgba(0, 0, 0, .5);
}

.btn-link:hover, .btn-link:focus {
    color: initial;
    text-decoration: none;
}

.btn.btn-link {
    padding-left: 0;
}

h5[aria-expanded="true"] .accordion-arrow {
    transform: rotate(-180deg);
}

h5[aria-expanded="false"] .accordion-arrow {
    transform: rotate(0deg);
}

/* Overwriting Bootstrap class */
.accordion>.card>.card-header {
    margin-bottom: 0;
    padding: 0;
}

.accordion > .card:not(:last-of-type) {
    border-bottom: 1px solid #E7E7E7;
    border-radius: 4px;
}

.accordion > .card:not(:first-of-type) {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}