html, body {
    height: 100%;
    margin: 0;
    font-size: 16px;
}
body {
    display: flex;
    justify-content: center;
    align-items:center;
    font-size: 16px;
    background: url('../img/bg.jpg') top center no-repeat;
    background-size: cover;
    font-family: 'Roboto', sans-serif;
    font-size: 1em;
}
.centred {
    background: #bd3170;
    padding: 0 3.125em;
}
.centred h1 {
    font-size: 2em;
    color: aliceblue;
    text-align: center;
}

@media screen and (min-width: 786px) {
    .centred h1 {
        font-size: 3em;
    }
}

@media screen and (min-width: 1200px) {
    .centred h1 {
        font-size: 4em;
    }
}