/* reset */
	* { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
	*::-moz-selection { background-color: #24303c; color: white;}
	*::selection { background-color: #24303c; color: white;}
	html { font-size: 62.5%; /* 1rem = 10px */}
	html, body { margin: 0 !important; /*padding: 0 !important; */border: none !important; /*width: 100vw;
  max-width: 100vw; overflow-x: hidden;*/}
	body { font-family: 'Raleway', serif; font-size: 1.5rem; color: #24303c; background-color: #fff; }
	body > img{width: 100%;}
	img {max-width: 100%;}
	ol, ul { list-style: none; padding-left: 0;}
	b, strong {font-weight: 600;}
	a{color: initial; text-decoration: none; transition: all .3s ease-in-out;}
/* Fin reset */

.raleway {
  font-family: "Raleway", serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.barrio-regular {
  font-family: "Barrio", serif;
  font-weight: 400;
  font-style: normal;
}

.barriecito-regular {
  font-family: "Barriecito", system-ui;
  font-weight: 400;
  font-style: normal;
}

/* reset flexicontent */
.flexi.infoblock{border: none; padding: 0; margin: 0;}
div.fc-field-box{min-width: unset; max-width: unset; margin: 0; padding: 0;}
.fcclear{display: none !important;}



/* fin reset flexi */


h1, h2, h3{font-family: "barrio", serif; color: #000000;}
.btn-lag{position: relative; color: #fff; font-weight: 800; padding: 1rem 2rem; background: #000000; border-radius: 3px; z-index: 5; display: flex; width: fit-content;}
.btn-lag span.brush:before{content: ' '; position: absolute; left: 10%; bottom: 0; z-index: -1; background: url('../img/before-h2.svg') no-repeat 20% 80%; background-size:100%; height: 100%; width: 90%; z-index: -1; transition: all .3s eaes-in-out;}
.btn-lag span:not(.brush):before{content: ' '; position: absolute; right: 0; bottom: 0; z-index: -1; background: black; height: 100%; width: 100%; transition: all .3s ease-in-out;}
.btn-lag:hover span:not(.brush):before{width: 0;}
.fc_tags{padding: .35em; color: white; background: red; border-radius: 3px; margin-right: .5em; font-size: .85em;}
.fc_tags:before{content: "\23"; font-family: "Font awesome 6 pro";}
.site-grid a:not(.btn-lag):hover{color: red;}

h1, .accueil h2{font-size: 4.3rem; position: relative; padding-bottom: .75em; max-width: fit-content;  margin: 30px 0;}
h1:before, .accueil h2:before{content: url('../img/before-h2.svg'); position: absolute; left: -1.5rem; bottom: 0;z-index: -1;}
/*h1:before, .accueil h2:before{background-image: url('../img/before-h2.svg');
  position: absolute;
  left: -1.5rem;
  z-index: -1;
  content: ' ';
  height: 100%;
  width: 100%;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center left;}
.type-alis-page h2{position: relative; margin-bottom: 1.5em;}*/
.type-alis-page h2:before{content: ""; position: absolute; left: -1rem; bottom: -1.75rem;z-index: -1;background-image: url('../img/before-h2.svg');width: 100%;height: 1.5em;background-size: contain;background-repeat: no-repeat;filter: opacity(.75);}

.description{display: flex;}
blockquote{position: relative; font-size: 3em; font-weight: 900; color: white; line-height: 1; text-shadow: 2px 2px 5px rgba(0,0,0,.5);}
blockquote p{padding-left: .5em;}
blockquote:before{content: '\f10d'; font-family: "font awesome 6 pro"; font-size: 6em; line-height: 0.25; position: absolute; top: 0; left: 0; color: #F1EDE1; z-index: -1; text-shadow: none;}


/* HEADER */
#mobileNav{display: none;}
.header{height: 100vh; position: fixed; background: #000000; color: white; z-index: 99;}

.navbar-brand{padding: 30px;}

.menu-principal ul{display: flex; flex-direction: column;padding: 1em;}
.menu-principal ul a,
.menu-rs a{color: white;}
.menu-rs{padding-left: 30px;}
.menu-rs p{margin-bottom: 0;}
.menu-rs a{margin-right: 10px;}

.nav-item{position: relative; color: #fff; /*! font-weight: 800; */ padding: 5px 15px; background: #000000; border-radius: 3px;z-index: 5; position: relative;font-size: 1.2em;}
.nav-item span.brush:before{content: ' '; position: absolute; left: 10px; bottom: 0; z-index: -1; background: url('../img/white-brush.svg') no-repeat left 85%; background-size:50%; height: 100%; width: 90%; z-index: -1; opacity: .3;}
.nav-item span:not(.brush):before{content: ' '; position: absolute; right: 0; bottom: 0; z-index: -1; background: black; height: 100%; width: 100%; transition: all .5s ease-in-out;}
.nav-item:hover span:not(.brush):before{width: 0;}
.nav-item:hover{font-weight: 800;}

.site-grid-breadcrumbs{background: #ffffff; position: sticky; top: 0px; z-index: 9;}
.ariane{margin-top: 20px;}

.site-grid-footer{width: 100%;}
#copyright{text-align: center; padding: 15px 0;}

/* -------------- HOME -------------- */
body.accueil{background: url('../img/home-bg.png') no-repeat right 70%;}
/*body.accueil #flexicontent,*/
.container-bottom-a,
.container-bottom-b{margin: 100px auto;}
body.accueil .btn-lag{margin-top: 2em;}

body.accueil h1{display: none;}
body.accueil p{font-size: 1.2em;}
body.accueil p > a{font-size: initial;}


	/* Component : zone 1 */
body.accueil .description .desc-content.field_text{width: 40%; margin-right: 100px;}
.description .desc-content.field_flipflap{width: 55%;}

.moduletable.flipflap{/*margin-left: 100px;*/}
.field_flipflap{position: relative;}
 /* The flip card container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
.flip-card {background-color: transparent; width: 100% /*500px*/; height: 500px; /*max-height: 500px;*/ border: 1px solid #f1f1f1; perspective: 1000px; /* Remove this if you don't want the 3D effect */}
/* This container is needed to position the front and back side */
.flip-card-inner { position: relative; width: 100%; height: 140%; text-align: center; transition: transform 0.8s; transform-style: preserve-3d;}
/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner { transform: rotateY(180deg);}
/* Position the front and back side */
.flip-card-front, .flip-card-back { position: absolute; width: 100%; height: 100%; -webkit-backface-visibility: hidden; /* Safari */ backface-visibility: hidden;}
.flip-card-front img, .flip-card-back img{ max-height: 100%; width: 100%; object-fit: cover;}
/* Style the front side (fallback if image is missing) */
.flip-card-front { background-color: #bbb; color: black;}
.flip-card-front:before{content: ""; width: 90%; height: 90%; border: 1px solid black; position: absolute; left: 5%; top: 5%; box-shadow: 0 0 5px rgba(0,0,0,.5); background: none;}
/* Style the back side */
.flip-card-back { background-color: dodgerblue; color: white; transform: rotateY(180deg);} 


	/* Modules */

		/* Rencontres d'atelier */
.container-atelier *{color: #ffffff;}
.container-atelier h2{z-index: 0;}
/*.container-atelier{position: relative; background: url('../img/atelier-bg-01.jpg') no-repeat; background-size: cover; z-index: 0; margin-top: 80px;}*/
.container-atelier{position: relative; background: url('../img/Vulcan-chromo.jpg') no-repeat; background-size: cover; z-index: 0; margin-top: 80px;}
.container-atelier:before{position: absolute ; top: 0; left: 0; content:''; width: 100%; height: 130px; background: url('../img/ScratchUp.svg') no-repeat top;}
.container-atelier:after{position: absolute; bottom: 0; left: 0; content: ''; width: 100%; height: 120px; background: url('../img/ScratchDown.svg') no-repeat bottom;}
.container-atelier .moduletable.rencontres{padding: 100px 0;}
.container-atelier .moduletable.rencontres .custom  .rencontres-content > p{font-weight: 700; text-shadow: 0 0 2px rgb(0, 0, 1);}
.container-atelier .moduletable.rencontres .custom p a{display: inline-block; margin-top: 0;}
.container-atelier .moduletable.rencontres .custom blockquote::before {color: #ffffff; opacity: .3;}
.container-atelier .moduletable.rencontres .custom .rencontres-img img{height: auto; padding: 5px; background: #000000;}



		/* Domaine de créations */
.home-masonry .digi_showcase{background: black; /*padding: 5px !important;*/}
/*.home-masonry .digi_showcase.masonry,
.home-masonry #digi_showcase_masonry{height: 100%;}*/
.home-masonry #digi_showcase_masonry .masonry-block:nth-of-type(4){float: right;}
.home-masonry #digi_showcase_masonry .masonry-block .showcase-item .itemLink a{width: 100%; height: 100%;}
.home-creations{padding-left: 50px;}


		/* Insta */
.home-insta{/*max-width: 940px; */margin: auto;}
.home-insta h2{margin: 30px /*auto*/;}
.home-insta .instagram_gallery .instagram_items{/*display: flex; flex-wrap: wrap;*/ padding: 5px; background: #000000;}
.home-insta .instagram_gallery .instagram_items .instagram_item{/*min-width: 300px; max-width: 300px;*/ background: #000000;}


	/* CATEGORIE */
		/* Créations */

		/* ISOTOPE */
		.button {display: inline-block; padding: 0.5em 1.0em; background: #d8b34e; border: none; border-radius: 2px; color: #ffffff; font-size: 16px; font-weight: 800; cursor: pointer;}
		.button:hover {background-color: black;}
		.button:active,
		.button.is-checked {background-color: black;}
		.button:active {}

		.button-group {margin-bottom: 20px;}
		.button-group:after {content: ''; display: block; clear: both;}
		.button-group .button {float: left; border-radius: 0; margin-left: 0; margin-right: 1px;}

		.button-group .button:first-child { border-radius: 3px 0 0 3px; }
		.button-group .button:last-child { border-radius: 0 3px 3px 0; }

		.grid {border: 1px solid #333;}
		/* clear fix */.grid:after {content: ''; display: block; clear: both;}
		/* fin isotope*/

		/* Filtre disponibilité */
#flexicontent.creations fieldset.fc_filter_set legend{display: flex; align-items: center; margin-right: .8em;}
#flexicontent.creations fieldset.fc_filter_set .fc_checkradio_option.fc_checkradio_special{display: none;}
#flexicontent.creations fieldset.fc_search_set legend .fc_legend_text.hasTooltip,
#flexicontent.creations fieldset.fc_filter_set legend .fc_legend_text.hasTooltip {
  background: none;
  border: none;
  color: black;
  display: flex;
  margin: 0;
  padding: 0;
  min-height: unset !important;
  top: unset;
  line-height: 1;
}
#flexicontent.creations fieldset.fc_search_set legend .fc_legend_text span,
#flexicontent.creations fieldset.fc_filter_set legend .fc_legend_text span {font-weight: 400; font-size: 1em;}
#flexicontent.creations fieldset.fc_filter_set .filters{align-items: center;}
#flexicontent.creations .fc_filter_html *{font-size: 15px !important;}

#flexicontent.creations .fc_filter_box .select2-container a.select2-choice{border: none;}

#flexicontent.creations .select2-container .select2-choice,
#flexicontent.creations div#tags #input-tags,
#flexicontent.creations .fc-field-props-box .fc_preview_msg,
#flexicontent.creations input.imgalt,
#flexicontent.creations textarea.imgdesc, #flexicontent form .fcfield_textareaval,
#flexicontent.creations form .fcfield_selectval, #flexicontent form .fcfield_selectmulval,
#flexicontent.creations form .fcfield_textval, #flexicontent .fc_filedata_txt,
#flexicontent.creations .select2-container-multi .select2-choices,
#flexicontent.creations .btn-group .btn,
#flexicontent.creations .fc-xpended > div,
#flexicontent.creations .fc-xpended-row > div,
#flexicontent.creations .fc-xpended .input-group-text,
#flexicontent.creations .fc-xpended-row .input-group-text,
#flexicontent.creations .fc-xpended .add-on,
#flexicontent.creations .fc-xpended-row .add-on{border: none !important;}

#flexicontent.creations .fc_odd .filter-label{display: none;}
#flexicontent.creations .fc_even .fc_filter_label{}
#flexicontent.creations .fc_filter{}

#flexicontent.creations .fc_filter_buttons_box button{color: red; font-size: .8em; text-decoration: underline;}
#flexicontent.creations .fc_filter_buttons_box i.icon-remove:before{content: "\f0e2"; font-family: "Font Awesome 6 pro"; margin-right: 5px;}

	/* catdescription */
.catdescription p a{font-weight: 700;}



/* CATEGORIE ITEM */

	/* navigation item */
.fcpagenav.btn-group {border: none;}
.fcpagenav.btn-group .btn{border: none !important;}
.flexi.fc-pagenav *{vertical-align: baseline;}
.flexi.fc-pagenav i{font-size: .85em;}

	/* partage RS */
#rssocial-141.rssocial-container.share{margin-right: 0 !important;}
#rssocial-141.rssocial-container.share.rssocial-floating-right {top: 20vh;}
#rssocial-141 #rssocial-slide-button{display: none;}

#rssocial-141 .rssocial-slide-button .rssocial-icon-more:before{content: '\f1e0'; font-family: 'Font Awesome 6 pro';}


/* Création */
#flexicontent.creation .article-content{position: relative;}
	/* image : colonne fixe */
#flexicontent.creation .content-desc{padding-left: 50px;}
#flexicontent.creation .content-desc .field_categories:before{content: '\f02c'; font-family: "Font Awesome 6 pro"; color: red; margin-right: 5px;}
#flexicontent.creation .content-desc .field_categories .fc_categories.fc_ismain_cat {font-weight: normal;}
#flexicontent.creation .fc_field_image {max-height: 90vh; object-fit: /*cover*/ contain;}
#flexicontent.creation .image{position: sticky; top: 0; left: 0; height: fit-content;}
	/* contenu texte : colonne scroll */
.type-alias-article .description{flex-direction: column;}
#flexicontent.creation .categories,
#flexicontent.creation .details{margin-bottom: 15px;}
#flexicontent.creation .details{display: flex; justify-content: space-between;}
#flexicontent.creation .details .details-field{width: 30%; border-right: 1px solid #cab15f;}
#flexicontent.creation .details .details-field:last-of-type{border: none;}
#flexicontent.creation .details .details-field .details-title{font-weight: 800;}

#flexicontent.creation .description > .desc-content{margin-bottom: 20px;}

#flexicontent.creation .description .field_disponibilite{font-weight: 900; margin-bottom: 0;}

#flexicontent.creation .description .field_galerie-photos > div{display: flex; flex-wrap: wrap;}
#flexicontent.creation .description .field_galerie-photos > div > a{min-width: 23%; max-width: 23%; max-height: 150px; margin: 1%;}
#flexicontent.creation .description .field_galerie-photos > div > a > img{max-height: 100%; min-height: 100%;}




/* Article de blog - Actu */
#flexicontent.article .topblock,
#flexicontent.actu .topblock{overflow: visible;}
#flexicontent.article .field_photo-principale,
#flexicontent.actu .field_photo-principale{position: sticky; height: fit-content;}




/* Page de contenu simple */
body.about{background: url('../img/home-bg.png') no-repeat right 50%; background-size: 10%;}
.type-alias-page #flexicontent .description{align-items: center;}
.type-alias-page #flexicontent .description .field_text{width: 40%; margin-right: 10%;}
.type-alias-page #flexicontent .description .field_photo-principale{width: 50%;}

.type-alias-page .value.field_paragraphe-de-contenu .row{margin-bottom: 80px;}
/*.type-alias-page .value.field_paragraphe-de-contenu .field_image-de-paragraphe .value{width: 90%;}
.type-alias-page .value.field_paragraphe-de-contenu .field_image-de-paragraphe .value img{width: 100%}*/
.type-alias-page .value.field_paragraphe-de-contenu > .container > .row{align-items: center;}
.type-alias-page .value.field_paragraphe-de-contenu > .container > .row:nth-of-type(2n) .field_image-de-paragraphe{order: 2; display: flex; justify-content: flex-end;}

	/* à propos de moi */
.moduletable.cv{padding-left: 50px;}
.cv .jmz-timeline-oss-wrapper h3{border-left: none !important; border-right: none !important; background: none; margin-top: 0;}
.cv .jmz-timeline-oss-item .jmz-timeline-oss-circle {width: 100px; height: 100px;}
#jmz-timeline-horizontal-wapper {position: relative; background: none;}
#jmz-timeline-horizontal-wapper:before {content: ''; width: 100%; height: 100%; border-top: 1px solid red; position: absolute; top: 45px;}
#jmz-timeline-dates li{}
#jmz-timeline-dates li a{font-family: "barrio"; width: fit-content; display: inline-block; height: auto;}
#jmz-timeline-dates li a.selected{position: relative;}
#jmz-timeline-dates li a.selected:before{content: url('../img/before-h2.svg'); display: flex; z-index: -1; position: absolute;bottom: .5em;transform: scale(.2); transform-origin: bottom left;left: -.5em;}
#jmz-timeline-issues li{}




	/* page anatôle module de catégorie */
.anatole-items .mod_flexicontent_standard	{display: flex !important; flex-wrap: wrap;}
.anatole-items.anatole.mod_flexicontent_wrapper .mod_flexicontent .mod_flexicontent_standard_wrapper{padding: 0 10px 0 0 !important;}
.anatole-items .mod_flexicontent_standard_wrapper .image_standard{overflow: hidden;}
.anatole-items .mod_flexicontent_standard_wrapper .image_standard img{transition: all .3s ease-in-out;}
.anatole-items .mod_flexicontent_standard_wrapper:hover .image_standard img{transform: scale(1.1);}
.anatole-items .mod_flexicontent_standard_wrapper:hover .image_standard{box-shadow: 0 0 5px rgba(0,0,0,.5)}



 /* Contact */
 .convertforms p{line-height: 1.5;}

/* Pagination */
.counter.pull-right{font-weight: bold; min-width: max-content;}
.pagination__wrapper{width: 100%}
ul.pagination{justify-content: center;}
.page-link{border: none; color: black; font-size: 1em;}
.active > .page-link, .page-link.active{background: black;}
.disabled > .page-link, .page-link.disabled {color: black; background-color: none; border-color: none; opacity: .35;}
.page-link:hover{background: black;}
.active > .page-link:hover, .page-link.active:hover{color: #ffffff !important;}



/* ------------------------ RESPONSIVE ------------------------ */
@media (max-width:1599px){
	h1::before, .accueil h2::before {	transform: scale(.85); transform-origin: top left;}

}

@media (max-width:1399px){
	h1::before, .accueil h2::before {	transform: scale(.75);}

	#flexicontent .grid .grid-item{width: 33.33% !important;}

}


@media (max-width:1199px){

	h1::before, .accueil h2::before {transform: scale(.6);}
	h1, .accueil h2 {margin: 10px 0;}

	body.accueil .description .desc-content.field_text {width: 50%; margin-right: 50px;}
	.type-alias-page #flexicontent .description{flex-direction: column;}
	.type-alias-page #flexicontent .description .field_text{margin-right: 0;}
	.type-alias-page #flexicontent .description .field_text,
	.type-alias-page #flexicontent .description .field_photo-principale{width: 100%;}

	.type-alias-page #flexicontent .field_paragraphe-de-contenu .paragraphe img{float: right !important; margin-right: 0 !important; margin-left: 15px;}



	#flexicontent.creation .image{position: unset;}

}


@media (max-width:991px){
	blockquote {font-size: 2.5em;}

	.container-bottom-a, .container-bottom-b {margin: 50px auto;}
	body.accueil .description{flex-direction: column;}
	body.accueil .description .desc-content.field_text {width: 100%; margin-right: 0;}
	.description .desc-content.field_flipflap {width: 100%;}
	.flip-card-inner,
	.flip-card-front, .flip-card-back {height: auto;}
	.home-creations {padding-left: 0;}
	.home-masonry{order: 2;}

  .type-alias-page #flexicontent .field_paragraphe-de-contenu .paragraphe img {float: none !important; margin-left: 0 !important; width: 100%; height: auto;  }
  #flexicontent .grid .grid-item{width: 50% !important;}

}


@media (max-width:767px){
	.header{height: auto;}
	.container{max-width: unset;}
	.navbar-brand{padding: 15px;}
	.brand-logo img{max-height: 50px; width: auto;}
	#mobileNav{display: initial;}
	.menu-principal.mobile,
	.menu-rs.mobile{max-width: 250px;}
	.menu-rs:not(.mobile),
	.menu-principal:not(.mobile){display: none;}
	#burger {cursor: pointer; display: block; font-size: 2em; text-align: right; position: absolute; top: 20px; right: 30px; z-index: 99;}
	#burger:before {content: '\f0c9'; font-family: "Font Awesome 6 Pro";}
	#burger.open:before {content: '\f00d';}
	#mobileNav {position: absolute; left: -767px; width: 100vw; height: 100vh; background: #000000; z-index: -1; transition: all .3s ease-in-out;}
	#mobileNav.open{left: 0;}

	h1::before, .accueil h2::before {transform: scale(.75);}





}




@media (max-width:575px){

	#flexicontent .grid .grid-item{width: 100% !important;}
	blockquote {font-size: 2em;}

}

@media (max-width:520px){
	h1::before, .accueil h2::before {	transform: scale(.6);}
}

@media (max-width:479px){
	h1::before, .accueil h2::before {	transform: scale(.5);}

}


@media (max-width:359px){


}