.PageTitle, .StoryTitle, .QuotesTitle, .GirlsTitle, .ReadersTitle {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 900;
    font-style: normal;
    font-variation-settings: "wdth" 100;
    font-size: 48pt;
    text-transform: uppercase;
}

.PageSubTitle {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 900;
    font-style: normal;
    font-variation-settings: "wdth" 100;
    font-size: 36pt;
    text-transform: uppercase;
}

.StoryBody, .GirlsBody, .ReadersBody, .StoreLinkAnchor {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
    font-variation-settings: "wdth" 100;
    font-size: 12pt;
    line-height: 1.5;
}

.QuoteBody {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings: "wdth" 100;
    font-size: 12pt;
    line-height: 1.5;
}

.QuoteAttribution {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 600;
    font-style: normal;
    font-variation-settings: "wdth" 100;
    font-size: 12pt;
    line-height: 1.5;
}

.StoryFootnote {
    font-family: "Roboto", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
    font-variation-settings: "wdth" 100;
    font-size: 9pt;  
    line-height: 1.5;
}

.FirstSection, .ThirdSection {
    background-color: hsl(75, 9%, 36%);
}

.SecondSection, .FourthSection {
    background-color: hsl(44, 13.8%, 78.6%);
}

.PageTitle, .PageSubTitle {
    color: hsl(44, 13.8%, 78.6%);
}

.QuotesTitle {
    color: hsl(0,0%,100%);
}

.QuoteBody {
    color: hsl(0,0%,100%);
}

.QuoteBody p {
    margin-bottom: 5pt;
}

.StoryBody, .GirlsBody, .ReadersBody {
    color: hsl(0,0%,0%);
}

.CoverImage img {
    width: 250pt;
    height: auto;
}

.StoryImage img {
    width: 125pt;
    height: auto;
}

.QuoteBody {
    display: grid;
    gap: 5vm;
}

.LayoutFat {
    display: grid;
    padding: 10pt;
}

.FirstSection {
    display: grid;
    grid-template-columns: 2fr 3fr;
    padding: 25pt;
}

.SecondSection {
    display: grid;
    grid-template-columns: 3fr 2fr;
    padding: 25pt;
}

.ThirdSection {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 25pt;
}

.FourthSection {
    display: grid;
    grid-template-columns: 1fr 1fr;
    padding: 25pt;
}

.StoryTitle, .QuotesTitle {
    grid-column: span 2;
}

.StoryBody {
    padding: 10pt;
}

.CoverImage {
    place-self: center;
    padding-right: 20pt;
}

.StoryImage {
    place-self: center;
    padding: 20pt;
}

.QuotesSection1 {
    padding-right: 10pt;
}

.QuotesSection2 {
    padding-left: 10pt;
}

.PageTitle {
    padding-bottom: 20pt;
}

.PageSubTitle {
    padding-bottom: 20pt;
}

.GirlsSection {
    padding-right: 10pt;
}

.ReadersSection {
    padding-left: 10pt;
}

.StoryFootnote {
    padding: 10pt;
}