/* Histoires Décalées - user.css
   © Eric Reboux Software 29/08/2026 */

/*@font-face
{
	font-family: 'EB Garamond';
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url('/media/templates/site/cassiopeia_histoires_decalees/fonts/garamond.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}*/

@font-face
{
	font-family: 'Fcaslon Twelve';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	ascent-override: 150%;
	size-adjust: 95%;
	src: url('/media/templates/site/cassiopeia_histoires_decalees/fonts/fcaslon_twelve.woff2') format('woff2');
}

@font-face
{
	font-family: 'Overlock';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	size-adjust: 115%;
	src: url('/media/templates/site/cassiopeia_histoires_decalees/fonts/Overlock-Regular.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face
{
	font-family: 'Overlock';
	font-style: italic;
	font-weight: 400;
	font-display: swap;
	size-adjust: 115%;
	src: url('/media/templates/site/cassiopeia_histoires_decalees/fonts/Overlock-Italic.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face
{
	font-family: 'Overlock';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	size-adjust: 115%;
	src: url('/media/templates/site/cassiopeia_histoires_decalees/fonts/Overlock-Bold.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face
{
	font-family: 'Overlock';
	font-style: italic;
	font-weight: 700;
	font-display: swap;
	size-adjust: 115%;
	src: url('/media/templates/site/cassiopeia_histoires_decalees/fonts/Overlock-BoldItalic.woff2') format('woff2');
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root
{
	--site_color: #51618A;
	--site_color_light: color-mix(in srgb, var(--site_color) 80%, white);
	--site_color_dark: color-mix(in srgb, var(--site_color) 80%, black);
	--site_color_light2: color-mix(in srgb, var(--site_color) 50%, white);
	--site_color_dark2: color-mix(in srgb, var(--site_color) 50%, black);
	--site_color_light3: color-mix(in srgb, var(--site_color) 20%, white);
	--site_color_dark3: color-mix(in srgb, var(--site_color) 20%, black);
	--site_color_flash: #DCAE73;
	--title_color: #22262A;
}

a:not(.btn), a:not([class])
{
	color: var(--site_color);
	text-decoration: none;
}

a:not(.btn):hover
{
	color: var(--site_color_dark2);
	text-decoration: none!important;
}

.btn-primary
{
	background: var(--site_color_dark);
	border: 1px solid var(--site_color_dark2);

	&:hover, &:active
	{
		background: var(--site_color_dark2);
		border: 1px solid var(--site_color_dark3);
	}
}

.btn-secondary
{
	background: #fff8;
	border: 1px solid var(--site_color_light);
	color: var(--site_color);

	&:hover, &:active
	{
		background: #fff;
		border: 1px solid var(--site_color_dark);
		color: var(--site_color_dark);
	}
}

h1, h2, h3, h4, h5, h6
{
	font-family: 'Fcaslon Twelve';
	font-weight: 400;
	color: var(--title_color);
}

h1
{
	margin-bottom: 32px;
}

h1:before
{
	content: "";
	display: inline-block;
	float: left;
	width: min(8vw,48px);
	height: min(8vw,48px);
	margin-top: 0px;
	margin-right: 8px;
	background-image: url("/images/theme/lion_hd.png");
	background-image: image-set(url("/images/theme/lion_hd.webp") type("image/webp"), url("/images/theme/lion_hd.png") type("image/png"));
	background-size: min(8vw,44px);
	background-position: 50%;
	background-repeat: no-repeat;
	filter: drop-shadow(0 1px 1px #0008);
}

body
{
	//background: linear-gradient(160deg, #f6eedb, #dacca8);
	background: linear-gradient(160deg, #fcfdff, #dae0ee);
	font-family: "Overlock", sans-serif;
	font-style: normal;
	font-weight: 400;

	header
	{
		box-shadow: none!important;

		&.position-sticky
		{
			position: sticky !important;
		}

		.container-nav
		{
			min-height: 58px;
			padding: 0px!important;
			filter: drop-shadow(0 2px 16px #0004);
			will-change: filter;
			transform: translateZ(0);
			-webkit-backface-visibility: hidden;
			overflow: visible;

			.navbar-brand
			{
				display: flex;
				width: 100%;
				padding: 0!important;
				background: linear-gradient(170deg, #283543 68.91%, #000);
				box-shadow: inset 0 5px 5px #0004;
				z-index: 2;

				&:before
				{
					content: "";
					position: absolute;
					background: #283543;
					top: 2px;
					left: 30px;
					display: block;
					width: 90px;
					height: 90px;
					border-radius: 50%;
					clip-path: inset(10px 0 0 0);
				}

				.brand-logo
				{
					position: absolute;
					left: 40px;
					top: 2px;
					overflow: hidden;

					img
					{
						width: 320px;
						min-width: 320px;
						filter: drop-shadow(0 1px 4px #fff4);
						cursor: pointer;

						&:hover
						{
							filter: drop-shadow(0 1px 4px #fffb);
						}
					}
				}

				.author-logo
				{
					margin-left: auto;

					img
					{
						display: block;
						height: 32px;
						margin: 8px;
						filter: brightness(0) saturate(100%) invert(76%) sepia(28%) saturate(650%) hue-rotate(346deg) brightness(92%) contrast(88%);
					}
				}

				nav
				{
					margin: 0 0 0 auto;

					.mod-menu
					{
						color: white;
						font-family: 'Fcaslon Twelve';
						font-size: 18px;
						font-weight: 600;
						text-transform: uppercase;

						li
						{
							padding: 16px!important;

							a:hover
							{
								color: var(--site_color_light2);
								text-decoration: none;

								&:after
								{
									background-color: var(--site_color_light2);
									opacity: 1;
								}
							}

							button.mm-toggler-link
							{
								anchor-name: --menu-trigger;

								&:before
								{
									display: none;
								}

								&:after
								{
									content: '\f078';
									display: inline-block;
									width: initial;
									height: initial;
									margin-top: -4px;
									background: none;
									border: none;
									font-family: "Font Awesome 6 Free";
									font-weight: 900;
								}
							}

							ul.mm-collapse
							{
								position: fixed;
								position-anchor: --menu-trigger;
								z-index: 1000;
								position-area: span-left bottom;
								position-try-fallbacks: span-right bottom, span-left top, span-right top, flip-block, flip-inline, flip-block flip-inline;
								inset: 16px auto auto;
								margin: 0px;
								transform: none;
								width: max-content;
								background: linear-gradient(160deg, #fcfdff, #dae0ee);

								li:not(.level-1)
								{
									padding: 8px!important;

									a:hover
									{
										color: var(--site_color);
									}
								}
							}
						}
					}
				}
			}
		}
	}

	&.home-page
	{
		.container-component
		{
			margin: 0 0 32px 0;

			main
			{
				margin: 32px 32px;

				.btn.liste_visites
				{
					position: relative;
					float: right;
					margin: 0 0 -60px 0;
					z-index: 2;
				}
			}
		}
	}

	& > .site-grid
	{
		grid-gap: 0!important;

		.container-banner
		{
			margin: 0;

			&.full-width
			{
				grid-column: 1 / -1;
			}
		}

		.slideshowck
		{
			margin-bottom: 48px!important;
			box-shadow: 0 2px 20px #0004;

			&.slider_desktop
			{
				max-height: max(36vw, 400px);
			}

			&.slider_mobile
			{
				display: none!important;
			}

			&:not(.slider_mobile) .cameraSlide img
			{
				width: 100%!important;
				margin-left: 0!important;
				margin-top: -10vw!important;
			}

			.camera_fakehover
			{
				.camera_commands
				{
					background: none;
				}

				.camera_prev, .camera_next, .camera_play, .camera_stop
				{
					position: relative;
					background: none;

					& > span
					{
						background: none;
					}

					&.camera_prev:after
					{
						content: "\f053";
						position: absolute;
						left: 8px;
						top: 0;
						width: 40px;
						height: 40px;
						font-family: "Font Awesome 6 Free";
						font-size: 24px;
						font-weight: 900;
						color: black;
					}
				}
			}

			.camera_caption
			{
				& > div
				{
					background: linear-gradient(to right, #000, #0000);

					.camera_caption_title
					{

						background: none;
						font-family: 'Fcaslon Twelve';
						font-size: 32px;
						font-weight: 600;
					}

					.camera_caption_desc
					{
						margin-top: 8px;
					}
				}
			}
		}

		.banner
		{
			.mod-custom
			{
				& > p:empty
				{
					display: none;
				}

				.banner_box
				{
					position: relative;
					width: 100%;
					height: 45vw;
					max-height: 600px;
					box-shadow: 0 2px 20px #0004;
					overflow: hidden;

					img
					{
						display: block;
						width: 100%;
						height: 100%;
						object-fit: cover;
						object-position: center 50%;
					}

					a.banner_button
					{
						position: absolute;
						display: block;
						top: 20px;
						right: 20px;
						padding: 4px 8px;
						border: 2px solid var(--site_color_flash);
						border-radius: 32px;
						font-family: Roboto, sans-serif;
						font-size: 18px;
						color: var(--site_color_flash);
						backdrop-filter: blur(24px);
						filter: drop-shadow(0px 2px 8px #0008);
						cursor: pointer;
					}
				}
			}

			&.position_top .banner_box img
			{
				object-position: center 0;
			}

			&.position_middle_top .banner_box img
			{
				object-position: center 20%;
			}

			.banner_blur_title
			{
				position: relative;
				width: fit-content;
				margin-left: min(160px, 9vw);
				margin-top: -128px;
				margin-bottom: 60px;

				.banner_blur
				{
					position: absolute;
					inset: 0;
					pointer-events: none;
					backdrop-filter: blur(24px);
					mask-image: linear-gradient(to right, #000, #0000);
					filter: opacity(0);
					border-radius: 64px 0 0 64px;
					animation: revealBlur 1.5s ease-out 0.5s forwards;
				}

				.banner_title
				{
					position: relative;
					width: fit-content;
					padding: 16px;
					top: 4px;
					background: linear-gradient(to right, #0002, #0000);
					border-radius: 64px 0 0 64px;
					color: white;
					text-shadow: 0 1px 4px #0008;
					opacity: 0;
					transform: translateY(16px);
					animation: fadeInUp 1.0s ease-out 0.5s forwards;

					&:before
					{
						margin-top: -4px;
						filter: drop-shadow(0 1px 1px #fff8);
					}
				}
			}
		}

		.container-component
		{
			margin: 0 0 32px 0;

			main
			{
				margin: 32px min(10.7vw, 183px);

				.mod-breadcrumbs__wrapper
				{
					margin-bottom: 32px;
				}

				.com-content-category-blog
				{
					margin-top: 20px;

					.com-content-category-blog__items
					{
						column-gap: 24px;

						.blog-item
						{
							margin-bottom: 24px;
							background: #fff8;
							border: 1px solid #0001;
							box-shadow: 0 1px 12px #0001;

							.item-image
							{
								width: 100%;
								margin: 0 0 4px 0;
								box-shadow: 0 1px 8px #0002;

								& > img
								{
									display: block;
									width: 100%;
									height: 240px;
									object-fit: cover;
									object-position: center;
								}
							}

							.item-content
							{
								padding: 16px 16px 0 16px;

								.page-header
								{
									h2
									{
										margin-bottom: 16px;
									}
								}

								.readmore
								{
									.icon-chevron-right:before
									{
										content: "";
										display: inline-block;
										margin-right: 4px;
										margin-bottom: -7px;
										width: 24px;
										height: 24px;
										background-image: image-set(url("/images/theme/lion_hd.webp") type("image/webp"), url("/images/theme/lion_hd.png") type("image/png"));
										background-size: 24px;
										background-position: 0 0;
										filter: drop-shadow(0 1px 0 #0008);
									}
								}
							}
						}
					}
				}

				.com-content-article
				{
					.home_intro
					{
						display: flex;
						align-items: center;
						flex-wrap: wrap;
						gap: 32px;
						margin: 32px 0 64px;

						& > section
						{
							flex: 1 1 480px;
							min-width: min(100%, 320px);
						}

						.image_container
						{
							position: relative;
							flex: 1 1 480px;
							max-width: 100%;
							height: auto;
							min-width: min(100%, 320px);

							img
							{
								width: inherit;
								box-shadow: 0 4px 15px #0004;
							}

							a
							{
								position: absolute;
								display: block;
								top: 20px;
								right: 20px;
								padding: 4px 8px;
								background: #0005;
								border: 2px solid var(--site_color_flash);
								border-radius: 32px;
								font-family: Roboto, sans-serif;
								font-size: 18px;
								color: var(--site_color_flash);
								backdrop-filter: blur(24px);
								filter: drop-shadow(0px 2px 8px #0008);
								cursor: pointer;
							}
						}
					}

					.item-image
					{
						width: 50%;
						box-shadow: 0 4px 15px #0004;

						&.left
						{
							margin-right: 30px;
							margin-bottom: 30px;
						}
					}

					.images_article
					{
						clear: both;
						display: flex;
						justify-content: center;
						align-items: center;
						flex-wrap: wrap;
						gap: 30px;

						& > img
						{
							width: max(35vw, 320px);
							box-shadow: 0 4px 15px #0004;
						}
					}
				}

				.dernieres_visites
				{
					h2
					{
						position: relative;
						margin-bottom: 8px;

						a
						{
							color: var(--site_color_dark);
						}
					}

					& > h2:after
					{
						content: "";
						position: absolute;
						background: linear-gradient(to right, var(--title_color), #0000);
						display: block;
						left: 0;
						bottom: 0;
						width: 70%;
						height: 1.5px;
					}

					.mod-articles-items.mod-list
					{
						display: grid;
						grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
						gap: 20px;
						width: 100%;
						margin: 0 0 1em;
						padding: 8px 0;

						& > li
						{
							min-height: 600px;
							display: flex;
							flex-direction: column;

							.mod-articles-item
							{
								flex-grow: 1;
								display: flex;
								flex-direction: column;

								.mod-articles-item-content
								{
									display: inline-flex;
									flex-direction: column;
									page-break-inside: avoid;
									break-inside: avoid;
									flex-grow: 1;
									overflow: hidden;
									background: #fff8;
									border: 1px solid #0001;
									box-shadow: 0 1px 12px #0001;

									.item-image
									{
										width: 100%;
										margin: 0 0 4px 0;
										box-shadow: 0 1px 8px #0002;

										& > img
										{
											display: block;
											width: 100%;
											height: 240px;
											object-fit: cover;
											object-position: center;
										}
									}

									.item-text
									{
										display: flex;
										flex-direction: column;
										flex-grow: 1;
										padding: 16px 16px 0 16px;

										& > p
										{
											text-align: justify;
										}

										.readmore
										{
											margin-top: auto;
											align-self: center;

											a
											{
												&:hover
												{
													text-decoration: none;
												}

												.icon-chevron-right:before
												{
													content: "";
													display: inline-block;
													margin-right: 4px;
													margin-bottom: -7px;
													width: 24px;
													height: 24px;
													background-image: image-set(url("/images/theme/lion_hd.webp") type("image/webp"), url("/images/theme/lion_hd.png") type("image/png"));
													background-size: 24px;
													background-position: 0 0;
													filter: drop-shadow(0 1px 0 #0008);
												}
											}
										}
									}
								}
							}
						}
					}
				}
			}
		}
	}

	footer
	{
		margin: 0!important;
		background: radial-gradient(circle at 50% 0%,#283543 50%,#171e26)!important;
		box-shadow: 0 -3px 2px rgba(0,0,0,.24) inset, 0 5px 5px rgba(0,0,0,.44) inset!important;
		z-index: 2;

		.container-footer-bar
		{
			position: relative;
			justify-content: space-evenly!important;
			gap: 40px 20px;

			.moduletable.text-centered
			{
				max-width: 25%;
				font-size: 15px;
				text-align: center;
				color: white;
				z-index: 2;

				h3
				{
					background: transparent url("/media/templates/site/cassiopeia_histoires_decalees/images/module_line.png") 50% 105% no-repeat;
					background-size: 35%;
					height: 50px;
					margin-bottom: 18px;
					color: var(--site_color_flash);
					font-size: 22px;
					text-transform: uppercase;
					filter: drop-shadow(0px 2px 4px rgba(0, 0, 0, 0.8));
					transform: translateZ(0);
				}

				p
				{
					margin: 6px 0;
				}

				a
				{
					font-family: 'Fcaslon Twelve', sans-serif;
					font-size: 19px;
					color: var(--site_color_light2)!important;

					&:hover
					{
						color: var(--site_color_light3)!important;
					}
				}

				ul.latestnews
				{
					display: flex;
					flex-direction: column;
					align-items: flex-start;
					width: fit-content;
					margin: 0 auto;
					list-style-type: none;
					text-align: left;

					li
					{
						background: transparent url("/media/templates/site/cassiopeia_histoires_decalees/images/arrow_bc_white.png") 0 50% no-repeat;
						background-size: 12px;
						padding-left: 16px;
					}
				}
			}
		}

		& > .grid-child
		{
			padding: 32px!important;

			&.footer-content
			{
				gap: 8px;
				padding: 32px 64px!important;
			}
		}

		.module_copyright
		{
			.mod-custom
			{
				p:not(last-of-type)
				{
					margin: 0;
				}
			}
		}

		.mod-menu
		{
			display: flex;
			justify-content: center;
			flex-direction: row;
			flex-wrap: wrap;
			gap: 0px 16px;

			a
			{
				font-family: 'Fcaslon Twelve', sans-serif;
				font-size: 19px;
				color: var(--site_color_light2)!important;

				&:hover
				{
					color: var(--site_color_light3)!important;
				}
			}
		}
	}

	#back-top
	{
		bottom: 8px;
		right: 8px;
		background: none;
		border: none;
		font-size: 28px;
		color: white;
		opacity: 0.5;

		& .icon-arrow-up:before
		{
			content: "\f139";
			text-shadow: 0 1px 2px #000b;
		}
	}
}

body.view-article:not(.home-page, .failles_urbaines) .banner
{
	.banner_box
	{
		height: 22vw;
	}

	.banner_blur_title
	{
		margin-top: -96px;

		.banner_title:before
		{
			display: inline;
			content: "\f053";
			width: initial;
			height: initial;
			float: none;
			background: none;
			font-family: "Font Awesome 6 Free";
			font-size: 28px;
			font-weight: 900;
		}
	}
}

.moduletable.reassurance
{
	background: radial-gradient(circle at 50% 0%, #2d3b4b 50%, #283543)!important;
	box-shadow: 0 1px 16px #0004!important;
	color: white;

	h2
	{
		margin: 0;
		padding: 24px;
		font-family: 'Fcaslon Twelve';
		text-align: center;
		color: white;
	}

	.reassurance_section
	{
		padding: 24px 24px 48px 24px;
		font-family: "Source Sans 3", "Segoe UI", sans-serif;

		.reassurance_list
		{
			list-style: none;
			margin: 0 auto;
			padding: 0;
			max-width: 1300px;
			display: flex;
			align-items: stretch;
			justify-content: space-between;
			gap: 0;

			.reassurance_item
			{
				flex: 1 1 0;
				min-width: 0;
				display: flex;
				flex-direction: column;
				align-items: center;
				text-align: center;
				padding: 0 1.35rem;
				position: relative;

				& + .reassurance_item::before
				{
					content: "";
					position: absolute;
					left: 0;
					top: 0.4rem;
					bottom: 0.4rem;
					width: 1px;
					background: linear-gradient(to bottom, #0000, var(--site_color_flash), #0000);
				}

				.reassurance_icon
				{
					width: auto;
					height: 48px;
					margin-bottom: 1.15rem;
					color: var(--site_color_flash);
				}

				.reassurance_title
				{
					margin: 0 0 0.7rem;
					color: var(--site_color_flash);
					font-family: Roboto, sans-serif;
					font-size: 16px;
					font-weight: 400;
					letter-spacing: 0.08em;
					text-transform: uppercase;
					line-height: 1.25;
				}

				.reassurance_text
				{
					margin: 0;
					max-width: 16rem;
					font-family: 'Fcaslon Twelve';
					font-size: 16px;
					font-weight: 400;
					line-height: 1.45;
				}
			}
		}
	}
}

.moduletable.reviews
{
	background: radial-gradient(circle at 50% 0%, #2d3b4b 50%, #283543)!important;
	box-shadow: 0 1px 16px #0004!important;
	color: white;

	h2
	{
		margin: 0;
		padding: 24px;
		font-family: 'Fcaslon Twelve';
		text-align: center;
		color: white;
	}

	.reviews_section
	{
		.googlereviewspro-widget
		{
			.grp-widget-box
			{
				display: flex;
				flex-direction: column;
				font-family: Overlock, sans-serif;

				.grp-widget-box-head, .grp-widget-box-request, .grp-reviews-container
				{
					background: none;
				}

				.grp-widget-box-head
				{
					order: 0;
					display: flex;
					flex-wrap: wrap;
					justify-content: center;
					align-items: center;
					gap: 32px;
					margin-top: -20px;
					padding: 0 20px;

					.grp-widget-box-head-honor
					{
						order: 1;
						padding: 0;

						.grp-widget-box-head-honor-rating
						{
							display: none;
						}

						.grp-widget-box-head-honor-stars
						{
							display: flex;
							margin: 0 0 0 -24px;
							font-size: 20px;
							color: var(--site_color_flash);
							filter: drop-shadow(0 1px 4px #fff4);
						}
					}

					.grp-widget-box-head-title
					{
						order: 0;
						width: 256px;
						height: 60px;
						margin: 0;
						background-image: url('/images/theme/logo_hd2c.webp');
						background-size: 256px auto;
						background-position: 0;
						background-repeat: no-repeat;
						color: transparent;
						text-shadow: none;
						font-size: 0;
						filter: drop-shadow(0 1px 4px #fff4);
						cursor: pointer;
					}

					.grp-widget-box-head-subtitle
					{
						order: 2;
						font-size: 13px;
					}
				}

				.grp-reviews-container
				{
					order: 1;

					.grp-reviews-container-inner
					{
						padding: 20px 20px 0 20px;

						.grp-reviews-item-inner
						{
							padding-bottom: 0!important;

							.grp-reviews-review
							{
								margin-bottom: 8px;
								background: #fff1;
								border-radius: 0;
								font-family: 'Fcaslon Twelve';
								color: white;
								box-shadow: 0 1px 8px #0003;

								.grp-reviews-review-head
								{
									overflow: initial;

									.grp-reviews-review-author-name
									{
										font-size: 16px;
										color: white;
									}

									.grp-reviews-review-author-info
									{
										.grp-reviews-review-rating
										{
											color: var(--site_color_flash);
										}

										.grp-reviews-review-date
										{
											font-size: 13px;
										}
									}
								}

								.grp-reviews-review-text-wrap
								{
									.grp-reviews-review-text
									{
										font-size: 16px;
									}
								}
							}
						}

						.grp-slick-slider
						{
							.grp-slick-arrow
							{
								opacity: 0.2;

								svg
								{
									height: 28px!important;
								}
							}
						}
					}
				}

				.grp-widget-box-request
				{
					order: 2;
					padding: 20px;
					font-size: 13px;

					.grp-btn-primary
					{
						background: var(--site_color_flash);
						color: var(--site_color_dark3);
					}
				}
			}
		}
	}
}

.moduletable.presentation_nicolas
{
	position: relative;
	background-image: url("/images/accueil/presentation_nicolas.webp");
	background-size: cover;
	background-position: right center;
	box-shadow: #0001 0px 1px 16px !important;

	.mod-custom
	{
		position: relative;

		& > p:empty
		{
			display: none;
		}

		.box_text_blur
		{
			position: absolute;
			width: 50%;
			padding: 10%;
			inset: 0px;
			pointer-events: none;
			backdrop-filter: blur(10px);
			mask-image: linear-gradient(to right, rgb(0, 0, 0), rgba(0, 0, 0, 0));
			filter: opacity(0);
		}

		.box_text
		{
			background: linear-gradient(to right, #fff, #fff0 66%);
			font-size: 17px;

			& > .text
			{
				width: 50%;
				padding: 10%;

				h2
				{
					margin-bottom: 32px;
				}

				h3, h4
				{
					margin-top: 32px;
				}
			}
		}
	}
}

.categories_failles_urbaines
{
	ul
	{
		display: grid;
		grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
		gap: 20px;
		width: 100%;
		margin: 0 0 1em;
		padding: 8px 0;

		& > li
		{
			display: flex;
			flex-direction: column;
			flex-grow: 1;
			overflow: hidden;
			background: #fff8;
			padding: 0;
			border: 1px solid #0001;
			box-shadow: 0 1px 12px #0001;

			a
			{
				display: flex;
				flex-direction: column;
				flex-grow: 1;

				p > img
				{
					display: block;
					width: 100%;
					height: 240px;
					object-fit: cover;
					object-position: center;
				}

				h2
				{
					margin-top: auto;
					padding: 16px;
				}
			}
		}
	}
}

@keyframes fadeInUp
{
	to
	{
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes revealBlur
{
	from
	{
		filter: opacity(0);
	}
  	to
	{
		filter: opacity(1);
	}
}

@media (max-width: 1500px)
{
	body
	{
		.container-footer-bar
		{
			.moduletable.text-centered
			{
				max-width: 33%!important;
			}
		}
	}
}

@media (max-width: 1280px)
{
	.moduletable.presentation_nicolas
	{
		background-position: 80% center;
	}
}

@media (max-width: 1100px)
{
	.navbar-brand
	{
		.author-logo
		{
			float: none;
			display: flex;
			justify-content: flex-end;
			align-items: center;
			height: 36px;

			img
			{
				width: 40vw;
				margin: 8px 8px 0 0!important;
				height: initial!important;
			}
		}
	}

	.moduletable.reassurance
	{
		margin: 0 -16px;

		.reassurance_list
		{
			flex-wrap: wrap;
			row-gap: 2.25rem!important;
		}

		.reassurance_item
		{
			flex: 1 1 40%!important;
		}

		.reassurance_item + .reassurance_item::before
		{
			display: none!important;
		}
	}

	.moduletable.presentation_nicolas
	{
		margin: 0 -16px;
	}

	.moduletable.reviews
	{
		margin: 0 -16px;
	}
}

@media (max-width: 991px)
{
	body
	{
		header
		{
			.container-nav
			{
				.navbar-brand
				{
					.navbar-expand-lg
					{
						margin-left: auto!important;

						.navbar-toggler
						{
							position: absolute;
							top: 12px;
							right: 12px;
							border-color: white!important;
							color: white!important;

							&:after
							{
								content: "Menu";
								margin-left: 8px;
								font-family: 'Fcaslon Twelve';
								font-weight: 600;
							}
						}

						.mod-menu
						{
							max-width: fit-content;
							margin: 64px 0 16px auto!important;
							flex: 1 0 0;

							ul.mm-collapse
							{
								li:not(.level-1)
								{
									padding: 16px!important;
								}
							}
						}
					}

					.author-logo
					{
						display: none;
					}
				}
			}
		}

		& > .site-grid
		{
			.banner
			{
				.mod-custom
				{
					.banner_box
					{
						width: 100%;
						height: 50vh;
						max-height: 600px;
						overflow: hidden;

						img
						{
							object-position: 50% center;
						}
					}
				}

				&.position_top .banner_box img
				{
					object-position: 0 0;
				}
			}
		}

		.container-component
		{
			main
			{
				margin: 0!important;

				.com-content-article__body
				{
					margin: 16px!important;
				}

				.mod-articles-items.mod-list
				{
					column-count: 1!important;
				}

				.moduletable.presentation_nicolas
				{
					background-position: 70% center;

					.box_text
					{
						background: linear-gradient(to right, #fff, #fff0 80%);

						& > .text
						{
							width: 60%;
						}
					}
				}
			}
		}

		footer
		{
			align-items: center;

			.container-footer-bar
			{
				align-items: center!important;

				.moduletable.text-centered
				{
					max-width: 90%!important;
					min-height: initial!important;
				}
			}
		}
	}

	body.view-article:not(.home-page) .banner
	{
		.banner_box
		{
			height: 280px;
		}
	}
}

@media (max-width: 700px)
{
	body
	{
		.container-component
		{
			main
			{
				.moduletable.presentation_nicolas
				{
					background-color: white;
					background-position: 80% bottom;
					background-repeat: no-repeat;
					background-size: contain;

					.box_text
					{
						background: none;

						& > .text
						{
							padding-bottom: 50%;
							width: 100%;
						}
					}
				}
			}
		}
	}
}

@media (max-width: 600px)
{
	body
	{
		& > .site-grid
		{
			.slideshowck
			{
				.cameraSlide img
				{
					width: inherit!important;
					margin-left: inherit!important;
					margin-top: inherit!important;
				}

				.camera_caption
				{
					& > div
					{
						.camera_caption_title
						{
							font-size: 24px;
						}

						.camera_caption_desc
						{
							font-size: 12px!important;
						}
					}
				}

				&.slider_desktop
				{
					display: none!important;
				}

				&.slider_mobile
				{
					display: block!important;
				}
			}

			.banner
			{
				.mod-custom
				{
					.banner_box
					{
						width: 100%;
						height: 50vh;
						max-height: 600px;
						overflow: hidden;

						img
						{
							object-position: 50% center;
						}
					}
				}

				&.position_top .banner_box img
				{
					object-position: 0 center;
				}

				&.position_middle_top .banner_box img
				{
					object-position: 20% center;
				}

				.banner_blur
				{
					border-radius: 0!important;
				}

				.banner_blur_title
				{
					width: 100%;
					margin-left: 0;

					h1
					{
						border-radius: 0!important;
					}
				}
			}
		}

		&.home-page
		{
			.btn.liste_visites
			{
				display: block;
				float: none!important;
				width: fit-content;
				margin: 0 auto 50px auto!important;
			}
		}

		.moduletable.reassurance
		{
			.reassurance_item
			{
				flex: 1 1 100%!important;
				padding-bottom: 1.5rem!important;
				border-bottom: 1px solid var(--line)!important;
			}

			.reassurance_item:last-child
			{
				padding-bottom: 0!important;
				border-bottom: 0!important;
			}
		}

		footer
		{
			& > .grid-child
			{
				&.footer-content
				{
					padding: 32px!important;

					.module_copyright
					{
						text-align: center;
					}
				}
			}
		}
	}
}

@media (max-width: 500px)
{
	body
	{
		header
		{
			& > .grid-child:first-child
			{
				.navbar-brand
				{
					.brand-logo:after
					{
						content: "";
						display: block;
						width: 178px;
						height: 84px;
						background-image: image-set(url("/images/theme/logo_hd2m.webp"));
						background-size: 100%;
						filter: drop-shadow(0 1px 4px #fff4);
					}

					img
					{
						display: none;
					}
				}
			}
		}
	}
}

@media (max-width: 360px)
{
	body
	{
		.navbar-brand
		{
			.navbar-expand-lg
			{
				.navbar-toggler
				{
					&:after
					{
						content: "";
						margin: 0;
					}
				}
			}
		}

		& > .site-grid
		{
			.container-component
			{
				main
				{
					.dernieres_visites
					{
						.mod-articles-items.mod-list
						{
							grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
						}
					}
				}
			}
		}
	}
}
