* {
    
    margin : 0;
    padding : 0;
    box-sizing: border-box;
    
}

main {
    background: linear-gradient(hsl(273, 75%, 66%), hsl(240, 73%, 65%));
    font-size : 12px;
    font-family: 'Kumbh Sans', sans-serif;
    font-weight : 400;
    display : flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width : 100vw;
    height : 100vh;
}

.card {
    background-color: whitesmoke;
    width : 80vw;
    height : 69vh;
    border-radius: 3em;
    display : flex;
    justify-content: space-evenly;
    overflow : hidden;
    
}

.img {
    display : flex;
    flex-direction : column;
    width : 40%;
    justify-content: center;
    align-items: center;
}

.box {
    position : absolute;
    left : 4em;
    top : 36%;
    
    z-index : 2;
}

.woman {
    position : relative;
    right : 7em;
    top : 60%;
    width : 35em;
    height : auto;
    z-index : 1;
}

.pattern {
    position : relative;
    left : -50%;
    top: -50%;
    bottom : 3em;
    z-index : 0;
    width : auto;
    height : 60em;
    
}

.faq {
    padding : 1em;
    margin : 3em;
    width : 50%;
}

h1 {
    font-size : 2em;
}

.bloc {
    border-bottom: 1px solid hsl(240, 5%, 91%);
    padding : 1em;
    margin-top: 0.5em;
}

.ask {
    padding: 15px;
    cursor : pointer;
    display : flex;
    justify-content: space-between;
    align-items: center;
    font-weight: bold;
    font-size : 1.2em;
}

.btn {
    border : none;
    background-color: whitesmoke;
    
}

.answer {
    display : block;
    opacity : 0;
    margin-top : -1em;
    
}

.active {
    display : flex;
   transition : all 0.5s ease;
    opacity : 1;
    translate : 0 2em;
    margin-bottom : 1.5em;
}





.attribution {
    margin-top : 2em;
    padding : 1em;
    background-color: whitesmoke;
    border-radius: 2em;
}




@media screen and (max-width: 800px ) {
    .card {
        flex-direction : column;
        
    }

    

    .woman {
        position : absolute;
        left : 20%;
        top : -30px;

        height : 15em;
        width : auto;
    }


    .box {
        position : absolute;
        left : 6em;
        top : 40px;
        height : 7em;
        width : auto;
        z-index : 2;
    }
    
    
    
    .pattern {
        position : relative;
        left : 8em;
        z-index : 0;
        width : auto;
        height : 22em;
        
    }


    .faq {
        width : 100%;
        height : 100%;
        margin : auto;
        padding : 0.5em;
        margin-top : -150px;
        overflow: scroll;
    }

}