#layout {
    background: #e4cbf3;
}

#content {
padding-top: 320px;
background: url(../images/small-banner.jpg) no-repeat 50% 0;
/* to allow for the top image */
}

.additional{
    margin-top: 30px;
}
.additional p {
    font-size: 10px;
    margin: 0;
}

ul li {
    margin-top: 20px;
}


@media (min-width: 45em) {

    #boots-wrapper {
    width: 58em;
    }

    #content {
    background: url(../images/large-banner.jpg) no-repeat 0 0;
    padding-top: 9%;
    }

    #form1 .bottomForm #content {
    /* example if having the form at the bottom instead */
    /* This is hardcoded in the IE8 style sheet, so just confirm that the image is around 500px high at full screen width*/
     padding-top: 64%;
    }
}


/****** ADD BESPOKE CSS HERE *****/