.shapeinv                           { display: inline-block; width: 0; height: 0; border-style: solid; border-width: 0 623px 768px 623px; border-color: transparent transparent #f9f8f3 transparent; position: absolute;}

@media (max-width: 700px) {
.shapeinv                           { border-width: 0 360px 444px 360px;}
#homepage>.shape                    { display: none;}
}


/***** banner *****/
.banner 							{ padding-top: 220px; position: relative; z-index: 10; }
.banner .titre_main                 { font-size: 38px;}
.banner .wrapper                    { display: grid; grid-template-columns: 50% 50%;}
.banner .texte                      { order: 1; max-width: 495px; padding-top: 20px;}
.banner .photo                      { order: 2; margin: 0 -40px;}
.banner .photo img                  { width: 100%; height: auto;}
.banner .gridbtn                    { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 30px;}
.banner .link                       { padding: 0 15px;}
.banner .wrapper::after             { content: ""; display: block; position: absolute; right: 0; top: 35px; width: 195px; height: 195px; border-radius: 50%; border: 2px dashed #000;}
.banner .shape,
.banner .shapeinv                   { display: none;}

@media (max-width:1200px) {
.banner                             { padding-top: 130px;}
.banner .photo                      { margin: 0;}
.banner .wrapper                    { gap: 30px;}
}
@media (max-width:1000px) {
.banner .wrapper                    { display: block;}
.banner .texte                      { padding: 20px 0 0; max-width: initial; text-align: center;}
}
@media (max-width:700px) {
.banner                             { padding-top: 115px;}
.banner .wrapper                    { z-index: 11;}
.banner .photo                      { margin-bottom: 20px;}
.banner .texte                      { position: relative; background: #faf9f4; padding: 0 0 50px;}
.banner .texte::before              { content: ""; display: block; position: absolute; top: 0; right: -100px; left: -100px; height: 100%; background: #faf9f4;}
.banner .wrapper::after             { width: 125px; height: 125px; right: 30px; top: 30px;}
.banner .titre_main                 { font-size: 28px;}
.banner .titre_main span            { font-size: 18px;}
.banner .chapo                      { position: relative; z-index: 2;}
.banner .shape                      { display: block; top: -20px;}
.banner .shapeinv                   { display: block; top: 90px; left: calc(50% - 360px);}
}

@media (max-width:400px) {
.banner .gridbtn         {grid-template-columns: 1fr; grid-gap: 10px 0;}
}


/***** moving photos *****/
.moving_logos 								{ width: 100%; font-size: 0; line-height: 0; letter-spacing: 0; text-align: left; padding: 85px 0 70px; position: relative;}
.moving_logos .shapeinv                     { bottom: -75px; left: calc(50% - 290px);}
.moving_logos .row							{ width: 2552px; display: inline-block; vertical-align: middle; position: relative; z-index: 5;}
.moving_logos .row .item 					{ display: inline-block; vertical-align: middle; animation: sliding 60s linear infinite;}
.moving_logos .row .item img 				{  max-height: 45px; display: inline-block; vertical-align: middle; position: relative; transition: all 400ms ease-in-out; margin-left: 75px;  object-fit: cover;}

@keyframes sliding {
0%											{ transform: translateX(0);}
100% 										{ transform: translateX(-100%);}
}

@media (max-width: 1000px){
.moving_logos                               { padding: 80px 0;}
.moving_logos .row .item img 				{ margin-left: 40px;}
}
@media (max-width: 700px){
.moving_logos 								{ padding:30px 0; position: static;}
.moving_logos .row .item img 				{ margin-left: 60px; height: 40px;}
.moving_logos .shapeinv                     { display: none;}
}



/***** services *****/
.services                                   { background: #f2f1e6; padding: 100px 0; position: relative; overflow: hidden; z-index: 1;}
.services::before                           { content: ""; display: inline-block; width: 0; height: 0; border-style: solid;border-width: 2040px 1935px 2040px 0; border-color: transparent #f9f8f3 transparent transparent; position: absolute; left: calc(50% + 275px); top: calc(50% - 2040px);}
.services .bloc_grid                        { margin: 0;}
.services .texte                            { padding-right: 40px;}

@media (max-width: 1000px){
.services                                   { padding: 70px 0;}
}
@media (max-width: 700px){
.services                                   { padding: 50px 0;}
.services .bloc_grid .photo img             { min-height: 295px;}
.services .texte                            { padding: 0;}
}


/***** apropos *****/
.apropos                                    { margin: 0; padding: 110px 0 100px;}
.apropos .shapeinv                          { bottom: -70px; right: calc(50% - 50px); border-width: 0 580px 665px 580px}
.link-moins,.link-plus                      { cursor:pointer; color: #579b2e; border-bottom: 1px solid transparent;}
.textMore                                   { display: none; margin-top: 40px;}
.textMore p:not(:first-of-type)             { margin-top: 15px;}
.apropos .photo img:last-of-type            { width: 325px; margin-left: auto; margin-top: 40px;}
.apropos .sous_titre                        { font-size: 20px;}
.showroom                                   { font-size: 15px; line-height: 30px; margin-top: 20px;}
.showroom p                                 { margin-bottom: 0;}
.showroom p strong                          { font-weight: 600;}
.itineraire                                 { padding-left: 60px; background: url(../images/itineraire.svg) left center no-repeat; margin-bottom: 15px; display: inline-block; vertical-align: top; color: #000;}

@media (min-width: 1201px){
.link-moins:hover,.link-plus:hover          { border-color: #579b2e;}
}
@media (max-width: 1000px){
.apropos                                    { padding: 70px 0;}
.apropos .texte                             { position: relative; z-index: 2;}
.apropos .shapeinv                          { right: -70%;}
.apropos .photo img:last-of-type            { display: none;}
}
@media (max-width: 700px){
.apropos                                    { padding: 50px 0 40px;}
.apropos .bloc_grid .photo img              { min-height: 355px;}
.apropos .shapeinv                          { bottom: -410px; right: auto; left: calc(50% - 380px);}
.showroom                                   { font-size: 13px; line-height: 26px;}
.itineraire                                 { padding-left: 55px;}
}
    
