:root
{
}
.apprenticeship_alliance_focus
{
    display: grid;
    position: relative;
    grid-template-columns: 0.95fr 0.5fr 0.52fr 0.53fr 0.52fr;
    grid-gap: var(--sz_button_margin);
    width: 95%;
    left: 2.5%;
    margin-top: 10px;
}

.apprenticeship_alliance_focus > *:not(:first-child)
{
    /* Need space to accommodate for the image */
    padding-top: 40px;
    position: relative;
}
    .apprenticeship_alliance_focus > :not(:first-child):not(:last-child)
    {
        position: relative;
    }
    .apprenticeship_alliance_focus > :not(:first-child):not(:last-child):after
    {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        right: -2px;
        width: 1px;
        height: 100%;
        border-right: var(--border);
    }

.apprenticeship_alliance_focus h1
{
    top: 25px;
    position: relative;
}
/*    .apprenticeship_alliance_focus h1:before
    {
        content: attr(title);
        text-transform: uppercase;
        display: block;
        position: absolute;
        top: -40px;
        left: 0;
        font-size: 1rem;
        color: var(--color_primary);
    }*/

.apprenticeship_alliance_focus h2
{
    font-size: 1.2em;
    text-align: center;
}
.apprenticeship_alliance_focus p
{
    text-align: center;
}

/******************************** ICONS */
.apprenticeship_alliance_focus > :not(:first-child):before
{
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 50%;
    width: 50%;
    height: 40px;
    transform: translateX(-50%);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: top center;
}
    .apprenticeship_alliance_focus .employer_engagement:before
    {
        background-image: url(icons/people_employer.svg);
    }
    .apprenticeship_alliance_focus .apprenticeship_expansion:before
    {
        background-image: url(icons/apprenticeship_expansion.svg);
    }
    .apprenticeship_alliance_focus .industry_workforce_partnerships:before
    {
        background-image: url(icons/partners.svg);
    }
    .apprenticeship_alliance_focus .policy_innovation:before
    {
        background-image: url(icons/policy.svg);
    }

/********************* Start Media queries for different layouts */
@media screen and (max-width: 1024px)
{
    /* Fold from 1 big and 4 little to 1 big and 2 little */
    .apprenticeship_alliance_focus
    {
        grid-template-columns: 1fr 0.75fr 0.75fr;
        width: 100%;
        left: unset;
    }
        .apprenticeship_alliance_focus > :nth-child(1)
        {
            grid-row: 1 / 3;
        }

    .apprenticeship_alliance_focus p
    {
        display: block;
        position: relative;
        width: 70%;
        left: 50%;
        transform: translateX(-50%);
    }
}
@media screen and (max-width: 1024px)
{
    /* Fold from 1 big and 4 little to 1 big and 2 little */
    :root
    {
        --sz_left: 10px;
    }
    .apprenticeship_alliance_focus
    {
        grid-template-columns: 0.8fr 1fr 1fr;
        width: calc(100% - 5px);
        left: unset;
    }
        .apprenticeship_alliance_focus h1
        {
            padding-left: var(--sz_left);
        }
            .apprenticeship_alliance_focus h1:before
            {
                left: var(--sz_left);
            }
}
@media screen and (max-width: 600px)
{
    .apprenticeship_alliance_focus
    {
        grid-template-columns: 1fr;
        left: unset;
    }
        .apprenticeship_alliance_focus h1
        {
            text-align: center;
            width: calc(100% - 20px);
        }
        .apprenticeship_alliance_focus h1:before
        {
            position: relative;
            width: 100%;
            left: 50%;
            transform: translateX(-50%);
        }
    .apprenticeship_alliance_focus > :not(:first-child):not(:last-child):after
    {
        /* Need to reset how the borders display */
        border-right: unset;
    }
    .apprenticeship_alliance_focus > :nth-child(2)
    {
        border-right: var(--border);
    }
}