@charset "utf-8";

/* about-layout.css for Lab 13 in C6P2 Web Development Internship - Brittany Thompson, December 9, 2025 */


/* desktop media query */
@media (min-width: 1200px) {
    body {
        row-gap: 2%;
    }

    .opening-p {
        text-align: center;
    }

    /* section of my Founder's bio and personal stoties */
    .me {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        grid-template-areas: "story img"
            "div1 img"
            "div2 div3";
        margin-top: 1%;
        font-size: 0.9em;
        text-align: justify;
        gap: 1% 2%;
    }

    .mystory {
        grid-area: story;
    }

    .img-div {
        grid-area: img;
    }

    .idea {
        grid-area: div1;
    }

    .songwriting {
        grid-area: div2;
    }

    .history {
        grid-area: div3;
    }

}

@media (min-width: 1024px) and (max-width: 1199px) {
    main img {
        width: 40%;
    }
}

/* mobile media query */
@media (max-width: 1023px) {
    main img {
        width: 50%;
    }

    main {
        text-align: justify;
    }

    main article,
    main div {
        margin: 2% 0;
    }
}

/* smaller mobile layouts */
@media (max-width: 780px) {
    main img {
        width: 70%;
    }
}