/*
Theme Name: Bridging
Author: Egoprod
Author URI: https://egoprod.fr/
Version: 1.0
*/

/*
@font-face {
    font-family: "Neue Haas Unica W1G";
	src: 
		url("fonts/NeueHaasUnicaW1G-Regular/NeueHaasUnicaW1G-Regular.eot")format("embedded-opentype"),
		url("fonts/NeueHaasUnicaW1G-Regular/NeueHaasUnicaW1G-Regular.woff2")format("woff2"),
		url("fonts/NeueHaasUnicaW1G-Regular/NeueHaasUnicaW1G-Regular.woff")format("woff"),
		url("fonts/NeueHaasUnicaW1G-Regular/NeueHaasUnicaW1G-Regular.ttf")format("truetype"),
		url("fonts/NeueHaasUnicaW1G-Regular/NeueHaasUnicaW1G-Regular.svg")format("svg");
}
*/

body {
	font-family: sans-serif;
	margin:0;
    width: 100vw;
    overflow-x: hidden;
}

.page-header {
	display:flex;
	flex-direction:row;
}

.logo-container {
	width:80%;
	padding:40px 0 0 40px;
}
	
.nav-container {
	min-width:150px;
	display:flex;
	flex-direction:row;
    align-items: center;
    justify-content: end;
	position: fixed;
	top:0;
    right: 0;
    z-index: 99999;
    background-color: #ffffff5e;
    padding: 32px;
	border-bottom-left-radius:20px;
}

body.admin-bar .nav-container {
	top: 32px;
}

nav > ul {
	list-style-type:none;
	display:flex;
	flex-direction:row;
}

.nav-container a.menu-button::before {
	content: "\f228";
    font-family: dashicons;
    font-size: 40px;
    line-height: 40px;
    text-align: center;
    color: #000000;
	/*background-color: #f5f5f57a;*/
    border-radius: 5px;
    padding: 7px;
}

.nav-container a.menu-button {
	display:block;
	width: 40px;
	height: 40px;
	background-size:contain;
	background-repeat:no-repeat;
	background-position:center;
	cursor:pointer;
	margin-left:20px;
}

.menus-container.menu-hidden {
	display:none !important;
}

.menu-button.menu-hidden {
	visibility:hidden !important;
}

.menus-container {
	position: fixed;
    top: 0;
    right: 0;
    background-color: #3a374fed;
	padding:140px;
	z-index:999;
	text-align:right;
	height:100vh
}


body.admin-bar .menus-container {
	top:32px;
	height:calc(100vh - 32px);
}



.menus, .submenu {
	list-style-type:none;
	margin:0;
	padding:0;
	display:flex;
	flex-direction:column;
}

.menus a {
	color:white;
	text-decoration:none;
	display:block;
	font-size:20px;
	white-space: nowrap;
	cursor:pointer;
}

.menu > div {
	position:relative;
}

.menu > div > a {
	text-transform:uppercase;
	margin-bottom:10px;
	font-weight:bold;
	font-size:30px;
}

.menu {
	margin-bottom:30px;
}

.menu-close {
	cursor:pointer;
	color:white;
	position:absolute;
	top:30px;
	right:30px;
}

.menu-close span {
	font-size:30px;
}

.menu-close span {
	font-size:30px;
}

.submenu-close .submenu {
	display:none;
}

.menu .submenu-arrow {
	position:absolute;
	top:0;
	right:-30px;
	cursor:pointer;
}

.menu .submenu-arrow::before {
	content: "\f142";
	font-family: dashicons;
	color:white;
}

.submenu-close .submenu-arrow::before {
	content: "\f140";
}

.logo {
	width:200px !important;
}

.languages {
	font-size:0;
	/*background-color:#f5f5f57a;*/
	border-radius:30px;
	padding:20px 30px;
	white-space:nowrap;
}

.language > * {
	font-size:16px;
	color:#ad6c93;
	text-decoration:none;
}

.language:not(:last-child) > *::after {
	content:"|";
	display:inline-block;
	padding:0 3px;
	color:#ad6c93;
	position:relative;
	top:-1px;
}

.language.selected > * {
	color:black;
	font-weight:bold;
}

.egp-cuspt-breadcrumb {
	text-align:right;
	padding:10px 20px;
}

.egp-cuspt-breadcrumb li span {
	line-height:30px;
}

.egp-cuspt-breadcrumb li > a {
	text-decoration:none;
}

.egp-cuspt-breadcrumb li:hover > a > span { 
	color: #ad6c93;
}

.egp-cuspt-breadcrumb li span {
	color:#9f9f9f;
}

.egp-cuspt-breadcrumb li:last-of-type > span {
	color:#696969;
	font-weight:bold;
}

.egp-cuspt-breadcrumb li:not(:last-of-type)::after {
	content:">";
	color:#9f9f9f;
}

.page-footer {
    background-color: #3a374f;
    overflow: hidden;
	margin-top:80px;
}

.footer-content {
    margin: 80px auto;
    width: 33%;
    color: white;
	max-width:400px;
	text-align:center;
}

.footer-content > div {
	width:auto;
	max-width:none;
}

.footer-content .logo {
	margin: 0 auto 20px auto;
}

.footer-content .logo img{
	filter: brightness(200%) contrast(200%) saturate(100%) blur(0px) hue-rotate(0deg);
	width:100%;
	height:auto;
}

.footer-content .address {
	white-space:nowrap;
	font-size:14px;
}

.footer-content .email a,
.footer-content .phone a {
	color:white;
	text-decoration:none;
	font-size:18px;
}

.footer-content .address {
	white-space:nowrap;
	font-size:14px;
}

.footer-content .address > span:nth-of-type(1)::after {
	content:" - ";
}

.footer-content .socialnetworks ul {
	list-style-type:none;
	padding:0;
	margin:0;
}

.footer-content .socialnetworks li {
	display:inline-block;
}

.footer-content .socialnetworks a {
	color:white;
	text-decoration:none;
	font-size:18px;
	background-position:center;
	background-size:contain;
	background-repeat:no-repeat;
	display:block;
	width:32px;
	height:32px;
}

.footer-content .logo,
.footer-content .address,
.footer-content .email {
	margin-bottom:20px;
}

.footer-bottom {
	background-color: black;
    padding: 20px 0;
}

.footer-bottom ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
    display: flex;
    flex-direction: row;
    justify-content: center;
}

.footer-bottom a {
    color: white;
    text-decoration: none;
    text-align: center;
}

.footer-bottom li:not(:last-of-type)::after {
    content: "-";
    color: white;
    padding: 0 5px;
}


/* MAP */
.map-row {
    display: table;
    width: 100%;
}

.map-cell {
    display: table-cell;
    vertical-align: top;
}

.map-cell.map-info {
    width: 25%;
    background-color: #f5f5f5;
    border-right: 20px solid white;
    padding: 50px 20px 130px 20px;
    text-align: left;
	position:relative;
}

.map-info-area-name {
    font-size:30px;
	font-weight:bold;
}

.map-info-area-interlocuteurs > p,
.map-info-area-partners > p {
	font-weight:bold;
	margin-bottom:0;
}

.map-info-area-interlocuteurs > ul, 
.map-info-area-partners > ul {
	list-style-type:none;
	margin:0;
	padding:0;
    overflow: hidden;
}

.map-info-area-interlocuteurs li, 
.map-info-area-partners li {
	position:relative;
	width: 120px;
    height: 120px;
    margin: 10px 10px 0 0;
    float: left;
    overflow: hidden;
	box-sizing:border-box;
}

.map-svg-container {
	overflow:hidden;
}

.map-svg, .map-svg * {
	user-select:none;
}

.partner-logo,
.interlocuteur-photo {
	width:100%;
	height:100%;
    background-size: 80% 80%;
    background-position: center;
    background-repeat: no-repeat;
	border-radius:50%;
	background-color:white;
}

.partner-name,
.interlocuteur-name {
	position:absolute;
	bottom:0;
	left:0;
	display:block;
	width:100%;
	line-height:12px;
	font-size:12px;
	text-align:center;
	color: white;
	padding:3px 3px 1px 3px;
	box-sizing:border-box;
    font-weight: bold;
	display:none;
}
.map-info-area-interlocuteurs li:hover .interlocuteur-name, 
.map-info-area-partners li:hover .partner-name {
	display:block;
}

.partner-name {
	background-color: #3b394d;
}

.interlocuteur-name {
	background-color: #ad6d92;
}

.area {
	opacity: 1; 
	stroke-opacity: 1; 
	stroke-linejoin: round; 
	fill-opacity: 1;
	stroke:#f5f5f5;
}

.area.enabled:not(.selected) {
	fill:#3b394d;
}

.area.enabled:not(.selected):not(.forced) {
	cursor: pointer; 
	fill:#ad6d92;
}

.area.enabled:not(.selected):not(.forced):hover,
.area.selected {
	fill:#d67aaf;
}

.area.disabled {
	fill:#e0e0e0;
}

.map-legend {
	position:absolute;
	bottom:50px;
	left:20px;
}

.map-legend ul {
	list-style-type:none;
	padding:0;
	margin:0;
}

.map-legend li {
	margin-top:2px;
	white-space:nowrap;
}

.map-legend li::before {
	content:"";	
	display:inline-block;
	vertical-align:middle;
	width:30px;
	height:20px;
	margin-right:5px;
	display:inline-block;
	vertical-align:middle;
}

.map-legend li span {
	line-height:20px;
}

.map-legend li.map-legend-intervention::before {
	background-color:#3b394d;
}

.map-legend li.map-legend-implantation::before {
	background-color:#ad6d92;
}

/* update test */

/*
.map-row,
.map-cell {
	display:block;
}

.map-cell.map-info {
	position:absolute;
	left:0;
	bottom:0;
	border:none;
	background-color:#ccccccb3;
	z-index: 9;
	box-sizing: border-box;
	width:100%;
}

.map-info-area-interlocuteurs,
.map-info-area-partners {
	float:left;
	width:50%;
	box-sizing: border-box;
}	

.map-info-area-interlocuteurs {
	padding-right:1%;
}

.map-info-area-partners {
	padding-left:1%;
	border-left:1px solid black;
}

.map-info-area-interlocuteurs p,
.map-info-area-partners p {
	margin-top:0;
}	
*/

@media (max-width:1600px) {
	
	.map-info-area-interlocuteurs li, 
	.map-info-area-partners li {
		width: 70px !important;
		height: 70px !important;
	}
	
	.map-info-description {
		margin:0 0 10px 0 !important;
		font-size: 14px !important;
	}
	
	.map-info-area-name {
		margin:0 !important;
	}
	
}

@media (max-width:1400px) {
	
	.map-cell.map-info {
		padding: 10px 10px 67px 10px !important;
	}

	.map-legend {
		bottom:10px;
		left:10px;
		font-size: 12px;
	}
	
	.partner-name, .interlocuteur-name {
		line-height: 11px !important;
		font-size: 11px !important;
	}
	
}


@media (max-width:1000px) {
	
	.map-row {
		display: flex;
		flex-direction: column-reverse;
	}
	
	.map-cell {
		display: block !important;
	}
	
	.map-cell.map-info {
		width: auto !important;
		border-right: 0 !important;
		padding: 30px 30px 110px 30px !important;
		margin-top: 20px !important;
	}

	.map-legend {
		bottom:30px;
		left:30px;
		font-size:16px;
	}
	
	.map-info-area-interlocuteurs li, 
	.map-info-area-partners li {
		width: 75px !important;
		height: 75px !important;
		margin: 5px 5px 0 0 !important;
	}
}


@media (max-width:800px) {
	
	.languages {
		padding:5px 10px !important;
	}

	.language > * {
		font-size:14px !important;
	}
	
	.nav-container a.menu-button::before {
		font-size: 20px;
		padding: 3px;
	}
	
	.footer-content {
		margin: 30px !important;
		width: auto !important;
		max-width: none !important;
	}

	.footer-content .address > span {
		display:block;
	}
	
	.footer-content .address > span:nth-of-type(1)::after {
		content:"";
	}

}

@media (max-width:782px) {
	
	body.admin-bar .nav-container {
		top: 46px !important;
	}
	
	.nav-container {
		padding:10px 5px !important;
	}
	
	.nav-container a.menu-button::before {
		line-height:29px;
	}
	
	.nav-container a.menu-button {
		width:30px !important;
		height:30px !important;
	}
	
	#wpadminbar {
		position:fixed !important;
	}
}

@media (max-width:500px) {
	.menus-container {
		padding:120px 60px !important;
	}
	
	.menus a {
		font-size: 16px !important;
	}
	
	.menu > div > a {
		font-size:22px !important;
	}
	
	.menu {
		margin-bottom: 15px;
	}
	
	.nav-container {
		flex-direction:column !important;
		max-width:20% !important;
		min-width:0 !important;
	}
	
	.nav-container a.menu-button {
		margin-left:0 !important;
		margin-top:10px !important;
	}
	
	.logo-container {
		padding: 10px 0 0 10px !important;
	}
}