body{
    background-color: rgb(41, 41, 41)
}
#homeTitle{
    grid-area: pageTitle;
    color: whitesmoke;
}
.submitLand{
    grid-area: submitButton;
}
.caerphillyBanner , .riscaBanner,.penarthBanner{
    margin-top: 20px;
    background-color: darkslategrey;
    margin-bottom: 20px;
    border: solid 2px whitesmoke;
    /*border colour here at .banner and .bannertrail*/
    border-right: none;
}
.caerphillyBannerTrail,.riscaBannerTrail,.penarthBannerTrail{
    background-color: darkslategrey;
    margin-top: 20px;
    margin-bottom: 20px;
    border: solid 2px whitesmoke;
    border-left: none;
    text-align: center;
}

.penarthBannerTrail{
    background-image: linear-gradient(to right, darkslategrey , darkgoldenrod 40%);
}

.caerphillyBannerTrail{
    margin-top: 20px;
    margin-bottom: 20px;
    border: solid 2px whitesmoke;
    border-left: none;
    background-image: linear-gradient(to right, darkslategrey , darkgoldenrod 30%);
}

.riscaBannerTrail{
    background-image: linear-gradient(to right, darkslategrey , darkgoldenrod );
}

.caerphillyBanner{
    grid-area:townBannerC;
    background-image: url('/images/CaerphillyCastle.jpg');
    /*// from cadw*/
    background-size: 850px 200px;
    background-repeat: no-repeat;
    background-position: left 35%;
    color: inherit;
    text-decoration: none;
    /*filter: grayscale(30%);*/
}

/*!*https://www.stayinwales.co.uk/wales_picture.cfm?p=4454*! Risca img*/

.riscaBanner {
    /*    #caerUrl{*/
    grid-area: townBannerR;
    background-image: url('/images/RiscaBanner.jpg');
    background-size: 850px 200px;
    background-repeat: no-repeat;
    background-position: left 65%;
    color: inherit;
    text-decoration: none;

}

.penarthBanner {
    grid-area: townBannerP;
    background-image: url('/images/PenarthBanner.jpg');
    background-size: 850px 200px;
    background-repeat: no-repeat;
    background-position: left 78%;
    color: inherit;
    text-decoration: none;
}
.caerphillyBannerTrail{
    grid-area:townBannerDetsC;
}
.riscaBanner{
    grid-area:townBannerR;
}
.riscaBannerTrail{
    grid-area:townBannerDetsR;
}
.penarthBanner{
    grid-area:townBannerP;
}
.penarthBannerTrail{
    grid-area:townBannerDetsP;
}
#aboutUsFlavour{
    grid-area: textFlavour;
    margin-top: 25px;
    margin-bottom: 15px;
    color: whitesmoke;
}
#trailCountCaer,#trailCountRisca,#trailCountPenarth{
    flex:1;


    /*align-items: center;*/
    /*justify-content: center;*/

}
#trailProgressCaer,#trailProgressRisca,#trailProgressPenarth{
    flex:2;
    align-content: center;

}


.gridContainer1{
    display:grid;
    grid-template-columns: 10% 10% 60% 5% 5% 10%;
    grid-template-rows: auto;
    grid-template-areas:
            ". pageTitle pageTitle pageTitle pageTitle ."
            ". . . submitButton submitButton ."
            ". townBannerC townBannerC townBannerDetsC . ."
            ". townBannerR townBannerR townBannerDetsR . ."
            ". townBannerP townBannerP townBannerDetsP . ."
            " . . textFlavour . . .";
}