/*
 Theme Name:     Divi Child Theme
 Theme URI:      http://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme
 Author:         Elegant Themes
 Author URI:     http://www.elegantthemes.com
 Template:       Divi
*/

@import url("../Divi/style.css");
@import url('https://fonts.googleapis.com/css2?family=Be+Vietnam:wght@800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@500;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Pattaya&display=swap');
/**/


@font-face {
  font-family: 'Titiliumbold';
  src: url('fonts/TitilliumWeb-Bold.ttf');
  font-weight: normal;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Titiliumregular';
  src: url('fonts/TitilliumWeb-Regular.ttf');
  font-weight: normal;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Titiliumblack';
  src: url('fonts/TitilliumWeb-Black.ttf');
  font-weight: normal;
  font-style: normal;
  font-display: auto;
}
@font-face {
  font-family: 'Titiliumitalic';
  src: url('fonts/TitilliumWeb-Italic.ttf');
  font-weight: normal;
  font-style: normal;
  font-display: auto;
}


/* Les retrospectives */
.title-pages-speciales-center {
  display: flex;
  align-items: center;
  justify-content: center;
}
.img-pages-speciales {
  height: 70px;
}

.title-pages-speciales-center h1{
  color: #FF6600;
  font-size: 90px;
  line-height: 90px;
  font-weight: 800;
  position: relative;
  margin-top: 180px;
  margin-bottom: 40px;
  margin-left: 5px;
  text-align: center;
}

.title-pages-speciales-center img{
  line-height: 90px;
  position: relative;
  margin-top: 180px;
  margin-bottom: 40px;
}

/* Newsletter Mailpoet formulaire */

.texte-obligatoire-fields{
  margin-bottom: 5px!important;
}

.texte-form-newsletter{
  color: #333333;
  font-size: 17px;
  line-height: 20px;
  font-weight: 600;
}

.input-email-newsletter input{
  background: #FFFFFF;
  border: 0px;
  border-bottom: 2px solid #CCC;
  font-size: 17px;
  height: 30px;
  padding-left: 0px;
  padding-bottom: 5px;
  width: 85%;
}

.input-email-newsletter input::placeholder{
  color: #333333;
}

.pdc-newsletter{
  font-size: 10px!important;
  line-height: 14px!important;
}

.submit-newsletter{
  position: relative;
  margin-top: 60px;
  margin-bottom: 30px!important;
}

.submit-newsletter input{
  display: block;
  margin: auto;
  width: 300px;
  max-width: 100%;
  text-align: center;
  color: #333333!important;
  font-size: 30px;
  line-height: 36px;
  font-weight: 600;
  position: relative;
  z-index: 2;
  padding-top: 20px!important;
  background: transparent!important;
  height: auto;
  cursor: pointer;
  border: 0px!important;
}

.submit-newsletter:before{
  content: " ";
  position: absolute;
  height: 0;
  width: 110px;
  border-bottom: 60px solid #ff6600;
  border-left: 0px solid transparent;
  border-right: 20px solid transparent;
  transform: perspective(400px) translateX(-50%) translateY(13px) rotate(5deg) rotateX(180deg);
  left: 50%;
  top: 0;
  transition: all 0.7s ease;
  z-index: -1;
}

.submit-newsletter:hover:before {
  transform: perspective(400px) translateX(-50%) translateY(20px) rotate(10deg) rotateX(180deg);
}

.parsley-errors-list{
  padding-bottom: 0px!important;
  font-size: 14px!important;
  line-height: 14px!important;
}

/* General page */

#page-container{
  padding-top: 0px!important;
  margin-top: 0px!important;
  overflow: hidden;
}

body.load{
	overflow: visible!important;
}

/**/

/* Header + Menu */

#logo{
  width: 260px;
  max-width: 200px!important;
  height: 33px;
  transition: all 0.4s ease;
  opacity: 1;
  max-height: 100%!important;
}

.logo-noir #logo,
.error404 #logo,
.single-post #logo{
  -webkit-filter: brightness(0.80);
  filter: brightness(0.80);
}

body.archives-archives{
  background-color: #222224;
}

#main-header{
  position: fixed!important;
  top: 0!important;
  background: none;
  box-shadow: none!important;
  height: 0;
  z-index: 99999!important;
  transition: all 0.3s ease;
}

body #main-header.et-fixed-header{
  box-shadow: 0 0 7px rgba(0,0,0,0)!important;
}

.et_header_style_left .logo_container{
  left: 0;
}

.et_header_style_left .logo_container > a{
  width: 260px;
  display: inline-block;
  overflow: hidden;
  transition: all 0.3s ease;
  margin-left: 30px;
  margin-top: 30px;
}

body #main-header.et-fixed-header .logo_container > a{
  width: 28px;
  display: inline-block;
  overflow: hidden;
  transition: all 0.3s ease;
}

body #main-header.et-fixed-header .logo_container > a #logo{
  -webkit-filter: brightness(0.90);
  filter: brightness(0.90);
}

#main-header .container{
  width: 100%!important;
  padding-left: 25px;
  padding-right: 25px!important;
  max-width: 100%;
  height: 100%;
}

body.et_header_style_left #et-top-navigation{
  padding-top: 0px!important;
  padding-bottom: 0px!important;
}

.et_header_style_fullscreen .et_pb_fullscreen_nav_container{
  display: flex;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  max-width: 100%!important;
}

.et_header_style_fullscreen .et_slide_in_menu_container{
  opacity: 0!important;
  background: #FFFFFF!important;
  padding-top: 0!important;
  z-index: 99999!important;
  transition: all 0.4s ease;
  z-index: -10!important;
}

.et_header_style_fullscreen ul#mobile_menu_slide{
  display: flex!important;
  flex-direction: row;
  width: 100%;
  height: 100%;
  background-color: #FFFFFF!important;
}

.et_header_style_fullscreen .et_slide_in_menu_container span.mobile_menu_bar.et_toggle_fullscreen_menu{
  display: none!important;
}

.et_header_style_fullscreen ul#mobile_menu_slide li{
  display: flex;
  flex-direction: column;
  flex-basis: 33.33333%;
  justify-content: center;
  position: relative;
  background: #FFFFFF;
}

/* Menu complet link + li */

.titre-span{
  opacity: 0;
  visibility: hidden;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a>span:last-child strong {
  font-weight: 800;
  padding-top: 20px;
  display: block;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a>span div.couleur-menu-1,
.et_header_style_fullscreen ul#mobile_menu_slide li>a>span div.couleur-menu-2 {
  position: absolute;
  overflow: hidden;
  left: 0;
  width: 100%;
  height: 70px;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a>span div.couleur-menu-1:before,
.et_header_style_fullscreen ul#mobile_menu_slide li>a>span div.couleur-menu-2:before {
  padding: 10px 0;
  position: absolute;
  white-space: nowrap;
  overflow: hidden;
  content: attr(data-content);
  left: 0;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a>span div.couleur-menu-1:before {
  background-color: transparent;
  color: #FFFFFF;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a>span div.couleur-menu-2:before  {
  background-color: transparent;
  color: #ff6600;
}

.et_header_style_fullscreen ul#mobile_menu_slide li.current-page{
  background: #ff6600!important;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a.current-page>span div.couleur-menu-1:before{
  color: #ff6600;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a.current-page>span div.couleur-menu-2:before{
  color: #FFFFFF;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a{
  display: flex!important;
  align-content: center;
  text-align: left;
  padding: 20px;
  padding-left: 50px;
  width: 100%;
  height: 100%;
  opacity: 1!important;
  position: relative;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  text-align: left;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a span:last-child{
  flex-basis: 400px;
  width: 400px;
  display: flex;
  flex-wrap: wrap;
  max-width: 100%;
  font-size: 17px;
  line-height: 25px;
  font-weight: 600;
  transform: translateY(40px);
  opacity: 0;
  position: absolute;
  top: 53%;
  animation: animTextMenuRetour 0.2s ease 0s 1 both;
  color: #868686;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a span{
  display: block;
  color: #d2d3d5;
  padding-bottom: 0px;
  transition: all 0.3s ease;
  z-index: 2;
  position: relative;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a>span:first-child{
  font-size: 51px;
  line-height: 51px;
  font-weight: 600;
  position: relative;
  padding-bottom: 25px;
  transform: translateY(0);
  transition: all 0.4s ease;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a>span:first-child:after{
  content: " ";
  position: absolute;
  bottom: 0px;
  left: 0;
  width: 0px;
  max-width: 100%;
  height: 2px;
  background: #ff6600;
  opacity: 0;
  transition: all 0.5s ease;
  display: none;
}

.et_header_style_fullscreen ul#mobile_menu_slide li.current-page>a>span:first-child:after{
  background: #FFFFFF;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a:hover>span:first-child,
.et_header_style_fullscreen ul#mobile_menu_slide li>a.current-page>span:first-child{
  transform: translateY(-30px);
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a:hover> span:first-child:after,
.et_header_style_fullscreen ul#mobile_menu_slide li>a.current-page>span:first-child:after{
  opacity: 1;
  width: 100%;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a:hover span:last-child,
.et_header_style_fullscreen ul#mobile_menu_slide li>a.current-page span:last-child{
  animation: animTextMenu 0.3s ease 0.3s 1 both;
}

.et_header_style_fullscreen ul#mobile_menu_slide li>a.current-page span:last-child{
  color: #FFFFFF;
}

/* Premier menu */

.et_header_style_fullscreen ul#mobile_menu_slide li:first-child{
  background: #FFFFFF;
}

.et_header_style_fullscreen ul#mobile_menu_slide li:first-child>a:before{
  content: " ";
  position: absolute;
  height: auto;
  width: 100px;
  border-bottom: 75px solid #ff6600;
  border-left: 0px solid transparent;
  border-right: 15px solid transparent;
  transform: perspective(500px) translateY(-60%) rotate(14deg) rotateY(-22deg) scale(1);
  left: 142px;
  top: 50%;
  transition: all 0.4s ease;
  opacity: 1;
  display: block;
  z-index: -1;
}

.et_header_style_fullscreen ul#mobile_menu_slide li:first-child>a>span:first-child{
  position: relative;
}

.et_header_style_fullscreen ul#mobile_menu_slide li:first-child>a>span div.couleur-menu-1:before {
  width: 100%!important;
}

.et_header_style_fullscreen ul#mobile_menu_slide li:first-child>a>span div.couleur-menu-2:before  {
  width: 55%!important;
}

.et_header_style_fullscreen ul#mobile_menu_slide li:first-child>a:hover:before{
  transform: perspective(500px) translateY(-95%) rotate(11deg) rotateY(-22deg) scale(1.05);
}

.et_pb_fullscreen_menu_active ul#mobile_menu_slide li:first-child>a.current-page:before{
  transform: perspective(500px) translateY(-95%) rotate(11deg) rotateY(-22deg) scale(1.05);
  border-color: transparent transparent #FFFFFF transparent;
}

/**/

/* Second menu */

.et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(2){
  background: #FFFFFF;
  box-shadow: 0px 0px 50px rgba(0,0,0,0.05);
}

.et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(2)>a:before {
  content: " ";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 40px 130px 80px;
  border-color: transparent transparent #ff6600 transparent;
  position: absolute;
  transform: perspective(0px) translateY(-65%) rotate(79deg) rotateY(0) rotateX(0) rotateZ(0) scale(1);
  left: 181px;
  top: 50%;
  z-index: 1;
  transition: all 0.4s ease;
  opacity: 1;
}

.et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(2)>a>span:first-child{
  position: relative;
}

.et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(2)>a>span div.couleur-menu-1:before {
  width: 100%!important;
}

.et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(2)>a>span div.couleur-menu-2:before  {
  width: 69%!important;
}

.et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(2)>a:hover:before{
  transform: perspective(0px) translateY(-86%) rotate(75deg) rotateY(0) rotateX(0) rotateZ(0) scale(1);
}

.et_pb_fullscreen_menu_active ul#mobile_menu_slide li:nth-child(2)>a.current-page:before{
  transform: perspective(0px) translateY(-86%) rotate(75deg) rotateY(0) rotateX(0) rotateZ(0) scale(1);
  border-color: transparent transparent #FFFFFF transparent;
}

/* Troisieme menu */

.et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(3){
  background: #FFFFFF;
  box-shadow: 0px 0px 50px rgba(0,0,0,0.05);
}

.et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(3)>a:before{
  content: " ";
  position: absolute;
  height: 115px;
  width: 115px;
  background-color: #ff6600;
  border-radius: 50%;
  left: 163px;
  top: 50%;
  transform: perspective(200px) translateY(-60%) rotate(0) rotateY(0) scale(1);
  transition: all 0.4s ease;
  opacity: 1;
}

.et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(3)>a>span:first-child{
  position: relative;
}

.et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(3)>a>span div.couleur-menu-1:before {
  width: 100%!important;
}

.et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(3)>a>span div.couleur-menu-2:before  {
  width: 60%!important;
}

.et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(3)>a:hover:before{
  transform: perspective(200px) translateY(-85%) rotate(0) rotateY(0) scale(1.03);
}

.et_pb_fullscreen_menu_active ul#mobile_menu_slide li:nth-child(3)>a.current-page:before{
  transform: perspective(200px) translateY(-85%) rotate(0) rotateY(0) scale(1.03);
  background-color: #FFFFFF;
}

/**/

.menu-bottom{
  position: absolute;
  bottom: 0;
  left: 0;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  padding: 20px;
  padding-left: 50px;
  padding-right: 50px;
  padding-bottom: 30px;
  font-size: 15px;
  flex-direction: row;
  justify-content: flex-start;
  color: #868686!important;
}

.menu-bottom a{
  font-size: 14px!important;
  color: rgba(255,255,255,0.3)!important;
  padding: 0px!important;
  transition: all 0.4s ease;
  padding-left: 4px!important;
  padding-right: 4px!important;
  color: #868686!important;
}

.menu-bottom-avant a{
  font-size: 17px!important;
  font-weight: 600!important;
}

.et_header_style_fullscreen ul#mobile_menu_slide li.current-page .menu-bottom{
  color: #FFFFFF!important;
}

.et_header_style_fullscreen ul#mobile_menu_slide li.current-page .menu-bottom a{
  color: #FFFFFF!important;
}

.menu-bottom span{
  color: #868686!important;
  flex-basis: 100%;
  text-align: left;
  padding-left: 4px!important;
  padding-right: 4px!important;
}

.et_header_style_fullscreen ul#mobile_menu_slide li.current-page .menu-bottom span{
  color: #FFFFFF!important;
}

/* .menu-bottom a.current-page{
  color: #ffffff!important;
} */

.menu-bottom a:hover{
  opacity: 0.8;
}

.et_pb_fullscreen_menu_active #logo{
  opacity: 0;
  visibility: hidden;
}

.et_pb_fullscreen_menu_active .logo_container > a{
  opacity: 0;
  visibility: hidden;
}

.et_header_style_fullscreen .et_slide_in_menu_container.et_pb_fullscreen_menu_opened{
  opacity: 1!important;
  visibility: visible;
  z-index: 99999!important;
}

@keyframes animTextMenu {
  0% {
    transform: translateY(40px);
    opacity: 0;
  }
  100% {
    transform: translateY(10px);
    opacity: 1;
  }
}

@keyframes animTextMenuRetour {
  0% {
    transform: translateY(10px);
    opacity: 1;
  }
  100% {
    transform: translateY(40px);
    opacity: 0;
  }
}

.mobile_menu_bar{
  display: block!important;
  width: 70px!important;
  height: 80px;
  background-color: #ff6600;
  padding-top: 35px;
  padding-bottom: 5px!important;
  text-align: center;
  border-bottom-left-radius: 25px;
  border-bottom-right-radius: 25px;
  transform: translateY(-10px);
  transition: all 0.3s ease;
  position: absolute;
  right: 35px;
  top: 0px;
  box-shadow: 0px 0px 2px rgba(255,255,255,0.6);
}

.mobile_menu_bar:hover,
body.et_pb_fullscreen_menu_active .mobile_menu_bar{
  transform: translateY(0);
}

body.et_pb_fullscreen_menu_active .mobile_menu_bar{
  transform: translateY(0);
  background-color: #ffe0cc;
  box-shadow: 0px 0px 2px rgba(255,255,255,0);
}

body.et_pb_fullscreen_menu_active .mobile_menu_bar:before{
  color: #FF6600;
}

body.et_pb_fullscreen_menu_active .mobile_menu_bar span{
  background-color: #FF6600;
}

.mobile_menu_bar:before{
  content: "Menu";
  font-family: 'Archivo', sans-serif!important;
  font-size: 13px;
  text-transform: uppercase;
  color: #FFFFFF;
  display: block;
  margin-bottom: 8px;
  font-weight: 600;
}

body.et_pb_fullscreen_menu_active .mobile_menu_bar:before{
  content: "Fermer";
}

.mobile_menu_bar span{
  display: block;
  width: 40%;
  height: 2px;
  background: #FFFFFF;
  margin: auto;
  transition: all 0.3s ease;
}

.mobile_menu_bar span:last-child{
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  transform: rotate(-25deg) translateY(0px);
}

body.et_pb_fullscreen_menu_active .mobile_menu_bar:hover span:first-child{
  transform: rotate(25deg) translateY(2px);
}

body.et_pb_fullscreen_menu_active .mobile_menu_bar:hover span:last-child{
  opacity: 1;
  visibility: visible;
}

/**/

/* Single page Général */

body #sidebar{
  display: none;
}

#main-content .container:before{
  display: none;
}

.single #main-content .container{
  width: 100%;
  max-width: 100%;
  padding-top: 0px!important;
  padding-bottom: 0px!important;
}

.single #left-area{
  width: 100%;
  padding-right: 0;
  padding-bottom: 0;
}

/**/

/* Loader home */


/**/

/* Home / projets */

#row-home-section-projets{
  width: 100%;
  max-width: 100%;
  overflow: hidden;
}

#row-home-section-projets .et_pb_column,
#row-home-section-projets .et_pb_module,
#row-home-section-projets .et_pb_code_inner{
  height: 100%;
}

#slider-projets{
  width: auto!important;
  height: 100%;
}

.slider-projets{
 height: 100%;
}

.slider-projets .sp-slides,
.slider-projets .sp-slides-container{
  height: 100%;
}

.slider-projets .projet-slide{

  height: 100%;
  position: relative;
  display: block;
  overflow: hidden;
  background-color: #2f2f2f;
}


.slider-projets .projet-slide:before{
  content: " ";
  background: linear-gradient(to bottom, rgba(0,0,0,0),rgba(0,0,0,0.6));
  width: 100%;
  height: 70%;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0.6;
  transition: all 0.3s ease;
  z-index: 1;
}

.slider-projets .img-projet{
  width: 100%;
  height: 100%;
}

.slider-projets .img-projet img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: all 0.5s linear;
  transform: scale(1);
  opacity: 0.9;
}

.slider-projets .projet-slide:hover .img-projet img{
  transform: scale(1.1);
  transition: all 3s linear;
}

.slider-projets .projet-slide:hover .loc-projet {
  transform: translateY(30px);
}

.slider-projets .infos-projet{
  position: absolute;
  max-width: 100%;
  width: 600px;
  bottom: 15%;
  padding-left: 35px;
  padding-right: 50px;
  transition: all 0.4s ease;
  z-index: 2;
  transform: translateY(0);
}

.slider-projets .title-projet{
  color: #FFF;
  font-size: 47px;
  line-height: 54px;
  font-weight: 600;
  width: 660px;
  max-width: 100%;
  transition: all 0.6s ease;
  margin-bottom: 8px;
  text-shadow: 5px 3px 15px rgba(0, 0, 0, 0);
  text-transform: uppercase;
}

.slider-projets .logo-projet{
  max-height: 200px;
  filter: invert(1);
  transition: all 0.6s ease;
  margin-bottom: 25px;
}

.slider-projets .cat-projet{
  color: #FFF;
  font-size: 19px;
  line-height: 27px;
  text-shadow: 5px 3px 15px rgba(0, 0, 0, 0);
  font-weight: 300;
  transition: all 0.6s ease;
  margin-top: 10px;
  transform: translateY(0);
}

.loc-projet{
  color: #FFF;
  font-size: 19px;
  line-height: 27px;
  text-shadow: 5px 3px 15px rgba(0, 0, 0, 0);
  font-weight: 500;
  transition: all 0.6s ease;
  margin-top: 10px;
  transform: translateY(0);
  position: relative;
  padding-left: 25px;
}

.text-entete .loc-projet{
  font-size: 30px;
  line-height: 34px;
  padding-left: 40px;
}

.loc-projet:before{
  content: "\e081";
  font-family: "ETmodules"!important;
  font-weight: 300;
  font-style: normal;
  font-variant: normal;
  position: absolute;
  left: 0px;
  top: 0px;
}

.slider-projets .text-projet{
  color: #FFF;
  font-size: 19px;
  line-height: 27px;
  margin-top: 0;
  margin-bottom: 0;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  text-shadow: 5px 3px 15px rgba(0, 0, 0, 0);
  max-height: 0;
  font-weight: 600;
  /* transform: translateY(300px); */
  max-width: 100%;
  width: 540px;
}

.slider-projets .projet-slide:hover .text-projet{
  opacity: 0;
  visibility: visible;
  max-height: 0px;
  margin-bottom: 0;
  margin-top: 20px;
  margin-bottom: 20px;
  animation: text-projet-home 0.4s ease-in 0.5s 1 both;
  transform: translateY(-40px);
}

.slider-projets .projet-slide:hover .cat-projet{
  transform: translateY(40px);
}

.slider-projets .projet-slide:hover .title-projet,.slider-projets .projet-slide:hover .logo-projet{
  transform: translateY(-40px);
}


@keyframes text-projet-home {
  0% {
    opacity: 0;
    visibility: visible;
  }
  100% {
    opacity: 1;
    visibility: visible;
  }
}

/* .slider-projets .sp-slide:hover .infos-projet{
  transform: translateY(-80px);
} */

.navigation-slide{
  position: absolute;
  bottom: 80px;
  width: 100%;
  z-index: 9999;
}

.navigation-slide div,
.navigation-slide a{
  position: absolute;
  display: block;
  padding: 10px;
  color: #FFFFFF;
  cursor: pointer;
  height: 45px;
  border-bottom-left-radius: 30px;
  border-top-left-radius: 30px;
  border-bottom-right-radius: 30px;
  border-top-right-radius: 30px;
  transition: all 0.3s ease;
  width: 45px;
  opacity: 0.3;
}

.navigation-slide .next:hover{
  width: 175px;
  background: rgba(44, 47, 51, 0.5);
  opacity: 1;
}

.navigation-slide .prev:hover{
  width: 190px;
  background: rgba(44, 47, 51, 0.5);
  opacity: 1;
}

.navigation-slide div:hover span,
.navigation-slide a:hover span{
  opacity: 1;
  visibility: visible;
}

.navigation-slide div span,
.navigation-slide a span{
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 15px;
  font-weight: 600;
  display: block;
}

.navigation-slide .next span{
  left: 20px;
  width: 120px;
}

.navigation-slide .prev span{
  right: 10px;
  width: 130px;
}

.navigation-slide .prev{
  left: 35px;
}

.navigation-slide .next{
  right: 35px;
  padding-right: 50px;
}

.navigation-slide .next:after{
  content: "\35";
  top: 0;
  right: 0;
  position: absolute;
  font-family: "ETmodules"!important;
  font-weight: 300;
  font-style: normal;
  font-variant: normal;
  color: #FFFFFF;
  font-size: 42px;
  line-height: 42px;
  display: inline-block;
  border-radius: 50%;
  border: 2px solid #FFF;
  background-color: transparent;
  transition: all 0.3s ease;
}

.navigation-slide .next:hover:after{
  background-color: #2c2f33;
}

.navigation-slide .prev:after{
  content: "\34";
  top: 0;
  left: -3px;
  position: absolute;
  font-family: "ETmodules"!important;
  font-weight: 300;
  font-style: normal;
  font-variant: normal;
  color: #FFFFFF;
  font-size: 42px;
  line-height: 42px;
  display: inline-block;
  border-radius: 50%;
  border: 2px solid #FFF;
  background-color: transparent;
  transition: all 0.3s ease;
}

.navigation-slide .prev:hover:after{
  background-color: #2c2f33;
}

/**/

/* Type Page projets */

.single-projets .et_pb_post,
.single-archives_projets .et_pb_post{
  margin-bottom: 0px;
}

.content-text{
  transition: all 0.1s ease;
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.projet-entete{
  width: 100%;
  height: 120vh;
  position: relative;
  background-color: #2a2a2a;
}

.projet-entete .image-entete{
  width: 100%;
  height: 100%;
  position: relative;
  animation: image-entete 0.4s ease-in 1s 1 both;
  opacity: 0;
  visibility: hidden;
}

.projet-entete .image-entete img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.8;
}

/* .projet-entete .image-entete:before {
  content: " ";
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  opacity: 0.4;
  transition: all 0.3s ease;
  z-index: 1;
} */

.projet-entete .text-entete{
  position: absolute;
  bottom: 30%;
  left: 35px;
  z-index: 2;
  opacity: 0;
  visibility: hidden;
  animation: text-entete 0.6s ease 2s 1 both;
}

.projet-entete .text-entete h1{
  font-weight: bold;
  font-size: 140px;
  line-height: 130px;
  color: #FFFFFF;
  margin-bottom: 20px;
  text-transform: uppercase;
}

.projet-entete .text-entete h2{
  font-weight: 300;
  font-size: 48px;
  line-height: 48px;
  color: #FFFFFF;
  margin-bottom: 10px;
}

.projet-entete .text-entete h2 span{
  display: block;
  margin-bottom: 15px;
}

@keyframes image-entete {
  0% {
    opacity: 0;
    visibility: hidden;
  }
  100% {
    opacity: 1;
    visibility: visible;
  }
}

@keyframes text-entete {
  0% {
    opacity: 0;
    visibility: hidden;
    bottom: 15%;
  }
  100% {
    opacity: 1;
    visibility: visible;
    bottom: 30%;
  }
}

.content-projet-logo-demande{
  display: flex;
  height: 100vh;
}

.content-projet-logo-demande .demande-client{
  flex-basis: 33%;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  max-width: 100%;
  flex-direction: row;
  flex-wrap: wrap;
}

.image-demande-client{
  flex-basis: 100%;
  height: 50%;
  background-color: #CCC;
  opacity: 0;
  transition: all 0.4s ease;
  position: relative;
}

.image-demande-client.anim{
  opacity: 1;
}

.image-demande-client img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content-projet-logo-demande .demande-client .text-demande-client{
  width: 480px;
  padding-bottom: 70px;
  padding-right: 70px;
  padding-left: 70px;
  max-width: 100%;
  text-align: left;
  font-size: 18px;
  line-height: 32px;
  color: #FFF;
  font-weight: 500;
  transition: all 0.4s ease;
  margin-top: 60px;
  align-self: flex-end;
}

.content-projet-logo-demande .demande-client .text-demande-client .cat-text{
  padding-bottom: 10px;
}

.content-projet-logo-demande .demande-client .text-demande-client .cat-text span{
  font-weight: 800;
  font-size: 22px;
  display: block;
}

.content-projet-logo-demande .demande-client.anim .text-demande-client{
  color: #000;
  margin-top: 0;
}

.content-projet-logo-demande .logo-client{
  flex-basis: 67%;
  max-width: 100%;
  background-color: #FFFFFF;
  padding-left: 40px;
  padding-right: 40px;
  padding-top: 150px;
  padding-bottom: 150px;
  text-align: center;
  transition: all 0.6s ease;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  opacity: 0;
}

.content-projet-logo-demande .logo-client img{
  max-height: 100%;
  max-width: 90%;
  object-fit: contain;
}

.content-projet-logo-demande .logo-client.anim{
  opacity: 1;
}

.content-projet-explications{
  display: flex;
  padding-top: 100px;
  padding-bottom: 100px;
  background: #171719;
  transition: all 0.6s ease;
  opacity: 0;
}

.content-projet-explications.anim{
  opacity: 1;
}

.content-projet-explications .content-text-explications{
  width: 1400px;
  max-width: 100%;
  padding-left: 70px;
  padding-right: 70px;
  margin: auto;
  color: #FFFFFF;
  font-size: 39px;
  line-height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  font-weight: 500;
  text-align: center;
  flex-wrap: wrap;
}

.content-projet-explications .content-text-explications p a{
  color: #FFFFFF;
  text-decoration: underline;
}

/* .content-text-explications:before {
  content: " ";
  position: absolute;
  height: 0;
  width: 325px;
  border-bottom: 250px solid #00b355;
  border-left: 15px solid transparent;
  border-right: 30px solid transparent;
  transform: perspective(500px) translateY(-50%) translateX(-20%) rotate(20deg) rotateY(-15deg);
  left: 0;
  top: 0;
  transition: all 1s ease;
  z-index: 1;
} */

.content-text-explications-para{
  flex-basis: 100%;
  position: relative;
  z-index: 2;
}

.link-projet{
  flex-basis: 100%;
  position: relative;
  margin-top: 150px;
}

.link-projet a:before {
  content: " ";
  position: absolute;
  height: 0;
  width: 110px;
  border-bottom: 60px solid #ff6600;
  border-left: 0px solid transparent;
  border-right: 20px solid transparent;
  transform: perspective(400px) translateX(-50%) translateY(0) rotate(5deg) rotateX(180deg);
  left: 50%;
  top: 0;
  transition: all 0.7s ease;
  z-index: 1;
}

.link-projet a span{
  position: relative;
  z-index: 2;
}

.link-projet a:hover:before{
  transform: perspective(400px) translateX(-50%) translateY(20px) rotate(10deg) rotateX(180deg);
}

.link-projet a{
  display: block;
  margin: auto;
  width: 300px;
  max-width: 100%;
  text-align: center;
  color: #FFFFFF;
  font-size: 30px;
  line-height: 36px;
  font-weight: 600;
  position: relative;
  z-index: 2;
  padding-top: 13px;
  /* transform: translateX(20%); */
}

.link-projet a span:last-child{
  display: block;
  font-size: 18px;
  line-height: 18px;
  padding-top: 20px;
  position: relative;
  z-index: 2;
}

.premier-mockup-graphique{
  width: 100%;
  opacity: 0;
  transition: all 0.4s ease-in;
  display: flex;
}

.premier-mockup-graphique.anim{
  opacity: 1;
}

.premier-mockup-graphique img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-design-de-marque-couleurs{
  width: 100%;
}

.container-section-design-de-marque-couleurs{
  padding-top: 170px;
  padding-bottom: 170px;
  width: 1700px;
  max-width: 100%;
  padding-left: 70px;
  padding-right: 70px;
  margin: auto;
  display: flex;
  flex-direction: row;
}

.couleurs-titre-desc{
  flex-basis: 35%;
  align-self: flex-end;
  position: relative;
  padding-right: 50px;
  padding-bottom: 40px;
}

.couleurs-titre-desc h2{
  font-size: 48px;
  margin-bottom: 40px;
  font-weight: 700;
  padding-bottom: 0px;
}

.couleurs-titre-desc p{
  font-size: 18px;
  line-height: 24px;
  margin-bottom: 0;
  font-weight: 500;
  color: #333;
}

.couleurs-blocs{
  flex-basis: 65%;
  width: 75%;
  display: flex;
  position: relative;
  padding-left: 65px;
  padding-right: 65px;
}

.couleurs-mask-blocs{
  width: 1100px;
  max-width: 100%;
  margin-left: auto;
}

.section-design-de-marque-couleurs .content-couleurs{
  display: flex;
  flex-direction: row;
  flex-basis: 300px;
  flex-wrap: wrap;
  padding: 15px;
}

.navigation-slide.couleurs .prev:after,
.navigation-slide.couleurs .next:after{
  color: #000;
  border: 2px solid transparent;
}

.navigation-slide.couleurs .prev:hover:after,
.navigation-slide.couleurs .next:hover:after{
  color: #efefef;
  border: 2px solid #efefef;
}

.navigation-slide.couleurs{
  top: 150px;
  width: 100%;
  max-width: 100%;
  left: 2px;
  margin-top: 0;
  z-index: 10000;
  height: 0;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  position: absolute;
}

.navigation-slide.couleurs.actif{
  opacity: 1;
  visibility: visible;
}

.slick-arrow{
  display: none!important;
}

.navigation-slide.couleurs .prev{
  left: 0;
}

.navigation-slide.couleurs .next{
  right: 0;
}

.navigation-slide.couleurs .prev span{
  width: 150px;
}

.navigation-slide.couleurs .prev:hover{
  width: 215px;
}

.navigation-slide.couleurs .next:hover{
  width: 195px;
}

.section-design-de-marque-couleurs .content-couleurs .bloc-couleur{
  flex-basis: 100%;
  height: 300px;
}

.section-design-de-marque-couleurs .content-couleurs .text-couleur{
  flex-basis: 100%;
  padding-left: 0;
  color: #333333;
  font-size: 18px;
  line-height: 30px;
  padding-top: 30px;
  padding-bottom: 10px;
  font-weight: 500;
}

.section-design-de-marque-typographies{
  width: 100%;
  background-color: #dcddde;
}

.container-section-design-de-marque-typographies{
  padding-top: 170px;
  padding-bottom: 170px;
  width: 1700px;
  max-width: 100%;
  padding-left: 70px;
  padding-right: 70px;
  margin: auto;
}

.container-section-design-de-marque-typographies h2{
  font-size: 48px;
  margin-bottom: 80px;
  font-weight: 700;
  padding-bottom: 0px;
}

.section-design-de-marque-typographies .content-typographies{
  display: flex;
  margin-bottom: 120px;
}

.section-design-de-marque-typographies .content-typographies:last-child{
  margin-bottom: 0;
}

.section-design-de-marque-typographies .content-typographies .bloc-typographie-description{
  flex-basis: 30%;
  align-self: center;
  padding-right: 80px;
}

.section-design-de-marque-typographies .content-typographies .bloc-typographie-description span{
  display: block;
  text-align: left;
  color: #333333;
}

.section-design-de-marque-typographies .content-typographies .bloc-typographie-description span:first-child{
  font-size: 22px;
  line-height: 35px;
  font-weight: 700;
}

.section-design-de-marque-typographies .content-typographies .bloc-typographie-description span:last-child{
  font-size: 18px;
  line-height: 35px;
  font-weight: 400;
}

.section-design-de-marque-typographies .content-typographies .image-typographie{
  flex-basis: 70%;
  padding-left: 0;
  padding-right: 40px;
  height: 100%;
}

.section-design-de-marque-typographies .content-typographies .image-typographie img{
  max-width: 100%;
}

.section-design-de-marque-double-mockups{
  display: flex;
  min-height: 50vh;
}

.section-design-de-marque-double-mockups img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-design-de-marque-double-mockups .gauche-mockup-graphique{
  flex-basis: 60%;
  background-color: #878787;
}

.section-design-de-marque-double-mockups .droite-mockup-graphique{
  flex-basis: 40%;
  background-color: #313036;
}

.section-design-de-marque-derniere{
  display: flex;
  padding-top: 50px;
  padding-bottom: 0px;
  position: relative;
}

.text-design-de-marque-derniere{
  flex-basis: 30%;
  max-width: 100%;
  padding-left: 125px;
  position: relative;
  z-index: 2;
  padding-top: 250px;
  transform: translateX(20%);
  color: #333333;
  font-size: 24px;
  line-height: 48px;
  font-weight: 500;
  text-align: left;
}

.text-design-de-marque-derniere p{
  width: 480px;
  max-width: 100%;
  margin-left: auto;
  position: relative;
  z-index: 2;
}

.text-design-de-marque-derniere p:before {
  content: " ";
  position: absolute;
  height: 277px;
  width: 277px;
  background-color: #ff6600;
  border-radius: 50%;
  left: 0;
  top: 0;
  transform: translateY(-63%) translateX(-54%);
  transition: all 1s ease;
  z-index: -1;
}

.image-design-de-marque-derniere{
  flex-basis: 70%;
  max-width: 100%;
}

.image-design-de-marque-derniere img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: relative;
  z-index: 1;
}

.dernier-mockup-graphique{
  width: 100%;
  opacity: 0;
  transition: all 0.4s ease-in;
}

.dernier-mockup-graphique.anim {
  opacity: 1;
}

.dernier-mockup-graphique img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.section-design-de-marque-hauteur{
  display: flex;
}

.image-design-de-marque-hauteur{
  flex-basis: 60%;
}

.image-design-de-marque-hauteur img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.text-design-de-marque-hauteur{
  flex-basis: 40%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #171719;
}

.text-design-de-marque-hauteur p{
  width: 480px;
  padding-top: 40px;
  padding-bottom: 40px!important;
  padding-left: 70px;
  padding-right: 70px;
  max-width: 100%;
  text-align: left;
  font-size: 24px;
  line-height: 40px;
  color: #FFF;
  font-weight: 500;
  transition: all 0.4s ease;
}

.section-design-digital{
  padding-top: 220px;
  padding-bottom: 220px;
}

.section-design-digital.fullwidth{
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
}

.section-design-digital.fullwidth video{
  object-fit: cover;
  height: 100%;
  width: 100%;
}

.computer-background {
  background-color: white;
  padding-top: 40px;
  padding-right: 40px;
  padding-left: 40px;
  height: auto;
  padding-bottom: 60px;
}

.computer-container {
	position: relative;
  /* margin-top: 100px; */
	/* transform: scale(0.8); */
}


.computer-monitor {
	margin: 0 auto;
  /* height: 100%; */
  height: auto;
  width: 1340px;
  max-width: 85%;
	background-color: #292929;
	border: 32px solid #292929;
	border-top-right-radius: 2rem;
	border-top-left-radius: 2rem;
  position: relative;
}

.computer-monitor video{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.computer-monitor img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.computer-bottom {
  position: relative;
  z-index: 1;
  box-shadow: 5px 5px 11px rgba(0,0,0,0.05);
  margin: 0 auto;
  border-bottom-right-radius: 2rem;
  border-bottom-left-radius: 2rem;
  width: 1340px;
  max-width: 85%;
  height: 120px;
  background: linear-gradient(to bottom left, #efefef, #b5b5b5);
}

.computer-stand {
	box-shadow: 5px 5px 11px rgba(0,0,0,0.25);
	position: relative;
	z-index: 0;
	margin: 0 auto;
	height: 75px;
	width: 300px;
	/* background-color: #EEEEEE; */
	clip-path: polygon(5% 0%, 95% 0%, 100% 100%, 0% 100%);
  background: linear-gradient(to top, #eeeeee, #b5b5b5);
}

.computer-stand-bottom {
	box-shadow: 5px 5px 11px rgba(0,0,0,0.25);
	margin: 0 auto;
	height: 25px;
	width: 350px;
	background-color: #F5F5F5;
	border-top-right-radius: 2rem;
	border-top-left-radius: 2rem;
}

.section-design-digital-double-mockups{
  display: flex;
  min-height: 140vh;
}

.section-design-digital-double-mockups .content-mockup-texte{
  display: flex;
  flex-basis: 40%;
  flex-direction: column;
  max-width: 100%;
}

.section-design-digital-double-mockups .content-mockup-texte .content-mockup-texte-img{
  height: 40%;
  background: #CCC;
  position: relative;
}

.section-design-digital-double-mockups .content-mockup-texte .content-mockup-texte-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.section-design-digital-double-mockups .content-mockup-texte .content-mockup-texte-para{
  height: 60%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #222224;
  padding-left: 20px;
  padding-right: 20px;
  max-width: 100%;
}

.section-design-digital-double-mockups .content-mockup-texte .content-mockup-texte-para p{
  width: 500px;
  max-width: 100%;
  text-align: left;
  font-size: 24px;
  line-height: 40px;
  color: #FFFFFF;
  font-weight: 500;
  padding-top: 40px;
  padding-bottom: 40px!important;
  padding-left: 30px;
  padding-right: 30px;
}

.section-design-digital-double-mockups .content-mockup-texte .content-mockup-texte-para p a{
  color: #FFFFFF;
  text-decoration: underline;
}

.section-design-digital-double-mockups .content-mockup-droite{
  flex-basis: 60%;
  max-width: 100%;
  background-color: #31313d;
}

.section-design-digital-double-mockups .content-mockup-droite img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-design-digital-derniere {
  display: flex;
  padding-top: 50px;
  padding-bottom: 50px;
  position: relative;
}

.text-design-digital-derniere {
  flex-basis: 50%;
  max-width: 100%;
  padding-left: 100px;
  position: relative;
  z-index: 2;
  padding-top: 250px;
  transform: translateX(20%);
  color: #333333;
  font-size: 22px;
  line-height: 42px;
  font-weight: 500;
  text-align: left;
}

.image-design-digital-derniere{
  /*flex-basis: 70%;*/
  width: 60%;
  text-align: right;
  padding-right: 0;
  transform: translateX(0);
  display: flex;
  align-items: center;
}

.text-design-digital-derniere p{
  width: 100%;
  max-width: 100%;
  margin-left: auto;
  position: relative;
  z-index: 2;
}

.text-design-digital-derniere p:before {
  content: " ";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 112px 275px 150px;
  border-color: transparent transparent #ff6600 transparent;
  position: absolute;
  transform: perspective(0px) translateY(-68%) translateX(-41%) rotate(77deg) rotateY(0) rotateX(0) rotateZ(0) scale(1);
  left: 0;
  top: 0;
  transition: all 1s ease;
  z-index: -1;
}

.dernier-mockup-digital {
  width: 100%;
  opacity: 0;
  transition: all 0.4s ease-in;
  position: relative;
}

.dernier-mockup-digital img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.dernier-mockup-digital.anim{
  opacity: 1;
}

.section-all-projets{
  position: relative;
  width: 100%;
}

a.link-all-projets {
  display: block;
  margin: auto;
  width: 300px;
  max-width: 100%;
  text-align: center;
  color: #FFFFFF;
  font-size: 28px;
  line-height: 34px;
  font-weight: 600;
  position: relative;
  z-index: 2;
  padding-top: 13px;
  position: absolute;
  bottom: 80px;
  left: 50%;
  transform: translateX(-50%);
}

a.link-all-projets span{
  position: relative;
  z-index: 2;
  transform: rotate(3deg);
  display: block;
  transition: all 0.7s ease;
}

/* a.link-all-projets:before {
  content: " ";
  position: absolute;
  height: 0;
  width: 110px;
  border-bottom: 60px solid #ff6600;
  border-left: 0px solid transparent;
  border-right: 20px solid transparent;
  transform: perspective(400px) translateX(-50%) translateY(0) rotate(5deg) rotateY(10deg) rotateX(180deg);
  left: 50%;
  top: 0;
  transition: all 0.7s ease;
  z-index: 1;
} */

a.link-all-projets:before {
  content: " ";
  position: absolute;
  height: 0;
  width: 245px;
  border-bottom: 70px solid #ff6600;
  border-left: 0px solid transparent;
  border-right: 15px solid transparent;
  transform: perspective(400px) translateX(-53%) translateY(-4px) rotate(185deg);
  left: 51%;
  top: 0px;
  transition: all 0.7s ease;
  z-index: 1;
}

a.link-all-projets:hover:before {
  transform: perspective(400px) translateX(-53%) translateY(-5px) rotate(175deg);
}

a.link-all-projets:hover span{
  transform: rotate(-3deg);
}

/* Section témoignage projets */

.content-projet-temoignage{
  padding-top: 140px;
  padding-bottom: 140px;
  opacity: 0;
  transition: all 0.3s ease;
  padding-left: 30px;
  padding-right: 30px;
}

.content-projet-temoignage.anim{
  opacity: 1;
}

.content-projet-temoignage .row-content-projet-temoignage{
  width: 1400px;
  max-width: 100%;
  margin: auto;
  font-size: 29px;
  line-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  font-weight: 500;
  text-align: center;
  flex-wrap: wrap;
  flex-direction: column;
}

.content-projet-temoignage .row-content-projet-temoignage .nom-projet-temoignage{
  font-weight: bold;
}

.content-projet-temoignage .row-content-projet-temoignage .fonction-projet-temoignage{
  font-size: 25px;
  line-height: 28px;
}

.content-infos-temoignage{
  position: relative;
  width: 100%;
  padding-top: 20px;
}

.content-projet-temoignage .apostrophe-content{
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 9;
}

.content-projet-temoignage .apostrophe-content:before{
  content: "''";
  font-family: 'Be Vietnam', sans-serif;
  font-weight: 300;
  font-style: normal;
  font-variant: normal;
  position: absolute;
  top: -40px;
  left: 0px;
  font-size: 200px;
  line-height: 150px;
  z-index: 1;
  height: 60px;
  transform: rotateY(180deg);
}

.content-projet-temoignage .apostrophe-content:after{
  content: "''";
  font-family: 'Be Vietnam', sans-serif;
  font-weight: 300;
  font-style: normal;
  font-variant: normal;
  position: absolute;
  bottom: -40px;
  right: 0px;
  font-size: 200px;
  line-height: 150px;
  height: 60px;
}

.content-projet-temoignage .text-projet-temoignage{
  position: relative;
  z-index: 99;
  padding-left: 120px;
  padding-right: 120px;
}

.content-projet-temoignage .text-projet-temoignage div.text{
  position: relative;
  z-index: 99;
}

.content-projet-temoignage .content-infos-temoignage{
  position: relative;
  z-index: 99;
}

.content-projet-temoignage h2 {
  font-size: 48px;
  margin-bottom: 40px;
  font-weight: 700;
  padding-bottom: 0px;
  text-align: center;
}

/**/

/* Page CONTACT */

#section-page-contact{
  height: auto!important;
  overflow: hidden;
  min-height: 100vh;
}

#row-page-contact{
  width: 100%;
  max-width: 100%;
  height: 100%;
}

#row-page-contact .et_pb_column{
  height: 100%;
}

.content-contact{
  display: flex;
  align-items: center;
  @media screen and (max-width: 1500px){
    align-items: stretch;
  }
}

.infos-contact{
  flex-basis: 67%;
  padding-left: 150px;
  padding-right: 100px;
  justify-content: flex-start;
  display: flex;
  align-items: flex-end;
  @media screen and (max-width: 1500px){
    padding-top: 80px;
    padding-bottom: 80px;
    padding-left: 80px;
  }
}

.content-infos{
  flex-basis: 40%;
  padding-right: 50px;
}

.contact-form{
  .form-row{
    display: flex;
    width: 100%;
    gap: 30px;
    margin-bottom: 15px;
    @media screen and (max-width: 980px){
      flex-wrap: wrap;
      margin-bottom: 0;
      gap: 0;
    }
    .form-input-group{
      flex: 1;
      @media screen and (max-width: 980px){
        flex: auto;
        width: 100%;
      }
      input, select, textarea{
        background: #FFFFFF;
        border: 0px;
        border-bottom: 2px solid #CCC;
        font-size: 17px;
        padding: 8px 0;
        width: 100%;
        &::placeholder{
          color: #565656;
        }
      }
    }

    &:has(.form-submit-group){
      justify-content: flex-end;
      @media screen and (max-width: 980px){
        justify-content: center;
      }
    }

    .form-submit-group{
      position: relative;
      p{
        position: relative;
        .wpcf7-spinner{
          position: absolute;
          left: -30px;
          transform: translate(-100%, -50%);
          top: 50%
        }
      }

      input[type="submit"]{
        position: relative;
        border: none;
        background: none;
        cursor: pointer;
        display: block;
        margin: auto;
        max-width: 100%;
        text-align: center;
        color: #333333 !important;
        font-size: 30px;
        line-height: 36px;
        font-weight: 600;
        z-index: 2;
        padding-top: 20px !important;
        background: transparent !important;
        height: auto;
        border: 0px !important;
      }
      &:before{
        content: " ";
        position: absolute;
        height: 0;
        width: 110px;
        border-bottom: 60px solid #ff6600;
        border-left: 0px solid transparent;
        border-right: 20px solid transparent;
        transform: perspective(400px) translateX(-50%) translateY(13px) rotate(5deg) rotateX(180deg);
        left: 50%;
        top: 0;
        transition: all 0.7s ease;
        z-index: -1;
      }
      &:hover:before{
        transform: perspective(400px) translateX(-50%) translateY(20px) rotate(10deg) rotateX(180deg);
      }
    }
  }
}

.newsletter-contact{
  flex-basis: 500px;
  max-width: 100%;
  padding-top: 50px;
}

.image-contact{
  flex-basis: 33%;
  height: 100vh;
  background-color: #2a2a2a;
  @media screen and (max-width: 1500px){
    height: auto;
  }
}

.image-contact img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.9;
}

.content-contact h1{
  position: relative;
  font-size: 50px;
  line-height: 50px;
  font-weight: 600;
  /* padding-top: 100px;
  padding-bottom: 100px; */
  /* margin-top: 50px; */
  margin-bottom: 50px;
}

/* .content-contact h1:before {
  content: " ";
  position: absolute;
  height: 240px;
  width: 240px;
  background-color: #00beef;
  border-radius: 50%;
  left: 90px;
  top: 50%;
  transform: perspective(200px) translateY(-60%) rotate(0) rotateY(0) scale(1);
  transition: all 1s ease;
  z-index: -1;
} */

.content-contact h3{
  font-size: 19px;
  font-weight: 600;
  color: #333;
  padding-bottom: 8px;
  margin-top: 10px;
}

.content-contact p > a{
  font-size: 17px;
  font-weight: normal;
  color: #333;
  transition: all 0.4s ease;
  padding-bottom: 3px;
  position: relative;
}

.content-contact p > a:before{
  content: " ";
  position: absolute;
  width: 100%;
  height: 1px;
  background: #333;
  left: 0px;
  bottom: 0px;
  transition: all 0.4s ease;
  opacity: 0;
}

.content-contact p > a.link-visible:before{
  opacity: 1;
}

.content-contact p > a:hover:before{
  opacity: 1;
}

.content-contact p{
  font-size: 17px;
  font-weight: normal;
  color: #333;
  padding-bottom: 20px!important;
}

.rs-contact{
  display: flex;
  margin-top: 5px;
}

.rs-header{
  display: flex;
  margin-top: 0;
  position: absolute;
  left: 43px;
  bottom: 90px;
  z-index: 999999;
}

.rs-contact a{
  display: block;
  margin-right: 5px;
  width: 30px;
  height: 30px;
  position: relative;
}

.rs-contact.rs-header a{
  display: block;
  margin-right: 8px!important;
  width: 30px;
  flex-basis: 30px;
  height: 30px;
  position: relative;
}

.rs-contact a:before{
  font-family: "ETmodules"!important;
  font-weight: 300;
  font-style: normal;
  font-variant: normal;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  color: #7f7f7f;
  font-size: 22px;
  transition: all 0.3s ease;
}

.rs-contact.rs-header a:before{
  color: #868686;
  font-size: 16px;
}

li.current-page .rs-contact.rs-header a:before{
  color: #FFFFFF;
}

li.current-page .rs-contact.rs-header a.rs-behance:before{
  filter: invert(0);
}

.rs-contact a:hover:before{
  opacity: 0.8;
}

.rs-contact a.rs-behance:hover:before{
  filter: invert(0);
}

.rs-contact a.rs-facebook:before{
  content: "\e093";
}

.rs-contact a.rs-youtube:before{
  content: "\e0a3";
}

.rs-contact a.rs-flickr:before{
  content: "\e0a6";
}

.rs-contact a.rs-pinterest:before{
  content: "\e095";
}

.rs-contact a.rs-linkedin:before{
  content: "\e09d";
}

.rs-contact a.rs-instagram:before{
  content: "\e09a";
}

.rs-contact a.rs-vimeo:before{
  content: "\e09c";
}

.rs-contact a.rs-behance:before{
  content: url("https://www.studiodefacto.com/wp-content/uploads/logo-behance.png");
  font-family: none!important;
  filter: invert(0.45);
}

.rs-contact.rs-header a.rs-behance:before{
  content: url("https://www.studiodefacto.com/wp-content/uploads/logo-behance-blanc.png");
  font-family: none!important;
  filter: invert(0.45);
  width: 22px;
  height: 16px;
  display: block;
  font-size: 0px;
}

.newsletter-contact .nf-form-cont{
  flex-basis: 525px;
  max-width: 100%;
}

.newsletter-contact .nf-form-content{
  padding: 0px;
}

.newsletter-contact .nf-form-content label{
  color: #333333;
  font-size: 17px;
  line-height: 20px;
  font-weight: 600;
}

.newsletter-contact .nf-before-form-content{
  margin-bottom: 5px;
}

.newsletter-contact .nf-form-content input[type="email"]{
  background: #FFFFFF;
  border: 0px;
  border-bottom: 2px solid #CCC;
  font-size: 17px;
  height: 30px;
  padding-left: 0px;
  padding-bottom: 5px;
  width: 85%;
}

.newsletter-contact .label-right .nf-field-description{
  margin-right: 0px;
  width: calc(100% - 50px)!important;
  font-weight: normal;
}

.newsletter-contact .label-right .nf-field-description p{
  font-size: 10px!important;
  line-height: 14px!important;
}

.newsletter-contact .label-right .nf-field-description a{
  font-size: 10px!important;
  line-height: 14px!important;
  text-decoration: underline;
}

.newsletter-contact .checkbox-container.label-right .field-wrap>div.nf-field-label{
  width: 50px!important;
  align-items: flex-start;
}

.newsletter-contact .bt-submit-newsletter{
  position: relative;
}

.newsletter-contact .nf-form-content input[type=button] {
  display: block;
  margin: auto;
  width: 300px;
  max-width: 100%;
  text-align: center;
  color: #333333!important;
  font-size: 30px;
  line-height: 36px;
  font-weight: 600;
  position: relative;
  z-index: 2;
  padding-top: 20px;
  background: transparent!important;
  height: auto;
  cursor: pointer;
  border: 0px!important;
}

.newsletter-contact .bt-submit-newsletter:before {
  content: " ";
  position: absolute;
  height: 0;
  width: 110px;
  border-bottom: 60px solid #ff6600;
  border-left: 0px solid transparent;
  border-right: 20px solid transparent;
  transform: perspective(400px) translateX(-50%) translateY(13px) rotate(5deg) rotateX(180deg);
  left: 50%;
  top: 0;
  transition: all 0.7s ease;
  z-index: -1;
}

.newsletter-contact .submit-container{
  margin-bottom: 0px!important;
}

.newsletter-contact .bt-submit-newsletter:hover:before {
  transform: perspective(400px) translateX(-50%) translateY(20px) rotate(10deg) rotateX(180deg);
}
/**/

/* Page archives */

.content-archives{
  padding-top: 120px;
  padding-bottom: 120px;
  padding-left: 90px;
  padding-right: 90px;
  width: 1920px;
  max-width: 100%;
  margin: auto;
  background: #FFFFFF;
}

.grid-projets{
  display: block;
  transition: all 0.6s ease;
  width: 100%;
  height: 100%;
  position: relative;
  padding-left: 15px;
}

.content-archives .overlay-loader,
.title-pages-speciales .overlay-loader{
  display: block;
  position: absolute;
  z-index: 999999999;
  background-color: #FFFFFF;
  opacity: 0.7;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: none;
}

.item-projet{
  width: calc(25% - 15px);
  padding: 5px;
  margin-bottom: 10px;
  /* padding: 0; */
  transition: all 0.4s ease-in;
  display: block;
  position: relative;
  opacity: 0;
  visibility: hidden;
  cursor: pointer;
}

.item-projet div.hover-projet{
  width: 100%;
  height: 100%;
  transition: all 0.3s ease;
  display: flex;
  left: 0;
  top: 0;
  position: absolute;
  background-color: rgba(0,0,0,0.4);
  opacity: 0;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.item-projet div.hover-projet span {
  margin: auto;
  width: 150px;
  max-width: 100%;
  text-align: center;
  color: #FFFFFF;
  font-size: 20px;
  line-height: 26px;
  font-weight: 600;
  position: relative;
  z-index: 2;
  cursor: pointer;
  transition: all 0.4s ease;
  display: block;
}

.item-projet div.hover-projet span:before {
  content: " ";
  position: absolute;
  height: 0;
  width: 300px;
  border-bottom: 200px solid #ff6600;
  border-left: 15px solid transparent;
  border-right: 30px solid transparent;
  transform: perspective(500px) translateY(-50%) translateX(-20%) rotate(15deg) scale(0.25);
  left: 0;
  top: 51%;
  transition: all 1s ease;
  z-index: -1;
}

.item-projet:hover div.hover-projet{
  opacity: 1;
}

.item-projet.disp-projet{
  opacity: 1;
  visibility: visible;
}

.item-projet img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.load-more-projets{
  margin: auto;
  width: 300px;
  max-width: 100%;
  text-align: center;
  color: #333333;
  font-size: 30px;
  line-height: 36px;
  font-weight: 600;
  position: relative;
  z-index: 2;
  padding-top: 20px;
  cursor: pointer;
  margin-top: 80px;
  transition: all 0.4s ease;
  display: none;
}

.load-more-projets:before{
  content: " ";
  position: absolute;
  height: 0;
  width: 110px;
  border-bottom: 60px solid #ff6600;
  border-left: 0px solid transparent;
  border-right: 20px solid transparent;
  transform: perspective(400px) translateX(-50%) translateY(0) rotate(5deg) rotateX(180deg);
  left: 50%;
  top: 0;
  transition: all 0.7s ease;
  z-index: -1;
}

.load-more-projets:hover:before{
  transform: perspective(400px) translateX(-50%) translateY(20px) rotate(10deg) rotateX(180deg);
}

/* Page projet single archives */

.single-avada_portfolio article{
  margin-bottom: 0px!important;
}

.content-projet-archives{
  display: flex;
  flex-wrap: wrap;
}

.title-archive{
  flex-basis: 67%;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 100%;
  background-color: #222224;
  padding-top: 80px;
  padding-bottom: 80px;
  color: #FFF;
  font-size: 24px;
  text-transform: uppercase;
  font-weight: bold;
  height: 60vh;
}

.title-archive img{
  width: 100%;
  max-width: 60%;
  max-height: 100%;
  object-fit: contain;
}

.content-text-archive h1{
  text-align: left;
  font-size: 54px;
  line-height: 54px;
  width: auto;
  max-width: 100%;
  text-transform: uppercase;
  font-weight: 800;
  color: #333;
  margin-bottom: 40px;
}

.content-text-archive h2{
  text-align: left;
  font-size: 30px;
  line-height: 30px;
  width: auto;
  max-width: 100%;
  text-transform: uppercase;
  font-weight: 800;
  color: #333;
  margin-bottom: 20px;
  margin-top: 20px!important;
  display: block;
}

.content-image-archives{
  flex-basis: 33%;
  max-width: 100%;
  width: 33%;
  text-align: center;
  transition: all 0.6s ease;
  background-color: #2a2a2a;
  height: 60vh;
}

.content-image-archives > div{
  height: 100%;
}

.content-image-archives img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.text-archive{
  flex-basis: 100%;
  padding-top: 150px;
  padding-bottom: 150px;
  padding-right: 90px;
  padding-left: 90px;
  margin: auto;
  background: #FFFFFF;
  color: #333333;
  font-size: 20px;
  line-height: 30px;
  display: flex;
  justify-content: center;
  max-width: 100%;
  flex-wrap: wrap;
}

.content-text-archive{
  max-width: 100%;
  position: relative;
  width: 1440px;
}

.content-text-archive p{
  position: relative;
  z-index: 2;
}

.content-text-archive a{
  pointer-events: auto;
  color: #ff6600!important;
  text-decoration: underline!important;
}

.content-text-archive strong{
  color: #ff6600!important;
}

.cat-and-link-projet{
  display: flex;
  align-items: center;
  max-width: 100%;
  position: relative;
  width: 1440px;
  margin-top: 20px;
}

.cat-archives{
  margin-top: 30px;
  flex-basis: 70%;
  padding-right: 30px;
}

.cat-archives span{
  display: inline-block;
  margin-right: 10px;
  padding: 0;
  background-color: #FFFFFF;
  color: #ff6600;
  border-radius: 5px;
  margin-top: 8px;
  font-weight: 600;
  font-size: 16px;
  text-align: center;
  position: relative;
}

.link-return-archives{
  flex-basis: 30%;
  display: flex;
  justify-content: center;
}

.link-return-archives a{
  margin: auto;
  width: 300px;
  max-width: 100%;
  text-align: center;
  color: #333;
  font-size: 30px;
  line-height: 36px;
  font-weight: 600;
  position: relative;
  z-index: 2;
  padding-top: 20px;
  cursor: pointer;
  transition: all 0.4s ease;
}

.link-return-archives a:before {
  content: " ";
  position: absolute;
  height: 0;
  width: 110px;
  border-bottom: 60px solid #ff6600;
  border-left: 0px solid transparent;
  border-right: 20px solid transparent;
  transform: perspective(400px) translateX(-50%) translateY(0) rotate(5deg) rotateX(180deg);
  left: 50%;
  top: 0;
  transition: all 0.7s ease;
  z-index: -1;
  cursor: pointer;
}

.link-return-archives a:hover:before {
  transform: perspective(400px) translateX(-50%) translateY(20px) rotate(10deg) rotateX(180deg);
}

.slider-avada,
.slider-avada .sp-mask,
.slider-avada .sp-slides-container,
.slider-avada .sp-slides,
.slider-avada .sp-slide,
.slider-avada .sp-image-container,
.slider-avada .sp-image{
  width: 100%!important;
  height: 100%!important;
}

.slider-avada .sp-image{
  width: 100%!important;
  height: 100%!important;
  opacity: 0.95;
}

.slider-avada .sp-slide, .slider-avada .swiper-slide,
.galerie-projet .sp-slide{
  cursor: pointer;
}

.slider-avada .sp-buttons, .slider-avada .swiper-pagination-bullet{
  position: absolute;
  bottom: 20px;
}

.slider-avada .sp-button, .slider-avada .swiper-pagination-bullet{
  width: 20px;
  height: 20px;
  background-color: rgba(0,0,0,0.4);
  border: 1px solid rgba(255, 102, 0, 0.3);
}

.slider-avada .sp-button.sp-selected-button, .slider-avada .swiper-pagination-bullet.swiper-pagination-bullet-active{
  background-color: #ff6600;
  border: 1px solid #ff6600;
}

.galerie{
  display: none;
}

.lg-backdrop{
  z-index: 999999!important;
  background-color: #FFF!important;
}

.lg-outer{
  z-index: 9999999!important;
}

.lg-toolbar{
  background-color: #ff6600!important;
}

.lg-toolbar .lg-icon,
#lg-counter{
  color: #FFF!important;
}

.lg-outer .lg-thumb{
  margin-left: auto;
  margin-right: auto;
}

.lg-outer .lg-thumb-outer {
  background-color: #FFFFFF!important;
}

.lg-outer .lg-thumb-item{
  border: 0px!important;
  opacity: 0.5!important;
  transition: all 0.3s ease!important;
}

.lg-outer .lg-thumb-item.active, .lg-outer .lg-thumb-item:hover{
  opacity: 1!important;
}

.lg-actions .lg-next, .lg-actions .lg-prev{
  background-color: rgba(255, 102, 0, 0.75)!important;
  color: #FFFFFF!important;
}

.lg-outer .lg-toogle-thumb{
  background: #FF6600!important;
  color: #FFFFFF!important;
}

/* PAGE Agence */

.section-page-agence{
  font-weight: bold;
  width: 100%;
  height: auto;
  max-width: 100%;
  opacity: 1;
}

.section-page-agence-video{
  width: 100%;
  height: 100vh;
  max-width: 100%!important;
  background-color: #FFFFFF;
}

body .section-page-agence-signature.et_pb_row{
  width: 100%;
  max-width: 100%!important;
  background-color: #ff6600;
  padding-top: 220px!important;
  padding-bottom: 220px!important;
}

.section-page-agence .et_pb_column,
.section-page-agence .et_pb_module,
.section-page-agence .et_pb_code_inner{
  width: 100%;
  height: 100%;
}

.section-page-agence-video .et_pb_column,
.section-page-agence-video .et_pb_module,
.section-page-agence-video .et_pb_code_inner{
  width: 100%;
  height: 100%;
}

.section-page-agence-video video{
  object-fit: cover;
  height: 100%;
  width: 100%;
}

.entete-agence-content{
  display: flex;
  background-color: #ff6600;
  width: 100%;
  height: 100vh;
  position: relative;
  z-index: 1;
  text-align: center;
  padding-top: 220px!important;
  padding-bottom: 220px!important;
}

.entete-agence-content .content-loader{
  color: #FFFFFF;
  left: 0;
  top: 0;
  transform: none;
  position: relative;
  margin: auto;
}

.entete-agence-content .content-loader .text > div:nth-child(1){
  font-size: 150px;
  line-height: 120px;
  margin-top: -10px;
  text-transform: unset;
}

.entete-agence-content .content-loader .text > div:nth-child(1) sup{
  bottom: 0.4em;
  font-size: 74%;
}

.entete-agence-content .content-loader .text > div:nth-child(2){
  font-size: 100px;
  line-height: 120px;
  margin-top: -10px;
}

.entete-agence-content .content-loader .description{
  width: 950px;
  max-width: 100%;
  font-size: 50px;
  line-height: 63px;
  font-weight: 300;
  margin-top: 80px;
  opacity: 0;
  animation: topText 0.5s ease 2s 1 both;
  color: #FFFFFF;
}

.entete-agence-content .content-loader .description sup{
  bottom: .4em;
  font-size: 90%;
}

.signature-content{
  display: flex;
  flex-direction: column;
  align-items: center;
}

.signature-content .image-signature {
  margin-bottom: 0;
  max-width: 80%;
  -webkit-transform: rotateX(-100deg);
          transform: rotateX(-100deg);
  -webkit-transform-origin: top;
          transform-origin: top;
          opacity: 0;
}

.signature-content .image-signature.image-2 {
  margin-top: 10px;
  margin-left: 15px;
}

.signature-content .image-signature.image-3 {
  margin-top: -30px;
  margin-left: -35px;
}

.signature-content .image-signature.image-4 {
  margin-left: -30px;
}

.signature-content .image-signature.image-1.anim {
  -webkit-animation: swing-in-top-fwd 1.5s 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
  	        animation: swing-in-top-fwd 1.5s 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
}

.signature-content .image-signature.image-2.anim {
  -webkit-animation: swing-in-top-fwd 2s 1s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
  	        animation: swing-in-top-fwd 1.5s 1s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
}

.signature-content .image-signature.image-3.anim {
  -webkit-animation: swing-in-top-fwd 2s 1s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
  	        animation: swing-in-top-fwd 2s 1s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
}

.signature-content .image-signature.image-4.anim {
  -webkit-animation: swing-in-top-fwd 2s 1s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
  	        animation: swing-in-top-fwd 2s 1s cubic-bezier(0.175, 0.885, 0.320, 1.275) both;
}

/* Animation signature image 1 */
@-webkit-keyframes swing-in-top-fwd {
  0% {
    -webkit-transform: rotateX(-100deg);
            transform: rotateX(-100deg);
    -webkit-transform-origin: top;
            transform-origin: top;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg);
            transform: rotateX(0deg);
    -webkit-transform-origin: top;
            transform-origin: top;
    opacity: 1;
  }
}
@keyframes swing-in-top-fwd {
  0% {
    -webkit-transform: rotateX(-100deg);
            transform: rotateX(-100deg);
    -webkit-transform-origin: top;
            transform-origin: top;
    opacity: 0;
  }
  100% {
    -webkit-transform: rotateX(0deg);
            transform: rotateX(0deg);
    -webkit-transform-origin: top;
            transform-origin: top;
    opacity: 1;
  }
}


/* Animation signature image 2 */


.section-page-agence-expertise{
  width: 100%;
  max-width: 100%!important;
}

.section-content-expertise{
  display: flex;
  min-height: 920px;
}

.bloc-text-expertise{
  flex-basis: 70%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}

.title-expertise{
  flex-basis: 35%;
  background-color: #ff6600;
  position: relative;
  overflow: hidden;
}

.title-expertise h2 {
  position: absolute;
  transform: rotate(-90deg) translateX(-100%);
  transform-origin: left top;
  color: #FFFFFF;
  top: -15px;
  left: 20%;
  font-size: 125px;
  line-height: 125px;
  text-transform: uppercase;
  font-weight: 900;
}

.title-expertise h2 span:first-child{
  padding-right: 30px;
}

.content-desc-design-marque{
  display: flex;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top left;
  justify-content: flex-start;
  font-size: 20px;
  line-height: 30px;
  color: #000000;
  position: relative;
  flex-basis: 1440px;
  max-width: 100%;
}

.bloc-image-design-marque{
  flex-basis: 42%;
}

.bloc-text-design-marque{
  flex-basis: 58%;
  position: relative;
  padding-right: 100px;
  padding-left: 0;
  padding-top: 180px;
  padding-bottom: 180px;
}

.bloc-text-design-marque h2{
  font-size: 48px;
  line-height: 35px;
  font-weight: 600;
  margin-bottom: 40px;
}

.bloc-text-design-marque p{
  width: 600px;
  max-width: 100%;
  font-size: 20px;
  line-height: 40px;
  font-weight: 300;
}

.bloc-text-design-marque p.categorie{
  font-weight: 600;
}

.content-desc-design-digital{
  display: flex;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: top right;
  justify-content: flex-start;
  font-size: 20px;
  line-height: 30px;
  color: #000000;
  position: relative;
  flex-basis: 1440px;
  max-width: 100%;
  margin-left: auto;
  overflow: hidden;
}

.bloc-image-design-digital{
  flex-basis: 70%;
}

.bloc-image-design-digital img{
  margin-top: 55px;
}

.bloc-text-design-digital{
  flex-basis: 60%;
  position: relative;
  padding-left: 140px;
  padding-top: 70px;
  padding-bottom: 180px;
  text-align: left;
}

.bloc-text-design-digital h2{
  font-size: 48px;
  line-height: 35px;
  font-weight: 600;
  margin-bottom: 40px;
}

.bloc-text-design-digital p{
  width: 500px;
  max-width: 100%;
  font-size: 20px;
  line-height: 40px;
  font-weight: 300;
}

.bloc-text-design-digital p.categorie{
  font-weight: 600;
}

.section-page-agence-talents{
  width: 100%;
  max-width: 100%!important;
}

.section-content-talents{
  display: flex;
}

.title-talents {
  flex-basis: 35%;
  background-color: #ff6600;
  position: relative;
  overflow: hidden;
}

.title-talents h2 {
  position: absolute;
  transform: rotate(-90deg) translateX(-100%);
  transform-origin: left top;
  color: #FFFFFF;
  top: 0px;
  left: 20%;
  font-size: 125px;
  line-height: 125px;
  text-transform: uppercase;
  font-weight: 900;
}

.title-talents h2 span:first-child {
  padding-right: 30px;
}

/* Agence equipe */

.bloc-talents{
  flex-basis: 65%;
}

.liste-talents-corps{
  position: relative;
  width: 100%;
  height: 75vh;
}

.talent-corps-animal{
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  overflow: hidden;
}

.talent-corps-animal.current{
  opacity: 1;
  visibility: visible;
}

.talent-corps-animal .image-animal{
  height: 100%;
  display: flex;
  align-items: flex-end;
}

.talent-corps-animal .image-animal img{
  max-height: 100%;
}

.talent-corps-animal .text-animal{
  position: absolute;
  bottom: 0;
  right: 0;
  background: rgba(247, 247, 247, 0.7);
  opacity: 0;
  transform: translateX(120%);
  transition: all 0.2s ease-in;
  width: 525px;
  text-align: center;
  right: 30px;
  bottom: 30px;
}

.bloc-text-animal{
  padding: 30px;
  position: relative;
  z-index: 1;
}

.p-chinois{
  padding: 30px 20px 20px 20px;
  background-color: #ff6600;
  color: #ffffff;
  display: block;
  position: relative;
  left: 0;
  bottom: 0;
  z-index: 10;
  width: 100%;
  z-index: 0;
  display: none;
  text-align: left;
}

.p-chinois h2{
  font-size: 22px!important;
  line-height: 22px!important;
  font-weight: 800!important;
  color: #ff6600!important;
  text-align: center;
  padding: 8px!important;
  background: #FFF;
  margin-bottom: 10px;
}

.p-chinois h3{
  font-size: 16px!important;
  line-height: 20px!important;
  font-weight: 500!important;
  color: #FFFFFF!important;
  padding-bottom: 0px!important;
}

.p-chinois h3:last-child strong{
  padding-bottom: 0px!important;
}

.p-chinois h3 strong{
  font-size: 16px!important;
  line-height: 18px!important;
  font-weight: 800!important;
  color: #FFFFFF!important;
  padding-top: 8px;
  display: inline-block;
}

.p-chinois h3 em{
  font-size: 13px!important;
  line-height: 13px!important;
  font-weight: 500!important;
  color: #FFFFFF!important;
  padding-bottom: 8px!important;
}

.open-chinois{
  position: absolute;
  width: 38px;
  height: 38px;
  background: #FF6600;
  border: 2px solid #FF6600;
  left: 50%;
  transform: translateX(-50%);
  border-radius: 50%;
  color: #FFFFFF;
  transition: all 0.3s ease;
  /* top: 0px; */
  bottom : -19px;
  z-index: 1000;
}

.open-chinois:hover,
.open-chinois.open{
  color: #FF6600;
  background: #FFFFFF;
}

.open-chinois.open{
  color: #FF6600;
  background: #FFFFFF;
}

.open-chinois:before{
  /* content: "\32"; */
  content: "\4c";
  font-family: "ETmodules"!important;
  font-weight: 600;
  font-style: normal;
  font-variant: normal;
  border-radius: 50%;
  position: absolute;
  font-size: 34px;
  line-height: 28px;
  cursor: pointer;
  pointer-events: visible;
  left: 50%;
  top: 50%;
  transform: rotate(0deg) translateX(-53%) translateY(-50%);
  transition: transform 0.3s ease;
  transform-origin: left top;
}

.open-chinois.open:before{
  /* transform: rotate(-180deg) translateX(-53%) translateY(-50%); */
    content: "\4b";
}

.talent-corps-animal.current .text-animal{
  opacity: 1;
  transform: translateX(0);
  transition: all 0.3s ease-out;
}

.text-animal h2{
  font-size: 28px;
  line-height: 26px;
  font-weight: 800;
  text-transform: uppercase;
  color: #333;
  padding-bottom: 4px;
}

.text-animal h3{
  font-size: 20px;
  line-height: 20px;
  font-weight: 600;
  color: #353535;
  padding-bottom: 15px;
  font-weight: 400;
}

.text-animal p{
  font-size: 19px;
  line-height: 21px;
  font-weight: 300;
  font-style: italic;
  color: #717171;
}

.liste-talents-tete{
  display: flex;
  justify-content: start;
  align-items: center;
/*  height: 25vh;*/
  background-color: #dcdcdc;
  padding: 10px;
  flex-wrap: wrap;
}

.image-tete-animal{
  opacity: 0.3;
  transition: all 0.3s ease;
  margin-left: 2%;
  margin-right: 2%;
  cursor: pointer;
  pointer-events: visible;
  flex-basis: calc(20% - 4%);
  text-align: center;
/*  height: 36%;*/
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.image-tete-animal img{
/*  max-height: 100%;*/
  width: 90px;
  height: 90px;
}

.image-tete-animal.current{
  opacity: 1;
}

.section-page-agence-clients{
  width: 100%;
  max-width: 100%!important;
  background-color: #FFFFFF;
}

/* .section-page-agence-clients h2{
  position: relative;
  margin-top: 250px;
  margin-bottom: 60px;
  text-align: center;
}

.section-page-agence-clients h2 span:first-child{
  color: rgba(255,255,255,0.1);
  font-size: 250px;
  line-height: 250px;
  font-weight: 800;
}

.section-page-agence-clients h2 span:last-child{
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
  color: #FFFFFF;
} */

.title-clients{
  background-color: #ff6600;
  text-align: center;
  padding-top: 220px!important;
  padding-bottom: 220px!important;
}

.title-clients img{
  max-width: 80%;
}

.liste-clients-agence{
  width: 1900px;
  margin: auto;
  max-width: 100%;
  padding-left: 30px;
  padding-right: 30px;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 150px;
  margin-top: 150px;
}

.liste-clients-agence .ligne-clients{
  display: flex;
  flex-wrap: wrap;
  flex-basis: 100%;
  transform: translateY(160px);
  opacity: 0;
  transition: all 0.6s ease;
}

.liste-clients-agence .ligne-clients.anim{
  transform: translateY(0);
  opacity: 1;
}

.liste-clients-agence .bloc-client{
  flex-basis: 22%;
  max-height: 180px;
  margin-left: 1.5%;
  margin-right: 1.5%;
  margin-bottom: 40px;
  margin-top: 40px;
  padding: 15px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  position: relative;
}

.liste-clients-agence .bloc-client img{
  height: 100%;
  max-width: 80%;
  object-fit: contain;
}
.liste-clients-agence .bloc-client span{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  transition: 0.5s all;
  text-align: center;
  color: #FFFFFF;
  font-size: 20px;
  line-height: 26px;
  font-weight: 600;
  z-index: 2;
  cursor: pointer;
}
.liste-clients-agence .bloc-client:hover span{
  opacity: 1;
}
.liste-clients-agence .bloc-client span:before {
  content: " ";
  position: absolute;
  height: 0;
  width: 450px;
  border-bottom: 200px solid #ff6600;
  border-left: 15px solid transparent;
  border-right: 30px solid transparent;
  transform: perspective(500px) translateY(-50%) translateX(-40%) rotate(0deg) scale(0.25);
  left: 0;
  top: 51%;
  transition: all 0.8s ease;
  z-index: -1;
}
.liste-clients-agence .bloc-client:hover  span:before {
  transform: perspective(500px) translateY(-50%) translateX(-40%) rotate(9deg) scale(0.25);
}

.text-contact-clients-agence{
  width: 1640px;
  margin: auto;
  max-width: 100%;
  padding-left: 30px;
  padding-right: 30px;
  display: flex;
  flex-wrap: wrap;
  margin-top: 120px;
  margin-bottom: 120px;
  color: #FFFFFF;
  font-size: 125px;
  line-height: 140px;
  display: block;
  font-weight: 800;
  text-align: center;
  transition: all 0.3s ease;
  opacity: 1;
}

.text-contact-clients-agence:hover{
  opacity: 0.8;
}

.section-page-agence-partenaires{
  width: 100%;
  max-width: 100%!important;
  background-color: #FFFFFF;
}

.title-partenaires{
  flex-basis: 100%;
}

.section-page-agence-partenaires .title-partenaires h1{
  position: relative;
  margin-top: 180px;
  margin-bottom: 40px;
  text-align: left;
}

.section-page-agence-partenaires .title-partenaires h1 span:first-child{
  color: #FF6600;
  font-size: 90px;
  line-height: 90px;
  font-weight: 600;
}

.liste-partenaires-agence{
  width: 100%;
  margin: auto;
  max-width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.liste-partenaires-agence .bloc-partenaire{
  flex-basis: 100%;
  margin-top: 50px;
  margin-bottom: 50px;
  display: flex;
}

.liste-partenaires-agence .bloc-partenaire .image-badge{
  flex-basis: 25%;
  text-align: center;
}

.liste-partenaires-agence .bloc-partenaire .content-title-text{
  flex-basis: 75%;
  padding-left: 40px;
}

.liste-partenaires-agence .bloc-partenaire h2{
  color: #333;
  font-weight: bold;
  font-size: 35px;
}

.liste-partenaires-agence .bloc-partenaire p{
  color: #333;
  font-size: 18px;
  line-height: 28px;
}

.liste-partenaires-agence .bloc-partenaire a{
  width: 170px;
  max-width: 100%;
  text-align: left;
  color: #FFF;
  font-size: 30px;
  line-height: 36px;
  font-weight: 600;
  position: relative;
  z-index: 2;
  padding-top: 20px;
  cursor: pointer;
  transition: all 0.4s ease;
  margin-top: 40px;
  display: block;
}

.liste-partenaires-agence .bloc-partenaire a span{
  transform: rotate(4deg);
  display: block;
  transition: all 0.7s ease;
}

.liste-partenaires-agence .bloc-partenaire a:hover span{
  transform: rotate(-2deg);
}

.liste-partenaires-agence .bloc-partenaire a:before {
  content: " ";
  position: absolute;
  height: 0;
  width: 180px;
  border-bottom: 63px solid #ff6600;
  border-left: 0px solid transparent;
  border-right: 11px solid transparent;
  transform: perspective(400px) translateX(-53%) translateY(-4px) rotate(185deg);
  left: 47%;
  top: 9px;
  transition: all 0.7s ease;
  z-index: -1;
}

.bloc-partenaire a:hover:before {
  transform: perspective(400px) translateX(-53%) translateY(-5px) rotate(175deg);
}

.navigation-slide.projets-inside{
  position: fixed;
  bottom: 70px;
  z-index: 99998;
  height: 0;
}

.navigation-slide.projets-inside .prev:after,
.navigation-slide.projets-inside .next:after{
  background-color: #2c2f33;
}

.navigation-slide.projets-inside .prev{
  left: 35px;
}

.navigation-slide.projets-inside .next{
  right: 35px;
}

body .section-page-agence-temoignages.et_pb_row{
  width: 100%;
  max-width: 100%!important;
  background-color: #FFFFFF;
  padding-top: 0!important;
  padding-bottom: 0!important;
}

.content-temoignages{
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 40px;
  height: auto;
  padding-top: 120px;
  position: relative;
  text-align: center;
}

.content-temoignages:before{
  content: "“";
  color: #FF6600;
  font-size: 250px;
  line-height: 200px;
  text-align: center;
  width: auto;
  font-weight: 800;
  display: block;
  position: absolute;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
}

.slider-temoignages{
  padding-top: 95px;
  padding-bottom: 95px;
}

.text-temoignages{
  color: #696a6a;
  font-size: 17px;
  line-height: 32px;
}

.nom-temoignages{
  font-size: 21px;
  line-height: 22px;
  color: #333;
  font-weight: bold;
  margin-top: 30px;
}

.client-temoignages{
  font-size: 17px;
  line-height: 22px;
  color: #ff6600;
  font-weight: 500;
  margin-top: 8px;
}

.slider-bouton-temoignages{
  position: absolute;
  width: 100px;
  height: 30px;
  margin: auto;
  bottom: 75px;
  left: 50%;
  transform: translateX(-50%);
}

.slider-bouton-temoignages div.prev{
  position: absolute;
  left: 0;
  width: 20px;
  height: 20px;
  cursor: pointer;
}

.slider-bouton-temoignages div.next{
  position: absolute;
  right: 0;
  width: 20px;
  height: 20px;
  cursor: pointer;
}

.slider-bouton-temoignages div.prev:after {
  content: "\34";
  top: 0;
  left: 0;
  position: absolute;
  font-family: "ETmodules"!important;
  font-weight: 300;
  font-style: normal;
  font-variant: normal;
  color: #333;
  font-size: 42px;
  line-height: 42px;
  display: inline-block;
  border-radius: 50%;
  background-color: transparent;
  transition: all 0.3s ease;
}

.slider-bouton-temoignages div.next:after {
  content: "\35";
  top: 0;
  right: 0;
  position: absolute;
  font-family: "ETmodules"!important;
  font-weight: 300;
  font-style: normal;
  font-variant: normal;
  color: #333;
  font-size: 42px;
  line-height: 42px;
  display: inline-block;
  border-radius: 50%;
  background-color: transparent;
  transition: all 0.3s ease;
}

.bt-resp-text-temoignages{
  display: none;
  cursor: pointer;
}

body .section-page-agence-contact.et_pb_row{
  width: 100%;
  max-width: 100%!important;
  background-color: #ff6600;
  padding-top: 0!important;
  padding-bottom: 0!important;
}

.bloc-temoignages-resp{
  position: fixed;
  z-index: 10;
  background: #FFFFFF;
  width: 100%;
  height: 100vh;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  padding: 30px;
}

.content-temoignages-resp{
  padding: 30px;
  background: #f5f5f5;
  width: 100%;
  text-align: center;
}

.content-t .text-temoignages{
  display: block;
}

body.error404 #main-content .container{
  background-image: url("https://www.studiodefacto.com/wp-content/uploads/background-erreur-404.jpg")!important;
  background-repeat: no-repeat!important;
  background-size: cover!important;
  width: 100%!important;
  max-width: 100%!important;
  height: 100vh!important;
  background-position: top right;
}

body.error404 #main-content .container:after{
  content: " ";
  background-color: rgba(255,255,255,0.5);
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
  left: 0;
  top: 0;
  display: block;
}

.page-404-message{
  margin-top: 60px;
  padding: 40px;
  width: 980px;
  max-width: 100%;
  position: relative;
  z-index: 2;
}

.message-404{
  color: #ff6600;
  font-size: 30px;
}

.page-404-message h1{
  color: #ff6600;
  font-size: 220px;
  font-weight: 600;
  margin-top: 20px;
  margin-bottom: 40px;
}

.page-404-message h2{
  color: #333333;
  font-size: 45px;
  line-height: 50px;
}

.section-content-pages-speciales{
  width: 1540px;
  margin: auto;
  max-width: 100%;
  padding-left: 90px;
  padding-right: 70px;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 100px;
  justify-content: center;
}

.title-pages-speciales{
  width: 100%;
  max-width: 100%;
}

.title-pages-speciales h1{
  color: #FF6600;
  font-size: 90px;
  line-height: 90px;
  font-weight: 800;
  position: relative;
  margin-top: 180px;
  margin-bottom: 40px;
  text-align: left;
}

.title-pages-speciales h3 {
  color: #ff6600;
  font-size: 25px;
  line-height: 28px;
  font-weight: 800;
  padding-top: 10px;
}

.title-pages-speciales p {
  color: #333;
  font-size: 18px;
  line-height: 28px;
}

.title-pages-speciales ul {
  color: #333;
  font-size: 18px;
  line-height: 28px;
}

.title-pages-speciales ul a{
  color: #333;
}

.liste-blog{
  display: flex;
  flex-wrap: wrap;
}

.liste-blog .item-blog{
  flex-basis: 100%;
  margin-bottom: 30px;
  margin-top: 40px;
  display: flex;
}

.liste-blog .item-blog .image-blog{
  flex-basis: 30%;
  height: 215px;
  background: #ff6600;
}

.liste-blog .item-blog .image-blog img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.liste-blog .item-blog .infos-blog{
  padding-left: 30px;
  flex-basis: 70%;
}

.liste-blog .item-blog .infos-blog h2{
  color: #FF6600;
  font-size: 26px;
  line-height: 30px;
  font-weight: 600;
  position: relative;
  text-align: left;
  margin-top: 0px;
  margin-bottom: 5px;
  padding-bottom: 0;
}

.liste-blog .item-blog .infos-blog .date-blog{
  color: #333;
  font-size: 16px;
  line-height: 22px;
  margin-bottom: 10px;
  font-weight: 700;
}

.liste-blog .item-blog .infos-blog .text-blog{
  color: #333;
  font-size: 18px;
  line-height: 28px;
}

.lire-suite-blog {
  width: 160px;
  max-width: 100%;
  text-align: left;
  color: #333;
  font-size: 17px;
  line-height: 22px;
  font-weight: 600;
  position: relative;
  z-index: 2;
  cursor: pointer;
  transition: all 0.4s ease;
  margin-top: 12px;
  display: block;
  padding-left: 0;
}

.load-more-actus{
  margin: auto;
  width: 300px;
  max-width: 100%;
  text-align: center;
  color: #333333;
  font-size: 30px;
  line-height: 36px;
  font-weight: 600;
  position: relative;
  z-index: 2;
  padding-top: 20px;
  padding-bottom: 40px;
  cursor: pointer;
  margin-top: 30px;
  transition: all 0.4s ease;
}

.load-more-actus:before {
  content: " ";
  position: absolute;
  height: 0;
  width: 110px;
  border-bottom: 60px solid #ff6600;
  border-left: 0px solid transparent;
  border-right: 20px solid transparent;
  transform: perspective(400px) translateX(-50%) translateY(0) rotate(5deg) rotateX(180deg);
  left: 50%;
  top: 0;
  transition: all 0.7s ease;
  z-index: -1;
}

.load-more-actus:hover:before {
  transform: perspective(400px) translateX(-50%) translateY(20px) rotate(10deg) rotateX(180deg);
}

.title-pages-speciales .single-post-content h1{
  margin-bottom: 0;
  font-size: 45px;
  line-height: 50px;
}

.image-blog-single{
  padding-left: 20px;
  padding-bottom: 20px;
  text-align: center;
  max-width: 30%;
  float: right;
}

.date-blog-single {
  color: #333;
  font-size: 23px;
  line-height: 28px;
  margin-bottom: 50px;
  font-weight: 700;
}

.infos-blog-single .text-blog{
  color: #333;
  font-size: 19px;
  line-height: 28px;
}

.infos-blog-single .text-blog a,
.infos-blog-single .text-blog strong{
  color: #ff6600;
}

.category-arviches-articles .infos-blog-single .text-blog a{
  pointer-events: none;
}

.link-return-actus {
  margin: auto;
  width: 300px;
  max-width: 100%;
  text-align: center;
  color: #333;
  font-size: 30px;
  line-height: 36px;
  font-weight: 600;
  position: relative;
  z-index: 2;
  padding-top: 20px;
  margin: auto;
  margin-top: 50px;
  cursor: pointer;
  transition: all 0.4s ease;
  display: block;
}

.link-return-actus:before {
  content: " ";
  position: absolute;
  height: 0;
  width: 110px;
  border-bottom: 60px solid #ff6600;
  border-left: 0px solid transparent;
  border-right: 20px solid transparent;
  transform: perspective(400px) translateX(-50%) translateY(0) rotate(5deg) rotateX(180deg);
  left: 50%;
  top: 0;
  transition: all 0.7s ease;
  z-index: -1;
  cursor: pointer;
}

/* Page recrutement */

.title-portfolio{
  line-height: 20px!important;
  font-size: 20px!important;
  margin-bottom: 10px!important;
}

.title-portfolio:before{
  content: " ";
  background-image: url(https://www.studiodefacto.com/wp-content/uploads/2017/12/file.png);
  background-position: center center;
  background-size: 20px;
  background-repeat: no-repeat;
  width: 20px;
  height: 20px;
  display: inline-block;
  padding-right: 15px;
}

.title-infos-personne{
  line-height: 20px!important;
  font-size: 20px!important;
}

.title-infos-personne:before{
  content: " ";
  background-image: url("https://www.studiodefacto.com/wp-content/uploads/user.png");
  background-position: center center;
  background-size: 20px;
  background-repeat: no-repeat;
  width: 20px;
  height: 20px;
  display: inline-block;
  padding-right: 15px;
}

.title-infos-poste{
  line-height: 20px!important;
  font-size: 20px!important;
}

.title-infos-poste:before{
  content: " ";
  background-image: url("https://www.studiodefacto.com/wp-content/uploads/briefcase.png");
  background-position: center center;
  background-size: 20px;
  background-repeat: no-repeat;
  width: 20px;
  height: 20px;
  display: inline-block;
  padding-right: 15px;
}

.title-infos-document{
  line-height: 20px!important;
  font-size: 20px!important;
}

.title-infos-document:before{
  content: " ";
  background-image: url("https://www.studiodefacto.com/wp-content/uploads/file.png");
  background-position: center center;
  background-size: 20px;
  background-repeat: no-repeat;
  width: 20px;
  height: 20px;
  display: inline-block;
  padding-right: 15px;
}


.recrutement-page-titre-defacto p{
  margin: 0!important;
  position: relative;
  font-size: 20px!important;
  text-align: center;
  color: #333;
  color: #676767;
}

.recrutement-page-titre-defacto p strong{
  font-weight: bold!important;
  color: #000;
}

.recrutement-paragraphe p{
  font-size: 18px;
  line-height: 24px;
  margin-top: 9px;
  margin-bottom: 12px;
}

.content-tab-recrut h2{
  margin: 0!important;
  position: relative;
  padding-left: 50px;
  font-size: 26px!important;
}

.content-tab-recrut h2:before{
  content: " ";
  position: absolute;
  width: 40px;
  height: 3px;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  background-color: #000;
}

.content-tab-recrut{
  width: 100%;
  margin-top: 50px;
}

.tab-recrut{
  width: 100%;
  max-width: 100%;
  border: 0px!important;
}

.tab-recrut td{
  border: 0px!important;
}

label .portfolio-note{
  font-size: 12px;
}

.portfolio-note{
  width: 100%;
  display: block;
  margin: auto;
  text-align: center;
  font-style: italic;
  padding-top: 0px;
  font-size: 13px;
  padding: 10px;
  display: block;
  padding: 7px;
  margin-top: 45px;
}

.tab-recrut input[type="text"],
.tab-recrut input[type="tel"],
.tab-recrut input[type="email"],
.tab-recrut select{
  width: 100%;
  height: 49px!important;
  background-color: #f7f7f7!important;
  font-size: 18px;
}

.tab-recrut select{
  width: 100%;
  height: 49px!important;
  background-color: #f7f7f7!important;
  font-size: 18px;
  border: 0px!important;
}

.tab-recrut p{
  margin-bottom: 0!important;
}

.tab-recrut td {
  display: inline-block;
  width: 50%;
  padding: 7px!important;
}

.tab-recrut td.full{
  width: 100%;
}

.tab-recrut input[type='file'] {
  position: absolute;
  margin-top: 3px;
  margin-left: 3px;
  height: 1px;
  width: 1px;
  z-index: -5;
  display: none;
}

.tab-recrut input {
  border: 0!important;
  padding: 15px!important;
  padding-bottom: 12px!important;
}

.tab-recrut h3{
  margin-bottom: 5px;
  margin-top: 5px;
  color: #333!important;
  font-weight: 600!important;
}

.tab-recrut input::placeholder {
  color: #4a4a4a;
}

.tab-recrut a {
  color: #ff6600;
}

#label-cv:before, #label-motivation:before{
  content: " ";
  background-image: url("https://www.studiodefacto.com/wp-content/uploads/upload.png");
  background-repeat: no-repeat;
  background-size: 20px;
  width: 20px;
  height: 20px;
  display: block;
  position: absolute;
  left: 15px;
}

#label-cv, #label-motivation {
  background-color: #f7f7f7;
  padding: 15px;
  margin-top: 15px!important;
  display: block;
  text-align: left;
  padding-left: 50px!important;
  position: relative;
  font-size: 14px;
}

.submit-candidature{
  display: block;
  margin: auto;
  width: 300px;
  max-width: 100%;
  text-align: center;
  color: #FFFFFF;
  font-size: 28px;
  line-height: 34px;
  font-weight: 600;
  z-index: 2;
  padding-top: 13px;
  position: relative;
  margin-top: 50px;
  cursor: pointer;
}

.submit-candidature:before {
  content: " ";
  position: absolute;
  height: 0;
  width: 250px;
  border-bottom: 70px solid #ff6600;
  border-left: 0px solid transparent;
  border-right: 15px solid transparent;
  transform: perspective(400px) translateX(-50%) translateY(-4px) rotate(5deg) rotateY(0deg) rotateX(18deg) rotateX(180deg);
  left: 44%;
  top: 8px;
  transition: all 0.7s ease;
  z-index: -1;
}

.submit-candidature input{
  background: none;
  color: #FFFFFF;
  font-size: 20px!important;
  line-height: 26px!important;
  font-weight: 600;
  display: block;
  transform: rotate(4deg);
  cursor: pointer;
}

/* Plan du site */

.wsp-pages-list{
  display: flex;
  flex-direction: row;
  list-style: none;
  flex-wrap: wrap;
  padding: 0!important;
}

.wsp-pages-list li.page_item{
  flex-basis: 32%;
  background-color: #FFFFFF;
  margin: 0.5%;
  border: 2px solid #ff6600;
  transition: all .3s ease;
  display: flex;
  flex-direction: row;
  align-items: center;
  font-size: 24px;
  font-weight: 500;
}

.wsp-pages-list li.page_item a{
  width: 100%;
  padding: 15px;
  color: #ff6600;
  text-align: center;
  transition: all .3s ease;
}

.wsp-pages-list li.page_item:hover{
  background-color: #ff6600;
}

.wsp-pages-list li.page_item:hover a{
  color: #fff;
}

.wsp-pages-title{
  display: none;
}

div.wpcf7-mail-sent-ok{
  border: 2px solid #ff6600;
  background: #FF6600;
  color: #FFF;
  font-weight: 800;
  text-align: center;
  padding: 10px;
}

.moove-gdpr-modal-left-content{
  background-color: #ff6600!important;
}

#moove_gdpr_cookie_modal .moove-gdpr-modal-content .moove-gdpr-modal-left-content #moove-gdpr-menu li.menu-item-selected a,
#moove_gdpr_cookie_modal .moove-gdpr-modal-content .moove-gdpr-modal-left-content #moove-gdpr-menu li.menu-item-selected button,
#moove_gdpr_cookie_modal .moove-gdpr-modal-content .moove-gdpr-modal-left-content #moove-gdpr-menu li:hover button{
  color: #000!important;
}

.grecaptcha-badge{
  display: none!important;
}

.mouse-agence{
  position: absolute;
  left: 50%;
  bottom: 50px;
  transform: translateX(-50%);
  border-radius: 20px;
  border: 2px solid #FF6600;
  width: 30px;
  height: 45px;
  cursor: pointer;
}

.mouse-agence:before{
  content: " ";
  position: absolute;
  left: 50%;
  top: 8px;
  transform: translateX(-50%);
  border-radius: 20px;
  background-color: #FF6600;
  width: 3px;
  height: 8px;
}

/* Media Queries RESPONSIVE*/

@media screen and (max-width: 1500px) {
  .computer-background {
    background-color: white;
    padding-top: 40px;
    padding-right: 40px;
    padding-left: 40px;
    height: 1200px;
    padding-bottom: 60px;
  }

  .slider-projets .title-projet{
    font-size: 42px;
    line-height: 44px;
  }

  .liste-blog .item-blog .image-blog{
    flex-basis: 35%;
  }

  .liste-blog .item-blog .infos-blog {
    flex-basis: 65%;
  }

  /* Header + menu */

  .menu-bottom{
    padding-left: 45px;
    padding-right: 30px;
    padding-bottom: 30px;
  }

  .rs-header{
    bottom: 90px;
    left: 38px;
  }

  .slider-projets .infos-projet{
    padding-left: 25px;
    padding-right: 25px;
    top: 50%;
  }

  .projet-entete .text-entete h1 {
    font-size: 95px;
    line-height: 86px;
  }

  .container-section-design-de-marque-couleurs{
    padding-top: 100px;
    padding-bottom: 100px;
  }

  .text-design-de-marque-derniere,
  .text-design-digital-derniere{
    padding-top: 180px;
    padding-bottom: 80px;
    transform: translateX(0%);
    padding-right: 60px;
  }

  .image-design-de-marque-derniere img{
    object-fit: contain;
  }

  .section-content-expertise{
    min-height: 950px;
  }

  .bloc-text-design-marque{
    padding-right: 80px;
    padding-bottom: 80px;
    padding-top: 140px;
  }

  .bloc-text-design-digital{
    padding-left: 80px;
    padding-bottom: 150px;
  }

  .entete-agence-content .content-loader .description{
    margin-top: 40px;
    width: auto;
  }

  .section-page-agence-clients h2{
    margin-bottom: 20px;
  }

  .bloc-text-design-marque p,
  .bloc-text-design-digital p{
    width: auto;
  }

  .liste-talents-corps{
    height: 70vh;
  }

  .liste-talents-tete {
    height: 33vh;
  }

  .title-talents h2,
  .title-expertise h2{
    font-size: 90px;
    line-height: 90px;
  }

  .section-design-de-marque-couleurs .content-couleurs .bloc-couleur{
    height: 200px;
  }

  .navigation-slide.couleurs{
    top: 100px;
  }

  .section-design-de-marque-couleurs .content-couleurs{
    padding: 10px;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a span:last-child{
    width: 75%;
  }

  .slider-projets .text-projet{
    font-size: 18px;
    line-height: 26px;
  }
}

@media screen and (max-width: 1440px) {
  .computer-background {
    background-color: white;
    padding-top: 40px;
    padding-right: 40px;
    padding-left: 40px;
    height: 1000px;
    padding-bottom: 60px;
  }

  .slider-projets .text-projet{
    font-size: 17px;
    line-height: 26px;
  }

  .slider-projets .sp-slide:hover .cat-projet {
    transform: translateY(50px);
  }
}

@media screen and (max-width: 1200px) {
  .computer-background {
    background-color: white;
    padding-top: 40px;
    padding-right: 40px;
    padding-left: 40px;
    height: 1000px;
    padding-bottom: 60px;
  }

  .image-blog-single{
    max-width: 45%;
  }

  .content-image-archives{
    flex-basis: 45%;
  }

  .title-archive{
    flex-basis: 55%;
  }

  .text-archive{
    padding-top: 75px;
    padding-bottom: 75px;
    padding-right: 60px;
    padding-left: 45px;
  }

  body.error404 #main-content .container:after{
    background-color: rgba(255,255,255,0.6);
  }

  /* Header + menu */
  .et_header_style_fullscreen ul#mobile_menu_slide li>a{
    padding-left: 30px;
  }

  .et_pb_fullscreen_menu_active ul#mobile_menu_slide li:first-child>a:before{
    left: 124px;
  }

  .et_pb_fullscreen_menu_active ul#mobile_menu_slide li:nth-child(2)>a:before{
    left: 163px;
  }

  .et_pb_fullscreen_menu_active ul#mobile_menu_slide li:nth-child(3)>a:before{
    left: 145px;
  }

  .rs-header {
    left: 14px;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a span:last-child {
    font-size: 15px;
    line-height: 22px;
  }

  .menu-bottom a{
    font-size: 13px!important;
  }

  .menu-bottom{
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
  }

  .projet-entete .text-entete h1 {
    font-size: 75px;
    line-height: 70px;
    margin-bottom: 10px;
  }

  .projet-entete .text-entete h2 span{
    margin-bottom: 5px;
  }

  .infos-contact{
    padding-left: 50px;
    padding-right: 50px;
    padding-bottom: 5%;
    padding-top: 5%;
  }

  .newsletter-contact{
    flex-basis: 100%;
    padding-left: 0;
  }

  .content-archives{
    padding-left: 50px;
    padding-right: 50px;
  }

  .item-projet{
    width: calc(25% - 15px)
  }

  .bloc-image-design-digital{
    align-self: center;
  }


  .bloc-text-design-marque{
    padding-right: 50px;
    padding-bottom: 50px;
  }

  .bloc-text-design-digital{
    padding-left: 50px;
    padding-bottom: 100px;
  }

  .bloc-text-design-marque p,
  .bloc-text-design-digital p{
    font-size: 18px;
    line-height: 36px;
  }

  .entete-agence-content .content-loader{
    left: 0;
  }

  .liste-clients-agence .bloc-client{
    height: 250px;
  }

  .slider-projets .infos-projet{
    top: 40%;
  }

  .slider-projets .sp-slide:hover .text-projet{
    margin-bottom: 20px;
  }

  .section-design-de-marque-couleurs .content-couleurs .bloc-couleur{
    height: 150px;
  }

  .navigation-slide.couleurs{
    top: 75px;
  }

  .section-design-de-marque-couleurs .content-couleurs .text-couleur{
    font-size: 15px;
    line-height: 26px;
  }

  .content-projet-logo-demande .demande-client.anim .text-demande-client{
    width: 440px;
  }

  .content-projet-explications{
    padding-top: 150px;
    padding-bottom: 150px;
  }

  .link-projet{
    margin-top: 75px;
  }

  .content-projet-explications .content-text-explications{
    font-size: 29px;
    line-height: 46px;
  }

  .text-design-de-marque-derniere,
  .text-design-digital-derniere{
    padding-top: 180px;
    padding-bottom: 80px;
    transform: translateX(0);
    padding-right: 60px;
  }

  .text-design-de-marque-derniere p:before{
    transform: translateY(-63%) translateX(-30%);
  }

  .text-design-digital-derniere p:before{
    transform: perspective(0px) translateY(-68%) translateX(-20%) rotate(77deg) rotateY(0) rotateX(0) rotateZ(0) scale(1);
  }
}

@media screen and (max-width: 1190px) {
  .computer-background {
    background-color: white;
    padding-top: 40px;
    padding-right: 40px;
    padding-left: 40px;
    height: 900px;
    padding-bottom: 60px;
  }

  .slider-projets .sp-slide:hover .cat-projet{
    transform: translateY(60px);
  }

}

@media screen and (max-width: 980px) {
  .computer-background {
    background-color: white;
    padding-top: 40px;
    padding-right: 40px;
    padding-left: 40px;
    height: 1000px;
    /* padding-bottom: 60px; */
  }

  .mouse-agence{
    display: none;
  }

  .image-demande-client{
    height: 400px;
  }

  .slider-projets .title-projet {
    font-size: 80px;
    line-height: 80px;
  }

  .image-blog-single{
    max-width: 100%;
    width: 100%;
    padding-left: 0px;
  }

  .liste-blog .item-blog{
    flex-wrap: wrap;
    margin-top: 0;
    margin-bottom: 45px;
  }

  .liste-blog .item-blog .image-blog{
    flex-basis: 100%;
    height: auto;
    margin-bottom: 30px;
  }

  .liste-blog .item-blog .infos-blog {
    flex-basis: 100%;
    padding-left: 0px;
  }

  .section-content-pages-speciales{
    padding-left: 50px;
    padding-right: 50px;
    margin-bottom: 70px;
  }

  .title-talents h2,
  .title-expertise h2{
    display: none;
  }

  .slider-projets .sp-slide:hover .title-projet,
  .slider-projets .sp-slide:hover .cat-projet{
    transform: translateY(0px);
  }

  .open-chinois{
    display: none;
    pointer-events: none;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a:hover>span:first-child, .et_header_style_fullscreen ul#mobile_menu_slide li>a.current-page>span:first-child{
    transform: translateY(0px);
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a>span:first-child{
    padding-bottom: 0px;
    /* font-size: 70px;
    line-height: 70px; */
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a>span:first-child:after{
    display: none;
  }

  .section-design-de-marque-couleurs .content-couleurs .text-couleur{
    padding-top: 15px;
  }

  .section-page-agence{
    height: auto;
  }

  .entete-agence-content .content-loader{
    left: 0;
  }

  .entete-agence-content .content-loader .description{
    font-size: 26px;
    line-height: 36px;
  }

  .entete-agence-content .content-loader{
    top: 0;
    position: relative;
    transform: none;
  }

  .entete-agence-content{
    height: 50vh;
    padding-top: 80px!important;
    padding-bottom: 60px!important;
  }

  .title-clients {
    background-color: #ff6600;
    text-align: center;
    padding-top: 80px!important;
    padding-bottom: 60px!important;
  }

  /* Header + menu */

  .et_header_style_left .logo_container > a{
    margin-left: 15px;
    margin-top: 20px;
  }

  .projet-entete .text-entete{
    left: 0;
    width: 100%;
    padding-left: 20px;
    padding-right: 20px;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide{
    flex-wrap: wrap;
    height: 100vh;
    padding-top: 0px;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li{
    flex-basis: 100%;
    height: 33.3333%;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a{
    padding-left: 20px;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a>div{
    justify-content: center;
  }

  .menu-bottom{
    justify-content: flex-start;
    padding-bottom: 12px;
    padding-left: 16px;
  }

  .menu-bottom a{
    font-size: 15px!important;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a span:last-child{
    display: none;
  }

  /**/

  .et_header_style_fullscreen ul#mobile_menu_slide li:first-child>a:before,
  .et_header_style_fullscreen ul#mobile_menu_slide li:first-child>a:hover:before,
  .et_pb_fullscreen_menu_active ul#mobile_menu_slide li:first-child>a.current-page:before {
    transform: perspective(500px) translateY(-47%) rotate(11deg) rotateY(-22deg) scale(1.05);
    left: 115px;
  }

  /**/

  .et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(2)>a:before,
  .et_pb_fullscreen_menu_active ul#mobile_menu_slide li:nth-child(2)>a:hover:before,
  .et_pb_fullscreen_menu_active ul#mobile_menu_slide li:nth-child(2)>a.current-page:before {
    transform: perspective(0px) translateY(-52%) rotate(79deg) rotateY(0) rotateX(0) rotateZ(0) scale(1);
    left: 155px;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(3)>a:before,
  .et_pb_fullscreen_menu_active ul#mobile_menu_slide li:nth-child(3)>a:hover:before,
  .et_pb_fullscreen_menu_active ul#mobile_menu_slide li:nth-child(3)>a.current-page:before{
    transform: perspective(200px) translateY(-52%) rotate(0) rotateY(0) scale(1);
    left: 133px;
  }

  .rs-header{
    left: 10px;
    bottom: 60px;
  }

  #logo{
    padding-left: 0px;
  }

  .mobile_menu_bar{
    right: 20px;
    transform: translateY(0);
    height: 60px;
    padding-top: 20px;
    width: 60px!important;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
  }

  .mobile_menu_bar:before{
    font-size: 11px;
  }

  .projet-entete .text-entete h1{
    font-size: 65px;
    line-height: 60px;
  }

  .projet-entete .text-entete h2{
    font-size: 45px;
    line-height: 45px;
  }

  .content-projet-logo-demande{
    flex-wrap: wrap;
    flex-direction: column-reverse;
    height: auto;
  }

  .content-projet-logo-demande .demande-client.anim .text-demande-client{
    padding-top: 75px;
    padding-bottom: 75px;
    width: auto;
  }

  .content-projet-logo-demande .logo-client{
    padding-top: 100px;
    padding-bottom: 100px;
    height: 50vh;
  }

  .section-design-de-marque-typographies .content-typographies .image-typographie{
    padding-left: 40px;
  }

  .section-design-de-marque-derniere,
  .section-design-digital-derniere{
    flex-wrap: wrap;
    flex-direction: column;
    padding-left: 60px;
    padding-right: 30px;
    overflow: hidden;
  }

  .image-design-de-marque-derniere{
    flex-basis: 100%;
  }

  .image-design-de-marque-derniere img{
    max-width: 100%;
  }

  .text-design-de-marque-derniere,
  .text-design-digital-derniere{
    padding-top: 120px;
    text-align: left;
    flex-basis: 100%;
    transform: translateX(0);
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 30px;
  }

  .text-design-de-marque-derniere p,
  .text-design-digital-derniere p{
    margin-left: auto;
    margin-right: auto;
  }

  .text-design-de-marque-derniere p:before {
    transform: translateY(-50%) translateX(-52%);
  }

  .dernier-mockup-digital{
    position: relative;
  }

  .dernier-mockup-digital:before{
    content: "";
    background: linear-gradient(to bottom, rgba(0,0,0,0),rgba(0,0,0,0.5));
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 70%;
  }

  .computer-bottom{
    height: 100px;
  }

  .computer-stand{
    width: 250px;
  }

  .computer-stand-bottom{
    width: 300px;
  }

  .text-design-digital-derniere p:before{
    transform: perspective(0px) translateY(-55%) translateX(-25%) rotate(77deg) rotateY(0) rotateX(0) rotateZ(0) scale(1);
  }

  .container-section-design-de-marque-typographies{
    padding-top: 100px;
    padding-bottom: 100px;
  }

  .section-design-digital-double-mockups .content-mockup-texte{
    flex-basis: 50%;
  }

  .section-design-digital-double-mockups .content-mockup-droite{
    flex-basis: 50%;
  }

  .section-design-digital-double-mockups .content-mockup-texte .content-mockup-texte-para p{
    width: 100%;
  }

  .section-design-digital{
    padding-top: 100px;
    padding-bottom: 100px;
  }

  .section-design-de-marque-hauteur{
    flex-wrap: wrap;
  }

  .image-design-de-marque-hauteur{
    flex-basis: 100%;
  }

  .text-design-de-marque-hauteur{
    flex-basis: 100%;
    padding-top: 90px;
    padding-bottom: 90px;
  }

  .text-design-de-marque-hauteur p{
    width: 100%;
    font-size: 20px;
    line-height: 34px;
    text-align: left;
    padding-right: 50px;
  }

  .navigation-slide div span,
  .navigation-slide a span{
    display: none!important;
  }

  .navigation-slide div,
  .navigation-slide div:hover,
  .navigation-slide a,
  .navigation-slide a:hover{
    width: 45px!important;
    padding: 0px!important;
  }

  .navigation-slide.couleurs div{
    background-color: transparent!important;
    opacity: 1!important;
  }

  /* .navigation-slide.couleurs div:after{
    background-color: #FFFFFF!important;
  } */

  .slider-projets .sp-slide .infos-projet{
    top: auto;
    bottom: 160px;
  }

  .slider-projets .sp-slide .text-projet{
    display: none;
  }

  .navigation-slide.projets{
    width: 100%;
    transform: translateX(-50%);
    left: 50%;
    bottom: 120px;
  }

  .projet-entete{
    height: 110vh;
  }

  .content-contact{
    flex-wrap: wrap;
  }

  .image-contact{
    flex-basis: 100%;
    height: 30vh;
    min-height: auto;
  }

  .infos-contact{
    flex-basis: 100%;
    padding-top: 50px;
  }

  .item-projet{
    width: calc(50% - 15px);
  }

  .title-archive{
    flex-basis: 100%;
    order: 2;
    height: 30vh;
    padding-top: 50px;
    padding-bottom: 50px;
  }

  .content-image-archives{
    flex-basis: 100%;
    order: 1;
    height: calc(60vh - 70px);
  }

  .content-image-archives > div{
    height: 100%;
  }

  .content-image-archives img{
    width: 100%;
    height: 100%;
    max-height: initial;
    object-fit: cover;
  }

  .text-archive{
    order: 3;
  }

  .title-archive h1{
    padding-top: 80px;
    padding-bottom: 80px;
  }

  .cat-and-link-projet{
    flex-wrap: wrap;
  }

  .cat-archives,
  .link-return-archives{
    flex-basis: 100%;
    padding-right: 0px;
  }

  .link-return-archives a{
    margin-top: 80px;
  }

  .text-archive{
    padding-bottom: 80px;
  }

  .section-content-expertise{
    min-height: auto;
    flex-wrap: wrap-reverse;
  }

  .bloc-text-expertise,
  .title-expertise{
    flex-basis: 100%;
  }

  .title-expertise h2{
    position: relative;
    padding-top: 50px;
    padding-bottom: 50px;
    padding-left: 50px;
    padding-right: 50px;
    transform: rotate(0) translateX(0);
    left: 0;
    top: 0;
    font-size: 40px;
    line-height: 40px;
    text-align: center;
  }

  .bloc-image-design-marque,
  .bloc-image-design-digital{
    display: block;
    position: absolute;
    height: 100%;
    opacity: 0.1;
    top: 0;
    z-index: 0;
  }

  .bloc-image-design-marque{
    left: 0;
  }

  .bloc-image-design-digital{
    right: 0;
  }

  .bloc-image-design-marque img,
  .bloc-image-design-digital img{
    height: 100%;
  }

  .bloc-text-design-marque{
    flex-basis: 100%;
    padding: 50px;
    padding-top: 70px;
    padding-left: 60px;
    padding-bottom: 25px;
    position: relative;
    z-index: 1;
  }

  .bloc-text-design-digital{
    flex-basis: 100%;
    padding: 50px;
    padding-top: 70px;
    padding-left: 60px;
    padding-top: 25px;
    text-align: left;
    position: relative;
    z-index: 1;
  }

  body .section-page-agence-signature.et_pb_row{
    padding-top: 90px!important;
    padding-bottom: 90px!important;
  }

  .section-content-talents{
    min-height: auto;
    flex-wrap: wrap;
  }

  .title-talents,
  .bloc-talents{
    flex-basis: 100%;
  }

  .talent-corps-animal .image-animal img{
    height: auto;
  }

  .title-talents h2{
    position: relative;
    padding-top: 50px;
    padding-bottom: 50px;
    padding-left: 50px;
    padding-right: 50px;
    transform: rotate(0) translateX(0);
    left: 0;
    top: 0;
    font-size: 40px;
    line-height: 40px;
    text-align: center;
    display: none;
  }

  .title-expertise h2 span:first-child{
    padding-right: 15px;
  }

  .title-talents h2 span:first-child{
    padding-right: 15px;
  }

  .section-page-agence-video{
    height: 50vh;
  }

  .section-page-agence-clients h2{
    margin-top: 100px;
  }

  .section-page-agence-clients h2 span:first-child {
    font-size: 190px;
    line-height: 190px;
  }

  .entete-agence-content .content-loader .text > div:nth-child(2){
    font-size: 75px;
    line-height: 100px;
    margin-top: -10px;
  }

  .text-contact-clients-agence {
    font-size: 100px;
    line-height: 120px;
  }

  .container-section-design-de-marque-couleurs{
    flex-wrap: wrap;
  }

  .couleurs-titre-desc{
    flex-basis: 100%;
    padding-right: 0;
  }

  .couleurs-blocs{
    flex-basis: 100%;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 80px;
  }

  .navigation-slide.couleurs{
    top: 85%;
    width: 100px;
    max-width: 100%;
    left: 50%;
    transform: translateX(-50%);
    height: 45px;
  }

  .navigation-slide.couleurs div{
    opacity: 1;
  }

  .content-projet-explications{
    padding-top: 90px;
    padding-bottom: 90px;
  }

  .link-projet{
    margin-top: 45px;
  }

  .section-design-de-marque-typographies .content-typographies{
    flex-wrap: wrap;
  }

  .container-section-design-de-marque-typographies{
    padding-left: 70px;
    padding-right: 70px;
  }

  .section-design-de-marque-typographies .content-typographies .bloc-typographie-description,
  .section-design-de-marque-typographies .content-typographies .image-typographie{
    flex-basis: 100%;
    text-align: center;
    padding-right: 0px;
  }

  .section-design-de-marque-typographies .content-typographies .bloc-typographie-description span{
    text-align: left;
    margin-bottom: 0px;
  }

  .section-design-de-marque-typographies .content-typographies .image-typographie{
    padding: 0px!important;
    margin-top: 20px;
  }

  .section-design-de-marque-typographies .content-typographies{
    margin-bottom: 60px;
  }

  .section-design-digital-double-mockups{
    flex-wrap: wrap;
    min-height: auto;
  }

  .section-design-digital-double-mockups .content-mockup-texte{
    flex-basis: 100%;
  }

  .section-design-digital-double-mockups .content-mockup-texte .content-mockup-texte-para{
    padding-top: 75px;
    padding-bottom: 75px;
  }

  .section-design-digital-double-mockups .content-mockup-droite{
    flex-basis: 100%;
  }

  .section-design-digital-double-mockups .content-mockup-texte .content-mockup-texte-img,
  .section-design-digital-double-mockups .content-mockup-texte .content-mockup-texte-para{
    height: auto;
  }

  .section-design-digital-double-mockups .content-mockup-texte .content-mockup-texte-para{
    height: auto;
  }

  .section-design-de-marque-double-mockups {
    flex-wrap: wrap;
  }

  .section-design-de-marque-double-mockups .gauche-mockup-graphique,
  .section-design-de-marque-double-mockups .droite-mockup-graphique{
    flex-basis: 100%;
  }

  .content-projet-temoignage{
    opacity: 1;
  }

  .content-projet-temoignage .row-content-projet-temoignage .text-projet-temoignage{
    padding-left: 80px;
    padding-right: 80px;
  }

  .content-projet-temoignage .apostrophe-content:before,
  .content-projet-temoignage .apostrophe-content:after {
    font-size: 150px;
    line-height: 100px;
  }

}

@media screen and (max-width: 820px) {
  .computer-background {
    background-color: white;
    padding-top: 40px;
    padding-right: 40px;
    padding-left: 40px;
    height: 900px;
    /* padding-bottom: 60px; */
  }
}

@media screen and (max-width: 767px) {
  .computer-background {
    background-color: white;
    padding-top: 40px;
    padding-right: 40px;
    padding-left: 40px;
    height: 900px;
    /* padding-bottom: 60px; */
  }

  .content-projet-temoignage{
    padding-bottom: 60px;
    padding-top: 160px;
  }

  .content-projet-temoignage .apostrophe-content:before {
    font-size: 150px;
    line-height: 150px;
  }

  .content-projet-temoignage .apostrophe-content:before {
    top: -115px;
    transform: translateY(-100%) translateX(-50%);
    left: 50%;
  }

  .content-projet-temoignage .apostrophe-content:after {
    display: none;
  }

  .content-projet-temoignage .row-content-projet-temoignage .text-projet-temoignage{
    padding-left: 50px;
    padding-right: 50px;
  }

  .slider-projets .title-projet {
    font-size: 50px;
    line-height: 50px;
  }

  .tab-recrut td{
    width: 100%!important;
    padding-left: 0px!important;
    padding-right: 0px!important;
  }

  .title-pages-speciales h1{
    font-size: 75px;
    line-height: 75px;
  }

  body.error404 #main-content .container{
    background-position: center left;
  }

  body.error404 #main-content .container:after{
    background-color: rgba(255,255,255,0.7);
  }

  .page-404-message{
    padding: 30px;
  }

  .message-404 {
    font-size: 20px;
  }

  .page-404-message h1{
    font-size: 90px;
    margin-top: 15px;
    margin-bottom: 25px;
  }

  .page-404-message h2 {
    font-size: 22px;
    line-height: 30px;
  }

  .text-temoignages{
    font-size: 16px;
    line-height: 26px;
  }

  .entete-agence-content .content-loader .text > div:nth-child(1){
    font-size: 100px;
    line-height: 100px;
  }

  .rs-header{
    left: 12px;
    bottom: 35px;
  }

  .menu-bottom {
    padding-left: 20px;
    padding-right: 10px;
  }

  .bloc-text-animal{
    width: 100%;
    padding: 10px;
  }

  .projet-entete .text-entete h1{
    font-size: 45px;
    line-height: 42px;
  }

  .projet-entete .text-entete h2{
    font-size: 35px;
    line-height: 35px;
  }

  .content-projet-explications .content-text-explications{
    flex-wrap: wrap;
    padding-left: 70px;
    padding-right: 70px;
  }

  .content-text-explications-para{
    flex-basis: 100%;
    margin-bottom: 50px;
    .flex{
      @media screen and (max-width: 980px){
        flex-wrap: wrap;
      }
      p{
        @media screen and (max-width: 980px){
          width: 100% !important;
        }
      }
    }
  }

  .link-projet{
    flex-basis: 100%;
  }

  .content-projet-explications{
    padding-top: 100px;
    padding-bottom: 100px;
  }

  .section-design-de-marque-double-mockups{
    flex-wrap: wrap;
  }

  .section-design-de-marque-double-mockups .gauche-mockup-graphique,
  .section-design-de-marque-double-mockups .droite-mockup-graphique{
    flex-basis: 100%;
  }

  .section-design-digital-double-mockups .content-mockup-texte .content-mockup-texte-para{
    padding-left: 30px;
    padding-right: 30px;
    padding-top: 75px;
    padding-bottom: 75px;
  }

  .computer-monitor{
    border: 25px solid #292929;
  }

  .computer-bottom{
    height: 80px;
  }

  .computer-stand{
    width: 200px;
    height: 50px;
  }

  .computer-stand-bottom{
    width: 250px;
  }

  .infos-contact{
    flex-wrap: wrap;
  }

  .content-infos{
    padding-right: 0px;
    padding-bottom: 50px;
    flex-basis: 100%;
  }

  .newsletter-contact{
    flex-basis: 100%;
  }

  .newsletter-contact .nf-form-cont{
    width: auto;
  }

  .text-archive{
    padding-left: 65px;
    padding-right: 30px;
    font-size: 18px;
    line-height: 28px;
  }

  .link-return-archives a{
    width: 200px;
  }

  .content-image-archives{
    flex-basis: 100%;
    order: 1;
  }

  .liste-talents-corps{
    height: 50vh;
  }

  .talent-corps-animal .text-animal{
    right: 0;
    bottom: 0;
    padding: 15px;
    width: 100%;
    max-width: 100%;
    transform: translateX(0);
  }

  .text-animal h2{
    font-size: 20px;
    line-height: 22px;
  }

  .text-animal h3 {
    font-size: 16px;
    line-height: 16px;
  }

  .text-animal p {
    font-size: 14px;
    line-height: 16px;
  }

  .title-expertise h2{
    padding-left: 30px;
    padding-right: 30px;
    font-size: 30px;
    line-height: 30px;
    display: none;
  }

  .title-expertise h2 span:first-child{
    padding-right: 15px;
  }

  .section-page-agence-clients h2 span:first-child{
    font-size: 150px;
    line-height: 150px;
  }

  .liste-clients-agence .bloc-client {
    flex-basis: 47%;
    margin-bottom: 50px;
    margin-top: 50px;
    height: 150px;
  }

  .liste-partenaires-agence .bloc-partenaire{
    flex-wrap: wrap;
    margin-top: 0px;
    margin-bottom: 80px;
    position: relative;
  }

  .liste-partenaires-agence .bloc-partenaire:before{
    content: " ";
    display: block;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 70%;
    height: 1px;
    background-color: rgba(255,255,255,0.4);
  }

  .liste-partenaires-agence .bloc-partenaire:last-child:before{
    display: none;
  }

  .liste-partenaires-agence .bloc-partenaire .image-badge{
    margin-bottom: 20px;
  }

  .liste-partenaires-agence .bloc-partenaire .image-badge,
  .liste-partenaires-agence .bloc-partenaire .content-title-text{
    flex-basis: 100%;
    text-align: center;
    padding-left: 25px;
  }

  .liste-partenaires-agence .bloc-partenaire a{
    margin-left: auto;
    margin-right: auto;
  }

  .section-page-agence-partenaires .title-partenaires h1 span:first-child{
    font-size: 75px;
    line-height: 75px;
  }

  .entete-agence-content .content-loader .text > div:nth-child(2){
    font-size: 55px;
    line-height: 80px;
    margin-top: -10px;
  }

  .text-contact-clients-agence {
    font-size: 65px;
    line-height: 80px;
  }

  .container-section-design-de-marque-couleurs{
    padding-top: 60px;
    padding-bottom: 60px;
    padding-left: 70px;
    padding-right: 70px;
  }

  .container-section-design-de-marque-typographies h2,
  .couleurs-titre-desc h2,
  .row-content-projet-temoignage h2{
    font-size: 32px;
    margin-bottom: 25px;
    font-weight: 700;
  }

  .content-projet-logo-demande .logo-client{
    padding-top: 80px;
    padding-bottom: 80px;
  }

}
@media screen and (max-width: 750px) {
  .computer-background {
    background-color: white;
    padding-top: 40px;
    padding-right: 40px;
    padding-left: 40px;
    height: 800px;
    /* padding-bottom: 60px; */
  }

  .title-pages-speciales-center h1 {
    font-size: 45px;
  }
  .img-pages-speciales {
    height: 45px;
  }
}

@media screen and (max-width: 576px) {
  .computer-background {
    background-color: white;
    padding-top: 40px;
    padding-right: 40px;
    padding-left: 40px;
    height: 650px;
    /* padding-bottom: 0px; */
    /* padding-bottom: 60px; */
    /* margin-bottom: 180px; */
  }

  .title-pages-speciales-center h1 {
    font-size: 30px;
  }
  .img-pages-speciales {
    height: 30px;
  }

  .text-entete .loc-projet{
    font-size: 20px;
    line-height: 24px;
    padding-left: 25px;
  }

  .content-projet-temoignage .content-infos-temoignage{
    text-align: left;
  }

  .content-projet-temoignage{
    padding-right: 0;
    padding-left: 0;
  }

  .content-projet-temoignage .row-content-projet-temoignage .text-projet-temoignage{
    padding-right: 0;
    padding-left: 0;
  }

  .content-projet-temoignage h2{
    padding-left: 25px;
    padding-right: 25px;
    text-align: center!important;
  }

  .content-projet-temoignage .text-projet-temoignage div.text{
    text-align: center!important;
  }

  .content-projet-temoignage .row-content-projet-temoignage{
    padding-right: 25px;
    padding-left: 25px;
  }

  .content-projet-temoignage .content-infos-temoignage {
    text-align: center!important;
  }

  .content-projet-temoignage .text-projet-temoignage {
    font-size: 20px;
    line-height: 34px;
    padding-right: 0;
    padding-left: 0;
    text-align: left;
  }

  .entete-agence-content .content-loader .text > div:nth-child(1){
    font-size: 50px;
    line-height: 55px;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a:before{
    display: none!important;
  }

  .rs-header {
    left: 15px;
    bottom: 50px;
  }

  .content-desc-design-marque{
    font-size: 18px;
    line-height: 28px;
  }

  .bloc-image-design-marque, .bloc-image-design-digital{
    display: none;
  }

  .bloc-text-design-marque h2,
  .bloc-text-design-digital h2{
    font-size: 25px;
    line-height: 30px!important;
    line-height: 9px;
    margin-bottom: 25px;
    word-break: break-all;
  }

  .bloc-text-design-marque,
  .bloc-text-design-digital{
    padding-left: 40px!important;
    padding-right: 40px!important;
  }

  .entete-agence-content .content-loader{
    left: 0;
    padding-left: 15px;
    padding-right: 15px;
  }

  .entete-agence-content .content-loader .text > div:nth-child(2){
    font-size: 30px;
    line-height: 55px;
  }

  .entete-agence-content .content-loader .description{
    width: auto;
    font-size: 16px;
    line-height: 25px;
    margin-top: 18px;
  }

  /* .entete-agence-content .content-loader .description br:first-child{
    display: none;
  } */

  .et_header_style_fullscreen ul#mobile_menu_slide li>a>span:first-child{
    font-size: 45px;
    line-height: 45px;
    transform: translateY(-20px)!important;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li:last-child>a>span:first-child{
    transform: translateY(-90%)!important;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a:hover span:last-child, .et_header_style_fullscreen ul#mobile_menu_slide li>a.current-page span:last-child{
    animation: none;
    display: none;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a span:last-child{
    animation: none;
    display: none;
  }

  .menu-bottom a{
    padding-right: 2px!important;
    padding-left: 2px!important;
    font-size: 13px!important;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a{
    padding-left: 20px;
  }

  /* .et_header_style_fullscreen ul#mobile_menu_slide li:first-child>a:before {
      left: 50%;
      transform: perspective(0px) translateY(-60%) translateX(-50%) rotate(77deg) rotateY(0) rotateX(0) rotateZ(0) scale(0.4);
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li:first-child>a:hover:before{
      left: 50%;
      transform: perspective(0px) translateY(-60%) translateX(-50%) rotate(77deg) rotateY(0) rotateX(0) rotateZ(0) scale(0.4);
  } */

  /* .et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(2)>a:before {
    transform: perspective(500px) translateY(-60%) translateX(-50%) rotate(20deg) rotateY(-15deg) scale(0.4);
    left: 50%;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(2)>a:hover:before {
    transform: perspective(500px) translateY(-60%) translateX(-50%) rotate(20deg) rotateY(-15deg) scale(0.4);
    left: 50%;
  } */

  /* .et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(3)>a:before {
    left: 50%;
    transform: perspective(200px) translateY(-60%) translateX(-50%) rotate(0) rotateY(0) scale(0.4);
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(3)>a:hover:before{
    transform: perspective(200px) translateY(-60%) translateX(-50%) rotate(0) rotateY(0) scale(0.4);
  } */

  .projet-entete .text-entete h1 {
    font-size: 30px;
    line-height: 32px;
  }

  .projet-entete .text-entete h2{
    font-size: 26px;
    line-height: 26px;
  }

  .section-design-de-marque-couleurs .content-couleurs{
    flex-wrap: wrap;
  }

  .container-section-design-de-marque-couleurs{
    padding-left: 30px;
    padding-right: 30px;
  }

  .section-design-de-marque-couleurs .content-couleurs .bloc-couleur{
    height: 200px;
  }

  .section-design-de-marque-couleurs .content-couleurs .bloc-couleur,
  .section-design-de-marque-couleurs .content-couleurs .text-couleur{
    flex-basis: 100%;
  }

  .section-design-de-marque-couleurs .content-couleurs .text-couleur{
    padding-left: 0;
    padding-right: 0;
    text-align: center;
    margin-top: 15px;
  }

  .container-section-design-de-marque-typographies{
    padding-left: 60px;
    padding-right: 30px;
  }

  .computer-monitor{
    border: 18px solid #292929;
    border-top-right-radius: 1rem;
    border-top-left-radius: 1rem;
  }

  .computer-bottom{
    height: 50px;
  }

  .computer-stand{
    width: 100px;
    height: 20px;
  }

  .computer-stand-bottom{
    width: 150px;
  }

  .infos-contact{
    padding-left: 30px;
    padding-right: 30px;
  }

  .et_header_style_left .logo_container > a{
    width: 220px;
  }

  .content-archives {
    padding-left: 50px;
    padding-right: 50px;
  }

  .grid-projets{
    padding-left: 0px;
  }

  .item-projet{
    width: 100%;
  }

  .image-tete-animal {
    padding: 0.25rem;
  }

  .image-tete-animal{
    flex-basis: 20%;
  }

  .image-tete-animal img {
    width: 100%;
    height: auto;
}

  .title-expertise h2,
  .title-talents h2{
    font-size: 24px;
    line-height: 24px;
  }

  .section-page-agence-clients h2{
    padding-left: 20px;
    padding-right: 20px;
    margin-top: 75px;
  }

  .section-page-agence-clients h2 span{
    display: block;
  }

  .section-page-agence-clients h2 span:first-child{
    font-size: 75px;
    line-height: 75px;
    padding-bottom: 10px;
    color: rgba(255,255,255,0.5);
  }

  .section-page-agence-clients h2 span:last-child{
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    transform: translateY(0);
  }

  .liste-clients-agence{
    margin-bottom: 75px;
    margin-top: 75px;
  }

  .liste-clients-agence .bloc-client {
    flex-basis: 100%;
    margin-bottom: 30px;
    margin-top: 30px;
    height: 150px;
    margin-left: 0;
    margin-right: 0;
    background-color: transparent!important;
  }

  .section-page-agence-partenaires .title-partenaires h1 span:first-child{
    font-size: 43px;
    line-height: 43px;
    padding-bottom: 10px;
    display: block;
    text-align: center;
  }

  .title-pages-speciales h1{
    font-size: 40px;
    line-height: 43px;
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 40px;
    margin-top: 120px;
    padding-bottom: 0px;
  }

  .section-page-agence-partenaires .title-partenaires h1 {
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 0px;
    margin-top: 120px;
    padding-bottom: 0px;
  }

  .liste-partenaires-agence .bloc-partenaire h2{
    font-size: 25px;
  }

  .liste-partenaires-agence .bloc-partenaire .image-badge, .liste-partenaires-agence .bloc-partenaire .content-title-text{
    padding-left: 0px;
  }

  .newsletter-contact .nf-form-content label br{
    display: none;
  }

  .newsletter-contact .nf-form-content input[type=button]{
    width: 240px;
  }

  .rs-contact{
    flex-wrap: wrap;
  }

  .rs-contact a{
    margin-right: 3px;
    flex-basis: 22%;
    margin-bottom: 10px;
    margin-top: 10px;
  }

  .text-contact-clients-agence {
    font-size: 35px;
    line-height: 45px;
    margin-top: 40px;
    margin-bottom: 45px;
  }

  .section-design-de-marque-couleurs .content-couleurs{
    padding: 0;
  }

  .content-projet-logo-demande .demande-client.anim .text-demande-client{
    padding-top: 60px;
    padding-bottom: 60px;
    font-size: 20px;
    line-height: 34px;
    padding-right: 30px;
    padding-left: 60px;
  }

  .content-projet-explications,
  .container-section-design-de-marque-typographies{
    padding-top: 60px;
    padding-bottom: 60px;
  }

  .content-projet-explications .content-text-explications {
    font-size: 20px;
    line-height: 34px;
    padding-right: 30px;
    padding-left: 60px;
    text-align: left;
  }

  .text-design-de-marque-derniere,
  .text-design-digital-derniere{
    font-size: 20px;
    line-height: 34px;
    padding-top: 20px;
  }

  .section-design-digital-double-mockups .content-mockup-texte .content-mockup-texte-para{
    padding-right: 30px;
    padding-left: 60px;
  }

  .section-design-digital-double-mockups .content-mockup-texte .content-mockup-texte-para p{
    padding-right: 0;
    padding-left: 0;
    font-size: 20px;
    line-height: 34px;
    text-align: left;
  }

  a.link-all-projets{
    font-size: 18px;
    line-height: 34px;
  }

  .dernier-mockup-digital:before{
    height: 100%;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a {
    justify-content: flex-start;
  }

  .lg-toolbar .lg-icon{
    width: 35px!important;
  }

  .content-text-archive h1{
    font-size: 38px;
    line-height: 38px;
  }

  .content-text-archive h2{
    font-size: 24px;
    line-height: 24px;
  }

  .content-projet-archives{
    padding-top: 70px;
    background: #333;
  }

  a.link-all-projets:before{
    width: 155px;
    border-bottom: 45px solid #ff6600;
    border-left: 0px solid transparent;
    border-right: 10px solid transparent;
    left: 51%;
    top: 12px;
  }

  .section-content-pages-speciales{
    padding-left: 35px;
    padding-right: 35px;
    margin-bottom: 40px;
  }

  .title-pages-speciales .single-post-content h1{
    font-size: 32px;
    line-height: 36px;
    margin-bottom: 15px;
  }

  .date-blog-single{
    font-size: 20px;
    line-height: 26px;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li>a>span div.couleur-menu-1:before{
    display: none!important;
  }

  .et_header_style_fullscreen ul#mobile_menu_slide li:first-child>a>span div.couleur-menu-2:before,
  .et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(2)>a>span div.couleur-menu-2:before,
  .et_header_style_fullscreen ul#mobile_menu_slide li:nth-child(3)>a>span div.couleur-menu-2:before{
    width: 100%!important;
  }

  .content-archives{
    padding-left: 25px;
    padding-right: 25px;
  }

  .slider-projets .title-projet{
    font-size: 39px;
    line-height: 39px;
  }
}

@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
{ @media {
  .et_header_style_fullscreen ul#mobile_menu_slide li:first-child>a:before {
    transform: perspective(500px) translateY(-60%) rotate(14deg) scale(1)!important;
  }
  .et_pb_fullscreen_menu_active ul#mobile_menu_slide li:first-child>a.current-page:before,
  .et_pb_fullscreen_menu_active ul#mobile_menu_slide li:first-child>a:hover:before{
    transform: perspective(500px) translateY(-95%) rotate(11deg) scale(1.05)!important;
  }
}}

@media not all and (min-resolution:.001dpcm)
{ @supports (-webkit-appearance:none) and (stroke-color:transparent) {
  .et_header_style_fullscreen ul#mobile_menu_slide li:first-child>a:before {
    transform: perspective(500px) translateY(-60%) rotate(14deg) scale(1)!important;
  }
  .et_pb_fullscreen_menu_active ul#mobile_menu_slide li:first-child>a.current-page:before,
  .et_pb_fullscreen_menu_active ul#mobile_menu_slide li:first-child>a:hover:before{
    transform: perspective(500px) translateY(-95%) rotate(11deg) scale(1.05)!important;
  }
}}


/****** Thème enfant template ******/

/*
 Theme Name:     Divi Child Theme
 Theme URI:      http://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme
 Author:         Elegant Themes
 Author URI:     http://www.elegantthemes.com
 Template:       Divi
*/

@import url("../Divi/style.css");
@import url("variables.css");

/* DEBUT - Déclarations des Fonts */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap');
/* END - Déclarations des Fonts*/

.section-entete{
  padding-top: 40px;
  padding-bottom: 40px;
  background-color: #CCCCCC;
}

.page-exemple .et_pb_section:before{
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  background-color: #333333;
  width: 80%;
  height: 2px;
  opacity: 0.3;
}

.page-exemple .et_pb_section.section-text-general.call-to-action:before{
  display: none;
}

/* DEBUT - Déclarations générales
   Body, Ligne, Ligne en plein écran, bouton général du site */

body{
  font-family: var(--font-family-p-global);
  color: var(--color-p-global);
  font-size: var(--size-p-global);
  line-height: var(--line-height-p-global);
  counter-reset: section;
}

.row-width{
  width: 1440px!important;
  max-width: 100%!important;
  padding-left: 30px!important;
  padding-right: 30px!important;
}

.row-width-full{
  width: 100%!important;
  max-width: 100%!important;
  padding-left: 30px!important;
  padding-right: 30px!important;
}

.bt-link-global,
#entete-hauteur .slider-basique .et_pb_slides .et_pb_button{
  display: inline-block;
  padding: 15px!important;
  padding-left: 25px!important;
  padding-right: 35px!important;
  border: 2px solid var(--color-link-border)!important;
  background-color: var(--background-link-general)!important;
  font-size: var(--size-link-general)!important;
  line-height: var(--size-link-general)!important;
  color: var(--color-link-general);
  margin-top: 25px;
  font-weight: bold;
  text-transform: uppercase;
  transition: all 0.3s ease!important;
  border-radius: 3px!important;
  position: relative!important;
  cursor: pointer;
  pointer-events: visible;
  margin-left: 0!important;
  margin-right: 0!important;
}

.bt-link-global:after,
#entete-hauteur .slider-basique .et_pb_slides .et_pb_button:after{
  content: "\35";
  opacity: 0;
  position: absolute;
  margin-left: -1em;
  font-feature-settings: "kern" off;
  font-variant: none;
  font-style: normal;
  font-weight: 400;
  text-shadow: none;
  text-transform: none;
  font-family: 'ETmodules'!important;
  transition: none!important;
  font-size: var(--size-link-general)!important;
  line-height: var(--size-link-general)!important;
}

.bt-link-global:hover,
#entete-hauteur .slider-basique .et_pb_slides .et_pb_button:hover{
  border: 2px solid var(--color-link-border)!important;
  background-color: var(--color-link-general)!important;
  color: var(--background-link-general)!important;
  padding-right: 35px!important;
}

.bt-link-global:hover:after,
#entete-hauteur .slider-basique .et_pb_slides .et_pb_button:after{
  opacity: 1;
  margin-left: 0;
}

/* END - Déclarations générales
   Body, Ligne, Ligne en plein écran, bouton général du site */

/* Section - Entête de page */

#entete-hauteur{
  width: 100%;
  max-width: 100%;
  height: calc(767px - var(--height-header));
}

#entete-hauteur.simple:before{
  content: "";
  width: 100%;
  height: 80%;
  position: absolute;
  left: 0;
  top: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0));
  z-index: 12;
}

#entete-hauteur .entete-simple{
  position: relative;
  z-index: 999;
}

#entete-hauteur .row-width-full,
#entete-hauteur .row-width{
  display: flex;
  height: 100%;
  justify-content: flex-start;
  align-items: center;
  z-index: 999;
}

#entete-hauteur.video{
  padding: 0!important;
}

#entete-hauteur .row-width-full.video{
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  padding: 0!important;
  z-index: 11!important;
}

#entete-hauteur.video .row-width-full.video,
#entete-hauteur.video .row-width-full.video .et_pb_column,
#entete-hauteur.video .row-width-full.video .et_pb_column .et_pb_module,
#entete-hauteur.video .row-width-full.video .et_pb_column .et_pb_module .et_pb_code_inner{
  padding: 0!important;
  height: 100%!important;
}

#entete-hauteur .row-width h1{
  font-family: var(--font-family-title-entete);
  color: var(--color-title-entete);
  font-size: var(--font-size-title-entete);
  line-height: var(--font-size-title-entete);
  text-align: var(--alignement-title-entete);
  font-weight: bold;
  padding-bottom: 0px!important;
  margin-bottom: 15px;
  text-shadow: 0px 0px 25px rgba(0,0,0,0.3);
}

#entete-hauteur .row-width p{
  font-family: var(--font-family-p-entete);
  color: var(--color-p-entete);
  font-size: var(--font-size-p-entete);
  line-height: var(--line-height-p-entete);
  text-align: var(--alignement-p-entete);
  text-shadow: 0px 0px 25px rgba(0,0,0,0.3);
}

#entete-hauteur.entete-hauteur-full{
  width: 100%;
  max-width: 100%;
  height: calc(100vh - var(--height-header));
}

#entete-hauteur.entete-hauteur-page{
  width: 100%;
  max-width: 100%;
  height: calc(500px - var(--height-header));
}

#entete-hauteur.slider{
  padding-top: 0px!important;
  padding-bottom: 0px!important;
}

#entete-hauteur.slider .row-width-full,
#entete-hauteur.slider .et_pb_column,
#entete-hauteur.slider .et_pb_column .et_pb_module,
#entete-hauteur.slider .et_pb_column .et_pb_module .et_pb_code_inner{
  padding: 0!important;
  height: 100%!important;
}

#entete-hauteur .slider-basique{
  height: 100%!important;
}

#entete-hauteur .slider-basique .et_pb_slides,
#entete-hauteur .slider-basique .et_pb_slide{
  height: 100%!important;
}

#entete-hauteur .slider-basique .et_pb_slides{
  z-index: 999;
}

#entete-hauteur .slider-basique .et_pb_slides .et_pb_slide .et_pb_container{
  z-index: 999;
  width: 100%!important;
  max-width: 100%!important;
}

#entete-hauteur .slider-basique .et_pb_slides .et_pb_slide{
  padding: 0!important;
}

#entete-hauteur .slider-basique .et_pb_slides .et_pb_slide .et_pb_slide_description{
  padding: 0!important;
  width: 1440px;
  max-width: 100%;
  margin: auto;
  padding-left: 80px!important;
  padding-right: 80px!important;
  float: none!important;
  z-index: 99999;
  position: relative;
}

#entete-hauteur .slider-basique .et_pb_slides .et_pb_slide .et_pb_container .et_pb_slider_container_inner:before{
  content: "";
  width: 100%;
  height: 80%;
  position: absolute;
  left: 0;
  top: 0;
  background: linear-gradient(to bottom, rgba(0,0,0,0.5), rgba(0,0,0,0));
  z-index: 9999;
}

#entete-hauteur .slider-basique .et_pb_slides .et_pb_slide h2{
  font-family: var(--font-family-title-entete);
  color: var(--color-title-entete-slider);
  font-size: var(--font-size-title-entete);
  line-height: var(--font-size-title-entete);
  text-align: var(--alignement-title-entete);
  font-weight: bold;
  padding-bottom: 0px!important;
  margin-bottom: 15px;
  text-shadow: 0px 0px 25px rgba(0,0,0,0.3);
}

#entete-hauteur .slider-basique .et_pb_slides .et_pb_slide p{
  font-family: var(--font-family-p-entete);
  color: var(--color-p-entete-slider);
  font-size: var(--font-size-p-entete);
  line-height: var(--line-height-p-entete);
  text-align: var(--alignement-p-entete);
  text-shadow: 0px 0px 25px rgba(0,0,0,0.3);
}

#entete-hauteur .slider-basique .et_pb_slides .et_pb_button_wrapper{
  text-align: left!important;
}

#entete-hauteur .slider-basique .et_pb_slides .et_pb_slide_with_video .et_pb_button_wrapper a{
  width: 280px!important;
  max-width: 100%;
  padding-right: 10px!important;
  padding-left: 10px!important;
  text-align: center;
  display: flex!important;
  align-items: center;
  justify-content: center;
}

#entete-hauteur .slider-basique .et_pb_slides .et_pb_slide_with_video .et_pb_button_wrapper a:before{
  content: "\49";
  font-family: 'ETmodules'!important;
  display: inline-block;
  margin-right: 10px;
  position: relative!important;
  opacity: 1!important;
  margin-left: 0px!important;
  transition: all 0.3s ease!important;
}

#entete-hauteur .slider-basique .et_pb_slides .et_pb_slide_with_video .et_pb_slider_container_inner.play .et_pb_button_wrapper a:before{
  content: "\5f";
}

#entete-hauteur .slider-basique .et_pb_slides .et_pb_slide_with_video .et_pb_button_wrapper a:after{
  display: none!important;
}

#entete-hauteur .slider-basique .et_pb_slide_video,
#entete-hauteur .slider-basique .et_pb_slide_video .wp-video,
#entete-hauteur .slider-basique .et_pb_slide_video .wp-video-shortcode,
#entete-hauteur .slider-basique .et_pb_slide_video .mejs-inner{
  width: 100%!important;
  height: 100%!important;
}

#entete-hauteur .slider-basique .et_pb_slide_video{
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  margin-top: 0!important;
}

#entete-hauteur .slider-basique .et_pb_slide_video video{
  width: 100%!important;
  height: 100%!important;
  object-fit: cover;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s ease;
  z-index: 99;
}

#entete-hauteur .slider-basique .et_pb_slides .et_pb_slide_with_video .et_pb_slider_container_inner.play video{
  opacity: 1;
  visibility: visible;
}

#entete-hauteur .slider-basique .et_pb_slide_video .mejs-controls,
#entete-hauteur .slider-basique .et_pb_slide_video .mejs-layers{
  display: none!important;
}

#entete-hauteur .slider-basique .et-pb-arrow-next,
#entete-hauteur .slider-basique .et-pb-arrow-prev{
  font-size: 80px!important;
  z-index: 9999999;
}

#entete-hauteur .slider-basique .et-pb-arrow-prev{
  left: -10px!important;
}

#entete-hauteur .slider-basique .et-pb-arrow-next{
  right: -10px!important;
}

/* END - Section - Entête de page */

/* Section - Intérieur */

.section-text-general{
  padding-top: var(--section-text-general-marge-top-bottom)!important;
  padding-bottom: var(--section-text-general-marge-top-bottom)!important;
}

.section-text-general .row-width{
  padding-top: var(--section-text-general-marge-int-top-bottom)!important;
  padding-bottom: var(--section-text-general-marge-int-top-bottom)!important;
}

.section-text-general .row-width-titre{
  padding-bottom: 20px!important;
}

.section-text-general.call-to-action{
  padding-top: 0!important;
  padding-bottom: 0!important;
}

.section-text-general.call-to-action .bt-link-global{
  margin-top: 10px!important;
  margin-bottom: 40px!important;
  left: 50%;
  transform: translateX(-50%);
}

.section-text-general.call-to-action .bloc-general-texte{
  margin-top: 40px!important;
}

.bloc-general-texte h1{
  font-family: var(--font-family-h1-global);
  color: var(--color-title-h1-global);
  font-size: var(--size-title-h1-global);
  line-height: var(--size-title-h1-global);
  font-weight: bold;
  margin-bottom: 30px;
  padding-bottom: 20px;
  position: relative;
}

.bloc-general-texte h2{
  font-family: var(--font-family-h2-global);
  color: var(--color-title-h2-global);
  font-size: var(--size-title-h2-global);
  line-height: var(--size-title-h2-global);
  font-weight: bold;
  margin-bottom: 30px;
  padding-bottom: 20px;
  position: relative;
}

.row-width-titre .bloc-general-texte h2{
  margin-bottom: 0;
}

.bloc-general-texte h3{
  font-family: var(--font-family-h3-global);
  color: var(--color-title-h3-global);
  font-size: var(--size-title-h3-global);
  line-height: var(--size-title-h3-global);
  font-weight: bold;
  margin-bottom: 10px;
}

.bloc-general-texte h4{
  font-family: var(--font-family-h4-global);
  color: var(--color-title-h4-global);
  font-size: var(--size-title-h4-global);
  line-height: var(--size-title-h4-global);
  font-weight: bold;
  margin-bottom: 10px;
}

.bloc-general-texte.center h2{
  text-align: center;
}

.bloc-general-texte h2:before{
  content: " ";
  position: absolute;
  bottom: 0;
  width: 50px;
  height: 2px;
  background-color: var(--color-title-h2-global);
}

.bloc-general-texte.center h2:before{
  left: 50%;
  transform: translateX(-50%);
}

.bloc-general-texte h1:before{
  content: " ";
  position: absolute;
  bottom: 0;
  width: 50px;
  height: 2px;
  background-color: var(--color-title-h2-global);
}

.bloc-general-texte.center h1:before{
  left: 50%;
  transform: translateX(-50%);
}

.bloc-general-texte p,
.bloc-general-texte ul{
  font-family: var(--font-family-p-global);
  color: var(--color-p-global);
  font-size: var(--size-p-global);
  line-height: var(--line-height-p-global);
}

.bloc-general-texte.center p{
  text-align: center;
}

.bloc-general-texte ul{
  list-style: none!important;
  padding-left: 0px!important;
}

.bloc-general-texte ul li{
  padding-left: 25px!important;
  position: relative;
}

.bloc-general-texte ul li:before{
  content: "";
  position: absolute;
  left: 10px;
  top: 10px;
  width: 6px;
  height: 6px;
  background-color: var(--color-general);
  border-radius: 50%;
}

.bloc-general-texte.float-img img{
  max-width: 30%;
  margin-bottom: 15px;
}

.bloc-image-text,
.bloc-image-text .et_pb_image_wrap {
  width: 100%!important;
  height: 100%!important;
}

.bloc-image-text .et_pb_image_wrap img {
  width: 100%!important;
  height: 100%!important;
  object-fit: cover!important;
}

.focus-column .bt-link-global{
  width: 100%;
  background-color: var(--background-color-focus)!important;
  background-color: var(--background-link-general-focus)!important;
  font-size: var(--size-link-general-focus)!important;
  line-height: var(--size-link-general-focus)!important;
  text-align: center;
  padding: 5px!important;
  margin-top: 0px;
}

.focus-column .bt-link-global:after{
  display: none!important;
}

.focus-column .bt-link-global:hover {
  background-color: var(--color-link-general)!important;
  color: var(--color-general)!important;
  padding-right: 0!important;
}

.focus-column .bloc-focus-texte{
  text-align: center;
}

.focus-column .bloc-focus-texte h3{
  font-family: var(--font-family-h3-focus);
  color: var(--color-title-h3-focus);
  font-size: var(--size-title-h3-focus);
  line-height: var(--size-title-h3-focus);
  font-weight: bold;
  margin-bottom: 0;
  position: relative;
}

.et_pb_row_2 .focus-column .bloc-focus-texte h3{
  color: #FFF;
}

.row-pictos-focus .focus-column .bloc-focus-texte h3{
  color: var(--color-general);
}

.row-width-focus-3 .focus-column .bloc-focus-texte h3{
  font-family: var(--font-family-h3-focus-3);
  color: var(--color-title-h3-focus-3);
  font-size: var(--size-title-h3-focus-3);
  line-height: var(--size-title-h3-focus-3);
}

.row-width-focus-2 .focus-column .bloc-focus-texte h3{
  font-family: var(--font-family-h3-focus-2);
  color: var(--color-title-h3-focus-2);
  font-size: var(--size-title-h3-focus-2);
  line-height: var(--size-title-h3-focus-2);
}

.focus-column .bloc-focus-texte p{
  font-family: var(--font-family-p-focus);
  color: var(--color-p-focus);
  font-size: var(--size-p-focus);
  line-height: var(--size-p-focus);
}

.focus-column .bloc-focus-img{
  width: 100%;
  margin-bottom: 10px;
  text-align: center;
}

.focus-column .bloc-focus-img .et_pb_image_wrap {
  width: 100%;
  height: 100%;
}

.focus-column .bloc-focus-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.row-width-focus-5 .focus-column .bloc-focus-img{
  height: 180px;
}

.row-width-focus-4 .focus-column .bloc-focus-img{
  height: 200px;
}

.row-width-focus-3 .focus-column .bloc-focus-img{
  height: 200px;
}

.row-width-focus-2 .focus-column .bloc-focus-img{
  height: 250px;
}

.bloc-focus-price .et_pb_pricing_table {
  padding-bottom: 0px!important;
}

.bloc-focus-price .et_pb_et_price .et_pb_sum {
  color: var(--color-general);
  font-weight: bold;
}

.bloc-focus-price .et_pb_pricing li span {
  color: var(--color-p-global);
  font-size: var(--size-p-global);
  line-height: var(--line-height-p-global);
}

.bloc-focus-price .et_pb_pricing li span:before {
  border-color: var(--color-general);
}

.nf-form-content button,
.nf-form-content input[type=button],
.nf-form-content input[type=submit]{
  display: inline-block;
  padding: 15px!important;
  padding-left: 25px!important;
  padding-right: 25px!important;
  border: 2px solid var(--color-link-border)!important;
  background-color: var(--color-link-border)!important;
  font-size: var(--size-link-general)!important;
  line-height: var(--size-link-general)!important;
  color: var(--color-link-general);
  margin-top: 25px;
  font-weight: bold;
  text-transform: uppercase;
  transition: all 0.3s ease!important;
  border-radius: 3px!important;
  position: relative!important;
  cursor: pointer;
  pointer-events: visible;
  height: auto!important;
}

.nf-form-content button:hover,
.nf-form-content input[type=button]:hover,
.nf-form-content input[type=submit]:hover{
  background-color: var(--color-link-general)!important;
  color: var(--color-link-border)!important;
}

.content-infos-contact{
  padding: 25px!important;
  padding-top: 35px!important;
  padding-bottom: 35px!important;
}

.bloc-contact{
  padding-left: 60px;
  position: relative;
  margin-bottom: 30px!important;
}

.content-infos-contact .bloc-contact:last-child{
  margin-bottom: 0!important;
}

.bloc-contact h3{
  position: relative;
  color: var(--color-contact-h3);
  font-size: var(--size-contact-h3);
  line-height: var(--size-contact-h3);
  font-weight: bold;
}

.bloc-contact p{
  color: var(--color-contact-p);
  font-size: var(--size-contact-p);
  line-height: var(--line-height-contact-p);
}

.bloc-contact a{
  color: var(--color-contact-p);
  font-size: var(--size-contact-p);
  line-height: var(--line-height-contact-p);
  text-decoration: underline;
}

.bloc-contact:before{
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  font-family: 'ETmodules'!important;
  font-size: 40px;
  line-height: 40px;
  color: var(--color-contact-picto);
}

.bloc-contact.adresse:before{
  content: "\e01d";
}

.bloc-contact.horaires:before{
  content: "\7d";
}

.bloc-contact.telephone:before{
  content: "\e090";
}

.bloc-contact.email:before{
  content: "\e010";
}

.bloc-contact.acces{
  padding-left: 0px;
}

.galerie-simple .et_overlay:before{
  color: var(--color-general)!important;
}

.galerie-simple .et_pb_gallery_image{
  background-color: #CCC;
}

.galerie-simple .et_pb_gallery_image img{
  display: block;
}

.mfp-title{
  display: none;
}

.mfp-fade .mfp-figure {
  transition: all 0.3s ease-out;
  opacity: 0;
  -webkit-transform: scale(0.95);
  -ms-transform: scale(0.95);
  transform: scale(0.95);
}

.mfp-fade.mfp-image-loaded .mfp-figure {
  opacity: 1;
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
}

.mfp-fade.mfp-removing .mfp-figure {
  opacity: 0;
  -webkit-transform: scale(0.95);
  -ms-transform: scale(0.95);
  transform: scale(0.95);
}

.carrousel-logo .wdcl-carousel-item{
  background-color: #CCC;
}

.carrousel-logo .wdcl-carousel-item img{
  opacity: 1;
}

/**/

/* Actus home + page */

.row-actus .bt-link-global{
  text-align: center!important;
  width: 400px!important;
  max-width: 100%!important;
  display: block!important;
  margin-left: auto!important;
  margin-right: auto!important;
}

.blog-actu article h2{
  padding-bottom: 5px!important;
}

.blog-actu article h2 a{
  color: var(--color-title-blog)!important;
  font-size: var(--size-title-blog)!important;
  line-height: var(--line-height-title-blog)!important;
  font-weight: bold;
}

.blog-actu article .post-meta .published{
  color: var(--color-date-blog)!important;
  font-size: var(--size-date-blog)!important;
  line-height: var(--line-height-date-blog)!important;
}

.blog-actu article .post-content p{
  color: var(--color-p-blog)!important;
  font-size: var(--size-p-blog)!important;
  line-height: var(--line-height-p-blog)!important;
}

.blog-actu article .more-link{
  margin-top: 15px;
  text-align: center;
  font-weight: bold;
  display: block;
  padding: 5px;
  width: 100%!important;
  background-color: var(--background-lire-plus-blog)!important;
  border: 2px solid var(--background-lire-plus-blog)!important;
  color: var(--color-lire-plus-blog)!important;
  transition: all 0.3s ease;
  border-radius: 29px!important;
}

.blog-actu article .more-link:hover{
  background-color: var(--color-lire-plus-blog)!important;
  color: var(--background-lire-plus-blog)!important;
}

.wp-pagenavi{
  text-align: center;
  padding-top: 30px;
}

.wp-pagenavi span.current{
  background-color: var(--background-pagination-current)!important;
  color: var(--color-pagination-current)!important;
}

.wp-pagenavi a{
  background-color: var(--background-pagination)!important;
  color: var(--color-pagination)!important;
  transition: all 0.3s ease;
}

.wp-pagenavi a:hover{
  background-color: var(--color-pagination)!important;
  color: var(--background-pagination)!important;
}

.wp-pagenavi a,
.wp-pagenavi span.current{
  padding-left: 8px;
  padding-right: 8px;
  border: 1px solid var(--color-pagination)!important;
}
.wp-pagenavi a,
.wp-pagenavi span.current{
  padding-left: 8px;
  padding-right: 8px;
  border: 1px solid var(--color-pagination)!important;
}

.single-post #left-area {
  width: 100%!important;
  float: none!important;
}

.single-post #main-content .container:before{
  display: none!important;
}

.single-post .et_post_meta_wrapper img{
  float: right;
  max-width: 40%;
  margin-left: 20px;
  margin-bottom: 20px;
}

.single-post .entry-content{
  padding-top: 0px;
}

.single-post .post-meta .published{
  color: var(--color-date-blog)!important;
  font-size: var(--size-date-blog)!important;
  line-height: var(--line-height-date-blog)!important;
}

/**/

/* FOOTER */

.et-l--footer.fixed{
  position: fixed;
  width: 100%;
  bottom: 0;
  z-index: 0;
}

#main-footer{
  display: none!important;
}

#footer-basic{
  background-color: var(--background-footer)!important;
  padding: 0!important;
}

#footer-basic .row-width{
  padding-top: 40px!important;
  padding-bottom: 40px!important;
}

.logo-footer{
  display: flex;
  justify-content: center;
}

.copyright{
  background-color: var(--background-copyright)!important;
  padding: 0!important;
}

.copyright .row-width{
  padding-top: 5px!important;
  padding-bottom: 5px!important;
}

#footer-basic h3{
  color: var(--color-footer-h3);
  font-size: var(--size-footer-h3);
  line-height: var(--footer-h3);
  font-weight: bold;
  position: relative;
  padding-bottom: 10px;
  margin-bottom: 10px;
}

#footer-basic h3:before{
  content: " ";
  position: absolute;
  bottom: 0;
  width: 30px;
  height: 2px;
  background-color: var(--color-footer-h3);
}

#footer-basic .bloc-contact{
  padding-left: 35px;
  margin-bottom: 15px!important;
}

#footer-basic .bloc-contact:last-child{
  margin-bottom: 0!important;
}

#footer-basic .bloc-contact p{
  color: var(--color-footer-contact-p);
  font-size: var(--size-footer-contact-p);
  line-height: var(--line-height-footer-contact-p);
}

#footer-basic .bloc-contact a{
  color: var(--color-footer-contact-p);
  font-size: var(--size-footer-contact-p);
  line-height: var(--line-height-footer-contact-p);
  text-decoration: underline;
}

#footer-basic .bloc-contact:before{
  font-size: 20px;
  line-height: 20px;
  color: var(--color-footer-contact-picto);
}

#footer-basic .plan-du-site-footer ul li a{
  color: var(--color-footer-contact-p);
  font-size: var(--size-footer-contact-p);
  line-height: var(--line-height-footer-contact-p);
  transition: all 0.3s ease;
}

#footer-basic .plan-du-site-footer ul li a:hover{
  opacity: 0.8;
}

.link-copyright{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.link-copyright span,
.link-copyright a{
  color: var(--color-footer-copyright-a);
  transition: all 0.3s ease;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 5px!important;
  padding-bottom: 5px!important;
}

.link-copyright a:hover{
  opacity: 0.8;
}

#footer-basic .bt-link-global{
  background-color: var(--background-footer-link-global)!important;
  border-color: var(--background-footer-link-global)!important;
  color: var(--color-footer-link-global)!important;
  font-size: var(--size-footer-link-global)!important;
  line-height: var(--line-height-footer-link-global)!important;
  margin-top: 0!important;
}

#footer-basic .bt-link-global:after{
  font-size: var(--size-footer-link-global)!important;
  line-height: var(--line-height-footer-link-global)!important;
}

#footer-basic .bt-link-global:hover{
  background-color: var(--color-footer-link-global)!important;
  color: var(--background-footer-link-global)!important;
  padding-right: 25px!important;
}

/**/

/* END - General CSS */

/* Plan du site */

.wsp-pages-list{
  display: flex;
  flex-direction: row;
  list-style: none;
  flex-wrap: wrap;
  padding: 0!important;
}

.wsp-pages-list li.page_item{
  flex-basis: 32%;
  background-color: #fbfbfb;
  margin: 0.5%;
  padding: 10px;
  border: 1px solid #CCC;
  transition: all .3s ease-in-out;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.wsp-pages-list li.page_item:hover{
  background-color: #efefef;
}

.wsp-pages-title{
  display: none;
}

/* END - Plan du site */


@media screen and (max-width: 1200px) {
  #entete-hauteur .row-width h1,
  #entete-hauteur .slider-basique .content-text-slider .title-slide{
    font-size: var(--font-size-title-entete-1200);
    line-height: var(--font-size-title-entete-1200);
  }
}

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

  #footer-basic .row-width{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
  }

  #footer-basic.centre .row-width .et_pb_column{
    flex-basis: 46%;
    margin-right: 2%;
    max-width: 100%;
  }

  #footer-basic.centre .row-width .et_pb_column:last-child{
    margin-right: 0;
  }

  #footer-basic.left .row-width .et_pb_column{
    flex-basis: 28%;
    margin-right: 2%;
  }

  #footer-basic.left .row-width .et_pb_column:last-child{
    margin-right: 0;
  }

  #footer-basic.left .row-width .et_pb_column:nth-child(1){
    flex-basis: 100%;
  }

  #footer-basic.centre .row-width .et_pb_column:nth-child(1){
    order: 2;
  }

  #footer-basic.centre .row-width .et_pb_column:nth-child(2){
    order: 1;
    flex-basis: 100%;
  }

  #footer-basic.centre .row-width .et_pb_column:nth-child(3){
    order: 3;
  }

  .single-post .et_post_meta_wrapper img{
    float: none;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
  }

  .row-width-focus-5 .focus-column:last-child{
    width: 100%;
  }

  .bloc-general-texte.float-img img {
    float: none;
    width: 100%;
    max-width: 100%;
    margin-bottom: 25px!important;
    margin-left: 0px!important;
    margin-right: 0px!important;
  }

  .bloc-image-text{
    height: 40vh!important;
  }

  .row-reverse{
    display: flex;
    flex-direction: column-reverse;
  }

  .row-reverse .et_pb_column:first-child{
    margin-top: 30px;
  }

  #entete-hauteur .row-width h1,
  #entete-hauteur .slider-basique .et_pb_slides .et_pb_slide h2{
    font-size: var(--font-size-title-entete-980);
    line-height: var(--font-size-title-entete-980);
  }

  #entete-hauteur{
    height: calc(100vh - var(--height-header-resp));
  }

  #entete-hauteur.entete-hauteur-full{
    height: calc(100vh - var(--height-header-resp));
  }

  #entete-hauteur.entete-hauteur-page{
    height: calc(45vh - var(--height-header-resp));
  }

  #entete-hauteur .slider-basique .et_pb_slides .et_pb_slide .et_pb_slide_description{
    padding-left: 30px!important;
    padding-right: 30px!important;
  }

  #entete-hauteur .slider-basique .et-pb-slider-arrows{
    top: calc(100% - 80px)!important;
    width: 150px!important;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 9999!important;
  }

  #entete-hauteur .slider-basique .et-pb-arrow-next,
  #entete-hauteur .slider-basique .et-pb-arrow-prev{
    opacity: 1!important;
  }

  .wsp-pages-list li.page_item{
    flex-basis: 49%;
  }
}

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

  #footer-basic .row-width{
    align-items: center;
    flex-direction: column;
  }

  #footer-basic.centre .row-width .et_pb_column,
  #footer-basic.left .row-width .et_pb_column{
    width: 300px;
    max-width: 100%;
    margin-right: 0px!important;
  }

  #footer-basic.centre .row-width .et_pb_column:nth-child(3){
    margin-top: 30px!important;
  }

  .et_pb_column .et_pb_grid_item, .et_pb_column .et_pb_grid_item.et_pb_portfolio_item {
    margin: 0 5.5% 9.5% 0;
    margin-bottom: 5.5%;
    width: 47.25%;
    clear: none;
    float: left;
  }

  .bt-link-global{
    font-size: var(--size-link-general-767)!important;
    line-height: var(--size-link-general-767)!important;
  }

  #entete-hauteur{
    height: calc(100vh - var(--height-header-resp));
  }

  #entete-hauteur.entete-hauteur-full{
    height: calc(100vh - var(--height-header-resp));
  }

  #entete-hauteur.entete-hauteur-page{
    height: calc(50vh - var(--height-header-resp));
  }

  #entete-hauteur .row-width h1,
  #entete-hauteur .slider-basique .et_pb_slides .et_pb_slide h2{
    font-size: var(--font-size-title-entete-767);
    line-height: var(--font-size-title-entete-767);
  }

  .wsp-pages-list li.page_item{
    flex-basis: 100%;
    margin-right: 0;
    margin-left: 0;
  }
}

@media screen and (max-width: 576px) {
  #footer-basic.centre .row-width .et_pb_column,
  #footer-basic.left .row-width .et_pb_column{
    width: 100%;
    max-width: 100%;
    margin-right: 0px!important;
  }

  #entete-hauteur .row-width h1,
  #entete-hauteur .slider-basique .et_pb_slides .et_pb_slide h2{
    font-size: var(--font-size-title-entete-576);
    line-height: var(--font-size-title-entete-576);
  }

  #entete-hauteur .row-width p,
  #entete-hauteur .slider-basique .et_pb_slides .et_pb_slide p{
    font-size: var(--font-size-p-entete-576);
    line-height: var(--line-height-p-entete-576);
  }
}
/*Global*/
.flex{
	display:flex;
}
.flex-vertical-center
{
  display:flex;
  align-items: center;
}
.flex-column
{
	display:flex;
	flex-direction:column;
	justify-content: center;
}
.justify-center
{
justify-content:center;
}

.justify-between{
  justify-content: space-between;
}

.columns-1{
  columns: 1;
}

.columns-2{
  columns: 2;
}

.columns-3{
  columns: 3;
}

.columns-texte-creation{
  columns: 1;
}

@media screen and (min-width: 768px){
  .columns-texte-creation{
    columns: 2;
  }
}

.button
{
background-color: #FD6721;
border:none;
border-radius: 50px;
padding: 14px 70px;
font-weight: 700;
font-size: 34px;
line-height: 39px;
color: #fff;
}
.button::after
{

}
.button:hover
{
  border: none !important;
  border:none!important;
  border-radius: 50px!important;
  padding: 14px 70px!important;
  font-weight: 700;
  font-size: 34px;
  line-height: 39px;
  color: #FD6721;
  background-color: #FFF !important;
}
.button::after
{
  display: none !important;
}

h1 span, h2 span
{
    font-weight: 800;

}
/*Hero*/
.hero h1
{
  color:#fff;
  font-size: 68px;
  line-height: 80px;
}

.hero.viticole h1
{
  color:#fff;
  font-size: 60px;
  line-height: 80px;
}

/*Testimobials*/
#testimonials h2
{
	font-size:60px;
	margin-bottom:50px;
}
.slider-testimonials
{
	background-color:#F6F6F6;
	padding:20px 50px;
	border-radius:28px;
	display:flex;
	flex-direction:column;
	align-items:center;
	justify-content:center;
	width:860px;
	height:380px;
	position:relative;

}
.slider-element img{
	margin-top:0px;
	height:50px;
}

.sp-arrow::before,.sp-arrow::after
{
	background-color:#000;
	width:25%;
}

#testimonials .slider-testimonials::before,#testimonials .slider-testimonials::after
{
	content:"“";
	position:absolute;
	font-family: 'Pattaya', sans-serif;
	font-weight:400;
	font-size:115px;
	line-height:0px;
	color:#FD6721;

}
#testimonials .slider-testimonials::before{
	top:100px;
	left:80px;
	transform:translate(-100%,0)
}
#testimonials .slider-testimonials::after{
	bottom:220px;
	right:80px;
	transform:translate(100%,0) rotate(180deg);
}
.sp-next-arrow
{
	right:-50px !important;
}
.sp-previous-arrow
{
	left:-50px !important;
}
#testimonials img
{
	margin-top:20px;
	height:80px;
		opacity:1;
}
#testimonials p
{
	font-size:25px;
}
/*Agence*/
#agence h2
{
	color:#fff;
	font-size:60px;
}
@keyframes heartbeatcircle
{
  0% { transform: translate(-50%,-50%) scale( .95 );}
  20% { transform: translate(-50%,-50%) scale( 1 ); }
  40% { transform: translate(-50%,-50%) scale( .95 ); }
  60% { transform: translate(-50%,-50%) scale( 1 ); }
  80% { transform: translate(-50%,-50%) scale( .95 ); }
  100% { transform: translate(-50%,-50%) scale( .95 ); }
}
#agence-picto span:before
{
  transition: .2s;
	content:"";
	width:580px;
	height:580px;
	position:absolute;
	background-color:rgba(255,255,255,0.1);
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	border-radius:100%;
}
#agence-picto span:after
{
	content:"";
	width:750px;
	height:750px;
	position:absolute;
	background-color:rgba(255,255,255,0.05);
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
	border-radius:100%;
	z-index:-10;
}
@keyframes heartbeat
{
  0% { transform: scale( .90 );}
  20% { transform: scale( 1 ); }
  40% { transform: scale( .90 ); }
  60% { transform: scale( 1 ); }
  80% { transform: scale( .90 ); }
  100% { transform: scale( .90 ); }
}

#agence-picto img {
  animation: heartbeat 3s infinite;
}
#agence .column-width-50
{
	width:50% !important;
	margin-right: 0;
}
/*Process*/
#process h2
{
	color: #000;
	font-weight:800px;
	font-size:60px;
	line-height:70px;
}
#process h2 span,#process p
{
	color:#FD6721;
}
#process p
{
	font-size:25px;
}
#process-elements
{
	width:500px;
}

.process-element
{
	display:flex;
	color:#FD6721;
}

.process-element p
{
	text-transform: uppercase;
	font-weight:900;
	font-size:40px;
	line-height:20px;
}
.process-element p span.subtitle
{
	text-transform: lowercase;
	font-size:20px;
	font-weight:500;
	display: inline-block;
    margin-top: 20px;

}
.dot
{
	width:27px;
	height:27px;
	background-color:#FD6721;
	border-radius:100%;
	margin:0px 40px;
	position:relative;
}
.dot-container
{
position:relative;
}

.dot-container::before{
	content:"";
	width:2px;
	height:100%;
	position:absolute;
	background-color:#FD6721;
	top:50%;
	left:50%;
	transform:translate(-50%,-50%);
}
.process-element img{
max-width:none;
	padding:25px 0px;
}

/*Etude de cas*/


#etude-de-cas .column-width-50
{
	min-height:50vh;
	height:100%;
	width:50% !important;
	margin-right: 0;
}
#etude-de-cas h2
{
	font-size:60px;
	line-height:70px;
	margin-bottom:80px;
}
#etude-de-cas p
{
	font-size:25px;
}
.logo-abbaye
{
	display:flex;
	align-items:center;
	justify-content:center;
}
/*chiffres*/

#plus::before
{
	content:"+";
	position:absolute;
	font-size:120px;
	display:block;
	line-height:0px;
	top:50%;
	color:#FFF;
	transform:translate(50%,0%)

}


#chiffres p
{
	font-size:32px;
	font-weight:700;
	color:#FFF;
}
#chiffres p span
{
	font-size:26px;
	font-weight:500;
}
#chiffres .compteur p span
{
	font-size:125px !important;
	color:#FFF !important;
	font-weight:700;
}
#chiffres .compteur p span.percent-sign
{
	font-size:45px!important;
	font-weight:900!important;
}
/*contact*/

#contact-form span{
	color:#FFF;
}

#contact-form textarea.message
{
	height:350px;
}
#contact-form input.send{
	background-color:#FFF !important;
	color:#FD6721;
}
#contact-form input::placeholder{

}
#contact h2,#contact p
{
	color:#FD6721;
}
#contact h2
{
	font-size:50px;
	font-weight:600;
}
#contact span
{

	font-weight:900;
}
#contact p
{
	font-size:37px;
	font-weight:400;
}
#contact #tel p
{
	font-size:40px;
	font-weight:600;
}
#contact #separator
{
	width:80px;
	height:7px;
	background-color:#FD6721;
}
#contact-form
{
	color:#FFF;
	background-color:#FD6721;
	background-image:url("https://www.studiodefacto.com/wp-content/uploads/PICTO-DEFACTO-2.png");
	background-size: auto;
	background-position:center left -60px;
	padding:100px 100px;
  padding-bottom: 50px;
}
#tel div
{
	background-color:#FD6721;
	display:flex;
	align-items:center;
	justify-content:center;
	width:64px;
	height:64px;
	border-radius:100%;
	margin-right:34px;
}
@media (min-width: 1440px)
{
#contact-form
{
	position: absolute;
	top:-48px;
	right:-35px;
}
	#contact-form input.mail,#contact-form textarea.message{
	width:650px;
}
}

@media (max-width: 980px)
	{
	#etude-de-cas .column-width-50
{
	min-height:0px;
	margin-bottom:0px;
	background-position:center;
}

	.no-flex
	{
		display:block;
	}
		#testimonials p
{
	font-size:25px;
}
#agence .column-width-50
{
	width:100% !important;

}
	#etude-de-cas .column-width-50
{
	width:100% !important;

}
	.slider-testimonials
{
	width:100%;
	height:380px;


}
		#testimonials img
{
	margin-top:20px;
	height:80px;
	opacity:1;
}
.sp-slide
	{
		width:100%!important;
	}
}
	#process-elements p span
	{
		font-size:25px;
		line-height:25px;
	}
@media screen and (max-width: 576px) {
.hero h1
	{
		font-size:30px;
		line-height:40px;
	}
	.button
	{
	background-color: #FD6721;
border:none;
border-radius: 50px;
padding: 7px 35px;
font-weight: 700;
font-size: 17px;
line-height: 17px;
color: #fff;
	}
	#testimonials h2
{
	font-size:30px;
	margin-bottom:25px;
}
	#testimonials .slider-testimonials::before,#testimonials .slider-testimonials::after
{

	font-size:50px;
}
	#testimonials .slider-testimonials::before{
	top:50px;
	left:50px;
	transform:translate(-100%,0)
}
#testimonials .slider-testimonials::after{
	bottom:50px;
	right:50px;
	transform:translate(100%,0) rotate(180deg);
}
	.slider-testimonials
{

	padding:25px 50px;
	height:380px;
	font-size:18px !important;

}
		.slider-testimonials p
	{
			font-size:20px !important;
	}
	#agence
	{
		margin-top:50px;
	}
	#agence h2,#process h2,#etude-de-cas h2
	{
		font-size:30px;
		line-height:40px;
	}
	#process-elements img
	{
	width:50px;
	}
	.dot
	{
		width:15px;
		height:15px;
		margin:0 10px;
	}
		.process-element p
	{
		padding-top:20px;
		font-size:20px;
	}
	.process-element p span

	{
		font-size:20px !important;
		margin-top: 5px;
	}
	#process-elements p
	{
		width:100px;
	}
#plus::before
{

	font-size:60px;
	top:50%;
	transform:translate(300%,0%)

}
#etude-de-cas h2
	{
		margin-bottom:0px;
	}

#chiffres p
{
	font-size:25px;

}
#chiffres p span
{
	font-size:20px;
}
#chiffres .compteur p span
{
	font-size:60px !important;
}
#chiffres .compteur p span.percent-sign
{
	font-size:20px!important;
}
	.compteur
	{
		margin-bottom :0px !important;
	}

#contact h2
{
	font-size:25px;
}
#contact p
{
	font-size:20px;
}
#contact #tel p
{
	font-size:25px;
}
#contact #separator
{
	width:40px;
	height:5px;
	margin:0 auto;
}
#contact-form
{

	padding:50px 30px;
}
	#tel
	{
		align-items:center;
		justify-content:center;
	}
#tel div
{
	margin-right:16px;
}
	.send
	{
		width:100% !important;
	}
  }
/*animations*/
.dot-container .trait
{
	width:64px;
	height:64px;
	position:absolute;
	top:50%;
	left:50%;
	transform-origin: bottom left;
	transform:translate(0%,-100%) rotate(45deg);


}
.trait svg path
{
	stroke-dasharray:1;
	stroke-dashoffset:1;
	transition: stroke-dashoffset 0.2s ease-in-out;
	transition-delay: 200ms;


}
.process-element:hover .trait svg path {
	stroke-dashoffset:2;
		transition-delay: 0ms;

}
.dot::after
{
	content:"";
	width:27px;
	height:27px;
	background-color:#FFF;
	border-radius:100%;
	position:absolute;
	top:0px;
	bottom:0px;
	transform:scale(0);
	transition: 0.2s ease-in-out;
	z-index:100;


}
.process-element:hover .dot::after{
	transform:scale(0.5);
}
.process-element-text
{
align-self: start;
    margin-top: 18px;
}
.element-title
{
	position:relative;
}
.process-element-text .element-title::after
{
  content: '';
  position: absolute;
  width: 110%;
	margin-left:-8px;
  transform: scaleX(0);
  height: 2px;
  bottom: 0;
  left: 0;
  background-color: #FD6721;
  transform-origin: bottom left;
  transition: transform 0.2s ease-out;


}
.process-element:hover .element-title::after
{
  transform: scaleX(1);
  transform-origin: bottom left;
	transition-delay: 200ms;


}

/******* CARTE DE VISITE *********/
.carte_de_visite-template-default h1, .carte_de_visite-template-default h3{
  font-family: 'Titiliumbold'!important;
}
.carte_de_visite-template-default h2, .carte_de_visite-template-default p{
  font-family: 'Titiliumregular'!important;
}

.mail-cdv, .tel-cdv, .sms-cdv, .qr-cdv, .partage-cdv{
  width:45px;
  height:45px;
  margin: 0 15px 0 0;
  display: inline-block;
  background-color: #ff6600;
  border-radius: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 30px;
}
.mail-cdv{
  background-image:url('https://www.studiodefacto.com/wp-content/uploads/icon-mail-studiodefacto.svg');
}
.tel-cdv{
  background-image:url('https://www.studiodefacto.com/wp-content/uploads/icon-tel-studiodefacto.svg');
}
.sms-cdv{
  background-image:url('https://www.studiodefacto.com/wp-content/uploads/icon-sms-studiodefacto.svg');
}
.qr-cdv{
  background-image:url('https://www.studiodefacto.com/wp-content/uploads/icon-qr-studiodefacto.svg');
}
.partage-cdv{
  background-image:url('https://www.studiodefacto.com/wp-content/uploads/icon-partage-studiodefacto.svg');
}
.carte_de_visite-template-default .et_pb_main_blurb_image{
  margin-bottom:0px!important;
}

.fb-cdv, .link-cdv, .insta-cdv{
  width:60px;
  height:60px;
  margin: 0 15px 0 0;
  display: inline-block;
  background-color: #fff;
  border-radius: 100%;
  background-position: center;
  background-repeat: no-repeat;
}
.fb-cdv{
  background-image:url('https://www.studiodefacto.com/wp-content/uploads/icon-fb-2.png');
}
.link-cdv{
  background-image:url('https://www.studiodefacto.com/wp-content/uploads/icon-link.png');
}
.insta-cdv{
  background-image:url('https://www.studiodefacto.com/wp-content/uploads/icon-insta.png');
}
.vcf-cdv{
  display: flex;
  justify-content:center;
}
.vcf-cdv a{
  margin-top:20px;
  padding: 10px 30px;
  background:#ff6600;
  border-radius:15px;
  color:#fff;
  font-family: 'Titiliumregular'!important;
}
.vcf-cdv a:hover{
  cursor:pointer;
}
#pop-up-qrcode{
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  background:rgba(0,0,0,0.9);
  height: 100vh;
  width:100%;
  display: none;
  align-items: center;
  justify-content: center;
}
#pop-up-qrcode img{
  border:10px solid #ffffff;
}
.carte_de_visite-template-default #et-main-area{
  position: relative;
  z-index: 1000;
}

/*********************************/

.splide__slide{
  max-height: 680px;
}
.splide {
  margin: 25px 0;
}

html body #tarteaucitronRoot.tarteaucitronBeforeVisible{
  z-index: 99999;
  &:before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    z-index: 9998;
  }
  #tarteaucitronAlertBig {
    display: flex !important;
    flex-direction: column;
    #tarteaucitronPersonalize, #tarteaucitronPersonalize2,.tarteaucitronCTAButton,.tarteaucitronAllow {
      font-size: 18px !important;
      height: 40px !important;
      border-radius: 10px !important;
      border: 1px solid #F1F0F2;
    }
    button#tarteaucitronPrivacyUrl{
      color: #ADADAD !important;
      font-weight: 500;
      text-decoration: underline;
      padding-top: 10px;
    }
    #tarteaucitronCloseCross{
      font-size: 1rem !important;
      right: 6px !important;
    }
  }
}

#tarteaucitronPersonalize2 {
  order: 1;
  border-color: transparent;
}

#tarteaucitronPersonalize2:hover {
  opacity: 0.8;
}

#tarteaucitronCloseAlert {
  order: 2;
}

#tarteaucitronAllDenied2 {
  order: 3;
  border-color: #d9dce0;
}

#tarteaucitronPrivacyUrl {
  order: 4;
  background: none;
  text-decoration: none;
  font-weight: 400;
  font-size: 14px;
  margin-top: 5px;
  border-bottom: 1px solid;
  padding: 0;
  width: auto;
  border-color: currentColor;
}

#tarteaucitronPrivacyUrl:hover {
  opacity: 0.8;
}

#tarteaucitronRoot button#tarteaucitronCloseAlert {
  font-size: 18px !important;
  height: 40px !important;
  border-radius: 10px !important;
}

#tarteaucitronRoot span#tarteaucitronDisclaimerAlert {
  font-size: 17px !important;
  font-weight: 500 !important;
  margin-top: 20px !important;
}

#tarteaucitronRoot div#tarteaucitronAlertBig:before{
  font-size: 26px !important;
  font-weight: 700 !important;
  padding-top: 20px !important;
}

html body #tarteaucitronRoot div#tarteaucitronAlertBig{
  max-width: 285px !important;
  @media screen and (max-width: 980px){
    max-width: 100% !important;
  }
}



@media screen and (max-width: 600px) {
  #tarteaucitronAlertBig {
    width: 85%;
    padding: 20px 15px;
  }

  #tarteaucitronAlertBig:before {
    font-size: 24px;
  }

  #tarteaucitronDisclaimerAlert {
    font-size: 16px;
  }

  /*#tarteaucitronAlertBig button {
    width: 90%;
  }*/
}