﻿h1, h2, h3 {
    font-family: 'Lustria', serif;
    font-weight: 400;
    margin-top: 0;
    margin-bottom: 0;
}

h1, h2, h3, h4, h5, h6, div, p {
    padding-top: 0;
    padding-bottom: 0;
    margin-top: 0;
    margin-bottom: 0;
}

    /*article h2,
section .container h2 {
    font-size: 3rem;
    line-height: 4rem;
    margin-top: .4rem;
    margin-bottom: .4rem;
}*/

.btn { /*e.g. on search page*/
    font-size: 2rem;
    line-height: 3rem;
    white-space: normal;
}

a.btn {
    font-size: 1.6rem;
    line-height: 2.4rem;
    margin-top: .8rem;
    margin-bottom: .8rem;
    text-decoration: none;
}

blockquote {
    font-size: inherit;
}

/*.fullWidth {
    background-color: #eee;
}

.widerWidth {
    background-color: #ddd;
}

.narrowWidth {
    background-color: #ccc;
}*/

.parentTitle {
    font-size: 1.6rem;
    line-height: 2.4rem;
    font-family: Lato-Bold, Lato, sans-serif;
    text-transform: uppercase;
    margin-top: 0;
}

.parentTitle + h1 + h2 + p {
    margin-top: 2rem;
}

th {
    font-family: Lato-Bold, Lato, sans-serif;
}

@media screen and (min-width: 568px) {
    a.btn {
        font-size: 1.6rem;
        line-height: 2.4rem;
        margin-top: .8rem;
        margin-bottom: .8rem;
    }
}

.large, .medium {
    font-size: 1.6rem; /* =16px */
    line-height: 2.4rem; /* =24px */
}

.small {
    font-size: 1.4rem;
    line-height: 2.1rem;
}



h1 {
    font-size: 3rem;
    line-height: 4rem;
    /*padding-top: .5rem;*/
    margin-bottom: .5rem;
}

h2 {
    font-size: 2.4rem;
    line-height: 3.6rem;
    margin-bottom: .6rem;
}

p + h2 {
    margin-top: 1.2rem;
}

h3 {
    font-size: 1.8rem;
    line-height: 2.7rem;
    margin-bottom: .45rem;
}

h4 {
    font-size: 1.6rem;
    line-height: 2.4rem;
    margin-bottom: .4rem;
}

h5 {
    font-size: 1.4rem;
    line-height: 2.1rem;
    margin-bottom: .35rem;
}

/*section .container h1 {
    font-size: 3rem;
    line-height: 4rem;
}*/

/*article h2,
section .container h2 {
    font-size: 2.4rem;
    line-height: 3.6rem;
    margin-bottom: .2rem;
}*/

p {
    margin: 0 0 .4rem 0;
}

p.intro {
    font-size: 1.6rem;
    line-height: 2.4rem;
    margin-bottom: .4rem;
}

h1 + p.intro {
    /*margin-top: -.5rem;*/
}

@media screen and (max-width: 319px) {
    .hasImage h1 {
        font-size: 1.4em;
        line-height: 2.1rem;
    }

    .hasImage p {
        font-size: 1.6rem;
        line-height: 2.4rem;
    }
}

@media screen and (min-width: 320px) and (max-width: 567px) {
    .hasImage h1 {
        font-size: 2.2rem;
        line-height: 3.4rem;
    }

    .hasImage p {
        font-size: 1.6rem;
        line-height: 2.4rem;
    }
}

/*@media screen and (min-width: 568px) and (max-width: 767px) {
    .hasImage h1 {
        font-size: 3rem;
        line-height: 4.5rem;
    }

    h2 {
        font-size: 4rem;
        line-height: 6rem;
    }
}*/

@media screen and (min-width: 768px) {
    h1 {
        font-size: 3rem;
        line-height: 4rem;
        margin-bottom: .75rem;
    }

    .narrowWidth h1, .widerWidth h1,
    h2 {
        font-size: 2.4rem;
        line-height: 3.6rem;
        margin-bottom: .6rem;
    }

    p + h2 {
        margin-top: 1.2rem;
    }

    .narrowWidth h2, .widerWidth h2,
    h3 {
        font-size: 2rem;
        line-height: 3rem;
        margin-bottom: .5rem;
    }

    .narrowWidth h3, .widerWidth h3,
    h4 {
        font-size: 1.8rem;
        line-height: 2.7rem;
        margin-bottom: .45rem;
    }

    .narrowWidth h4, .widerWidth h4,
    h5 {
        font-size: 1.6rem;
        line-height: 2.4rem;
        margin-bottom: .4rem;
    }

    .narrowWidth h5, .widerWidth h5,
    .narrowWidth h6, .widerWidth h6,
    h6 {
        font-size: 1.6rem;
        line-height: 2.4rem;
        margin-bottom: .4rem;
    }

    p.intro {
        font-size: 1.6rem;
        line-height: 2.4rem;
        margin-bottom: .4rem;
    }

    h2 + p.intro {
        /*padding-top: 0;
        margin-top: -1.2rem;*/
    }

    article h1 + p.intro, article h1 + p.intro,
    article .container > h1 + p.intro, section .container > h1 + p.intro {
        font-size: 2rem;
        line-height: 3rem;
        margin-bottom: .5rem;
    }

    a.btn {
        font-size: 1.8rem;
        line-height: 2.7rem;
        margin-top: 1rem;
        margin-bottom: 1rem;
    }
}

@media screen and (min-width: 992px) {
    .large {
        font-size: 1.8rem; /* =20px */
        line-height: 2.7rem; /* =30px */
    }

    .medium {
        font-size: 1.6rem; /* =16px */
        line-height: 2.4rem; /* =24px */
    }

    .small {
        font-size: 1.4rem; /* =14px */
        line-height: 2.1rem; /* =21px */
    }

    h1 {
        font-size: 4rem;
        line-height: 6rem;
        margin-bottom: 1rem;
    }

    .narrowWidth h1, .widerWidth h1,
    h2 {
        font-size: 3rem;
        line-height: 4rem;
        margin-bottom: .75rem;
    }

    p + h2 {
        margin-top: 1.5rem;
    }

    .narrowWidth h2, .widerWidth h2,
    h3 {
        font-size: 2.4rem;
        line-height: 3.6rem;
        margin-bottom: .6rem;
    }

    .narrowWidth h3, .widerWidth h3,
    h4 {
        font-size: 2rem;
        line-height: 3rem;
        margin-bottom: .5rem;
    }

    .narrowWidth h4, .widerWidth h4,
    h5 {
        font-size: 1.8rem;
        line-height: 2.7rem;
        margin-bottom: .45rem;
    }

    .narrowWidth h5, .widerWidth h5,
    h6 {
        font-size: 1.6rem;
        line-height: 2.4rem;
        margin-bottom: .4rem;
    }

    .narrowWidth h6, .widerWidth h6 {
        font-size: 1.4rem;
        line-height: 2.1rem;
        margin-bottom: .35rem;
    }

    /*section .container h1 {
        font-size: 4rem;
        line-height: 6rem;
    }

    article h2,
    section .container h2 {
        font-size: 3rem;
        line-height: 4rem;
        margin-bottom: .4rem;
    }*/

    p.intro {
        font-size: 1.6rem;
        line-height: 2.4rem;
        margin-bottom: .4rem;
    }

    h2 + p.intro {
        /*padding-top: 0;
        margin-top: -1.2rem;*/
    }

    article h1 + p.intro, article h1 + p.intro,
    article .container > h1 + p.intro, section .container > h1 + p.intro {
        font-size: 2rem;
        line-height: 3rem;
        margin-bottom: .5rem;
    }

    a.btn {
        font-size: 2rem;
        line-height: 3rem;
        margin-top: 1rem;
        margin-bottom: 1rem;
    }
}

@media screen and (min-width: 1200px) {
    .large {
        font-size: 2rem; /* =20px */
        line-height: 3rem; /* =30px */
    }

    .medium {
        font-size: 1.6rem; /* =16px */
        line-height: 2.4rem; /* =24px */
    }

    .small {
        font-size: 1.4rem; /* =14px */
        line-height: 2.1rem; /* =21px */
    }

    h1 {
        font-size: 5.6rem; /* =56px */
        line-height: 7rem; /* =84px */
        margin-bottom: 1.4rem;
    }

    .narrowWidth h1, .widerWidth h1,
    h2 {
        font-size: 4rem;
        line-height: 6rem;
        margin-bottom: 1rem;
    }

    .widerWidth h1 {
        margin-top: -1rem; /* align with top of sub menu */
    }

    p + h2 {
        margin-top: 2rem;
    }

    .narrowWidth h2, .widerWidth h2,
    h3 {
        font-size: 3rem;
        line-height: 4.5rem;
        margin-bottom: .75rem;
    }

    .narrowWidth h3, .widerWidth h3,
    h4 {
        font-size: 2.4rem;
        line-height: 3.6rem;
        margin-bottom: .6rem;
    }

    .narrowWidth h4, .widerWidth h4,
    h5 {
        font-size: 2rem;
        line-height: 3rem;
        margin-bottom: .5rem;
    }

    .narrowWidth h5, .widerWidth h5,
    h6 {
        font-size: 1.8rem;
        line-height: 2.7rem;
        margin-bottom: .45rem;
    }

    .narrowWidth h6, .widerWidth h6 {
        font-size: 1.6rem;
        line-height: 2.4rem;
        margin-bottom: .4rem;
    }

    /*article h1,
    section .container h1 {
        font-size: 5.6rem;
        line-height: 7rem;
        margin-bottom: 1.4rem;
    }*/

    /*article h2,
    section .container h2 {
        font-size: 4rem;
        line-height: 6rem;
        margin-bottom: 1rem;
    }*/

        /*article .container > h1 + p.intro + a.btn, article .container > h2 + p.intro + a.btn,
        section .container > h1 + p.intro + a.btn, section .container > h2 + p.intro + a.btn {
            margin-top: 1rem;
        }*/

    p.intro {
        font-size: 1.8rem;
        line-height: 2.7rem;
        margin-bottom: .45rem;
    }

    h2 + p.intro {
        /*padding-top: 0;
        margin-top: -1.35rem;*/
    }

    article h1 + p.intro, article h1 + p.intro,
    article .container > h1 + p.intro, section .container > h1 + p.intro {
        font-size: 2.4rem; /* =24px */
        line-height: 3.6rem; /* =36px */
        margin-bottom: .6rem;
    }

    /*article h2 + p.intro, section h2 + p.intro,
    article .container > h2 + p.intro, section .container > h2 + p.intro {
        font-size: 1.8rem; 
        line-height: 2.7rem; 
    }*/

    a.btn {
        font-size: 2rem;
        line-height: 3rem;
        margin-top: 1rem;
        margin-bottom: 1rem;
    }

    .main-nav a.btn {
        margin-bottom: 0;
    }
}

    /* rationalised classes */

    .firstLetter:first-letter {
        font-family: Lustria, serif;
        font-size: 8rem;
        line-height: 8rem;
        vertical-align: top;
        float: left;
        margin: 0 0 -1rem 0;
        padding: 0 6px 0 0;
    }


    .servicesListing .serviceListingTitle{
        font-family: Lato, sans-serif;
    }


.servicesListing .serviceListingNotes {
    font-size: 1.8rem;
    line-height: 2.7rem;
}

    .servicesListing .serviceListingOoS {
        font-style: italic;
    }

.serviceOOS .serviceFestival,
.serviceList .serviceFestival {
    font-family: Lato-Bold, Lato, sans-serif;
    text-transform: uppercase;
    font-size: 1.4rem;
    line-height: 2.1rem;
    padding-bottom: 1.5rem;
    display: inline-block;
}



/* !! remove all -32px margins and put this in structure */
.collection_children div[class*="col-"] .hasImage .contentOuter {
    padding: 0 15px;
}

    .widerWidth .collection_children div[class*="col-"] .hasImage .contentOuter {
        padding: 0 10px;
    }

    @media screen and (min-width: 1200px) {
        .collection_children div[class*="col-"] .hasImage .contentOuter {
            padding: 0 30px;
        }

        .widerWidth .collection_children div[class*="col-"] .hasImage .contentOuter {
            padding: 0 10px;
        }
    }

    .collection_children div[class*="col-"] .content.hasImage {
        width: 100%;
        background-color: #fff;
        color: #1e1e1e;
        position: relative;
        padding: 1px 15px 15px;        
        text-align: center;
        border-bottom: 1.5px solid #D3CDCD;
        margin: -32px 0 0 0;
    }

    .widerWidth .collection_children div[class*="col-"] .content.hasImage {
        /*margin: -32px 2px 0 2px;*/
    }

    @media screen and (min-width: 1200px) {
        .collection_children div[class*="col-"] .content.hasImage {
            /*margin: -32px 30px 0 30px;*/
        }

        .widerWidth .collection_children div[class*="col-"] .content.hasImage {
            /*margin: -32px 10px 0 10px;*/
        }
    }

    /* fonts */

    .collection_children div[class*="col-"] .content.hasImage h3 {
        font-family: Lato-Bold, Lato, sans-serif;
        font-size: 2rem;
        line-height: 3rem;
        padding-top: 1rem;
        margin-bottom: .5rem;
    }

    .collection_children div[class*="col-"] .content.hasImage h6 {
        font-size: 1.4rem;
        line-height: 2.1rem;
    }

    .widerWidth .collection_children div[class*="col-"] .content.hasImage h3 {
        font-size: 1.8rem;
        line-height: 2.7rem;
        padding-top: 1.35rem;
        margin-bottom: .675rem;
    }

    .collection_children div[class*="col-"] .content.hasImage {
        font-size: 1.8rem;
        line-height: 2.7rem;
    }

    .widerWidth .collection_children div[class*="col-"] .content.hasImage {
        font-size: 1.6rem;
        line-height: 2.4rem;
    }


    @media screen and (min-width: 768px) {
        .collection_children div[class*="col-"] .content.hasImage h3 {
            font-size: 1.6rem;
            line-height: 2.4rem;
            padding-top: 1.2rem;
            margin-bottom: .6rem;
        }
        /*.widerWidth .collection_children div[class*="col-"] .content.hasImage h3 {
        font-size: 1.4rem;
        line-height: 2.1rem;
        padding-top: .7rem;
        margin-bottom: .7rem;
    }*/

        .collection_children div[class*="col-"] .content.hasImage {
            font-size: 1.6rem;
            line-height: 2.4rem;
        }
        /*.widerWidth .collection_children div[class*="col-"] .content.hasImage {
            font-size: 1.6rem;
            line-height: 2.4rem;
    }*/
    }

    @media screen and (min-width: 992px) {
        .collection_children div[class*="col-"] .content.hasImage h3 {
            font-size: 1.8rem;
            line-height: 2.7rem;
            padding-top: 1.35rem;
            margin-bottom: .675rem;
        }

        .widerWidth .collection_children div[class*="col-"] .content.hasImage h3 {
            font-size: 1.6rem;
            line-height: 2.4rem;
            padding-top: 1.2rem;
            margin-bottom: .6rem;
        }

        .collection_children div[class*="col-"] .content.hasImage {
            font-size: 1.6rem;
            line-height: 2.4rem;
        }

        .widerWidth .collection_children div[class*="col-"] .content.hasImage {
            font-size: 1.6rem;
            line-height: 2.4rem;
        }
    }

    @media screen and (min-width: 1200px) {
        .collection_children div[class*="col-"] .content.hasImage h3 {
            font-size: 2rem;
            line-height: 3rem;
            padding-top: 1.5rem;
            margin-bottom: .75rem;
        }

        .widerWidth .collection_children div[class*="col-"] .content.hasImage h3 {
            font-size: 1.8rem;
            line-height: 2.7rem;
            padding-top: 1.35rem;
            margin-bottom: 0;
        }

        .collection_children div[class*="col-"] .content.hasImage {
            font-size: 1.8rem;
            line-height: 2.7rem;
            margin-bottom: .9rem;
        }

        .widerWidth .collection_children div[class*="col-"] .content.hasImage {
            font-size: 1.6rem;
            line-height: 2.4rem;
            margin-bottom: .8rem;
        }
    }