/* colours - dark-blue #2b2c3a, pink #e2186c, mint green #1fd19e, yellow #ffd500, teal #00aebf */

#page {	background:#fff;}
#page { padding-top: 0;}

#page .transparent {
    background-color: #ba1c1c00 !important;
}

#microsite_header {
    background-color: #2b2c3a !important;
	padding-top:1em;
}
	 
.banner-area {margin-top: -1.5em;}

.breadcrumb a, .breadcrumb a:visited, .breadcrumb a:active, 
.breadcrumb a:focus, .breadcrumb a:hover, .breadcrumb li:after {
    color: #fff;
    border-color: #fff;
}

.pad-double-bottom {
    padding-bottom: 2rem;
}

/* NAVIGATION */

#page .pseudo-h1 a {
    border-bottom: none;
    color: #fff;
}

#page .navbar-inner {
    box-shadow: none;
    border: 0;
    background-color: #2b2c3a;
}


#page .navbar .nav>li {
    border: none;
}

#page .navbar .nav>li:last-child {
    border-right: 0;
}

#page .navbar .nav>li>a {
    color: #fff;
    text-shadow: none;
    font-family: 'Oswald', sans-serif;
	
}

.navbar .nav li.dropdown>.dropdown-toggle .caret {
    border-top-color: #fff;
    border-bottom-color: #fff;
}


#page .navbar .nav>li:nth-of-type(5) a {
	background: #d22777;
	color: #fff;   
	padding:0.5em
}

#page .navbar .nav>li:nth-of-type(5) a:hover {
    background: #1fd19e;
}

/* Hide nav bar drop-downs for Programmes */
#local_menu_header li:nth-of-type(2).dropdown .caret, #local_menu_header li:nth-of-type(2).dropdown ul.dropdown-menu {
    display: none;
}
.dropdown-menu li a, .dropdown-menu li a:visited{
	font-weight: 400 !important;
	color: #000;
}
.dropdown-menu li a:hover{
	color:#fff;
}

/*BANNERS - Breakout area alternate for rips under videos, banner-area for HHI*/

/*.breakout-area.rip.alternate.blue, .breakout-area.rip.banner-video  {
	margin-top:-1.5em
} NG 14 10 24 */

.breakout-area.rip.alternate.blue {
	/* margin-top:-1.5em; */
}




/* FOOTER */

/* NG 14 11 24 */
footer {
    background: transparent;
}

.breakout-area.footer {
	background-color: #2B2C3A !important;
	border-top:none;	
	margin-top: 0;
}

footer .hoc-footer h2, footer .hoc-footer p {color: #fff!important;}
footer .footer .container {background-color: #E3E3E3 !important;}

.hoc-footer h2 {
    text-transform: uppercase;
	font-family: 'Oswald', sans-serif;
    font-weight:600;
}

.hoc-footer a[role=button] {
	border-radius: 50px;
    box-shadow: none;
    background-color: #fff;
    color: #2B2C3A;
    border: none;
    font-weight: 700;
}
.hoc-footer a[role=button]:hover { 
	background-color: #1fd19e;   
	color: #2B2C3A;
}
/* Fix space on hcc footer NG 10 10 24 */
footer.navbar.noprint {
    padding-top: 0;
}

/*HEADINGS and LABELS*/

#page h1,
#page_content h1, #page .pseudo-h1,
#page h2, #page_content h2,
#page h3, #page_content h3,
#local_menu_header a {
    text-transform: uppercase;
	font-family: 'Oswald', sans-serif;
    font-weight:600;
}

#page .pseudo-h1 {font-size: 2.5em;	padding-top: 15px}

#page .breakout-area.dkblue p.lead {
    color: #ffd500;
    font-weight:700;
    font-size:3em;
	font-family: 'Oswald', sans-serif;
    text-transform:uppercase;
    text-align:center;
}

p.intro {font-size:1.25em}

.breakout-area.dkblue highlight { color:#1fd19e }

.breakout-area.dkblue highlight-two {color:#ffd500 }

.breakout-bg.pink highlight {
 	text-transform: initial;
 	display: block;
 	font-family: 'Source Sans Pro', Arial, sans-serif;
 	font-weight: 700;
 	line-height: normal;
}

.breakout-area.teal {
    background-color: #00aebf;
    }

/* HOME PAGE - PEACE OF MIND */

h3.pink-label {
    background-color: #e2186c;
    color:#fff;
    padding: 0.5em;  
    text-align: center;
}

h3.purple-label { 
	background-color: #544797;  
	color:#fff;
    padding: 0.5em;
    text-align: center;
}
   
h3.green-label { 
    background-color: #387e70;  
    color:#fff;
    padding: 0.5em;
    text-align: center;
}


/*BREAKOUTS WITH RIPS*/


/* NG 09 12 24 - fix for h3 heading that comes out a bit small */
.breakout-area.rip h3.bigger {
	font-size: 1.5rem;
}


.breakout-area.white.rip:before {
    background-image: url(/-/media/Files/CSS/hoc-schools/rip-white);
    top: -2.5em; /* NG 30 09 24 */
}

/*.breakout-area.rip.blue {
	background-color: #2b2c3a;
	color:#fff
} NG 20 11 24 */
/* NG 20 11 24 */
.breakout-area.dkblue {
	background-color: #2b2c3a;
	color:#fff;
}
 /*
.breakout-area.blue.rip:before {
    background-image: url(/-/media/Files/CSS/hoc-schools/rip-navy);
}
*/
.breakout-area.rip.green {   
	background-color: #1fd19e;
	color: #000;
}

/*
.breakout-area.rip.green:before {
    background-image: url(/-/media/Files/CSS/hoc-schools/rip-mint);
}

*/

/* NG 20 09 24 */
.content .breakout-area.rip.green a, .content .breakout-area.rip.green a[href$=".pdf"]:after {
    color: #000;
    border-bottom: 1px solid #000;
}
.content .breakout-area.rip.green a[href$=".pdf"]:after {
    border: #000 solid 1px;
}

/* yellow triangles on green rip NG 25 09 24 */
@media only screen and (min-width: 48em) {
    .breakout-area.rip.green.yellow:after {
        content: "";
        display: inline-block;
        width: 200px;
        height: 137px;
        background-image: url(/-/media/Files/CSS/hoc-schools/triangles-yellow.png);
        background-repeat: no-repeat;
        position: absolute;
        background-size: 60%;
        top: 0.6rem;
        right: -3rem;
    }
}

@media only screen and (min-width: 64em) {
    .breakout-area.rip.green.yellow:after {
        top: -1.4rem;
    }
}

@media only screen and (min-width: 90em) {
    .breakout-area.rip.green.yellow:after {
        background-size: 90%;
        top: 0rem;
        right: 2rem;
    }
}

/* OUR VALUES */
.breakout-area.grey {
    background-color: rgba(0, 0, 0, .05);
    padding-bottom: 1.5em;
    margin-bottom: 3em;
}

.breakout-area.grey .well {
    border: 1px solid #2b2c3a;
    background-color: #1fd19e;
}

/* Fix for wells on vertical tablets */
@media only screen and (min-width: 37em) and (max-width: 58em) {
    .columns.two.offset-by-one {
        margin-left: 0em !important;
    }
    
    .breakout-area.grey .well {
        width: 100%;
    }

    .breakout-area.grey .well h3 {
        text-align: center;
    }
}


/*BREAKOUT BACKGROUND BLOCKS*/

.breakout-bg.bg {
    padding-bottom: 1em;
}

.breakout-bg.bg.rip { 
	margin-top: 7em;  
}

#page .breakout-bg.bg.green {
    background-color: #1fd19e;
    padding-top: 1em;
    margin-top: 1em;
}

/* NG 22 10 24 */
#page .breakout-bg.bg.transparent.green {
    background-color: transparent;
    padding-top: 1em;
    margin-top: 1em;
}

#page .breakout-bg.bg.transparent.green .breakout-content {
    background-color: #1fd19e;
    padding-top: 1.5rem;
    padding-bottom: 0.5rem;
    margin-bottom: 2.5rem;
}

/* NG 25 09 24 */
#page .breakout-bg.bg.grey {
    padding-bottom: 0;
}

#page .breakout-bg.bg.grey .breakout-content {
    background-color: rgba(0, 0, 0, .05);
    padding-top: 1.5rem;
    padding-bottom: 0.5rem;
    margin-bottom: 2.5rem;
}

/* BBBs in footer NG 11 10 24 */
footer.navbar.noprint .breakout-bg.bg.transparent {
    background-color: transparent;
}


/* SPECIAL OFFERS */

.breakout-bg.bg.pink {padding-bottom: 4em;} /* NG 02 10 24 */

.breakout-bg.bg.pink .breakout-content {
    background-color: #e2186c;
    padding: 1em;
    color:#fff;
}

.breakout-bg.bg.pink .breakout-content p.large {
	color: #fff;
}

.breakout-bg.bg.pink .breakout-content:before {
    content: "";
    display: inline-block;
    width: 200px;
    height: 137px;
    background-image: url(/-/media/Files/CSS/hoc-schools/rwe-programmes/triangles-mid-green-200x137);
    background-repeat: no-repeat;
    position: absolute;
    background-size: 80%;
    top: -4.3em; /* top: -3.3em */
    right: -4em;
}

.breakout-bg.bg.pink .breakout-content:after {
    content: "";
	background-image: url(/-/media/Files/CSS/hoc-schools/rwe-programmes/triangles-mid-green-200x137);
	display: inline-block;
    width: 200px;
    height: 137px;
    background-repeat: no-repeat;
    position: absolute;
    background-size: 80%;
    bottom: -3.3em;
    left: -4em;
	rotate:180deg;
}

/* BUTTONS */
#page a[role="button"] {
	border-radius:50px;
	box-shadow: none !important;
 	background-color: #2B2C3A;
    color: #fff;
    border:none;
	font-weight:700;
}

#page a[role="button"]:hover { 
	background-color: #1fd19e;   
	color: #2B2C3A;
}

a[href$=".pdf"]:hover:after {
    color: #2B2C3A;
    border: 1px solid #2B2C3A;
}

a.half-width {
	min-width:50%; 
	min-height:1.5em;
	padding:0.25em;
}

#page a[role="button"].white {background-color: #fff;	color: #2B2C3A; border: solid 1px #2B2C3A;}
#page a[role="button"].white:hover {background-color: #1fd19e;   color: #2B2C3A;}
#page a[role="button"].purple {background-color:#544797!important;  color:#fff!important}
#page a[role="button"].yellow {background-color:#ffd500!important; color: #000;}
#page a[role="button"].pink {background-color:#d22777!important; color: #fff;}
#page a[role="button"].pink:hover {background-color: #1fd19e!important;   color: #2B2C3A;}
#page a[role="button"].teal {background-color:#00aebf!important;  color:#000!important}
#page a[role="button"].green {background-color: #1fd19e;	color: #2B2C3A;}
#page a[role="button"].green:hover {background-color: #2B2C3A; color: #fff;}
#page a[role="button"].argoed {background-color:#7459a2!important;}
#page a[role="button"].calshot {background-color:#1165af!important;}
#page a[role="button"].rwe {background-color:#446026!important;}
#page a[role="button"].tbc {background-color:#ee730d!important;color: #000;}
#page a[role="button"].minstead {background-color:#a1cb76!important; color:#000;}
#page a[role="button"].stubbington {background-color:#1e9ca3!important; color:#000;}
#page a[role="button"].argoed:hover, #page a[role="button"].calshot:hover, #page a[role="button"].rwe:hover, #page a[role="button"].tbc:hover {background-color:#1fd19e!important;color: #000;}
#page a[role="button"].blue-border {background-color: #2B2C3A; color: #fff; border: solid 1px #2B2C3A;}
#page a[role="button"].blue-border:hover {background-color: #fff; color: #2B2C3A; border: solid 1px #2B2C3A;}

/* NG 16 09 24 */
#page .well.alternate a[role="button"]{
    color: #2B2C3A;
    background-color: #fff;
}

#page .well.getintouch.pink a[role="button"]{
    color: #2B2C3A;
    background-color: #fff;
    border: none;
}

#page .well.getintouch.pink a[href$=".pdf"]:after {
    color: #2B2C3A;
    border: #2B2C3A solid 1px;
}

#page .well.getintouch.pink a[role="button"]:hover { 
	background-color: #1fd19e;   
	color: #2B2C3A;
}

/* NG 20 09 24 */
.well.getintouch.alternate {
    background-color: #2B2C3A;
    color: #fff;
	margin-top: 0;
    padding-left: 1em;
}

#page .well.getintouch.alternate a[role="button"] {
	border-radius:50px;
	box-shadow: none !important;
 	background-color: #fff;
    color: #2B2C3A;
    border:none;
}
#page .well.getintouch.alternate a[role="button"]:hover { 
	background-color: #1fd19e;   
	color: #2B2C3A;
}
.content .well.getintouch.alternate a {
    color: #fff;
    border-bottom: 1px solid #fff;
}

#page .well.getintouch.alternate a[href$=".pdf"]:after {
    color: #2B2C3A;
    border: #2B2C3A solid 1px;
}


/* ACCORDIONS */

#page summary:hover, summary:focus {
     border: none;
}

details>summary {
    background-color: #e2186c;
    border: none;
	border-radius:30px;
	color: #fff;
    box-shadow:none;
	margin: 0.1em;
}

details>summary::before {
    color: #fff;
	border:0;
}

details[open]>summary:before {
    color: #fff;
    border-color: #fff;
}

/* Fix horizontal alignment for standard accordion content */
details div {
    padding-left: 2em;
}

@media only screen and (min-width: 48em) {
    details div {
        padding-left: 3em;
    }
}

.breakout-bg.bg.alternate-two.transparent details div,.breakout-bg.bg.alternate-four.transparent details div {
    padding-left: 0;
}

/* ACCORDIONS - GREEN - NG 18 02 25 */
.breakout-bg.bg.alternate-six.transparent details>summary {
    background-color: #1fd19e;
    color: #000;
}

.breakout-bg.bg.alternate-six.transparent details>summary::before {
    color: #000;
    border: 0;
}

.breakout-bg.bg.alternate-six.transparent details h3 {
    font-size: 1.2rem;
}

.breakout-bg.bg.alternate-six.transparent details h4, .breakout-bg.bg.alternate-six.transparent details h5 {
    text-transform: uppercase;
	font-family: 'Oswald', sans-serif;
    font-weight:600;
}

.breakout-bg.bg.alternate-six.transparent details h4 {
    font-size: 1.1rem;
}

.breakout-bg.bg.alternate-six.transparent details h5 {
    font-size: 0.98rem;
}

@media only screen and (min-width: 48em) {
    .breakout-bg.bg.alternate-six.transparent details div {
        padding-left: 0.65em;
    }
}


/* NEED TO CHECK WHERE ELSE WE USE THIS */

/*a[href$=".pdf"]:after {
    color:#fff;
	border:#fff solid 1px
}*/

/*WELLS*/

.breakout-area.primary .well.transparent {
    text-align: center;
}

.breakout-area.primary .well.transparent a {
    color: #fff;
    border-bottom: 1px solid #FFF;
}    

.well {
    background-color: #fff;
	color: #000;
    border-radius:30px; /* NG 25 09 24 */
}

.well.alternate {
    background-color: #2B2C3A;
    color: #fff;
	padding-left:2em;
}

.well.alternate-two {
    background-color: #1fd19e;
    color: #000;
	padding-left:2em;
}

.well.alternate-three {
    background-color: rgba(0, 0, 0, .05);
    color: #000;
	padding-left:2em;
}

.well.alternate-four {
    background-color: #00aebf;
    color: #000;
	padding-left:2em;
}

/* NG 9 02 25 */
.well.alternate-five {
    background-color: #e2186c;
    color: #fff;
	padding-left:2em;
}

/* NG 26 09 24 */
.content .well.alternate a, .content .well.alternate-five a {
    color: #fff;
    border-bottom: 1px solid #fff;
}  

/* NG 07 11 24 */
.content .well.alternate-two a, .content .well.alternate-three a, .content .well.alternate-four a  {
    color: #000;
    border-bottom: 1px solid #000;
} 

.well.getintouch {
    background-color: #fff;
	margin-top: 1em;
	/*border-radius: 30px;*/
	text-align: center;
}

.content .well.getintouch a {
    color: #000;
    border-bottom: 1px solid #000;
}

.content .well.getintouch a[role=button][href$=".pdf"]:after {
    color:#fff;
	border:#fff solid 1px;
}

.content .well.getintouch a[role=button][href$=".pdf"]:hover:after {
    color:#2B2C3A;
	border:#2B2C3A solid 1px;
}

/* LOCATION WELLS - centres page */
.well.location {
    border: solid;
}

#page .well.pink {
    background-color: #d22777;
	color: #fff;
}

#page .well.pink h2 {
    color: #fff;
}


#page .well.getintouch.pink a {
    color: #fff;
    border-bottom: 1px solid #fff;
}

#page .well.getintouch.pink .icon.phone:before {
    color: #fff;
}

.well.pink h3 {
    color: #d22777;
}

.well.purple h3 {
    color: #544797;
}

.well.triangles {
    border-radius: 30px;
    margin: 2rem 0 2em;
    color: #000;
    padding: 2rem;
}

.well.triangles h3 {
    color: #000 !important;
}


@media only screen and (min-width: 48em) {
    .well.triangles {
        margin: 4rem 0 2em;
    }

    .well.triangles:after {
        content: "";
        display: inline-block;
        width: 200px;
        height: 137px;
        background-repeat: no-repeat;
        position: absolute;
        background-size: 80%;
        top: -3.3em;
        right: 1em;
    }
}

@media only screen and (min-width: 60em) {
    .well.triangles:after {
        background-size: 90%;
    }
}

@media only screen and (min-width: 48em) {
    .well.yellow:after {
        content: "";
        display: inline-block;
        width: 200px;
        height: 137px;
        background-image: url(/-/media/Files/CSS/hoc-schools/triangles-yellow);
        background-repeat: no-repeat;
        position: absolute;
        background-size: 80%;
        top: -3.3em;
        right: -7em;
    }
}

@media only screen and (min-width: 60em) {
    .well.yellow:after {
        background-size: 90%;
    }
}

/* VIDEOS */
/* NG 10 10 24 */
/*@media only screen and (max-width: 48em){
    .desk-vid {
        display:block;
        margin-top: 6em;
    }
}*/


.hero-video {
	padding:56.25% 0 2.9rem 0;
	position:relative;
}

#video-overlay a[role="button"].green {
	position: absolute;
	background: #1fd19e;
	border:#fff;
	color: #fff;
	text-shadow: none;
	right: 3em;
	top: -0.6em;
}

#auto-video-pause,
#auto-video-m-pause {
	min-height: auto;
	border-radius: 10em;
	height: 3em;
	width: 3em;
	text-align: center;
	color: #fff;
	background: #1fd19e;
	box-shadow: none;
	position: absolute;
	right: 0;
	bottom: 5em; /* 2em NG 10 10 24 */
}

#auto-video-pause em:before,
#auto-video-m-pause em:before {
	font-family: 'wcms';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1.25;
	-webkit-font-smoothing: antialiased;
	font-size: 1.5em;
	position: absolute;
	top: 0.35em;
	left: 0.45em;
	content: "\e600";
	text-shadow: none;
}

#auto-video-pause.paused em:before,
#auto-video-m-pause.paused em:before {
	font-size: 1.75em;
	color: #fff;
	position: absolute;
	top: 0.35rem;
	left: 0.65rem;
	content: "\e60e";
}

/*.mob-desk-vid {
    display: block;
}*/

/* HOMEPAGE HERO IMAGES - remove empty h2 headings */
#page .columns.twelve.center h2.pad-top {
	display: none;
}

/* IMAGES */

img.frame {
    border: 10px solid #fff;
    box-shadow: 0 14px 14px rgba(42,48,49,.2),0 10px 10px rgba(42,48,49,.15) !important;
}

/* NG 01 10 24 */
img.frame-left {
    border: 10px solid #fff;
    box-shadow: 0 14px 14px rgba(42, 48, 49, .2), 0 10px 10px rgba(42, 48, 49, .15);
    transform: rotate(-5deg);
}

/* NG 01 10 24 */
img.frame-right {
    border: 10px solid #fff;
    box-shadow: 0 14px 14px rgba(42, 48, 49, .2), 0 10px 10px rgba(42, 48, 49, .15);
    transform: rotate(5deg);
}

.image-set img {
	position: absolute;
	width: 300px;
}

.image-set img.img1 {
	top: -20px;
    left: 30px;
    z-index: 10;
	transform: rotate(8deg);
}

.image-set img.img2 {
    left: -5px;
    top: 10px;
    z-index: 100;
	transform: rotate(-8deg);
}

img.circle {
    border-radius: 999em;
    line-height: 0;
    border: 10px solid #1fd19e;
  	image-rendering: auto;
    height: auto;
    vertical-align: middle;
    width: 100%;
}


/* SLIDESHOW - STACKED PHOTO GALLERIES */

#slideshow {
    margin-top: 2em;
    margin-left: 2em;
}

#slideshow h2 {
	display: none;
}

#slideshow img {
    border: 10px solid white;
    box-shadow: 0 14px 14px rgba(42,48,49,.2),0 10px 10px rgba(42,48,49,.15);
}
 
#slideshow li {
    left: 0 !important;
    top: 0 !important;
}
 
#slideshow li.invisible {
	transform: rotate(-8deg);
	z-index: -1000;
}
 
.shadowed {
    box-shadow: none;
}


#page #slideshow p.slideshowmenu {
    text-align: right;
    position: absolute;
    bottom: -3em;
    right: 1em;
}


/* PROMO BLOCK*/

a.thumbnail.no-padding {
	border-radius:20px;
	border: solid 1px
}
a.thumbnail.no-padding img {
	border-radius:20px 0 0 20px; /* NG 04 11 24 */
    /* min-height:12em NG 31 10 24 */
}

/* NG 04 11 24 */
.four.columns a.thumbnail.no-padding img, .six.columns a.thumbnail.no-padding img {
	border-radius:20px 20px 0 0; 
}
	
.breakout-bg.bg.promo  p.caption {
    text-transform:revert!important;
	font-family:revert!important;
	font-size:1rem;
	}

/*.breakout-bg.bg.promo .title { font-size: 1em;}*/

.breakout-bg.bg.transparent.promo {margin-bottom: 2em;}
.breakout-bg.bg.transparent.promo .thumbnail{ box-shadow: none;}
.breakout-bg.bg.promo a.thumbnail.no-padding {background-color: #fff; color: #2B2C3A;}
.breakout-bg.bg.promo a.thumbnail.no-padding:hover {background-color: #1fd19e ;color: #2B2C3A;}

/* CENTRES PAGE */

.breakout-bg.bg.transparent.alt .thumbnail {
    box-shadow:none;
}

.breakout-bg.bg.transparent.alt .thumbnail .link-caption {
    margin: 0;
}

.breakout-bg.bg.transparent.alt .thumbnail .caption {
    padding-left: 1em;
    padding-right: 1em;
}

.breakout-bg.bg.transparent.alt p.title {
	font-weight:400;
	text-transform: uppercase;
    font-family: 'Oswald', sans-serif;
	padding:0.5em;
	margin: 0;
	font-size: 1.5em;
	text-align: center;
	display: block;
}

.row.argoed.calshot .columns:nth-of-type(2n+1) p.title  {
    background-color: #592680;
	color:#fff;
}

.row.argoed.calshot .columns:nth-of-type(2n+2) p.title  {
	background-color: #1165af;
	color:#fff;
}

.row.runways.tilebarn .columns:nth-of-type(2n+1) p.title  {
	background-color: #426329;
	color:#fff;
}

.row.runways.tilebarn .columns:nth-of-type(2n+2) p.title  {
	background-color: #ee730d;
	color:#000;
}
	
/*CONTENT CARDS */
    
h2.card-heading {text-transform:revert!important; font-family:revert!important}
	
a.card-button.button-link .card-heading {display:none}

div.card-tags {	position: absolute; left: -9999px; }

div.card-media {height: 12em;}
    
centrename {
    text-transform: initial;
    font-size: 1.05rem;
   	display: block;
    font-family: 'Source Sans Pro', Arial, sans-serif;
    font-weight: 700;
    line-height: normal;
}

.card {border: solid #4c4848 1px }
    
li.four.columns.stamp.add-bottom {
    background-color: #2b2c3a;
} 

   	
/* Outcomes content cards */

.breakout-bg.bg.alternate-two .card .card-content h2.card-heading {
    display: none;
}

/* updated NG 16 01 25
.breakout-bg.bg.alternate-two .card-content.row.remove-bottom {
    background-color: #fff;
}*/

.breakout-bg.bg.alternate-two .card-content .card-description {
    display: revert;
    color: #fff;
}

#page_content .breakout-bg.bg.alternate-two .card-content h3 {
    color: #2B2C3A;
    text-align: center;
}

.scale-images .outcome p {
    text-align: center;
    color: #000;
}
	
#page_content .breakout-bg.bg.alternate-two .scale-images .outcome img {
    width: revert;
}

#page_content .breakout-bg.bg.alternate-two  .card-footer {
    display: none;
}


/* Themes content cards  - NG 02 09 24 */

.breakout-bg.bg.transparent.alternate-three .card {
    border: 1px solid #446026;
    background-color: #DCE7AD; /* NG 16 01 25 */
}

.breakout-bg.bg.transparent.alternate-three .bx-wrapper .card-media img {
    top: 61%;
}

.breakout-bg.bg.transparent.alternate-three .card-content.row.remove-bottom {
    /* background-color: #DCE7AD; NG 16 01 25 */
    color: #000;
}

/* updated NG 16 01 25 */
.breakout-bg.bg.transparent.alternate-three .bx-wrapper h2.card-heading {
    color: #000 !important;
    text-transform: uppercase !important;
    font-family: 'Oswald', sans-serif !important;
    top: -10.3em;
    right: -0.81em;
    width: 111.5%;
    min-height: 3rem;
    position: absolute;
    text-align: center;
    padding-top: 1rem;
    border-radius: 8px 8px 0 0;
}

.breakout-bg.bg.transparent.alternate-three .card .card-content .card-heading, .breakout-bg.alt .card-content.row.remove-bottom {
    background-color: #DCE7AD;
    color: #000;
}

.breakout-bg.bg.transparent.alternate-three .card-content .card-description {
    color: #000;
    font-size: 1rem;
    padding-top: 1rem;
}

#page_content .breakout-bg.bg.transparent.alternate-three a.card-button.button-link {
    background-color: #DCE7AD;
    color: #000;
    margin-bottom: 0.1em; /* NG 17 01 25 */
}

/*.breakout-bg.bg.transparent.alternate-three .card-footer {
    background-color: #DCE7AD;  
} NG 16 01 25 */

/* Content cards on programmes page and centre pages - fix for empty h2 card headings NG 23 12 24 */
.breakout-bg.bg.alternate-five  .card .card-content h2.card-heading {
	display:none;
}

/*STYLING FOR WOODLAND ADVENTURER PROGRAMME CARD*/

li.Woodland-Adventurers .card-content, .row.leaf .columns.alt .card-content, .row.leaf .columns.alt .card-footer {
    background-color: #32431f;
}

li.Woodland-Adventurers .card-content h2, .row.leaf .columns.alt h2 {
    color: #ffd343;
}

li.Woodland-Adventurers .card-content p, .row.leaf .columns.alt p {
    color: #fff;
}

li.Woodland-Adventurers .card-media img, .row.leaf .columns.alt .card-media img {
	width: 125%;
	left: -12%;
	border-radius: 0;
}

li.Woodland-Adventurers  a[role="button"].wa, .row.leaf .columns.alt a[role="button"].wa{
    background-color: #a6c526 !important;
    color: #32431f !important;
    text-transform: uppercase;
  }
  
li.Woodland-Adventurers:after, .row.leaf .columns.alt:after {
	content: "";
    position: absolute;
    display: inline-block;
    width: 80px;
    height: 134px;
    bottom: -20px;
    right: 10px;
    background-image: url(/-/media/files/CSS/hoc-schools/leaf);
    background-repeat: no-repeat;
    background-size: contain; 
    rotate: 30deg;
	transform: scale(1);
	transition: all 0.5s ease;
	z-index:999;
}


li.Woodland-Adventurers:has(.card:hover)::after, .row.leaf .columns.alt:has(.card:hover)::after {
	transform: scale(1.1);
}
	
	
/* QUOTES */

.breakout-area blockquote, .breakout-area figcaption {
    color: #000;
    font-weight: 700;
    font-size: x-large;
    line-height: 1.25;
}

.breakout-area blockquote.testimonial {
    font-size: large;
}

blockquote q:before {
    top: -0.2em;
    left: -0.1em;
}

@media only screen and (min-width: 48em) {   
	.breakout-area blockquote:before {
		content: "";
		display: inline-block;
		width: 200px;
		height: 159px;
		background-repeat: no-repeat;
		position: absolute;
		background-size: 60%;
		top: -0.75em;
		left: -9em; /* -10em NG 02 10 24 */
	}

   	.breakout-area blockquote:after {
        content: "";
        display: inline-block;
        width: 200px;
        height: 159px;
        background-repeat: no-repeat;
        position: absolute;
        background-size: 60%;
        top: 2.5em;
        right: -11em; 
    }

    .breakout-area.green blockquote:before {
	    background-image: url(/-/media/Files/CSS/hoc-schools/calshot-programmes/calshot-quote-blue-open);
    }

	.breakout-area.green blockquote:after {
        background-image: url(/-/media/Files/CSS/hoc-schools/calshot-programmes/calshot-quote-blue-close);
    }
	
 	.breakout-area.blue blockquote:before, .breakout-area.green.alternate-six blockquote:before {
	    background-image: url(/-/media/Files/CSS/hoc-schools/quote-white);
	 	transform: rotate(180deg);
	    }

	.breakout-area.blue blockquote:after, .breakout-area.green.alternate-six blockquote:after {
        background-image: url(/-/media/Files/CSS/hoc-schools/quote-white);
		     }

    .breakout-area.green blockquote.yellow:before, .breakout-area.teal blockquote.yellow:before {
	    background-image: url(/-/media/Files/CSS/hoc-schools/quote-yellow);
        transform: rotate(180deg);
        top: -4.75em; 
    }

	.breakout-area.green blockquote.yellow:after, .breakout-area.teal blockquote.yellow:after {
        background-image: url(/-/media/Files/CSS/hoc-schools/quote-yellow);
    }
}

@media only screen and (min-width: 60em) {
    .breakout-area blockquote:before {
        background-size: 60%;
        top: -1.3em;
        right: 38em;
    }

    .breakout-area  blockquote:after {
        background-size: 60%;
        top: 3.7em;
        right: -10.5em; /* NG 03 10 24 */
    }

}

@media only screen and (min-width: 90em) {
     .breakout-area  blockquote:before {       
		 background-size: 60%;
         top: -3.3em;
       	 right: 38em;
	 }

    .breakout-area  blockquote:before .breakout-area.green .well:after {
        background-size: 60%;
        top: 2.7em;
        right: -13em;
    }
}

@media only screen and (min-width: 48em){
    .breakout-area.green.alternate-two blockquote:before {
        background-image: url(/-/media/Files/CSS/hoc-schools/quote-purple);
        transform: rotate(180deg); 
        top: -3.75em; 
    }

    .breakout-area.green.alternate-two blockquote:after {
        background-image: url(/-/media/Files/CSS/hoc-schools/quote-purple);
    }
}




/* ACTIVITIES */
.activity {
	display: inline-block;
    color: #fff;
    text-align: center;
}

a.activity {
	border-bottom: none;
}

a.activity:hover, a.activity:visited, a.activity:focus {
	border-bottom: none;
    color:#fff;
}

p.activity {
    margin-top: 0;
}

.breakout-bg.bg.alternate-three .activity img.scale-with-grid {
    background-color: #fff;
    border-radius: 3em;
}

/* MAP ICONS */
.pointer.large.location.icon.teal {
    color: #1fd19e;
}

.pointer.large.location.icon.minstead {
    color: #a1cb76;
}

.pointer.large.location.icon.stubbington {
    color: #1e9ca3;
}

/*.esri-view-root text {
    fill: #1fd19e;
}*/

/* OVERLAY IMAGES */
.overlay-image, .overlay-image img {
	border-radius: 20px;
    border: 1px solid #2b2c3a;
}

.overlay-image .caption.bottom {
	border-radius: 0 0 20px 20px;
    border-style: solid;  
    border-color: #2b2c3a;
    border-width: 0 1px 1px 1px;
    color: #2b2c3a;
    background-color: #fff;
    font-weight: 700;
}

/* WALL - search box well NG 23 09 24 */
.stamp .well {
    background-color: #2B2C3A;
    color: #fff;
}

/* BORDERED GRIDS NG 26 09 24 */
.row.alt.green {
    border: 1px solid #1fd19e;
    border-radius: 20px;
    padding: 1em;
}

.row.alt.pink {
    border: 1px solid #e2186c;
    border-radius: 20px;
    padding: 1em;
}

.row.alt.blue {
    border: 1px solid #2b2c3a;
    border-radius: 20px;
    padding: 1em;
}

.row.alt.green details, .row.alt.pink details, .row.alt.blue details {
    margin-top: 1.5em;
}

/* HOME PAGE TAILORED PROGRAMMES NG 27 09 24 */
h2.arrowspace {
    margin-bottom: 2.2em;
}

.beforevisit h3, .duringvisit h3, .aftervisit h3 {
    font-size: 1.5rem;
}

@media only screen and (min-width: 48em) {
    .well.duringvisit:before {
        content: "";
        display: inline-block;
        width: 200px;
        height: 137px;
        background-image: url(/-/media/Files/CSS/hoc-schools/arrow.png);
        background-repeat: no-repeat;
        position: absolute;
        background-size: 60%;
        top: -6.3rem;
        right: 11rem;
        transform: scaleX(-1) rotate(219deg);
    }

    .well.aftervisit:before {
        content: "";
        display: inline-block;
        width: 200px;
        height: 137px;
        background-image: url(/-/media/Files/CSS/hoc-schools/arrow.png);
        background-repeat: no-repeat;
        position: absolute;
        background-size: 60%;
        top: 21.9rem;
        right: 11rem;
        transform: rotate(40deg);
    }
}

@media only screen and (min-width: 48em) {
    .well.duringvisit:before {
        right: 7rem;
    }

    .well.aftervisit:before {
        top: 28.9rem;
        right: 7rem;
    }
}

@media only screen and (min-width: 54em) { /* NG 14 10 24 */
    .well.aftervisit:before {
        top:23.9rem
    } 
}

@media only screen and (min-width: 64em) {
    .well.duringvisit:before {
        right: 11rem;
    }

    .well.aftervisit:before {
        top: 21.9rem;
        right: 11rem;
    }
}

/* TIMETABLES FOR PROGRAMMES NG 27 09 24 */
#page .breakout-bg.bg.alternate-four {
    margin-bottom: 4em;
}

#page .breakout-bg.bg.alternate-four .well {
    border-radius: 0;
}

/* DAY VISITS PACKAGES */
.well.package {
    border-radius: 25px;
    color: #000;
}

.well.package.bronze {
    background-color: #c97d3b;
}

.well.package.silver {
    background-color:  #b3b6b6;
}

.well.package.gold {
    background-color:  #fcd621;
}

.well.package p, .well.package ul, .well.package h3 { /* updated NG 06 12 24 */
    color: #000;
}

.well.package h3 {
    padding-top: 0.5rem;
    text-align: center;
    font-size: 1.65rem; /* NG 23 01 25 */
}

.well.package p.price {
    text-align: center;
    background-color: #2b2c3a;
    color: #fff;
    padding: 1.6rem 1rem 1rem 1rem;
    border-radius: 50%;
    /* font-weight: bold;*/
    width: 7em;
    height: 7em;
    margin: auto;
}

/* NG 24 11 24 */
.well.package p.price.big {
    width: 7.5em;
    height: 7.5em;
    padding: 0.6rem 1rem 1rem 1rem;
}

.well.package p.price span { /* updated 23 01 25 */
    font-size: 2.3rem; 
    text-transform: uppercase;
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
}

.well.package p.price.big span { /* NG 24 01 25 */
    font-size: 2.1rem;
    line-height: 1.25;
}

/* NG 06 12 24  - fix vertical alignment */
@media only screen and (min-width: 48em) {
    .well.package p.price.pushdown {
        margin-top: 2.3rem;
    }
}

.breakout-area.primary p.pricecircle {
    text-align: center;
    background-color: #1fd19e;
    color: #000;
    padding: 1.6rem 1rem 1rem 1rem;
    border-radius: 50%;
    /*font-weight: bold;*/
    width: 7em;
    height: 7em;
}

.breakout-area.primary p.pricecircle.alternate {
    text-align: center;
    background-color: #e2186c;
    color: #fff;
    padding: 0.3rem;
    border-radius: 50%;
    font-weight: bold;
    width: 7em;
    height: 7em;
    border: 2px solid #fff;
}

.breakout-area.secondary p.pricecircle {
    text-align: center;
    background-color: #e2186c;
    color: #fff;
    padding: 1.3rem;
    border-radius: 50%;
    font-weight: bold;
    width: 7em;
    height: 7em;
}

@media only screen and (max-width: 47em) {
    .breakout-area.primary p.pricecircle, .breakout-area.secondary p.pricecircle {
        margin: auto;
    }
}

.breakout-area.primary p.pricecircle span, .breakout-area.secondary p.pricecircle span {
    font-size: 1.8rem;
    text-transform: uppercase;
    font-family: 'Oswald', sans-serif;
    font-weight: 600;
}

.breakout-area.primary .well.transparent.white {
    background-color: transparent;
    color: #fff;
    text-align: left;
}

/* NG 21 11 24 */
.breakout-area.primary .well.transparent.black {
    background-color: transparent;
    color: #000;
    text-align: left;
}

/* NG 14 1 25 */
p.medium {
    font-weight: bold;
}


/* SLIDER used on Winter residentials but could be used elsewhere */

.card-content .promo-slider h3.yellow {
    background-color: #ffd500;
    text-align: center;
}

.card-content h3.blue {
    background-color: #00aebf;
    text-align: center;
}

.card-content h3.green {
    background-color: #1fd19e;
    text-align: center;
}

/* KEYFIGURES */

.keyfigure {
    background-color: transparent;
    border-radius: unset;
    padding-top: 0;
    padding-bottom: 0;
}

.keyfigure .caption {
    text-transform: uppercase;
    font-size: 1.5em;
    text-align: left;
}

.keyfigure .figure {
    text-align: left;
}

.keyfigure .figure:after,.caption:nth-child(1):after,hr:before,.section-break:after {
    display: none;
}

.keyfigure .figure:nth-child(2):before,.keyfigure .caption:nth-child(2):before,.keyfigure .caption:nth-child(3):before,hr:after {
    display: none;
  }

.columns:nth-child(1) .keyfigure {
	color: #1fd19e; 
 }

.columns:nth-child(2) .keyfigure {
	color: #ffd500;
}

.columns:nth-child(3) .keyfigure {
	color: #00aebf;
}

.columns:nth-child(4) .keyfigure {
	color: #E571A7;
}

@media only screen and (min-width: 48em) {
	.columns:nth-child(1) .keyfigure, .columns:nth-child(2) .keyfigure, .columns:nth-child(3) .keyfigure {
		border-right: 2px solid white;
	}
}

/*SECONDARY NAV ON BOOKING PAGES */

@media only screen and (min-width: 37.5em) {

#nav-secondary {
    display: flex;
    justify-content: center;
    gap:3rem;
    list-style: none;
    padding: 0 0 1em 0;
    margin: 0;
}

#nav-secondary > li {
    position: relative;
}

#nav-secondary > li:not(:last-child)::after {
    content: '';
    position: absolute;
    top: 50%;
    right: -1.75rem;
    width: 0.5rem;
    height: 0.5rem;
    border-radius: 50%;
    background: #d22777;
    transform: translateY(-50%);
    
}

#nav-secondary a{
border-bottom: 1px solid #d22777;
       text-transform: uppercase;
	font-family: 'Oswald', sans-serif;
    font-weight:600;
   color: #2b2c3a ;
}
}

#nav-secondary li::marker {
    color: #d22777;
}



/* MEDIA QUERIES */


/* smaller mobile phones NG 30 09 24 */
@media only screen and (min-width: 20em) and (max-width: 21em) {
       #page .pseudo-h1 {padding-bottom: 1em;} /* NG 07 10 24 */
	.banner-area:after {bottom: -20.5em;}
    
}

/* iphone 15 NG 30 09 24 */
@media only screen and (min-width: 22em) {
    .banner-area:after {bottom: -25em;} /* NG 14 10 24 */
}

/* larger mobile phones NG 30 09 24 */
@media only screen and (min-width: 26em) {
       #page .pseudo-h1 {padding-bottom: 1em;} /* NG 07 10 24 */
	.banner-area:after {bottom: -27.75em;}
    .breakout-bg.bg.pink {padding-bottom: 4em;} /* NG 03 10 24 */
}

@media only screen and (min-width: 28em) { /* Will's iphone SE  3 horizontally */
   
	.banner-area:after {bottom: -10.75em;} /* -8.75em NG 21 10 24 */

	
}

/* Horizontal iphone 8 */
@media only screen and (min-width: 37.5em) {
   
	#page .pseudo-h1 {font-size: 1em; padding-top: 15px;}
	.banner-area:after {bottom: -12em;} /* NG 21 10 24 */
	#page #local_header {
        left: 25%;
        width: 100%;
        top: 3.75em;
        margin-bottom: 0;
        position: absolute;
        line-height: 1em;
    }

	#page #local_header li a {font-size: 0.8em;}
	
	button#contact-stickies-button {width: 10em;height:3.5em;}
	.breakout-bg.bg .thumbnail>img {width: 70%;}
	.breakout-bg.bg a.thumbnail.no-padding {display: flex;}
	.breakout-bg.bg .columns.six a.thumbnail.no-padding, 
	.columns.four a.thumbnail.no-padding   	{display: inline;}
	.breakout-bg.bg .columns.six .thumbnail>img, .columns.four .thumbnail>img {width: 100%;}
    
    .breakout-bg.bg.pink {padding-bottom: 4em; padding-top:4em;} /* NG 03 10 24 */
   
}

/* iphone 15 horizontal */
@media only screen and (min-width: 42em) {
   
    
    .banner-area:after {bottom: -14em;} /* NG 14 10 24*/
}

/* ipad 9 vertical */
@media only screen and (min-width: 48em) {
  
    #page .pseudo-h1 {font-size: 1.55em;}
	#page #local_header li a {font-size: 1em;}
	#page #local_header {left: 30%; top: 4.25em;}
	.banner-area:after {bottom: -15em;}
    .breakout-bg.bg.pink {padding-bottom: 5em; margin-top: 3em; padding-top: 2em;} /* NG 03 10 24 */
}

/*  around 449px to 599px wide */
@media only screen and (min-width: 54em) {
  
	#page .pseudo-h1 {font-size: 2em; padding-bottom: revert;} /* NG 07 10 24 */
	#page #local_header li a {font-size: 1em;}
	#page #local_header {left: 35%; top: 4.5em;}
	.banner-area:after {bottom: -17em;}
   
    .well.aftervisit:before {top:23.9rem} /* NG 14 10 24 */
 
    .banner-area:after {bottom: -16em;} /* NG 14 10 24*/
}


/* Hide drop-downs on horizontal nav bar for tablets only */
@media only screen and (min-width: 48em) and (max-width: 59em) {
    #local_menu_header li.dropdown .caret,
    #local_menu_header li.dropdown .dropdown-menu {display: none;}
}

/* iPad 9 size */
@media only screen and (min-width: 64em) {
      #page #local_header {left: 40%; top: 5em;}
    #page #local_header li a {font-size: 1em;}
    #page .pseudo-h1 {font-size: 2.5em;}
	.breakout-content {margin-bottom: 4em;}
	.banner-area:after {bottom: -19em;}
	
 
    .breakout-bg.bg.pink {padding-bottom: 1em;} /* NG 30 09 24 */
   
}

/* HCC device screen size */
@media only screen and (min-width: 72em) {
	
	#page #local_header li a {font-size: 1em;}
	.banner-area:after {bottom: -22em;} /* 24em */
	.breakout-area.rip.alternate.blue:before { top: -3.25em; }
	.breakout-area.rip:before { top: -3em; } /* -1em -4em; NG 22 10 24 */
	#contact-stickies { bottom: calc(50vh - 7em); right: calc(-38em + 50vw);}
   
}

/* 1440px laptop */
@media only screen and (min-width: 90em) {
  
   	.banner-area:after {bottom: -25em;} /* 33em NG */
}

/* Becky Cornish's big screen NG 04 11 24 */
@media only screen and (min-width: 100em) {
    
  
    .banner-area:after {bottom: -29em} /* -28 NG 19 11 24 */
}

/* Nikki's and Suzanna's big screen */
@media only screen and (min-width: 120em) {
  
   
    .breakout-bg.bg.pink {padding-bottom: 4em; margin-top: 4em;} /* NG 30 09 24 */
    .banner-area:after {bottom: -33em;} /* NG 01 10 24 */
    
}

/* Fran's big screen - NG 11 11 24 */
@media only screen and (min-width: 130em) {
   
  
   
    .banner-area:after {bottom: -39em;} /* NG 14 10 24*/
}

/* 4k screens */
@media only screen and (min-width: 160em) {
   
   
    .banner-area:after {bottom: -43em;} /* NG 01 10 24 */
   
}



/* NEW BREAKOUT CODE */
/* NAVY BLUE HEADER WITH RIP TOP AND BOTTOM */

.breakout-area.dkblue.alternate {
 padding: 7% 0; 
  height:fit-content; 
  background:
   url(/-/media/Files/CSS/hoc-schools/rip-navy) top/100% auto,
    url(/-/media/Files/CSS/hoc-schools/rip-navy-flipped) bottom/100% auto,
    linear-gradient(#2b2c3a,#2b2c3a) content-box; 
  background-repeat:no-repeat;
	margin-top: -2.5em;
	

}
@media only screen and (min-width: 48em) {
.breakout-area.dkblue.alternate {margin-top: -4em;}

}

@media only screen and (min-width: 90em) {
.breakout-area.dkblue.alternate {
	margin-top: -7em;
}
}
/*GREEN RIPS*/

.breakout-area.rip.green {
	 height:fit-content;
	 margin-top: -2.7em;
}

/*GREEN RIP TOP ONLY*/

.breakout-area.rip.green.alternate-two {
	padding: 7.3% 0 0 0; 
	background: url(/-/media/Files/CSS/hoc-schools/rip-mint) top/100% auto,
        		linear-gradient(#1fd19e,#1fd19e) content-box; 
  	background-repeat:no-repeat;
}

/*GREEN RIP BOTTOM ONLY*/

.breakout-area.rip.green.alternate-three {
	padding: 7.3% 0;  
	background: url(/-/media/Files/CSS/hoc-schools/rip-mint-flipped) bottom/100% auto,
        		linear-gradient(#1fd19e,#1fd19e) content-box; 
  	background-repeat:no-repeat;
}

/*GREEN RIP BOTH RIPS*/

.breakout-area.rip.green.alternate-four {
	padding: 7.3% 0; 
	background:
   		url(/-/media/Files/CSS/hoc-schools/rip-mint) top/100% auto,
    	url(/-/media/Files/CSS/hoc-schools/rip-mint-flipped) bottom/100% auto,
    	linear-gradient(#1fd19e,#1fd19e) content-box; 
  	background-repeat:no-repeat;
	}




/* WHITE RIP TOP ONLY */

.breakout-area.rip.white {
	 padding: 9% 0; 
  height:fit-content; 
  background:
   url(/-/media/Files/CSS/hoc-schools/rip-white) top/100% auto;
  background-repeat:no-repeat;
	margin-top: -4.5em;
	}


@media only screen and (min-width: 90em) {
.breakout-area.rip.white 	{
	margin-top: -7em;
	}
}

/*	TEMPORARY SOLUTION FOR BANNER RIPS UNTIL ALL PAGES REBUILT*/

.breakout-area.rip.alternate:after {
	content: "";
    position: absolute;
    display: inline-block;
    width: 100%;
    height: 100%;
    bottom: -60%;
    right: 0;
    background-image: url(/-/media/Files/CSS/hoc-schools/rip-white);
    background-repeat: no-repeat;
    background-size: contain; 
}

@media only screen and (min-width: 48em) {
.breakout-area.rip.alternate:after {
	bottom: -75%;
}
}

@media only screen and (min-width: 64em) {
.breakout-area.rip.alternate:after {
	bottom: -85%;
}
}

.banner-area:after {
	content: "";
    position: absolute;
    display: inline-block;
    width: 100%;
    height: 100%;
    bottom: -90%; /* For medium mobiles. Was -11em previously */
    right: 0;
    background-image: url(/-/media/Files/CSS/hoc-schools/rip-white);
    background-repeat: no-repeat;
    background-size: contain; 
}

@media only screen and (min-width: 48em) {
.banner-area:after {
	bottom: -75%;
}
}

@media only screen and (min-width: 90em) {
.banner-area:after {
	bottom: -85%;
}
}