:root {
    font-size: 13px;
}

html,
body {
	background: var(--white);
	font-family: var(--font-family);
	font-weight: 300;
	letter-spacing: 0;
	padding: 0;
	margin: 0;
	color: var(--darkblue);
	overflow-x: hidden;
}
html.lock,
body.lock {
	overflow: hidden;
}

body {
	margin-top: 53px;
}

@media(min-width: 768px) {
	:root {
		font-size: 14px;
	}
	
	body {
		margin-top: 63px;
	}
}

@media(min-width: 992px) {
	:root {
		font-size: 16px;
	}

	body {
		margin-top: 0;
	}
}


a, a:hover, a:focus,
button, button:hover, button:focus {
	transition: all ease-in-out .2s;
	-moz-transition: all ease-in-out .2s;
	-webkit-transition: all ease-in-out .2s;
	text-decoration: none;
	cursor: pointer;
	color: currentColor;
	outline: none;
	box-shadow: none;
}
*:focus {
	outline: none;
	box-shadow: none;
}
*::placeholder, *::-webkit-placeholder {
	color: currentColor;
}
*:-ms-input-placeholder {
	color: currentColor;
}


.container,
.container-fluid {
	position: relative;
	width: 100%;
	padding: 0 20px;
}
.container.container-full {
	max-width: 1700px; /* Layouts' fullscreen */
}

@media(min-width: 1200px) {
	.container {
		max-width: 1084px; /* 1084 + 40 padding */
	}
	
	.container.container-sm {
		max-width: 810px; /* 770 + 40 padding */
	}
	.container.container-md {
		max-width: 920px; /* 880 + 40 padding */
	}
	.container.container-lg {
		max-width: 1240px; /* 1200 + 40 padding */
	}
}


/*************************************/
/********** BUTTONS / LINKS **********/
/*************************************/


.button,
.button:hover,
.button:focus {
	display: inline-block;
    padding: 14px 25px;
	font-size: 10px;
	font-weight: bold;
    color: var(--darkblue);
    letter-spacing: .1em;
	text-transform: uppercase;
    position: relative;
    border: 2px solid transparent;
}
.button::before {
	content: "";
	position: absolute;
	top: -2px;bottom: -2px;
	left: -2px;right: -2px;
	border: 2px solid var(--darkblue);
    transition: var(--transition);
    -webkit-transition: var(--transition);
    will-change: transform;
    pointer-events: none;
}
.button:hover::before,
.button:hover::after {
	transform: scale(1.05);
}
.button.button-white {
	color: var(--lightgrey);
}
.button.button-white::before {
	border-color: var(--lightgrey);
}
.button.button-red {
	color: var(--red);
}
.button.button-red::before {
	border-color: var(--red);
}
.button.button-yellow {
	color: var(--yellow);
}
.button.button-yellow::before {
	border-color: var(--yellow);
}
.button.button-green {
	color: var(--green);
}
.button.button-green::before {
	border-color: var(--green);
}
.button.button-purple {
	color: var(--purple);
}
.button.button-purple::before {
	border-color: var(--purple);
}
.button.button-pink {
	color: var(--pink);
}
.button.button-pink::before {
	border-color: var(--pink);
}


.button.button-fill {
	border: none;
	color: var(--lightgrey);
}
.button.button-fill::before {
	top: 0;bottom: 0;
	left: 0;right: 0;
	border: none;
	background-color: var(--darkblue);
}
.button.button-fill.button-white {
	color: var(--darkblue);
}
.button.button-fill.button-white::before {
	background-color: var(--lightgrey);
}
.button.button-fill.button-red::before {
	background-color: var(--red);
}
.button.button-fill.button-yellow::before {
	background-color: var(--yellow);
}
.button.button-fill.button-green::before {
	background-color: var(--green);
}
.button.button-fill.button-purple::before {
	background-color: var(--purple);
}
.button.button-fill.button-pink::before {
	background-color: var(--pink);
}

.button > span {
	position: relative;
	z-index: 2;
	font-size: inherit !important;
	color: inherit !important;
}


@media(min-width: 992px) {
    .button,
	.button:hover,
	.button:focus {
		padding: 17px 30px;
        font-size: 11px;
	}
}


.link {
	display: inline-block;
	position: relative;
	font-size: 10px;
	font-weight: 400;
	color: var(--grey);
	letter-spacing: .075em;
	line-height: 1;
	text-transform: uppercase;
	padding-right: 30px;
}
.link.darkblue,
.link.darkblue:hover, 
.link.darkblue:focus {
	color: var(--darkblue);
}
.link.yellow,
.link.yellow:hover, 
.link.yellow:focus {
	color: var(--yellow);
}
.link.white,
.link.white:hover, 
.link.white:focus {
	color: white;
}
.link.link-lg {
	font-size: 12px;
	font-weight: 600;
	padding-right: 40px;
}
.link:hover,
.link:focus {
	color: var(--darkblue);
}

.link::after {
	content: "";
	width: 13px;
	height: 9px;
	position: absolute;
	top: -2px;bottom: 0;
	right: 0;
	margin: auto;
	background-image: url(/assets/img/arrow-link-grey.svg);
	background-size: cover;
	background-position: -13px;
	transition: all .4s ease-in-out;
}
.link.darkblue::after {
	background-image: url(/assets/img/arrow-link-darkblue.svg);
}
.link.yellow::after {
	background-image: url(/assets/img/arrow-link-yellow.svg);
}
.link.white::after {
	background-image: url(/assets/img/arrow-link-white.svg);
}
.link.link-lg::after {
	width: 22px;
	height: 15px;
	background-position: -22px;
}
.link.link-reverse::after {
	right: auto;
	left: 0;
	transform: rotate(180deg);
}
.link:hover::after,
.link:focus::after {
	background-position: 13px;
}
.link.link-lg:hover::after,
.link.link-lg:focus::after {
	background-position: 22px;
}

.link.link-plus::before,
.link.link-plus::after {
	content: "";
	width: 20px;
	height: 1px;
	position: absolute;
	top: -2px;bottom: 0;
	right: 0;
	margin: auto;
	background: var(--red);
	transition: var(--transition);
	pointer-events: none;
}
.link.link-plus::after {
	transform: rotate(90deg);
}
.link.link-plus:hover::before,
.link.link-plus:focus::before {
	transform: rotate(90deg);
}
.link.link-plus:hover::after,
.link.link-plus:focus::after {
	transform: rotate(180deg);
}

.link.link-plus.link-plus-top {
	padding-right: 0;
	padding-top: 38px;
	margin-top: 25px;
}
.link.link-plus.link-plus-top::before,
.link.link-plus.link-plus-top::after {
	width: 2px;
	height: 27px;
	top: 0;
	left: 0;right: 0;
	bottom: auto;
}


@media(min-width: 768px) {
	.link.link-plus.link-plus-top {
		padding-top: 40px;
		margin-top: 30px;
	}
    .link.link-plus.link-plus-top::before,
	.link.link-plus.link-plus-top::after {
		height: 30px;
	}
}

@media(min-width: 992px) {
	.link.link-plus.link-plus-top {
		padding-top: 45px;
	}
    .link.link-plus.link-plus-top::before,
	.link.link-plus.link-plus-top::after {
		height: 35px;
	}
}


/*********************************/
/********** DASHED SPAN **********/
/*********************************/

span.dashed {
	display: block;
	position: relative;
    font-size: 9px;
    font-weight: bold;
	color: var(--grey);
	letter-spacing: .15em;
	line-height: 1;
	text-transform: uppercase;
	margin-bottom: 15px;
	padding-left: 40px;
}
span.dashed::before {
	content: "";
	position: absolute;
	bottom: 3px;left: 0;
	width: 30px;
	height: 1px;
	background-color: var(--grey);
}


@media(min-width: 768px) {
	span.dashed {
		font-size: 11px;
		margin-bottom: 20px;
		padding-left: 45px;
	}
	span.dashed::before {
		bottom: 4px;
		width: 35px;
	}
}


/****************************/
/********** HEADER **********/
/****************************/

header {
	position: fixed;
	width: 100vw;
	top: 0;left: 0;right: 0;
	margin: auto;
	background-color: var(--white);
	font-size: 0;
	transition: var(--transition);
	z-index: 10;
}
body.index header {
	background-color: #eeeeee;
}
header.open {
	z-index: 12;
}

header .container {
	padding: 0;
	max-width: 1500px;
}

header .upper,
header .lower .social,
header .lower .language,
header .lower .social,
header .lower .search {
	transform: translateX(100vw);
	transition: var(--transition);
}
header.open .upper,
header.open .lower .social,
header.open .lower .language,
header.open .lower .social,
header.open .lower .search {
	transform: translateX(0);
}

/********** HEADER LOWER SECTION **********/

header .upper {
	position: fixed;
	top: 53px;left: 0;
	width: 100vw;
	max-width: 100%;
	height: calc(100% - 53px);
	background-color: var(--white);
	padding-top: 160px;
}

header .upper ul {
	display: block;
	padding: 0 30px;
	margin: 0;
	height: 100%;
	overflow: auto;
}
header.open .upper ul {
	transform: none;
}

header .upper ul li {
	display: block;
	position: relative;
    padding-bottom: 8px;
}

header .upper ul li h2 {
    font-size: 14px;
    font-weight: 600;
    color: var(--darkgrey);
    letter-spacing: .08em;
    text-transform: uppercase;
    margin: 0;
}
header .upper ul li h2 a {
	position: relative;
	display: inline-block;
}
header .upper ul li:hover h2 a,
header .upper ul li:focus h2 a,
header .upper ul li.selected h2 a {
    color: var(--black);
}

header .upper ul li.sub ul {
	display: block;
	padding: 15px;
	transition: var(--transition);
	z-index: 1;
}

header .upper ul li.sub ul li {
	padding: 0;
}
header .upper ul li.sub ul li + li {
	margin-top: 13px;
}

header .upper ul li.sub ul li h3 {
	font-size: 12px;
    font-weight: 600;
	color: #b2b3b3;
	white-space: nowrap;
    margin: 0;
}
header .upper ul li.sub ul li h3 a {
	position: relative;
	display: block;
	font-size: inherit;
}
header .upper ul li.sub ul li:hover h3 a,
header .upper ul li.sub ul li:focus h3 a,
header .upper ul li.sub ul li.selected h3 a {
	color: var(--black);
}

/********** HEADER LOWER SECTION **********/

header .lower {
	position: relative;
	display: flex;
    align-items: center;
	padding-left: 20px;
	z-index: 1;
}

header .lower .logo img {
	height: 36px;
}
header .lower .logo + div,
header .lower .menu-toggle {
	margin-left: auto;
}

/********** HEADER LOWER SOCIAL **********/

header .lower .social,
header .lower .language {
	position: fixed;
    left: 30px;
    top: 150px;
	font-size: 0;
}

header .lower .social a,
footer .social a {
	display: inline-block;
	font-size: 13px;
	line-height: 1;
}
header .lower .social a:hover,
header .lower .social a:focus,
footer .social a:hover,
footer .social a:focus  {
	transform: scale(1.1)
}
header .lower .social a + a,
footer .social a + a {
	margin-left: 18px;
}

/********** HEADER LOWER LANGUAGE **********/

header .lower .language {
	left: auto;
	right: 30px;
}
header .lower .language a {
	font-family: var(--font-family-2);
	font-size: 10px;
	font-weight: 400;
	letter-spacing: .2em;
	line-height: 1;
	color: var(--darkblue);
	text-transform: uppercase;
	opacity: .35;
}
header .lower .language a + a {
	margin-left: 12px;
}
header .lower .language a:hover,
header .lower .language a:focus,
header .lower .language a.selected {
	opacity: 1;
}

/********** HEADER LOWER SEARCH **********/

header .lower .search {
	position: fixed;
	top: 53px;left: 0;
	width: 100%;
}
header .lower .search form {
	position: relative;
}

header .lower .search form input {
	background-color: #dddddd;
	border: none;
	padding: 26px 30px;
	padding-right: 85px;
	width: 100%;
	font-family: var(--font-family-2);
	font-size: 10px;
	font-weight: 400;
	color: var(--darkblue);
	letter-spacing: 0.2em;
	text-transform: uppercase;
}

header .lower .search form button {
	position: absolute;
	top: 0;bottom: 0;
	right: 30px;
	margin: auto;
	width: 17px;
	height: 16px;
	padding: 0;
	background-color: transparent;
	border: none;
	border-radius: 0;
	background-image: url(/assets/img/lupe-darkblue.svg);
	background-repeat: no-repeat;
}

/********** HEADER LOWER MENU TOGGLE **********/

header .lower .menu-toggle {
	position: relative;
	width: 43px;
	height: 53px;
	background-color: var(--red);
}

header .lower .menu-toggle span {
	position: absolute;
	top: 0;bottom: 0;
	left: 0;right: 0;
	margin: auto;
	width: 20px;
	height: 1px;
	background-color: white;
	transition: var(--transition);
}
header .lower .menu-toggle span:first-child {
	transform: translateY(-4px);
}
header .lower .menu-toggle span:last-child {
	transform: translateY(4px);
}
header.open .lower .menu-toggle span:first-child {
	transform: rotate(45deg);
}
header.open .lower .menu-toggle span:last-child {
	transform: rotate(-45deg);
}


@media(min-width: 768px) {
	header .upper {
		top: 63px;
		height: calc(100% - 63px);
		padding-top: 260px;
	}


	header .lower .logo img {
		height: 50px;
	}

	header .lower .social,
	header .lower .language {
		top: 200px;
	}

	header .lower .search {
		top: 63px;
	}

	header .lower .menu-toggle {
		width: 48px;
		height: 63px;
	}
}

@media(min-width: 992px) {
	header {
		position: relative;
	}

	header .upper,
	header .lower .social,
	header .lower .language,
	header .lower .social,
	header .lower .search {
		transform: none;
	}

	header .upper {
		background-color: var(--green);
		position: fixed;
		top: 0;left: 0;
		padding-top: 0;
		height: auto;
		z-index: 10;
	}
	header .upper ul {
		padding: 0;
		display: flex;
		align-items: center;
		justify-content: center;
		height: auto;
		overflow: initial;
	}
	header .upper ul li {
		padding: 0;
	}
	header .upper ul li h2 {
		color: #eeeeee;
	}
	header .upper ul li h2 a {
		position: relative;
		display: inline-block;
		padding: 14px 40px;
	}
	header .upper ul li:hover h2 a,
	header .upper ul li.active h2 a {
		color: #eeeeee;
		background-color: #02857e;
	}

	header .upper ul li.sub ul {
		position: absolute;
		top: 100%;
		left: 0;
		min-width: 100%;
		padding: 23px 25px;
		background-color: #02857e;
		opacity: 0;
		pointer-events: none;
		transition: var(--transition);
		z-index: 1;
	}
	header .upper ul li.sub:hover ul {
		opacity: 1;
		pointer-events: auto;
	}
	header .upper ul li.sub ul li h3 {
		color: #5fe5de;
		font-weight: 400;
	}
	header .upper ul li.sub ul li:hover h3 a,
	header .upper ul li.sub ul li.active h3 a {
		color: white;
	}

	header .lower {
		margin-top: 44px;
		padding-top: 30px;
	}
	header .lower .logo img {
		height: 67px;
		transition: var(--transition);
	}

	header .lower .social,
	header .lower .language,
	header .lower .search {
		position: static;
	}

	header .lower .search input {
		transition: var(--transition);
	}

	header .lower .language {
		margin: 0 40px;
	}
	
	header .lower .search {
		position: static;
		width: auto;
	}
}

/********************************************/
/********** NEWSLETTER BAR SECTION **********/
/********************************************/

.newsletter-bar {
	position: relative;
	background-color: rgba(241, 168, 0, .09);
	padding: 75px 0 40px;
}

.newsletter-bar .container {
	position: static;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.newsletter-bar .container p,
.newsletter-bar .container a.link {
	font-size: 1.625rem;
	font-weight: 600;
}
.newsletter-bar .container p {
	color: var(--darkblue);
	line-height: 1.25;
	margin-bottom: 10px;
}
.newsletter-bar .container span {
	display: block;
	font-size: 1.125rem;
	font-weight: 400;
	line-height: 1;
}
.newsletter-bar .container a.link {
	margin-top: 20px;
	text-transform: none;
	letter-spacing: normal;
}

.newsletter-bar .goto-top {
	position: absolute;
	top: 0;
	transform: translateY(-30%);
	left: 20px;
	width: 48px;
	height: 70px;
	z-index: 1;
}
.newsletter-bar .goto-top::before {
	content: "";
	position: absolute;
	top: 0;bottom: 0;
	left: 0;right: 0;
	background-color: var(--yellow);
	transform: skewY(30deg);
	transform-origin: top right;
}

.newsletter-bar .goto-top span {
	position: absolute;
	top: -28px;bottom: 0;
	left: 0;right: 0;
	width: 23px;
	height: 13px;
	margin: auto;
	transition: var(--transition);
}
.newsletter-bar .goto-top span::before,
.newsletter-bar .goto-top span::after {
	content: "";
    width: 18px;
    height: 2px;
    position: absolute;
    top: 0;bottom: 0;
    right: 0;left: 0;
    margin: auto;
    background: white;
    pointer-events: none;
}
.newsletter-bar .goto-top span::before {
	transform: rotate(-45deg);
	left: -11px;
}
.newsletter-bar .goto-top span::after {
	transform: rotate(45deg);
	right: -11px;
}

.newsletter-bar .goto-top:hover span,
.newsletter-bar .goto-top:focus span {
	transform: translateY(-5px);
}


@media(min-width: 768px) {
	.newsletter-bar .container {
		position: relative;
		flex-direction: initial;
		padding-left: 80px;
	}

	.newsletter-bar .container p {
		line-height: 1;
		margin-bottom: 20px;
	}

	.newsletter-bar .container a.link {
		margin: 0;
		margin-left: auto;
	}

	.newsletter-bar .goto-top {
		left: 0;
	}
}

@media(min-width: 992px) {
	.newsletter-bar {
		padding: 60px 0;
	}

	.newsletter-bar .goto-top {
		top: 50%;
		transform: translateY(-50%);
		left: auto;right: calc(100% - 20px);
		width: 106px;
		height: 150px;
	}

	.newsletter-bar .goto-top span {
		top: -48px;
		width: 31px;
		height: 17px;
	}
	.newsletter-bar .goto-top span::before,
	.newsletter-bar .goto-top span::after {
		width: 22px;
	}
	.newsletter-bar .goto-top span::before {
		left: -15px;
	}
	.newsletter-bar .goto-top span::after {
		right: -15px;
	}
}


/****************************/
/********** FOOTER **********/
/****************************/

footer {
	position: relative;
	padding: 50px 0;
}

footer span {
	font-size: 10px;
	font-weight: 600;
	color: var(--black);
	letter-spacing: 0.1em;
	line-height: 3;
	text-transform: uppercase;
}

footer .container {
	text-align: center;
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	align-items: center;
}

footer .social {
	order: 1;
	font-size: 0;
	margin-top: 20px;
}

footer .w-100 {
	margin-top: 25px;
}

footer .w-100 + span,
footer span:last-child  {
	color: var(--grey);
}
footer span i {
	font-size: 0;
	display: block;
	font-style: normal;
}
footer span a:hover,
footer span a:focus {
	color: var(--darkblue);
}

footer span:last-child {
	margin-top: 20px;
	order: 2;
}
footer span:last-child a {
	font-weight: bold;
}


@media(min-width: 768px) {
	footer {
		padding: 60px 0;
	}

	footer span {
		line-height: 1.5;
	}
	footer .w-100 + span {
		flex: 1;
	}

	footer .container {
		text-align: left;
		flex-direction: initial
	}

	footer .container .social,
	footer span:last-child {
		margin: 0;
		margin-left: auto;
	}

	footer .social,
	footer span:last-child {
		order: initial;
	}

	footer span i {
		display: initial;
		font-size: inherit;
	}

	footer span:last-child {
		position: relative;
		top: -10px;
	}
}

@media(min-width: 992px) {
	
}


/*****************************************/
/********** CONTENT PAGE BANNER **********/
/*****************************************/

.content {
	position: relative;
	z-index: 1;
	margin-bottom: 70px;
}

.content .anchor + .anchor {
	padding-top: 40px;
}

.content .banner {
	position: relative;
	padding: 35px 0 45px;
}
.content .banner.banner-shape {
	padding: 30px 0 50px;
}
.content .banner.banner-shape.banner-shape-aligned {
	margin-bottom: 35px;
}
.content .anchor .banner:not(.baner-shape) {
	padding: 20px 0 30px;
}

.content .container > * {
	position: relative;
}

.content .banner.banner-shape.banner-shape-aligned .container {
	padding-left: 40px;
}

.content .banner.banner-shape .container::before {
	content: "";
	position: absolute;
	top: -15px;
	left: 0;
	width: 69px;
	height: 74px;
	background-color: var(--yellow);
	transform: skewY(-30deg);
	transform-origin: top right;
}
.content .banner.banner-shape.banner-shape-aligned .container::before {
	left: 20px;
}
.content .anchor .banner.banner-shape .container::before {
	top: -30px;
	background-color: var(--pink);
}

.content .banner .container div.multimedia-button {
	padding: 15px 30px;
	background-color: var(--yellow);
	width: 100%;
	text-align: center;
	margin-top: 35px;
}
.content .banner .container div.multimedia-button p {
	font-size: 1rem;
	font-weight: 400;
	color: var(--black);
	line-height: 1.3;
	margin: 0;
}
.content .banner .container div.multimedia-button p a {
	font-weight: 600;
	color: white;
	border-bottom: 1px solid currentColor;
}
.content .banner .container div.multimedia-button p a:hover,
.content .banner .container div.multimedia-button p a:focus {
	border-bottom-color: transparent;
}

.content .banner .image {
	position: relative;
	margin: 25px auto 0;
	padding: 0 20px;
}
.content .banner .image img {
	display: block;
	max-height: 80px;
	max-width: 100%;
	margin: 0 auto;
}


.content .banner h1,
.content .h1,
.content .template .h1,
.content .anchor .banner h2 {
	font-size: 2rem;
	font-weight: 600;
	margin: 0;
}
.content .banner h1 + h2 {
	font-size: 1rem;
	font-weight: bold;
	color: var(--green);
	text-align: center;
	margin: 0;
	margin-top: 10px;
}
.content .banner .image + h1 {
	text-align: center;
	margin-top: 30px;
}

.content .banner h1 ~ p {
	font-size: 1.25rem;
	font-style: italic;
	font-weight: 400;
	color: var(--black);
	line-height: 1.25;
	text-align: center;
	margin: 0;
	margin-top: 20px;
}
.content .banner h1 + p,
.content .banner h1 + div + p {
	margin-top: 40px;
}
.content .banner h1 + div {
	font-size: 0;
	margin-top: 20px;
}
.content .banner.banner-shape.banner-article h1 ~ p {
	text-align: left;
}

.content .banner ul,
.content .banner span {
	display: inline-block;
	font-size: 9px;
	font-weight: 600;
	letter-spacing: .1em;
	line-height: 1;
	color: var(--grey);
	text-align: center;
	text-transform: uppercase;
}
.content .banner ul {
	display: block;
	margin-bottom: 10px;
}
.content .banner span + span {
	margin-left: 15px;
}
.content .banner.banner-shape ul {
	margin-left: 60px;
	text-align: left;
}

.content .banner span.author {
	color: var(--black);
	margin-left: 20px;
}

.content .banner ul {
	padding: 0;
	list-style: none;
}
.content .banner ul li {
	display: inline-block;
}
.content .banner ul li a.disabled {
	pointer-events: none;
}
.content .banner ul li a:hover,
.content .banner ul li a:focus {
	color: var(--darkblue);
}


@media(min-width: 768px) {
	.content .anchor + .anchor {
		padding-top: 50px;
	}

	.content .banner {
		padding: 55px 0 70px;
	}
	.content .banner.banner-shape {
		padding: 40px 0 85px;
	}
	.content .anchor .banner {
		padding-bottom: 40px;
	}
	.content .banner.banner-shape.banner-shape-aligned {
		margin-bottom: 55px;
	}
	.content .anchor .banner.banner-shape {
		padding-bottom: 70px;
	}

	.content .banner .image {
		margin-top: 40px;
		padding: 0;
	}

	.content .banner.banner-shape.banner-shape-aligned .container {
		padding-left: 110px;
	}

	.content .banner.banner-shape .container::before {
		left: auto;right: calc(100% - 65px);
		width: 135px;
		height: 125px;
	}
	.content .banner.banner-shape.banner-shape-aligned .container::before {
		left: 20px;right: auto;
	}
	.content .anchor .banner.banner-shape .container::before {
		top: -50px;
		right: calc(100% - 85px);
		width: 115px;
		height: 110px;
	}
	
	.content .banner .container div.multimedia-button {
		padding-left: 90px;
		padding-right: 90px;
	}

	.content .banner h1,
	.content .h1,
	.content .template .h1,
	.content .anchor .banner h2 {
		font-size: 2.75rem;
	}
	.content .banner.banner-article h1 {
		font-size: 2.375rem;
	}
	.content .banner .image + h1 {
		margin-top: 40px;
	}

	.content .banner .container > div:last-child > div.multimedia-button {
		padding: 20px 40px;
		margin: -30px 0 30px;
	}

	.content .banner h1 ~ p {
		margin-top: 30px;
	}
	.content .banner h1 + p,
	.content .banner h1 + div + p {
		margin-top: 45px;
	}
	.content .banner h1 + div {
		margin-top: 25px;
	}

	.content .banner ul,
	.content .banner span {
		font-size: 11px;
	}
	.content .banner ul {
		margin-bottom: 15px;
	}
	.content .banner span + span {
		margin-left: 15px;
	}
	.content .banner.banner-shape ul {
		margin-left: 70px;
	}

	.content .banner .image img {
		max-height: 110px;
	}	
}

@media(min-width: 992px) {
	.content {
		min-height: calc(100vh - 141px - 184px - 175px - 70px);
	}
	.content .anchor + .anchor {
		padding-top: 70px;
	}

	.content .banner h1 {
		font-size: 2.9375rem;
	}

	.content .banner .image + div {
		margin-left: 40px;
	}
}


/*******************************************/
/********** CONTENT PAGE TEMPLATE **********/
/*******************************************/

.content .template {
	position: relative;
}

.content .template h2:first-child,
.content .template h3:first-child,
.content .template h4:first-child,
.content .template p:first-child,
.content .template ul:first-child,
.content .template ol:first-child,
.content .template blockquote:first-child {
	margin-top: 0;
}

.content .template h2:last-child,
.content .template h3:last-child,
.content .template h4:last-child,
.content .template p:last-child,
.content .template ul:last-child,
.content .template ol:last-child,
.content .template blockquote:last-child {
	margin-bottom: 0;
}

.content .template h2,
.content .template .h2,
.content .h2 {
	font-size: 2rem;
	font-weight: 500;
	color: var(--darkblue);
	line-height: 1.1675;
	margin: .5em 0;
}
.content .template h3,
.content .template .h3,
.content .h3 {
	font-size: 1.5rem;
	font-weight: bold;
	color: var(--darkblue);
	line-height: 1.4;
	margin: .75em 0;
}
.content .template h4,
.content .template .h4,
.content .h4 {
	font-size: 1.375rem;
	font-weight: 500;
	color: var(--darkblue);
	line-height: 1.5;
	margin: .75em 0;
}

.content .template p,
.content .template ul,
.content .template ol {
	font-size: 1rem;
	font-weight: 400;
    color: var(--black);
    line-height: 1.45;
    margin: 1.35em 0;
}
.template-module.red p, .template-module.red ul, .template-module.red p ol,
.template-module.yellow p, .template-module.yellow ul, .template-module.yellow ol,
.template-module.green p, .template-module.green ul, .template-module.green ol, 
.template-module.purple p, .template-module.purple ul, .template-module.purple ol,
.template-module.pink p,.template-module.pink ul, .template-module.pink ol,
.template-module.darkblue p,.template-module.darkblue ul, .template-module.darkblue ol {
	font-size: 1.1875rem;
	color: var(--darkblue);
}

.content .template * b,
.content .template * strong {
	font-weight: 600;
}

.content .template p a,
.content .template li a {
	font-weight: 600;
    color: var(--green);
    border-bottom: 1px solid currentColor;
    display: inline;
}
.content .template p a:hover,
.content .template li a:hover {
	border-bottom: 1px solid transparent;
}

.content .template p small {
	font-size: .75rem;
	font-weight: 500;
	color: #71757c;
}
.content .template p small b,
.content .template p small strong {
	color: var(--darkblue);
}

.content .template p big,
.content .template blockquote {
    font-size: 1.5rem;
	font-weight: 600;
	color: var(--black);
	line-height: 1.25;
}
.content .template p big {
	position: relative;
	display: inline-block;
	padding: 1em 0 1em 40px;
	z-index: 1;
}
.content .template p big::before {
	content: "";
	position: absolute;
	top: 0;left: 0;
	width: 75px;
	height: 110px;
	background-color: var(--purple);
	transform: skewY(-30deg);
	transform-origin: top right;
	z-index: -1;
}

.content .template blockquote {
	display: block;
	position: relative;
	text-align: center;
    margin: 1em 0;
}
.content .template blockquote p {
	font-size: inherit;
	font-weight: inherit;
	color: inherit;
}
.content .template blockquote small {
	font-family: var(--font-family-3);
    display: block;
    font-size: 10px;
	font-weight: bold;
	font-style: italic;
	color: var(--black);
	letter-spacing: .1em;
    margin-top: 15px;
}

.content .template ul,
.content .template ol {
	padding-left: 2em;
	list-style: none;
	margin: 1.5em 0;
}
.content .template ul li,
.content .template ol li {
	position: relative;
}
.content .template ul li p,
.content .template ol li p {
	margin: 0;
}
.content .template ul li::before {
	content: "";
	display: inline-block;
	height: 4px;
	width: 4px;
	margin-left: -2em;
	margin-right: calc(2em - 4px);
	background-color: var(--darkblue);
	border-radius: 100%;
	vertical-align: middle;
}

.content .template ol {
	counter-reset: item;
}
.content .template ol li {
	counter-increment: item;
}
.content .template ol li::before {
	content: counter(item) ".";
    font-weight: 600;
    color: var(--darkblue);
	display: inline-block;
	width: 2em;
	margin-left: -2em;
}

@media(min-width: 768px) {
	.content .template p big {
		padding: 1.25em 0 1.25em 60px;
		min-height: 156px;
	}
	.content .template p big::before {
		width: 78px;
		height: 112px;
	}

	.content .template blockquote small {
		margin-top: 20px;
	}
}

@media(min-width: 992px) {
	.content .template h2,
	.content .h2 {
		font-size: 2.25rem;
	}
	.content .template blockquote {
		font-size: 1.75rem;
	}

	.content .template blockquote {
		margin: 1.5em 0;
	}
}


/***************************************************/
/********** CONTENT PAGE TEMPLATE SIDEBAR **********/
/***************************************************/

.content .template.has-sidebar .sidebar {
	position: relative;
	max-width: 240px;
	min-width: 240px;
	padding: 140px 0;
}
.content .template.has-sidebar .sidebar::before,
.content .template.has-sidebar .sidebar::after {
	content: "";
	position: absolute;
	width: 100%;
	height: 140px;
	background-color: var(--purple);
}
.content .template.has-sidebar .sidebar::before {
	top: 0;left: 0;
	transform: skewY(-30deg);
	transform-origin: top right;
}
.content .template.has-sidebar .sidebar::after {
	bottom: 0;left: 0;
	transform: skewY(-30deg);
	transform-origin: bottom left;
}

.content .template.has-sidebar .sidebar > div {
	position: relative;
	padding: 25px 45px;
	background-color: var(--purple);
	z-index: 1;
}

.content .template.has-sidebar .sidebar + div {
	flex: 1;
}

.content .template.has-sidebar .sidebar h2,
.content .template.has-sidebar .sidebar h3 {
	font-size: 1rem;
	font-weight: 500;
	color: white;
	letter-spacing: .1em;
	text-transform: uppercase;
	margin: 0;
}
.content .template.has-sidebar .sidebar h3 {
	font-size: 11px;
}
.content .template.has-sidebar .sidebar ul {
	padding: 0;
	margin: 0;
	margin-top: 20px;
}
.content .template.has-sidebar .sidebar ul li + li {
	margin-top: 10px;
}
.content .template.has-sidebar .sidebar ul li::before {
	display: none;
}
.content .template.has-sidebar .sidebar a {
	display: inline-block;
	position: relative;
	color: inherit;
	border: none;
}
.content .template.has-sidebar .sidebar li.active a {
	pointer-events: none;
}
.content .template.has-sidebar .sidebar li.active a::after {
	content: "";
	position: absolute;
	top: -2px;bottom: 0;
	right: -20px;
	width: 13px;
	height: 9px;
	margin: auto;
	background-image: url(/assets/img/arrow-sm-white.svg);
	background-size: contain;
	background-repeat: no-repeat;
}
.content .template.has-sidebar .sidebar a:hover,
.content .template.has-sidebar .sidebar a:focus {
	opacity: .5;
}


@media(min-width: 992px) {
	.content .template.has-sidebar .container {
		display: flex;
		align-items: flex-start;
	}
	
	.content .template.has-sidebar .sidebar + div {
		padding-left: 40px;
	}
}


/******************************************/
/********** COST BENEFIT SECTION **********/
/******************************************/

.cost-benefit {
	padding: 70px 0 50px;
	background-color: white;
}

.cost-benefit .row {
	margin: -25px;
}
.cost-benefit .row > div {
	padding: 25px;
}

.cost-benefit .row > div .bar {
	width: 100%;
	height: 5px;
	background-color: var(--darkblue);
}
.cost-benefit .row > div .bar span {
	display: block;
	position: relative;
	width: 0%;
	height: 100%;
	background-color: var(--green);
	transition: all .5s ease-in-out;
}
.cost-benefit .row > div .bar span::before {
	content: "";
	position: absolute;
	top: 50%;right: 0;
	transform: translate(50%, -50%);
	width: 35px;height: 37px;
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}
.cost-benefit .row > div .bar.cost span::before {
	background-image: url(/img/icon-cost.svg);
}
.cost-benefit .row > div .bar.benefit span::before {
	background-image: url(/img/icon-benefit.svg);
}

.cost-benefit .row > div p {
	font-size: 2rem;
	color: #a2a1a1;
	line-height: 1;
	margin: 0;
	margin-top: 20px;
}


@media(min-width: 768px) {
	.cost-benefit {
		padding: 90px 0 70px;
	}

	.cost-benefit .row {
		margin: 0 -50px;
	}
	.cost-benefit .row > div {
		padding: 0 50px;
	}

	.cost-benefit .row > div p {
		font-size: 2.25rem;
		margin-top: 30px;
	}
}

@media(min-width: 992px) {
	.cost-benefit {
		padding: 120px 0 90px;
	}

	.cost-benefit .row {
		margin: 0 -80px;
	}
	.cost-benefit .row > div {
		padding: 0 80px;
	}

	.cost-benefit .row > div p {
		margin-top: 40px;
	}
}


/*****************************************/
/********** CONTENT MAP SECTION **********/
/*****************************************/

.implementation-map {
	display: flex;
	flex-direction: column;
}

.implementation-map .map-container .map {
	padding-top: 103.33%;
	min-height: 100%;
}
.implementation-map .map-container .map * {
	box-sizing: content-box;
}
.implementation-map .map-container .map .gm-style-pbc ~ div div {
	background-size: cover;
}

.implementation-map .description {
	display: flex;
	align-items: center;
	padding: 50px 20px;
	background-color: var(--yellow);
}
.implementation-map .description .container {
	padding: 0;
	max-width: 400px;
}

.implementation-map .description span.dashed,
.implementation-map .description p {
	color: white;
}
.implementation-map .description p.h1 {
	margin-top: 15px;
	margin-bottom: 20px;
}
.implementation-map .description span.dashed::before {
	background-color: white;
}

.implementation-map .description .listing {
	margin-top: 30px;
}

.implementation-map .description .listing .button {
	font-size: 11px;
	text-align: center;
	padding-left: 30px;
	padding-right: 25px;
}
.implementation-map .description .listing .button:first-child {
	color: var(--yellow);
}

.implementation-map .description .listing .button span {
	padding-left: 30px;
	color: var(--pink) !important;
}
.implementation-map .description .listing .button span::before {
	content: "";
	position: absolute;
	top: 50%;left: 0;
	width: 17px;
	height: 27px;
	transform: translateY(-50%);
	background-image: url(/img/flag-pink.svg);
	background-size: contain;
	background-repeat: no-repeat;
}
.implementation-map .description .listing .button:first-child span {
	color: var(--yellow) !important;
}
.implementation-map .description .listing .button:first-child span::before {
	background-image: url(/img/flag-yellow.svg);
}

@media(min-width: 320px) and (max-width: 991px) {
	.implementation-map .description .listing .button {
		padding-top: 15px;
		padding-bottom: 15px;
	}
}
@media(min-width: 768px) {
	.implementation-map {
		flex-direction: initial;
		flex-wrap: wrap;
	}

	.implementation-map .description .listing .items {
		margin: -5px;
	}
	.implementation-map .description .listing .button {
		margin: 5px;
	}

	.implementation-map > div {
		max-width: 50%;
		flex-basis: 50%;
	}

	.implementation-map .description .listing {
		margin-top: 45px;
	}

	.implementation-map .description {
		padding: 80px 50px;
	}
	.implementation-map .description p.h1 {
		margin-top: 30px;
		margin-bottom: 35px;
	}
}

@media(min-width: 1200px) {
	.implementation-map .map-container .map {
		padding-top: 0;
		min-height: 620px;
	}

	.implementation-map .description {
		padding: 80px 50px;
	}

	.implementation-map .description .listing {
		margin-top: 60px;
	}
	.implementation-map .description .listing .button {
		width: calc(50% - 10px);
	}
}


/******************************************/
/********** CONTENT FORM SECTION **********/
/******************************************/

.form {
	padding: 50px 0;
	position: relative;
	background-color: var(--darkblue);
}
.form.white {
	max-width: 600px;
	margin: 0 auto;
	padding: 0;
	background-color: transparent;
}

.form h2,
.content .template .form .h2 {
	color: white;
	margin: 0;
	margin-bottom: 30px;
}

.form .row,
.form .row > .subform > .row {
	margin: -10px;
}
.form .row > div,
.form .row > .subform > .row > div {
    padding: 10px;
    font-size: 0;
}
.form .row > div .row {
	margin: -5px;
}
.form .row > div .row > div {
	padding: 5px;
}

.form .option-other {
	display: none;
}
.form .option-other.open {
	display: block;
}

.form label {
	display: block;
	font-size: 10px;
	font-weight: 500;
	color: white;
	letter-spacing: .15em;
	line-height: 1;
	text-transform: uppercase;
    margin: 10px 0 15px;
}
.form .option-other label {
	font-size: 12px;
	text-transform: none;
	letter-spacing: normal;
}
.form.white label {
	font-weight: 600;
	color: var(--darkblue);
}
.form label a {
	display: inline;
	border-bottom: 1px solid transparent;
}
.form label a:hover,
.form label a:focus {
	border-bottom: 1px solid currentColor;
}

.form .input-wrapper,
.form .select-wrapper {
    padding-top: 8px;
    position: relative;
}
.form .input-wrapper label,
.form .select-wrapper label {
    position: absolute;
    top: 0;
    transform: translateY(25px);
    pointer-events: none;
	transition: var(--transition);
	margin: 0;
}
.form .input-wrapper input:focus + label,
.form .input-wrapper input[placeholder] + label,
.form .input-wrapper textarea:focus + label,
.form .input-wrapper textarea[placeholder] + label,
.form .input-wrapper.filled label,
.form .select-wrapper input:focus + label,
.form .select-wrapper input[placeholder] + label,
.form .select-wrapper textarea:focus + label,
.form .select-wrapper textarea[placeholder] + label,
.form .select-wrapper.filled label {
	transform: translateX(0);
	font-size: 8px;
}

.form .select-wrapper::before {
	content: "";
	position: absolute;
	top: 8px;bottom: 0;
	right: 2px;
	margin: auto;
	width: 6px;height: 6px;
	border-bottom: 1px solid var(--white);
	border-right: 1px solid var(--white);
	transform: rotate(45deg);
	pointer-events: none;
}

.form input,
.form textarea,
.form select {
	appearance: none;
	-webkit-appearance: none;
	font-size: 12px;
	font-weight: 500;
	color: rgba(255, 255, 255, .5);
	line-height: 1;
	width: 100%;
	padding: 15px 0;
	background-color: transparent;
    border: none;
    border-bottom: 1px solid rgba(255, 255, 255, .3);
    resize: none;
	transition: var(--transition);
}
.form select {
	padding: 17px 0;
}
.form select option {
	background-color: var(--darkblue);
}
.form.white input,
.form.white textarea,
.form.white select {
	color: var(--darkblue);
	border-bottom-color: rgba(153, 151, 151, .3);
}
.form input.not-filled,
.form textarea.not-filled,
.form select.not-filled {
    border-bottom: 1px solid var(--warning);
}

.form .warning {
    font-size: .875rem !important;
    font-weight: 400 !important;
    color: var(--warning) !important;
    height: 20px;
    margin: 0;
    margin-top: 10px;
    line-height: 20px;
    padding-left: 35px;
    position: relative;
}
.form .warning::before {
    content: "!";
    position: absolute;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: var(--warning);
    border-radius: 100%;
    font-size: 16px;
    font-weight: 500;
    color: white;
    text-align: center;
}

.form .checkbox-wrapper {
	display: flex;
	align-items: center;
}

.form input[type='checkbox'],
.form input[type='radio'] {
	display: none;
}
.form input[type='checkbox'] + label,
.form input[type='radio'] + label {
	display: inline-block;
	vertical-align: middle;
	height: 22px;
	width: 22px;
	cursor: pointer;
	position: relative;
	border: 1px solid rgba(255, 255, 255, .3);
	transition: var(--transition);
	margin: 0;
}
.form input[type='radio'] + label {
	border-radius: 100%;
}
.form.white input[type='checkbox'] + label,
.form.white input[type='radio'] + label {
	border-color: rgba(153, 151, 151, .3);
}
.form input[type='checkbox'].not-filled + label,
.form input[type='radio'].not-filled + label {
	border: 1px solid var(--warning);
}
.form input[type='checkbox'] + label::before,
.form input[type='radio'] + label::before {
	content: "";
	position: absolute;
	top: 0;bottom: 0;
	left: 0;right: 0;
	margin: auto;
	opacity: 0;
	transition: var(--transition);
	pointer-events: none;
}
.form input[type='checkbox'] + label::before {
	top: -5px;
	width: 12px;
	height: 6px;
	border-left: 2px solid white;
	border-bottom: 2px solid white;
	transform: rotate(-45deg);
}
.form input[type='radio'] + label::before {
	width: 8px;
	height: 8px;
	background-color: white;
	border-radius: 100%;
}
.form.white input[type='checkbox'] + label::before,
.form.white input[type='radio'] + label::before {
	border-color: var(--darkblue);
}
.form input[type='checkbox']:checked + label::before,
.form input[type='radio']:checked + label::before {
	opacity: 1;
}
.form input[type='checkbox'] + label + label,
.form input[type='radio'] + label + label {
	display: inline-block;
	vertical-align: middle;
	letter-spacing: normal;
	font-size: 12px;
	color: rgba(255, 255, 255, .5);
	text-transform: none;
	padding-left: 10px;
	line-height: 1.5;
	flex: 1;
	margin: 0;
	transition: var(--transition);
}
.form input[type='checkbox']:checked + label + label,
.form input[type='radio']:checked + label + label {
	color: white;
}

.form .recaptcha .g-recaptcha > div.not-filled {
	border: 1px solid var(--warning);
}
.form .recaptcha .g-recaptcha {
	padding-top: 10px;
	padding-bottom: 10px;
}

.form .lower {
	display: flex;
	flex-wrap: wrap;
}
.form .lower,
.form .lower + div {
	align-self: center;
}
.form .lower input[type='checkbox'] + label {
	width: 29px;
	height: 29px;
}
.form .lower input[type='checkbox'] + label::before {
	width: 18px;
	height: 9px;
}
.form .lower input[type='checkbox'] + label + label {
	font-size: 10px;
	letter-spacing: .15em;
	color: var(--darkblue);
	text-transform: uppercase;
}

.form .link[submit] {
	overflow: initial;
}
.form.white .link[submit]::after {
	background-image: url(/assets/img/arrow-link-red.svg)
}


/********** FORM SUBFORM AREA **********/

.form .row > .subform {
	position: relative;
	min-width: 100%;
	max-width: 100%;
	padding: 50px 0 60px;
	margin: 45px 0 30px;
}
.form .row > .subform::before {
	content: "";
	position: absolute;
	top: 0;bottom: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100vw;
	background-color: #40495f;
}


@media(min-width: 320px) and (max-width: 767px) {
	.form .recaptcha .g-recaptcha > div {
		position: relative;
		left: 50%;
		transform: translateX(-50%)
	}
}
@media(min-width: 768px) {
	.form {
		padding: 70px 0;
	}

	.form .row,
	.form .row > .subform > .row {
        margin: -15px -20px;
    }
	.form .row > div,
	.form .row > .subform > .row > div {
        padding: 15px 20px;
	}
	.form .row > div .row {
        margin: -10px;
	}
	.form .row > div .row > div {
        padding: 10px;
	}

	.form label {
		margin: 30px 0 25px;
	}
	
	.form .lower input[type='checkbox'] + label + label {
		padding-left: 20px;
	}
	.form .recaptcha .g-recaptcha {
		padding-top: 30px;
		padding-bottom: 20px;
	}
}

@media(min-width: 992px) {    
    .form {
		padding: 95px 0 100px;
	}

	.form .row,
	.form .row > .subform > .row {
        margin: -15px -45px;
    }
	.form .row > div,
	.form .row > .subform > .row > div {
        padding: 15px 45px;
	}

	.form .row > div .row {
        margin: -10px -15px;
	}
	.form .row > div .row > div {
        padding: 10px 15px;
	}
}


/**********************************************/
/********** CONTENT PARTNERS SECTION **********/
/**********************************************/

.partners {
	padding: 40px 0 80px;
	background-color: white;
	position: relative;
}

.partners .row {
	margin: 20px -10px -10px;
}
.partners .row > div {
	padding: 10px;
	flex-basis: 33.333%;
	max-width: 33.333%;
}

.partners .dashed {
	color: var(--darkblue);
}
.partners .dashed::before {
	background-color: var(--darkblue);
}


@media(min-width: 768px) {
	.partners {
		padding: 50px 0;
	}

	.partners .row {
		margin: 20px -15px -15px;
	}
	.partners .row > div {
		padding: 15px;
		flex-basis: 20%;
		max-width: 20%;
	}
}

@media(min-width: 992px) {
	.partners {
		padding: 70px 0;
	}

	.partners .row {
		margin: 20px -25px -20px;
	}
	.partners .row > div {
		padding: 20px 25px;
	}
}


/**********************************************/
/********** RELATED ARTICLES SECTION **********/
/**********************************************/

.related-content {
	padding: 40px 0;
	background-color: white;
}

.related-content .dashed {
	color: var(--darkblue);
}
.related-content .dashed::before {
	background-color: var(--darkblue);
}


@media(min-width: 768px) {
	.related-content {
		padding: 50px 0;
	}
}

@media(min-width: 992px) {
	.related-content {
		padding: 70px 0;
	}
}

/* Check listing.css */

/************************************************/
/********** RELATED HIGHLIGHTS SECTION **********/
/************************************************/

.highlights,
.statistics,
.related {
	margin: 60px 0 100px;
}

.highlights .row {
	margin: 0
}
.highlights .row > div {
	padding: 0;
}
.highlights .row > div + div {
	padding-top: 40px;
}

.highlights .row > div .image {
	max-width: 50%;
	min-width: 50%;
	overflow: hidden;
}
.highlights .row > div .image img {
	transition: var(--transition);
}
.highlights .row > div .image:hover img,
.highlights .row > div .image:focus img {
	transform: scale(1.1);
}
.highlights .row > div .image + .description {
	padding-top: 30px;
}

.highlights .row > div p {
	font-size: 1rem;
    font-weight: 600;
	color: var(--black);
	line-height: 1.35;
    margin: 0;
}
.highlights .row > div p a {
	display: inline-block;
}

.highlights .row > div a.link {
	margin-top: 25px;
}


@media(min-width: 768px) {
	.highlights,
	.statistics,
	.related {
		margin-top: 80px;
	}

	.highlights .row {
		margin: -20px
	}
	.highlights .row > div,
	.highlights .row > div + div {
		padding: 20px;
	}
}

@media(min-width: 992px) {
	.highlights,
	.statistics,
	.related {
		margin-top: 110px;
	}

	.highlights .row {
		margin: -30px -45px;
	}
	.highlights .row > div,
	.highlights .row > div + div {
		padding: 30px 45px;
	}
	.highlights .row > div .image {
		max-width: 280px;
		min-width: 280px;
	}

	.highlights .row > div {
		display: flex;
		align-items: flex-start;
	}
	.highlights .row > div .image + .description {
		padding-top: 0;
		padding-left: 50px;
	}	
}


/************************************************/
/********** RELATED STATISTICS SECTION **********/
/************************************************/

.statistics .row {
	margin: 0;
}
.statistics .row > div {
	padding: 0;
}
.statistics .row > div + div {
	padding-top: 50px;
}

.statistics .row > div .value {
	font-size: 3rem;
	font-weight: 900;
	color: var(--green);
	line-height: 1;
}

.statistics .row > div p {
	font-size: 1.1875rem;
	font-weight: 400;
	margin-top: 25px;
	margin-bottom: 0;
}
.statistics .row > div p + .link {
	margin-top: 25px;
}


@media(min-width: 768px) {
	.statistics .row {
		margin: 0 -40px
	}
	.statistics .row > div {
		padding: 0 40px
	}
	.statistics .row > div + div {
		padding-top: 0;
	}
}

@media(min-width: 992px) {
	.statistics .row {
		margin: 0 -50px
	}
	.statistics .row > div {
		padding: 0 50px
	}
}


/*****************************************/
/********** STATISTICS PAGE NAV **********/
/*****************************************/

.content .template .stats-nav {
	margin-top: 15px;
}

.content .template .stats-nav .container > div {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.content .template .stats-nav .container > div a {
	max-width: 100%;
	min-width: 100%;
	min-height: 107px;
}
.content .template .stats-nav .container > div a.active {
	pointer-events: none;
}
.content .template .stats-nav .container > div a.active > div::before {
	background-color: var(--yellow);
}

.content .template .stats-nav .container > div a > div {
	position: relative;
	padding-top: 35px;
	padding-left: 30px;
}
.content .template .stats-nav .container > div a > div::before {
	content: "";
	position: absolute;
	top: 0;left: 0;
	width: 65px;
	height: 70px;
	background-color: var(--green);
	transform: skewY(30deg);
	transform-origin: top left;
}

.content .template .stats-nav .container > div a h2 {
	position: relative;
	font-size: 1.375rem;
	font-weight: 600;
	margin: 0;
}
.content .template .stats-nav .container > div a h2 + .link {
	position: relative;
	margin-top: 20px;
	color: var(--darkblue);
}


@media (min-width: 768px) {
	.content .template .stats-nav .container > div {
		margin: -20px -30px;
	}
	
	.content .template .stats-nav .container > div a {
		min-width: auto;
		max-width: 33.333%;
		padding: 20px 30px;
		max-width: calc(27% + 40px);
	}
	.content .template .stats-nav .container > div a > div {
		padding-top: 45px;
		padding-left: 40px;
	}
	.content .template .stats-nav .container > div a > div::before {
		width: 75px;
		height: 80px;	
	}
}

@media (min-width: 992px) {
	.content .template .stats-nav .container > div {
		margin: -20px -50px;
	}
	
	.content .template .stats-nav .container > div a {
		padding: 20px 50px;
	}
}


/**************************************/
/********** PROJECTS SECTION **********/
/**************************************/

.banner.banner-shape + .template .projects {
	margin-top: 40px;
}

.projects .row {
	margin: -30px -50px;
	justify-content: center;
}
.projects.has-four .row {
	margin: -30px -40px;
}

.projects .row > .project {
	padding: 30px 50px;
	min-width: 100%;
	max-width: 100%;
	flex: 1;
}
.projects.has-four .row > .project {
	padding: 30px 40px;
}

.projects .row > .project > div {
	padding-left: 50px;
}
.projects.has-four .row > .project > div {
	padding-left: 30px;
}

.projects .project .image {
	display: inline-block;
	position: relative;
	padding-top: 15px;
	margin-bottom: 20px;
}
.projects.has-four .project .image {
	margin-bottom: 30px;
}
.projects .project .image svg {
	position: absolute;
	top: 0;
	left: -50px;
	width: 145px;
}
.projects.has-four .project .image svg {
	left: -30px;
}
.projects .project.red .image svg * {
	fill: var(--red);
}
.projects .project.purple .image svg * {
	fill: var(--purple);
}
.projects .project.yellow .image svg * {
	fill: var(--yellow);
}
.projects .project.darkblue .image svg * {
	fill: var(--darkblue);
}
.projects .project.green .image svg * {
	fill: var(--green);
}
.projects .project.pink .image svg * {
	fill: var(--pink);
}

.projects .project .image img {
	position: relative;
	width: 120px;
}

.projects .project h2 {
	font-size: 2.125rem;
	font-weight: 600;
	color: var(--darkblue);
	line-height: 1.4;
	margin: 0;
	margin-bottom: 15px;
}

.projects .project p {
	font-size: 14px;
	color: var(--black);
	margin: 0;
}

.projects .project a.button {
	margin-top: 25px;
}


@media(min-width: 768px) {
	.projects .row > .project {
		min-width: 33.333%;
		max-width: 37%;
		flex: 1;
	}

	.projects.has-four .row > .project {
		min-width: 50%;
	}
}

@media(min-width: 992px) {
	.projects.has-four .row > .project {
		min-width: 25%;
	}
}


/*******************************************/
/********** RELATED PAGES SECTION **********/
/*******************************************/

.related .row {
	margin: 15px 0 -15px;
	align-items: center;
}

.related .row > div {
	padding: 15px 0;
}
.related .row > div h3 {
	font-size: 2.25rem;
	margin: 0;
	flex: 1;
}

.related .row > div .link {
	margin-top: 25px
}



@media(min-width: 768px) {
	.related .row {
		margin-top: 32px;
		margin-left: -30px;
		margin-right: -30px;
	}

	.related .row > div {
		padding: 0 30px;
	}
}

@media(min-width: 992px) {
	.related .row {
		margin-top: 40px;
		margin-left: -60px;
		margin-right: -60px;
	}
	.related .row > div {
		padding: 0 60px;
	}

	.related .row > div h3 {
		font-size: 2.75rem;
	}
}


/*****************************************************/
/********** ED_ON ARTICLES GLOSSARY PREVIEW **********/
/*****************************************************/

.glossary-preview {
	position: absolute;
	top: 0;left: 0;
	z-index: 2;
	width: 430px;
	padding-bottom: 25px;
	cursor: pointer;
	opacity: 0;
	pointer-events: none;
	transition: opacity .2s ease-in-out;
}
.glossary-preview.visible {
	opacity: 1;
	pointer-events: auto;
}

.glossary-preview > div {
	position: relative;
	background-color: var(--darkblue);
	padding: 25px 30px;
}
.glossary-preview > div::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 30px;
	width: 0;height: 0;
	border-top: 13px solid var(--darkblue);
	border-left: 13px solid transparent;
	border-right: 13px solid transparent;
}

.glossary-preview p {
	font-size: 1.375rem;
	font-weight: 400;
	color: white;
	margin: 0;
	margin-bottom: 15px;
}
.glossary-preview span {
	display: block;
	font-size: 13px;
	font-weight: 400;
	color: white;
	margin: 0;
	margin-bottom: 30px;
}

.glossary-preview .link-plus {
	color: white;
}
.glossary-preview .link-plus::before,
.glossary-preview .link-plus::after {
	background-color: white;
}


/*********************************/
/********** SEARCH PAGE **********/
/*********************************/

.content .template .results h2 {
	margin-bottom: 1.75em;
}


/******************************/
/********** 404 PAGE **********/
/******************************/

.content.not-found {
	padding: 150px 0 170px;
}

.content.not-found .container {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.content.not-found h1 {
	font-size: 4.5rem;
	font-weight: 300;
	line-height: 1;
	margin-bottom: 15px;
}

.content.not-found p {
	font-size: 2.25rem;
	font-weight: 400;
	color: var(--darkblue);
	margin: 0;
}

.content.not-found a.link {
	margin-top: 60px;
}
.content.not-found a.link::after {
	background-image: url(/assets/img/arrow-link-red.svg);
}


/*************************************/
/********** FLOATING SHAPES **********/
/*************************************/

.shape {
	display: none;
	position: absolute;
	left: 50%;
	transform: translate(-50%, 150px);
	margin: auto;
	pointer-events: none;
	z-index: 0;
	opacity: 0;
	transition: all .8s ease-in-out;
}
.shape.animated {
	transform: translate(-50%, 0);
	opacity: 1;
}
.shape::before {
	content: "";
	position: absolute;
	top: 0;left: 0;
	height: 100%;
	transform: skewY(-30deg);
	transform-origin: top right;
}

@media(min-width: 992px) {
	.shape {
		display: block;
	}
}

/********** PROJECT 01 (Ler mais) **********/

body.shapes-project01 #shape1 {
	top: 256px;
	width: 1574px;
	height: 325px;
}
body.shapes-project01  #shape1::before {
	width: 423px;
	transform: skewY(30deg);
	transform-origin: top left;
	background-color: var(--pink);
}

body.shapes-project01 #shape2 {
	top: 308px;
	width: 1620px;
	height: 215px;
}
body.shapes-project01  #shape2::before {
	left: auto;right: 0;
	width: 285px;
	transform: skewY(-30deg);
	transform-origin: top right;
	background-color: var(--darkblue);
}

body.shapes-project01 #shape3 {
	top: 723px;
	width: 1310px;
	height: 272px;
}
body.shapes-project01  #shape3::before {
	left: auto;right: 0;
	width: 170px;
	transform: skewY(-30deg);
	transform-origin: top right;
	background-color: var(--yellow);
}

body.shapes-project01 #shape4 {
	top: 761px;
	width: 1280px;
	height: 275px;
}
body.shapes-project01  #shape4::before {
	width: 170px;
	transform: skewY(30deg);
	transform-origin: top left;
	background-color: var(--red);
}

body.shapes-project01 #shape5 {
	top: 1024px;
	width: 1580px;
	height: 540px;
}
body.shapes-project01  #shape5::before {
	left: auto;right: 0;
	width: 320px;
	transform: skewY(-30deg);
	transform-origin: top right;
	background-color: var(--red);
}

body.shapes-project01 #shape6 {
	top: 1525px;
	width: 1400px;
	height: 742px;
}
body.shapes-project01  #shape6::before {
	width: 440px;
	transform: skewY(30deg);
	transform-origin: top left;
	background-color: var(--yellow);
}

/********** PROJECT 02 (Ser Pro) **********/

body.shapes-project02 #shape1 {
	top: 236px;
	width: 1660px;
	height: 356px;
}
body.shapes-project02  #shape1::before {
	width: 467px;
	transform: skewY(30deg);
	transform-origin: top left;
	background-color: var(--green);
}

body.shapes-project02 #shape2 {
	top: 808px;
	width: 1905px;
	height: 356px;
}
body.shapes-project02  #shape2::before {
	left: auto;right: 0;
	width: 465px;
	transform: skewY(30deg);
	transform-origin: top left;
	background-color: var(--pink);
}

body.shapes-project02 #shape3 {
	top: 1063px;
	width: 1906px;
	height: 357px;
}
body.shapes-project02  #shape3::before {
	width: 467px;
	transform: skewY(-30deg);
	transform-origin: top right;
	background-color: var(--red);
}

body.shapes-project02 #shape4 {
	top: 1775px;
	width: 1787px;
	height: 356px;
}
body.shapes-project02  #shape4::before {
	left: auto;right: 0;
	width: 467px;
	transform: skewY(30deg);
	transform-origin: top left;
	background-color: var(--darkblue);
}


/*********************************************/
/********** GOOGLE MAPS INFO WINDOW **********/
/*********************************************/

.gm-style .outer-iw::after {
	background: linear-gradient(45deg,var(--darkblue) 50%,transparent 51%,transparent 100%);
	box-shadow: none;
}

.gm-style .outer-iw .gm-style-iw-c {
	padding: 0;
	background-color: transparent;
	box-shadow: none;
	border-radius: 0;
	width: 305px;
	max-width: 305px !important;
	max-height: none !important;
}
.gm-style .outer-iw .gm-style-iw-c button {
	display: none !important;
}

.gm-style .outer-iw .gm-style-iw-d {
	width: 100%;
	max-width: 100% !important;
	max-height: none !important;
	overflow: auto !important;
}

.gm-style .outer-iw .inner-iw {
	position: relative;
	font-family: var(--font-family);
	padding: 25px 20px 30px;
	background: var(--darkblue);
}
.gm-style .outer-iw .inner-iw p {
	font-size: 1rem;
	color: white;
	margin: 0;
	margin-bottom: 45px;
}
.gm-style .outer-iw .inner-iw p.lg {
	font-size: 1.5rem;
	font-weight: 500;
	margin-bottom: 15px;
}

.gm-style .outer-iw .inner-iw a.close-btn {
	position: absolute;
	top: 10px;right: 10px;
	width: 11px;
	height: 11px;
}
.gm-style .outer-iw .inner-iw a.close-btn::before,
.gm-style .outer-iw .inner-iw a.close-btn::after {
	content: "";
	position: absolute;
	width: 15px;height: 1px;
	background: white;
	top: 0;bottom: 0;
	left: -2px;
	margin: auto;
}
.gm-style .outer-iw .inner-iw a.close-btn::before {
	transform: rotate(45deg);
}
.gm-style .outer-iw .inner-iw a.close-btn::after {
	transform: rotate(-45deg);
}


/*********************************/
/********** MEDIA PRINT **********/
/*********************************/

@media print {
	header .lower > div,
	header .upper,
	.barra_cookies,
	.related-content,
	.newsletter-bar,
	footer {
		display: none !important;
	}

	header {
		position: relative;
		background-color: white !important;
	}
	header .lower {
		padding: 30px 45px;
	}
	header .logo {
		top: 0 !important;
	}

	html, body {
		margin: 0;
		background-color: white !important;
	}
}