/*primary category colours*/
:root {
	--business_color: #1567B6;
	--sport_color: #4C800B;
	--opinion_color: #8D1E56;
	--live_color: #AF0000;
	--wellbeing_color: #E47709;
	--hero_standard_color: var(--brand-primary);
	--hero_investigation_color: #38CFFF;
	--hub_standard_color: var(--brand-primary);
	--hygiene_standard_colour: var(--brand-primary);
	--dropcap_color: var(--brand-primary);
	--byline_color: var(--brand-primary);
	--share_container_icon_color: var(--brand-primary);
	--author_img_color: var(--brand-primary);

	/* https://codepen.io/sosuke/pen/Pjoqqp used to compute filters */
	--quote_filter: brightness(0) saturate(100%) invert(18%) sepia(20%) saturate(6768%) hue-rotate(190deg) brightness(93%) contrast(103%);
	--business_filter: brightness(0) saturate(100%) invert(27%) sepia(54%) saturate(2440%) hue-rotate(193deg) brightness(95%) contrast(86%);
	--sport_filter:    brightness(0) saturate(100%) invert(41%) sepia(34%) saturate(2118%) hue-rotate(53deg) brightness(88%) contrast(91%);
	--opinion_filter:  brightness(0) saturate(100%) invert(19%) sepia(44%) saturate(3207%) hue-rotate(304deg) brightness(87%) contrast(96%);
	--live_filter:     brightness(0) saturate(100%) invert(8%) sepia(90%) saturate(7304%) hue-rotate(25deg) brightness(92%) contrast(123%);
	--wellbeing_filter: brightness(0) saturate(100%) invert(69%) sepia(74%) saturate(5213%) hue-rotate(4deg) brightness(96%) contrast(93%);
	--hero_investigation_filter: brightness(0) saturate(100%) invert(18%) sepia(20%) saturate(6768%) hue-rotate(190deg) brightness(93%) contrast(103%);
}
/* drop-cap */
.hhh-wrap.hero-wrap .cms p:not(blockquote > p):first-of-type:first-letter,
.hhh-wrap.hub-wrap .cms p:not(blockquote > p):first-of-type:first-letter {
	float: left;
	font-weight: 600;
	font-size: 5.55rem;
	line-height: .85;
	padding-right: .5rem;
	margin-top: .1rem;
	margin-bottom: -.1rem;
	color: var(--dropcap_color); /* Hero Standard Colour - default */
}

/* Quotes */
.hhh-wrap.hero-wrap .cms blockquote > p::before,
.hhh-wrap.hub-wrap .cms blockquote > p::before,
.hhh-wrap.hygiene-wrap .cms blockquote > p::before {
	background-image: url("data:image/svg+xml,%3Csvg width='21' height='18' viewBox='0 0 21 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 11.7493C0 7.69934 1.75155 2.64934 7.7944 0.699341L8.6264 2.54935C5.64876 3.94935 3.37173 5.99933 3.19658 9.34933L3.50311 9.49934C4.14503 8.90134 4.9518 8.58246 5.78013 8.59933C6.26437 8.58986 6.74507 8.69515 7.19187 8.90854C7.63867 9.12193 8.04186 9.43879 8.37599 9.83911C8.71012 10.2394 8.96793 10.7145 9.13313 11.2344C9.29832 11.7542 9.36733 12.3075 9.33578 12.8593C9.35337 13.5285 9.2531 14.1948 9.04093 14.8188C8.82876 15.4429 8.50899 16.012 8.10061 16.4922C7.69223 16.9725 7.20354 17.3543 6.66352 17.6149C6.1235 17.8755 5.54316 18.0096 4.9569 18.0093C1.75156 17.9793 0 15.2093 0 11.7493ZM11.4814 11.7493C11.4814 7.69934 13.233 2.64934 19.2758 0.699341L20.1078 2.54935C17.1302 3.94935 14.8006 5.99933 14.6693 9.34933L14.9845 9.49934C15.5209 9.00661 16.1703 8.70081 16.855 8.61858C17.5397 8.53634 18.2306 8.68114 18.8451 9.03564C19.4595 9.39015 19.9715 9.93935 20.3197 10.6175C20.6679 11.2956 20.8376 12.074 20.8085 12.8593C20.826 13.5285 20.7258 14.1948 20.5136 14.8188C20.3014 15.4429 19.9817 16.012 19.5733 16.4922C19.1649 16.9725 18.6762 17.3543 18.1362 17.6149C17.5962 17.8755 17.0158 18.0096 16.4296 18.0093C13.233 17.9793 11.4814 15.2093 11.4814 11.7493Z' fill='%23468DF5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	padding-right: 0.5rem;
	width: 1.313rem;
	height: 1.125rem;
	content: "";
	display: inline-block;
	filter: var(--quote_filter);
	transform: translateX(-0.06rem) translateY(-0.06rem);
}

/* PA Embed Quotes */
.hhh-wrap.hygiene-wrap .pa-quote-wrapper blockquote p::before {
	transform: translateX(3.3rem) translateY(0.10rem);
}

.pa-quote-wrapper p::first-letter {
	margin-left: 30px;
}

section .pa-embed.pa-quote {
	margin: 0 auto 3.25rem 0;
	width: 100%;
}

.pa-quote cite {
	margin: 0 0 0 35px;
}

.hhh-wrap .cms blockquote::before {
	content: "" !important;
	background: none;
}

.hhh-wrap .cms blockquote{
	background-color: #fff;
	padding: 2rem 2.5rem !important;
}

.hhh-wrap .cms blockquote > p{
	font-weight: 400;
}

/* Category colours and filters */

/* Business and sub category*/
.cat--business-environment,
.cat--business,
.cat--environment,
.cat--farming,
.cat--transport {
	--dropcap_color: var(--business_color);
	--quote_filter: var(--business_filter);
	--byline_color: var(--business_color);
	--share_container_icon_color: var(--business_color);
	--author_img_color: var(--business_color);
}

/* Sport and sub category */
.cat--sport,
.cat--football,
.cat--dundee-fc,
.cat--dundee-united,
.cat--st-johnstone,
.cat--golf,
.cat--other-sports,
.cat--rugby {
	--dropcap_color: var(--sport_color);
	--quote_filter: var(--sport_filter);
	--byline_color: var(--sport_color);
	--share_container_icon_color: var(--sport_color);
	--author_img_color: var(--sport_color);
}

/* Lifestyle and sub category */
.cat--lifestyle,
.cat--health-wellbeing,
.cat--food-drink,
.cat--recipes,
.cat--restaurant-reviews,
.cat--homes-gardens,
.cat--motoring,
.cat--outdoors,
.cat--property,
.cat--travel {
	--dropcap_color: var(--wellbeing_color);
	--quote_filter: var(--wellbeing_filter);
	--byline_color: var(--wellbeing_color);
	--share_container_icon_color: var(--wellbeing_color);
	--author_img_color: var(--wellbeing_color);
}

/* Hero template (default) */
.hero-wrap {
	--dropcap_color: var(--hero_standard_color);
	--quote_filter: var(--hero_investigation_filter);
	--byline_color: var(--hero_investigation_color);
	--share_container_icon_color: var(--hero_investigation_color);
	--author_img_color: var(--hero_investigation_color);
}

/* Opinion and sub category (using class name for opinion as this will be a variation of hub template) */
.hub-opinion-class,
.cat--comment  {
	--dropcap_color: var(--opinion_color);
	--quote_filter: var(--opinion_filter);
	--byline_color: var(--opinion_color);
	--share_container_icon_color: var(--opinion_color);
	--author_img_color: var(--opinion_color);
}

/* Live (not a category type but a variation of the hygiene template) */
.live-class {
	--quote_filter: var(--live_filter);
	--byline_color: var(--live_color);
	--share_container_icon_color: var(--live_color);
	--author_img_color: var(--live_color);

}

.hero-wrap .button-h:not(.button-h--close) svg, .hero-wrap .comments-btn[data-style="full"] .blocks-icon,
.hub-wrap .button-h:not(.button-h--close) svg, .hub-wrap .comments-btn[data-style="full"] .blocks-icon,
.hygiene-wrap .button-h:not(.button-h--close) svg, .hygiene-wrap .comments-btn[data-style="full"] .blocks-icon {
	fill: var(--share_container_icon_color);
}

@media only screen and (max-width:  899px) {

	/* drop-cap */
	.hhh-wrap.hero-wrap .cms p:not(blockquote > p):first-of-type:first-letter,
	.hhh-wrap.hub-wrap .cms p:not(blockquote > p):first-of-type:first-letter {
		font-size: 4.9rem;
	}
}