body.home
{
    background: var(--content-background) url(/assets/images/home-background.jpg) top right / 50% auto no-repeat;
}

#main
{
    min-height: 100vh;
}

#home-content-wrapper
{
    max-width: 62rem;
}

h1 span
{
    color: var(--accent-colour);
}

#home-content-wrapper #intro,
#home-content-wrapper #usps
{
    font-size: 1.8rem;
    line-height: 1.3;
}

#home-content-wrapper #usps
{
    list-style: none;
    margin: 3rem 0 8rem;
    padding: 0 0 0 40px;
}

#home-content-wrapper #usps li
{
    line-height: 1.2;
    margin-bottom: 30px;
    padding-left: 50px;
    position: relative;
}

#home-content-wrapper #usps li::before
{
    content: "\f26b";
    color: #40ff5e;
    font-family: bootstrap-icons;
    font-size: 3.2rem;
    font-weight: 400;
    left: 0;
    line-height: 1;
    position: absolute;
    top: -5px;
}

@media only screen and (max-width: 840px)
{

    body.home
    {
        background-position: bottom right;
        background-size: 80% auto;
    }

}

@media only screen and (max-width: 581px)
{

    body.home
    {
        background-position: right 40%;
    }

    #home-content-wrapper h1
    {
        font-size: 4.6rem;
    }

    #home-content-wrapper #intro,
    #home-content-wrapper #usps
    {
        font-size: 1.6rem;
    }

    #home-content-wrapper #usps
    {
        padding-left: 0;
    }

}