/* .............................................................................
SITE ITEMS
............................................................................. */

/*
ITEM / Header
Default head for a block. */
.iHead {text-align: center; }
.iHead + * {margin-top: 3em; }

	/* 
	ALT:
	Centered. */
	.iHead--center {text-align: center; }

	/* 
	ALT:
	Line under. */
	.iHead--line {border-bottom: 1px solid var(--color-blue); padding-bottom: 0.6em; margin-left: 5%; margin-right: 5%; }



/*
ITEM / Nav arrows
Navigation pour un carousel. */
.navArrows {display: flex;align-items: center;border-bottom: 1px solid var(--color-blue);width: 100%;max-width: 22em;margin-top: 3em;margin-left: auto;margin-right: auto;}
.navArrows__item {flex: 1 1 auto;}
.navArrows__item + .navArrows__item {border-left: 1px solid var(--color-blue); }
.navArrows__left { }
.navArrows__right { }

	/* Ajuster l'animation des 2 fleches. */
	.navArrows__left:hover .svgIcon {transform: translate(-70%, -50%) scale(1.2); }
	.navArrows__right:hover .svgIcon {transform: translate(-30%, -50%) scale(1.2);}



/*
ITEM / Social networks
Liens vers reseaux sociaux, cote a cote. */
.rs {list-style: none;font-size: 2em;line-height: 1;}
.rs li {display: inline-block;}
.rs li a {color: var(--color-orange);padding: 0.2em;text-decoration: none;display: block;height: 1em;box-sizing: content-box; transition: color 0.2s;}

	/* Hover */
	.rs li a:hover {color: var(--color-blue); }

	/* On dark */
	.onDark .rs li a {color: #fff;}

		/* Hover */
		.onDark .rs li a:hover {color: var(--color-blue);}

	/*
	ALT :
	Vertical alignment */
	.rs--vertical {text-align: center;}
	.rs--vertical li {display: block;}
	.rs--vertical li a {display: flex; justify-content: center; }
	.rs--vertical li a > * {display: block; flex:0 0 auto; }



/*
ITEM / Side bar box
Box avec titre et bouton (texte et icone).
Devient horizontal sur mobile. */
.iSBBox {background: var(--color-pink);text-align: center;}
.iSBBox__in {min-height: var(--sidebar-item-height);padding: 10%;display: flex;flex-direction: column;justify-content: space-evenly;}
.iSBBox__cHead {flex: 0 1 auto;text-wrap: balance;}
.iSBBox__cLine {flex:0 0 auto; height: 1px; background: #fff; margin: 0 10%; }
.iSBBox__cCtn {flex:0 1 auto; display: flex; justify-content: center; align-items: center; }
.iSBBox__ctn { }
.iSBBox__text {font-size: 1.4em;font-weight: bold;line-height: 1.25;}
.iSBBox__btn {margin-top: 1.2em;}

.bSidebar__box_blue .iSBBox__btn .btnIcon {color: var(--color-pink);}
.bSidebar__box_pink .iSBBox__btn .btnIcon {color: var(--color-blue);}

	/* Hover */
	.iSBBox a { }
	.iSBBox a .iSBBox__cHead {transition: opacity 0.3s; }
	.iSBBox a .iSBBox__cLine {transition: opacity 0.3s; }
	.iSBBox a .iSBBox__text {transition: opacity 0.3s; }

	.iSBBox a:hover .iSBBox__cHead {opacity: 0.7; }
	.iSBBox a:hover .iSBBox__cLine {opacity: 0.7; }
	.iSBBox a:hover .iSBBox__text {opacity: 0.7; }

	.bSidebar__box_blue .iSBBox a:hover .iSBBox__btn .btnIcon {color: var(--color-blue);}
	.bSidebar__box_pink .iSBBox a:hover .iSBBox__btn .btnIcon {color: var(--color-pink);}

	/* 
	ALT:
	Box de candidature spontanee. */
	.iSBBox--candidature {background: var(--color-blue); }

	/* Horizontal aligned */
	@media (max-width:62rem) {
		.iSBBox {--padding:7%; --spaceForBtn:10em; text-align: left; }
		.iSBBox__in {min-height: auto; padding: var(--padding) calc(var(--padding) + var(--spaceForBtn)) var(--padding) var(--padding); display: block; position: relative; }
		.iSBBox__cLine {display: none; }
		.iSBBox__cCtn {margin-top: 0.5em; display: block; }
		.iSBBox__btn {position: absolute; top: 50%; right: var(--padding); transform: translateY(-50%); margin: 0; }
	}

	/* Sizes */
	@media (max-width:47rem) {
		.iSBBox {--spaceForBtn:4em; }
		.iSBBox__text {font-size: 0.9em;}
	}



/*
ITEM / Side bar slide
Box avec image, titre et qualite. */
.iSBSlide { }
.iSBSlide__ctn {text-align: center;padding: 12% 10% 30% 10%;}
.iSBSlide__head { }
.iSBSlide__quality {font-size: 1.2em;font-weight: bold;line-height: 1.25; max-width: 8em; margin: 0.7em auto 0 auto;}

	/* Spacing */
	@media (max-width:62rem) {
		.iSBSlide__ctn {padding: 8% 10% 18% 10%; }
		.iSBSlide__quality {max-width: none;  }
	}

	/* Sizes */
	@media (max-width:47rem) {
		.iSBSlide__quality {font-size: 1em; }
	}



/*
ITEM / Side by side
Texte accentuer a gauche, texte standard a droite. */
.iSBS {display: flex; justify-content: center; }
.iSBS__accent {display: block;flex:0 0 auto;padding-right: 0.23em;font-size: 2.5em;font-weight: 900;color: var(--color-blue);}
.iSBS__ctn {display: block;flex:0 1 auto;}

	/* Break cols */
	@media (max-width:62rem) {
		.iSBS {display: block; }
		.iSBS__accent {padding: 0; }
		.iSBS__ctn br {display: none; }
	}

	/* Spacing */
	@media (max-width:47rem) {
		.iSBS__accent {line-height: 0.8; }
	}



/*
ITEM / Badge
Badge avec une icone dans la liste des avantages. */
.iAvantage {display: inline-block; text-align: center; }
.iAvantage__icon {font-size: 6em;padding: 0.13em;box-sizing: content-box;color: #0a2a44;background: var(--color-blue-pale);border-radius: 50%;margin-left: auto;margin-right: auto;}
.iAvantage__titre {font-size: 1.15em;font-weight: bold;margin-top: 0.6em;line-height: 1.2;}



/*
ITEM / Pourquoi
Slide dans la section Pourquoi granbyindustries.
Image pleine hauteur a gauche.
Contenu a droite avec espacement pour les fleches du slider. */
.iPourquoi { }
.iPourquoi__in {display: flex;width: 100%;}
.iPourquoi__cImg {flex:1 1 auto;margin-right: 8%;}
.iPourquoi__cCtn {flex:0 0 auto;width: var(--contentWidth);text-align: center;margin-bottom: 3em;display: flex;align-items: center;}
.iPourquoi__img {height: 100%; }
.iPourquoi__img > * {width: 100%; height: 100%; object-fit: cover; }
.iPourquoi__ctn {flex:1 1 auto;padding: 2em 0; font-size: larger;}

	/* Break cols */
	@media (max-width:62rem) {
		.iPourquoi__in {display: flex; flex-direction: column; }
		.iPourquoi__cImg {flex:0 0 auto; margin: 0; }
		.iPourquoi__cCtn {flex:1 1 auto; width: 100%; margin-bottom: 0; }
		.iPourquoi__ctn {width: 100%;padding: 10% 0;}
	}



/*
ITEM / Location
Icone "pin" et liste des villes.
Pour la page de details de l'offre d'emploi. */
.iLocation {font-weight: 300;margin-top: -0.8em;display: inline-flex;align-items: center;padding: 0 6em;}
.iLocation__icon {display: block;flex: 0 0 auto;color: var(--color-blue);font-size: 4em;}
.iLocation__locations {display: block;flex: 1 1 auto;text-align: left;padding: 0.5em 0;}
.iLocation__locations a {color: var(--color-orange);color: var(--color-blue);display: inline-block;text-decoration: underline;transition: color 0.2s;}

	/* Hover */
	.iLocation__locations a:hover {color: var(--color-blue);}

	/* Full width */
	@media (max-width:47rem) {
		.iLocation {display: flex;font-size: 0.85em;padding-left: 0;padding-right: 4.5em;margin-left: -1em;}
	}



/*
ITEM / Side box
Box qui contient icone dans un background gris.
Utile pour le sharing zone. */
.iSideBox {font-size: 1em;position: relative; background: var(--color-gray); border-radius: 2em; transition: background-color 0.3s;}
.iSideBox__text {font-size: 1.2em;position: absolute;top:100%;padding-top: 0.7em;padding-left: 0.2em;font-weight: bold;width: 100%;color: var(--color-blue);}
.iSideBox__trigger { }
.iSideBox .iSideBox__trigger .btnIcon {background: transparent;box-shadow: none;}
.iSideBox .iSideBox__trigger .btnIcon .svgIcon {transform: translate(-50%, -50%); }
.iSideBox__ctn {max-height: 0;overflow: hidden;pointer-events: none;transition: max-height 0.3s;}
.iSideBox__ctn .rs {padding-bottom: 0.8em; opacity: 0; transition: opacity 0.3s;}
.iSideBox .iSideBox__trigger .btnIcon {color: var(--color-blue);}

	/* 
	STATE / On */
	.iSideBox.on {background-color: var(--color-orange); }
	.iSideBox.on .iSideBox__trigger .btnIcon {color: #fff; }
	.iSideBox.on .iSideBox__ctn {max-height: 15em;pointer-events: auto;}
	.iSideBox.on .iSideBox__ctn .rs {opacity: 1; }

	/* Mobile */
	@media (max-width:47rem) {
		.iSideBox {font-size: 0.75em; }
		.iSideBox .btnIcon {font-size: 4.5em; }
	}



/*
ITEM / Succursale
Nom de la succursale, adresse, infos de contact. */
.iSuccursale {position: relative; }

/* S'il y a le mot "siege social" (dans un h3), on tire vers le haut
pour conserver l'alignement avec les autres qui n'ont pas le mot "siege social" */
.iSuccursale h3 {position: absolute; margin-top: -2em; }
.iSuccursale h3 + * {margin-top: 0;}



/*
ITEM / Filtres
Section des filtres dans la liste d'emploi. */
.iFiltres { }
.iFiltres__types {position: relative;display: flex;align-items: center;}
.iFiltres__filtre {flex:1 1 auto;width: 50%;}
.iFiltres__title {display: flex; align-items: center; padding: 0.85em var(--width-in-left); transition: color 0.2s; }
.iFiltres__title > * {display: block; margin: 0; }
.iFiltres__icon {flex:0 0 auto;font-size: 2.25em;padding: 0.2em;background: #fff;border-radius: 50%;position: relative;}
.iFiltres__icon > * {transition: opacity 0.3s;opacity: 1;}
.iFiltres__iconClose {position: absolute;left: 50%;right: 0;top: 50%;bottom: 0;opacity: 0; transform: translate(-50%, -50%);}
.iFiltres__name {padding-top: 0.2em;flex:1 1 auto;padding-left: 1em;}

	/* Hover filtre title */
	.iFiltres__title:hover {color: var(--color-pink); }

	/* Filtres one over the other */
	@media (max-width:62rem) {
		.iFiltres__types {display: block; }
		.iFiltres__filtre {position: relative; width: 100%; }
		.iFiltres__filtre + .iFiltres__filtre {border-top: 1px solid #dcdfdf; }
	}

	/* Sizes */
	@media (max-width:47rem) {
		.iFiltres__title {padding: 0.75em 1em; }
		.iFiltres__icon {font-size: 1.75em; }
		.iFiltres__name {font-size: 1.2em;}
	}

/* Dropdown */
.iFiltres__dropdown {--espacementH: 2vw;--espacementV: 0.5em;--largeurBox: 33.33%;position: absolute;z-index: -1;left: 0;right: 0;top: 100%; transition: 0s 0.3s z-index;}
.iFiltres__dropdown::before {position:absolute; z-index:0; display:block; content:''; top:0; bottom:0; left:0; right:0; background: var(--color-bg-light); transform: scaleY(0);transform-origin: 50% 0%;transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); }
.iFiltres__dropdown > * {opacity: 0; visibility: hidden; transition: opacity 0.3s, visibility 0.3s; }
.iFiltres__list {padding: 2em calc(4.4em + var(--width-in-left)) 4em calc(4.4em + var(--width-in-left));max-height: 35em;overflow: auto;position: relative;}
.iFiltres__close {position: absolute;z-index: 2;top: 0.75em;right: 1.5em;}
.iFiltres__items {display: flex;flex-wrap: wrap; justify-content: flex-start; margin: calc(-1 * var(--espacementV)) calc(-1 * var(--espacementH)); }
.iFiltres__items > * {flex: 0 1 auto;width: var(--largeurBox); padding: var(--espacementV) var(--espacementH);}
.iFiltres__item { }
.iFiltres__itemLink {display: inline-block; font-weight: bold; line-height: 1.2; transition: color 0.2s; }

	/*
	ALT:
	Filtre item "Tous" : plus large. */
	.iFiltres__item--tout {width: 100%; }

	/* Hover filtre item */
	.iFiltres__itemLink:hover {color: var(--color-pink); }

	/* Active */
	.iFiltres__itemLink.active {color: var(--color-pink); }

	/* 
	STATE / On */
	.iFiltres__filtre.on .iFiltres__name {color: var(--color-pink); }
	.iFiltres__filtre.on .iFiltres__icon > * {opacity: 0; }
	.iFiltres__filtre.on .iFiltres__iconClose {opacity: 1; }
	.iFiltres__filtre.on .iFiltres__dropdown {z-index: 2;transition-delay: 0s;}
	.iFiltres__filtre.on .iFiltres__dropdown::before {transform: scaleY(0.999); }
	.iFiltres__filtre.on .iFiltres__dropdown > * {opacity: 1; visibility: visible; transition-delay: 0.15s; }

	/* 2 cols */
	@media (max-width:62rem) {
		.iFiltres__dropdown {--largeurBox: 50%; }
	}

	/* 1 col */
	@media (max-width:47rem) {
		.iFiltres__list {padding: 0.5em 2em 2em 4.5em; }
		.iFiltres__dropdown {--largeurBox: 100%;}
	}



/*
ITEM / Infos sur la liste d'emploi
Nombre de postes disponibles, icones pour afficher la liste differemment. */
.iListeEmploisInfos {display: flex;align-items: center;padding-top: 1.5em; padding-bottom: 0.5em;}
.iListeEmploisInfos__cInfo {flex:0 0 auto; }
.iListeEmploisInfos__cSeparator {flex:1 1 auto; border-bottom: 1px solid var(--color-blue); margin: 0 2%; }
.iListeEmploisInfos__cShowTypes {flex:0 0 auto; }
.iListeEmploisInfos__cShowTypes .btnIcon:last-child {margin-right: -0.15em;}
.iListeEmploisInfos__cShowTypes .btnIcon:first-child {color: var(--color-blue-pale);}
.iListeEmploisInfos__qty {font-weight: 900; color: var(--color-blue-pale); }
.iListeEmploisInfos__cShowTypes .btnIcon--filters.active {color: var(--color-blue-pale);}

	/* Quand les box passent a 1 col */
	@media (max-width:37rem) {
		.iListeEmploisInfos {padding: 1em 0 0.2em 0.2em; }
	}



/*
ITEM / Emploi
Item d'emploi dans la liste des emplois. */
.iEmploi {--espacementH: 1vw;width: 100%;border-top: 1px solid var(--color-gray);}
.iEmploi__in {display: flex;align-items: center;margin: 0 calc(-1 * var(--espacementH));padding: 0.8em 0; transition: color 0.2s;}
.iEmploi__in > * {margin: 0; padding: 0 var(--espacementH); display: block; flex:0 0 auto; }
.iEmploi__title {font-size: 1.1em;flex:1 1 auto;font-weight: bold;}
.iEmploi__cat {width: 25%; font-weight: 300; font-size: 0.8em; }
.iEmploi__lieu {width: 37%; font-weight: 300; font-size: 0.8em; font-weight: bold; color: var(--color-blue-pale);}
.iEmploi__link {font-size: 0.6em; }
.iEmploi__link .btnIcon {color: unset;}

	/* Hover */
	.iEmploi__in:hover {color: var(--color-blue-pale); }

	/* 4k */
	@media (min-width:125rem) {
		.iEmploi {--espacementH: 1rem; }
	}

	/* Infos un par-dessus l'autre */
	@media (max-width:62rem) {
		.iEmploi__in {flex-wrap: wrap;padding: 5% 0; padding-right: 5em; margin: 0; position: relative;}
		.iEmploi__in > * {width: 100%;padding-left: 0;}
		.iEmploi__title {margin-bottom: 1em;font-size: 1.3em;}
		.iEmploi__cat {font-size: 1em; margin-bottom: 0.4em; }
		.iEmploi__lieu {font-size: 1em; }
		.iEmploi__link {width: auto; position: absolute; right: 0; top: 50%; transform: translateY(-50%); }
	}

	/* Sizes */
	@media (max-width:47rem) {
		.iEmploi__in {padding: 1.25em 0; padding-right: 4em; }
		.iEmploi__title {margin-bottom: 0.6em; }
	}

	/* 
	ALT:
	Emploi en box. */
	.iEmploi--box {border:none;width: 33.3%;text-align: center;padding-top: var(--width-in-left);padding-bottom: var(--width-in-left);}
	.iEmploi--box .iEmploi__in {display: block;margin: 0;padding: 2.5vw 2.5vw 4vw 2.5vw;background: var(--color-gray);position: relative;height: 100%;transition: color 0.2s;}
	.iEmploi--box .iEmploi__in > * {padding: 0;margin: 0;width: 100%;}
	.iEmploi--box .iEmploi__in > * + * {margin-top: 2em;}
	.iEmploi--box .iEmploi__title { }
	.iEmploi--box .iEmploi__cat {font-size: 1em; }
	.iEmploi--box .iEmploi__lieu {font-size: 1em; }
	.iEmploi--box .iEmploi__link {position: absolute;top: auto;bottom: 0;left: 50%;right: auto;width: auto;transform: translate(-50%, 50%);margin: 0;}

		/* 4k */
		@media (min-width:125rem) {
			.iEmploi--box .iEmploi__in {padding: 3.125em 3.125em 5em 3.125em; }
		}

		/* 2 cols */
		@media (max-width:62rem) {
			.iEmploi--box {width: 50%; }
			.iEmploi--box .iEmploi__in {padding: 5vw 5vw 8vw 5vw; }
		}

		/* 1 col */
		@media (max-width:37rem) {
			.iEmploi--box {width: 100%;padding: 5vw 0;}
			.iEmploi--box .iEmploi__in {padding: 10vw 10vw 16vw 10vw; }
			.iEmploi--box .iEmploi__in > * + * {margin-top: 6vw;}
		}



/*
ITEM / Title
Description. */