html,
    body {
        background-color: #fff;
        color: #494949;
        font-family: "Varela Round", sans-serif;
        width: 100%;
        height: 100%;
margin: 0;
overflow-x: hidden;
        align-items: center;
        justify-content: center;
        align-content: center;
        letter-spacing: 0.03em;
        font-size: 1.1rem;
        line-height: 1.4em;
        text-align: center;
    }
    @-ms-viewport {
    width: device-width;
}

html {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -ms-overflow-style: scrollbar;
}

*,
*::before,
*::after {
    -webkit-box-sizing: inherit;
    box-sizing: inherit;
}
    h1 {font-size: 1.44em;         line-height: 1.4em;}
    h2 {font-size: 1.44em;         line-height: 1.4em; text-align: center;}
    h3 {font-size: 1.44em;         line-height: 1.4em; color: #00a655;  text-align: center}
    h4 {font-size: 1.44em; font-weight: bold;        line-height: 1.4em;}
    h5 {font-size: 1.2em;}
    p, li {line-height: 1.5em;}
    a {
        color: #06aeef;
    }
    a:hover {
        color: #ed018c;
    }  
    .content {
        max-width: 860px;
        margin: 0 auto;
        padding: 0 15px;
    }
    .section,
    section {
        padding: 30px 0;
    }
    header img {
        width: 600px;
        max-width: 100%;
        margin: 0 auto;
    }
    img {
        max-width: 100%;
        width: auto;
        display: block;
    }


    .item {
        width: calc(100vw - 60px);
        height: calc(100vh - 190px);
        display: flex;
        align-items: center;
        justify-content: center;
        align-content: center;
        max-width: 100%;;
    }
    .item img {
        max-width: 100%;
        width: auto;
                max-height: 100%;
        height: auto;
        margin: 0 auto;
    }

    article {
        text-align: left;
    }


    @media (min-width: 768px) {

    h1 {font-size: 2em;         line-height: 1.4em;}
    h2 {font-size: 1.72em;         line-height: 1.4em; text-align: center;}
    h3 {font-size: 1.72em;         line-height: 1.4em; color: #00a655;  text-align: center}
    h4 {font-size: 1.44em; font-weight: bold;        line-height: 1.4em;}
    h5 {font-size: 1.2em;}
    p, li {line-height: 1.5em;}

    .row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        margin-right: -30px;
        margin-left: -30px;
        margin-bottom: 30px;
    }
}
    
.no-gutters {
    margin-right: 0;
    margin-left: 0;
}

.no-gutters>.col,
.no-gutters>[class*="col-"] {
    padding-right: 0;
    padding-left: 0;
}


.boxed {
    max-width: 500px;
    margin: 0 auto;
}
footer {
    padding-top: 30px;
    padding-bottom: 30px;
}
.smallprint {font-size: 0.8em; line-height: 1.2em;}

.quote {font-size: 1.2em;         line-height: 1.4em; text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        align-content: center;
    color: #ffa301;}
.quote:before {
  content: open-quote;
}

.quote:after {
  content: close-quote;
}

@media (min-width: 768px) {
    .quote {font-size: 2em;   }     
    .col-1,
.col-2,
.col-3,
.col-4 {
    position: relative;
    min-height: 1px;
    padding-right: 30px;
    padding-left: 30px;
}
    .col-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }
    .centre-row {
        align-items: center;
    }
     .row-reverse {
        flex-direction: row-reverse;
     }

     .alignfull {
    margin-left: calc(-100vw / 2 + 100% / 2);
    margin-right: calc(-100vw / 2 + 100% / 2);
    width: 100vw;
    padding: 30px 60px
}
}


.embed-container { width: 100%; ;position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }