:root {
        --text: #565656;
--links: #007f33;
--titles: #00402A;
--page-background: #dcebe1;
--highlight: #00a443;
--boxes-background: #fff5ec;
--boxes-border: #CBD2DB;
--section-titles: #007F33;
--section-titles-background: #DCEBE1;
--header-background: #DCEBE1;
--header-links: #00402A;
--footer-background: #DCEBE1;
--footer-links: #00402A;
--titles-font-family: "IberPangea VAR", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
--titles-h1-font-size: 2.2143rem;
--titles-h1-font-weight: 700;
--titles-h1-color: #00402A;
--titles-h2-font-size: 1.5714rem;
--titles-h2-font-weight: 700;
--titles-h2-color: #00402A;
--titles-h3-font-size: 1.2857rem;
--titles-h3-font-weight: 700;
--titles-h3-color: #00402A;
--texts-font-family: "IberPangea VAR", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
--texts-primary-font-size: 1.1429rem;
--texts-primary-color: #565656;
--texts-secondary-font-size: 1.0000rem;
--texts-secondary-color: #565656;
--texts-link-color: #007f33;
    }
    
:root { --react-body-font-family: "IberPangea VAR", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }

/* ================= FONT SETUP ================= */
@font-face {
	font-family: 'IberPangea';
	src: url('https://s3-eu-west-1.amazonaws.com/aws-ec2-eu-1-opendatasoft-staticfileset/spenergynetworks/theme_font/IberPangeaVAR.woff2') format('woff2');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

/* Apply globally + override ODS */
:root {
	--font-family-base: 'IberPangea', Arial, sans-serif;
}

body,
.ods-app,
button,
input,
select,
textarea,
h1,
h2,
h3,
h4,
h5,
h6 {
	font-family: 'IberPangea', Arial, sans-serif !important;
}

/* DESKTOP SPECIFICS - STYLE OF ODS HEADER========================================================================== */
.ods-front-header {
	width: 100%;
	position: fixed;
	z-index: 1021;
	background-color: #fff;
	box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.06);
}

.ods-responsive-menu-collapsible__content {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.ods-front-header__portal-brand {
	display: flex;
	height: 40px;
	position: relative;
	top: 0;
}

.ods-front-header__menu-item-link.main {
	padding: 0;
	color: #16A34A;
	opacity: 1;
	font-size: 18px;
	font-weight: 500;
}

.ods-front-header__menu-item-link.main span {
	padding: 0 12px;
}

.ods-front-header__menu-item-link.main:hover span {
	background-color: #16A34A;
	color: #fff;
	padding: 6px 12px;
	border-radius: 8px;
}

.ods-front-header__menu-item-link span {
	white-space: nowrap;
}

.dropdown-menu-content a {
	color: #565656 !important;
	padding: 0px !important;
	font-size: 14px !important;
	line-height: 35px !important;
}

.ods-front-header__management-menu {
	position: relative;
	flex: 0 0 auto;
	display: flex;
	right: 0px;
}

.ods-front-header__management-menu-item {
	flex-shrink: 0;
}

.dropdown-menu-content {
	text-align: left;
	background-color: #fff !important;
	border: 1px solid #00000014;
	border-radius: 8px;
}

.ods-front-header__reciteme-button {
	display: inline-flex;
	height: 55px;
	align-items: center;
	padding: 7px 0;
}

/* MOBILE SPECIFICS - STYLE OF ODS HEADER========================================================================== */
.ods-responsive-menu-placeholder.ods-responsive-menu-placeholder--active {
	height: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.ods-responsive-menu--collapsed .ods-responsive-menu-collapsible__content {
	-webkit-box-align: start;
	-ms-flex-align: start;
	align-items: flex-start;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
}

.ods-responsive-menu-collapsible--collapsed .ods-front-header__logo {
	display: none;
}

.ods-responsive-menu-collapsible--collapsed .ods-front-header__menu,
.ods-responsive-menu-collapsible--collapsed .ods-front-header__management-menu {
	width: 100%;
}

.ods-responsive-menu-collapsible--collapsed .ods-front-header__management-menu {
	padding: 30px 20px;
}

.ods-responsive-menu-collapsible--collapsed .ods-front-header__management-menu-item--backoffice {
	border-radius: 8px;
}

.ods-responsive-menu-collapsible--collapsed .ods-front-header__reciteme-button {
	margin: 9px 0;
}

/* DESKTOP SPECIFICS - STYLE OF DROPDOWN MENU  ; ========================================================================== */
.dropdown-menu-content {
	position: absolute;
	background-color: #DCEBE1;
	filter: drop-shadow(0px 14px 8px rgba(37, 48, 59, 0.1));
	z-index: 1;
	padding: 10px 20px;
	min-width: 150px;
}

.dropdown-menu-content a {
	color: #007f33;
	text-decoration: none;
	display: block;
	opacity: 1;
	padding: 5px;
	font-size: 1.2rem;
	line-height: 35px;
}

.dropdown-menu-content a:hover {
	color: #007f33 !important;
	text-decoration: none;
}

/* MOBILE SPECIFICS - STYLE OF DROPDOWN MENU========================================================================== */
/* Accessibility button : Overrides the ReciteMe button to the same background color as the Back-office button. */
.ods-front-header__reciteme-button .rods-button {
	background-color: var(--front-office__domain-style__button__primary__default__background) !important;
	color: var(--front-office__domain-style__button__primary__default__text) !important;
}

.ods-front-header__reciteme-button {
	position: inherit;
}

/* POPIN ========================================================================== */
.popin {
	z-index: 10;
	position: fixed;
	display: flex;
	justify-content: center;
	align-content: center;
	align-items: center;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.popin .popin-bg {
	width: 100%;
	height: 100%;
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
}

.popin .popin-content {
	background: #FFF;
	width: 50%;
	height: auto;
	position: absolute;
	border-radius: 0.625rem;
	box-shadow: rgba(34, 197, 94, 0.4) 0px 0px 0px 2px, rgba(34, 197, 94, 0.15) 0px 10px 25px;
}

.popin .popin-content .header {
	display: flex;
	padding: 20px;
	justify-content: space-between;
	/*align-items: center;*/
	border-bottom: 1px solid rgb(156 163 175);
}

.popin .popin-content .header .title {
	font-size: 24px;
	color: #16A34A;
}

.popin .popin-content .description {
	font-size: 16px;
	padding: 20px;
}

.popin-content .btn-container {
	width: 100%;
	padding: 20px;
	display: flex;
	justify-content: center;
	gap: 16px;
	flex-wrap: wrap;
}

.popin-content .box-btn {
	padding: 8px 16px;
	border-radius: 9999px;
	border: 2px solid #16A34A;
	background: #16A34A;
	align-content: center;
	text-align: center;
	cursor: pointer;
	outline: none;
	box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px;
	transition: color 0.2s;
	width: fit-content;
}

.popin-content .box-btn a {
	font-size: 16px;
	font-weight: 700;
	color: white;
}

.popin-content .box-btn a:hover {
	text-decoration: none;
	color: black;
}

.popin-content .box-btn .btn-hover {
	display: none;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	padding: 20px;
	font-size: 14px;
	color: #565656;
}

.popin-content .box-btn:hover .btn-hover {
	display: block;
}

.ods-pop-in {
	z-index: 1000;
}

/* PORTAL ========================================================================== */
main {
	padding-top: 60px !important;
}

/* CATALOG ========================================================================== */
.JPfOh4yNzXLA_hpQ490Z.bA52P6cV06oSiEcmfI3A {
	top: 60px !important;
}

.jryzWUEEnNzygNtWNlV2 {
	margin-top: 60px;
}

/* RESPONSIVE========================================================================== */
@media (max-width: 1514px) {
	.popin-content .box-btn .btn-hover {
		padding: 85px;
	}
}

@media (max-width: 1295px) {
	.ods-front-header__menu-item-link.main {
		font-size: 14px;
	}

	.ods-front-header__menu-item-link.main:hover span {
		padding: 3px 6px;
	}

	.ods-front-header__menu-item-link.main span {
		padding: 0px 6px;
	}
}

@media (max-width: 795px) {
	.popin-content .box-btn .btn-hover {
		display: none;
	}
}

@media (max-width: 1053px) {
	.ods-front-header__management-menu {
		flex-direction: column;
		align-items: end;
	}
}

@media screen and (min-width: 1000px) {
	.dropdown-menu-content {
		display: none;
	}

	.dropdown-menu:hover .dropdown-menu-content {
		display: block;
	}

	.dropdown-menu:hover .ods-front-header__menu-item-link {
		opacity: 1;
	}
}

@media screen and (max-width: 1000px) {
	.dropdown-menu-content {
		position: relative;
		padding-left: 25px;
		filter: none;
	}
}