.faq-lateral{
    display:flex;
    gap:3rem;
    align-items:flex-start;
    margin-top: 40px;
    margin-left: 40px;
    margin-bottom: 50px;
}

.faq-menu{
    width:38%;
}

.faq-content{
    width:62%;
    min-height:250px;
}

.faq-button{
	font-family: 'Space Grotesk', sans-serif;
    width:100%;
    border:none;
    text-align:left;
    padding:10px 22px;
    margin-bottom:6px;
    background:#EDF7F7;
    cursor:pointer;
    transition:all .25s ease;
    font-weight:400;
    color: #003A70;
    font-size: 20px;
    line-height: 24px;
}

.faq-button:hover{
    background:#003A70;
    color:#fff;
}

.faq-button.active{
    background:#003A70;
    color:#fff;
}

.faq-panel{
    display:none;
}

.faq-panel.active{
    display:block;
}

.faq-panel ul{
    padding-left:20px;
}

.faq-panel li{
    margin-bottom:8px;
}

.faq-slide .faq-panel.active{
    animation:faqSlide .35s ease forwards;
}

.faq-fade .faq-panel.active{
    animation:faqFade .25s ease forwards;
}

@keyframes faqSlide{

    from{
        opacity:0;
        transform:translateX(25px);
    }

    to{
        opacity:1;
        transform:translateX(0);
    }
}

@keyframes faqFade{

    from{
        opacity:0;
    }

    to{
        opacity:1;
    }
}

@media(max-width:992px){

    .faq-lateral{
        flex-direction:column;
    }

    .faq-menu,
    .faq-content{
        width:100%;
    }

}
