/*

Theme Name: Wpc3

Theme URI: https://capitainewp.io

Author: Emmanuel Rotureau

Author URI: https:wordpresscreation.fr

Description: Mon premier thème !

Requires at least: WordPress 5.0

Version: 1.0

*/









.ast-page-builder-template .site-content > .ast-container {

	display: block;

}







.ast-container {

	padding-left: 0;

	padding-right: 0;

}



html, body {

  height: 100%;

  font-family: 'Roboto';

  margin:0;

}





ul {

	list-style-type: none;

}



button {

	background-color: transparent;

	border-style: none;

	outline: none;

}



a {

	text-decoration: none;
	color: #c4c4c4;

}




button, a {

	outline: none;

}

button:hover, a:hover {

  color: #444;

}



button:hover path {

	fill: #444;

}



header {

	padding: 10px;

	position: fixed;

	top: 0;

	left: 0;

	width: 100%;

	display: flex;

	justify-content: space-between;

	background-color: #fff;

	z-index: 100;

}



.astra-advanced-hook-11 {

	padding: 40px 0 20px 0;

	position: fixed;

	top: 0;

	left: 0;

	width: 100%;

	display: flex;

	justify-content: space-between;

	background-color: #fff;

	z-index: 1000;

}







.header-col2 {

	display: flex;

	flex-direction: row;

	justify-content: space-between;

	align-items: center;	

	font-size: 22px;
	padding-right: 10px;

}



.header-logo {

	font-size: 38px;

	font-family: 'Roboto';

	font-weight: 800;

	color: #000;

	display: flex;

	flex-direction: column;

	line-height: 0.9;

}



.header-logo span {

  font-size: 25px;

  font-family: 'Montserrat';  

	font-weight: 300;  

} 



.header-logo:focus, .header-logo:hover {

  color: #444;

}





.header-tel {

  display: flex;

  flex-direction: row;

  align-items: center;

padding-right: 40px;	  	

}





header svg {

	padding-right: 10px;

}



.hamburger-icon {

  display: inline-block;

  cursor: pointer;

}



.hamburger-icon svg {

	width: 45px;	

}



#offCanvasBurger nav {

	height: 100vh;

	display: flex;

	flex-direction: column;

	justify-content: center;

}



header .main-menu {

	display: block;

	text-align: center;

	list-style-type: none;

	margin: 0;

	padding: 0;



}



header li a {

	text-transform: uppercase;

		color: #fff;

	text-decoration: none;

}



header .main-menu > li {
	font-size: 1.8em;
	padding-bottom: 30px;
}



header .main-menu > li > a {

	display: block;

	padding: 12px 20px;

}

.menu-item-480 a {
padding: 3% 0;
}

.header-submenu {

display: flex;

flex-direction: row;

justify-content: center;

	padding-bottom: 40px;

} 



.header-submenu li {

padding: 0 20px;

font-size: 0.5em;	

} 





section {

	position: relative;

}



#accueil {

	display: flex;

}





.text-vert {

	background-color: #fff;

	text-decoration: none;

	color: #000;

	font-size: 28px;

}







.text-vert span {

	transform: rotate(90deg);

	-webkit-transform: rotate(90deg);

	-moz-transform: rotate(90deg);

	-ms-transform: rotate(90deg);

	-o-transform: rotate(90deg);

	position: fixed;

	top: 50%;

	right: 0 !important;

	margin-right: -150px;

	background: #fff;

	padding: 10px;

	text-transform: uppercase;

	line-height: 1em;

	z-index: 90;

	font-size: 1em;

}







.pad-2 {

padding: 0 2%;

}



.pad-10 {

	padding: 0 10%;

}



.pad5-10 {

	padding: 5% 10%;

}



.full-height {

	height: 100vh;  

}





.vert-middle {

	align-content: center;

	justify-content: center;

}



.flex-col {

	display: flex;

	flex-direction: column;

}



.flex-row {

	display: flex;

	flex-direction: row;	

}



.just-center {

	justify-content: center;

}



.grid-col2 {

	display: grid;

	grid-template-columns: repeat(2, 1fr);

	grid-template-rows: repeat(2, 1fr);

	row-gap: 4vh;

	column-gap: 5em;

}





.bg-blanc {

	background: #fff;

}



.bg-noir {

	background: #000;

}



.col-blanc {

	color: #fff;

}



.col-noir {

	color: #000;

}





.mont {

  font-family: 'Montserrat';	

}



.rank-math-breadcrumb {
	font-size: 0.6em;
}


.citation {
	color: #fff;
	width: 60%;
	margin: auto;
	text-align: center;
	font-style: italic;
	font-size: 1.5em;
	line-height: 1.7;
	padding-bottom: 3%;
}



.sect-triangle-noir, .bouton-plus, .sect-triangle-blanc, #s4 .sect-triangle-blanc {

	position: absolute;

	bottom: 0%;

	left: 50%;

	transform: translate(-50%,-50%);

}



.sect-triangle-noir svg, .sect-triangle-blanc svg, #s4 .sect-triangle-blanc svg, .collapsible-button svg {

	width: 7em;

}







h1, h2, h3 {

	text-transform: uppercase;

	margin: 0;	

}



p {

	margin: 0;

	font-size: 1.5em;

	line-height: 1.6;

	text-transform: none;

	font-weight: 500;

	font-family: 'Montserrat';

}



h1 {

	font-size: 6em;

	display: flex;

	flex-direction: column;

	color: #000;

	font-weight: 800;

}


#s1 h2 {
	font-size: 1em;
	color: #000;
	font-weight: 400;
}


h1 span {

	font-size: 0.4em;

	font-weight: 400;

}



/*

h1 span:nth-child(2) {

	display: flex;

	justify-content: flex-end;

	font-weight: 800;

}

*/



h2 {

	font-weight: 800;

	font-size: 6em;

	color: #fff;

	padding-bottom: 3%;
display: flex;
flex-direction: column;
}





h3 {

	font-weight: 500;

	color: #fff;

}



p {

	font-family: 'Montserrat';	

}



button, button:hover, button:focus, button:active {

	background-color: transparent;

}



#s2 p, #s4 p {

	font-size: 1.3em;

	line-height: 1.5;

}





.pad5-10 {

	padding: 5% 10%;	

}



.pad1-10 {

	padding: 1% 10%;	

}


h2 .mont {
	font-size: 0.3em;
}




#s3 {

	background-image: url("https://wpcreav3.wordpresscreation.fr/wp-content/uploads/2023/04/wordpress-creation-services-digital.jpg");

	background-position: center;

	background-repeat: no-repeat;

	background-size: cover;

}







.block-service {	

	display: flex;

	flex-direction: row;

	font-weight: 800;

	padding: 5%;

	align-items: center;	

}



header .main-menu {
	display: block;
	text-align: center;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

header .main-menu > li > a {
	display: block;
	padding: 12px 20px;
}

#menu-item-480 ul {
	display: flex;
	flex-direction: row;
	justify-content: center;
	padding-bottom: 40px;
}

#menu-item-480 li {
	padding: 0 20px;
	font-size: 0.5em;
}


h2 .mont {
	font-size: 0.3em;
	font-weight: 400;
}


.mobile-footer-tel {
	display: none !important;
}


.footer-row1 .submenu {
	font-size: 0.7em;
	padding: 0;
}

.footer-row1 .submenu li {
	display: inline-block;
	text-align: left;
}


.footer-row1 .submenu {
	font-size: 0.7em;
	padding: 0;
}

.menu-item-480 .submenu {
	display: none;
	position: absolute;
	left: 0;
	top: 100%;
	min-width: 100%;
	white-space: nowrap;
}

.footer-menu li:hover > .sub-menu {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
}



.block-service span {

padding-right: 2%;

}





.block-service:hover, .block-service:focus {

	background: #000;

	cursor: zoom-in;	

}



.block-service p {
	font-size: 4em;
	display: flex;
	flex-direction: column;
	justify-content: center;
	line-height: 1;
	width: 100%;
	font-weight: 800;
	color: #fff;
	text-transform: uppercase;
	font-family: 'roboto';
}



.block-service p span {

	color: #CCCCCC;

	font-size: 0.5em;

	font-weight: 400;

	padding: 3% 0;

}







.wp-chiffres {

	display: grid;

	grid-template-columns: repeat(4, 1fr);

	gap: 3%;

	padding: 5%;

}



.wp-cercle-container {

	display: flex !important;

	flex-direction: column !important;

	align-items: center;

	color: #fff;

}



.wp-cercle-container p {

	margin-top: 15px;

	font-size: 1em;

	text-align: center;

	text-transform: none;

}



.wp-cercle {

	display: flex;

	justify-content: center !important;

	align-items: center;

	width: 6em;

	height: 6em;

	border-radius: 50%;

	border: solid 4px #fff;

	margin-bottom: 6%;

}







.wp-cercle span {

	font-size: 1.4em;

	font-weight: 500;

}





.wp-cercle h3 {

	font-size: 2em !important;

}





.btn-accueil-wp {

	display:flex; 

	justify-content: center;

	padding-bottom: 5%;

}



.btn-dev {

	display:flex; 

	justify-content: center;

}





#home-off-canvas1, #home-off-canvas2 {

	padding: 0 2%;

	background: #000;

}








#home-off-canvas1 .off-canvas-header {
	width: 100%;
}



#home-off-canvas1 h3 {
	font-size: 4em;
	font-weight: 800;
}




#home-off-canvas1 p {

	column-count: 2;

	line-height: 2em;

	font-size: 1.1em;

	margin: 3% 6%;

}







.off-canvas-svg {

	justify-content: space-between;

	margin: 3% auto;

	width: 60%;

}





.off-canvas-svg flex-row img {

	height: 3em;

	fill: #FFFFFF;

}





.off-canvas-svg img {

	height: 3em;

}



.off-canvas-svg img:hover, .off-canvas-svg img:focus {

	height: 3em;

	cursor: pointer;

}



.off-canvas-papgination {

	display: flex;

	justify-content: space-between;

	padding: 3%;

}



.off-canvas-papgination a {

  align-items: center;

}



.off-canvas-papgination a:hover, .off-canvas-papgination a:focus {

	color: #444;

}



.off-canvas-papgination svg {

  width: 15%;

}









#home-off-canvas1 a, .btn-accueil-wp a {

	padding: 1% 2%;

	background-color: #fff;

	color: #000;

	text-align: center;

	text-transform: uppercase;

	font-size: 1.3em;

	text-decoration: none;

	margin: 0 auto;

}



#home-off-canvas1 a:hover, #home-off-canvas1 a:focus, .btn-accueil-wp a:hover, .btn-accueil-wp a:focus {

	background-color: #000;

	color: #fff;

	border: solid 2px #fff;

}





.btn-dev a {

	padding: 0.8em 2em;

	background-color: #000;

	color: #fff;

	text-align: center;

	text-transform: uppercase;

	font-size: 1em;

	text-decoration: none;

	margin: 0 auto;

}





.btn-dev a:hover, .btn-dev a:focus {

	background-color: #fff;

	color: #000;

	border: solid 2px #000;

}







.off-canvas-papgination a:first-child svg {

	padding-right: 10%;

}





.off-canvas-papgination a:nth-child(2) svg {

	padding-left: 10%;

}



.off-canvas-papgination a {

	display: flex;

	color: #fff;

	font-size: 1em;

	text-transform: uppercase;

	text-decoration: none;

}



.off-canvas-papgination a:nth-child(1) {

	flex-direction: row-reverse;

}



.off-canvas-papgination a:nth-child(2) {

	flex-direction: row;

}







.off-canvas-papgination a div {

	display: flex;

	flex-direction: column;

}





.off-canvas-papgination a:nth-child(1) {

	text-align: :left !important;

	margin: 0 !important;

}





.off-canvas-papgination a:nth-child(2) {

	text-align: right !important;

	margin: 0 !important;

}





.off-canvas-papgination a:first-child span {

	text-align: left;

	font-size: 0.6em;

}





.off-canvas-papgination a:nth-child(2) span {

	text-align: right !important;

	font-size: 0.6em;

}



footer {

	background: #000;

	text-transform: uppercase;

	position: relative;

	border-top: solid 2px #fff;

}



.footer-row1 a, .footer-row2 a {

	  color: #fff;

	  text-decoration: none;

}



.footer-row2 {

padding: 0% 5%;

}



.footer-row1 {
	display: grid;
	grid-template-columns: 1fr 2fr 6fr;
	column-gap: 5%;
	padding: 3%;
}



.footer-col1 {

	display: flex;

	flex-direction: column;

	justify-content: center;

}



.footer-col2 {

margin-top: 20px;

}





footer .header-logo {

	color: #fff;

	font-size:50px;

}





footer .icones-contact {

	display: block;

	color: #fff;

}



footer .icones-contact div {

	display: flex;

	flex-direction: row;

	align-items: center;

	padding-bottom: 3%;

}



footer .icones-contact img {

	width: 40px;

	padding-right: 15px;

}



.footer-menu {

text-align: right;

}



.footer-row1 .footer-menu {

	font-size: 1em;

}



.footer-row1 .footer-submenu {

	font-size: 0.7em;

	padding: 0;	

}





.footer-menu li {

  display: inline-block;

  position: relative;

}



.footer-menu li a {

  display: block;

  padding: 10px;

  text-decoration: none;

}



.footer-submenu {

  display: none;

  position: absolute;

  left: 0;

  top: 100%;

  min-width: 100%;

  white-space: nowrap; /* Empêche le texte de se couper */

}


.footer-menu li:hover > .footer-submenu {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
}


.footer-submenu li {
	display: inline-block;
	text-align: left;
}



.footer-submenu  li a {

  padding: 5px 10px;

}



.footer-submenu  li a:hover {

}



.footer-row2 ul {

	display: flex;

	flex-direction: row;

	justify-content: space-evenly;

}





footer .main-menu {

  display: flex;

  list-style-type: none;

  margin: 0;

  padding: 0;

}



footer .main-menu > li {

  position: relative;

}



footer .main-menu > li > a {

  display: block;

  padding: 12px 20px;

  color: #fff;

  text-decoration: none;

}



footer .main-menu > li > a:hover {

  background-color: #111;

}



footer .sub-menu {

  display: none;

  position: absolute;

  left: 0;

  top: 100%;

  flex-direction: column;

  list-style-type: none;

  margin: 0;

  padding: 0;

  background-color: #333;

}



footer .sub-menu > li > a {

  display: block;

  padding: 12px 20px;

  color: #fff;

  text-decoration: none;

}



footer .sub-menu > li > a:hover {

  background-color: #111;

}



.main-menu > li:hover > .sub-menu {

  display: flex;

}



.footer-row2 {

	display: flex;

	flex-direction: row;

	justify-content: space-between;

}



.footer-row2 p, .footer-row2 a {

	color: #fff;

	font-size: 0.8em;

}





/* REVIEWS */







.review {

	align-items: center;

	margin: 0;

	background: #000;

	color: #fff;

}



.slider-container {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	overflow: hidden;
	padding: 4% 0;
}



.slider {

    display: flex;

    transition: transform 0.5s ease;

    width: 100%;

}



.slide {

	flex: 0 0 100%;

	display: flex;

	justify-content: center;

	align-items: center;

	height: 300px;

	border: 1px solid black;

	text-align: center;

	width: 100%;

	flex-direction: column;

}



.slide span::before {

	display: inline-flex;

	content: '';

	background-image: url('https://wpcreav3.wordpresscreation.fr/wp-content/uploads/2023/04/star.svg');

	background-size: 180px;

	height: 36px;

	width: 180px;

	background-repeat: no-repeat;

}



.slide span {

	margin-bottom: 3%;

}





.client-review {

	font-size: 1.5em;

	margin-bottom: 3%;

	width: 60%;

}



.client-signature {

	font-size: 1em;

}



.arrow {

    position: absolute;

    top: 50%;

    transform: translateY(-50%);

}



.left-arrow {

	left: 20px;

}



.left-arrow, .right-arrow {

	right: 20px;

}



.left-arrow svg, .right-arrow svg {

width: 50px;

}

/*






.slider-container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 80%;
    overflow: hidden;
}

.slider {
    display: flex;
    transition: transform 0.5s ease;
    width: 100%;
}

.slide {
    flex: 0 0 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 300px;
    font-size: 2em;
    background-color: lightgray;
    border: 1px solid black;
    text-align: center;
    width: 100%;
}

.arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 2em;
    background-color: transparent;
    border: none;
}

.left-arrow {
    left: -50px;
}

.right-arrow {
    right: -50px;
}


*/




/* GRILLE PROJETS */







.grid-projets {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: repeat(3, 1fr);
	gap: 3rem;
	padding-top: 3%;
	text-align: center;
}



.grid-projets .cell {

	position: relative;

	-webkit-box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.73);

	box-shadow: 0px 5px 5px 0px rgba(0,0,0,0.73);

}



.grid-projets .cell img {

  width: 100%;

  height: auto;

}



.grid-projets .overlay {

  position: absolute;

  top: 0;

  bottom: 0;

  left: 0;

  right: 0;

  background: rgba(0,0,0,0.8);

  color: white;

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;

  opacity: 0;

  transition: opacity 0.3s ease;

}


.grid-projets .overlay p {
	text-align: center;
}


.grid-projets .cell:hover .overlay {

  opacity: 1;

}





/* OFFCANVAS ACCUEIL SERVICES */



.off-canvas {

	position: fixed;

	z-index: 101;

	top: 0;

	right: -100%;

	width: 100%;

	background-color: #000;

	overflow-x: hidden;

	transition: right 0.5s;

	padding: 2% 0;

}



        .off-canvas.open {

            right: 0;

        }



        .content {

            padding: 20px;

            color: white;

        }



button {

	color: white;

	border: none;

	cursor: pointer;

	text-align: left;

}





.close-btn {

	position: absolute;

	top: 0px;

	right: 10px;

	z-index: 150;

	font-size: 75px;

	cursor: pointer;

	background: none;

	border: none;

	color: white;

}



        .close-btn:hover {

	color: #444;

}



        .close-btn:focus {

            outline: none;

        }





/* FAQ ACCORDEON */



.faq-accordion {

	width: 70%;

	color: #fff;

	margin: 5% auto;

}



.faq-item {

  padding-bottom: 10px;	

}



.faq-question {

	cursor: pointer;

	padding: 20px;

	width: 100%;

	text-align: left;

	border: none;

	outline: none;

	transition: 0.2s;

	background-color: #000;

	font-size: 1.2em;

	display: flex;

	justify-content: space-between;

}


.faq-question h3 {

	text-transform: inherit;

	line-height: 1.5;

}



.faq-question:active, .faq-question:focus {

  background-color: #000 !important;

  color: #fff;  

}



.faq-question:hover {

  background-color: #444;

  color: #fff;  

}





.faq-answer {

  max-height: 0;

  overflow: hidden;

  transition: max-height 0.2s ease-out;

   color: #000;

  background: #d9d9d9;

  margin: 1%;

  text-transform: none;

}



.faq-answer p {

	padding: 20px;

	font-size: 1.1em;

}



.service-tab {

	position: sticky;

	top: 65px;

	display: flex;

	flex-direction: row;

	justify-content: space-around;

	background: #000;

	color: #fff;

}



/* SERVICES POUR QUOI POUR QUI COMMENT */



.service-tab button {

	font-size: 2em;

	text-transform: uppercase;

	display: flex;

	justify-content: center;

	align-items: center;

	flex-direction: column;

}



.service-tab button:active, .service-tab button:focus, .service-tab button:hover {

	color: #444;

}



.service-tab svg:hover path, .service-tab svg:focus path, .service-tab svg:active path {

fill: #444 !important;

}







.service-tab button svg {

	width: 30%;

}





.tab h2, #s2-wp h2, #s2-contact h2, #s2-methode h2, #s2-wp h2 {

	font-size: 2.5em;

	padding: 2% 0;

}



 #s3-services h2 {

 	padding-bottom: 2%;

 }	



 #s3-services p {

 	padding-bottom: 4%;

 }	



.service-tab-pourquoi .grid-col2 {

padding-top: 3%;

}



.tab-service-arg div {

	display: flex;

	flex-direction: row;

}



.tab-service-arg img {

	height: 6vh;

	padding-right: 20px;

}



.tab-service-arg div div {

	display: flex;

	flex-direction: column;

	align-items: flex-start;

	padding-bottom: 2%;	

}



.tab-service-arg h3 {

	padding-bottom: 2%;

	font-size: 1.5em;

}



.tab-service-arg p {

line-height: 2;

font-size: 1em;

}



.tab-content ul {

	margin: 0;

	padding: 0;

}



/* POUR QUI */



.tabs {

	padding: 0 10%;

}





.tab-headers {

	padding-bottom: 2%;

	display: flex;

	flex-direction: row;

	padding-top: 3%;

	flex-wrap: wrap;

	column-gap: 3%;

}



.tab-header {

	text-transform: uppercase;

	font-size: 1em;

	line-height: 2em;

}



.tab-headers .active {

	color: #444;

}





.service-tab-pourqui .tab-content{

	display: none;

}



.service-tab-pourqui .tab-content p {

	font-size: 1em;

}



.service-actvite-intro {

	padding-bottom: 1%;

	font-size: 1.2em;

}





.service-actvite-liste {

	display: grid;

	padding: 0;

	margin: 0;

	grid-template-columns: auto auto auto auto;

	gap: 25% 7%;

	list-style-type: square;

	padding-bottom: 8%;

}







/* ACCUEIL SERVICES COLLAPSE */



.collapsible-container {

  width: 100%;

  position: relative;

}



.collapsible-button {

  display: flex;

  justify-content: center;

  align-items: center;

  width: 100%;

  cursor: pointer;

  border: none;

  outline: none;

  padding: 10px 0;

  text-align: center;

}



.collapsible-content {

  display: none;

  color: #fff;

}



.collapsible-button:active {

}



.collapsible-button svg {

  transition: transform 0.3s;

}





/* hover offcanvas pictos */



.image-hover-container {

  position: relative;

  display: inline-block;

}


.icone-texte {
	display:flex;
	flex-direction: column;
}


.icone-texte p {
	column-count: 1 !important; 
	margin:0 !important; 
	text-transform: uppercase;
}

.hover-image {

  display: block;

  width: 100%;

  height: auto;

}






.hover-window {

	position: absolute;

	bottom: 150%;

	left: -125px;

	width: 300px;

	background-color: #fff;

	color: #000;

	padding: 10px;

	opacity: 0;

	transition: opacity 0.3s;

	box-sizing: border-box;

	text-align: center;

}



.hover-window p {

	column-count: 1 !important;

	line-height: 1.2em !important;

	font-size: 0.8em !important;

	margin: 0 !important;

}





.image-hover-container:hover .hover-window {

  opacity: 1;

}





/* PAGE WORDPRESS */





.page-template-template-page-wordpress .faq-question {

	display: flex;

	justify-content: space-between;

}



/* PAGE DEVELOPPEMENT ACCORDEON */



.dev-accordion {

	display: grid;

	grid-template-columns: repeat(2, 1fr);

	row-gap: 4vh;

	column-gap: 5em;

	padding-top: 5%;

}



.dev-accordion .faq-answer p {

	padding: 20px;

	font-size: 0.9em;

}


.faq-answer a {

color: #6d6d6d;

}



.page-template-template-page-referencement #s2-services button, .page-template-template-page-services .dev-accordion button, .page-template-template-page-developpement .dev-accordion button {

	background-color: #fff;

	display: flex;

	flex-direction: row;

	cursor: pointer;

	padding: 20px;

	width: 100%;

	text-align: left;

	border: none;

	outline: none;s

	transition: 0.2s;

	background-color: #000;

	font-size: 1.2em;

	align-items: center;

	justify-content: space-between;

}



.page-template-template-page-referencement .dev-accordion img, .page-template-template-page-services .dev-accordion img, .page-template-template-page-developpement .dev-accordion img {

	height: 6vh;

	padding-right: 15px;

}




.page-template-template-page-referencement .faq-answer p, .page-template-template-page-services .faq-answer p, .page-template-template-page-developpement .faq-answer p {

	padding: 10px 20px;

}



.page-template-template-page-developpement #s3-dev {

	margin-bottom: 4%;

}



.dev-accordion button div:first-child { 

	display: flex;

	align-items: center;

}	



.autres-dev p {

	padding-bottom: 4%;

}





/* PAGE CONTACT */



.icones-contact {

	display: grid;

	grid-template-columns: repeat(3, 1fr);

	gap: 3rem;

	padding-top: 3%;

	text-align: center;

}



.icones-contact div {

	display: flex;

	flex-direction: column;

	align-items: center;

}



.icones-contact img {

	width: 4em;

	padding-bottom: 0.8em;

}



#s3-contact {

	display: grid;

	grid-template-columns: 1fr 1fr;

}



.gform_footer {

	display: flex;

	justify-content: flex-end;

}



#gform_submit_button_1 {

	border-radius: 0;

	padding: 10px 15px;

	text-transform: uppercase;

	background-color: #000;

	color: #fff;

	border-style: none;

	font-size: 1.2em;

	cursor: pointer;

}



#gform_submit_button_1:hover, #gform_submit_button_1:focus {

	background-color: #fff;

	color: #000;

	border: solid 1px #000;

}	



/* METHODE */



#s2-methode p {

	padding-bottom: 3%;

}





#s2-methode .image-hover-container {

	display: flex;

	flex-direction: column;

	justify-content: space-between;

}



#s2-methode .image-hover-container img {

	padding-bottom: 5%;

}



#s2-methode .hover-window p {

	padding: 10px;

	line-height: 1.6em !important;

}



.methode-ligne {

	display: grid;

	grid-template-columns: 1fr 1fr;

}





.methode-ligne button {

	background-color: #fff;

	display: flex;

	flex-direction: row;

	cursor: pointer;

	padding: 20px;

	width: 100%;

	text-align: left;

	border: none;

	outline: none;

	transition: 0.2s;

	background-color: #000;

	font-size: 1.2em;

	align-items: center;

	justify-content: space-between;

}



.methode-ligne .faq-question div:first-child {

	display: flex;

	align-items: center;

	width: 100%;

}



.methode-ligne .faq-question img {

	height: 6vh;

	padding-right: 2%;

}



.methode-ligne1, .methode-ligne2 {

display: grid;

grid-template-columns: 1fr 1fr;

}



.methode-fleche {

	 display: flex;

  justify-content: center;

}



.methode-fleche img {

	width: 50%;

	padding: 2% 0;

}



/* PAGE CONTACT */



#s2-contact {

padding: 4% 10%;

}





#gform_1 {

	padding: 0 15%;

}



#gform_1 .gform_wrapper.gravity-theme .gsection {

	border-width: 0;

	padding: 0 16px 8px 0;

}



.contact-carte p:first-child {

	padding: 0;

}



.leaflet-control-attribution {

	display: none !important;

}



/* PAGE MENTIONS LEGALES */



.page-template-mentions-legales #s2-contact a {

	color: #757575;

}


/* SITEMAP */

.sitemap .main-menu {
	font-size: 2.5em;
text-align: center;
text-transform: uppercase;
}

.sitemap .sub-menu {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
column-gap: 3%;
padding: 2%;
font-size: 0.7em;
}

.sitemap  li {
margin: 2% 0;
}

/* BACK TO TOP */



#back-to-top {

	position: fixed;

	bottom: 10px;

	right: 10px;

	outline: none;

	transition: opacity 0.3s ease-in-out;

	z-index: 99;

}



#back-to-top:hover {

  cursor: pointer;

}



footer .icones-contact {

	text-align: left;

}





@media screen and (max-width: 1410px) {

.footer-row1 {

	display: grid;

	grid-template-columns: 1fr 1fr;

	grid-template-rows: 1fr 1fr;	

	column-gap: 5%;

}



h1 {

font-size: 4em;

}



.footer-row1 {

	display: block;

}



.footer-menu {

  text-align: center;

 } 



#s3-contact {

	column-gap: 6%;

}



#s3-contact {

	padding: 5% 2%;

}



#gform_1 {

	padding: 0;

}



}


@media screen and (max-width: 1280px) {

.faq-accordion {
	width: 100%;
	color: #fff;
	margin: 5% auto;
}


footer-row1 {
	flex-direction: row;
	display: flex;
	flex-wrap: wrap;
}

}	


@media screen and (max-width: 1024px) {



aside {

	display: none;

}



h1, h2 {

	font-size: 4em;

}



.sect-triangle-noir, .bouton-plus, .sect-triangle-blanc, #s4 .sect-triangle-blanc {

	position: relative;

	text-align: center;

	bottom: 0;

	left: 0;

	transform: inherit;

}





.pad1-10, .pad5-10 {

	padding: 2%;

}



header .main-menu > li {

	font-size: 1.2em;

}



.header-submenu li {

	padding: 0 20px;

	font-size: 0.75em;

}


.grid-col2 {
	grid-template-columns: repeat(1, 1fr);
	grid-template-rows: repeat(4, 1fr);
}



.faq-accordion {

	width: 90%;

	margin: 2% auto;

}

.grid-projets {
	grid-template-columns: repeat(2, 1fr);
	grid-template-rows: repeat(4, 1fr);

}



#s3-contact {

	padding: 4% 2%;

	display: block;

}



.contact-carte iframe {

	width: 100%;

	border-style: none;

}





#gform_1 {

	padding: 0;

}



.contact-carte {

	text-align: center;

}





footer .header-logo {

	align-items: center;

	line-height: 1.2;

}



footer .icones-contact div {

	display: flex;

	flex-direction: column;

	align-items: center;

	padding-bottom: 2%;

}



footer .icones-contact img {

	padding: 0;

}



.footer-row1 {

	padding-bottom: 3%;

	flex-direction: column;

	justify-content: center;

}

.footer-row1 p {
	font-size: 1em;
}

.footer-row1 .footer-menu {

	font-size: 1em;

	padding: 0;

}


.footer-col1 p {
	color: #fff;
	font-size: 1em;
	padding-top: 2%;
	text-align: center;
}


.footer-col3 {

	text-align: center;

}



.footer-menu {

  text-align: center;

 } 



.footer-row2 p, .footer-row2 a {

	color: #fff;

	font-size: 0.8em;

}

}







@media screen and (max-width: 767px) {

footer {
	padding-bottom: 50px;
}

.mobile-footer-tel {
	display: flex !important;
	flex-direction: row;
	justify-content: space-between;
	background-color: #fff;
	bottom: 0;
	z-index: 250;
	position: fixed;
	width: 100%;
}

.mobile-footer-tel a:first-child {
	left: 0;
}

.mobile-footer-tel a:nth-child(2) {
	right: 0;
}



.mobile-footer-tel img {
width: 45px !important;
width: 45px !important;
}

    .grid-container, .grid-projets {

        grid-template-columns: repeat(1, 1fr);

        grid-template-rows: repeat(9, 1fr);

    }    



aside {

	display: none;

}





.pad-10 {

	padding: 0 2%;

}



.pad5-10 {

	padding: 5% 2%;

}



.full-height {

height: auto;

}



h1 {

	font-size: 3em;

}





h2, .tab h2, #s2-wp h2, #s2-contact h2, #s2-methode h2, #s2-wp h2 {

	font-size: 2em;

	padding-bottom: 5%;

}





.sect-triangle-noir svg, .sect-triangle-blanc svg, #s4 .sect-triangle-blanc svg, .collapsible-button svg {

	width: 4em;

}







 #s1 .sect-triangle-noir {

 	position: absolute;

	bottom: 0%;

	left: 50%;

	transform: translate(-50%,-50%);

}



.header-logo {

	font-size: 20px;

}



.header-logo span {

	font-size: 17px;

}



.hamburger-icon svg {

	width: 30px;

}



.header-submenu {

	display: block;

	padding: 0;

}

#offCanvasBurger content {
	padding: 0;
}



#menu-item-480 {
	padding: 0;
}


.header-tel {

	display: none;

}





#offCanvasBurger li, .header-submenu li {
	font-size: 1em;
	padding-bottom: 7%;
}




#menu-item-480 .sub-menu {
	font-size: 0.6em;
	display: grid;
	grid-template-columns: 1fr 1fr;
	padding: 10% 0 0 0;
}



header .main-menu a {

	padding: 0 !important;

}



.block-service p {

	font-size: 2em;

}







#s3 {

	padding-top: 5%;

}


#home-off-canvas1 a, .btn-accueil-wp a {

	font-size: 1em;

}



#home-off-canvas1 h3 {

	font-size: 1.7em;

	padding-bottom: 5%;

}



p, #s2 p, #s4 p {

	font-size: 1em;

}



#s1, #s3 .full-height, #s1-services, #s1-dev {

	height: 100vh;

}



#s3 .content {

	padding: 0 2%;

}





.wp-cercle-container {

	padding-bottom: 7%;

}



.wp-cercle {

	width: 4em;

	height: 4em;

	border: solid 2px #fff;

}





.wp-chiffres {

	display: block;

}



.wp-cercle span {

	font-size: 1em;

}



.client-review {

	font-size: 1em;

}



.left-arrow, .right-arrow {

	right: 0;

}



.left-arrow {
	left: 0;
	margin: 0;
}



#s7 p {

	padding-bottom: 5%;

}



.faq-accordion {

	width: 100%;

}



.left-arrow svg, .right-arrow svg {
	width: 35px;
}





#offCanvasVitrine .full-height {

height: 100vh;

display: flex;

flex-direction: column;

justify-content: center;

}





#home-off-canvas1 .off-canvas-header {

	width: 100%;

}



#home-off-canvas1 p {

	column-count: 1;

	line-height: 1.6em;

	font-size: 1em;

	margin: 0;

}


.off-canvas-svg {
	padding: 0;
	width: 100%;
	margin: 10% 0;
	grid-template-columns: 1fr 1fr;
	display: grid;
	row-gap: 13%;
}


.off-canvas-svg img {

	height: 2.5em;

}





.off-canvas-svg img {
	height: 2.5em;
	padding-bottom: 3%;
}



.image-hover-container h3 {

	font-size: 1em;

}


.icone-texte {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}


.methode-fleche {

	display: none;

}



.methode-ligne button {

	padding: 2%;

}

.faq-question {

	font-size: 0.8em;

	padding: 10px;

}



.faq-answer p {

	font-size: 0.8em;

}

.faq-answer a {

color: #6d6d6d;

}



.dev-accordion {

	display: grid;

	grid-template-columns: repeat(1, 1fr);

	row-gap: 0;

	width: 70%;

	margin: auto;

}



.arrow-down, .arrow-up {

	font-size: 20px;

}



.dev-accordion .faq-answer p {

	padding: 20px;

	font-size: 0.9em;

}



.service-actvite-liste {

	padding: 0;

	grid-template-columns: auto auto;

	gap: 10%;

	padding-bottom: 14%;

	margin: 2%;

}



#s2-methode .image-hover-container {

	text-align: center;

	display: block;

	padding-bottom: 4%;

}





.hover-window {

	display: none;

}



#s2-methode .image-hover-container img {

	/* padding-bottom: 5%; */

}



.methode-ligne {

	display: block;

}





.icones-contact {

	grid-template-columns: repeat(1, 1fr);

	gap: 2rem;

}



#pourquoi .dev-accordion {

	width: 100%;

}



.page-template-template-page-services .dev-accordion img, .page-template-template-page-developpement .dev-accordion img {

	height: 4vh;

}

.page-template-template-page-services .dev-accordion button, .page-template-template-page-developpement .dev-accordion button {

	font-size: 1em;

}



.service-actvite-liste {

	gap: 4% 10%;

}



#home-off-canvas1 a, .btn-accueil-wp a {

	margin-top: 5%;

}



#s2-contact {

	padding: 2%;

}



.gform_footer {

	justify-content: center;

}



#gform_submit_button_1 {

	padding: 5px 20px;

}


.citation {
	font-size: 1.3em;
	width: 100%;
}


}



 @media screen and (max-width: 600px) {

.service-actvite-liste {

	display: block;

	padding-bottom: 3%;

padding-left: 13%;

}

.off-canvas-svg {
	row-gap: 20%;
}

.off-canvas-svg img {
	height: 2.5em;
	padding-bottom: 1%;
}

}