/*
 Theme Name:   NBI
 Theme URI:    https://nbi.ie/
 Description:  National Broadband Ireland theme (GeneratePress child theme)
 Author:       The NBI Team
 Author URI:   https://nbi.ie
 Template:     generatepress
 Version:      3.10.25640
*/
:root {
    --body-text: #58595B; /* Grey */
    --logo-medium-green: #00b388;
    --logo-blue-green: #4ba5bd;
    --logo-green: #7cd0bd;

    --emerald: #00a881; /* Light green */
    --teal: #007681; /* Dark green */
    --lime: #c8dc56; /* Lime */
    --teal-rgb: 0,118,129;
    --teal-other: #33919a; /* NOT USED YET */

    /* Shades */
    --teal-shade-1: #33919a;
    --teal-shade-2: #66adb4;
    --teal-shade-3: #99c8cd;
    --teal-shade-4: #cce4e6;

    /* Complementary colours */
    --buttercup: #fcaa19;
    --rust: #e6533c;
    --cherry: #871236; /* NOT USED YET */
    --sky: #008cac; /* NOT USED YET */
    --heather: #3e374b;
    --charcoal: #1e1e25; /* NOT USED YET */

    --other-text: #4f4f4f; /* Darker grey */
    --content-bg: rgba(0,118,129,.07);  /* Light blue/green */
    --form-error: #da1e28;
    --default-bg: #fff;

    --default-font-stack: 'Graphik Regular', "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;

    --cta-icon-offset: 30px;
	
	--max-content-width: 1200px;
}

/* #### Generated By: http://www.cufonfonts.com #### */
@font-face {
  font-family: 'Graphik Regular';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Regular'), url('./fonts/GraphikRegular.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Regular Italic';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Regular Italic'), url('./fonts/GraphikRegularItalic.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Thin';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Thin'), url('./fonts/GraphikThin.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Thin Italic';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Thin Italic'), url('./fonts/GraphikThinItalic.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Extralight';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Extralight'), url('./fonts/GraphikExtralight.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Extralight Italic';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Extralight Italic'), url('./fonts/GraphikExtralightItalic.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Light';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Light'), url('./fonts/GraphikLight.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Light Italic';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Light Italic'), url('./fonts/GraphikLightItalic.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Medium';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Medium'), url('./fonts/GraphikMedium.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Medium Italic';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Medium Italic'), url('./fonts/GraphikMediumItalic.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Semibold';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Semibold'), url('./fonts/GraphikSemibold.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Semibold Italic';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Semibold Italic'), url('./fonts/GraphikSemiboldItalic.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Bold';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Bold'), url('./fonts/GraphikBold.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Bold Italic';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Bold Italic'), url('./fonts/GraphikBoldItalic.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Black';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Black'), url('./fonts/GraphikBlack.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Black Italic';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Black Italic'), url('./fonts/GraphikBlackItalic.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Super';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Super'), url('./fonts/GraphikSuper.woff') format('woff');
}
@font-face {
  font-family: 'Graphik Super Italic';
  font-style: normal;
  font-weight: normal;
  src: local('Graphik Super Italic'), url('./fonts/GraphikSuperItalic.woff') format('woff');
}
/* #### Generated By: http://www.cufonfonts.com #### */


/* Global styles */
body { background-color: var(--default-bg); color: var(--body-text); font-family: var(--default-font-stack); font-size: 16px; }
h1, h2, h3, h4, h5, h6, body.sub-page .single-article-summary h2 { color: var(--teal); font-family: "Graphik Light"; }
h2 { font-size: 40px; line-height: 44px; letter-spacing: -0.5px; }
h3 { font-size: 24px; line-height: 28px; }
h4 { font-size: 24px; line-height: 28px; margin-bottom: 10px; } /* Same as h3 but without letter-spacing. */
h5 { font-size: 14px; line-height: 20px; letter-spacing: 1px; }
h4, h5, h6 { /*margin-bottom: 0;*/ }
body.sub-page .single-article-summary p { color: var(--body-text); }
.page-our-story h2 { font-size: 24px; line-height: 28px; letter-spacing: 4px; }

.wp-block-image { margin-bottom: 20px; }

body.sub-page.page-steps-to-getting-the-network-connected .sub-content h2 { font-size: 28px; line-height: 40px; margin-bottom: 10px; }
.page-steps-to-getting-the-network-connected h4 { font-family: 'Graphik Medium'; font-size: 16px; line-height: 28px; letter-spacing: 3px; margin-bottom: 0; text-decoration: underline; text-underline-offset: 5px; }

a { color: var(--logo-blue-green); }
a:hover { color: var(--logo-green); text-decoration: underline; }
.wp-block-column.bg-emerald a { color: var(--default-bg); text-decoration: underline; }

.before-header, .main-navigation .main-nav ul li.eoi-item a { background-color: var(--emerald); color: var(--default-bg); }
.before-header { font-size: 14px; line-height: 36px; }
.before-header a, .before-header a:hover, #footer-widgets a, #footer-widgets a:hover { color: var(--default-bg); }
/*#footer-widgets p.social { display: flex; }
#footer-widgets .social a { flex: 1 1 0; }*/
/*#footer-widgets a.twitter, #footer-widgets a.tiktok { padding-right: 27px; }*/ /* to reduce excessive size of X &Tiktok logos. */
/*.before-header .widget_nav_menu ul { display: flex; flex-wrap: nowrap; justify-content: space-between; }*/
/*.before-header .lang-item { text-align: right; }*/
.before-header .widget ul li { display: inline; margin-right: 2em; }
.before-header .lang-item { float: right; }

.inside-header { align-items: flex-end; justify-content: space-between; padding: 20px 40px 50px 40px; }

/* Navigation */
.main-navigation { background-color: var(--default-bg); }
@media (min-width: 769px) {
    .main-navigation { /*margin-bottom: 50px;*/ }
}
.main-navigation ul ul { background-color: var(--default-bg); }
.main-navigation .main-nav ul li a { font-size: 16px; line-height: 36px; transition: color 300ms !important; }
.main-navigation .main-nav ul li.eoi-item a { border-radius: 30px; margin-left: 30px; }
.slideout-navigation.main-navigation .main-nav ul li.eoi-item a { margin-left: 20px; }
.sticky-enabled .main-navigation.is_stuck { background-color: var(--default-bg); box-shadow: 0 4px 12px rgb(0, 0, 0, 0.1); }
.main-navigation.navigation-stick.has-sticky-branding .inside-navigation.grid-container { padding-left: 0; padding-right: 0; } /* Move closer to edges - TODO: move right to edge. */
.inside-navigation.alignfull { padding-left: 50px; padding-right: 50px; }
.menu-toggle .gp-icon svg { fill: var(--teal); height: 2em; width: 2em; }
/*#generate-slideout-menu { background-color: var(--emerald); }*/
/*#generate-slideout-menu .top-half { background-color: var(--teal); }*/
#generate-slideout-menu .eoi-item a { display: inline-block; margin-left: -20px; background-color: transparent; color: var(--body-text); }
#generate-slideout-menu .eoi-item a::after { content: '>'; padding-left: 10px; }
.slidein-logo { padding-left: 20px; display: flex; justify-content: space-between; width: 100%; }
.slidein-logo img { height: 75px; width: 75px; }
.slideout-navigation .slidein-logo button.slideout-exit { text-align: right; }
.slidein-logo .gp-icon.pro-close { height: 1.5em; width: 1.5em; }
body .slideout-navigation, body .slideout-navigation a { color: var(--default-bg); }
body .slideout-navigation .top-level a { background-color: var(--lime); color: var(--teal); border-radius: 12px; margin-bottom: 30px; }
body .slideout-navigation button.slideout-exit { color: var(--teal); }
.slideout-navigation.main-navigation .main-nav.before-header ul li a { font-size: 14px; }  /* Secondary menu slightly smaller */

.slideout-navigation .connected > a, .slideout-navigation .rollout > a, .slideout-navigation .about > a { display: none; }
.slideout-navigation .connected, .slideout-navigation .rollout, .slideout-navigation .about { margin-bottom: 30px; }
body #generate-slideout-menu .slideout-menu > li { width: 90%; margin-left: 5%; }
#generate-slideout-menu.main-navigation .main-nav ul ul { padding: 10px; width: 95%; }
#generate-slideout-menu.main-navigation .main-nav ul ul li a { padding-left: 0; }
#generate-slideout-menu.main-navigation .main-nav ul ul li:not(.sub-menu-title) a:after { content: '>'; right: 10px; position: absolute; }
#generate-slideout-menu.main-navigation .main-nav .top-level a:after { content: '>'; right: 20px; position: absolute; }

/* Fade in menu dropdowns: https://generate.support/topic/scaling-not-working/ */
.dropdown-hover nav.main-navigation ul ul:hover { display: block; visibility: visible; opacity: 0; left: initial; height: auto; pointer-events: auto; max-height: 0; transition: all 1.0s ease-in; }
.dropdown-hover nav.main-navigation ul ul:hover { opacity: 1; max-height: 1000px !important; overflow: visible !important;
}

/* Add gap between menu and submenu */
.dropdown-hover nav.main-navigation ul ul { margin-top: 0px; /* No gap as it causes UX issue. */ padding: 30px; border-radius: 12px; width: auto; white-space: nowrap; /* width/white-space - auto width of submenu */ }
@media (min-width: 769px) {
	/* Small triangle on top of submenu when open. */
	.dropdown-hover nav.main-navigation ul ul::after { bottom: 100%; left: 30%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none; border-width: 10px; margin-left: -10px; }
}

/* Set dropdown colour and triangle colour based on parent class. */
.dropdown-hover nav.main-navigation ul ul a { color: white; }
.dropdown-hover nav.main-navigation ul ul .sub-menu-title a { text-transform: uppercase; text-decoration: underline; }
.dropdown-hover nav.main-navigation ul .connected ul { background-color: var(--emerald); }
.dropdown-hover nav.main-navigation ul .rollout ul { background-color: var(--teal); }
.dropdown-hover nav.main-navigation ul .about ul { background-color: var(--logo-blue-green); }
.dropdown-hover nav.main-navigation ul .about ul::after { border-bottom-color: var(--logo-blue-green); }
.dropdown-hover nav.main-navigation ul .connected ul::after { border-bottom-color: var(--emerald); }
.dropdown-hover nav.main-navigation ul .rollout ul::after { border-bottom-color: var(--teal); }

#mobile-header { background-color: var(--default-bg); }

.site-header { background-color: var(--default-bg); }
.site-header .header-image, .site-logo .header-image { width: 128px; height: 131px; /* 111px height + 20px padding */ }


.kpi, .home .figures { text-align: center; }
/*.kpi,*/ .kpi h3, .home .figures, .home .figures h3 { color: var(--emerald); }
.home .kpi p, .home .figures p { color: var(--teal); }
.kpi h3 { font-size: 50px; line-height: 1; margin-bottom: 0; }
.page-the-national-broadband-plan .kpi h3 { color: var(--teal); font-size: 62px; letter-spacing: -1.5px; }
.page-our-story .kpi.wp-block-columns.is-layout-flex { gap: 0; }
body.page-the-national-broadband-plan .sub-content .kpi p { color: var(--teal); padding-left: 5%; padding-right: 5%; }
.kpi p, .figures p { font-size: 28px; margin-bottom: 1em; font-family: 'Graphik Light'; }
.figures h3 { font-size: 52px; /*margin-bottom: 0;*/ }

@media (min-width: 1200px) {
    .kpi h3 { font-size: 80px; }
}
@media (min-width: 769px) {
    .kpi h3 { font-size: 65px; }
	.kpi.kpi-reduced-size h3 { font-size: 50px; }
    .kpi .wp-block-column:not(:first-child) { margin-left: 1em; }
}
@media (max-width: 1200px) {
	/*body .kpi.is-layout-flex { display: grid; grid-template-columns: 1fr 1fr 1fr; }*/
	body .kpi.wp-block-columns.is-layout-flex { flex-wrap: wrap !important; }
    .kpi .wp-block-column { flex-basis: 28% !important; }
}
@media (max-width: 768px) {
	/*body .kpi.wp-block-columns.is-layout-flex { flex-wrap: wrap !important; }*/
	/*body .kpi.is-layout-flex { display: grid; grid-template-columns: 1fr 1fr; }*/
	/*.kpi .wp-block-column:last-child { grid-column-start: 1; grid-column-end: 3; }*/
    /*.kpi .wp-block-column { flex-basis: 50%!important; }*/
    .page-the-national-broadband-plan .kpi h3 { font-size: 25px; }
    .page-the-national-broadband-plan .kpi p { font-size: 16px; }
    .page-our-story .kpi p { font-size: 20px; }
}
/* TODO: Consider changing .kpi to grid on mobile. */
/*@media (max-width: 768px) {
    .wp-block-columns.kpi { display: grid; grid-template-columns: repeat(2, 1fr); }
    .kpi .wp-block-column:not(:first-child) { margin-left: 0; }
    .kpi .wp-block-column { text-align: center; }
    .kpi .wp-block-column:last-child { place-self: center self-end; }
}*/

.home-benefits { background-color: var(--emerald); }
.no-sidebar .entry-content .is-style-full-width.home-benefits .wp-block-group__inner-container { padding-bottom: 60px; }
.home .home-benefits h2, .home .home-benefits h3, .home .home-benefits p, .home-benefits .wp-block-buttons { color: var(--default-bg); text-align: left; }
.home .home-benefits h3 { letter-spacing: 0; }
.home .home-benefits h3, .home .home-benefits p, .home-benefits .wp-block-buttons { padding-left: 36px; padding-right: 36px; }
.home-benefits .wp-block-column { background-color: var(--teal); padding-bottom: 50px; }
.home-benefits .wp-block-buttons { justify-content: start; }
.home-benefits .wp-block-button .wp-block-button__link, .home-benefits .wp-block-button .wp-block-button__link:hover { background-color: var(--default-bg); border-radius: 0; color: var(--teal); }
@media (max-width: 768px) {
	.home-benefits .wp-block-image { display: none; }
	.home .home-benefits h3 { padding-top: 40px; }
	.home-benefits .wp-block-button { width: 100%; }
	.home-benefits .wp-block-button .wp-block-button__link { display: block; }
}

/*.wp-block-buttons { justify-content: center; }*/
.wp-block-button__link, .green1 { background-color: var(--emerald); border-radius: 50px; color: var(--default-bg); }
a.center, a.centre { display: inline-block; position: relative; left: 50%; transform: translateX(-50%); } /* Centre NBI button: https://stackoverflow.com/a/60553660/8605943 */

.grid-container, .hero .wp-block-group__inner-container, body.single-news .footer-widgets-container.grid-container { max-width: 1280px; }  /* Add 80px (padding left/right) to default 1200px so that inside is increased to 1200px. */

#before-header .grid-container { max-width: 1200px; }

@media (max-width: 768px) {
    .separate-containers .inside-article, .separate-containers .comments-area, .separate-containers .page-header, .separate-containers .paging-navigation { padding: 20px; }
}

.separate-containers .site-main { margin-bottom: 100px; }
.home.separate-containers .site-main { margin-top: 0; }
.article, .separate-containers .inside-article { padding-top: 0; padding-bottom: 0; }
#article .page-header { display: none; }

/* Page background. */
body.sub-page { background: linear-gradient(to bottom, var(--teal) 0%, var(--teal) 900px, var(--default-bg) 900px, var(--default-bg) 100%); }
/*body.sub-page.page-faqs { background: none; }*/
.search-map { background-color: var(--teal); color: var(--default-bg); border-radius: 0 0 12px 12px; }
.entry-content .search-map:first-child, .entry-content .search-map.search-map-top { border-radius: 12px 12px 0 0; padding-top: 55px; } /* First .search-map on page */
.home .entry-content .search-map.search-map-top { padding-left: 20px; padding-right: 20px; }
@media (min-width: 769px) {
	.search-map-icons { max-width: 80%; margin-left: auto; margin-right: auto; }
	.search-map-icons .wp-block-column { padding-left: 40px; padding-right: 40px; }
}
.entry-content .search-map.search-map-top h2 { margin-bottom: 0; }
body.sub-page h2, body.sub-page p, .search-map h2 { color: var(--default-bg); }
body.sub-page .query-box p { color: var(--body-text); }
body.sub-page h2 { margin-bottom: 15px; } /* Was 35px but 20px padding-top added to .nav-in-content */
/*body.sub-page.page-faqs h2 { color: var(--emerald); }*/
/*body.sub-page.page-faqs p,*/ body.sub-page.page-who-we-are p, body.sub-page p.default-colour { color: var(--body-text); }
body .sub-content p { color: var(--other-text); }
@media (max-width: 768px) {
    body.sub-page h2, .search-map h2 { font-size: 36px; line-height: 40px; }
	body.sub-page.page-faqs p { font-size: 12px; line-height: 16px; }
}
@media (min-width: 769px) {
    body .sub-content p.narrow, body .internal-content p.narrow { width: 75%; margin-left: auto; margin-right: auto; }
    body .sub-content .wp-block-column p { width: 100%; }
}


/* News Landing - instead of changing .scss/minified css */
@media (max-width: 768px) {
	.page-template-news-landing .news-landing .primary { margin-bottom: 0; }
	.page-template-news-landing .news-landing .featured .primary, .news-landing .featured .secondary { min-width: 100%; max-width: 100%; }
	.page-template-news-landing .news-landing .featured { padding-bottom: 0; }
	.page-template-news-landing .news-landing .primary h2, .page-template-news-landing .news-landing .secondary .post h2 { font-size: 22px; margin-bottom: 20px; margin-top: 20px; }
	.page-template-news-landing .news-landing .featured .date, .page-template-news-landing .news-landing .post .date { display: none; }
	.page-template-news-landing .news-landing .all-posts .post h2 { margin-top: 20px; }
	.page-template-news-landing .news-landing .all-posts .post:nth-child(6n+3), .news-landing .all-posts .post:nth-child(6n+4) { width: 100%; }
	.page-template-news-landing .news-landing .all-posts .post:nth-child(6n+3) figure a, .news-landing .all-posts .post:nth-child(6n+4) figure a { padding-bottom: 58%; }
	.page-template-news-landing .news-landing .load-more { background-color: var(--teal); color: var(--default-bg); border-radius: 0; }
}

/* News article */
.archive { background-color: var(--content-bg); }
.inside-article .cards { display: flex; flex-wrap: nowrap; padding-bottom: 47px; }
.large-card { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 10% 0%; flex: 1; background-position: center,center; background-size: cover; background-repeat: no-repeat; }
.large-card h2 { margin-bottom: .5em; text-align: center; }
.news-promo { background-color: var(--teal); padding: 10% 0%; }
.news-promo h2 { color: var(--default-bg); padding: 0 25px; }
.news-promo p { color: var(--default-bg); }
@media (max-width: 768px) {
    .inside-article .cards { padding-bottom: 320px; position: relative; /*flex-direction: column-reverse;*/ }
    .large-card { position: absolute; top: 0; padding: 10% 10%; width: 100%; height: 333px; }
    .large-card h2 { font-size: 22px; line-height: 28px; }
    .news-promo { background-color: rgba(20,61,67,.5); }
}

/* News article and News archive. */
.news-hero p { margin-bottom: 0; }
.inside-article .latest-news { background-color: rgba( var(--teal-rgb),0.08 ); padding-bottom: 47px; }
.latest-news .section-heading { text-align: center; margin-bottom: 43px; padding-top: 43px; }

/* InfoHub page */
@media (min-width: 769px) {
	.page-infohub .entry-header, .page-infohub .entry-content > p { padding-inline: 200px; }
}
.page-infohub .entry-content > p { font-size: 20px; margin-bottom: 1.5em; }
body .wp-block-group.is-layout-flex { align-items: flex-start; }
.single-article-summary { border: 1px solid var(--lime); border-radius: 12px; transition: all ease-in .3s; container: single-article-summary / inline-size; }
.single-article-summary.border-0 { border-width: 0; }
.single-article-summary.border-1, .articles-container .single-article-summary:nth-child(9n+1) { border-color: var(--teal); }
.single-article-summary.border-2, .articles-container .single-article-summary:nth-child(9n+2) { border-color: var(--emerald); }
.single-article-summary.border-3, .articles-container .single-article-summary:nth-child(9n+3) { border-color: var(--lime); }
.single-article-summary.border-4, .articles-container .single-article-summary:nth-child(9n+4) { border-color: var(--buttercup); }
.single-article-summary.border-5, .articles-container .single-article-summary:nth-child(9n+5) { border-color: var(--rust); }
.single-article-summary.border-6, .articles-container .single-article-summary:nth-child(9n+6) { border-color: var(--cherry); }
.single-article-summary.border-7, .articles-container .single-article-summary:nth-child(9n+7) { border-color: var(--sky); }
.single-article-summary.border-8, .articles-container .single-article-summary:nth-child(9n+8) { border-color: var(--heather); }
.single-article-summary.border-9, .articles-container .single-article-summary:nth-child(9n+9) { border-color: var(--charcoal); }
.single-article-summary.width-thirty { width: 30%; }
.single-article-summary.width-forty { width: 40%; }
.single-article-summary.width-fifty { width: 50%; }
.single-article-summary img { border-radius: 12px 12px 0 0; }
.single-article-summary .article-data { padding: 1.5em 1.5em 2em 2em; }
.home-articles .single-article-summary .article-data { padding-bottom: 20px; }
.home p { font-size: 20px; line-height: 28px; }
.home-articles .wp-block-column:first-child .single-article-summary .article-data { padding-bottom: 100px; }
.single-article-summary .article-meta { display: flex; flex-wrap:wrap; gap: 1em; margin-bottom: 1em; }
.single-article-summary .article-meta ul { margin: 0; }
.single-article-summary .post-date { color: var(--teal); }
/* Duplicate this @container in Appearance/Customize/Custom CSS as WP2Static seems to remove it during CSS mimification. */
.single-article-summary h2 { @container single-article-summary (max-width: 250px) { font-size: 33px; } }

.single-article-summary.hidden { opacity: 0; height: 0; overflow: hidden; transform: translateY(15px); padding: 0; }
.home .wp-block-column:first-child .single-article-summary { border-color: var(--lime); }
.home .wp-block-column:nth-child(2n+2) .single-article-summary { border-color: var(--cherry); }
.home .single-article-summary .wp-block-button .wp-block-button__link { border-radius: 0; }

.articles-container .load-more, #main .load-more { color: var(--default-bg); background-color: var(--teal); padding: 7px 61px; font-size: 16px; line-height: 36px; margin: 0 auto 74px; display: block; transition: all ease-in .3s; }
.articles-container .load-more:hover, #main .load-more:hover { background-color: var(--emerald); }
#page .load-more.hidden { display: none; }

.signpost { border-radius: 12px; margin-bottom: 2em; }
.page-map .signpost { container: signpost / inline-size; } /* Only need a @container query on eircode search page. */
.signpost:not(.no-padding) { padding: 1.5em; }
.signpost.no-padding :not(figure, img, strong, .wp-block-button) { padding-left: 24px; padding-right: 24px; }
@media (min-width: 769px) {
	.home .signpost { padding: 20px 80px 30px 50px; }
}
.signpost.icon { background-position: 93% 12%; background-repeat: no-repeat; }
.signpost.icon-top { background-position: 5% 5%; padding-top: 7%; }
@media (min-width: 769px) {
	.wp-block-column:first-child .signpost { background-position-x: 95%; /* Wide column needs higher % to have icon same distance from right. */ }
	.signpost.icon:not(.icon-top) h3 { padding-right: 40px; }
}
.signpost.icon-megaphone { background-image: url(media/megaphone.svg); }
.signpost.icon-faq { background-image: url(media/faq.svg); }
.signpost.icon-bcp { background-image: url(media/bcp.svg); }
.signpost.icon-cable { background-image: url(media/cable.svg); }
.signpost.icon-cable-white { background-image: url(media/cable-white.svg); }
.signpost.icon-video-meeting { background-image: url(media/video-meeting.svg); }
.signpost.icon-map-route { background-image: url(media/map-route.svg); }
.signpost.icon-search { background-image: url(media/search.svg); }
.signpost.icon-search-white { background-image: url(media/search-white.svg); }
.signpost.icon-conversation { background-image: url(media/conversation.svg); }
@media (max-width: 768px) {
	.signpost { background-image: none !important; }
}
.signpost.bg-teal { background-color: var(--teal); }
.signpost.bg-emerald { background-color: var(--emerald); }
.signpost.bg-lime { background-color: var(--lime); }
.signpost.bg-buttercup { background-color: var(--buttercup); }
.signpost.bg-rust { background-color: var(--rust); }
.signpost.bg-cherry { background-color: var(--cherry); }
.signpost.bg-sky { background-color: var(--sky); }
.signpost.bg-heather { background-color: var(--heather); }
.signpost.bg-charcoal { background-color: var(--charcoal); }

.signpost.border-emerald { border: 2px solid var(--emerald); }
.signpost.border-buttercup { border: 2px solid var(--buttercup); }
.signpost.border-rust { border: 2px solid var(--rust); }

.signpost, .signpost:not(.bg-white) h2:not(.has-text-color), .signpost:not(.bg-white) h3:not(.has-text-color), .signpost:not(.bg-white) p:not(.has-text-color), .signpost:not(.bg-white) a { color: var(--default-bg); }
.signpost.bg-white, .signpost.bg-white h3:not(.has-text-color), .signpost.bg-lime, .signpost.bg-lime h3:not(.has-text-color), .signpost.bg-lime a, .signpost.bg-buttercup, .signpost.bg-buttercup h3:not(.has-text-color), .signpost.bg-buttercup a { color: var(--body-text); }
.signpost ul { margin-left: 1em; }
.signpost .wp-block-button .wp-block-button__link { background-color: var(--default-bg); color: var(--teal); border-radius: 0; }
/* Duplicate this @container in Appearance/Customize/Custom CSS as WP2Static seems to remove it during CSS mimification. */
.signpost .wp-block-button .wp-block-button__link { @container signpost (min-width: 300px) { padding-left: 50px; } }
.signpost .wp-block-button .wp-block-button__link { @container signpost (min-width: 300px) { padding-right: 50px; } }
.signpost .wp-block-button .wp-block-button__link { @container signpost (min-width: 300px) { width: 300px; } }
.signpost.bg-white .wp-block-button .wp-block-button__link { background-color: var(--emerald); color: var(--default-bg); border-radius: 80px; }
.home .signpost h3 { letter-spacing: 4px; text-transform: uppercase; }
@media (max-width: 768px) {
	.home .signpost h3 { align-items: center; }
}
.signpost-faq { background-color: var(--emerald); }
.home .signpost-faq { padding: 25px 1.5em 10px 1.5em; }
.signpost-faq h3 { margin-bottom: 0; display: flex; line-height: 48px; }
.signpost-faq h3 img { margin-left: 20px; border: 1px solid var(--default-bg); border-radius: 50%; }

.has-body-text-color { color: var(--body-text); }
.has-heather-color { color: var(--heather); }
.has-charcoal-color { color var(--charcoal); }
.letter-spacing-4 { letter-spacing: 4px; }
.is-style-group-warning { border-radius: 21px; padding-left: 30px; padding-right: 30px; }
@media (max-width: 768px) {
	.is-style-group-warning { border: 1px solid var(--rust); }
	.is-style-group-warning * { color: var(--default-bg); }
}
@media (min-width: 769px) {
	.is-style-group-warning { background-color: var(--rust); }
	.page-contact-us .is-style-group-warning { padding-left: 100px; padding-right: 100px; margin-left: -100px; margin-right: -100px; max-width: 994px; }
	.is-style-group-warning * { color: var(--charcoal); }
}

/* Contact Us */
@media (min-width: 769px) {
	.contact-option { padding-left: 70px; padding-right: 70px; max-width: 996px; margin-left: auto !important; margin-right: auto !important; }
	.contact-option .wp-block-columns { gap: 100px; }
}

@media (max-width: 768px) {
	.page-contact-us .cols-with-borders .wp-block-column.border-emerald { border-width: 0; }
	.contact-details { display: flex; flex-direction: column; justify-content: center; background-color: var(--emerald); border-radius: 21px; padding: 40px 20px; }
	.contact-details.is-layout-flow > * { margin-block-start: 0; }
	body .sub-content .contact-details p, body .sub-content .contact-details a { color: var(--default-bg); font-size: 20px; line-height: 28px; }
	.contact-option h3 { color: var(--charcoal); font-size: 16px; line-height: 28px; letter-spacing: 3px; }
	.contact-option .wp-block-spacer { display: none; }
}

/* Spaced out column in /broadband-connection-points/. */
.flex-col-space-between { display: flex; flex-direction: column; justify-content: space-between; /*gap: 2em;*/ }
.flex-col-space-between .signpost { margin-bottom: 0; }

.articles-container { display: flex; flex-wrap: wrap; gap: 1em; }
@media (min-width: 769px) {
	.articles-container .single-article-summary { width: 32%; }
}

/* Connecting your premises slides */
.phase-trigger { float: left; clear: left; cursor: pointer; color: var(--teal); }
.phase-active { border-bottom: 1px solid var(--teal); }
.phases-slide .wp-block-column { text-align: center; }
p.phase-num { color: var(--teal); line-height: 28px; letter-spacing: 3px; text-transform: uppercase; display: inline-block; margin-bottom: 0; border-bottom: 1px solid var(--teal); }
.phases-slide.signpost { padding: 50px 30px 20px; margin-bottom: 0; margin-block-start: 0; }
.signpost.bg-white.phases-slide h3 { color: var(--teal); font-size: 28px; line-height: 40px; margin-block-start: 0; }
.phases-slide p:not(.phase-num) { font-size: 20px; line-height: 28px; }
@media (min-width: 769px) {
	.phases-slide { display: none; }
}
.phases-slide.phase-slide-active { display: block; animation-name: phases_animation; animation-duration: 1s; }  /* Short slide & fade in. */
@media (prefers-reduced-motion: no-preference) {
	@keyframes phases_animation {
	  0% {opacity: 0; transform: translateY(10px); }
	  100% {opacity: 1; transform: translateY(0); }
	}
}


/* InfoHub in editor */
.single-article-summary.is-admin { max-width: 25% }

/* Bottom align first column. */
.connection-type { max-width: 950px; margin-left: auto; margin-right: auto; }
.connection-type .wp-block-column:first-child { align-self: flex-end; }
.connection-type .wp-block-column:first-child .wp-block-image { margin-bottom: 0; }

/* Article CPT - single */
@media (min-width: 769px) {
	.single-article .post-content { display: flex; gap: 2em; }
	.article-meta { flex-basis: 215px; }
	.article-content { flex: 1; }
}
body.single-article.single-news .post-head, body.single-article.single-news .post-content { max-width: 1060px; }
body.single-news.single-article .post-head { padding-top: 30px; }
body.single-article.single-news .post-content p { font-size: 20px; }
.single-article .breadcrumbs a { color: var(--default-bg); }
body.single-news.single-article .post-head h1 { margin-bottom: 1em; }
body.single-news .post-content .article-meta p { font-size: 16px; }
.article-meta p span { color: var(--emerald); letter-spacing: 1px; }
.article-meta ul.post-categories { list-style: none; margin-left: 0; }
.article-meta .eoi { background-color: var(--emerald); border-radius: 15px; padding: 1em; position: sticky; top: 100px; margin-top: 2em; }
.article-meta .eoi h3 { color: var(--default-bg); font-size: 20px; letter-spacing: 0; }
.article-meta .eoi button { background-color: var(--default-bg); color: var(--emerald); border-radius: 15px; width: 100%; text-align: left; }
body.single-news .post-content .article-meta li, .single-article-summary .article-meta li { display: inline; font-size: 12px; line-height: 20px; }
.article-meta ul.post-categories a { border: 1px solid var(--buttercup); border-radius: 7px; color: var(--buttercup); padding: 4px 12px; }

.single-article .single-news-post .related-news h2 { font-size: 24px; line-height: 28px; letter-spacing: 4px; text-align: center; text-transform: uppercase; }
.related-news .link { border-radius: 15px; padding: 1em; width: 100%; }
.related-news .link h4 { font-size: 16px; line-height: 28px; letter-spacing: 3px; font-weight: 500; text-transform: uppercase; }
.related-news .link h3 { letter-spacing: 0; }

/* Home page additions */

.page-updates section, .category-updates section { display: flex; flex-direction: column; margin-bottom: 0; padding-bottom: 47px; position: relative; }
@media (max-width: 768px) {
    .z-slide-wrap { display: none; } /* Hide top side-by-side news item on mobile. */
}
@media (min-width: 769px) {
    .z-slide-item-2:first-child { display: none; }
}
ul.z-slide-content { list-style-type: none; margin: 0; }
.z-slide-content-2 { display: flex; justify-content: center; flex-wrap: wrap; margin: 0; padding: 0 10px; }
.z-slide-item-2 { display: flex; position: inherit; -webkit-transform: translate3d(0,0,0); transition: none !important; margin-right: 10px; margin-left: 10px; margin-top: 20px; box-shadow: 0 1px 4px 0 rgb(0 0 0 / 25%); }
.image-quote-container-2.news { background-color: var(--default-bg); min-height: 450px; border-radius: 4px; }
.image-quote-container .image-wrapper { padding-bottom: 56.2%; }
.image-quote-container-2 .image-wrapper { position: relative; padding-bottom: 56.2%; }
.image-quote-container-2.news .quote-card-2 { position: inherit; width: 300px; padding: 30px; overflow: hidden; text-overflow: ellipsis; bottom: 0; right: 0; }
.image-quote-container-2 .image-wrapper a img { position: absolute; object-fit: cover; width: 100%; height: 100%; }
.image-quote-container .image-wrapper a img { position: absolute; object-fit: cover; width: 780px; height: 586px; top: 0; background-color: var(--default-bg); }
.quote-card.news .news-date, .quote-card-2.news .news-date { font-size: 14px; margin-bottom: 12px; line-height: 1em; color: var(--logo-medium-green); }
.quote-card.news .button, .quote-card.news-2 .button { /*padding: 0;*/ }

/* News archive */
.z-slide-wrap { max-height: 635px; height: calc(50vw); min-height: 512px; }
.image-quote-container { max-width: 1260px; position: relative; display: flex; flex-direction: row; align-items: center; justify-content: flex-start; width: 100%; align-self: center; flex: 1; overflow: hidden; margin-left: auto; margin-right: auto; }
.image-quote-container.news { height: inherit; }
.image-quote-container .quote-card { display: flex; flex-direction: column; padding: 60px; width: 570px; position: absolute; right: 50px; background-color: var(--default-bg); box-shadow: 0 1px 4px 0 rgba(0, 118, 129, 0.25); border-radius: 4px; justify-content: flex-start; align-items: flex-start; }
.image-quote-container .quote-card.news { display: flex; flex-direction: column; padding: 60px; width: 570px; position: absolute; background-color: var(--default-bg); box-shadow: 0 1px 4px 0 rgb(0 118 129 / 25%); border-radius: 4px; justify-content: flex-start; align-items: flex-start; }
.quote-card.news .news-headline { font-size: 28px; /*font-weight: 500;*/ line-height: 1.15em; margin-bottom: 5px; }
.quote-card.news .news-leadin { color: #4f4f4f; font-size: 18px; line-height: 1.4em; margin-bottom: 1em; margin-bottom: 20px; overflow: hidden; }

/* Hero section. */
.hero { background-repeat: no-repeat; background-position: center center; background-size: cover; margin-top: 0; /*margin-bottom: 100px;*/ }
.home .hero { margin-bottom: 90px; }
body.home .hero .wp-block-buttons.is-layout-flex, .home .hero .wp-block-buttons > .wp-block-button { display: block; }
.home .hero .wp-block-button__link { width: 100%; padding-top: 20px; padding-bottom: 20px; }
@media (min-width: 769px) {
    /*.home .hero { background-attachment: fixed; background-position: center top; }*/ /* Simple parallax effect. */
	.home .hero .wp-block-button .wp-block-button__link { font-size: 20px; }
}
.hero .wp-block-group__inner-container { /*min-height: 30vw;*/ margin-left: auto; margin-right: auto; padding: 100px 40px; }
.has-ready-to-order-search .hero .wp-block-group__inner-container { padding: 100px 20px; }
.hero.full-bg .wp-block-group__inner-container { padding: 27px 15px; }
.hero.full-bg.no-top-gap .wp-block-group__inner-container { padding-top: 40px; }
@media (min-width: 769px) {
    body.home .hero .wp-block-group__inner-container, body.silo-section .hero .wp-block-group__inner-container { /*min-height: 83vh;*/ margin-left: auto; margin-right: auto; padding: 80px 40px; display: flex; flex-direction: column; justify-content: center;}
}
.page-about .hero .wp-block-group__inner-container { padding-top: 400px; } /* Very small hero block so add padding to reveal background image */
@media (max-width: 768px) {
	.hero .wp-block-group__inner-container { padding-left: 20px; padding-right: 20px; }
    .page-about .hero .wp-block-group__inner-container { padding-top: 100px; }
	.home .hero .wp-block-button .wp-block-button__link { font-size: 11px; }
}
/*.home .hero .wp-block-group__inner-container { padding-bottom: 20px; }*/
.hero .wp-block-column:not(.transparent-column) { background-color: var(--default-bg); padding: 30px; border-radius: 38px; }
.has-ready-to-order-search .hero .wp-block-column:not(.transparent-column) { padding: 30px 25px; }
.hero .wp-block-image { margin-bottom: 0; }
.hero .wp-block-image .alignleft, .hero .wp-block-image .alignright { margin-top: 0; margin-bottom: 0; }
.article-container .hero .wp-block-column figure img { padding-bottom: 0; }
.hero .wp-block-column.intro { background-color: var(--emerald); color: var(--default-bg); margin-right: 20%; box-shadow: 0 8px 8px rgb(0 0 0 / 45%)/*2px 3px 6px -1px rgba(0,0,0,0.75)*/; }
.has-bcp-search .hero .wp-block-column.intro { margin-bottom: 2em; }
.hero .wp-block-column.intro h2 { font-family: 'Graphik Light'; color: var(--default-bg); font-weight: normal; font-size: 32px; letter-spacing: -0.5px; line-height: 36px; margin-top: 0; margin-bottom: 0; text-align: left; }
.hero .wp-block-column.intro h3 { color: var(--default-bg); font-size: 20px; line-height: 28px; letter-spacing: 0; margin-top: 2em; margin-bottom: 2em; }
.hero .wp-block-column.intro .wp-block-button__link { background-color: var(--default-bg); border-radius: 0; color: var(--emerald); }
.hero p { font-size: 20px; line-height: 28px; margin-top: 20px; }
.page-what-is-fibre-broadband .hero .wp-block-column.intro p, .page-making-the-most-of-your-connection .hero .wp-block-column.intro p, .page-connecting-your-business .hero .wp-block-column.intro p, .page-install .hero .wp-block-column.intro p { font-size: 24px; line-height: 32px; margin-top: 20px; }
.page-what-is-fibre-broadband .hero .wp-block-column:not(.transparent-column), .page-making-the-most-of-your-connection .hero .wp-block-column:not(.transparent-column) { padding-top: 65px; padding-bottom: 65px; }
.hero p:last-child { margin-top: 0; margin-bottom: 0; }
@media (max-width: 768px) {
    .hero .wp-block-columns { margin-bottom: 0; }
	.home .hero { /*background-image: none;*/ background-size: cover; }
	.home .hero.full-bg .wp-block-group__inner-container { padding: 0; }
	.home .hero .wp-block-column:not(.transparent-column) { border-radius: 0; }
	.home .hero .wp-block-column.transparent-column { display: none; }
	.dl-times .wp-block-column.transparent-column { height: 200px; }

	.home h2#we-are-committed-to-connecting { font-size: 34px; }
	.page-what-is-fibre-broadband .hero .wp-block-column.intro p, .page-making-the-most-of-your-connection .hero .wp-block-column.intro p { font-size: 20px; line-height: 28px; }
}
@media (min-width: 769px) {
    .hero .wp-block-column.intro h2 { font-size: 40px; line-height: 44px; }
    .home .hero p { font-size: 20px; line-height: 28px; }
}

/* Two CTAs */
.columns-cta { margin-top: 75px; }
@media (max-width: 768px) {
	.columns-cta { margin: 75px 1em 0 1em; /*margin-left: calc(-100vw / 2 + 100% / 2); margin-right: calc(-100vw / 2 + 100% / 2); max-width: 100vw; width: auto;*/ } /* Make full width. */
}
@media (min-width: 769px) {
	.home .columns-cta { margin-top: 66px; }
}
body .columns-cta p, body.sub-page.page-faqs .columns-cta p { margin-bottom: 0; /*margin-left: 10px;*/ color: var(--teal); font-size: 24px; line-height: 32px; margin-block-start: 0; }
body.home .columns-cta, body.page-steps-to-getting-the-network-connected .columns-cta { background-color: var(--emerald); border-radius: 10px; margin-bottom: 70px; padding: 30px 20px; }
body.home .columns-cta p { color: var(--teal); flex-grow: 1; margin-bottom:0; margin-top: 0; font-size: 24px; line-height: 32px; }
.columns-cta .wp-block-column { background-color: var(--default-bg); border: 2px solid var(--lime); border-radius: 8px; /*box-shadow: 5px 5px 8px 0 rgba(0, 0, 0, .45);*/ display: flex; flex-wrap: nowrap; padding: 1em; align-items: center; justify-content: space-between; gap: 20px; } /* Maybe change box-shadow to: filter: drop-shadow(3px 6px 6px rgba(0, 0, 0, 25%) */
@media (max-width: 768px) {
    .columns-cta .wp-block-column { /*border-color: var(--emerald);*/ flex-direction: column; position: relative; margin-bottom: var(--cta-icon-offset); margin-bottom: calc( var(--cta-icon-offset) + 20px); padding-bottom: 2em; text-align: center; width: 100%; }
	body.home .columns-cta { border-radius: 0; margin-bottom: 0; }
	.home .columns-cta .wp-block-column { margin-bottom: 0; }
    .columns-cta p { margin-bottom: var(--cta-icon-offset); }
	body.home .columns-cta p { font-size: 20px; line-height: 28px; margin-bottom: 16px; }
    body:not(.home) .columns-cta .wp-block-column figure:last-child { position: absolute; bottom: calc( -1 * var(--cta-icon-offset) ); }
}
.columns-cta .wp-block-image { margin: 0 5px 0 0; flex: 0 0 60px; }  /* Margin was 0 10px 0 0; flex: 0 0 60px;*/
/*.columns-cta .wp-block-image { background-color: red; border-radius: 25px; }*/
/*.columns-cta .wp-block-image .alignright { margin-left: 0; }*/
.columns-cta .wp-block-image img { width: 50px; }
.columns-cta .wp-block-image.go-button { background: url(./media/circle.svg); flex-basis: 50px; background-repeat: no-repeat; background-size: contain; width: 50px; height: 50px; position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; }
.columns-cta .wp-block-image.go-button a { height: 50px; }
figure.go-button:hover img { animation: SlideOutRightSlideInLeft 0.7s linear 0s 1 normal forwards; }
@keyframes SlideOutRightSlideInLeft {
  0% { transform: translateX(0); }
  50% { transform: translateX(150%); }
  51% { transform: translateX(-150%); }
  100% { transform: translateX(0); }
}

.beside-search-map { border: 1px solid var(--emerald); border-radius: 12px; padding: 2em; }
.beside-search-map h3 { letter-spacing: 4px; text-transform: uppercase; }
.beside-search-map ul { margin-left: 1em !important; }
.beside-search-map .wp-block-button .wp-block-button__link { background-color: var(--lime); color: var(--teal); border-radius: 0; }

/* Making the most of your connection page */
.connection-tips .wp-block-column { background-color: var(--teal); padding-bottom: 40px; }
.connection-tips, .connection-tips h3, .connection-contacts, .connection-contacts h3, .inside-article .entry-content .connection-contacts p a { color: var(--default-bg); }
.connection-tips h3, .connection-contacts h3 { text-transform: uppercase; }
.inside-article .entry-content .connection-tips p { font-size: 20px; line-height: 28px; }
.connection-tips h3, .connection-tips p, .connection-contacts h3, .connection-contacts p { padding-left: 24px; padding-right: 24px; }
.connection-contacts .wp-block-column { background-color: var(--emerald); border-radius: 10px; padding: 40px 50px 80px 100px; }
.connection-contacts .wp-block-image { margin-bottom: 45px; }
.connection-contacts img { background-color: var(--default-bg); border-radius: 100%; padding: 30px; width: 160px; }
.connection-contacts ul { list-style-position: inside; }

@media (max-width: 768px) {
	.page-making-the-most-of-your-connection.separate-containers .inside-article { padding-left: 0; padding-right: 0; }
	.page-making-the-most-of-your-connection h2 { font-size: 36px; line-height: 40px; }
	.connection-tips h3, .connection-contacts h3 { font-size: 16px; }
	.inside-article .entry-content .connection-tips p { font-size: 16px; line-height: 20px; }
	.connection-tips h3, .connection-tips p, .connection-contacts h3, .connection-contacts p { padding-left: 12px; padding-right: 12px; }
	.connection-contacts img { padding: 16px; width: 100px; }
	.connection-contacts .wp-block-column { padding: 40px 30px 40px 40px; }
}

/* Tech docs CTAs */
@media (min-width: 769px) {
    .docs-download { width: 80%; margin: 0 auto; }
}
.docs-download .wp-block-column { background-color: var(--teal); display: flex; flex-wrap: nowrap; padding: 1em; align-items: center; justify-content: space-between; border-radius: 8px; margin-bottom: 30px; }
.docs-download .wp-block-column p { margin-bottom: 0; color: var(--default-bg); }
.docs-download a { color: var(--default-bg); font-weight: bold; }
.docs-download .wp-block-image { margin: 0; flex: 0 0 50px; }

.wp-block-column.intro p:last-child { font-size: 16px; line-height: 20px; }
.wp-block-column.intro a:not(.wp-block-button__link) { color: var(--default-bg); font-size: 80%; }
.wp-block-column.transparent-column { background-color: transparent; }

@media (max-width: 768px) {
    #main { margin-top: 0; }
    .hero { background-color: var(--teal); background-size: 200% 40%; background-position: top center; }
	.page-sustainability-at-nbi .hero { background-color: transparent; }
	.page-sustainability-at-nbi .hero .wp-block-group__inner-container { padding-bottom: 0; }
	.hero.full-bg { background-size: cover; }
    .has-bcp-search .hero { background-size: 200% 35%; /* Hero content v. long */ }
	@media (orientation: landscape) { .has-bcp-search .hero { background-size: 100% 30%; } } /* Different width when mobile in landscape. */
    .hero .wp-block-column.intro { margin-right: 0; flex-basis: 100% !important; }
	.hero:not(.no-top-gap) .wp-block-column.intro { margin-top: 150px; }

    .columns-cta { /*display: flex;*/ flex-direction: column; align-items: center; margin-bottom: 50px; }
}

/* Page content overlay .hero */
/*body:not(.home) .hero { margin-bottom: -100px; }*/
.internal-content { background-color: var(--default-bg); border-radius: 12px 12px 0 0; margin-top: -100px; padding-top: 40px; }
.internal-content .wp-block-group__inner-container > h2 { margin-bottom: 50px; color: var(--teal); } /* Was h2:first-child */
.internal-content .wp-block-group__inner-container > h2:first-child { color: var(--emerald); }
@media (max-width: 768px) {
    .internal-content { padding-left: 5px; padding-right: 5px; }
    .internal-content .wp-block-group__inner-container > h2 { font-size: 36px; line-height: 40px; }
}

.aligncenter.wp-block-embed-youtube { margin-bottom: 40px; }
.has-eircode-search .lyte-wrapper { border: 1px solid var(--buttercup); }
@media (min-width: 769px) {
    .aligncenter.wp-block-embed-youtube { padding-left: 100px; padding-right: 100px; }
}

/* Sub pages */
body.sub-page .sub-content { background-color: var(--teal-shade-4); padding: 20px; margin-left: auto; margin-right: auto; margin-bottom: 20px; }
body.sub-page.page-where-can-i-buy .sub-content, body.sub-page.page-faqs .sub-content, body.sub-page.page-where-are-we-working .sub-content, body.page-primary-schools-bcps .sub-content { background-color: var(--default-bg); }
body.sub-page.page-where-can-i-buy .sub-content { border-radius: 30px; }
body.page-primary-schools-bcps .sub-content { padding: 30px; }
@media (min-width: 769px) {
	body.sub-page.page-where-can-i-buy .sub-content { border: 1px solid var(--emerald); }
    body.sub-page .sub-content { max-width: 80%; padding: 60px 80px; }
    body.sub-page.page-where-are-we-working .sub-content { padding-bottom: 0; }
    body.sub-page.page-who-we-are .sub-content { padding: 60px 20px; }
	body.page-primary-schools-bcps .sub-content { padding: 60px; margin-bottom: 55px; max-width: 994px; margin-left: auto; margin-right: auto; }
	body.sub-page.page-faqs .sub-content { max-width: 994px; }
}
body.sub-page.page-faqs .sub-content, body.page-primary-schools-bcps .sub-content { border-radius: 30px; border: 2px solid var(--emerald); margin-bottom: 20px; }
body.sub-page.page-faqs .sub-content.emerald { border-color: var(--emerald); }
body.sub-page.page-faqs .sub-content.teal { border-color: var(--teal); }
body.sub-page.page-faqs .sub-content.rust { border-color: var(--rust); }
body.sub-page.page-faqs .sub-content.sky { border-color: var(--sky); }
body.sub-page.page-faqs .sub-content.buttercup { border-color: var(--buttercup); }
body.sub-page .sub-content h2 { color: var(--teal); margin-bottom: 40px; }
body.page-faqs.sub-page .sub-content h2 { font-size: 24px; line-height: 28px; }
@media (max-width: 768px) {
	body.page-faqs.sub-page .sub-content h2 { font-size: 24px; }
	.page-primary-schools-bcps .sub-content .wp-block-group__inner-container h2:first-child { font-size: 20px; margin-bottom: 20px; }
}

details.nbi_faq { border-bottom: 1px solid var(--emerald); }
body.sub-page .nbi_faq p { color: var(--body-text); }
body.sub-page .sub-content .nbi_faq p { color: var(--default-bg); }
.sub-content .nbi_faq .panel, .sub-content .nbi_faq :not(summary) { padding: 1em 1em 0 1em; }
.sub-content.emerald .nbi_faq .panel, .sub-content.emerald .nbi_faq { background-color: var(--emerald); color: white; }
.sub-content.teal .nbi_faq .panel, .sub-content.teal .nbi_faq { background-color: var(--teal); }
.sub-content.rust .nbi_faq .panel, .sub-content.rust .nbi_faq { background-color: var(--rust); }
.sub-content.sky .nbi_faq .panel, .sub-content.sky .nbi_faq { background-color: var(--sky); }
.sub-content.buttercup .nbi_faq .panel, .sub-content.buttercup .nbi_faq  { background-color: var(--buttercup); }

.sub-content.emerald .nbi_faq .panel, .sub-content .nbi_faq summary { background-color: var(--default-bg); color: var(--body-text); }
.sub-content.emerald .nbi_faq .panel *, .sub-content .nbi_faq p { color: white; margin-bottom: 1.5em; }
.sub-content .nbi_faq a { color: var(--default-bg); padding: 0; text-decoration: underline; }
.sub-content details.nbi_faq[open]::after { content: ''; background-color: var(--default-bg); display: block; height: 1.5em; }


.sub-content .wp-block-group__inner-container h2:first-child { margin-bottom: 60px; }
.page-primary-schools-bcps .sub-content .wp-block-group__inner-container h2:first-child { font-size: 24px; line-height: 28px; letter-spacing: 4px; color: var(--teal); margin-bottom: 20px; }
.page-where-can-i-buy .sub-content .wp-block-group__inner-container h2:first-child { margin-bottom: 20px; }
.wp-block-columns.icon-and-text .wp-block-column:first-child { flex-basis: 15%; }
.wp-block-columns.icon-and-text .wp-block-column:last-child { flex-basis: 85%; }
@media (max-width: 768px) {
    .wp-block-columns.icon-and-text figure { text-align: center; }
}
.vert-align-col { align-self: center; } /* Vertically align one column cell. */

.cols-with-borders > .wp-block-column { border-width: 1px; border-style: solid; border-radius: 12px; }
.cols-with-borders .wp-block-column figure img { border-radius: 12px 12px 0 0; }  /* Tried ".wp-block-column + figure img" but it did not work. */
.cols-with-borders.no-border > .wp-block-column, .cols-with-borders > .wp-block-column.no-border { border-width: 0; }
.cols-with-borders > .wp-block-column.border-width-2 { border-width: 2px; }
.cols-with-borders .wp-block-column.border-emerald { border-color: var(--emerald); }
.cols-with-borders .wp-block-column.border-teal { border-color: var(--teal); }
.cols-with-borders .wp-block-column.border-buttercup { border-color: var(--buttercup); }
.cols-with-borders .wp-block-column.border-rust { border-color: var(--rust); }
.cols-with-borders .wp-block-column > :not(.signpost.no-padding, figure, .single-article-summary) { padding-left: 20px; padding-right: 20px; }
.cols-with-borders .wp-block-column > a { margin-left: 20px; margin-right: 20px; }
.wp-block-column.bg-emerald { background-color: var(--emerald); }
.wp-block-column.bg-emerald > *, .wp-block-column.bg-sky > * { color: var(--default-bg); }
.wp-block-column.bg-sky { background-color: var(--sky); }
.wp-block-column.bg-buttercup { background-color: var(--buttercup); }

.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column.width30 { flex-basis: 30%; }
.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column.width40 { flex-basis: 40%; }
.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column.width40 img { height: 163px; object-fit: cover; } /* Same height as images in 30% cols. */

@media (min-width: 769px) {
	.width80 { max-width: 80%; margin-left: auto; margin-right: auto; }
	.width60 { max-width: 60%; margin-left: auto; margin-right: auto; }
}

.after-sub-content { padding-top: 120px; padding-bottom: 80px; }
body.sub-page .after-sub-content h2 { color: var(--teal); }
@media (min-width: 769px) {
    .after-sub-content { max-width: 60%; margin-left: auto; margin-right: auto; }
}
.has-eircode-search .after-sub-content, .has-ready-to-order-search .after-sub-content { padding-top: 50px; }

/* Submenu when not on subpage. */
body:not(.sub-page) .submenu-ext { border-color: var(--teal); }
body:not(.sub-page) .submenu-ext > li, body:not(.sub-page, .page-updates, .single-news) .submenu-ext > li > a { color: var(--teal); }
body:not(.sub-page) .submenu-ext > li > a:hover { text-decoration: underline; }
body:not(.sub-page) .submenu-ext > li.current-menu-item a { color: var(--default-bg); background-color: var(--teal); }
body:not(.sub-page) .submenu-ext > li a:hover::after { opacity: 1; }

/* FAQ */
.page-where-are-we-working .faq { max-width: 710px; margin-left: auto; margin-right: auto; }
.faq .wp-block-group__inner-container { margin-bottom: 40px; }
.faq .wp-block-group__inner-container details.nbi_faq:first-child { border-top: 1px solid var(--emerald); }

.sub-content.teal .faq .wp-block-group__inner-container details.nbi_faq:first-child { border-color: var(--teal); }
.sub-content.rust .faq .wp-block-group__inner-container details.nbi_faq:first-child { border-color: var(--rust); }
.sub-content.sky .faq .wp-block-group__inner-container details.nbi_faq:first-child { border-color: var(--sky); }
.sub-content.buttercup .faq .wp-block-group__inner-container details.nbi_faq:first-child { border-color: var(--buttercup); }
.sub-content.teal details.nbi_faq { border-color: var(--teal); }
.sub-content.rust details.nbi_faq { border-color: var(--rust); }
.sub-content.sky details.nbi_faq { border-color: var(--sky); }
.sub-content.buttercup details.nbi_faq { border-color: var(--buttercup); }

/* Styling from: https://codepen.io/frederickallen/pen/NZMEMw */
details.nbi_faq > summary::-webkit-details-marker { display: none; }

details.nbi_faq summary { cursor: pointer; list-style-type: none; position: relative; font-size: 20px; line-height: 28px; padding: 25px 20px 25px 0; font-weight: 300; font-family: 'Graphik Light', sans-serif; }
@media (max-width: 768px) {
	details.nbi_faq summary { font-size: 16px; line-height: 20px; }
}
details.nbi_faq > summary:after { content: '\002B'; color: var(--teal); margin-right: 0; position: absolute; right: 0; line-height: 0; margin-top: 0.75rem; transform-origin: center; transition: 200ms linear; }
details.nbi_faq[open] > summary:after { content: "\2212"; }

details.nbi_faq[open] summary ~ * { animation: sweep .5s ease-in-out; }
@keyframes sweep {
  0%    {opacity: 0; margin-top: -10px}
  100%  {opacity: 1; margin-top: 0px}
}
details.nbi_faq.hash-selected[open] { background: var(--lime); } /* When opened via url anchor/target. */


.aligncenter.wp-block-embed-youtube { padding-left: 0; padding-right: 0; }

/* Menu within content. */
/* Border between items from: https://stackoverflow.com/a/42160101/8605943 */
.nav-in-content { display: flex; justify-content: center; }
.nav-menu-in-content { display: flex; justify-content: space-between; align-items: center; margin: 0; border: 2px solid var(--default-bg); }
@media (max-width: 768px) {
    .inverted .nav-menu-in-content { border-radius: 12px; border: 1px solid var(--default-bg); color: var(--teal)}
    .nav-in-content select { width: 100%; }
    .nav-menu-in-content { flex-wrap: wrap; }
    .nav-menu-in-content li { width: 100%; border: 1px solid var(--teal); border-radius: 34px; margin-bottom: 18px; }
    .nav-menu-in-content { margin-bottom: 26px; }
}
.nav-menu-in-content li { display: inline; flex: 1 1 auto; position: relative; text-align: center; }
.nav-menu-in-content li.current-menu-item { /*background-color: var(--teal); border-radius: 70px;(/ }
.nav-in-content.inverted .nav-menu-in-content li.current-menu-item { /*background-color: var(--default-bg);*/ } /* May need to add border ::before current-menu-item as border-radius clears it. */
.nav-menu-in-content .menu-item + .menu-item { border-left: 1px solid #309ba5; }
.nav-menu-in-content a { display: inline-block; line-height: 1.3; padding: 15px 25px; }
@media (min-width: 769px) {
    .nav-in-content { margin-bottom: 40px; }
    .nav-in-content.has-border { margin-left: -30px; margin-right:-30px}
    .nav-in-content.has-border .nav-menu-in-content {
      border:2px solid #309ba5; border-radius: 71px;
      padding:0 20px;
    width: 100%;}
    .nav-in-content.has-border .nav-menu-in-content .menu-item {  min-height:100%; display:inline-block;height: 100%;}
    .nav-in-content.has-border .nav-menu-in-content .menu-item a { padding: 10px 40px}
    .nav-in-content.has-border .nav-menu-in-content .menu-item div {  min-height:100%; display:flex; align-items:center}
    .nav-in-content.inverted { position: sticky; top: 60px; z-index: 10; }
    .inverted .nav-menu-in-content { background-color: var(--teal); }
    /*.nav-in-content .menu-item { border-left: 1px solid #309ba5; }*/
    /*.nav-in-content .menu-item div { border-left: 1px solid #309ba5; }*/
    /*.nav-in-content.inverted .menu-item { border-left: 1px solid var(--default-bg); height: 100%; }*/
    .nav-in-content .menu-item:first-child div { border-left: 0; }
    .nav-menu-in-content a { padding: 11px 30px; }
    .inverted li.one-line a { line-height: 2.6; } /* Some items are only 1 line so change line-height to vertically match other items. */

    /* Change menu to be full screen width when .alignfull class added. */
	.nav-in-content.inverted { background-color: var(--teal); padding-bottom: 20px; padding-top: 20px; }
	.nav-in-content.inverted.alignfull { margin-left: calc(-100vw / 2 + 100% / 2); margin-right: calc(-100vw / 2 + 100% / 2); max-width: 100vw; width: auto; }
}
/*.nav-in-content.inverted .nav-menu-in-content .menu-item + .menu-item { border-left: 1px solid var(--default-bg); }*/

/*.nav-menu-in-content li:first-child { text-align: left; }
.nav-menu-in-content li:last-child { text-align: right; }*/
.nav-menu-in-content a, .nav-menu-in-content a:hover { color: var(--teal); }
.nav-menu-in-content li.current-menu-item a, .nav-menu-in-content li.current-menu-item a:hover { color: var(--default-bg); }
/*.nav-in-content.inverted .nav-menu-in-content a { margin-left: 10px; margin-right: 10px; height: 100%; }*/
.nav-in-content.inverted .nav-menu-in-content li:first-child a { margin-left: 0; }
.nav-in-content.inverted .nav-menu-in-content li:last-child a { margin-right: 0; }
.nav-in-content.inverted .nav-menu-in-content a, .nav-in-content.inverted .nav-menu-in-content a:hover { color: var(--default-bg); }
/*.nav-in-content.inverted .nav-menu-in-content :not(.current-menu-item) div { margin-top: 5px; margin-bottom: 5px; }*/
.nav-in-content.inverted .nav-menu-in-content li.current-menu-item a, .nav-in-content.inverted .nav-menu-in-content li.current-menu-item a:hover { color: var(--teal); background-color: var(--default-bg); }

/* Map (Search your eircode) */
.home .address-search-container { margin-block-start: 0; }
.has-eircode-search .address-search-container, .has-ready-to-order-search .address-search-container,
.page-install .address-search-container { background-color: var(--teal); }
@media (max-width: 768px) {
    .has-ready-to-order-search .address-search-container, .has-eircode-search .address-search-container {
        padding-left:10px;
        padding-right:10px;
    }
}
.has-ready-to-order-search .address-search-container { border-radius: 0 0 12px 12px; padding-bottom: 30px; }
.page-bcp-map .address-search-container, .has-bcp-search .address-search-container { margin-bottom: 75px; border-radius: 0 0 12px 12px; background-color: var(--teal); }
.search-map .wp-block-column { text-align: center; }
.search-map .wp-block-columns { padding-top: 2em; margin-bottom: 0; }
.search-map p { padding-bottom: 1.5em; margin-bottom: 0; }
.has-eircode-search p.sub-text, .page-bcp-map p.sub-text, .has-bcp-search p.sub-text,
.has-ready-to-order-search p.sub-text, .page-install p.sub-text { padding: 1em; margin-bottom: 0; text-align: center; color: var(--lime); }
.has-ready-to-order-search p.sub-text, .has-ready-to-order-search p.sub-text a { color: var(--default-bg); }

.has-eircode-search p.sub-text a, .page-bcp-map p.sub-text a { color: var(--lime); text-decoration: underline; }
.has-eircode-search p.sub-text, .has-eircode-search p.sub-text a, .has-bcp-search p.sub-text, .has-bcp-search p.sub-text a,
.page-install p.sub-text { color: var(--default-bg); }
@media (min-width: 769px) {
	.has-eircode-search p.sub-text { padding-top: 3em; padding-bottom: 3em; }
	.page-home.has-eircode-search p.sub-text { padding-top: 1.2em; padding-bottom: 1.2em; }
}
@media (max-width: 768px) {
	.has-bcp-search p.sub-text, .has-eircode-search p.sub-text { font-size: 12px; padding-left: 0; padding-right: 0; }
	.has-eircode-search p.sub-text, .has-eircode-search p.sub-text a, .has-bcp-search p.sub-text, .has-bcp-search p.sub-text a { color: var(--lime); }
    .search-map { padding-left: 15px; padding-right: 15px; }
    .has-eircode-search p.sub-text a, .page-bcp-map p.sub-text a, .has-bcp-search p.sub-text a, .has-ready-to-order-search p.sub-text a { font-size: 12px; line-height: 2; }

	.has-bcp-search .entry-content .search-map.search-map-top { border-radius: 0; }
	.has-bcp-search .address-search-container { margin-bottom: 0; border-radius: 0; }
	.has-bcp-search .search-map-top, .has-bcp-search .address-search-container, .has-bcp-search .map-page-container { border-radius: 0; margin-left: calc(-100vw / 2 + 100% / 2); margin-right: calc(-100vw / 2 + 100% / 2); max-width: 100vw; width: auto; } /* Make full width */
}

/* Order page */
.page-order.separate-containers .site-main { margin-bottom: 0; }
.has-ready-to-order-search .hero .wp-block-column.intro .wp-block-button__link { border-radius: 8px; }
.copy-text-group { max-width: 750px; margin: 50px auto 0; }
@media (max-width: 768px) {
	.hero + .copy-text-group { margin-top: -90px; background-color: var(--default-bg); border-radius: 12px 12px 0 0; padding: 20px; }
	.copy-text-group { padding-left: 25px; padding-right: 25px; }
	.has-ready-to-order-search h2 { font-size: 36px; line-height: 40px; }
}
.copy-text-group p { font-size: 20px; line-height: 28px; }
.article-links .wp-block-image img { border-radius: 12px 12px 0 0; width: 100%; height: 165px; object-fit: cover; }
.article-links h2, .article-links p { padding-left: 20px; padding-right: 20px; }
.article-links .wp-block-buttons { margin-bottom: 1em; }
.article-links .wp-block-column { border-radius: 12px; border: 1px solid var(--rust); }
.article-links .wp-block-column:nth-child(2) { border-color: var(--buttercup); }
.article-links .wp-block-column:nth-child(3) { border-color: var(--sky); }
.has-ready-to-order-search .search-map h2 { font-size: 40px; line-height: 44px; }
.has-ready-to-order-search #search-icon { border-right-color: var(--emerald); }
@media (min-width: 769px) {
	.has-ready-to-order-search .search-map .wp-block-columns { padding-left: 50px; padding-right: 50px; }
	.has-ready-to-order-search .search-map .wp-block-columns .wp-block-column { padding-left: 60px; padding-right: 60px; }
}
.has-ready-to-order-search .related-news { max-width: 1294px; margin: 0 auto; padding: 61px 32px 0 32px; color: var(--default-bg); padding-bottom: 80px; }
.has-ready-to-order-search .related-news h2 { color: var(--default-bg); font-size: 24px; line-height: 28px; letter-spacing: 4px; text-align: center; text-transform: uppercase; }
.has-ready-to-order-search .related-news h2, .has-ready-to-order-search .related-news a, .has-ready-to-order-search .related-news h3 { color: var(--default-bg); }
.has-ready-to-order-search .testimonials h3 { text-transform: uppercase; letter-spacing: 4px; }
.has-ready-to-order-search .testimonials blockquote, .has-ready-to-order-search .testimonials cite { color: var(--teal); border-left-width: 0; font-size: 20px; line-height: 28px; font-style: normal; padding: 0; }
.has-ready-to-order-search .signpost p, .has-ready-to-order-search .signpost li { font-size: 20px; line-height: 28px; }
.home.has-ready-to-order-search .signpost p { font-size: 16px; line-height: 20px; }

/* NBI FAQ/accordion block */
.accordion { border-bottom: 1px solid var(--teal-shade-3); background-color: transparent; cursor: pointer; width: 100%; text-align: left; outline: none; /*font-size: 22px;*/ color: var(--charcoal); /*height: 80px;*/ font-family: 'Graphik Light'; transition: 0.4s; border-radius: 0; text-transform: capitalize; padding-right: 20px; padding-left: 0; padding-bottom: 20px; position: relative; }
i.arrow { border: solid rgba(0, 0, 0, 0.1); border-width: 0 1px 1px 0; padding: 6px; background-color: var(--default-bg); transform: rotate(-135deg); position: absolute; display: none; top: -7px; }
.accordion i{ position: absolute; height: 10px; width: 10px; border: solid var(--teal); padding: 0; display: inherit; top: 25px; right: 2px; border-width: 0 3px 3px 0; transform: rotate(-135deg); background-color: transparent; }
.accordion.active i{ transform: rotate(-315deg); }
i.arrow.up { transform: rotate(-135deg); }
i.arrow.left { transform: rotate(-225deg); }
i.arrow.right { transform: rotate(-45deg); }
/*.panel { padding: 18px; background-color: transparent; max-height: 20px; overflow: hidden; transition: max-height 0.2s ease-out; }*/
/*.panel p, .panel ul { padding: 16px 0; margin-left: 0; font-size: 18px; line-height: 26px; font-family: 'graphik regular'; color: #585B5B; }*/
@media (min-width: 769px) {
    .accordion { font-size: 22px; }
}

/* RSP logos. */
/* From: https://medium.com/allenhwkim/how-to-build-tabs-only-with-css-844718d7de2f */
#rsps_tabs { text-align: center; }
#rsps_tabs input { display: none; }                /* hide radio buttons */
#rsps_tabs input + label { display: inline-block } /* show labels in line */
#rsps_tabs input ~ .tab { display: none }          /* hide contents */
/* Show contents only for selected tab */
#residential:checked ~ .tab.residential_content,
#business:checked ~ .tab.business_content { display: block; }
#farm:checked ~ .tab.farm_content { display: block; }

#rsps_tabs .rsp-info { text-align: left; }

input + label { padding: 12px; position: relative; top: 1px; font-size: 20px; line-height: 28px; background-color: var(--default-bg); border: 7px solid var(--default-bg); color: var(--emerald); }
input:checked + label { background-color: var(--emerald); opacity: 1; color: var(--default-bg); }
input ~ .tab { padding-top: 2em; }
@media (max-width: 768px) {
	#rsps_tabs input + label { width: 100%; }
}
@media (min-width: 769px) {
    input ~ .tab { padding: 3em 0 2em 0; }
}
.page-where-can-i-buy h5, #rsps_tabs h5 { color: var(--emerald); font-size: 16px; line-height: 28px; letter-spacing: 3px; text-align: left; }

/* Tabs block */
.tabs_container { margin-top: 2em; text-align: right; }
.tabs_container input { display: none; }  /* hide radio buttons */
.tabs_container input ~ .tab_content { display: none } /* hide contents */
.tabs_container label { display: inline-block } /* show labels in line */
.tabs_container label { padding: 12px 50px; position: relative; top: 2px; font-size: 20px; line-height: 28px; background-color: var(--default-bg); color: var(--emerald); border: 0; }
.tabs_container label:hover { cursor: pointer; }
.tabs_container label:first-of-type { border-radius: 20px 0 0 0; } /* Top left of first tab. */
/*.tabs_container label:nth-of-type(3n) { border-radius: 0 20px 0 0; }*/ /* Top right of last tab. */

.tabs_container label:nth-of-type(3n+1) { background-color: var(--buttercup); color: var(--default-bg); border: 2px solid var(--buttercup); border-bottom-width: 0; }
.tabs_container label:nth-of-type(3n+2) { background-color: var(--emerald); color: var(--default-bg); }
.tabs_container label:nth-of-type(3n) { background-color: var(--lime); color: var(--teal); }
.tabs_container input:checked + label { background-color: var(--default-bg); opacity: 1; color: #000; border-top: 2px solid var(--emerald); }
.tabs_container input:checked + label:nth-of-type(3n+1), .tabs_container input:checked + label:nth-of-type(3n) { border-color: var(--emerald); }
.tabs_container input:checked + label:nth-of-type(3n) { border-right: 2px solid var(--emerald); }

.tab_content { border: 2px solid var(--emerald); border-radius: 20px 0 20px 20px; background-color: var(--default-bg); margin-bottom: 5em; padding: 50px; text-align: left; }
.tab_content blockquote { border-left: none; color: var(--teal); font-size: 40px; line-height: 44px; font-style: normal; }
.tab_content blockquote + p { color: var(--teal); font-size: 24px; line-height: 32px; text-align: right; }
@media (max-width: 768px) {
	.tabs-wrapper { margin-left: calc(-50vw + 50%); margin-right: calc(-50vw + 50%); max-width: 100vw; width: auto; background: linear-gradient(to bottom, var(--teal) 0%, var(--teal) 85%, var(--default-bg) 85%, var(--default-bg) 100%); padding: 1em; } /* Full width on mobile */
	.tabs-wrapper .mobile_tabs { border-radius: 20px 20px 0 0; }
	.tabs-wrapper .tab_content { border-radius: 0 0 20px 20px; }
	.tab_content { border-width: 1px; }
	.tab_content blockquote { font-size: 28px; }
	.after-tabs-wrapper { margin-top: -100px; }
}

/* RSPs (Who can I buy from & Order Now pages). */
.rsps { display: grid; grid-template-columns: repeat(4,1fr); gap: 1em; margin-bottom: 35px; }
.rsp-card { display: flex; flex-wrap: nowrap; flex-direction: column; align-items: center; justify-content: center; background-color: var(--default-bg); border: 2px solid var(--emerald); }
.rsp-info { display: flex; padding-top: 12px; padding-bottom: 12px; word-wrap: initial;}
.rsp-logo { flex-shrink: 0; margin-right: 5px; }
.rsp-details { display: flex; flex-direction: column; justify-content: center; }
.offers { width: 100%; text-align: center; background-color: var(--emerald); padding: 5px; }
.offers a { color: var(--default-bg); text-decoration: none; }
body .sub-content .rsp-details p { font-size: 18px; line-height: 28px; margin-bottom: 10px; }
body .sub-content .rsp-details p, .rsp-details a { color: var(--emerald); }
.rsp-contact { color: var(--emerald); font-size: 12px; line-height: 25px; }
.rsp-contact div { display: inline-block; }
.rsp-contact div.phone { border-right: 1px solid var(--emerald); padding-right: 5px; margin-right: 5px; }

@media only screen and (max-width: 1229px) {
	.rsps { grid-template-columns: repeat( 3, 1fr ); }
}
@media only screen and (max-width: 768px) {
/*.rsps { grid-template-columns: 1fr; }*/
/*.rsp-card { flex-direction: column; padding-left: 10px; padding-right: 10px; }*/
.rsp-info { padding: 0; /*padding-bottom: 10px;*/ }
.rsp-logo { margin-right: 0; }
.rsp-logo img { width: 80px; }
.offers { padding-left: 0; padding-right: 0; }
.rsp-contact-icons { display: block; padding: 0 0 20px 0; }
.rsp-contact-icons a { display: block; color: var(--default-bg); padding: 13px; text-align: center; width: 100%; }
.rsp-contact-icons a.rsp-web { background-color: var(--emerald); margin-bottom: 12px; }
.rsp-contact-icons a.rsp-phone { background-color: var(--teal); }
}
@media only screen and (min-width: 769px) {
.rsp-contact-icons { color: var(--teal); display: flex; flex-wrap: nowrap; align-items: center; padding-left: 18px; padding-right: 18px; }
/*.rsp-contact-icons .hide-on-mobile { height: 37px; line-height: 37px; }*/
.rsp-contact-icons a { display: inline-block; height: 37px; width: 30px; }
.rsp-contact-icons a.rsp-phone { /* SVG as background image: https://stackoverflow.com/a/10768631 */
	background: left center no-repeat url("data:image/svg+xml;utf8,<svg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M14.38 7.79L12.18 5.59C11.9 5.31 11.82 4.92 11.93 4.57C12.3 3.45 12.5 2.25 12.5 1C12.5 0.45 12.95 0 13.5 0H17C17.55 0 18 0.45 18 1C18 10.39 10.39 18 1 18C0.45 18 0 17.55 0 17V13.51C0 12.96 0.45 12.51 1 12.51C2.24 12.51 3.45 12.31 4.57 11.94C4.92 11.82 5.32 11.91 5.59 12.18L7.79 14.38C10.62 12.93 12.94 10.62 14.38 7.79Z' fill='%23007681'/></svg>");
	border-right: 2px solid var(--teal);
}
.rsp-contact-icons a.rsp-web { /* SVG as background image: https://stackoverflow.com/a/10768631 */
	background: right center no-repeat url("data:image/svg+xml;utf8,<svg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M2.66668 12.5C2.66668 7.17129 6.85501 2.83338 12 2.83338C17.145 2.83338 21.3333 7.17129 21.3333 12.5C21.3333 17.8288 17.145 22.1667 12 22.1667C6.85501 22.1667 2.66668 17.8288 2.66668 12.5ZM0.333343 12.5C0.333343 19.17 5.56001 24.5834 12 24.5834C18.44 24.5834 23.6667 19.17 23.6667 12.5C23.6667 5.83004 18.44 0.416709 12 0.416709C5.56001 0.41671 0.333343 5.83004 0.333343 12.5ZM12 11.2917L7.33334 11.2917L7.33334 13.7084L12 13.7084L12 17.3334L16.6667 12.5L12 7.66671L12 11.2917Z' fill='%23007681'/></svg>");
}
.rsp-contact-icons:hover { background-color: var(--teal); }
.rsp-contact-icons:hover a.rsp-phone { /* SVG as background image: https://stackoverflow.com/a/10768631 */
	background: left center no-repeat url("data:image/svg+xml;utf8,<svg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M14.38 7.79L12.18 5.59C11.9 5.31 11.82 4.92 11.93 4.57C12.3 3.45 12.5 2.25 12.5 1C12.5 0.45 12.95 0 13.5 0H17C17.55 0 18 0.45 18 1C18 10.39 10.39 18 1 18C0.45 18 0 17.55 0 17V13.51C0 12.96 0.45 12.51 1 12.51C2.24 12.51 3.45 12.31 4.57 11.94C4.92 11.82 5.32 11.91 5.59 12.18L7.79 14.38C10.62 12.93 12.94 10.62 14.38 7.79Z' fill='white'/></svg>");
	border-right: 2px solid var(--default-bg);
}
.rsp-contact-icons:hover a.rsp-web { /* SVG as background image: https://stackoverflow.com/a/10768631 */
	background: right center no-repeat url("data:image/svg+xml;utf8,<svg width='24' height='25' viewBox='0 0 24 25' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M2.66671 12.5C2.66671 7.17129 6.85504 2.83338 12 2.83338C17.145 2.83338 21.3334 7.17129 21.3334 12.5C21.3334 17.8288 17.145 22.1667 12 22.1667C6.85504 22.1667 2.66671 17.8288 2.66671 12.5ZM0.333373 12.5C0.333374 19.17 5.56004 24.5834 12 24.5834C18.44 24.5834 23.6667 19.17 23.6667 12.5C23.6667 5.83004 18.44 0.416709 12 0.416709C5.56004 0.41671 0.333373 5.83004 0.333373 12.5ZM12 11.2917L7.33337 11.2917L7.33337 13.7084L12 13.7084L12 17.3334L16.6667 12.5L12 7.66671L12 11.2917Z' fill='white'/></svg>");
}
}

/* OLT table on Political Representatives page. */
.oltDetails { border-collapse: collapse; border-left: 1px solid #999; }
.oltDetails, .oltDetails th { border-bottom: 1px solid #999; }
.oltDetails th { font-weight: bold; }
.oltDetails td, .oltDetails th { border-right: 1px solid #999; padding: 5px 10px; text-align: center; }
.oltDetails tr:nth-child(even) { background-color: #f2f2f2; }
#countyOltData { margin-top: 1em; margin-bottom: 1em; }

/* EOI/Keep up to date/Salesforce form. */
#subscribe-form-container { display: flex; flex-direction: column; height: initial; margin-bottom: 1em; max-width: 1200px; position: initial; align-self: center; width: 100%; margin-left: auto; margin-right: auto; border-radius: 12px; overflow: hidden}
#subscribe-form-container .address-search-frame-register { padding: 0 20px 20px 20px; border: 1px solid var(--teal); border-radius: 4px; background-color: var(--default-db); display: flex; align-items: flex-start; }
#subscribe-form-container .address-search-frame-register .input-container{
    display: flex;
    margin-bottom: 10px;
    align-items: center;
}
#subscribe-form-container .address-search-frame-register .input-container label {
    font-style: normal;
    font-weight: 400;
    font-size: 24px;
    line-height: 32px;
    color: rgba(255, 255, 255, 0.6);
    display: flex;
    align-items: center;
    min-width: 150px;
    max-width: 150px;
    text-align: left;
    height: 100%;
    flex: 1;
}
#subscribe-form-container .address-search-frame-register .input-container input {
    margin-bottom: 0;
    max-height: 68px;
    height: 68px;
    background: rgba(62, 55, 75, 0.2);
    border-radius: 12px;
    border-color: transparent;
    color: white;
}
#subscribe-form-container .address-search-frame-register .input-container .error-message{
    top: auto;
    bottom: 5px;
    color: #E1797A;
}
#subscribe-form-container .address-search-frame-register .input-container-btn input {
    background:  var(--default-bg) url('./media/go-button.svg') no-repeat right 26px center;
    color: var(--emerald);
    height: 66px;
    max-height: 66px;
    line-height: 66px;
    border-radius: 12px;
    font-size: 24px;
    padding: 0 60px 0 0;
    display: block;
    margin-bottom: 0;
}
#subscribe-form-container .input-container-register {
    max-width: 905px;
    margin: 0 auto;
}
#subscribe-form-container .address-search-frame-register .input-container-btn input {
    width: 328px;
    max-width: 100%;
}
#subscribe-form-container .address-search-frame-register .input-container input.dirty:invalid {
    border-color: var(--form-error);
}
.address-search-container .sub-text a {
    text-decoration: underline;
}
@media (min-width: 769px) {
    .address-search-container.pull-up {
        margin-top: -60px;
    }
    /*body:not(.page-order) .address-search-container .sub-text{
        margin-left: 315px;
    }*/
    #subscribe-form-container .address-search-frame-register {
        padding: 50px 0 30px;
    }
    #subscribe-form-container .input-container-register {
        flex-direction: column;
        align-items: start;
        position: relative;
    }
    #subscribe-form-container .address-search-frame-register .input-container label {
    }
    #subscribe-form-container .address-search-frame-register .input-container input {
        width: 399px;
    }

    #subscribe-form-container .address-search-frame-register .input-container .error-message{
        top: auto;
        bottom: 5px;
        color: #E1797A;
        left: 165px;
    }
}

@media (min-width: 1000px) {
    #subscribe-form-container .address-search-frame-register .input-container-btn {
        position: absolute;
        right: 0;
        bottom: 11px;
    }
}
@media (max-width: 768px) {
    #subscribe-form-container .address-search-frame-register .input-container {
        min-width: 100%;
    }
    #subscribe-form-container .address-search-frame-register .input-container label {
        font-size: 20px;
        min-width: 120px;
        max-width: 120px;
    }
    .address-search-container .sub-text{
        text-align: center;
    }
    #subscribe-form-container .address-search-frame-register .input-container .error-message {
        left: 130px;
    }
}

.address-search-frame-register .input-container-register input.dirty:invalid~span.error-message { display: block; position: absolute; top: 44px; }
.error-message { color: var(--form-error); font-size: 12px; display: none; }
.input-container { display: flex; align-items: center; flex: 1; position: relative; }
.input-container-register { display: flex; flex-wrap: wrap; width: 100%; align-items: center; justify-content: center; padding: 0 10px; }
#subscribe-form .input-container { display: flex; flex: 1; align-items: flex-start; min-width: 185px; height: 70px; margin: 0 5px 0 6px; }
.input-container input { height: 44px; flex: 1; border-top-left-radius: 500px; border-bottom-left-radius: 500px; border: 1px solid var(--emerald); outline: none; font-size: 16px; line-height: 1.6em; padding-left: 20px; color: #4f4f4f; /*font-family: "Graphik Medium";*/ width: 100%; overflow: hidden; text-overflow: ellipsis; padding-top: 0; padding-bottom: 0; }
.address-search-frame-register .input-container-register input { max-height: 44px; flex: 1; background-color: var(--default-bg); border-radius: 500px; border: 1px solid var(--emerald); outline: none; font-size: 16px; /*padding-top: 1px;*/ padding-left: 20px; color: #4f4f4f; font-family: "Graphik Regular"; margin-bottom: 20px; }
.address-search-frame-register .input-container-register input.green1 { background-color: var(--emerald); color: var(--default-bg); }
.address-search-frame-register .input-container-register input.dirty:invalid {
    background: right 10px center/16px 16px no-repeat url(./media/nbi_error_icon.svg); border-color: var(--form-error); margin-bottom: 25px; }

@media (max-width: 400px) {
    #subscribe-form .input-container {
        height: auto;
    }
    #subscribe-form-container .address-search-frame-register .input-container {
        flex-direction: column;
    }
    #subscribe-form-container .address-search-frame-register .input-container label {
        min-width: 100%;
        max-width: 100%;
    }
    #subscribe-form-container .address-search-frame-register .input-container input {
        min-height: 66px;
    }
    #subscribe-form-container .address-search-frame-register .input-container-btn {
        max-width: 100%;
        margin-top: 20px;
    }
    #subscribe-form-container .address-search-frame-register .input-container-btn input {
        background-position: right 16px center;
        font-size: 20px;
    }
}

/* Popup theme */
/* Popup Theme 5273: Content Only - For use with page builders or block editor */
.pum-theme-5273, .pum-theme-content-only { background-color: rgba( 0, 0, 0, 0.70 ) }
.pum-theme-5273 .pum-container, .pum-theme-content-only .pum-container { padding: 0 160px 0 150px; border-radius: 0; border: 1px none #000000; box-shadow: 0 0 0 0 rgba( 2, 2, 2, 0.00 ); background-color: rgba( 255, 255, 255, 1.00 ) }
.pum-theme-5273 .pum-title, .pum-theme-content-only .pum-title { color: #000000; text-align: left; text-shadow: 0 0 0 rgba( 2, 2, 2, 0.23 ); font-family: inherit; font-weight: 400; font-size: 32px; line-height: 36px }
.pum-theme-5273 .pum-content, .pum-theme-content-only .pum-content { color: #8c8c8c; font-family: inherit; font-weight: 400; }
.pum-theme-5273 .pum-content + .pum-close, .pum-theme-content-only .pum-content + .pum-close { position: absolute; height: 39px; width: 39px; left: auto; right: 7px; bottom: auto; top: 7px; padding: 0; color: var(--emerald) !important; font-family: 'Graphik ExtraLight' !important; font-weight: 400 !important; font-size: 39px; line-height: 39px; border: 1px none var(--default-bg); border-radius: 15px; box-shadow: 0 0 0 0 rgba( 2, 2, 2, 0.00 ); text-shadow: 0 0 0 rgba( 0, 0, 0, 0.00 ); background-color: rgba( 255, 255, 255, 0.00 ) }

/* EOI popup overrides (#popmake-4680) */
@media (min-width: 769px) {
	#popmake-4680 { padding-right: 90px; }
}
#popmake-4680 .pum-content/*, .pum-theme-content-only .pum-content*/ { display: flex; }
#popmake-4680 .pum-content div:not(.iti__flag):first-child { flex: 0 0 90px; }
#popmake-4680 img.alignleft { width: 70px; height: auto; }
#popmake-4680 p, #popmake-4680 #subscribe-form-container { /*padding-left: 150px;*/ }
@media (max-width: 768px) {
	#popmake-4680 .pum-content { flex-direction: column; }
}
/* Popup styling. */
.popmake-content { padding: 2em; background-color: var(--default-bg); }
.popmake-content h2 { color: var(--emerald); margin-bottom: 1em; text-align: left; }
.popmake-content h4 { margin-bottom: 0; text-align: center; }
.popmake-content h5 { margin-bottom: 20px; text-align: center; }
.popmake-content p, body.sub-page .popmake-content p { margin-bottom: 1.5em; color: var(--body-text); }
.popmake-content .form-fields { display: flex; flex-wrap: wrap; justify-content: space-between; }
.popmake-content .form-fields input { border: none; }
.popmake-content input[type="text"], .popmake-content input[type="submit"] { padding: 10px; margin-bottom: 10px; }
.popmake-content input[name="First name"], .popmake-content input[name="Last name"] { width: 48%; }
.popmake-content input[name="Last name"] { margin-left: 4%; }
.popmake-content input[name="Eircode"] { width: 100%; }
.popmake-content input[name="Email address"] { width: 100%; }
.popmake-content .form-fields > .iti.iti--allow-dropdown.iti--show-flags { width: 85%; } /* Prevent phone field enhancement from pushing submit button onto next line. */
.popmake-content input[name="Phone"] { width: 100%; }
.popmake-content input[name="submit"] { width: 10%; height: 45px; background-color: var(--default-bg); }
.popmake-content input { background-color: #eee; }
@media (max-width: 768px) {
    .popmake-content input[name="First name"], .popmake-content input[name="Last name"] { width: 100%; }
    .popmake-content input[name="Last name"] { margin-left: 0; }
}

.inside-footer-widgets { flex-wrap: wrap; }
/* Footer widget 1 is full width; Widgets do not grow. */
.footer-widget-1 { flex-basis: 100% !important; display: flex; justify-content: space-between; }
.footer-widget-1 aside { flex: 1 1 0; }
@media (max-width: 768px) {
	.footer-widgets-container { padding: 40px 20px; }
}
@media (min-width: 769px) {
	.footer-widget-1 aside { align-self: flex-end; }
	.inside-footer-widgets .footer-widget-2 { flex-basis: 15%; } /* A little wider than others. */
	.inside-footer-widgets .footer-widget-5 { flex-basis: 5%; } 
}

#footer-widgets { background-color: var(--teal); text-shadow: 0 0 0.75px #444; }
.footer-widgets .widget { /*margin-bottom: 0;*/ }
.footer-widgets .pillButton { line-height: initial; } /* For Browsealoud button */
#footer-widgets, #footer-widgets p { text-align: left; }
#footer-widgets p.social-desktop { text-align: right; }
#footer-widgets p.social-mobile { display: flex; justify-content: space-between; }
.keep-informed { background-color: var(--emerald); border-radius: 15px; padding: 1em; }
.keep-informed h2, body.sub-page .keep-informed h2 { color: var(--default-bg); font-size: 24px; line-height: 28px; letter-spacing: 4px; }
.site-footer .keep-informed p, body.sub-page .site-footer .keep-informed p { color: var(--default-bg); font-size: 16px; line-height: 20px; }
.keep-informed .wp-block-buttons { justify-content: left; margin-block-start: 0; }
#footer-widgets .keep-informed a { background-color: var(--default-bg); color: var(--emerald); border-radius: 0; padding: 10px 50px; }
/*.footer-widget-1 aside p.social { display: flex; justify-content: space-between; align-items: center; }*/
.footer-widget-1 aside p.social img { width: 32px; margin-right: 20px; }
.footer-widget-1 aside p.social .youtube img { width: 40px; }
.site-footer { background-color: var(--default-bg); }
/*.site-footer .wp-block-image { margin-top: 47px; }*/
.site-footer p, body.sub-page .site-footer p { color: var(--body-text); font-size: .6em; line-height: 2.2; margin-bottom: 0; padding-bottom: 1em; text-align: center; }
.site-footer p.copyright, body.sub-page .site-footer p.copyright { background-color: var(--teal); color: var(--default-bg); font-size: 10px; line-height: 1.6; }
@media (max-width: 768px) {
    .site-footer p, body.sub-page .site-footer p { padding-left: 10px; padding-right: 10px; }
    .footer-widget-1 aside p.social img, .footer-widget-2 aside p.social img { width: 40px; }
	.footer-widget-2 aside p.social .youtube img { width: 47px; margin-top: 2px; }
}

/* Buttons */
.wp-block-buttons { justify-content: center; }
.button, .wp-block-button .wp-block-button__link { background-color: var(--emerald); color: var(--default-bg); border-radius: 50px; transition: 0.3s; }
.wp-block-button .wp-block-button__link.has-dark-green-background-color { background-color: var(--teal); }
.wp-block-button .wp-block-button__link.has-emerald-color { background-color: var(--emerald); }
.button.is-style-more-padding {
    padding: 10px 35px;
}
a.button:hover, .button:hover, .wp-block-button .wp-block-button__link:hover, .address-search-frame-register .input-container-register input.green1:hover { background-color: var(--teal); color: var(--default-bg); text-decoration: none; }

/* Circle animation */
.dl-times { max-width: 1200px; margin: 0 auto; }

.dl-times .wp-block-column { text-align: center; }
.dl-times .wp-block-columns.is-layout-flex { gap: 0; }

.dl-header .wp-block-column:not(.transparent-column) { background-color: var(--emerald); }
.dl-header p, .dl-times .transparent-column p { color: var(--default-bg); }

.dl-header .fibre-top { border-radius: 20px 0 0 0; }
.dl-header .other { border-radius: 0 20px 0 0; }

.wp-block-columns.dl-header, .wp-block-columns.circles { margin-bottom: 0; align-items: center !important; }
.dl-times .wp-block-column { padding: 34px 20px; }

.dl-times .wp-block-buttons > .wp-block-button { display: block; }
.dl-times .wp-block-button .wp-block-button__link { border-radius: 0; width: 100%; font-size: 20px; line-height: 28px; }
.dl-times .wp-block-button .wp-block-button__link:hover { background-color: var(--emerald); }

.dl-time { font-family: sans-serif; font-size: 0.4em; text-anchor: middle; }

.circular-chart { display: block; margin: 10px auto; max-width: 80%; max-height: 140px; }
.circle-bg { fill: none; stroke: #eee; stroke-width: 3.8; }
.circle { fill: none; stroke-width: 2.8; stroke-linecap: round; }

.animate .circle {
  animation-name: progress;
  animation-duration: 1s; /* Overridden later */
  animation-timing-function: linear;
}
@keyframes progress {
  0% {
    stroke-dasharray: 0 100;
  }
}

.fibre-benefits p { font-size: 24px; line-height: 32px; }
.fibre-benefits .dl-times p { font-size: 20px; line-height: 19px; margin-bottom: 0; }
.fibre-benefits .dl-times .transparent-column p { font-size: 20px; line-height: 28px; margin-bottom: 25px; }
@media only screen and (max-width: 768px) {
	.no-sidebar .entry-content .is-style-full-width.fibre-benefits .wp-block-group__inner-container { padding-right: 0; padding-bottom: 20px; }
	.fibre-benefits h2, .fibre-benefits p { padding-right: 40px; }
	
	.dl-times { background-color: transparent; display: flex; overflow-x: scroll; }
	body .is-layout-flex.dl-header { display: none; }
	.wp-block-columns.circles { width: 90%; flex-grow: 0; flex-shrink: 0; column-gap: 1em; }
	.single-chart { background-color: var(--default-bg); padding-top: 1px; padding-bottom: 1px; }
	/*.dl-times .wp-block-button .wp-block-button__link { width: 80%; }*/
	.circles.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column { margin-right: 1em; margin-left: 1em; }
	.dl-times .wp-block-column { padding: 0; }
	.wp-block-column.transparent-column { margin-bottom: 1em; }
	.dl-times .wp-block-button .wp-block-button__link { padding-left: 40px; padding-right: 40px; }

	.dl-times .wp-block-column p { margin-top: 0; margin-bottom: 0; padding: 1em 0; color: var(--default-bg); }
	.dl-times .fibre-top.wp-block-column p { border-radius: 20px 20px 0 0; }
	.dl-times .songs.wp-block-columns .wp-block-column:not(.transparent-column) p { background-color: var(--emerald); }
	.dl-times .images.wp-block-columns .wp-block-column:not(.transparent-column) p { background-color: var(--lime); }
	.dl-times .movie.wp-block-columns .wp-block-column:not(.transparent-column) p { background-color: var(--buttercup); }
}
@media only screen and (min-width: 769px) {
	.wp-block-columns:not(.dl-header) .fibre-top p, .wp-block-columns:not(.dl-header) .fibre-next p, .wp-block-columns:not(.dl-header) .other p { display: none; }
	.circles .wp-block-column:not(.transparent-column) { background-color: var(--default-bg); }
}

/* Circle fill styles */
.fibre-top .dl-time { fill: var(--emerald); }
.fibre-next .dl-time { fill: var(--buttercup); }
.other .dl-time { fill: var(--rust); }

/* Animation */
.fibre-top .animate .circular-chart .circle { stroke: var(--emerald); }
.fibre-next .animate .circular-chart .circle { stroke: var(--buttercup); }
.other .animate .circular-chart .circle { stroke: var(--rust); }


/* Animation times */
.songs .fibre-top .animate .circle { animation-duration: 1s; }
.songs .fibre-next .animate .circle { animation-duration: 1s; }
.songs .other .animate .circle { animation-duration: 20s; }
.images .fibre-top .animate .circle { animation-duration: 4s; }
.images .fibre-next .animate .circle { animation-duration: 17s; }
.images .other .animate .circle { animation-duration: 100s; } /* Should be 360s */
/* Proportional for movie example. */
.movie .fibre-top .animate .circle { animation-duration: 10s; }
.movie .fibre-next .animate .circle { animation-duration: 29s; }
.movie .other .animate .circle { animation-duration: 100s; }


/* Contact Providers CTA */
.contact-providers .wp-block-group__inner-container { background-color: var(--buttercup); margin-top: -4em; padding: 2em; }
.contact-providers h2, .contact-providers p { color: var(--other-text); }
.contact-providers p { font-size: 24px; line-height: 32px; }
.contact-providers .wp-block-button .wp-block-button__link { background-color: var(--rust); border-radius: 0; font-size: 20px; line-height: 28px; }
@media only screen and (max-width: 768px) {
	.contact-providers h2 { font-size: 36px; line-height: 40px; }
	.contact-providers p { font-size: 20px; line-height: 28px; }
}


/* CTA slide out/in animation. */
/*@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}
.animate__slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.animate__animated, .columns-cta .wp-block-image img {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
.columns-cta .wp-block-image { overflow: hidden; }
.columns-cta .wp-block-image:hover img { -webkit-animation-name: slideOutRight, slideInLeft; animation-name: slideOutRight, slideInLeft; }
*/
/* Animations */
.content-wrapper {
  max-width: 768px;
  margin: auto;
  box-sizing: border-box;
  color: var(--teal);
  font-family: "Graphik Light";
  font-weight: normal;
}

.animation-content {
  padding: 0 12px;
}

.content-wrapper *,
.map-modal * {
  box-sizing: border-box;
}

/*.placeholder {
  height: 850px;
  background-color: #f0f0f0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  display: none;
}*/

.animation-heading {
  font-family: "Graphik Light";
  font-weight: normal;
  font-size: 40px;
  line-height: 44px;
  text-align: center;
  letter-spacing: -0.5px;
  padding: 0 12px;
}

.phase-animation {
  position: relative;
  z-index: 2;
  margin: auto;
  overflow: hidden;
}

.phase {
  position: relative;
  text-align: center;
  width: 100%;
  margin-bottom: 50px;
}

.phase-line {
  display: block;
  position: absolute;
  background-repeat: no-repeat;
  width: 100vw;
}

.phase-line::before {
  display: block;
  content: '';
  background-color: var(--lime);
  width: 100%;
  height: 4px;
  position: absolute;
}

.phase-1 .phase-line {
  background-image: url('./media/animations/line-1-m.svg');
  height: 163px;
  top: 106px;
  left: calc(50% + 110px + 10px);
}

.phase-1 .phase-line::before {
  left: 30px;
  bottom: 0;
}

.phase-2 .phase-line {
  background-image: url('./media/animations/line-2-m.svg');
  height: 80px;
  top: -12px;
  left: auto;
  right: calc(50% + 110px);
  background-position: top right;
}

.phase-2 .phase-line::before {
  right: 60px;
  top: 0;
}

.phase-3 .phase-line {
  background-image: url('./media/animations/line-3-m.svg');
  height: 50px;
  top: 20px;
  left: calc(50% + 110px);
}

.phase-3 .phase-line::before {
  left: 30px;
  top: 13px;
}

.phase-4 .phase-line {
  background-image: url('./media/animations/line-4-m.svg');
  background-position: top right;
  height: 110px;
  top: -85px;
  right: calc(50% - 92px);
}

.phase-4 .phase-line::before {
  right: 30px;
  top: 58px;
}

.phase-5 .phase-line {
  background-image: url('./media/animations/line-5-m.svg');
  height: 50px;
  left: calc(50% + 110px - 24px);
  top: 150px;
}

.phase-5 .phase-line::before {
  left: 30px;
  top: 41px;
}

.phase-circle {
  width: 220px;
  height: 220px;
  position: relative;
  margin: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.phase .circle {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
}

.phase .circle svg {
  display: block;
  width: 100%;
  height: 100%;
}

.phase-image {
  display: block;
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  justify-content: center;
}

.phase-number {
  font-family: "Graphik Medium";
  text-transform: uppercase;
  letter-spacing: 3px;
  color: var(--teal);
  font-size: 14px;
  line-height: 14px;
  display: inline-block;
  text-align: center;
  padding-top: 18px;
  padding-bottom: 0;
  border-bottom: solid 1px var(--teal);
}

.phase-title {
  font-family: "Graphik Light";
  color: var(--teal);
  font-size: 24px;
  line-height: 28px;
  display: block;
  text-align: center;
  padding-top: 7px;
  max-width: 60%;
}

.phase-1 .phase-image img {
  width: 62px;
  height: 79px;
}

.phase-2 .phase-image img {
  width: 57px;
  height: 80px;
}

.phase-3 .phase-image img {
  width: 71px;
  height: 70px;
}

.phase-4 .phase-image img {
  width: 61px;
  height: 62px;
}

.phase-5 .phase-image img {
  width: 73px;
  height: 73px;
}

.phase-2 .circle svg {
  transform: rotate(215.43deg);
}

.phase-3 .circle svg {
  transform: rotate(-45deg);
}

.phase-4 .circle svg {
  transform: rotate(-45deg);
}

.phase-5 .circle svg {
  transform: rotate(15deg);
}

.phase .circle span {
  display: block;
  width: 14px;
  height: 14px;
  background-color: var(--lime);
  border-radius: 20px;
  position: absolute;
}

.phase-1 .circle span {
  top: 102px;
  right: -2px;
}

.phase-2 .circle span {
  top: 42px;
  left: 12px;
}

.phase-3 .circle span {
  top: 28px;
  right: 25px;
}

.phase-4 .circle span {
  top: 28px;
  right: 25px;
}

.phase-5 .circle span {
  top: 132px;
  right: 2px;
}

.phase-description {
  font-size: 16px;
  line-height: 20px;
  color: var(--heather);
  text-align: center;
  background-image: url('./media/animations/line.svg');
  background-repeat: no-repeat;
  background-size: 4px 27px;
  background-position: top center;
  padding-top: 40px;
  max-width: 280px;
  margin: auto;
  margin-top: 10px;
}

.line-1,
.line-2,
.line-3,
.line-4 {
  display: none;
}

.numbers-heading {
  font-family: "Graphik Light";
  font-weight: normal;
  font-size: 36px;
  line-height: 40px;
  letter-spacing: -0.5px;
  color: var(--teal);
  text-align: center;
}

.numbers {
  list-style-type: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
}

.inside-article .entry-content ul.numbers li {
  margin-bottom: 28px;
}

.numbers .value {
  display: block;
  font-size: 52px;
  line-height: 44px;
  color: var(--emerald);
  font-family: "Graphik Light";
  text-align: center;
}

.numbers .title {
  display: block;
  text-align: center;
  color: var(--teal);
  font-size: 20px;
  line-height: 28px;
}
/* Smaller text on REPS page. */
.page-reps .numbers .value { font-size: 35px; line-height: 35px; }
.page-reps .numbers .title { font-size: 18px; line-height: 24px; }


/* Ploughing Championships DPods & other DPods pages. */
.silo-section.separate-containers .site-main { margin-top: 0; margin-bottom: 0; }
.silo-section .entry-content { padding-left: 1em; padding-right: 1em; }
.silo-section .entry-content .search-map:first-child, .silo-section .entry-content .search-map.search-map-top { border-radius: 0; padding-top: 10px; }
.silo-section.separate-containers .inside-article { padding: 0; }
.silo-section #primary { width: 100%; }

.silo-section .grid-container { max-width: initial; }
.silo-section .hero{ position:relative; margin-bottom: 3em; }
.silo-section .hero .wp-block-group__inner-container { padding: 0; max-width: initial; }
.silo-section.ploughing .hero .wp-block-group__inner-container { height: 1920px; }
.silo-section .hero .wp-block-button .wp-block-button__link { font-size: 25px; padding: 20px; }
.silo-section .hero .wp-block-button.touch-to-start .wp-block-button__link { font-size: 50px; line-height: 56px; padding: 40px 70px; margin-top: 1500px; }
.silo-section .hero .wp-block-group__inner-container>*{z-index:1;position:relative}
.silo-section .wp-block-video { margin-bottom: 0; }
.silo-section .hero .wp-block-video, .silo-section .hero video {position:absolute;left:0;top:0;width:100%;height:100%;z-index:0}
.silo-section .hero .wp-block-video video {object-fit:cover;object-position:center}
.silo-section .wp-block-image:last-child { margin-bottom: 0; } /* If only image on page then clear margin-bottom. */
.silo-section .kpi .wp-block-column { flex-basis: 10% !important; }
.silo-section .kpi h3 { font-size: 50px; }
.silo-section .kpi p { font-size: 20px; }
.silo-section .wp-block-button .wp-block-button__link { background-color: var(--teal); margin-bottom: 1em; border-radius: 10px; }
.silo-section .dl-times .wp-block-button .wp-block-button__link { margin-bottom: 0; }

.big-buttons .wp-block-button, .big-buttons .wp-block-button__link { width: 100%; }
.big-buttons .wp-block-button__link, .silo-section .silo-home .wp-block-button .wp-block-button__link { font-size: 30px; padding: 20px 50px; }

.silo-home { justify-content: flex-start; margin-left: 2em; padding-top: 3em; }
.silo-section .progress-hero { background: url(https://nbi.ie/wp-content/uploads/2023/08/30.jpg) center center no-repeat; background-size: cover; padding-bottom: 3em; }
.silo-section .our-progress { background-color: var(--default-bg); margin: 2em; padding: 2em; }
.silo-section .numbers { flex-direction: row; flex-wrap: wrap; align-items: flex-start; }
.silo-section .inside-article .entry-content ul.numbers li { margin-bottom: 0; }
.silo-section .numbers li { padding: 28px 14px; flex: 1 1 33%; }

.silo-section .animation-heading { margin-bottom: 60px; }
.silo-section .phase-animation { max-width: initial; min-height: initial; }
.silo-section .animation-content { display: flex; flex-wrap: wrap; gap: 5px; min-height: initial; justify-content: center; position: initial; transform: none; width: initial; }
.silo-section .phase { width: 30%; }
.silo-section .phase-circle { height: 190px; width: 190px; }
.silo-section .phase-title { font-size: 17px; line-height: 21px; padding-top: 5px; }
.silo-section .phase-description { font-size: 17px; padding-left: 1.5em; padding-right: 1.5em; }
.silo-section .phase-1, .silo-section .phase-2, .silo-section .phase-3, .silo-section .phase-4, .silo-section .phase-5 { position: static; left: initial; top: initial; margin-bottom: 4em; }
.silo-section .phase-2 .circle svg, .silo-section .phase-3 .circle svg, .silo-section .phase-4 .circle svg, .silo-section .phase-5 .circle svg { transform: rotate(-180deg); }
.silo-section .phase-1 .circle span { top: 86px; }
.silo-section .phase-2 .circle span, .silo-section .phase-3 .circle span, .silo-section .phase-4 .circle span, .silo-section .phase-5 .circle span { top: 86px; left: -5px; }
.silo-section .phase-1 .phase-image img, .silo-section .phase-2 .phase-image img, .silo-section .phase-3 .phase-image img, .silo-section .phase-4 .phase-image img, .silo-section .phase-5 .phase-image img { height: 75px; }
.silo-section .phase-number { padding-top: 10px; }

.silo-section.has-eircode-search .address-search-container { padding-bottom: 2em; margin-bottom: 0; }
/*.silo-section .premises-cta-register,*/ .silo-section .disclaimers, .silo-section .hide-on-ploughing { display: none !important; }
.silo-section #subscribe-form-container { border-radius: 0; }
.silo-section #subscribe-form-container.inline-form .address-search-frame-register { flex-direction: row; }
.silo-section #subscribe-form-container.inline-form .address-search-frame-register .input-container input { width: 300px; }
.silo-section .content-wrapper { margin-top: 5em; }
.silo-section.has-eircode-search .content-wrapper { padding-left: 0; padding-right: 0; }
.silo-section .address-search-container.pull-up { margin-top: 0; }
.silo-section .eoi-cta { background-color: var(--emerald); padding-top: 50px; padding-bottom: 75px; }
.silo-section .eoi-cta h2 { color: var(--default-bg); margin: 0 auto 50px auto; width: 580px; }
.silo-section .eoi-cta .wp-block-button__link { background-color: var(--teal); border-radius: 234px; font-size: 50px; line-height: 56px; padding: 50px 170px 50px 56px; position: relative; text-align: left; width: 500px; }
.silo-section .eoi-cta .wp-block-button__link::after { content: ''; background: url('./media/go-button.svg') no-repeat center; background-size: contain; position: absolute; width: 80px; height: 80px; right: 36px; top: calc(50% - 40px); transition: transform ease-in 0.3s; }
.silo-section .eircode-cta { display: none; } /* Takes user out of silo area so hide it. */


.silo-section #before-header, .XXXpage-child.has-eircode-search #before-header,
.silo-section .sub-text { display: none; }
.tableauPlaceholder { margin: 0 auto; border: 1px solid var(--lime); }
@media (max-width: 768px) {
	.tableauPlaceholder { border: 2px solid var(--emerald); }
}
	
.silo-section .floating-start { position: fixed; right: 1em; bottom: 1em; /*border: 1px solid white; border-radius: 50px;*/ font-size: 1.5em; z-index: 10; }
/* End Ploughing Championships DPods */


/* Fade in images (with .fade-in class) on scroll. From: https://alvarotrigo.com/blog/css-animations-scroll/ */
/*@media only screen and (min-width: 769px) {
	.wp-block-image.fade-in { opacity: 0; }
	.wp-block-image.fade-in.active { animation: fadeIn 1.5s normal forwards; }
}*/
/* Fade in elements with .fade-in class on scroll. From https://dev.to/jslim/fading-up-sections-using-intersection-observer-3fhj */
@media (prefers-reduced-motion: no-preference) {
	.fade-in { transform: translateY(50px); opacity: 0; transition-property: transform, opacity; transition-duration: 1s; transition-timing-function: linear; }
	.in-view { transform: none; opacity: 1; }
}

/* Careers */
.page-careers.separate-containers .site-main { margin-bottom: 0; margin-top: 0; }
.page-careers.no-sidebar .entry-content .is-style-full-width .wp-block-group__inner-container { padding: 25px 0; }

.page-careers h1  { font-size: 96px; letter-spacing: -1.5px; }
.page-careers h3 { letter-spacing: 4px; }
.page-careers p, .page-careers .hero .wp-block-column.intro .wp-block-button__link { font-size: 20px; line-height: 28px; }
.page-careers .signpost p { font-size: 16px; line-height: 20px; }
.page-careers .signpost p strong { font-size: 18px; line-height: 22px; }
@media only screen and (max-width: 768px) {
	.page-careers h1  { font-size: 50px; letter-spacing: -0.5px; }
	.page-careers .signpost h3 { font-size: 16px; }
	.page-careers p, .page-careers .hero .wp-block-column.intro .wp-block-button__link, .overlay-column p { font-size: 20px; line-height: 28px; }
	.page-careers .signpost p { font-size: 16px; line-height: 20px; }
}
.page-careers .has-dark-green-background-color, .page-careers .has-dark-green-background-color h1/*, .page-careers .has-dark-green-background-color h2*/ { color: var(--default-bg); padding-left: 20px; margin-bottom: 0; }
.page-careers .has-dark-green-background-color h1 { margin-bottom: 55px; }

.page-careers.no-sidebar .entry-content .is-style-full-width .swiper-wrapper .swiper-slide .wp-block-group__inner-container {border-radius: 20px; padding: 40px 120px 30px 30px; }

.off-screen-spill { margin-right: calc(-100vw / 2 + 100% / 2); max-width: 100vw; width: auto; } /* Spill to right */
.off-screen-spill .swiper-wrapper { display: flex; overflow-x: scroll; -ms-scroll-snap-type: x mandatory; scroll-snap-type: x mandatory; gap: 65px; justify-content: stretch; padding-bottom: 50px; }
.page-careers .off-screen-spill .swiper-slide { max-width: 500px; border-radius: 20px; height: initial !important; padding: 40px; }
.page-careers .off-screen-spill .swiper-slide:last-child { margin-right: 50px; }
.page-careers .swiper-slide h2 { padding-left: 0; margin-bottom: 20px; }
@media only screen and (max-width: 768px) {
	.off-screen-spill .swiper-wrapper { padding-left: 20px; }
	.page-careers .off-screen-spill .swiper-slide { width: 85%; padding: 40px 20px; }
	.has-eircode-search .off-screen-spill .swiper-wrapper { gap: 10px; }
	.has-eircode-search .off-screen-spill .swiper-slide { width: 85%; padding: 0; }
	.page-careers .hero .wp-block-column.intro h2, .off-screen-spill h2, .careers-cta h2, .overlay-column h2, .grid-carousel h2, .diversity-inclusion h2 { font-size: 36px; line-height: 40px; }
	.off-screen-spill p { font-size: 16px; line-height: 20px; }
	.careers-cta { text-align: center; }
	.careers-cta h2 { margin-bottom: 20px; }
	.page-careers.no-sidebar .entry-content .is-style-full-width.grid-carousel .swiper-wrapper .swiper-slide .wp-block-group__inner-container { padding-right: 40px; }
}
.page-careers .off-screen-spill .swiper-slide:nth-child(3n+1) { background-color: var(--buttercup); }
.page-careers .off-screen-spill .swiper-slide:nth-child(3n+2) { background-color: var(--lime); }
.page-careers .off-screen-spill .swiper-slide:nth-child(3n) { background-color: var(--emerald); }

.off-screen-spill .swiper-wrapper { scrollbar-color: var(--emerald) var(--default-bg); scrollbar-height: 3em; }
.off-screen-spill .swiper-wrapper::-webkit-scrollbar { height: 14px; width: 14px; border-radius: 0; }
.off-screen-spill .swiper-wrapper::-webkit-scrollbar-thumb { border-radius: 0; background: var(--emerald); }
.off-screen-spill .swiper-wrapper::-webkit-scrollbar-track { border-radius: 0; background: var(--default-bg); }
/*.off-screen-spill .swiper-wrapper::-webkit-scrollbar-button { background: url(./extension/img/arrow-right-green.svg) no-repeat center centre; background-size: 14px 14px; }*/


.page-careers .video { padding-right: 20px; }
.page-careers .careers-videos.wp-block-columns { gap: 0; max-width: 1280px; margin: 100px auto 60px; }
.page-careers .careers-videos .wp-block-column { padding: 20px; color: var(--default-bg); text-align: center; }
.page-careers .careers-videos .wp-block-column p { text-align: left; }
/*.page-careers .careers-videos .wp-block-column:first-child { color: #000; }*/

.page-careers .careers-videos figure { position: relative; overflow: hidden; }
.page-careers .careers-videos figure:before { content: ' '; display: block; position: absolute; left: 0; top:0; width: 100%; height: 100%; background: url("./extension/img/play-button-white.png") no-repeat center; background-size: 101px; transition: all ease-in 0.3s; opacity: 0; z-index: 1; }
.page-careers .careers-videos figure:after { content: ' '; display: block; position: absolute; left: 0; top:0; width: 100%; height: 100%; background: url("./extension/img/play-button.png") no-repeat center; background-size: 101px; transition: all ease-in 0.3s; }
.page-careers .careers-videos figure:hover:before { opacity: 1; transform: scale(0.92); }
.page-careers .careers-videos figure:hover:after { opacity: 0; }


.careers-cta { background-color: var(--emerald); border-radius: 20px; padding: 40px 100px; margin-bottom: 50px; margin-left: auto; margin-right: auto; max-width: 910px; }
@media (max-width: 768px) {
	.page-careers .careers-cta.wp-container-core-group-is-layout-8 { padding: 40px; justify-content: center; margin-right: 20px; }
	.page-careers .careers-cta h2 { font-size: 16px; line-height: 28px; }
}
@media only screen and (min-width: 769px) {
	/*.careers-cta .wp-block-group__inner-container { padding: 40px 25px !important; }*/
}
.careers-cta .wp-block-button .wp-block-button__link, .careers-cta .wp-block-button .wp-block-button__link:hover { background-color: var(--default-bg); color: var(--emerald); border-radius: 0; }
.careers-cta .wp-block-columns { margin-bottom: 0; }
@media only screen and (min-width: 769px) {
	.careers-cta .wp-block-group__inner-container { display: flex; justify-content: space-between; }
}

.grid-carousel .swiper-wrapper { padding-left: 5px; padding-right: 5px; }
@media only screen and (max-width: 768px) {
	.grid-carousel { --swiper-pagination-bullet-width: 24px; --swiper-pagination-bullet-height: 24px; --swiper-pagination-bullet-inactive-color: var(--default-bg); --swiper-pagination-bullet-inactive-opacity: 1; --swiper-pagination-color: var(--lime); }
}
@media only screen and (min-width: 769px) {
	.grid-carousel .swiper-wrapper { display: grid; grid-template-columns: 1fr 1fr; }
}

.diversity-inclusion .wp-block-columns.is-style-narrow-width { max-width: var(--max-content-width); }
@media only screen and (min-width: 769px) {
	.diversity-inclusion .wp-block-cover__inner-container { padding-top: 80px; padding-bottom: 80px; }
	.diversity-inclusion .wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column { padding-right: 100px; }
}

@media only screen and (max-width: 768px) {
	.team-advantage, .overlay-columns { margin-left: calc(-100vw / 2 + 100% / 2); margin-right: calc(-100vw / 2 + 100% / 2); max-width: 100vw; width: auto; }
	.team-advantage .wp-block-column:first-child { padding-left: 20px; padding-right: 20px; }
}

.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column.overlay-column { background-color: var(--emerald); color: var(--default-bg); box-shadow: 0 8px 8px rgb(0 0 0 / 45%); padding: 30px; border-radius: 8px; margin-top: -60px; }
.overlay-column h2 { color: var(--default-bg); }
@media only screen and (min-width: 769px) {
	/* Move up and right to overlay image */
	.wp-block-columns:not(.is-not-stacked-on-mobile) > .wp-block-column.overlay-column { margin-top: -140px; margin-left: 150px; margin-right: 20%; flex-basis: 30%; }
}  
/* Careers - end */

.map-animation {
  max-width: 90%;
  position: relative;
  overflow: hidden;
  margin: auto;
}

.map-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  padding: 32px 12px;
}

.map-animation .map-outline,
.map-animation .map-cover,
.map-animation .map-regional,
.map-animation .map-local,
.map-animation .map-center {
  position: absolute;
  width: 100%;
  top: 0;
  left: 0;
}

.map-animation .map-outline {
  z-index: 51;
}

.map-animation .map-cover {
  z-index: 52;
}

.map-animation .map-bg {
  z-index: 50;
}

.map-animation .map-regional {
  z-index: 53;
  opacity: 0;
}

.map-animation .map-local {
  z-index: 54;
  opacity: 0;
}

.map-animation .map-center {
  z-index: 55;
  opacity: 0;
}

.map-animation .map-outline img,
.map-animation .map-cover img,
.map-animation .map-regional img,
.map-animation .map-local img,
.map-animation .map-bg img,
.map-animation .map-center img {
  display: block;
  width: 100%;
}

.map-animation .map-bg {
  position: relative;
  width: 100%;
}

.map-bg img {
  opacity: 0;
}

.map-bg span {
  position: absolute;
  display: block;
  width: 8px;
  height: 8px;
  border-radius: 8px;
  background-color: var(--lime);
  opacity: 0;
}

.map-bg span:nth-child(2n+1) {
  transform: scale(0.5);
}
.map-bg span:nth-child(2n+2) {
  transform: scale(1);
}
.map-bg span:nth-child(2n+3) {
  transform: scale(1.5);
}
.map-animation.play .map-bg span:nth-child(2n+1) {
  animation: regions1 2s normal forwards;
  animation-timing-function: ease-in-out;
}
.map-animation.play .map-bg span:nth-child(2n+2) {
  animation: regions2 2s normal forwards;
  animation-timing-function: ease-in-out;
}
.map-animation.play .map-bg span:nth-child(2n+3) {
  animation: regions3 2s normal forwards;
  animation-timing-function: ease-in-out;
}

.map-animation.play .map-cover {
  opacity: 0;
  transition: opacity 1s ease-in-out;
  transition-delay: 2500ms;
}

.map-animation.play .map-bg {
  opacity: 0;
  transition: opacity 1s ease-in-out;
  transition-delay: 2500ms;
}

.map-animation.play .map-regional {
  opacity: 1;
  transition: opacity 1s ease-in-out;
  transition-delay: 2500ms;
}

.map-animation.play .map-local {
  opacity: 1;
  transition: opacity 1s ease-in-out;
  transition-delay: 4000ms;
}

.map-animation.play .map-center {
  opacity: 1;
  transition: opacity 1s ease-in-out;
  transition-delay: 5500ms;
}

.map-description .map-premises {
  color: var(--emerald);
}

.map-description .map-areas {
  color: var(--teal);
}

.map-description .map-regional {
  color: var(--rust);
}

.map-description .map-local {
  color: var(--lime);
}

.map-description .map-footer {
  color: var(--teal);
}

.map-description {
  font-size: 24px;
  line-height: 32px;
  margin: auto;
  padding-top: 30px;
}

.map-description .map-premises,
.map-description .map-areas,
.map-description .map-regional,
.map-description .map-local,
.map-description .map-footer {
  margin: 16px auto;
  max-width: 250px;
}

.map-description span {
  position: relative;
  display: inline-block;
}

.map-description span svg {
  position: absolute;
  right: -20px;
  top: -5px;
  width: 16px;
  height: 16px;
  cursor: pointer;
}

.internal-content .wp-block-group__inner-container .map-description h2 {
  font-family: "Graphik Light";
  font-weight: normal;
  margin: 0;
  font-size: 32px;
  line-height: 28px;
}

.map-description .map-premises {
  opacity: 0;
}

.map-description.play .map-premises {
  opacity: 1;
  transition: opacity 0.5s ease-in-out;
}

.map-description .map-areas {
  opacity: 0;
}

.map-description.play .map-areas {
  opacity: 1;
  transition: opacity 0.75s ease-in-out;
  transition-delay: 750ms;
}

.map-description .map-regional {
  opacity: 0;
}

.map-description.play .map-regional {
  opacity: 1;
  transition: opacity 0.75s ease-in-out;
  transition-delay: 2500ms;
}

.map-description .map-local {
  opacity: 0;
}

.map-description.play .map-local {
  opacity: 1;
  transition: opacity 0.75s ease-in-out;
  transition-delay: 4000ms;
}

.map-description .map-footer {
  opacity: 0;
}

.map-description.play .map-footer {
  opacity: 1;
  transition: opacity 0.75s ease-in-out;
  transition-delay: 5500ms;
}

.map-description a.button {
  font-size: initial;
  margin-top: 30px;
  opacity: 0;
}

.map-description.play a.button {
  opacity: 1;
  transition: opacity 0.75s ease-in-out;
  transition-delay: 6000ms;
}

.map-modal {
  display: none;
}

.map-modal.active {
  display: flex;
  width: 100vw;
  height: 100vh;
  z-index: 999;
  position: fixed;
  left: 0;
  top: 0;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-family: "Graphik Light";
}

.map-modal:before {
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  position: absolute;
  z-index: 999;
}

.map-modal .map-modal-container {
  width: 80%;
  max-width: 480px;
  background-color: var(--default-bg);
  position: relative;
  z-index: 1000;
  padding: 32px;
  padding-top: 56px;
}

.map-modal .modal-close {
  cursor: pointer;
  position: absolute;
  right: 16px;
  top: 16px;
}

.map-modal .text-close {
  position: static;
  top: auto;
  right: auto;
  color: var(--teal);
  font-size: 16px;
  line-height: 36px;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
}

.map-modal .text-close img {
  margin-left: 12px;
}

.map-modal .map-content {
  font-size: 20px;
  line-height: 28px;
}

.map-modal h2 {
  font-size: 40px;
  line-height: 44px;
  color: var(--buttercup);
  margin: 0;
  font-weight: normal;
}


@media only screen and (min-width: 769px) {

  .map-animation {
    max-width: 100%;
    flex: 0 0 45%;
    margin: 0;
  }

  .map-wrapper {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    padding: 32px 0;
    max-width: 1100px;
    margin: auto;
  }

  .map-description {
    flex: 0 0 30%; /* Was 45% */
    padding: 60px 10px; /* Was 60px */
    margin: 0;
  }

  .map-description .map-premises,
  .map-description .map-areas,
  .map-description .map-regional,
  .map-description .map-local,
  .map-description .map-footer {
    max-width: 100%;
  }

  .map-description span svg {
    right: -25px;
    top: -5px;
    width: 20px;
    height: 20px;
  }

  .internal-content .wp-block-group__inner-container .map-description h2 {
    font-size: 52px;
    line-height: 44px;
    margin-bottom: 0;
  }

  .placeholder {
    display: flex;
  }

  .phase-line {
    display: none;
  }

  .animation-content {
    width: 1168px;
    min-height: 1260px;
  }

  .content-wrapper {
    max-width: 1200px;
    padding: 0 16px;
  }

  .phase {
    width: 380px;
    margin-bottom: 0;
  }

  .phase-circle {
    width: 290px;
    height: 300px;
  }

  .phase .circle span {
    width: 18px;
    height: 18px;
  }

  .phase-1 .phase-image img {
    width: 94px;
    height: 120px;
  }

  .phase-2 .phase-image img {
    width: 75px;
    height: 107px;
  }

  .phase-3 .phase-image img {
    width: 97px;
    height: 95px;
  }

  .phase-4 .phase-image img {
    width: 85px;
    height: 86px;
  }

  .phase-5 .phase-image img {
    width: 117px;
    height: 117px;
  }

  .phase-number {
    font-size: 16px;
    line-height: 20px;
    padding-top: 25px;
    padding-bottom: 5px;
  }

  .phase-title {
    font-size: 28px;
    line-height: 32px;
    padding-top: 10px;
  }

  .phase-description {
    font-size: 20px;
    line-height: 28px;
    background-size: 5px 34px;
    margin-top: 16px;
    padding-top: 50px;
    max-width: 380px;
  }

  .phase-2 .circle svg {
    transform: rotate(-150deg);
  }

  .phase-animation {
    max-width: 1200px;
    min-height: 2300px;
  }

  .content-wrapper {
    max-width: 1200px;
  }

  .phase-1 {
    position: absolute;
    left: 5%;
    top: 0;
  }

  .phase-2 {
    position: absolute;
    left: 778px;
    top: 225px;
  }

  .phase-3 {
    position: absolute;
    left: 150px;
    top: 760px;
  }

  .phase-4 {
    position: absolute;
    left: 638px;
    top: 1150px;
  }

  .phase-5 {
    position: absolute;
    left: 0;
    top: 1520px;
  }

  .phase-1 .circle span {
    top: 140px;
    right: -10px;
  }

  .phase-2 .circle span {
    top: 62px;
    left: 8px;
  }

  .phase-3 .circle span {
    top: 36px;
    right: 36px;
  }

  .phase-4 .circle span {
    top: 40px;
    right: 32px;
  }

  .phase-5 .circle span {
    top: 176px;
    right: -4px;
  }

  .line-1 {
    display: block;
    position: absolute;
    top: 144px;
    left: 440px;
    width: 425px;
    background-image: url('./media/animations/line-1.svg');
    background-repeat: no-repeat;
    background-size: 425px auto;
    height: 340px;
  }

  .line-1.grow-right.play {
    width: 425px;
  }

  .line-2 {
    display: block;
    position: absolute;
    left: 418px;
    top: 293px;
    background-image: url('./media/animations/line-2.svg');
    background-repeat: no-repeat;
    background-size: 360px auto;
    width: 360px;
    height: 500px;
  }

  .line-2.grow-down.play {
    height: 500px;
  }

  .line-3 {
    display: block;
    position: absolute;
    left: 480px;
    top: 805px;
    background-image: url('./media/animations/line-3.svg');
    background-repeat: no-repeat;
    background-size: 475px auto;
    width: 475px;
    height: 380px;
  }

  .line-3.grow-right.play {
    width: 475px;
  }

  .line-4 {
    display: block;
    position: absolute;
    left: 350px;
    top: 1198px;
    background-image: url('./media/animations/line-4.svg');
    background-repeat: no-repeat;
    background-size: 808px auto;
    background-position: top right;
    width: 808px;
    height: 550px;
  }

  .phase .fade-in {
    opacity: 0;
  }

  .phase.play .fade-in {
    animation: fadeIn 1.5s normal forwards;
  }

  .grow-right {
    width: 0px;
  }

  .grow-right.play {
    transition: width 1s ease-in-out;
  }

  .grow-down {
    height: 0px;
  }

  .grow-down.play {
    transition: height 1s ease-in-out;
  }

  .complex-grow {
    left: 1158px;
    width: 0;
    height: 50px;
  }

  .complex-grow.play {
    animation: complexGrow 1s normal forwards;
  }

  .phase .circle svg path {
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
  }

  .phase.play .circle svg path {
    animation: circle 1s normal forwards;
    animation-delay: 0.2s;
  }


}

@media only screen and (min-width: 769px) and (max-width: 1199px) {
  .phase-animation {
    max-width: 768px;
    min-height: 1260px;
  }

  .animation-content {
    position: relative;
    transform: scaleX(0.6) scaleY(0.6) translateX(-50%);
    transform-origin: 0 0;
    left: 50%;
  }
}

@media only screen and (min-width: 1200px) {
  .animation-content {
    transform: none;
    min-height: 2100px;
  }

  .content-wrapper {
    max-width: 1200px;
  }

  .numbers-heading {
    font-size: 40px;
    line-height: 44px;
  }

  .numbers {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: center;
    opacity: 0;
  }

  .numbers.play {
    opacity: 1;
    transition: all 1s ease-in-out;
  }

  .numbers li {
    padding: 28px 14px;
    flex: 1 1 33%;
  }

  .numbers .title {
    max-width: 180px;
    margin: auto;
    margin-top: 12px;
  }
}

@keyframes fadeIn {
  0% { opacity: 0; }
  100% { opacity: 1; }
}

@keyframes complexGrow {
  0% { height: 0; width: 150px; left: 1008px; }
  50% { height: 500px; width: 150px; left: 1008px;  }
  100% { height: 550px; width: 808px; left: 350px; }
}

@keyframes circle {
  0% { stroke-dashoffset: 1000; }
  100% { stroke-dashoffset: 0; }
}

@keyframes regions1 {
  0% { opacity: 0; transform: scale(0.5); }
  45% { opacity: 1; transform: scale(0.5);}
  100% { opacity: 1; transform: scale(25); }
}

@keyframes regions2 {
  0% { opacity: 0; transform: scale(1); }
  45% { opacity: 1; transform: scale(1);}
  100% { opacity: 1; transform: scale(25); }
}

@keyframes regions3 {
  0% { opacity: 0; transform: scale(1.5); }
  45% { opacity: 1; transform: scale(1.5);}
  100% { opacity: 1; transform: scale(25); }
}

#mobile-header .menu-toggle {
    display: flex !important;
    justify-content:end;
}
.menu-toggle .gp-icon + .mobile-menu {
    display: none;
}