body{min-width:315px;margin:0 auto;height:100%;font:normal 400 16px/1.5em Barlow,sans-serif;color:#2d3134;background:#eee;overflow-x:hidden;font-smooth:always;-webkit-font-smoothing:antialiased}.max-width-1920{max-width:120rem}.max-width-1560{max-width:97.5rem}.max-width-1440{max-width:90rem}.max-width-1200{max-width:75rem}.max-width-1024{max-width:64rem}.max-width-960{max-width:60rem}.max-width-840{max-width:52.5rem}.max-width-720{max-width:45rem}.max-width-1920,.max-width-1560,.max-width-1440,.max-width-1200,.max-width-1024,.max-width-960,.max-width-840,.max-width-720{margin-left:auto;margin-right:auto}


/* FONTS
/* -------------------------- */
.font-1 {font-family:"Barlow", sans-serif;}
.font-2 {font-family:"Barlow Condensed", sans-serif;}

/* FONTS-SIZE
/* -------------------------- */
.size-11 {font-size:.688rem;}
.size-12 {font-size:.750rem;}
.size-14 {font-size:.875rem;}
.size-16 {font-size:1rem;}
.size-18 {font-size:1.125rem;}
.size-20 {font-size:1.250rem;}
.size-22 {font-size:1.375rem;}
.size-24 {font-size:1.5rem;}
.size-26 {font-size:1.625rem;}
.size-28 {font-size:1.750rem;}
.size-30 {font-size:1.875rem;}
.size-35 {font-size:2.1875rem;}
.size-40 {font-size:2.5rem;}
.size-45 {font-size:2.8125rem;}
.size-50 {font-size:3.125rem;}
.size-55 {font-size:3.4375rem;}
.size-60 {font-size:3.75rem;}
.size-75 {font-size:4.6875rem;}


/* COLORS
/* -------------------------- */
:root{
	--color-1:#f25757; /*Main color > Rouge*/
	--color-1-light:#ff8484; /*Main color > Rouge clair*/
	--color-2:#2d3134; /*Second color > Gris Foncé*/
	--color-2-dark:#1d2022; /*Second color > Gris Foncé*/
	--color-3:#74b9e0; /*Bleu*/
	--color-4:#fee590; /*Jaune*/
	}

    @media (-webkit-device-pixel-ratio: 1.25) {
      :root{
        zoom: 0.8;
      }
    }
    @media (-webkit-device-pixel-ratio: 1.50) {
      :root{
        zoom: 0.666667;
      }
    }

.color-1 {color:var(--color-1)}
.color-1-light {color:var(--color-1-light)}
.color-2 {color:var(--color-2)}
.color-2-dark {color:var(--color-2-dark)}
.color-white {color:white;}
.color-black {color:black;}
.color-bbb {color:#bbb;}
.color-888 {color:#888;}
.color-666 {color:#666;}

.bg-color-1 {background-color:var(--color-1)}
.bg-color-1-light {background-color:var(--color-1-light)}
.bg-color-2 {background-color:var(--color-2)}
.bg-color-2-dark {background-color:var(--color-2-dark)}
.bg-color-3 {background-color:var(--color-3)}
.bg-color-4 {background-color:var(--color-4)}
.bg-white { background-color: white; }
.bg-black {background-color:black;}
.bg-eee {background-color:#e8edf0;}
.bg-666 {background-color:#666;}

.border-color-1 {border-color:var(--color-1);}
.border-color-1-light {border-color:var(--color-1-light);}
.border-color-2 {border-color:var(--color-2);}
.border-color-ccc {border-color:#ccc;}
.border-color-444 {border-color:#444;}
.border-color-white {border-color:#444;}
.border-color-white-opa2 {border-color:rgba(255,255,255,0.2);}
.border-color-black-opa2 {border-color:rgba(0,0,0,.2);}
.border-width-2 {border-width:2px;}

.vertical-center {left: 0;right: 0;top: 50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);}
.text-shadow {text-shadow: 1px 0 1px rgba(0,0,0,0.10), 1px 0 2px rgba(0,0,0,0.20);}
.box-shadow {box-shadow: 0 0px 25px rgba(0,0,0,0.08), 0 5px 10px rgba(0,0,0,0.15);}
.produit {mix-blend-mode:multiply;}


/* ANIMATIONS
/* -------------------------- */
.transition {
	-webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
	-ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
	}


/* BACK TO TOP
/* -------------------------- */
.cd-top {
	z-index:100;
	height: 60px;
	width: 60px;
	text-indent: 100%;
	background: var(--color-2) url("/IMG/arrow-up@2x.png") no-repeat center center;
	background-size:16px 9px;
	visibility: hidden;
	opacity: 0;
	box-shadow: 5px 5px 0 white;
	}

.cd-top.cd-is-visible,
.cd-top.cd-fade-out,
.cd-top:hover {
	-webkit-transition: opacity .3s 0s, visibility 0s 0s;
	-moz-transition: opacity .3s 0s, visibility 0s 0s;
	transition: opacity .3s 0s, visibility 0s 0s;
	}
	
.cd-top.cd-is-visible {
	visibility: visible;
	opacity: 1;
	}
	
.cd-top.cd-fade-out {opacity: .5;}
	
.cd-top:hover {
	background-color:var(--color-2-dark);
	opacity: 1;
	}

#icone_travaux {display: none;}


/* MENU
/* -------------------------------------------------------------------- */
header::after {
	z-index: -1;
	position: absolute;
	content: "";
	bottom: 0;
	width: calc(100% - 1.875rem);
	border-bottom: 2px solid var(--color-2);
	}

.picture {
	width: 70px;
	height: 70px;
	border-radius: 50%;
	}

a.logo:hover .picture {transform: scale(1.15);}
a.logo:hover .picture img {transform: scale(.875);}

header .mainNav a {
	line-height: 140px;
	border-bottom: 2px solid var(--color-2);
	}

header .mainNav a:hover {
	border-color: var(--color-1-light);
	color: white;
	}

.expertises header .mainNav a:nth-child(1),
.portfolio header .mainNav a:nth-child(2),
.equipe header .mainNav a:nth-child(3),
.contact header .mainNav a:nth-child(4) {color: white;}

footer .mainNav a:hover {color: var(--color-1-light);}

footer nav,
footer .google-oxatis {margin-top: auto;}

.arrow_anim-left,
.arrow_anim-right {
    width: 35px;
    height: 35px;
    display: inline-block;
	}

:is(a, button):hover .arrow_anim-left {animation: arrow-animation-left .3s}
:is(a, button):hover .arrow_anim-right {animation: arrow-animation-right .3s}

@keyframes arrow-animation-right {
	  0%, 100% {
		opacity: 1;
		transform: translateX(0%);
	  }

	  50% {
		opacity: 0;
		transform: translateX(100%);
	  }

	  51% {
		opacity: 0;
		transform: translateX(-100%);
	  }
	}

@keyframes arrow-animation-left {
	  0%, 100% {
		opacity: 1;
		transform: translateX(0%);
	  }

	  50% {
		opacity: 0;
		transform: translateX(-100%);
	  }

	  51% {
		opacity: 0;
		transform: translateX(100%);
	  }
	}

.container_recent {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
    grid-gap: 60px;
	}

.title,
.space_h {grid-column: span 12;}
.space_v {grid-column: span 1;}

.item_last {grid-column: span 2;}
.item_old {grid-column: span 4;}
.large {grid-column: span 9;}

.detail {margin-top: auto;}
.detail ul {list-style: none;}

.container_recent .btn_see {grid-column: 5 / span 4;}

.container_old {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	}

.container_old h2 {
	opacity: 0;
	margin-left: .9375rem;
	}
.container_old a:hover h2 {
	opacity: 1;
	margin-left: 0;
	}

.container_old a:hover img {
	opacity: .65;
	transform: scale(1.05);
	}

.container_old .item_old {grid-column: span 4;}
.container_old .item_old:nth-child(4),
.container_old .item_old:nth-child(9),
.container_old .item_old:nth-child(15) {
	grid-column: span 8;
	grid-row: span 3;
	}

.container_old .item_old:nth-child(4) h2,
.container_old .item_old:nth-child(9) h2,
.container_old .item_old:nth-child(15) h2 {
	font-size: 1.875rem;
	padding-left: 1.875rem;
	padding-bottom: 1.875rem;
	}

.experts a:hover {color: var(--color-1-light);}

.grid_col-12 {
	display: grid;
	grid-template-columns: repeat(12, 1fr);/*repeat(auto-fit, minmax(min(33.33333%), 1fr))*/
	}

.grid_col-12 .img_intro {grid-column: 3 / span 4;}
.grid_col-12 .intro {
	align-self: center;
	grid-column: 7 / span 4;
	}

.grid_col-12 .item {
	grid-column: 2 / span 10;
	padding: 175px 50px;
	}

.aos {
	opacity: 0;
	transition: opacity .25s .25s ease-out;
	}

.aos.is-visible {opacity: 1;}

.grid_col-12 .item img,
.img_intro img {
	opacity: 0;
	transform: translate(0, 3.5%);
	transition: transform 4s .25s cubic-bezier(0,1,.3,1),
	            filter 10s 2s ease-out;
	will-change: transform;
	}

.grid_col-12 .item.is-visible img,
.img_intro.is-visible img {
	opacity: 1;
	transform: translate(0, 0);
	}

.grid_col-12 .intro h1 sup {
	top: -1.75rem;
    font-size: 50%;
    font-weight: 400;
	}

.scrollContainer,
.scrollSection,
.scrollBg {
	position: sticky; 
	position: -webkit-sticky; 
	z-index: 2; 
	}

.scrollContainer {
	grid-column: 5 / span 4;
	padding: 35px 0 20px;
	top: 0;
	background-color: white;
	}

.scrollContainer::after {
	position: absolute;
	content: "";
	left: 0;
	right: 0;
	top: 9px;
	width: 19px;
	height: 20px;
	margin: 0 auto;
	background: url("/IMG/chevrons-down.svg");
	background-size: 18px auto;
	background-repeat: no-repeat;
	}

.scrollIndicator_bg {
	background: turquoise;
	height:4px;
	}
	
.scrollSection {
	background-color:black;
	grid-column: 5 / span 4;
	mix-blend-mode:color-burn;
	top: 32px;
	height:8px;
	}

.scroll_2 .scrollSection {width:50%;}

.scroll_3 .scrollSection {width:33.33333%;}
.scroll_3 .scrollSection:nth-child(5) {width: 66.66667%;}

.scroll_4 .scrollSection {width:25%;}
.scroll_4 .scrollSection:nth-child(5) {width: 50%;}
.scroll_4 .scrollSection:nth-child(7) {width:75%;}

.scroll_5 .scrollSection {width:20%;}
.scroll_5 .scrollSection:nth-child(5) {width: 40%;}
.scroll_5 .scrollSection:nth-child(7) {width:60%;}
.scroll_5 .scrollSection:nth-child(9) {width:80%;}

.scroll_6 .scrollSection {width:16.66667%;}
.scroll_6 .scrollSection:nth-child(5) {width: 33.33333%;}
.scroll_6 .scrollSection:nth-child(7) {width:50%;}
.scroll_6 .scrollSection:nth-child(9) {width:66.66667%;}
.scroll_6 .scrollSection:nth-child(11) {width:83.33333%;}

.scroll_2 .scrollSection:nth-child(5),
.scroll_3 .scrollSection:nth-child(7),
.scroll_4 .scrollSection:nth-child(9),
.scroll_5 .scrollSection:nth-child(11),
.scroll_6 .scrollSection:nth-child(13) {width:100%;}

.scrollBg {
	z-index: 1;
	background-color:white;
	grid-column: span 12;
	top: 0;
	height:60px;
	}

.next_prev {
	display: grid;
	grid-auto-flow: column;
	}

.next_prev .item {grid-column: span 1;}

.next_prev a img {opacity: .45;}
.next_prev a:hover img {opacity: 1;}

.next_prev .arrow_anim-left,
.next_prev .arrow_anim-right {
    width: 28px;
    height: 28px;
	}

button {
    border: none;
    cursor: pointer;
	background: none;
	}

button:focus,
input:focus {outline: none;}

input::-webkit-input-placeholder {color: #999; }
input::-moz-placeholder {color: #999; }
input:-ms-input-placeholder {color: #999; }
input::placeholder {color: #999; }


	@media only screen and (max-width: 79.9375rem) {
		.grid_col-12 .item {padding: 50px 75px;}
		.grid_col-12 .img_intro {grid-column: 2 / span 5;}
		.grid_col-12 .intro {grid-column: 7 / span 5;}
		}

	@media only screen and (max-width: 71.9375rem) {
		.footer .mainNav .mx3,
		.footer .google-oxatis {
			margin-left: .9375rem;
			margin-right: .9375rem;
			}
		.footer .google-oxatis .ml4 {margin-left: 1.875rem;}
		.next_prev .item div {
			padding-left: 1.125rem;
			padding-bottom: 1.750rem;
			}
		.next_prev .item + .item div {
			padding-left: 0;
			padding-right: 1.125rem;
			}
		
		}

	@media only screen and (max-width: 63.9375rem) {
		header {
			padding-top: .375rem;
			padding-bottom: .5rem;
			}
		header .mainNav a {
			display: block;
			padding-top: .375rem;
			padding-bottom: .375rem;
			font-size: 1.125rem;
			font-weight: 400;
			line-height: 1em;
			border-bottom: none;
			}
		.logo {width: 165px;}
		.logo .slogan {
			margin-top: .5rem;
			margin-bottom: .625rem;
			margin-left: 0;
			width: 100%;
			}
		.main_works,
		.work_recent {padding: 0;}
		.main_works > div,
		.work_recent > div {padding:3rem 0;}
		.space_h,.space_v {display: none;}
		.container_recent,
		.grid_col-12 {
			grid-template-columns: 1fr;
			grid-gap: 20px;
			}
		.grid_col-12 {
			grid-gap: 0;
			background-color: #666;
			}
		.grid_col-12.start {background-color: var(--color-1);}
		.container_old {
			grid-template-columns: 1fr;
			margin-top: 3.875rem;
			}
		.item_last,
		.item_old,
		.large,
		.title,
		.container_recent .btn_see,
		.container_old .item_old,
		.container_old .item_old:nth-child(4),
		.container_old .item_old:nth-child(9),
        .container_old .item_old:nth-child(15),
		.grid_col-12 .img_intro,
		.grid_col-12 .intro {grid-column: span 1}
		.container_recent .title {margin-bottom:0;}
		.container_recent h2,
		.container_recent h3 {margin-bottom:.375rem;}
		.detail {margin-top: 1.5rem;}
		.experts {
			padding-top: 0;
    		padding-bottom: 0;
			}
		.experts > div {
			padding-top: 2rem;
			padding-bottom: 2rem;
			}
		.experts h2 {margin-bottom: .9375rem;}
		.experts p {
			margin: 0;
			font-size: 1.625rem;
			line-height: 1.3em;
			font-weight: 400;
			}
		.experts a {font-weight: 600;}
		.container_old h2 {
			opacity: 1;
			margin: 0;
			font-size: 1.125rem;
			letter-spacing: normal;
			text-shadow: 0px 0px 3px rgba(0,0,0,.35);
			}
		.container_old .item_old:nth-child(4) h2,
		.container_old .item_old:nth-child(9) h2,
        .container_old .item_old:nth-child(15) h2 {
			font-size: 1.125rem;
			padding-left: .9375rem;
			padding-bottom: .9375rem;
			}
		.grid_col-12 .item {
			grid-column: span 1;
			margin: 0;
			padding: 55px 35px;
			}
		.grid_col-12 .item span {margin-bottom: 1.875rem;}
		.next_prev {padding-top: 0;}
		.next_prev .item span {font-size: 1.375rem;}
		.footer {
			padding-top: 0;
			padding-bottom: 0;
			}
		.footer > div {
			padding-top: 2rem;
			padding-bottom: 2rem;
			}
		.footer .logo {margin-bottom: .9375rem;}
		.footer .picture {margin-bottom: .5rem;}
		.footer .listing {display: block;}
		.footer .listing br {display: none;}
		.google-oxatis {margin: 0 .9375rem;}
		.google-oxatis a {
			display: block;
			margin: 0;
			}
		.google-oxatis a {margin-top: 1.875rem;}
		.google-oxatis a img {width: 45%;}
		.google-oxatis a:last-child img {width: 20%;}
		.footer .google-oxatis .ml4 {margin-left: 0;}


		}

	@media only screen and (max-width: 39.9375rem) {
		.next_prev {grid-auto-flow: row;}
		}


/* ARTICLE
/* -------------------------------------------------------------------- */
.article {
	padding-top: 100px;
	padding-bottom: 100px;
	}

.article .content {
    padding-top: 85px;
    border-top: 5px solid #eee;
	}

.chapo p + p {
	margin-top: .750rem;
    font-size: 1.375rem;
    line-height: 1.5em;
	}

.h1,
.chapo {
	padding-top: 5rem;
	padding-bottom: 5rem;
	}

.h1-portfolio strong,
.h1 strong {
	display: block;
	font-weight: 300;
	color: white;
	}

.btn-contact {
	margin-top: 5.5rem;
	box-shadow: 6px 6px 0 white;
	}

.btn-contact.website {margin-top: 4.5rem}

    @media only screen and (min-width: 64rem) {
        a.btn-contact:hover,
        button:hover {
            box-shadow: 12px 12px 0 var(--color-1-light);
            color: white;
            }
        }

.portfolio ul.spip {list-style: none}

.intro p {margin-bottom: 6rem;}

.article h2 {margin-top: auto;}

.article h3,
.article h4 {font-weight: 600;}

.article h3 {
	position: relative;
	margin-top: 2.8125rem;
	margin-bottom:.9375rem;
	font-size: 1.5rem;
	line-height: 1.5em;
	color: var(--color-1);
	}

.article h3::first-letter {padding-left: 25px}
.article h3::after {
    content: '';
    position: absolute;
    left: 0;
    top: 13px;
    width: 8px;
    height: 8px;
    border-top: solid 2px currentColor;
    border-right: solid 2px currentColor;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
	}

.article h4 {
	margin-top: 1.875rem;
	margin-bottom: .375rem;
	font-size:1.3125rem;
	}

.article h3 + h4 {margin-top: 0;}

.article h3:first-of-type {margin-top: 0;}

.content_txt p,
.content_txt ul {
	font-family:"Barlow", sans-serif;
	font-size:1.375rem;
	line-height: 1.5em;
	font-weight: 300;
	color: #555;
	}

.content_txt p + p,
.content_txt ul + ul,
.content_txt ul + p {margin-top: .9375rem;}

.article .content_txt p + h3 {margin-top: 2.8125rem;}

.content_txt ul.spip {list-style:none;}

.content_txt ul.spip li {
	position:relative;
	padding-left: 18px;
	}

.content_txt ul.spip li::after {
	position:absolute;
	content:"•";
	left: 0;
	top:0;
	font-size: 1em;
	color: #999;
	}

.content_txt strong {
	color: #000;
	font-weight: 400;
	}

.content_txt a {
	text-decoration: none;
	color: #000;
	border-bottom: 2px solid var(--color-1);
	background-image: linear-gradient(#ddd,#ddd);
	background-size: 0 100%;
	background-repeat: no-repeat;
	transition: background-size .4s;
	}

.content_txt a:hover {background-size: 100% 100%;}
.content_txt a:active {
	text-decoration: none;
	color: #000;
	}

.content_txt a:hover,
.content_txt a:focus {outline: none;}

.picto img {
	width: 180px;
	opacity: 0;
	transform: translate(0, 30px);
	transition: transform 4s .25s cubic-bezier(0,1,.3,1),
	            filter 10s 2s ease-out;
	will-change: transform;
	}

.picto.is-visible img {
	opacity: 1;
	transform: translate(0, 0);
	}

.article .texteencadre-spip {
    margin-top: 2.5em;
    background: #eee;
    border: none;
    padding: 30px;
    font-size: 1.375rem;
    font-weight: 300;
    line-height: 1.5em;
	color: var(--color-1);
	}

	@media only screen and (max-width: 79.9375rem) {
        .h1-portfolio,
		.h1 {
			font-size: 3.125rem;
			line-height: 1.35em;
			}
        .mockups {
            padding-top: 1.875rem;
            padding-bottom: 1.875rem
            }
        .mockups picture {
            padding: 1.875rem;
            padding-right: .9375rem
            }
        .mockups picture + picture {
            padding-left: .9375rem;
            padding-right: 1.875rem
            }
		}

	@media only screen and (max-width: 63.9375rem) {
        .portfolio .content {margin-bottom: 1.875rem}
        .h1-portfolio,
        .chapo-portfolio,
		.h1,
		.chapo {
    		padding-top: 1.5rem;
    		padding-bottom: 1.5rem;
			font-size: 2rem;
			line-height: 1.3em;
			}
        .h1-portfolio,
		.h1 {font-weight: 600;}
        .h1-portfolio strong,
		.h1 strong {
			display: inline;
			font-weight: 400;
			}
        .chapo-portfolio,
		.chapo,
		.error .intro span {
			font-size: 1.375rem;
			line-height: 1.45em;
			}
		.error .intro {
    		padding-left: .9375rem;
    		padding-right: .9375rem;
    		padding-bottom: 2rem;
			}
        .btn-contact.website,
		.btn-contact {
			padding: 1.250rem;
			margin-top: 0;
			box-shadow: none;
			width: 100%;
			}
        .btn-contact.website {
            margin-top: 1.250rem;
            margin-bottom: .9375rem
            }
		.article_section {padding: 0;}
		.article {
			padding: 0;
			padding-top: 2.750rem;
			}
		.article:last-child {padding-bottom: .9375rem;}
		.article .item {padding: 1.625rem;}
		.article .content {
			padding-top: 2rem;
			border-top: none;
			}
		.article .picto {margin-bottom: 0;}
		.article h2 {
    		margin-top: 0;
			padding-top: 1.875rem;
			font-size: 2rem;
			font-weight: 400;
			line-height: 1.3em;
			}
		.article h2 br {display: none;}
		.article h2 span {margin-top: 0;}
		.article h2.teammate {
			font-size: 1.750rem;
			font-weight: 600;
			}
		.article h2.teammate span {
			font-size: 1.250rem;
			font-weight: 400;
			line-height: 1.2em;
			}
		.sociaLink {
			padding-top: .9375rem;
			margin-top: .9375rem;
			}
		.article .content > div {
			padding-bottom: 1.875rem;
			margin-bottom: 0;
			}
		.article .content > div,
		.article h3,
		.content_txt p,
		.content_txt ul {
			font-size: 1.375rem;
			line-height: 1.45em;
			}
		.article .texteencadre-spip {
			margin-top: 1.125em;
			padding: 20px;
			}
		.grid_col-12.start {
			padding-top: 1.750rem;
			padding-bottom: 0;
			}
		.portfolio .intro {padding-bottom: 1.750rem;}
		.intro h2,
		.intro p,
		.intro .detail {
			padding-left: .9375rem;
			padding-right: .9375rem;
			}
		.intro p {
			margin-bottom: 2rem;
			font-size: 1.375rem;
			line-height: 1.45em;
			}
		.intro h2 {margin-bottom: .9375rem;}
		.intro .detail {margin-top: 0;}
		.scrollContainer,
		.scrollIndicator_bg,
		.scrollSection,
		.scrollBg {display: none;}
		}

    @media only screen and (max-width: 39.9375rem) {
        .mockups {
            padding-top: .9375rem;
            padding-bottom: .9375rem
            }
        .mockups picture {padding: .9375rem!important}
        }

/* CH?? - FORMULAIRES
/* ---------------------------------------------------------------------------------- */
legend {
	padding-top:.9375rem;
	padding-right:3.750rem;
	border-top:2px solid currentColor;
	font:600 .875rem/1.15em "Barlow Condensed", Helvetica, Arial, sans-serif;
	text-transform:uppercase;
	letter-spacing:3px;
	color: var(--color-2);
	}

label {
	display:inline-block;
	font-size:1.5rem;
	font-weight:300;
	color:var(--color-2);
	}
	
fieldset,
.fieldset {
	padding:0;
	margin-top: 0;
	border:none;
	}

select {
    height: 50px;
    margin-bottom: 0.25em;
    margin-top: 0.35em;
    padding: 0.5rem 1.5rem 0.5rem 0.5rem;
	border:none;
	font-size:1.125rem;
	}
		

.fieldset_fieldset_1 {padding-top:45px;}
.fieldset_fieldset_2 {padding-top:115px;}

.fieldset_fieldset_1 .editer-groupe,
.fieldset_fieldset_2 .editer-groupe {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	margin: 0 -.9375rem;
	}

.editer,
.saisie_textarea {margin-top:55px;}

.fieldset_fieldset_1 .editer,
.fieldset_fieldset_2 .editer {
	width:50%;
	padding:0 .9375rem;
	}

.fieldset_fieldset_2 .saisie_textarea,
textarea {width:100%;}
textarea {min-height:300px;}
		
.formulaire_spip textarea,
.formulaire_spip input {
	width: 100%;
	height:80px;
	padding:0.5em;
	margin-top:1.250rem;
	border:1px solid #ccc;
	box-shadow:none;
	border-radius:0;
	background:#eee;
	font:400 1.250rem/1.5em "Barlow", Helvetica, Arial, sans-serif;
	color:var(--color-2);
	}

input::-moz-placeholder,
textarea::-moz-placeholder,
input::placeholder,
textarea::placeholder {color: #ccc;}

.boutons {text-align: right;}

.formulaire_spip input[type="submit"]{
	display:inline-block;
	cursor: pointer;
	padding: 0;
	margin:50px 0;
	width: 290px;
	height: 95px;
	background: var(--color-2);
	box-shadow: 6px 6px 0 var(--color-1-light);
	border: none;
	font:300 1.625rem/95px "Barlow", Helvetica, Arial, sans-serif;
	text-align: center;
	color: #FFF;
	-webkit-transition: all .2s ease-in-out;
    -moz-transition: all .2s ease-in-out;
    -ms-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
	}

.formulaire_spip input[type="submit"]:hover {
	box-shadow: 12px 12px 0 var(--color-1-light);
	background-color: var(--color-1);
	}

	@media only screen and (max-width: 63.9375rem) {
		.formulaire_spip input {height: 65px;}
		label {
			font-size: 1.250rem;
			font-weight: 400;
			}
		
		}

	@media only screen and (max-width: 39.9375rem) {
		.fieldset_fieldset_1 .editer,
		.fieldset_fieldset_2 .editer {width:100%;}
		.fieldset_fieldset_1 {padding-top: 0;}
		.fieldset_fieldset_2 {padding-top: 85px;}
		.editer,
		.saisie_textarea {margin-top: 1.250rem;}
		.formulaire_spip textarea,
		.formulaire_spip input {margin-top: .625rem;}
		.formulaire_spip input[type="submit"] {
			box-shadow: none!important;
			width: 100%;
			}
		
		}

.explication p {
	margin: 0;
	color:#666;
	font-size:0.813em;
	}

.reponse_formulaire_erreur p,
.reponse_formulaire_ok p {
    background: var(--color-1);
    padding: 1.875rem .9375rem;
	margin-bottom: 1.875rem;
    color: #FFF;
    font-size: 1.5rem;
    line-height: 1.35em;
    text-align: center;
	}

.erreur_message {
	font:400 0.750em/1.5em "Barlow condensed", Helvetica, Arial, sans-serif;
	color:var(--color-1);
	}

.erreur_message + input {
	border-color:var(--color-1);
	background-color: #ffcccc;
	}

.reponse_formulaire_ok p {
    background: #6ef3d6;
    color: var(--color-2);
	}