/*	Hero title
********************/

.hero-title {
    background: transparent;
    position: relative;
    overflow: hidden;
}


/* .hero-title {
 	background: #fff;
color: #000;

}
*/

.hero-title {
    background: #e0301e;
    color: #fff;
}


/*.bg-white  .hero-title { 
background: #e0301e;
color: #fff;
}*/


/*	end apply sections colours n.b. default is red*/


/*.hero-title--no-text {
min-height: 500px;
}*/

.hero-title-textpanel {
    background: inherit;
    margin: 20px 0;
    padding: 0;
}

.hero-title-textpanel h1 {
    color: #fff;
    margin: 0 0 10px;
}

.hero-title-textpanel p {
    /*font-size: 18px;*/
    /*margin-bottom: 20px;*/
}

.hero-title-textpanel p.sub-heading {
    /*font-size: 24px;*/
}

.hero-title .btn-see-more {
    display: block;
    background: #3d3d3d url(../images/arrowDown.png) center center no-repeat !important;
    /*	use !important to override ID that was used for styling :(	*/
    border-radius: 60px;
    display: block;
    height: 60px;
    margin: 40px auto 40px auto;
    position: relative;
    width: 60px;
}

.hero-title-textpanel a {
    font-size: 1.142rem;
    font-style: italic!important;
    text-align: right;
    text-decoration: none;
    color: #a32020;
    line-height: 2em;
}

@media (min-width: 768px) {
    body .hero-title {
        background: transparent !important;
        min-height: 350px;
        /* min height is set to be 16:9 on desktop*/
        /*min-height: 56vw;*/
    }
    .hero-title-textpanel {
        background: #fff;
        color: #000;
        margin: 40px 0;
        padding: 40px 40px 20px;
    }
    .hero-title-textpanel h1 {
        color: #000;
    }
    .hero-title-component--colour-h1 .hero-title-textpanel h1 {
        color: #e0301e;
    }
    .hero-title-textpanel p {
        color: #404041;
        /*font-size: 18px; /*	maybe tweaked for mobile	*/
    }
    .hero-title-textpanel p.sub-heading {
        /*font-size: 24px;*/
    }
    /*.bg-burgundy .hero-title h1,
  .bg-burgundy .hero-title .sub-heading,
  .bg-burgundy .hero-title p{
  color: #fff !important;
  }*/
    /* hero title with colour heading */
    .page-primary-col--orange .hero-title-component--colour-h1 .hero-title-textpanel h1 {
        color: #dc6900;
    }
    .page-primary-col--red .hero-title-component--colour-h1 .hero-title-textpanel h1 {
        color: #e0301e;
    }
    .page-primary-col--burgundy .hero-title-component--colour-h1 .hero-title-textpanel h1 {
        color: #a32020;
    }
    .page-primary-col--maroon .hero-title-component--colour-h1 .hero-title-textpanel h1 {
        color: #602320;
    }
    .page-primary-col--rose .hero-title-component--colour-h1 .hero-title-textpanel h1 {
        color: #db536a;
    }
    .page-primary-col--grey .hero-title-component--colour-h1 .hero-title-textpanel h1 {
        color: #968c6d;
    }
    .page-primary-col--black .hero-title-component--colour-h1 .hero-title-textpanel h1 {
        color: #6d6e71;
    }
}

@media (min-width: 1024px) {
    .hero-title .btn-see-more {
        bottom: 40px;
        left: 50%;
        margin: 0 0 0 -30px;
        position: absolute;
    }
}


/*	end hero title
********************/