.picture-insurance-layout{
    display: flex;
    flex-direction: column;
    position: relative;
    background-color: var(--dark);


    div.picture{
        position: relative;
        z-index: 2;
        order: 1;
        picture{
            position: relative;
            z-index: 2000;
        }
        img{
            width: 100%;
        }
    }

    div.insurance{
        position: relative;
        color: white;
        display: flex;
        justify-content: center;
        order: 2;

    
        .insurance-layout{
            margin: 6.5rem 1.5rem 6.5rem 1.5rem;
            width: 100%;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            gap: 1rem;
            text-align: center;
            font-family: var(--font-text);
            position: relative;


            @media(min-width : 600px){
                text-align: start;
                align-items: flex-start;

                &::after{
                    content: "";
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 30%;
                    height: 1px;
                    background-color: white;
                }
            }

            h1{
                font-family: var(--font-title);
                line-height: 3rem;
                font-size: 3rem;
                letter-spacing: -0.67px;
                font-weight: 400;
            }

            p{
                font-size: 1rem;
                line-height: 1.625rem;
                font-weight: 400;
            }

            a{
                margin-top: 1rem;
                padding-left: 2rem;
                padding-right: 2rem;
                padding-top: 0.5rem;
                padding-bottom: 0.5rem;
                outline: 1.5px solid white;
                text-decoration: none;
                color: white;
                text-transform: uppercase;
                letter-spacing: 1.5px;
                font-weight: 700;
                font-size: 13px;
                transition: all 0.1s linear;
                position: relative;
                z-index: 3000;
                &:hover, &:focus{
                    background-color: white;
                    color: var(--darker);
                }
            }
        }
    
    }

    @media(max-width : 599px){
        &::after{
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-size: auto;
            background-position-y: -50%;
            background-position-x: -50%;
            margin-bottom: 5rem;
            background-repeat: no-repeat;
            background-image: url("../Assets/Backgrounds/insuranceBackgroundMobileLeft.svg");
            background-attachment: fixed;
            
        }
        &::before{
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-size: auto;
            background-position: bottom right;
            background-repeat: no-repeat;
            
            background-image: url("../Assets/Backgrounds/insuranceBackgroundMobileRight.png");
            background-attachment: fixed;
        }
    }


    @media(min-width:600px){
        position: relative;
        padding-left: 10%;
        padding-right: 10%;
        display: flex;
        flex-direction: row;
        gap: 1.875rem;
        height: 600px;

        &::after{
            content: "";
            position: absolute;
            top: 0;
            right: 0;
            width: 100%;
            height: 100%;
            background-size: auto;
            background-position-y: -10vh;
            background-position-x: right;
            background-repeat: no-repeat;
            background-image: url("../Assets/Backgrounds/InsuranceBackgroundDesktopRight.png");
            background-attachment: fixed;
        }
        &::before{
            content: "";
            position: absolute;
            z-index: 1000;
            background-position-y: 200%;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-size: auto;
            background-repeat: no-repeat;
            background-image: url("../Assets/Backgrounds/InsuranceBackgroundDesktopLeft.png");
            background-attachment: fixed;
        }

        div.picture{
            max-height: 650px;
            max-width: 540px;
            margin-top: 6.5rem;
            width: 50%;
            order: 2;
            

            top: 10vw;
            display: flex;
            align-items: flex-end;
        }

        div.insurance{
            display: flex;
            text-align: start;
            width: 50%;
        }
    }
}