#image-wrapper {
    position: relative;
}
#image-wrapper .logo {
    opacity: .65;
    position: absolute;
    bottom:1em;
    left:1em;
    background-image: url('../assets/logo_text.svg');
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: bottom center;
    width:45%;
    height:3em;
}

.service_images img {
    opacity: 0;
    position: absolute;
    top:0; left:0;
    transition: opacity .35s ease;
}
.service_images img.active {
    opacity: 1;
}

#accordion {
    margin-left: 8.5%;
    max-width: 40em;
    width:75%
}
#accordion section {
    border-bottom: 1px solid #c1c1c1;
}
#accordion img {display: none;}
#accordion button {
    width: 100%;
    text-align: left;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border: none;
    background: transparent;
    padding: .5em 0;
    font-weight: 600;
    color: var(--gray-color);
    font-size: clamp(1rem, .85rem + .5vw, 1.25rem);
    cursor: pointer;
    padding-right:.25em
}
#accordion section.expanded button {
    color:var(--earth-color);
}
#accordion button i {
    line-height: 1;
    font-size: 1.5rem;
    color:var(--earth-color);
}
#accordion article {
    opacity: 0;
    visibility: hidden;
    padding-right: 2em;
    padding-left: .75em;
    padding-top: 0;
    max-height:0;
    font-size: .9375rem;
    overflow: hidden;
}
#accordion article p {
    margin:0;
}

#accordion section.expanded article {
    opacity: 1;
    visibility: visible;
    max-height:50em;
    margin-bottom: .75em
}
#accordion section.expanded button i {
    transform: rotate(180deg);
    color: var(--mustard-color);
}

#accordion.animate button {transition: color .25s}
#accordion.animate button i {transition: transform .25s}
#accordion.animate article {transition: opacity .25s, visibility .25s, max-height .5s, margin-bottom .5s;}
#accordion.animate section.expanded article {transition: opacity .5s .25s, visibility .5s .25s, max-height .5s, margin-bottom .5s;}


@media only screen and (max-width:53.125rem){
    #image-wrapper {
        display: none;
    }
    #accordion {
        width: 100%;
        max-width: 36em;
        margin-left: 0;}
    #accordion img {
        margin-top: clamp(.5em, .75em + 1.75vw, 2em);
        display: block;}
    #accordion article {
        padding-left:0;
        padding-right: 0;
    }
}