@charset "UTF-8";
/* CSS Document */

/* ------------------------------------------------------- */
/* ---------------- Font imports ------------------------- */
/* ------------------------------------------------------- */

@font-face {
    font-family: 'Suisse Bold';
    src: url(fonts/suisseintl-bold-webs.eot);
    src: url(fonts/suisseintl-bold-webs.eot?#iefix) format("embedded-opentype"),url(fonts/suisseintl-bold-webs.woff) format("woff"),url(fonts/suisseintl-bold-webs.ttf) format("truetype"),url(fonts/suisseintl-bold-webs.svg#webfont) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'Suisse Light';
    src: url(fonts/suisseintl-light-webs.eot);
    src: url(fonts/suisseintl-light-webs.eot?#iefix) format("embedded-opentype"),url(fonts/suisseintl-light-webs.woff) format("woff"),url(fonts/suisseintl-light-webs.ttf) format("truetype"),url(fonts/suisseintl-light-webs.svg#webfont) format("svg");
    font-weight: 200;
    font-style: normal
}

@font-face {
    font-family: 'Suisse Regular';
    src: url(fonts/suisseintl-regular-webs.eot);
    src: url(fonts/suisseintl-regular-webs.eot?#iefix) format("embedded-opentype"),url(fonts/suisseintl-regular-webs.woff) format("woff"),url(fonts/suisseintl-regular-webs.ttf) format("truetype"),url(fonts/suisseintl-regular-webs.svg#webfont) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'Suisse Italic';
    src: url(fonts/suisseintl-regularitalic-webs.eot);
    src: url(fonts/suisseintl-regularitalic-webs.eot?#iefix) format("embedded-opentype"),url(fonts/suisseintl-regularitalic-webs.woff) format("woff"),url(fonts/suisseintl-regularitalic-webs.ttf) format("truetype"),url(fonts/suisseintl-regularitalic-webs.svg#webfont) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'Suisse Medium';
    src: url(fonts/suisseintl-medium-webs.eot);
    src: url(fonts/suisseintl-medium-webs.eot?#iefix) format("embedded-opentype"),url(fonts/suisseintl-medium-webs.woff) format("woff"),url(fonts/suisseintl-medium-webs.ttf) format("truetype"),url(fonts/suisseintl-medium-webs.svg#webfont) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
    font-family: 'Suisse Regular Italic';
    src: url(fonts/suisseintl-regularitalic-webs.eot);
    src: url(fonts/suisseintl-regularitalic-webs.eot?#iefix) format("embedded-opentype"),url(fonts/suisseintl-regularitalic-webs.woff) format("woff"),url(fonts/suisseintl-regularitalic-webs.ttf) format("truetype"),url(fonts/suisseintl-regularitalic-webs.svg#webfont) format("svg");
    font-weight: 400;
    font-style: normal
}

@font-face {
	font-family: "DomaineDispSemibold";
	src: url("fonts/domainedispsemibold.eot");
	src: url("fonts/domainedispsemibold.eot?#iefix") format("embedded-opentype"), url("fonts/domainedispsemibold.woff") format("woff"), url("fonts/domainedispsemibold.ttf") format("truetype"), url("fonts/domainedispsemibold.svg#domainedispsemibold") format("svg");
}

@font-face {
	font-family: "Domaine Display Regular";
	src: url("fonts/domainedisplayweb-regular.eot");
	src: url("fonts/domainedisplayweb-regular.eot?#iefix") format("embedded-opentype"), url("fonts/domainedisplayweb-regular.woff") format("woff"), url("fonts/domainedisplayweb-regular.woff2") format("woff2");
	font-weight: normal;
	font-style: normal;
}


@font-face {
    font-family: 'Suisse SemiBold';
    src: url(fonts/SuisseIntl-SemiBold.eot);
    src: url(fonts/SuisseIntl-SemiBold.eot?#iefix) format("embedded-opentype"),url(fonts/SuisseIntl-SemiBold.woff) format("woff"),url(fonts/SuisseIntl-SemiBold.ttf) format("truetype"),url(fonts/suisseintl-regularitalic-webs.svg#webfont) format("svg");
    font-weight: normal;
    font-style: normal
}

@font-face {
  font-family: 'TiemposHeadline-Regular';
  src: url("fonts/tiemposheadline-regular.eot?#iefix") format("embedded-opentype"), url("fonts/tiemposheadline-regular.woff") format("woff"), url("fonts/tiemposheadline-regular.ttf") format("truetype"), url("fonts/tiemposheadline-regular.svg#webfont") format("svg");
  /* Legacy iOS */ }

table {
	display: none;
}

/* ------------------------------------------------------- */
/* --------------- Quick colours ------------------------- */
/* ------------------------------------------------------- */

body {
/* Base colours */
	--c3_red: #D0103A !important;
	--c3_green: #015151 !important;
	--c3_coolgreen: #7AA6AD !important;
	--c3_teal: #0E9390 !important;
	--c3_lightblue: #1B99D7 !important;
	--c3_darkblue: #006398 !important;
	--c3_yellow: #FAA21B !important;
	--c3_orange: #B94617 !important;
	--c3_purple: #7C4183 !important;
	--c3_darkred: #8A1D41 !important;
	--c3_warmgrey: #D6D1C4 !important;
	--c3_coolgrey: #C1C5C8 !important;
	--c3_midgrey: #88898D !important;
	--c3_darkgrey: #363A36 !important;
	--c3_white: #FFFFFF !important;
	--c3_black: #000000 !important;
}

* {
  box-sizing: border-box;
}

html, body {
	background-color: #ffffff;
	-webkit-text-size-adjust: none;
	margin: 0px;
	font-family: "Suisse Regular", Helvetica, Arial, sans-serif;
}

div#c3_div_ios_scroll_wrapper {
	display: block;
	position: relative;
	width: 100vw;
	height: 100vh;
	overflow: hidden;
	/*overflow-y: scroll; */
}

h1 {
	display: none;
}

nav#c3_nav_main {
	display: block;
    position: absolute;
    overflow: hidden;
    top: 0px;
    left: 0px;
    width: 100px;
    height: 100%;
    padding: 5px;
    background-color: rgba(255, 255, 255, 0.75);
    z-index: 100;
    transition: background-color 0.25s linear;
}

@media only screen and (max-width: 700px) {
    nav#c3_nav_main {
        width: 90px;
        padding: 0px;
        padding-left: 10px;
    }
}

p#c3_instruction {
    display: none;
    position: absolute;
    bottom: 0px;
    left: 50%;
    width: auto;
    padding: 10px;
    background-color: var(--c3_red);
    color: #ffffff;
    font-size: 14px;
    line-height: 18px;
    z-index: 300;
    margin-bottom: 0px;
    margin-left: -200px;
}

@media only screen and (max-width: 700px) {
    p#c3_instruction {
        display: none !important;
    }
}

p#c3_instruction strong {
    font-family: "Suisse Bold", Helvetica, Arial, sans-serif;
}


nav#c3_nav_main > div {
	display: none !important;
}

nav#c3_nav_main.c3_nav_regional {
	background-color: rgba(208, 16, 58, 0.75);
}

nav#c3_nav_main.c3_nav_partnerships {
	background-color: rgba(185, 70, 23, 0.75);
}

div#c3_map_container {
	display: block;
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	z-index: 1;
}

header#c3_header {
	display: block;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 0px;
	z-index: 99;
	padding: 20px;
    padding-bottom: 0px;
	padding-left: calc(140px + 20px);
	background-image: linear-gradient(to bottom, rgba(255,255,255,1), rgba(255,255,255,0));
}


/* ------------------------------------------------------------ */
/* ---------------------- Main Header ------------------------- */
/* ------------------------------------------------------------ */

header#c3_header h1 {
	display: none !important;
    position: relative;
    font-family: 'Domaine Display Regular';
    font-size: 48px;
    line-height: 48px;
    margin: 0;
	margin-bottom: 13px;
    padding: 0;
    padding-right: 30px;
}

@media only screen and (max-width: 700px) {
    header#c3_header h1 {
        font-size: 22px;
        line-height: 28px;
        margin-bottom: 15px;
        padding-top: 40px;
        background-image: url(image/kf-logo-red.svg);
        background-size: 80px auto;
        background-repeat: no-repeat;
        background-position: 0px 0px;
    }
}

header#c3_header h2 {
	display: none !important;
	position: relative;
	font-family: 'Suisse Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 32px;
	color: #006498;
    line-height: 32px;
    margin: 0;
    padding: 0;
}

@media only screen and (max-width: 700px) {
    header#c3_header h2 {
        font-size: 14px;
        line-height: 0px;
    }
}

/* ------------------------------------------------------------ */
/* --------------------- Main Article ------------------------- */
/* ------------------------------------------------------------ */

article#c3_article_main {
	display: block;
	position: absolute;
	top: 0px;
	overflow: scroll;
	right: -500px;
	width: 500px;
	max-width: 100vw;
	height: 100%;
	background-color: rgba(255, 255, 255, 1);
	z-index: 100;
	transition: right 1s ease;
}

@media only screen and (max-width: 1200px) {
    article#c3_article_main {
       width: 300px; 
    }
}

@media only screen and (max-width: 700px) {
    article#c3_article_main {
       width: 100%;
    background-color: rgba(255, 255, 255, 0.90);
        right: -100%;
    }
}

article#c3_article_main header {
	display: block;
	position: relative;
}

article#c3_article_main section {
	display: block;
	position: relative;
	padding: 20px;
}

article#c3_article_main.c3_article_open {
	right: 0px;
}

article#c3_article_main img {
	display: block;
	width: 100%;
	height: auto;
}

article#c3_article_main div.c3_p_dev_partnerships {
	display: none;
	position: relative;
	font-family: 'Suisse Bold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	color: var(--c3_white);
	font-size: 16px;
	line-height: 40px;
	text-transform: uppercase;
	padding: 10px;
	padding-left: 20px;
	background-color: var(--c3_orange);
	letter-spacing: 5px;
}

article#c3_article_main h3 {
	display: block;
	position: absolute;
	bottom: 20px;
	left: 20px;
	color: var(--c3_white);
	font-family: 'Suisse Medium', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: normal;
	text-align: center;
	font-size: 30px;
	line-height: 30px;
	margin: 0;
	padding: 0;
	transition: color 0.25s linear;
}

article#c3_article_main div.c3_text_grad {
	display: block;
	position: absolute;
	bottom: 0px;
	left: 0px;
	width: 100%;
	height: 40%;
	background-color: black;
	background: linear-gradient(to bottom, transparent 0%, black 150%);
}

article#c3_article_main div.c3_div_stats_container {
	display: flex;
	position: relative;
	overflow: hidden;
	width: 100%;
	margin-bottom: 30px;
}

article#c3_article_main section.c3_section_column {
	display: grid;
	position: relative;
	overflow: hidden;
	width: 50%;
	padding: 0px;
	padding-left: 20px;
	height: auto;
	float: left;
	align-content: center;
}

article#c3_article_main section.c3_section_highlight {
	display: block;
	position: relative;
	overflow: hidden;
	text-align: center;
	width: 100%;
	padding: 0px;
	height: auto;
	float: none;
	margin-bottom: 30px;
	padding-top: 20px;
}

article#c3_article_main section.c3_section_column:nth-of-type(1) { 
	padding-left: 0px;
	border-right: solid 1px var(--c3_warmgrey);
}

article#c3_article_main h4, article#c3_article_main h5, article#c3_article_main h6 {
	display: block;
	overflow: hidden;
    position: relative;
	float: none;
    font-family: "TiemposHeadline-Regular", Georgia, serif;
    font-weight: normal;
    color: var(--c3_darkgrey);
	width: 100%;
    font-size: 40px;
    margin: 0;
    padding: 0;
    margin-bottom: 0px;
    transition: color 0.25s linear;
} 

article#c3_article_main h6 {
	display: block;
	position: relative;
	overflow: hidden;
	font-size: 60px;
    line-height: 70px;
	height: auto;
	color: var(--c3_black);
}

article#c3_article_main svg.c3_colour_lightblue {
	stroke: var(--c3_lightblue);
}

article#c3_article_main svg.c3_colour_yellow {
    stroke: var(--c3_yellow);
}

article#c3_article_main svg.c3_colour_orange {
    stroke: var(--c3_orange);
}

article#c3_article_main svg.c3_colour_red {
    stroke: var(--c3_red);
}

article#c3_article_main svg.c3_value_decrease {
	transform: rotate(180deg);
}

article#c3_article_main svg {
	display: block;
	position: relative;
	width: 33%;
	height: auto;
	overflow: hidden;
	fill: none;
	stroke: var(--c3_black);
	stroke-width: 50px;
	margin-bottom: 10px;
}

article#c3_article_main p {
    display: block;
    position: relative;
    font-family: "Suisse Regular", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: 400;
    color: #5E615E;
    font-size: 16px;
    line-height: 22px;
    margin: 0;
    padding: 0;
    margin-bottom: 15px;
}

article#c3_article_main p.c3_byline_1, article#c3_article_main p.c3_byline_2, article#c3_article_main p.c3_byline_3 {
    font-family: "Suisse Medium", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: normal;
    font-size: 14px;
    line-height: 18px;
    padding-bottom: 0px;
    margin-bottom: 0px;
    margin-top: -5px;
    border-bottom: 0px solid #d3d3d3;
    color: var(--c3_midgrey);
}

article#c3_article_main p:nth-child(2) {
    margin-bottom: 10px;
}

@media only screen and (max-width: 1200px) {
    article#c3_article_main p {
        font-size: 14px;
        line-height: 18px;
    }
}

article#c3_article_main small {
	display: block;
	position: relative;
	font-family: 'Suisse Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: normal;
	color: #5E615E;
	font-size: 14px;
	line-height: 19px;
	margin: 0;
	padding: 0;
	margin-bottom: 20px;
	opacity: 0;
	transition: opacity 0.25s linear;
}

article#c3_article_main small.c3_selected { opacity: 1; }

article#c3_article_main small strong {
	font-family: 'Suisse SemiBold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 700;
}

article#c3_article_main section ul {
	display: block;
	position: relative;
	list-style: none;
	margin: 0;
	padding: 0;
}

article#c3_article_main section ul li {
	display: block;
	position: relative;
	font-family: 'Suisse Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 200;
	font-size: 18px;
	color: var(--c3_darkgrey);
	padding-left: 0px;
	margin-bottom: 5px;
}

article#c3_article_main section ul li ul {
	padding-top: 10px;
}

article#c3_article_main section ul li strong {
	font-family: 'Suisse Bold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: normal;
}

article#c3_article_main section ul li::before {
	content: "";
	display: none;
	position: absolute;
	top: 0px;
	left: 0px;
	background-color: var(--c3_teal);
	width: 20px;
	height: 20px;
}

article#c3_article_main section ul li ul li::before {
	content: "";
	top: 6px;
	width: 10px;
	height: 10px;
}

article#c3_article_main video {
	display: block;
    position: relative;
    border: none;
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
}

@media only screen and (max-width: 1200px) {
    article#c3_article_main video {
        width: 100%;
        height: auto;
        aspect-ratio: 16 / 9;
    }
}

article#c3_article_main a.c3_a_readmore {
    width: auto;
    height: 20px;
    margin-right: 0px;
    padding-left: 20px;
    margin-top: 8px;
    margin-bottom: 0px;
    margin-right: 15px;
    color: var(--c3_darkgrey);
    text-decoration: none;
    display: block;
    position: relative;
    font-family: 'Suisse SemiBold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    margin-bottom: 15px;
}

article#c3_article_main a.c3_a_readmore::before {
    content: "";
    display: block;
    position: absolute;
    width: 9px;
    height: 9px;
    border-top: 1px solid var(--c3_red);
    border-left: 1px solid var(--c3_red);
    transform: rotate(-135deg);
    left: 0px;
    top: 3px;
    transition: all 0.5s ease;
}

article#c3_article_main a.c3_a_readmore.c3_selected::before {
    transform: rotate(-316deg);
    top: 8px;
}

article#c3_article_main div.c3_div_readmore {
    display: none;
    position: relative;
    overflow: hidden;
}

/* ------------------------------------------------------------ */
/* ---------------------------- Nav --------------------------- */
/* ------------------------------------------------------------ */

article#c3_article_main nav {
	display: block;
	position: relative;
	width: 100%;
	padding: 20px;
}

article#c3_article_main nav ul {
	display: block;
	position: relative;
	list-style: none;
	margin: 0;
	padding: 0;
}

article#c3_article_main nav ul li {
	display: block;
	position: relative;
	float: left;
	width: 50%;
	height: 40px;
	line-height: 40px;
	font-family: 'Suisse Bold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 700;
	color: var(--c3_darkgrey);
	text-transform: uppercase;
	padding-left: 50px;
	background-image: url("image/arrow-left-black.svg");
	background-size: auto 40px;
	background-repeat: no-repeat;
	background-position: left center;
	text-decoration: none;
}

article#c3_article_main nav ul li:nth-child(2) {
	background-image: url("image/arrow-right-black.svg");
	background-position: right center;
}

article#c3_article_main nav ul li a {
	display: block;
	position: absolute;
	padding-left: 50px;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	text-decoration: none;
	color: var(--c3_darkgrey);
}

article#c3_article_main nav ul li:nth-child(2) a {
	padding-right: 50px;
	text-align: right;
}

/* ------------------------------------------------------------ */
/* --------------------- List Article ------------------------- */
/* ------------------------------------------------------------ */

article#c3_article_list {
	display: block;
	position: absolute;
	overflow: hidden;
	top: 0px;
	right: -500px;
	width: 100vw;
	max-width: 500px;
	height: auto;
	min-height: 100vh;
	padding: 20px;
	background-color: rgba(255, 255, 255, 0.75);
	z-index: 2;
	transition: right 1s ease, width 1s ease;
}

article#c3_article_list.c3_article_open {
	right: 0px;
	width: 100vw;
}

article#c3_article_list section {
	display: block;
	height: auto;
	width: 100%;
	float: left;
}

article#c3_article_list h3 {
	display: none;
}

article#c3_article_list section h4 {
	position: relative;
    font-family: "Suisse Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: normal;
    padding: 0px;
    font-size: 20px;
    margin: 0px;
    margin-bottom: 15px;
    padding-left: 30px;
    padding-top: 8px;
    margin-bottom: 20px;
}

article#c3_article_list section:nth-of-type(3) h4 {
	margin-top: 20px;
	margin-bottom: 15px;
}

article#c3_article_list section:first-of-type h4 {
	color: var(--c3_black);
}

article#c3_article_list section h4::before {
	content: "";
	display: block;
	position: absolute;
	left: 0px;
	top: 0px;
	width: 20px;
	height: 20px;
	background-color: var(--c3_green);
}

article#c3_article_list section h4::after {
	content: "";
    display: block;
    position: absolute;
    left: 0px;
    top: -7px;
    width: 0px;
    height: 0px;
    transform-origin: bottom left;

    border: 14px solid var(--c3_green);
    border-right: 14px solid transparent;
    border-top: 14px solid transparent;
}

article#c3_article_list section:nth-of-type(2) h4::before {
	background-color: var(--c3_red);
}

article#c3_article_list section:nth-of-type(3) h4::before {
	background-color: var(--c3_orange);
}

article#c3_article_list section:nth-of-type(2) h4::after {
	border: 14px solid var(--c3_red);
    border-right: 14px solid transparent;
    border-top: 14px solid transparent;
}

article#c3_article_list section:nth-of-type(3) h4::after {
	border: 14px solid var(--c3_orange);
    border-right: 14px solid transparent;
    border-top: 14px solid transparent;
}

article#c3_article_list ul {
	display: block;
	list-style: none;
	margin: 0px;
	padding: 0px;
	padding-top: 20px;
}

article#c3_article_list ul li {
	display: block;
	overflow: hidden;
	margin: 0px;
	padding: 0px;
	font-family: "Suisse Regular", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 14px;
	border-bottom: dotted 1px var(--c3_midgrey);
	padding-top: 5px;
	padding-bottom: 5px;
}

article#c3_article_list ul li a {
	display: block;
	overflow: hidden;
	color: var(--c3_darkgrey);
	display: block;
	text-decoration: none;
}

article#c3_article_list ul li a strong {
	display: block;
	float: left;
	font-family: "Suisse Bold", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: normal;
	width: 60%;
}

article#c3_article_list ul li a span {
	display: block;
	float: left;
	width: 40%;
	text-align: right;
}

a.c3_a_close_button, a#c3_a_reset {
	display: block;
    position: absolute;
    font-size: 0px;
    width: 50px;
    height: 50px;
    background-color: var(--c3_red);
    /* border: 50px solid var(--c3_red); */
    /* border-left: 50px solid transparent; */
    /* border-bottom: 50px solid transparent; */
    z-index: 11;
    transition: right 0.5s ease 0.5s;
    top: 0px;
    right: 0px;
}
/*
a.c3_a_close_button.c3_close_inview {
	right: 0px;
}
*/
a.c3_a_close_button::before,
a.c3_a_close_button::after,
a#c3_a_reset::before,
a#c3_a_reset::after {
	content: "";
    display: block;
    position: absolute;
    top: 9.5px;
    right: 24px;
    width: 1.5px;
    height: 30px;
    background-color: var(--c3_white);
    transform: rotate(45deg);
}

a.c3_a_close_button::after, a#c3_a_reset::after {
	transform: rotate(-45deg);
}

/* -------------------------------------------------------------- */
/* --------------------- Left Nav/stats ------------------------- */
/* -------------------------------------------------------------- */

a#c3_reset {
	display: none;
	position: absolute;
	top: 30px;
	left: 280px;
	overflow: hidden;
	font-family: 'Suisse Bold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	width: 200px;
	height: 50px;
	font-size: 18px;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--c3_black);
	line-height: 50px;
	background-image: url("image/arrow-left-black.svg");
	background-size: auto 50px;
	background-repeat: no-repeat;
	padding-left: 50px;
	z-index: 2;
}

nav#c3_nav_main h1 {
	display: none;
	overflow: hidden;
	margin: 0;
	margin-bottom: 20px;
	padding: 0;
	width: 100px;
	height: 0px;
	padding-top: 37px;
	background-image: url("image/kf-logo-red.svg");
	background-size: 100% auto;
	background-repeat: no-repeat;
}

nav#c3_nav_main h2 {
	display: none;
	overflow: hidden;
	font-family: "Domaine Display Regular";
	font-size: 18px;
	line-height: 20px;
	margin: 0;
	margin-bottom: 30px;
	padding: 0;
	width: 100px;
	height: auto;
	padding-bottom: 160px;
	background-image: url("image/2026.svg");
	background-size: 100% auto;
	background-repeat: no-repeat;
	background-position: left bottom;
}

@media only screen and (max-height: 700px) {
    nav#c3_nav_main h2 {
        width: 60px;
        margin-left: 20px;
        padding-bottom: 100px;
        margin-bottom: 0px;
        margin-top: -15px;
    }
}

@media only screen and (max-width: 700px) {
    nav#c3_nav_main h1, nav#c3_nav_main h2 {
        display: none;
    }
}

nav#c3_nav_main a.c3_a_switch {
    display: block;
    position: absolute;
    overflow: hidden;
    font-family: 'Suisse Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 16px;
    text-align: center;
    color: var(--c3_black);
    text-decoration: none;
    margin-top: 20px;
    padding-top: 42px;
    width: 80px;
    bottom: 50px;
    left: 10px;
}

@media only screen and (max-width: 700px) {
    nav#c3_nav_main a.c3_a_switch {
        left: 4px;
        font-size: 14px;
    }
}

nav#c3_nav_main a#c3_a_office_switch { bottom: 170px; }
nav#c3_nav_main a#c3_a_retail_switch { bottom: 100px; }
nav#c3_nav_main a#c3_a_industrial_switch { bottom: 30px; }



nav#c3_nav_main a.c3_a_switch::before {
	content: "";
    display: block;
    position: absolute;
    top: 8px;
    left: 28px;
    width: 24px;
    height: 24px;
    border: 2px solid #d3d3d3;
    background-color: #f5f5f5;
    border-radius: 20px;
    transition: background-color 0.25s linear;
}

nav#c3_nav_main a.c3_a_switch.c3_selected::before {
    border: 2px solid #D0103A;
    background-color: #f5f5f5;
}

nav#c3_nav_main a.c3_a_switch::after {
    content: "";
    display: block;
    position: absolute;
    top: 14px;
    left: calc(50% - 6px);
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background-color: #f5f5f5;
    transform: rotate(45deg);
    transform-origin: center center;
    transition: background-color 0.25s linear, left 0.25s ease;
}

nav#c3_nav_main a.c3_a_switch.c3_selected::after {
	background-color: var(--c3_red);
}

nav#c3_nav_main h2 strong {
	display: block;
	font-family: 'Suisse Bold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

nav#c3_nav_main ul {
	display: block;
	position: relative;
	overflow: hidden;
	padding: 0;
	margin: 0;
	margin-bottom: 20px;
	border-top: 1px solid var(--c3_white);
	border-bottom: 1px solid var(--c3_white);
	transition: border-top 0.5s ease, margin-top 0.5s ease;
}

nav#c3_nav_main ul.c3_ul_inners_hidden { border-top: 0px solid var(--c3_white); margin-top: -15px; }

nav#c3_nav_main ul li {
	display: block;
	position: relative;
	overflow: hidden;
	color: var(--c3_white);
	font-family: 'Suisse Bold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	margin: 0;
	padding: 0;
	font-size: 18px;
	line-height: 22px;
	margin-bottom: 10px;
	padding-top: 5px;
	border-top: 1px dotted var(--c3_white);
}

nav#c3_nav_main ul li:first-of-type {
	border-top: none;
}

nav#c3_nav_main ul li strong {
	display: block;
	overflow: hidden;
	font-size: 50px;
	line-height: 65px;
	font-family: 'Suisse Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 200;
}

nav#c3_nav_main ul li span {
	display: block;
	overflow: hidden;
}

nav#c3_nav_main ul li a {
	display: block;
	font-size: 12px;
	line-height: 30px;
	color: var(--c3_white);
	text-transform: uppercase;
	text-decoration: none;
	width: 100%;
	height: 30px;
	padding-left: 35px;
	margin-top: 5px;
	font-family: 'Suisse Bold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	background-image: url("image/arrow-right-white.svg");
	background-repeat: no-repeat;
	background-size: auto 30px;
}

nav#c3_nav_main ul li.c3_li_expandable {
	display: none;
}

nav#c3_nav_main ul:first-of-type li.c3_li_expandable {
	display: block;
}

nav#c3_nav_main small {
	font-family: 'Suisse Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 12px;
	line-height: 14px;
	color: var(--c3_white);
}

/* ------------------------------------------------------------ */
/* ------------------------- Nav Key -------------------------- */
/* ------------------------------------------------------------ */

nav#c3_nav_main ul#c3_div_key {
	display: block;
    position: relative;
    /* left: 0px; */
    /* bottom: 0px; */
    padding: 20px;
    padding-bottom: 0px;
    border: none;
    padding: 0px;
    width: auto;
    margin-bottom: 0px;
    margin-left: 0px;
    max-width: 380px;
}




nav#c3_nav_main ul#c3_div_key li {
	display: block;
    position: relative;
    overflow: hidden;
    font-family: 'Suisse Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 14px !important;
    text-align: center;
    color: var(--c3_black);
    text-decoration: none;
    margin-top: 20px;
    padding-top: 30px;
    border: none;
    font-size: 12px;
    margin-top: 10px;
    width: 90px;
    float: left;
}

@media only screen and (max-width: 700px) {
    nav#c3_nav_main ul#c3_div_key li {
        width: 70px; 
        font-size: 14px !important;
    }
}


nav#c3_nav_main ul#c3_div_key li::before {
	content: "";
    display: block;
    position: absolute;
    top: 5px;
    left: 30px;
    width: 25px;
    height: 25px;
    background-color: transparent;

    transform-origin: center center;
    left: calc(50% - 12px);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}





nav#c3_nav_main ul#c3_div_key li:nth-of-type(1)::before { background-image: url(image/pin_lightblue.svg); }
nav#c3_nav_main ul#c3_div_key li:nth-of-type(2)::before { background-image: url(image/pin_yellow.svg); }
nav#c3_nav_main ul#c3_div_key li:nth-of-type(3)::before { background-image: url(image/pin_orange.svg); }
nav#c3_nav_main ul#c3_div_key li:nth-of-type(4)::before { background-image: url(image/pin_red.svg); }

/* ------------------------------------------------------- */
/* --------------- Property Markers ---------------------- */
/* ------------------------------------------------------- */

div#c3_map_container div.c3_london_marker, 
div#c3_map_container div.c3_region_marker, 
div#c3_map_container div.c3_property_marker, 
div#c3_map_container div.c3_regional_property_marker {
	display: block;
	overflow: visible;
	color: #FFFFFF !important;
	width: 50px;
	text-align: center;
	cursor: pointer;
	height: 50px;
	margin-top: -25px; /* Should be half the height */
	/* text-shadow: 0px 0px 10px rgba(0, 0, 0, 1); */
	transition: height 0.5s ease, opacity 0.25s ease;
	transform-origin: bottom center;
}

div#c3_map_container div.c3_property_marker img,
div#c3_map_container div.c3_regional_property_marker img {
	display: none;
}

div#c3_map_container div.c3_london_marker span.c3_span_title, 
div#c3_map_container div.c3_region_marker span.c3_span_title, 
div#c3_map_container div.c3_property_marker span.c3_span_title,
div#c3_map_container div.c3_regional_property_marker span.c3_span_title {
	display: block;
	color: var(--c3_white);
	font-family: 'Suisse Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-weight: 200;
	text-align: center;
	line-height: 25px;
	position: absolute;
	overflow: visible;
	font-size: 12px;
	width: 25px;
	height: 65%;
	left: 0px;
	bottom: 0px;
	border-right: 1px solid var(--c3_black);
	opacity: 0.8;
	transition: width 0.5s ease, height 0.5s ease;
}

div#c3_map_container div.c3_region_marker span.c3_span_title,
div#c3_map_container div.c3_property_marker span.c3_span_title {
	border-right: 1px solid var(--c3_black);
}

div#c3_map_container div.c3_london_marker span.c3_span_title {
	overflow: visible;
}


/*

div#c3_map_container div.c3_london_marker span.c3_span_title::before,
div#c3_map_container div.c3_london_marker span.c3_span_title::after,
div#c3_map_container div.c3_region_marker span.c3_span_title::before, 
div#c3_map_container div.c3_region_marker span.c3_span_title::after, 
div#c3_map_container div.c3_property_marker span.c3_span_title::before,
div#c3_map_container div.c3_property_marker span.c3_span_title::after,
div#c3_map_container div.c3_regional_property_marker span.c3_span_title::before,
div#c3_map_container div.c3_regional_property_marker span.c3_span_title::after {
	content: "";
	display: block;
	position: absolute;
	left: 0px;
	bottom: 75px;
	width: 25px;
	height: 25px;
	background-color: var(--c3_black);
	z-index: -1;
}

div#c3_map_container div.c3_london_marker span.c3_span_title::after, 
div#c3_map_container div.c3_region_marker span.c3_span_title::after, 
div#c3_map_container div.c3_property_marker span.c3_span_title::after,
div#c3_map_container div.c3_regional_property_marker span.c3_span_title::after {
	width: 35.355px;
	height: 35.355px;
	transform-origin: bottom left;
	background-color: var(--c3_black);
	transform: rotate(45deg);
}

*/

div#c3_map_container div.c3_london_marker span.c3_span_title::after, 
div#c3_map_container div.c3_region_marker span.c3_span_title::after, 
div#c3_map_container div.c3_property_marker span.c3_span_title::after,
div#c3_map_container div.c3_regional_property_marker span.c3_span_title::after {
	content: "";
	display: block;
	position: absolute;
	left: 7px !important;
    right: auto !important;
	bottom: 0px;
	background-color: var(--c3_black);
	z-index: -1;
	width: 34px !important;
	height: 34px !important;
	transform-origin: bottom left !important;
	background-color: transparent !important;
	border: solid black 0px;
	margin-left: 0px !important;
    margin-right: 0px !important;
	transition: width 1s ease, height 1s ease, left 1s ease, top 1s ease, bottom 1s ease, right 1s ease;
    background-image: url(image/pin_black.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

div#c3_map_container div.c3_london_marker:hover span.c3_span_title::after, 
div#c3_map_container div.c3_region_marker:hover span.c3_span_title::after, 
div#c3_map_container div.c3_property_marker:hover span.c3_span_title::after,
div#c3_map_container div.c3_regional_property_marker:hover span.c3_span_title::after {
	
	
}

div#c3_map_container div.c3_marker_retail.c3_colour_lightblue span.c3_span_title::after { background-image: url(image/pin_lightblue.svg) !important;  }
div#c3_map_container div.c3_marker_retail.c3_colour_yellow span.c3_span_title::after { background-image: url(image/pin_yellow.svg) !important;  }
div#c3_map_container div.c3_marker_retail.c3_colour_orange span.c3_span_title::after { background-image: url(image/pin_orange.svg) !important;  }
div#c3_map_container div.c3_marker_retail.c3_colour_red span.c3_span_title::after { background-image: url(image/pin_red.svg) !important; }

div#c3_map_container div.c3_region_marker_standalone.c3_colour_lightblue span.c3_span_title::after { background-image: url(image/pin_lightblue.svg) !important;  }
div#c3_map_container div.c3_region_marker_standalone.c3_colour_yellow span.c3_span_title::after { background-image: url(image/pin_yellow.svg) !important;  }
div#c3_map_container div.c3_region_marker_standalone.c3_colour_orange span.c3_span_title::after { background-image: url(image/pin_orange.svg) !important;  }
div#c3_map_container div.c3_region_marker_standalone.c3_colour_red span.c3_span_title::after { background-image: url(image/pin_red.svg) !important; }

div#c3_map_container div.c3_region_marker.c3_selected span.c3_span_title::after {
	
}



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

div#c3_map_container div.c3_london_marker.c3_marker_right:hover span.c3_span_title::after, 
div#c3_map_container div.c3_region_marker.c3_marker_right:hover span.c3_span_title::after, 
div#c3_map_container div.c3_property_marker.c3_marker_right:hover span.c3_span_title::after,
div#c3_map_container div.c3_regional_property_marker.c3_marker_right:hover span.c3_span_title::after {
	margin-left: 0px !important;
	margin-right: -3px !important;
}

div#c3_map_container div.c3_region_marker.c3_marker_tall.c3_selected span.c3_span_title::after {
	
}

div#c3_map_container div.c3_region_marker.c3_marker_short.c3_selected span.c3_span_title::after {
	
}

@media only screen and (max-width: 1000px) {
    div#c3_map_container div.c3_region_marker.c3_marker_tall.c3_selected span.c3_span_title::after {
        
    }

    div#c3_map_container div.c3_region_marker.c3_marker_short.c3_selected span.c3_span_title::after {
       
    }
}

div#c3_map_container div.c3_region_marker.c3_colour_lightblue.c3_selected span.c3_span_title::after { background-color: var(--c3_lightblue); }
div#c3_map_container div.c3_region_marker.c3_colour_yellow.c3_selected span.c3_span_title::after { background-color: var(--c3_yellow); }
div#c3_map_container div.c3_region_marker.c3_colour_orange.c3_selected span.c3_span_title::after { background-color: var(--c3_orange); }
div#c3_map_container div.c3_region_marker.c3_colour_red.c3_selected span.c3_span_title::after { background-color: var(--c3_red); }

div#c3_map_container div.c3_london_marker span.c3_span_title::before {
	width: 50px;
	height: 25px;
	background-color: var(--c3_black);
}

div#c3_map_container div.c3_london_marker span.c3_span_title::after,
div#c3_map_container div.c3_region_marker span.c3_span_title::before, 
div#c3_map_container div.c3_region_marker span.c3_span_title::after,
div#c3_map_container div.c3_property_marker_green span.c3_span_title::before, 
div#c3_map_container div.c3_property_marker_green span.c3_span_title::after {
	background-color: var(--c3_black);
}

div#c3_map_container div.c3_property_marker_orange span.c3_span_title::before, 
div#c3_map_container div.c3_property_marker_orange span.c3_span_title::after {
	background-color: var(--c3_black);
}

div#c3_map_container div.c3_london_marker span.c3_span_people, 
div#c3_map_container div.c3_region_marker span.c3_span_people, 
div#c3_map_container div.c3_property_marker span.c3_span_people,
div#c3_map_container div.c3_regional_property_marker span.c3_span_people {
	display: block;
	position: absolute;
	text-align: left;
	line-height: 30px;
	color: var(--c3_darkgrey);
	text-shadow: 0px 0px 3px var(--c3_white), 0px 0px 3px var(--c3_white), 0px 0px 3px var(--c3_white);*/
	font-family: 'Suisse Medium', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	/*letter-spacing: 2px;*/
	/*text-transform: uppercase;*/
	overflow: visible;
	font-size: 14px;
	width: max-content;
	height: auto;
	left: 40px;
	top: 14px;
	opacity: 1;
	transition: opacity 0.25s linear;
}


div#c3_map_container div.c3_region_marker.c3_marker_retail span.c3_span_people {
	
}

/* Add hider for span people and detail text */
div#c3_map_container div.c3_region_marker.c3_selected span.c3_span_people { opacity: 0;}

div#c3_map_container div.c3_region_marker div.c3_div_detail_writeup { display: none; }

div#c3_map_container div.c3_london_marker span.c3_span_people {
	font-family: 'Suisse Bold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 14px;
	color: var(--c3_darkgrey);
	text-shadow: 0px 0px 0px transparent;
	top: -20px;
	left: -25px;
	text-align: center;
}

div#c3_map_container div.c3_london_marker a, 
div#c3_map_container div.c3_region_marker a, 
div#c3_map_container div.c3_property_marker a,
div#c3_map_container div.c3_regional_property_marker a {
	display: block;
	position: absolute;
	overflow: visible;
	font-size: 0px;
	left: 0px;
	top: 0px;
	width: 125px;
	height: 50px;
	z-index: 2;
	transition: width 0.5s ease, height 0.5s ease;
}

div#c3_map_container div.c3_london_marker a::after, 
div#c3_map_container div.c3_region_marker a::after, 
div#c3_map_container div.c3_property_marker a::after,
div#c3_map_container div.c3_regional_property_marker a::after {
	content: "";
	display: none;
	position: absolute;
	left: 21.5px;
	top: 97.5px;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background-color: var(--c3_darkgrey);
	z-index: 2;
}

/* Marker overrides for right handers */

div#c3_map_container div.c3_region_marker.c3_marker_right span,
div#c3_map_container div.c3_property_marker.c3_marker_right span,
div#c3_map_container div.c3_regional_property_marker.c3_marker_right span {
	left: 25px;
	border-left: 1px solid var(--c3_black);
	border-right: none;
}

div#c3_map_container div.c3_property_marker.c3_marker_right.c3_property_marker_green span {
	border-left: 1px solid var(--c3_white);
}

div#c3_map_container div.c3_region_marker.c3_marker_right span::before,
div#c3_map_container div.c3_region_marker.c3_marker_right span::after,
div#c3_map_container div.c3_property_marker.c3_marker_right span::before,
div#c3_map_container div.c3_property_marker.c3_marker_right span::after,
div#c3_map_container div.c3_regional_property_marker.c3_marker_right span::before,
div#c3_map_container div.c3_regional_property_marker.c3_marker_right span::after {
	background-color: var(--c3_black);
}

div#c3_map_container div.c3_region_marker.c3_marker_right span::after,
div#c3_map_container div.c3_property_marker.c3_marker_right span::after,
div#c3_map_container div.c3_regional_property_marker.c3_marker_right span::after {
	left: auto;
	transform-origin: bottom right;
	background-color: var(--c3_black);

}

div#c3_map_container div.c3_marker_right.c3_property_marker_green span.c3_span_title::before, 
div#c3_map_container div.c3_marker_right.c3_property_marker_green span.c3_span_title::after {
	background-color: var(--c3_black);
}

div#c3_map_container div.c3_marker_right span.c3_span_title::after {
    left: -17px !important;
}

div#c3_map_container div.c3_region_marker.c3_marker_right span.c3_span_people,
div#c3_map_container div.c3_property_marker.c3_marker_right span.c3_span_people,
div#c3_map_container div.c3_regional_property_marker.c3_marker_right span.c3_span_people {
	text-align: right;
	left: auto;
	right: 40px;
	bottom: 0px;
	border: none;
	height: 18px;
	width: max-content;
}

div#c3_map_container div.c3_region_marker.c3_marker_right a,
div#c3_map_container div.c3_property_marker.c3_marker_right a,
div#c3_map_container div.c3_regional_property_marker.c3_marker_right a {
	left: -75px;
}

div#c3_map_container div.c3_region_marker.c3_marker_right a::after,
div#c3_map_container div.c3_property_marker.c3_marker_right a::after,
div#c3_map_container div.c3_regional_property_marker.c3_marker_right a::after {
	left: calc(100px - 2px);
}

/* Marker overrides for tall version */

div#c3_map_container div.c3_region_marker.c3_marker_tall, 
div#c3_map_container div.c3_london_marker.c3_marker_tall, 
div#c3_map_container div.c3_property_marker.c3_marker_tall,
div#c3_map_container div.c3_regional_property_marker.c3_marker_tall {
	height: 80px;
	margin-top: -40px; /* Should be half the height */
}

div#c3_map_container div.c3_region_marker.c3_marker_tall span.c3_span_title::before,
div#c3_map_container div.c3_region_marker.c3_marker_tall span.c3_span_title::after,
div#c3_map_container div.c3_london_marker.c3_marker_tall span.c3_span_title::before,
div#c3_map_container div.c3_london_marker.c3_marker_tall span.c3_span_title::after,
div#c3_map_container div.c3_property_marker.c3_marker_tall span.c3_span_title::before,
div#c3_map_container div.c3_property_marker.c3_marker_tall span.c3_span_title::after,
div#c3_map_container div.c3_regional_property_marker.c3_marker_tall span.c3_span_title::before,
div#c3_map_container div.c3_regional_property_marker.c3_marker_tall span.c3_span_title::after {
	bottom: 30px;
}

div#c3_map_container div.c3_region_marker.c3_marker_tall a::after,
div#c3_map_container div.c3_london_marker.c3_marker_tall a::after, 
div#c3_map_container div.c3_property_marker.c3_marker_tall a::after, 
div#c3_map_container div.c3_regional_property_marker.c3_marker_tall a::after {
	top: 147.5px;
}

/* Marker overrides for short version */

div#c3_map_container div.c3_region_marker.c3_marker_short, 
div#c3_map_container div.c3_london_marker.c3_marker_short, 
div#c3_map_container div.c3_property_marker.c3_marker_short,
div#c3_map_container div.c3_regional_property_marker.c3_marker_short {
	height: 50px;
	margin-top: -25px; /* Should be half the height */
}

div#c3_map_container div.c3_region_marker.c3_marker_short span.c3_span_title::before,
div#c3_map_container div.c3_region_marker.c3_marker_short span.c3_span_title::after,
div#c3_map_container div.c3_london_marker.c3_marker_short span.c3_span_title::before,
div#c3_map_container div.c3_london_marker.c3_marker_short span.c3_span_title::after,
div#c3_map_container div.c3_property_marker.c3_marker_short span.c3_span_title::before,
div#c3_map_container div.c3_property_marker.c3_marker_short span.c3_span_title::after,
div#c3_map_container div.c3_regional_property_marker.c3_marker_short span.c3_span_title::before,
div#c3_map_container div.c3_regional_property_marker.c3_marker_short span.c3_span_title::after {
	bottom: 25px;
}

div#c3_map_container div.c3_region_marker.c3_marker_short a::after, 
div#c3_map_container div.c3_london_marker.c3_marker_short a::after, 
div#c3_map_container div.c3_property_marker.c3_marker_short a::after, 
div#c3_map_container div.c3_regional_property_marker.c3_marker_short a::after {
	top: 47.5px;
}

/* Marker overrides zoom-based visiblity */

div#c3_map_container div.c3_property_marker.c3_zoom_range_1 span.c3_span_people,
div#c3_map_container div.c3_regional_property_marker.c3_zoom_range_1 span.c3_span_people {
	background-color: blue;
	width: 0px;
	overflow: hidden;
}

div#c3_map_container div.c3_property_marker.c3_zoom_range_3 span.c3_span_people {
	color: var(--c3_darkgrey);
	text-shadow: 0px 0px 0px transparent;
}

div#c3_map_container div.c3_property_marker.c3_zoom_range_3 span.c3_span_title {
	border-right: 1px solid var(--c3_black);
}

div#c3_map_container div.c3_property_marker.c3_marker_right.c3_zoom_range_3 span.c3_span_title {
	border-left: 1px solid var(--c3_black);
	border-right: none;
}

div#c3_map_container div.c3_region_marker.c3_region_marker_hide_label span.c3_span_people {
	opacity: 0;
}

/* Marker overrides for hidden by filters */

div#c3_map_container div.c3_region_marker.c3_hidden_by_filters * {
	height: 0px !important;
	width: 0px !important;
}

div#c3_map_container div.c3_region_marker.c3_hidden_by_filters {
	overflow: hidden;
	height: 0px;
	opacity: 0 !important;
}

/* Region marker detail view */

div#c3_map_container div.c3_region_marker span.c3_span_detail_title {
	display: none !important;
	position: absolute;
	top: calc(-212px - 50px);
	left: calc(-212px + 25px);
	font-family: 'Suisse Medium', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 20px;
	text-shadow: 0px 0px 3px var(--c3_darkgrey), 0px 0px 3px var(--c3_darkgrey), 0px 0px 3px var(--c3_darkgrey);
	line-height: 40px;
	text-align: center;
	text-transform: uppercase;
	color: var(--c3_white);
	width: 424px;
	height: 60px;
	transition: transform 0.5s ease 0.5s;
	border: none;
	transform: scale(0,0);
	transform-origin: center center;
}

div#c3_map_container div.c3_region_marker.c3_selected span.c3_span_detail_title { transform: scale(1,1); }

@media only screen and (max-width: 1000px) {
    div#c3_map_container div.c3_region_marker span.c3_span_detail_title {
        top: calc(-162px - 50px);
    }
}

div#c3_map_container div.c3_region_marker span.c3_span_first_number {
	display: none !important;
	position: absolute;
	top: -212px;
	left: calc(-212px + 25px);
	font-family: 'DomaineDispSemibold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 60px;
	line-height: 60px;
	text-align: center;
	color: var(--c3_white);
	width: 424px;
	height: 60px;
	transition: transform 0.5s ease 0.5s;
	border: none;
	transform: scale(0,0);
	transform-origin: center center;
}

@media only screen and (max-width: 1000px) {
    div#c3_map_container div.c3_region_marker span.c3_span_first_number {
        font-size: 40px;
	    line-height: 40px;
        top: -170px;
    }
}

div#c3_map_container div.c3_region_marker.c3_selected span.c3_span_first_number { transform: scale(1,1); }

div#c3_map_container div.c3_region_marker span.c3_span_first_number::before,
div#c3_map_container div.c3_region_marker span.c3_span_first_number::after {
	content: "";
	display: none !important;
	position: absolute;
	width: 0px;
	height: 0px;
	border-left: 50px solid transparent;
  	border-right: 50px solid transparent;
  	border-bottom: 50px solid rgba(255,255,255,0.3);
	top: -170px;
	left: calc(50% - 50px);
	background-color: transparent;
	transform: rotate(0deg);
}

div#c3_map_container div.c3_region_marker span.c3_span_first_number::after {
	top: 170px;
	border-bottom: 50px solid transparent;
	border-left: 50px solid transparent;
  	border-right: 50px solid transparent;
  	border-top: 50px solid rgba(255,255,255,0.3);
}

@media only screen and (max-width: 1000px) {
    div#c3_map_container div.c3_region_marker span.c3_span_first_number::before {
        top: -100px;
        left: calc(50% - 25px);
        border-left: 25px solid transparent;
  	    border-right: 25px solid transparent;
  	    border-bottom: 25px solid rgba(255,255,255,0.3);

    }
    
    div#c3_map_container div.c3_region_marker span.c3_span_first_number::after {
        top: 140px;
        left: calc(50% - 25px);
        border-bottom: 25px solid transparent;
        border-left: 25px solid transparent;
        border-right: 25px solid transparent;
        border-top: 25px solid rgba(255,255,255,0.3);
    }
}

div#c3_map_container div.c3_region_marker.c3_value_increase span.c3_span_first_number::before {
	border-bottom: 50px solid rgba(255,255,255,1);
}

div#c3_map_container div.c3_region_marker.c3_value_decrease span.c3_span_first_number::after {
	border-top: 50px solid rgba(255,255,255,1);
}

@media only screen and (max-width: 1000px) {
    div#c3_map_container div.c3_region_marker.c3_value_increase span.c3_span_first_number::before {
        border-bottom: 25px solid rgba(255,255,255,1);
        top: -100px;
    }

    div#c3_map_container div.c3_region_marker.c3_value_decrease span.c3_span_first_number::after {
        border-top: 25px solid rgba(255,255,255,1);
        top: 140px;
    }

}

div#c3_map_container div.c3_region_marker span.c3_span_first_byline {
	display: none !important;
	position: absolute;
	top: calc(-212px + 60px);
	left: calc(-212px + 25px);
	font-family: 'Suisse Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 18px;
	line-height: 18px;
	text-align: center;
	color: var(--c3_white);
	width: 424px;
	height: 18px;
	transition: transform 0.5s ease 0.5s;
	border: none;
	transform: scale(0,0);
	transform-origin: center center;
}

@media only screen and (max-width: 1000px) {
    div#c3_map_container div.c3_region_marker span.c3_span_first_byline {
        top: calc(-182px + 60px);
        font-size: 14px;
	    line-height: 14px;
    }
}

div#c3_map_container div.c3_region_marker.c3_selected span.c3_span_first_byline { transform: scale(1,1); }

div#c3_map_container div.c3_region_marker span.c3_span_first_byline::before,
div#c3_map_container div.c3_region_marker span.c3_span_first_byline::after {
	content: "";
	display: none !important;
	position: absolute;
	width: 100px;
	height: 100px;
	top: -85px;
	left: -40px;
	background-color: rgba(0,0,0,0.8);
	transform-origin: center center;
	transform: rotate(45deg);
	z-index: 0;
}

div#c3_map_container div.c3_region_marker span.c3_span_first_byline::after {
	width: 125px;
	height: 125px;
	top: -100px;
	left: 360px;
}

@media only screen and (max-width: 1000px) {
    div#c3_map_container div.c3_region_marker span.c3_span_first_byline::before,
    div#c3_map_container div.c3_region_marker span.c3_span_first_byline::after {
        top: 85px;
        left: 92px;
    }
    
    div#c3_map_container div.c3_region_marker span.c3_span_first_byline::after {
        top: 72px;
        left: 238px;
    }

}

div#c3_map_container div.c3_region_marker span.c3_span_second_number,
div#c3_map_container div.c3_region_marker span.c3_span_third_number {
	display: none !important;
	position: absolute;
	top: -212px;
	left: calc(-230px);
	font-family: 'DomaineDispSemibold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 30px;
	line-height: 30px;
	text-align: center;
	color: var(--c3_white);
	width: 100px;
	height: 60px;
	border: none;
	z-index: 1;
	transition: transform 0.5s ease 0.5s;
	transform: scale(0,0);
	transform-origin: center center;
}

div#c3_map_container div.c3_region_marker.c3_selected span.c3_span_second_number,
div#c3_map_container div.c3_region_marker.c3_selected span.c3_span_third_number { transform: scale(1,1); }

div#c3_map_container div.c3_region_marker span.c3_span_third_number {
	top: -220px;
	font-size: 40px;
	left: 185px;
}

@media only screen and (max-width: 1000px) {
    div#c3_map_container div.c3_region_marker span.c3_span_second_number {
        top: -10px;
        left: -100px;
    }
    
    div#c3_map_container div.c3_region_marker span.c3_span_third_number {
        top: -20px;
        left: 60px;
    }
}

div#c3_map_container div.c3_region_marker span.c3_span_second_byline,
div#c3_map_container div.c3_region_marker span.c3_span_third_byline {
	display: none !important;
	position: absolute;
	top: -180px;
	left: calc(-230px);
	font-family: 'Suisse Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 16px;
	text-align: center;
	color: var(--c3_white);
	width: 100px;
	height: 60px;
	border: none;
	z-index: 1;
	transition: transform 0.5s ease 0.5s;
	transform: scale(0,0);
	transform-origin: center center;
}

div#c3_map_container div.c3_region_marker.c3_selected span.c3_span_second_byline,
div#c3_map_container div.c3_region_marker.c3_selected span.c3_span_third_byline { transform: scale(1,1); }

div#c3_map_container div.c3_region_marker span.c3_span_third_byline {
	top: -185px;
	left: 185px;
}

@media only screen and (max-width: 1000px) {
    div#c3_map_container div.c3_region_marker span.c3_span_second_byline {
        top: 20px;
        left: -95px;
    }
    
    div#c3_map_container div.c3_region_marker span.c3_span_third_byline {
        top: 12px;
        left: 63px;
    }
}

div#c3_map_container div.c3_region_marker p.c3_show_detail_mobile {
        display: none;
        transition: all 0.5s ease;
        width: 0px;
        padding: 0px;
        font-size: 0px;
    }
    
    div#c3_map_container div.c3_region_marker.c3_selected p.c3_show_detail_mobile {
        display: none;
        position: absolute;
        top: -105px;
        left: 50%;
        width: 90px;
        background-color: #000000;
        color: #ffffff;
        padding: 5px;
        margin-left: -45px;
        font-size: 12px;
    }

    div#c3_map_container div.c3_region_marker p.c3_show_detail_mobile::before {
        content: "Zoom out";
    }


@media only screen and (max-width: 700px) {
    div#c3_map_container div.c3_region_marker.c3_selected p.c3_show_detail_mobile {
        display: block;
        top: -60px;
        font-size: 14px;
        line-height: 18px;
        background-color: #D0103A;
        color: #ffffff;
        padding: 8px;
    }
    
    div#c3_map_container div.c3_region_marker p.c3_show_detail_mobile::before {
        display: block !important;
        content: "Tap pin to show detail";
    }
}


/* -------------------------------------------------------------- */
/* ------------------------ Pop-up ------------------------------ */
/* -------------------------------------------------------------- */

div#c3_div_popup {
	display: block;
	position: fixed;
	top: 0px;
	left: 250px;
	width: calc(100vw - 250px);
	height: 100vh;
	background-color: rgba(255, 255, 255, 0.9);
	z-index: 100;
}

div#c3_div_popup div#c3_div_popup_container {
	display: block;
    position: absolute;
	overflow: scroll;
    top: 10%;
    left: 10%;
    width: 80%;
    height: 80%;
    background-color: var(--c3_darkgrey);
    padding: 30px;
    padding-left: 30%;
    background-image: url(image/Justin-Gaze.jpg);
    background-size: 30% auto;
    background-position: left bottom;
    background-repeat: no-repeat;
	-ms-overflow-style: none;  /* IE and Edge */
  	scrollbar-width: none;  /* Firefox */
}

div#c3_div_popup div#c3_div_popup_container::-webkit-scrollbar {
  display: none;
}

div#c3_div_popup h2 {
	font-family: 'Suisse Bold', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 36px;
	margin: 0px;
	padding: 0px;
	margin-bottom: 30px;
	color: var(--c3_white);
}

div#c3_div_popup h3 {
	font-family: 'Suisse Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 18px;
	line-height: 24px;
	margin: 0px;
	padding: 0px;
	margin-bottom: 25px;
	color: var(--c3_white);
}

div#c3_div_popup p {
	font-family: 'Suisse Regular', 'Helvetica Neue', Helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 20px;
	margin: 0px;
	padding: 0px;
	margin-bottom: 15px;
	color: var(--c3_white);
}

/* -------------------------------------------------------------- */
/* ---------- Custom overrides for special markers -------------- */
/* -------------------------------------------------------------- */

div#marker-uk {
	width: 0px !important;
	height: 0px !important;
	overflow: hidden !important;
}
	
	
	
	
	
	
	
	
	
	
	
	
	
	