@charset "UTF-8";
/* vim:set fileencoding=UTF-8 nobomb:

CSS globale des pages publiques et de l'espace client

┌─┐╭─╮╷
│ ││ │╵
└─┘╰─╯╶╴
*/

/*╶──────────────────────────────────────╮
╷   Base                                 ╵
╰──────────────────────────────────────╴*/

@viewport {
	min-width: 320px;
	zoom: 1.0;
	min-zoom: 1.0;
	max-zoom: 1.0;
}
body, th, td, button, input, select, textarea, h1, h2, h3, h4, h5, h6 {
	font-family: 'Open Sans', 'Noto Color Emoji', Arial, Sans-Serif; /* Police du site */
}
html {
	height: 100%;
}
body {
	min-height: 100%;
	background-color: #f1f1f1;
}
.layer {
	position: relative;
	top: 0;
	left: 0;
}
.context {
	overflow: auto;
}
.fit {
	max-width: 100%;
}


/*╶──────────────────────────────────────╮
╷   Boutons V3                           ╵
╰──────────────────────────────────────╴*/

.bt3_pri,
.bt3_sec,
.bt3_ter {
	padding: 10px 5px;
	line-height: 20px;
	display: inline-block;
	border: 1px solid transparent;
	border-radius: 3px;
	min-width: 148px;
	text-align: center;
	font-weight: bold;
	text-transform: uppercase;
	cursor: pointer;
}
.bt3_pri.auto,
.bt3_sec.auto,
.bt3_ter.auto {
	min-width: 0;
}
.bt3_pri.left,
.bt3_sec.left,
.bt3_ter.left {
	text-align: left;
}
/*.bt3_pri.compact, .bt3_sec.compact, .bt3_ter.compact { padding: 10px 1px; }*/
.bt3_pri {
	background-color: #000;
	border-color: #000;
	color: #fff;
}
.bt3_sec {
	background-color: #e3e3e3;
	border-color: #e3e3e3;
	color: #000;
}
.rd-grey-bg .bt3_ter,
.bt3_ter {
	background-color: #fff;
	border-color: #000;
	color: #000;
}
.rd-hover .bt3_pri:hover,
.rd-hover .bt3_sec:hover,
.rd-hover .bt3_ter:hover,
.rd-hover .bt3_pri:focus,
.rd-hover .bt3_sec:focus,
.rd-hover .bt3_ter:focus,
.rd-hover .bt3_pri:active,
.rd-hover .bt3_sec:active,
.rd-hover .bt3_ter:active,
.bt3_pri.selected,
.bt3_sec.selected,
.bt3_ter.selected {
	background-color: #000;
	border-color: #000;
	color: #f1e600;
}
.bt3_pri img,
.bt3_sec img,
.bt3_ter img {
	max-height: 20px;
}

.input_file {
	display: inline-block;
	border-radius: 0;
}
.input_file:hover,
.input_file:focus,
.input_file:active {
	border-style: solid;
}
.input_file .transparent {
	position: absolute;
	top: -1px;
	left: -1px;
	right: -1px;
	bottom: -1px;
	padding: 0;
	opacity: 0;
	cursor: pointer;
	max-width: calc(100% + 2px) !important;
	max-height: calc(100% + 2px) !important;
}

/*╶──────────────────────────────────────╮
╷   Recherche                            ╵
╰──────────────────────────────────────╴*/

#search_box {
	display: none;
	position: fixed;
	top: 153px;
	right: 10px;
	z-index: 199; /* Sous les menus de gauche et de droite */
	width: calc(100% - 32px);
	max-width: 1235px;
}
@media screen and (max-width: 980px) {
	#search_box {
		width: calc(100% - 22px);
	}
}
@media screen and (min-width: 1279px) {
	#search_box {
		right: calc((100% - 1245px)/2);
	}
}
#search_box .search {
	display: none;
	/* margin-top: 5px; */
	line-height: 20px;
	border: 1px solid #000;
	padding: 10px 40px 10px 10px;
	width: 100%;
	box-sizing: border-box;
	background-image: url(/images/common/pictos/128black/magnifier.png);
	background-repeat: no-repeat;
	background-size: 20px 20px;
	background-position: calc(100% - 10px) 10px;
}
#search_box .outer {
	border: 1px solid black;
	background-color: white;
	max-height: calc(100vh - 166px);
	overflow: auto;
}
#search_box.show {
	display: block;
}
#search_box.empty {
	display: none;
}
@media screen and (max-width: 980px) {
	#search_box.show {
		display: block;
	}
	#search_box {
		top: 55px;
	}
	#search_box .search {
		display: block;
	}
	#search_box .outer {
		border-top: 0 none;
		max-height: calc(100vh - 111px);
	}
	#search_box.empty .outer {
		display: none;
	}
}
#search_box .inner {
	padding: 10px;
}
#search_box .close {
	float: right;
}
#search_box .close img {
	width: 20px;
	height: 20px;
}
#search_box h3 {
	text-align: center;
	font-size: 21px;
}
#search_box h4 {
	clear: both;
	margin: 20px 0;
	border-left: 5px solid #000;
	background-color: #eee;
	padding: 3px 0 3px 10px;
	font-weight: bold;
}
#search_box .col {
	display: block;
	width: calc(50% - 10px);
	margin-bottom: 20px;
}
#search_box .col_left {
	float: left;
}
#search_box .col_right {
	float: right;
}
#search_box .result {
	text-align: center;
	margin-bottom: 15px;
	cursor: pointer;
}
#search_box .result .box {
	padding: 15px;
	text-align: left;
}
.search_result_box {
	border: 1px solid #ccc;
}
.search_result_box:hover {
	border-color: #000;
}
#search_box .result .pp {
	margin-bottom: 5px;
}
#search_box .result .created {
	margin-top: 5px;
	font-style: italic;
	color: #666;
}
#search_box .result .family {
	font-style: italic;
	color: #666;
}
#search_box .result .preview {
	width: 150px;
	height: 150px;
}
/*#search_box .result:hover .name {
	color: #96c11f;
}*/
@media screen and (max-width: 450px) {
	#search_box .result .preview {
		width: 100px;
		height: 100px;
	}
}
@media screen and (min-width: 1111px) {
	#search_box .result {
		width: calc(50% - 10px);
	}
	#search_box .result:nth-child(2n+1) {
		clear: both;
		float: left;
	}
	#search_box .result:nth-child(2n) {
		float: right;
	}
}
body.disconnected #search_box .col {
	float: none;
	width: auto;
}
body.disconnected #search_box .result {
	clear: none;
	float: left;
	width: calc(100% / 3);
}
@media screen and (max-width: 799px) {
	body.disconnected #search_box .result {
		width: 50%;
	}
}
@media screen and (min-width: 1111px) {
	body.disconnected #search_box .result {
		width: 25%;
	}
}

/*╶──────────────────────────────────────╮
╷   Titre des pages & hiérarchie         ╵
╰──────────────────────────────────────╴*/

.hierarchy {
	color: #999;
	margin-bottom: 20px;
	text-align: left;
}
.hierarchy a {
	color: #999;
}
.hierarchy a:active,
.hierarchy a:focus,
.hierarchy a:hover {
	color: black;
}
h3 {
	text-transform: uppercase;
	font-size: 16px;
}
.family-titles {
	padding-bottom: 20px;
}
.family-titles .title {
	text-align: center;
	font-size: 20px;
}
.family-titles .subtitle {
	padding-top: 10px;
	text-align: center;
	font-size: 14px;
	text-transform: none;
	color: #888;
}

/*╶──────────────────────────────────────╮
╷   Liens & notes                        ╵
╰──────────────────────────────────────╴*/

.underline {
	text-decoration: underline;
}
.note .link:hover,
.note .link:focus,
.link:hover,
.link:focus {
	color: #c33;
	outline: 0 none;
	text-decoration: underline;
}
.note_nopad {
	color: #666;
	font-style: italic;
}
.note {
	color: #666;
	font-style: italic;
	padding-top: 20px;
}
.note-top,
.note_top {
	color: #666;
	font-style: italic;
	padding-bottom: 20px;
}
.note_ib {
	display: inline-block;
	color: #666;
	font-style: italic;
}
p.note,
p.note-top,
p.note_top,
p.note_nopad,
.note_ib {
	background-image: url(/images/common/pictos/128red/info2.png);
	background-size: 16px 16px;
	background-repeat: no-repeat;
	background-position: 0 0;
	min-height: 16px;
	padding-left: 21px;
	line-height: normal;
}
p.note {
	background-position: 0 20px;
}
.grey-link,
.gray_link,
.note .link,
.note-top .link,
.note_top .link {
	color: #666;
}
.red-link,
.red_link {
	color: #c33;
}
.black-link,
.black_link {
	color: #000;
}

/*╶──────────────────────────────────────╮
╷   Formulaires                          ╵
╰──────────────────────────────────────╴*/

input.text,
select,
textarea {
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	height: 35px;
	border: 1px solid #e3e3e3;
	border-radius: 1px;
	background-color: white;
	padding: 1px 3px;
	vertical-align: middle;
}
textarea {
	height: 60px;
}
select {
	padding: 1px;
}
input.text:invalid,
select:invalid,
textarea:invalid {
	border: 1px solid red;
	box-shadow: 0 0 2px red;
}
input.text:focus,
select:focus,
textarea:focus {
	border: 1px solid #000;
	outline: 0 none;
}
@media screen and (max-width: 980px) {
	input.text,
	select {
		height: 40px;
	}
}

/* Placeholder */

::-webkit-input-placeholder,
::-moz-placeholder,
::placeholder,
.placeholder {
	color: #666;
	opacity: 1;
}

/* Personalisation des elements radio ou checkbox */

input.checked_hide,
input + label .if_checked,
input:checked + label .not_checked {
	display: none;
}
input + label .not_checked,
input:checked + label .if_checked {
	display: inline;
}
input + label .checked_picto {
	width: 16px;
	height: 16px;
	vertical-align: middle;
}

/*╶──────────────────────────────────────╮
╷   Chargement                           ╵
╰──────────────────────────────────────╴*/

#core-loading {
	display: none;
	z-index: 10000002; /* Au dessus de SmartSupp LiveChat et de l'alerte Cookie */
	position: absolute;
	top: 131px;
	left: 0;
	width: 100%;
}
#core-loading p {
	margin: 0 auto;
	width: 300px;
	max-width: 100%;
	padding: 20px;
	background-color: white;
	text-align: center;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.8);
	border-radius: 10px;
	vertical-align: middle;
}
#core-loading noscript strong {
	color: red;
	font-weight: bold;
}
#core-loading img {
	vertical-align: middle;
	padding-right: 5px;
}
.core-loading #core-loading {
	display: block;
}
.core-loading #core-loaded {
	opacity: 0.01; /* ATTENTION : Ne pas mettre zéro */
}

/*╶──────────────────────────────────────╮
╷   Statut connecté/déconnecté           ╵
╰──────────────────────────────────────╴*/

body.disconnected .connected,
body.connected .disconnected {
	display: none;
}
body.with_banner_adm .not_banner_adm,
body.without_banner_adm .if_banner_adm {
	display: none;
}

/*╶──────────────────────────────────────╮
╷   Désactiver eDocBuilder sur mobile    ╵
╰──────────────────────────────────────╴*/

.edb-ko {
	display: none;
}
.edb-ko strong {
	color: red;
	font-weight: bold;
}
.edb-ko img {
	float: right;
	max-width: 25vw;
	margin-left: 20px;
}
@media screen and (max-width: 799px) {
	.edb-ok { display: none; }
	.edb-ko.block { display: block; }
	.edb-ko.inline { display: inline; }
}

/*╶──────────────────────────────────────╮
╷   Alerte pour les cookies              ╵
╰──────────────────────────────────────╴*/

#bottom_tracking_alert {
	position: fixed;
	left: 20px;
	bottom: 0;
	border-radius: 3px 3px 0 0;
	padding: 15px;
	background-color: #fff;
	border: 1px solid black;
	border-bottom: 0 none;
	color: #000;
	min-width: 250px;
	max-width: 520px;
	max-height: calc(100vh - 51px);
	overflow: auto;
	z-index: 10000001; /* Au dessus de SmartSupp LiveChat */
	margin-right: 20px;
}
#bottom_tracking_alert .nav {
	margin-top: 20px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 5px 5px;
}
@media screen and (max-width: 600px) {
	#bottom_tracking_alert .nav {
		flex-direction: column;
		justify-content: center;
		align-items: start;
	}
}
@media screen and (max-width: 423px) {
	#bottom_tracking_alert {
		left: 0;
		right: 0;
		width: auto;
		min-width: 0;
		margin: 0;
		border-radius: 0;
		max-width: none;
		border-left: 0 none;
		border-right: 0 none;
		max-height: calc(100vh - 30px);
	}
}
#bottom_tracking_alert.global .purposes_tab,
#bottom_tracking_alert.global .partners_tab,
#bottom_tracking_alert.purposes .global_tab,
#bottom_tracking_alert.purposes .partners_tab,
#bottom_tracking_alert.partners .global_tab,
#bottom_tracking_alert.partners .purposes_tab {
	display: none;
}
#bottom_tracking_alert .purpose,
#bottom_tracking_alert .partner,
#bottom_tracking_alert .header_nav {
	margin-bottom: 20px;
}
#bottom_tracking_alert .purpose p,
#bottom_tracking_alert .partner p {
	margin-top: 5px;
}
#bottom_tracking_alert .purpose label,
#bottom_tracking_alert .partner label {
	padding-right: 15px;
}
#bottom_tracking_alert .nav_cancel {
	margin-top: 20px;
}
#bottom_tracking_alert .nav_cancel .picto {
	width: 35px;
	height: 35px;
}

/*╶──────────────────────────────────────╮
╷   Cadres verts : Base                  ╵
╰──────────────────────────────────────╴*/

#overbox-arrow,
.overbox2-arrow-outer {
	position: absolute;
	top: 29px;
	left: 0;
	z-index: 150;
	/*
	width: 69px;
	border-bottom: 1px solid #96c11f;
	*/
}
#overbox-arrow-inner,
.overbox2-arrow-inner {
	width: 1px;
	height: 0;
	border: 9px solid transparent;
	border-bottom: 10px solid #000;
	border-top: 0;
	margin: 0 auto;
}
@media screen and (max-width: 980px) {
	#overbox-arrow,
	.overbox2-arrow-outer {
		border-bottom: 0 none;
		width: auto;
	}
	#overbox-arrow-inner,
	.overbox2-arrow-inner {
		border-width: 0 10px 11px 10px;
	}
}
#overbox {
	position: absolute;
	top: 40px;
	left: 0;
	max-width: 958px; /* 1000 - 2 * (20 + 1) */
    background-color: #fff;
	padding: 20px;
	border: 1px solid #000;
	border-radius: 3px;
	z-index: 150;
}
@media screen and (max-width: 1000px) {
	#overbox {
		max-width: calc(100vw - 42px);
	}
}
#overbox h3 {
	color: #888;
	margin-bottom: 20px;
	border-left: 5px solid #000;
	padding: 3px 0 3px 10px;
	color: black;
	text-transform: none;
	font-size: 12px;
	font-weight: bold;
}
#overbox .header_back {
	padding-bottom: 20px;
}
#overbox .header_back .back:hover {
	color: #c33;
}
#overbox .picto {
	width: 15px;
	height: 15px;
	vertical-align: top;
}
#overbox .nav_back .picto {
	padding-top: 10px;
}
#overbox .nav_back {
	display: inline-block;
	height: 35px;
	line-height: 35px;
	vertical-align: top;
}
#overbox .nav_back:hover {
	color: #c33;
}
#overbox .nav_cancel {
	margin: 20px 0 0 0;
}
#overbox .nav_cancel img {
	width: 35px;
	height: 35px;
	vertical-align: top;
}
#overbox .overbox-close {
	float: right;
	padding-left: 20px;
}
#overbox .overbox-close img {
	width: 20px;
	height: 20px;
}
#overbox .subtitle {
	margin: -10px 0 20px 0;
	color: #888;
}
#overbox .form-label {
	color: #666;
	margin-bottom: 5px;
}
#overbox .form-label::after {
	content: " :";
}
#overbox .form-field {
	margin-bottom: 10px;
}
#overbox .form-field .text {
	width: 300px;
	max-width: 100%;
}
#overbox .form-field textarea {
	width: 300px;
	max-width: calc(100vw - 190px);
}
#overbox .form-field .tall {
	height: 100px;
}
.overbox-hr {
	display: block;
	margin: 20px auto 20px auto;
	width: 204px;
	max-width: 80%;
}

/*╶──────────────────────────────────────╮
╷   Cadre vert : Se connecter            ╵
╰──────────────────────────────────────╴*/

#top-connect-box span {
	float: left;
	line-height: 28px;
	vertical-align: middle;
}
#top-connect-box span input {
	vertical-align: middle;
}
#top-connect-box .bt {
	float: right;
}

/*╶──────────────────────────────────────╮
╷   Cadre vert : Créer un compte         ╵
╰──────────────────────────────────────╴*/

.top_subscribe_newsletter {
	margin-top: 20px;
	vertical-align: middle;
}
.top_subscribe_newsletter input {
	vertical-align: middle;
}
.top_subscribe_newsletter label {
	padding-left: 2px;
	vertical-align: middle;
}
.top_subscribe_newsletter em {
	display: block;
	padding-top: 2px;
}

/* Global : Erreurs du pays du mobile */

.rescue_image {
	text-align: center;
	margin: 20px 0 10px 0;
}
.rescue_image img {
	max-height: 70px;
}
.rescue_user_error,
.mobile_user_error {
	color: red;
	font-weight: bold;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
}
.mobile_user_error.hide {
	display: none;
}
.rescue_user_error img,
.mobile_user_error img {
	max-height: 25px;
}

/*╶──────────────────────────────────────╮
╷   Cadre vert : Contact par e-mail      ╵
╰──────────────────────────────────────╴*/

/* Choix du sujet */

#top-email-box .subjects {
	overflow: auto;
	min-width: 685px; /* 110*6+5*5 */
}
#top-email-box .subjects a {
	color: #79797b;
}
#top-email-box .subject {
	float: left;
	width: calc((100% - 25px) / 6);
	margin-right: 5px; /* (1000 - 2 * (20 + 4) - 9 * 101) / 8 */
	color: #79797b;
	font-size: 14px;
	text-align: center;
	cursor: pointer;
}
#top-email-box .subject:last-child {
	margin-right: 0;
}
#top-email-box .subject.selected,
#top-email-box .subject:hover {
	color: #96c11f;
}
#top-email-box .subjects .sep2 {
	display: none;
	clear: left;
}
@media screen and (max-width: 799px) {
	#top-email-box .subjects {
		min-width: 340px;
	}
	#top-email-box .subject.last2 {
		margin-right: 0;
		margin-bottom: 20px;
	}
	#top-email-box .subject {
		width: calc((100% - 10px) / 3);
	}
	#top-email-box .subjects .sep2 {
		display: inline;
	}
}
@media screen and (max-width: 450px) {
	#top-email-box .subjects {
		min-width: 0;
	}
}
#top-email-box .subjects img {
	width: 64px;
	height: 64px;
	padding-bottom: 10px;
}
#top-email-box .subjects span {
	display: block;
}
#top-email-box .leave,
#top-email-box .subject.selected .enter,
#top-email-box .subject:hover .enter {
	display: block;
}
#top-email-box .subjects input,
#top-email-box .enter,
#top-email-box .subject.selected .leave,
#top-email-box .subject:hover .leave {
	display: none;
}

/* Formulaire de contact par e-mail */

#top-email-box .if-subject p {
	margin-bottom: 10px;
}
#top-email-box .files {
	margin-bottom: 5px;
}
#top-email-box .files th {
	padding: 0 0 1px 10px;
	color: #999;
}
#top-email-box .files td {
	padding: 5px 5px 5px 10px;
	border-top: 1px solid #ccc;
}
#top-email-box .szerr {
	color: #c33;
	font-weight: bold;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 10px;
	margin-bottom: 5px
}
#top-email-box .szerr img {
	max-height: 25px;
}
#top-email-box .hide {
	display: none;
}

/*╶──────────────────────────────────────╮
╷   Cadre vert : Contact par téléphone   ╵
╰──────────────────────────────────────╴*/

#top-phone-box h4 {
	clear: left;
	margin-top: 20px;
	font-weight: bold;
	font-size: 13px;
}
#top-phone-box .desc,
#top-phone-box .desc2 {
	margin-top: 3px;
	color: #888;
}
#top-phone-box .desc strong {
	color: black;
}
@media screen and (min-width: 280px) {
	#top-phone-box .desc .saturday {
		white-space: nowrap;
	}
}
#top-phone-box .nav {
	margin-top: 3px;
	overflow: auto;
	text-align: center;
}
#top-phone-box .nav a {
	display: inline-block;
	text-transform: uppercase;
}
#top-phone-box .nav .picto {
	padding: 2px 2px 0 0;
}
#top-phone-box .addresses {
	margin-top: 10px;
}
#top-phone-box .big {
	display: none;
}
#top-phone-box.big .small {
	display: none;
}
#top-phone-box.big .big.block {
	display: block;
}
#top-phone-box.big .desc {
	float: left;
	max-width: 259px;
	margin-bottom: 20px;
}
#top-phone-box.big .nav {
	text-align: right;
}

/* Entêtes */

/*
#top-phone-box .header {
	color: #888;
	margin: 0;
}
#top-phone-box .header1 {
	padding-bottom: 15px;
}
#top-phone-box .header2 {
	padding-bottom: 40px;
}
#top-phone-box .header a {
	color: #888;
}
#top-phone-box .header strong { ** n° de tél. **
	color: #666;
	white-space: nowrap;
}
@media screen and (max-width: 920px) {
	#top-phone-box .header {
		width: 239px;
		margin: 0 auto;
		text-align: justify;
	}
	#top-phone-box .header br {
		display: none;
	}
}
*/

/* Coordonnées tél. d'une agence */

/*
#top-phone-box .shop {
	float: left;
	width: 239px;
	margin-right: 50px;
}
#top-phone-box .shop:last-child {
	margin-right: 0;
}
#top-phone-box .shop p {
	line-height: 21px;
	vertical-align: top;
}
#top-phone-box .shop .picto {
	padding: 3px 3px 0 0;
}
#top-phone-box h4 {
	font-weight: bold;
	color: #666;
}
#top-phone-box p {
	margin-top: 10px;
	color: #666;
}
#top-phone-box a {
	color: #666;
}
#top-phone-box .link:hover,
#top-phone-box .link:focus {
	color: #8b3;
}
@media screen and (max-width: 920px) {
	#top-phone-box .shop {
		float: none;
		margin: 0 auto 50px auto;
	}
}
*/

/*╶──────────────────────────────────────╮
╷   Cadre vert : Localisez nos agences   ╵
╰──────────────────────────────────────╴*/

/* Choix de l'agence */

#overbox .addresses {
	overflow: auto;
}
#overbox .addresses .address {
	float: left;
	margin-right: 50px;
	color: #79797b;
	font-size: 16px;
	text-align: center;
}
#overbox .addresses .address:last-child {
	margin: 0;
}
#overbox .addresses .address img {
	display: block;
	margin-bottom: 10px;
	border: 1px solid black;
	opacity: 0.3;
	max-width: calc(100% - 2px);
	/*box-shadow: 2px 2px 4px rgba(0,0,0,0.5);*/
}
#top-addresses-box .address.selected,
#overbox .addresses .address:hover {
	color: #000;
}
#top-addresses-box .address.selected img,
#overbox .addresses .address:hover img {
	border: 1px solid #000;
	opacity: 1.0;
	/*box-shadow: none;*/
}
@media screen and (max-width: 500px) {
	#overbox .addresses .address {
		float: none;
		display: block;
		margin-right: 0;
		margin-bottom: 20px;
		text-align: left;
	}
}
#top-addresses-box .g_map.src,
#top-addresses-box iframe.no_src,
#top-addresses-box .if_address.other {
	display: none;
}
#top-addresses-box .g_map {
	display: block;
	background-position: 50% 50%;
}
#top-addresses-box .g_map.horloge {
	background-image: url(/images/common/maps/horloge.png);
}
#top-addresses-box .g_map.montevrain {
	background-image: url(/images/common/maps/montevrain.png);
}

/* Plan d'une agence */

#top-addresses-box .g_map,
#top-addresses-box iframe {
	float: right;
	width: 500px;
	height: 400px;
}
#top-addresses-box .address-text-box {
	margin-right: 520px;
	min-height: 400px;
}
#top-addresses-box .address-text-box .opened,
#top-addresses-box .address-text-box .closed {
	font-weight: bold;
	color: #c33;
}
@media screen and (max-width: 930px) {
	#top-addresses-box .g_map,
	#top-addresses-box iframe {
		float: none;
		margin-bottom: 10px;
	}
	#top-addresses-box .address-text-box {
		margin-right: 0;
		min-height: 0;
	}
}
@media screen and (max-width: 580px) {
	#top-addresses-box .g_map,
	#top-addresses-box iframe {
		width: 100%;
	}
}


/* Adresse d'une agence */

#top-addresses-box h4 {
	color: #96c11f;
	font-size: 16px;
	font-weight: bold;
}
#top-addresses-box h4 span {
	font-weight: normal;
	font-size: 12px;
}
#top-addresses-box .header p { /* Adresse & horaires */
	margin-bottom: 20px;
}
#top-addresses-box .access p { /* Métro, bus, etc. */
	line-height: 23px;
}

/*╶──────────────────────────────────────╮
╷   Responsive Design : Base             ╵
╰──────────────────────────────────────╴*/
/* 45 = 13 + 19 + 13 */

.rd-picto img {
	height: 19px;
	padding: 13px;
	vertical-align: top;
}
.rd-link,
.rd-links a {
	display: inline-block;
	height: 45px;
	line-height: 45px;
}
.rd-link img,
.rd-links img {
	height: 19px;
	padding: 13px 0;
	vertical-align: top;
}
#rd-space, /* Espacement supplémentaire désactivé par défaut */
.rd-small {
	display: none;
}
@media screen and (max-width: 980px) {
	/* 45 = 10 + 25 + 10 */
	.rd-picto img {
		height: 25px;
		padding: 10px;
	}
	.rd-link img,
	.rd-links img {
		height: 25px;
		padding: 10px 0;
	}
	.rd-big { display: none; }
	.rd-small.block { display: block; }
	.rd-small.inline { display: inline; }
	.rd-small.inline-block { display: inline-block; }
}

/* L'échange d'image pose problème sur iPad & iPhone */
.rd_onetwo .rd_two,
.rd-two,
.rd_hover a:hover .rd-one,
.rd_hover a:focus .rd-one,
.rd_hover a:active .rd-one,
.rd_hover a.selected .rd-one,
.rd_two,
.rd_hover a:hover .rd_one,
.rd_hover a:focus .rd_one,
.rd_hover a:active .rd_one,
.rd_hover a.selected .rd_one {
	display: none;
}
.rd_onetwo .rd_one,
.rd_hover a:hover .rd-two,
.rd_hover a:focus .rd-two,
.rd_hover a:active .rd-two,
.rd_hover a.selected .rd-two,
.rd_hover a:hover .rd_two,
.rd_hover a:focus .rd_two,
.rd_hover a:active .rd_two,
.rd_hover a.selected .rd_two {
	display: inline;
}

/*╶──────────────────────────────────────╮
╷   Responsive Design : Barres grises    ╵
╰──────────────────────────────────────╴*/

#rd-grey-space {
	height: 67px;
}
.rd-grey-bg {
	background-color: #000;
	color: #fff;
	font-size: 13px;
	font-weight: bold;
	text-transform: uppercase;
	height: 46px;
	line-height: 46px;
}
.rd-grey-bg a {
	color: #fff;
}
.rd-grey-bg .username {
	text-transform: none;
}
@media screen and (max-width: 980px) {
	/* 45 = 10 + 25 + 10 */
	#rd-grey-space {
		height: 46px;
	}
	.rd-grey-bg,
	.rd-grey-bg .username {
		font-size: 18px;
	}
}

/* Conservation de la couleur sur iPad & iPhone */
.rd-hover .rd-grey-bg a:hover,
.rd-hover .rd-grey-bg a:focus,
.rd-hover .rd-grey-bg a:active {
	color: #f1e600;
}

/*╶──────────────────────────────────────╮
╷   Barre de contact par téléphone       ╵
╰──────────────────────────────────────╴*/

.rd_contact {
	background-color: white;
	color: #333;
}
.rd_contact p {
	padding: 2px 0;
	text-align: right;
	font-weight: bold;
	line-height: 17px;
}
.rd_contact strong {
	color: #c33;
	font-weight: bold;
}
.rd-menu .rd_contact p {
	padding: 2px 8px;
	font-size: 9px;
	line-height: 13px;
}

/*╶──────────────────────────────────────╮
╷   Responsive Design : Entête globale   ╵
╰──────────────────────────────────────╴*/

#rd_contact_header {
	z-index: 142;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 21px;
	line-height: 17px;
}
#rd-header {
	z-index: 142;
	position: fixed;
	top: 21px;
	left: 0;
	width: 100%;
}
@media screen and (max-width: 980px) {
	#rd-header {
		top: 0;
	}
}
#rd-header .page-width {
	padding-top: 0;
	padding-bottom: 0;
}
#rd-header .rd-menu-left-link {
	float: left;
}
#rd-header .rd-menu-right-link {
	float: right;
}
#rd-header .logo_outer {
	text-align: center;
}
#rd-header .logo_outer img {
	max-width: calc(100vw - 200px); /* 100% = 45 + 10 + N + 10 + 45 * 3 */
	max-height: calc(((100vw - 200px) * 100) / 564); /* Le logo fait 564 x 100 pixels */
}
#rd-header .logo_outer a:focus {
	/*outline: 1px dashed #666;*/
	outline: 1px dashed rgba(255, 255, 255, 0.5);
}
#rd-header .rd-left {
	float: left;
}
#rd-header .rd-right .rd-link {
	float: right;
}
#rd-header .rd-right .rd-sep {
	float: right;
	margin: 5px 10px;
	width: 1px;
	height: 36px; /* 46 = 5 + 36 + 5 */
	background-color: white;
}
#rd-header .rd-menu-right-link {
	max-width: 315px; /* Limite la largeur du nom de l'utilisateur */
	overflow: hidden;
}

/*╶──────────────────────────────────────╮
╷   Responsive Design : Menus            ╵
╰──────────────────────────────────────╴*/

#rd-menu-mask {
	z-index: 200;
	position: fixed;
	width: 100%;
	background-color: black;
	opacity: 0.5;
}
.rd-menu {
	z-index: 201;
	position: fixed;
	top: 0;
	font-size: 13px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
}
#rd-menu-left {
	left: 0;
}
#rd-menu-right {
	right: 0;
}
#rd-menu-right .rd-grey-bg {
	max-width: 315px; /* Limite la largeur du nom de l'utilisateur */
	overflow: hidden;
}
.rd-menu-content {
	background-color: white;
	overflow: auto;
}
.rd-menu-content .rd-link,
.rd-menu-content .rd-links a,
.rd-menu-content.rd-links a {
	display: block;
	padding-left: 10px;
	height: auto;
	min-height: 35px;
	border-bottom: 1px solid #ccc;
}
.rd-submenu-right img {
	float: right;
	margin-right: 10px;
	height: 11px; /* 35 = 12 + 11 + 12 */
	padding: 12px 0;
}
@media screen and (max-width: 980px) {
	.rd-menu {
		font-size: 18px;
		box-shadow: none;
	}
	.rd-menu-content .rd-link,
	.rd-menu-content .rd-links a,
	.rd-menu-content.rd-links a {
		min-height: 45px;
	}
	.rd-submenu-right img {
		height: 13px; /* 45 = 16 + 13 + 16 */
		padding: 16px 0;
	}
}

/* Conservation de la couleur sur iPad & iPhone */
.rd-hover .rd-menu-content a:hover,
.rd-hover .rd-menu-content a:focus,
.rd-hover .rd-menu-content a:active {
	color: #c33;
}

/* Menu gris clair de remplacement du pied de page */
.rd-footer-grey-bg {
	background-color: #eee;
}
.rd-footer-link {
	display: block;
	padding-left: 10px;
	color: #333;
	height: 35px;
	line-height: 35px;
	border-top: 1px solid #ccc;
}
.rd-hover .rd-footer-link:hover,
.rd-hover .rd-footer-link:focus,
.rd-hover .rd-footer-link:active {
	color: #c33;
}
@media screen and (max-width: 980px) {
	.rd-footer-link {
		height: 45px;
		line-height: 45px;
	}
}

/* Barre grise foncée avec les pictos de contact */
.rd-menu .rd-pictos .rd-picto {
	float: left;
}

/* Bouton de contact */
.contact_outer,
.contact_inner {
	font-size: 12px;
	text-align: center;
}
.rd-menu .contact_outer,
.rd-menu .contact_inner {
	width: 115px; /* 45 * 3 - 12 - 8 */
	height: 29px;
	line-height: 29px;
}
#rd-header .contact_outer,
#rd-header .contact_inner {
	/*width: 115px; ** 45 * 3 - 12 - 8 */
	height: 29px;
	line-height: 29px;
}
.contact_outer {
	float: right;
}
.rd-menu .contact_outer {
	padding: 8px;
}
#rd-header .contact_outer {
	padding: 8px 0;
}
.contact_outer .contact_picto {
	width: 19px;
	height: 19px;
	padding-top: 5px;
}
.contact_inner {
	display: block;
	background-color: white;
	color: #1a1a1a;
}
#rd-header .contact_inner {
	padding: 0 10px;
}
.contact_outer:hover .contact_inner,
.contact_outer:focus .contact_inner,
.contact_outer:active .contact_inner {
	background-color: #96c11f;
	color: white;
}
.contact_outer.selected .contact_inner {
	background-color: white;
	color: #1a1a1a;
}
.contact_outer.selected:hover .contact_inner,
.contact_outer.selected:active .contact_inner {
	color: #96c11f;
}
.rd_submenu_link_ofx_border {
	border-left: 10px solid #f0f;
}

/*╶──────────────────────────────────────╮
╷   Responsive Design : Pied de page     ╵
╰──────────────────────────────────────╴*/

#rd-footer {
	text-align: center;
	height: 35px;
	line-height: 35px;
	vertical-align: top;
}
#rd-footer .rd-link {
	height: 35px;
	line-height: 35px;
}
#rd-footer .rd-picto img {
	padding: 8px;
	height: 19px; /* 35 = 8 + 19 + 8 */
	vertical-align: top;
}
@media screen and (max-width: 980px) {
	#rd-footer,
	#rd-footer .rd-link {
		height: 40px;
		line-height: 40px;
	}
	#rd-footer {
		background-color: #eaeaea;
		font-size: 12px;
	}
	#rd-footer a {
		color: #999;
		text-transform: none;
	}
	#rd-footer .rd-picto img {
		padding: 10px;
		height: 25px; /* 45 = 10 + 25 + 10 */
	}
}

/*╶──────────────────────────────────────╮
╷   Responsive Design : Boutons          ╵
╰──────────────────────────────────────╴*/

.rd-bt {
	-webkit-appearance: none;
	appearance: none;
}
.rd-bt {
	box-sizing: content-box;
	cursor: pointer;
	border: 0 none;
	border-radius: 0;
	background-image: none;
	padding: 8px 14px;
	font-size: 14px;
	line-height: 19px;
	min-width: 172px;
	max-width: 100%;
	text-align: center;
}
@media screen and (max-width: 980px) {
	.rd-bt {
		padding: 10px 14px;
		line-height: 20px;
	}
	.rd-bt-compact {
		padding-left: 3px;  /* Compacte le bouton horizontalement en version mobile */
		padding-right: 3px;
		min-width: 194px;
	}
}
.rd-bt-small {
	padding: 5px 8px;
	line-height: 16px;
	font-size: 13px;
	min-width: auto;
}
.rd-bt-auto {
	min-width: auto;
}

/* Gris */
.rd-bt-grey-overfamily,
.rd-bt-grey-yellow,
.rd-bt-grey-green,
.rd-bt-grey-red {
	background-color: #ddd;
	color: black;
}

/* Jaune */
.rd-bt-yellow {
	background-color: #f4cf79;
	color: black;
}
.rd-bt-grey-yellow:active,
.rd-bt-grey-yellow:focus,
.rd-bt-grey-yellow:hover,
.rd-bt-yellow:active,
.rd-bt-yellow:focus,
.rd-bt-yellow:hover {
	background-color: #f1e600;
	color: black;
}

/* Vert */
.rd-bt-green {
	background-color: #96c11f;
	color: white;
}
.rd-bt-grey-green:active,
.rd-bt-grey-green:focus,
.rd-bt-grey-green:hover,
.rd-bt-green:active,
.rd-bt-green:focus,
.rd-bt-green:hover {
	background-color: #7ea11b;
	color: white;
}

/* Rouge */
.rd-bt-grey-red:active,
.rd-bt-grey-red:focus,
.rd-bt-grey-red:hover {
	background-color: #c33;
	color: white;
}

/*╶──────────────────────────────────────╮
╷   Entête : Logo et menu principal      ╵
╰──────────────────────────────────────╴*/

#header {
	max-width: 100%;
	padding: 30px 0;
	text-align: right;
}
#header .logo_outer {
	float: left;
}
#header .logo_outer a {
	display: inline-block;
}
#header .logo_outer a:focus {
	outline: 1px dashed rgba(0, 0, 0, 0.5);
}
@media screen and (max-width: 980px) {
	#header {
		padding-left: 10px;
		padding-right: 10px;
	}
}
#header .logo {
	max-height: 52px;
}
#header .alerts {
	float: right;
	margin: 3px 50px 0 50px;
	text-align: center;
}
#header .alerts_img {
	display: block;
	margin: 0 auto 10px auto;
	background-image: url(/images/common/pictos/notification.png);
	background-size: 42px 42px;
	width: 21px;
	height: 42px;
	text-align: center;
	padding-left: 21px;
	color: white;
	font-weight: bold;
}
#header .alerts_txt {
	text-transform: uppercase;
	line-height: 17px;
}
#header .search {
	margin-top: 5px;
	line-height: 20px;
	border: 1px solid #000;
	padding: 10px 40px 10px 10px;
	width: 363px;
	background-image: url(/images/common/pictos/128black/magnifier.png);
	background-repeat: no-repeat;
	background-size: 20px 20px;
	background-position: calc(100% - 10px) 10px;
}
@media screen and (min-width: 1170px) {
	#header .search {
		width: 548px;
	}
}
#search_box .search::placeholder,
#header .search::placeholder {
	text-align: right;
}

/*╶──────────────────────────────────────╮
╷   Pied de page gris                    ╵
╰──────────────────────────────────────╴*/

.box-footer {
	margin-top: 36px;
	padding: 20px;
	background-color: #eaeaea;
	/* background-image: url(/images/common/footer-background.png); */
}
.box-footer .inner {
	overflow: auto;
}
.box-footer .scroll-top {
	position: absolute;
	top: -16px;
	right: 20px;
}
.box-footer .scroll-top a {
	display: block;
	background-color: #444;
	border-radius: 18px;
	width: 36px;
	height: 36px;
	text-align: center;
}
.box-footer .scroll-top img {
	width: 20px;
	height: 20px;
	padding-top: 8px;
}
.box-footer h3  {
	font-weight: bold;
	border-bottom: 1px solid #000;
	color: #333;
	width: 50px;
}
.box-footer h4 {
	font-size: 14px;
	padding-top: 17px; /* 3 + 17 = 20 au total */
	color: #333;
}
.box-footer li {
	padding-top: 3px;
	color: transparent;
}
.box-footer a:hover,
.box-footer a:focus {
	text-decoration: underline;
	outline: 0 none;
}
#footer0,
#footer1,
#footer2 {
	float: left;
	width: 19%;
	margin-right: 8%; /* 19 * 4 + 8 * 3 = 100 */
}
#footer3 {
	overflow: auto;
}
@media screen and (max-width: 500px) {
	#footer0,
	#footer1,
	#footer2 {
		float: none;
		width: auto;
		margin: 0 0 20px 0;
	}
	.box-footer .inner,
	#footer3 {
		overflow: visible;
	}
}
@media screen and (max-width: 799px) {
	.box-footer {
		padding: 10px;
	}
}

/*╶──────────────────────────────────────╮
╷   Mise en boites                       ╵
╰──────────────────────────────────────╴*/

.page-width {
	max-width: 1245px;
	margin-left: auto;
	margin-right: auto;
	padding: 0 10px;
}
.box-shadow {
	box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
}
/*
.box-shadow {
	background-color: rgba(0, 0, 0, 0.3);
	border-radius: 5px;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
	margin-bottom: 10px;
}
.box-first {
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}
*/
h3.box-title {
	background-color: #888;
	padding: 10px 20px;
	color: white;
}
h3.box-title span {
	text-transform: none;
}
.box-inner {
	background-color: white;
}
.box-space {
	padding: 20px;
}
.box-inner-space {
	background-color: white;
	padding: 20px;
}
@media screen and (max-width: 980px) {
	.page-width {
		padding: 0;
	}
	/* .box-shadow { margin-bottom: 0; } */
	.box-first {
		border-radius: 0;
	}
}
@media screen and (max-width: 799px) {
	.box-footer,
	h3.box-title,
	.box-space,
	.box-inner-space {
		padding: 10px;
	}
}

/*╶──────────────────────────────────────╮
╷   Page standard                        ╵
╰──────────────────────────────────────╴*/

.page_classic,
.page-classic {
	overflow: auto;
}
.page_classic h3.title,
.page-classic h3.title {
	text-align: center;
	font-size: 20px;
	margin-bottom: 20px;
}
.page_classic h3.subtitle,
.page-classic h3.subtitle {
	text-align: center;
	font-size: 14px;
	margin-bottom: 30px;
	text-transform: none;
	color: #888;
}
.page-classic .img {
	float: right;
	margin-left: 50px;
	max-width: 50%;
}
.page-classic div {
	overflow: auto;
	max-width: 580px;
}
h4.classic_title,
.page_classic h4,
.page-classic h4 {
	margin: 20px 0;
	border-left: 5px solid #000;
	padding: 3px 0 3px 10px;
	font-weight: bold;
}
h4.classic_title:first-child,
.page_classic h4:first-child,
.page-classic h4:first-child {
	margin-top: 0;
}
.page_classic strong,
.page-classic strong {
	font-weight: bold;
	color: #c33;
}
.page-classic p {
	margin-bottom: 20px;
	text-align: justify;
}
.page-classic ul {
	list-style: disc;
	padding-left: 20px;
	margin-bottom: 20px;
	text-align: justify;
}
.page-classic ol {
	list-style: decimal;
	padding-left: 20px;
	margin-bottom: 20px;
	text-align: justify;
}
.page-classic p.compact,
.page-classic p:last-child,
.page-classic ul.compact,
.page-classic ul:last-child {
	margin-bottom: 0;
}
@media screen and (max-width: 799px) {
	.page-classic {
		overflow: visible;
	}
	.page-classic div {
		overflow: visible;
		max-width: none;
	}
	.page-classic .img {
		float: none;
		display: block;
		margin: 0 auto;
	}
}

/* Nouveau design */
.page-classic.center,
.page-classic.center p {
	text-align: center;
	color: #333;
}
.page-classic.center .big {
	font-size: 20px;
}
.page-classic.center .small {
	font-size: 14px;
}
@media screen and (max-width: 799px) {
	.page-classic.center-img + div,
	.page-classic.center img + div {
		margin-top: 20px;
	}
}

/*╶──────────────────────────────────────╮
╷   Tableau de type formulaire           ╵
╰──────────────────────────────────────╴*/

.form-table {
	border-collapse: separate;
}
.form-table th,
.form-table td {
	vertical-align: middle;
	border-bottom: 3px solid white;
	padding: 3px 12px;
}
.form-table th {
	background-color: #e9e9e9;
	color: #000;
}
.form-table td {
	border-left: 1px solid white;
	background-color: #fff;
}
.form-table tr:nth-last-child(1) th,
.form-table tr:nth-last-child(1) td {
	border-bottom: 0 none;
}
.form-table td input.text,
.form-table td textarea,
.form-table td select {
	width: 250px;
	max-width: 50vw;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
@media screen and (max-width: 799px) {
	.form-table th,
	.form-table td {
		padding: 1px 3px;
	}
}
.form-table .separator {
	padding: 0;
	height: 10px;
	line-height: 10px;
	background-color: white;
}

/*╶──────────────────────────────────────╮
╷   Tableau de type liste d'elements     ╵
╰──────────────────────────────────────╴*/

.list_table th,
.list_table td {
	color: #999;
	border-bottom: 1px solid #eee;
	padding: 10px;
	vertical-align: middle;
}
.list_table th {
	text-transform: uppercase;
}
.list_table tr:hover td {
	background-color: #eee;
}
.list_table td.narrow {
	padding: 5px;
}
@media screen and (max-width: 639px) {
	.list_table th,
	.list_table td {
		padding: 5px;
	}
}
.list_table strong {
	color: #000;
	font-weight: bold;
}
.list_table em {
	font-weight: bold;
}

/* ╶────╴  Ancien design  ╶────╴ */

.list-table {
	border: 1px solid #ccc;
	border-top: 1px solid #777;
	margin-top:8px;
	/*width: 100%; ** Faut-il forcer les 100% ici ? */
}
.list-table th,
.list-table td {
	vertical-align: middle;
	padding: 5px 10px;
	border-right: 1px solid #ccc;
	border-left: 1px solid #ccc;
	min-height: 40px;
}
.list-table thead th {
	background-color: #777;
	border-color: #777;
	color: white;
}
.list-table tbody tr:nth-child(odd) th,
.list-table tbody tr:nth-child(odd) td {
	background-color: #ddd;
}
.list-table tbody:nth-child(odd) tr:nth-child(odd) th,
.list-table tbody:nth-child(odd) tr:nth-child(odd) td {
	background-color: #eee;
}
.list-table tbody tr:hover th,
.list-table tbody tr:hover td {
	background-color: #ddd;
}
.list-table a.bt {
	text-align: center;
	display: block;
	margin: 2px 0;
}
.list-table a.bt:nth-child(1) {
	margin-top: 0;
}
.list-table a.bt:nth-last-child(1) {
	margin-bottom: 0;
}
@media screen and (max-width: 799px) {
	.list-table th,
	.list-table td {
		padding: 1px 3px;
	}
	.list-table a.bt {
		margin: 1px 0;
	}
}

/*╶──────────────────────────────────────╮
╷   Layers du menu complet sur PC        ╵
╰──────────────────────────────────────╴*/

#overbox4 {
	position: absolute;
	top: 311px;
	top: 228px;
	left: 0;
	z-index: 42;
	padding-top: 9px;
	max-width: calc(100% - 40px);
}
@media screen and (max-width: 980px) {
	#overbox4 {
		display: none;
	}
}
body.is_a_alerts_ct #overbox4 {
	top: 265px;
}
#overbox4.hide {
	display: none;
}
#overbox4 .close_link {
	position: absolute;
	top: 9px;
	right: 0;
}
#overbox4 .close_img {
	padding: 8px;
	width: 19px;
	height: 19px;
}
#overbox4 .arrow_outer {
	position: absolute;
	top: 0;
	left: 35px;
}
#overbox4 .arrow_inner {
	width: 1px;
	height: 0;
	border: 9px solid transparent;
	border-bottom-color: black;
	border-top: 0 none transparent;
}
#overbox4 .overbox4 {
	border: 1px solid black;
	background-color: white;
	padding-bottom: 15px;
}
#overbox4 .submenu {
	display: none;
	float: left;
	width: 224px;
	padding: 15px 0 0 15px;
	color: black;
}
#overbox4 .submenu li {
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	padding: 10px 0;
	height: 20px;
	line-height: 20px;
	text-transform: uppercase;
	font-weight: bold;
	background-image: url(/images/common/pictos/128gray/right.png);
	background-position: 95% 50%;
	background-repeat: no-repeat;
	background-size: 20px 20px;
	cursor: pointer;
}
#overbox4 .submenu li:last-child {
	border-bottom: 0 none;
}
#overbox4 .submenu li.selected,
#overbox4 .submenu li:hover {
	background-image: url(/images/common/pictos/128black/right.png);
}
#overbox4 .submenu li.selected {
	cursor: default;
	border-right-color: transparent;
}
#overbox4 .families {
	max-width: 776px;
	padding-right: 15px;
}
@media screen and (min-width: 1111px) {
	#overbox4 .families {
		min-width: 791px;
	}
}
#overbox4 .family2 {
	display: none;
	vertical-align: middle;
	font-weight: bold;
	padding-top: 5px;
	text-align: left;
}
#overbox4 .family {
	float: left;
	margin: 15px 0 0 15px;
	width: 179px;
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
}
#overbox4 .no_preview,
#overbox4 .preview {
	display: block;
	max-width: 80px;
	max-height: 80px;
	margin: 0 auto 10px;
}
#overbox4 .no_preview {
	border: 1px solid #ccc;
	width: 78px;
	height: 78px;
}
#overbox4 .picto {
	vertical-align: middle;
}

/* catégories */
#overbox4.submenu .submenu {
	display: block;
}
#overbox4.submenu .families {
	margin-left: 239px;
}

/* catalogue produits */
#overbox4.families .overbox4 {
	padding: 15px;
}
#overbox4.families .families {
	column-width: auto;
	column-count: 3;
	font-size: 13px;
}
#overbox4.families .family2 {
	display: block;
}

/*╶──────────────────────────────────────╮
╷   Menu des super-familles sur PC       ╵
╰──────────────────────────────────────╴*/

#overmenu-disable, .overnav { display: none; } /* TODO: A nettoyer proprement ! */
.overbox2-arrow-outer {
	top: 0;
}
#overbox2 .overbox2-arrow-inner {
	/* On annule la couleur de la famille : */
	border-left-color: transparent;
	border-right-color: transparent;
}
#overbox2 {
	position: absolute;
	top: 228px;
	left: 0;
	width: 650px;
	max-width: calc(100% - 40px);
	padding-top: 10px;
	z-index: 1;
}
#overbox2.overmenu-2cols {
	width: 980px;
}
#overbox2.hide {
	display: none;
}
@media screen and (max-width: 980px) {
	#overbox2 {
		display: none;
	}
}
#overbox2 .overbox2 {
	display: none;
	background-color: white;
	padding: 60px 20px 20px 20px;
	border-top-width: 5px;
	border-top-style: solid;
	box-shadow: 0 3px 15px rgba(0,0,0,0.5);
}
#overbox2 .close {
	position: absolute;
	top: 20px;
	right: 20px;
}
#overbox2 .close img {
	width: 20px;
	height: 20px;
}
#overbox2 .overfamily-detail {
	float: right;
	width: 252px;
}
.overbox2-preview {
	display: none;
	border: 1px solid #bbb;
}
.overbox2-preview-current {
	display: block;
}
#overbox2 h4 {
	text-align: center;
	text-transform: uppercase;
	margin: 10px 0 5px 0;
	font-weight: bold;
}
#overbox2 .overfamily-detail p {
	text-align: center;
	color: #666;
}
#overbox2 .overfamilies-links {
	float: left;
	width: calc(100% - 305px);
}
#overbox2 .overfamily-hover-color {
	display: block;
	background-image: url(/images/common/pictos/128gray/right.png);
	background-position: 0% 50%;
	background-repeat: no-repeat;
	background-size: 10px 10px;
	border-top: 1px solid #e3e3e3;
	padding: 10px 0 10px 15px;
	font-weight: bold;
}
#overbox2 .overmenu-2cols .overfamily-hover-color {
	width: calc((100% - 55px) / 2);
}
#overbox2 .overmenu-2cols .overfamily-hover-color:nth-child(2n+1) {
	clear: both;
	float: left;
}
#overbox2 .overmenu-2cols .overfamily-hover-color:nth-child(2n) {
	float: right;
}
#overbox2 .overmenu-2cols .overfamily-hover-color:nth-child(2),
#overbox2 .overfamily-hover-color:first-child {
	border-top: 0 none;
}

/*╶──────────────────────────────────────╮
╷   Menu des super-familles sur PC       ╵
╰──────────────────────────────────────╴*/

#overmenu2-overfamilies,
#fullmenu {
	padding: 12px 0;
	margin-bottom: 20px;
}
#overmenu2-overfamilies a,
#fullmenu a {
	float: left;
	border-right: 1px solid #ccc;
	padding: 3px 0 0 0;
	height: 36px;
	display: inline-block;
	text-transform: uppercase;
	font-size: 13px;
	font-weight: bold;
	line-height: 15px;
	text-align: center;
}
#overmenu2-overfamilies a:last-child,
#fullmenu a:last-child {
	border-right: 0 none;
	padding-right: 0 !important;
}
#overmenu2-overfamilies .line-lonely,
#fullmenu .line_lonely {
	display: inline-block;
	padding-top: 8px;
}
#overmenu2-overfamilies .line-last,
#fullmenu .line_last {
	display: inline-block;
	margin: 0 auto;
	border-bottom-width: 2px;
	border-bottom-style: none;
}
#overmenu2-overfamilies .selected:hover .line-last { border-color: transparent; }
#fullmenu a:hover .line_last {
	border-bottom-style: solid;
}
#fullmenu .selected:hover .line_last {
	border-bottom-style: none;
}

/*╶──────────────────────────────────────╮
╷   Dialogues modaux                     ╵
╰──────────────────────────────────────╴*/

#overbox3-bg.hide {
	display: none;
}
#overbox3-bg {
	position: fixed;
	z-index: 301;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(51, 51, 51, 0.5);
}
#overbox3 {
	position: fixed;
	top: 0;
	left: 0;
	max-width: 958px;
}
#overbox3 .overbox3 {
	display: none;
	border: 1px solid #000;
	border-radius: 3px;
	background-color: white;
	overflow: auto;
}
#overbox3 .overbox3.selected {
	display: block;
}
#overbox3 h3 {
	margin-bottom: 20px;
	border-left: 5px solid #000;
	padding: 3px 0 3px 10px;
	color: black;
	text-transform: none;
	font-size: 12px;
	font-weight: bold;
}
#overbox3 .h3-close-link {
	float: right;
}
#overbox3 .h3-close-img {
	width: 20px;
	height: 20px;
}

/*╶──────────────────────────────────────╮
╷   Étapes de commande                   ╵
╰──────────────────────────────────────╴*/

.order_steps table {
	margin: 0 auto;
}
.order_steps td {
	width: 160px;
	text-align: center;
	color: #999;
}
.order_steps td[colspan] {
	width: 800px;
}
@media screen and (max-width: 870px) {
	.order_steps {
		display: none;
	}
}

/*╶──────────────────────────────────────╮
╷   Alertes                              ╵
╰──────────────────────────────────────╴*/

.if_a_alerts_ct,
.if_o_alerts_ct,
.if_b_alerts_ct,
.if_p_alerts_ct {
	display: none;
}
body.is_a_alerts_ct .if_a_alerts_ct.block,
body.is_o_alerts_ct .if_o_alerts_ct.block,
body.is_b_alerts_ct .if_b_alerts_ct.block,
body.is_p_alerts_ct .if_p_alerts_ct.block {
	display: block;
}
body.is_a_alerts_ct .if_a_alerts_ct.inline,
body.is_o_alerts_ct .if_o_alerts_ct.inline,
body.is_b_alerts_ct .if_b_alerts_ct.inline,
body.is_p_alerts_ct .if_p_alerts_ct.inline {
	display: inline;
}
.alerts_red.if_a_alerts_ct,
.alerts_red.if_o_alerts_ct,
.alerts_red.if_b_alerts_ct,
.alerts_red.if_p_alerts_ct {
	color: #c33;
	font-weight: bold;
}
/*
a:hover .alerts_red.if_a_alerts_ct,
a:hover .alerts_red.if_o_alerts_ct,
a:hover .alerts_red.if_b_alerts_ct,
a:hover .alerts_red.if_p_alerts_ct {
	color: black;
}
*/

/*╶──────────────────────────────────────╮
╷   Sections mobile                      ╵
╰──────────────────────────────────────╴*/

.sections_mobile {
	overflow: auto;
	background-color: #ccc;
	margin-bottom: 10px;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.8);
}
.sections_mobile a {
	float: left;
	width: calc((100% - 3px) / 4);
	background-color: white;
	text-align: center;
	color: #666;
	margin-right: 1px;
	border-bottom: 4px solid transparent;
	padding: 10px 0;
}
.sections_mobile a:last-child {
	float: right;
	margin-right: 0;
}
.sections_mobile img {
	width: 32px;
	height: 32px;
}
.sections_mobile .txt {
	line-height: 17px;
	display: block;
}
.sections_mobile a:hover,
.sections_mobile a:focus,
.sections_mobile a:active,
.sections_mobile a.selected {
	color: black;
	border-bottom-color: black;
}
.sections_mobile .abbr br,
.sections_mobile .label {
	display: none;
}
@media screen and (min-width: 640px) {
	.sections_mobile .abbr {
		display: none;
	}
	.sections_mobile .label {
		display: inline;
	}
}
@media screen and (max-width: 420px) {
	body.is_a_alerts_ct .sections_mobile .txt,
	.sections_mobile_account .txt {
		min-height: 34px;
	}
	body.is_a_alerts_ct .sections_mobile .alerts_red {
		display: block;
	}
	.sections_mobile .abbr br {
		display: inline;
	}
}

/*╶──────────────────────────────────────╮
╷   Sections PC                          ╵
╰──────────────────────────────────────╴*/

.sections_pc {
	text-align: center;
	margin-bottom: 40px;
}
.sections_pc h3.title {
	text-align: center;
	font-size: 20px;
	padding-bottom: 20px;
}
.sections_pc_inner {
	display: inline-block;
}
.sections_pc_liner {
	position: absolute;
	top: 20px;
	left: 0;
	right: 0;
	height: 1px;
	background-color: #ccc;
	z-index: 0;
}
.sections_pc_inner a {
	float: left;
	margin-right: 30px;
	border: 1px solid #ccc;
	background-color: white;
	padding: 10px;
	text-transform: uppercase;
	position: relative;
	top: 0;
	left: 0;
	z-index: 1;
}
.sections_pc_inner a:last-child {
	margin-right: 0;
}
.sections_pc_inner a.selected,
.sections_pc_inner a:hover {
	background-color: black;
	border-color: black;
	color: white;
}

/*eof*/