.miniorange                                                                 {color:var(--color_theme_hv); font-family: Teko; text-transform: uppercase; font-size: 25px; display: block; line-height: 1.3em;}
.mioniexpla                                                                 {font-size: 18px; display: block; line-height: 1.7em;}    

.collection                                                                 {border:none !important;}
.collection .collection-item                                                {background:none !important; border: none !important;}
.collection .collection-item .material-icons                                {color:var(--color_theme_hv); font-size: 20px; margin-right: 10px; vertical-align: middle;}      

.sinceround                                                                 {display: block; width: 90px; height: 90px; line-height: 24px; text-align: center; text-transform: uppercase; border-radius: 50%; font-size: 20px; padding: 24px 5px 21px; position: relative;}
.sinceround:before                                                          {content: ""; position: absolute; left: -10px; top: 0; width: 80px; height: 80px; background: #aaaaaa86; border-radius: 50%; display: block; z-index: -1;}
.sinceround_light                                                           {background: var(--color_theme2); color:var(--background_body1);}
.sinceround_dark                                                            {background: var(--background_body1); color:var(--color_theme2);}

.btnspec                                                                    {border-radius:7px; font-family: Teko; font-size: 22px; position: relative; display: block; width: 300px;} 
.btnspec:after                                                              {content: ""; position: absolute; left: 95%; top:0px; width: 100%; height: 100%; background: var(--background_body1); opacity: 0.2; border-radius: 7px; transition: all .3s ease;}
.btnspec:hover span                                                         {color:#fff; position: relative; z-index: 5;}
.btnspec:hover:after                                                        {opacity:1; top:0px; left:0px; z-index:4;}

.bandeaumaster                                                              {display: flex; flex-direction: column; justify-content: center; align-content: center; align-items: center; position: relative; overflow: hidden;}
.bandeaumaster                  .inneraccueil                               {font-family: Teko; width:80%; height:100%; margin:130px auto 0px auto; display: flex; flex-direction: column; justify-content: center; align-content: center; align-items: center; position: relative;}
.bandeaumaster                  .inneraccueil .ttlBig-0                     {font-size: 6vw; line-height:0.9em; font-weight: 900; text-transform: uppercase; width:100%; height:auto; display:block; margin:0px; z-index: 10; position: relative;}
.bandeaumaster                  .inneraccueil .ttlBig-1                     {text-align:center; color:var(--color_theme); animation: ease move_photo 1.3s 1.4s forwards; transform:translate(500px,0px); opacity: 0;}
.bandeaumaster                  .right-bottom-curve                         {position: absolute; right: 0; bottom: 0; width: 217px; max-width: 100%; height: 100%; max-height: 328px; background: url('../img/fond/right-curved-background2.png') 100% 100% no-repeat; z-index: 2; opacity: 0; transform: translateX(300px); animation: ease move_photo 0.8s 2.8s forwards;} 
.bandeaumaster                  .right-top-curve                            {position: absolute; right: 0; top: 0; width: 164px; max-width: 100%; height: 100%; background: url('../img/fond/right-white-curve.background.png') 100% 0 no-repeat; z-index: 2; opacity: 0; transform: translateX(200px); animation: ease move_photo 0.4s 3.2s forwards;}

.zone1                                                                      {background: var(--background_body); position: relative; display: block; border-bottom:solid 2px #f4f5f8;}
.zone1 .innerflex                                                           {width:var(--nav_contenair_p); max-width:var(--nav_contenair_m); height:auto; margin:0 auto;  display: flex; flex-direction: row; justify-content: space-between; align-content: center; align-items: flex-start; position: relative; margin: 0px auto 30px auto;}
.zone1 .innerflex:before                                                    {content: ""; position: absolute; left: 0; top: -50px; margin-left: -410px; width: 50%; height: calc(100% + 140px); background: #f4f5f8;}
.zone1 .innerflex h2                                                        {text-transform: uppercase; font-family: Teko; font-size: 70px; color:var(--color_gen); line-height: 0.9em; margin: 0px 0px 40px 0px; text-align: left;}   
.zone1 .innerflex .innerimg                                                 {width:100%; height:auto; display: block; position: relative;}
.zone1 .innerflex .innerimg:before                                          {content: ""; position: absolute; left: 0; width: 15px; height: 280px; background: var(--color_theme_hv); border-radius: 8px;}
.zone1 .innerflex .innerimg img                                             {border-radius:7px;}
.zone1 .innerflex .innerimg .img1                                           {margin:0px 0px 0px auto; float:right;}
.zone1 .innerflex .innerimg .img2                                           {margin:-10% auto 0px 0px; float:left;}

.zone2                                                                      {background: var(--background_body); position: relative; display: block; border-bottom:solid 2px #f4f5f8;}
.zone2 .innerflex                                                           {width:var(--nav_contenair_p); max-width:var(--nav_contenair_m); height:auto; margin:0 auto;  display: flex; flex-direction: row; justify-content: space-between; align-content: center; align-items: flex-start; position: relative; margin: 0px auto 30px auto;}
.zone2 .innerflex:before                                                    {content: ""; position: absolute; left: 0; top: -100px; margin-left: -410px; width: 50%; height: calc(100% + 240px); background: #f4f5f8;}
.zone2 .innerflex h2                                                        {text-transform: uppercase; font-family: Teko; font-size: 70px; color:var(--color_gen); line-height: 0.9em; margin: 0px 0px 40px 0px; text-align: left;}   
.zone2 .innerflex h3                                                        {text-transform: uppercase; font-family: Teko; font-size: 50px; color:var(--color_gen); line-height: 0.9em; margin: 0px 0px 40px 0px; text-align: left;}   
.zone2 .innerflex .innerimg                                                 {width:100%; height:auto; display: block; position: relative;}
.zone2 .innerflex .innerimg:before                                          {content: ""; position: absolute; left: 0; width: 15px; height: 280px; background: var(--color_theme_hv); border-radius: 8px;}
.zone2 .innerflex .innerimg img                                             {border-radius:7px;}
.zone2 .innerflex .innerimg .img1                                           {margin:0px auto 0px 10%;}

.zone3                                                                      {background: var(--background_head_up); position: relative; display: block;}
.zone3 .innerflex                                                           {width:var(--nav_contenair_p); max-width:var(--nav_contenair_m); height:auto; margin:0 auto;  display: flex; flex-direction: row; justify-content: space-between; align-content: center; align-items: flex-start; position: relative; margin: 0px auto 30px auto; color:#e5e5e5;}
.zone3 .innerflex h2                                                        {text-transform: uppercase; font-family: Teko; font-size: 70px; color:#fff; line-height: 0.9em; margin: 0px 0px 40px 0px; text-align: left;}   
.zone3 .innerflex h3                                                        {text-transform: uppercase; font-family: Teko; font-size: 50px; color:#fff; line-height: 0.9em; margin: 0px 0px 40px 0px; text-align: left;}   
.zone3 .innerflex .innerimg                                                 {width:100%; height:auto; display: block; position: relative;}
.zone3 .innerflex .innerimg:before                                          {content: ""; position: absolute; left: 0; width: 15px; height: 280px; background: var(--color_theme_hv); border-radius: 8px;}
.zone3 .innerflex .innerimg img                                             {border-radius:7px;}
.zone3 .innerflex .innerimg .img1                                           {margin:0px auto 0px 10%;}

.zone4                                                                      {background: var(--background_body); position: relative; display: block; border-bottom:solid 2px #f4f5f8;}
.zone4 .innerflex                                                           {width:var(--nav_contenair_p); max-width:var(--nav_contenair_m); height:auto; margin:0 auto;  display: flex; flex-direction: row; justify-content: space-between; align-content: center; align-items: flex-start; position: relative; margin: 0px auto 30px auto;}
.zone4 .innerflex .card                                                     {border-radius: 7px;}
.zone4 .innerflex .card .card-image img                                     {width:100%; object-fit: cover; border-top-left-radius:7px; border-top-right-radius: 7px; position: relative;}
.zone4 .innerflex .card .card-image:after                                   {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background:var(--color_separator); border-top-left-radius:7px; border-top-right-radius: 7px; opacity: 0; transition: all .3s ease;}
.zone4 .innerflex .card .card-content                                       {min-height: 220px; }
.zone4 .innerflex .card .card-content .card-title                           {text-transform: uppercase; font-family: Teko; font-size: 45px; color:var(--background_head_up); line-height: 0.9em; margin: 0px 0px 40px 0px; text-align: left;}   
.zone4 .innerflex .card:hover .card-image:after                             {opacity:0.35;}

.zone2b                                                                     {background: var(--background_body1) url('../img/fond/pattern-line.png') center top repeat; position: relative; display: block;}
.zone2b .innerflex                                                          {width:var(--nav_contenair_p); max-width:var(--nav_contenair_m);  height:auto; margin:0 auto; display: flex; flex-direction: row; justify-content: space-between; align-content: center; align-items: center; position: relative; margin: 0px auto 30px auto;}
.zone2b .innerflex .gagint                                                  {width:50%; padding: 0px 30px 20px 0px;}
.zone2b .innerflex h1                                                       {text-transform: uppercase; font-family: Teko; font-size: 60px; color: #fefefe; line-height: 0.9em;}   
.zone2b .innerflex h2                                                       {text-transform: uppercase; font-family: Teko; font-size: 60px; color: #fefefe; line-height: 0.9em;}   
.zone2b .innerflex p                                                        {margin: 3px 0px !important; color: #dddddd; font-size: 17px; position:relative; padding: 0px 40px; font-style: italic;}
.zone2b .innerflex p:before                                                 {content: ",,"; font-size: 95px; color: var(--color_theme_hv); position: absolute; top: 50px; left: 0px; line-height: 0px; font-family: sherif; letter-spacing: -6px; transform: rotate(180deg);}
.zone2b .innerflex p:after                                                  {content: ",,"; font-size: 95px; color: var(--color_theme_hv); position: absolute; bottom: 50px; right: 0px; line-height: 0px; font-family: sherif; letter-spacing: -6px;}
.zone2b .innerflex .sinceround                                              {position: absolute; top: -145px; left: 0px; opacity: 0; transform: translateX(-100%); animation: ease move_photo 0.4s 4.2s forwards;}
.zone2b .servicebox                                                         {background:var(--background_head_up); width:calc(100% - 100px); min-width:300px; margin:0 auto; height:calc(100% - 90px); min-height:260px; padding: 50px 45px; display: block; text-decoration: none; cursor: pointer; border-radius: 7px; overflow: hidden; transition: all .3s ease; position: relative;} 
.zone2b .servicebox:after                                                   {content:"";  height:100%; min-height:320px; width:150px; background:rgba(0,0,0,0.2); position: absolute; right:-150px; top:50%; transform-origin: top left; transition: all .2s ease;}
.zone2b .servicebox .cptnumber                                              {font-family: Teko; font-size:48px; text-align: center; color:#fff; opacity:0.07; width:50%;}
.zone2b .servicebox .miniexplain                                            {font-family: Teko; font-size: 24px; color: #fff; text-transform: uppercase; text-align: left; line-height: 26px; padding: 30px 0 0 0; letter-spacing: 0.5px;}
.zone2b .servicebox:hover                                                   {background:var(--color_theme_hv);}
.zone2b .servicebox:hover .orange-text                                      {color:#222 !important;}
.zone2b .servicebox:hover .miniexplain                                      {color:#222 !important;}
.zone2b .servicebox:hover .cptnumber                                        {opacity: 0.2;}
.zone2b .servicebox:hover:after                                             {transform: rotate(33deg);}

.paralox h3                                                                 {text-transform: uppercase; font-family: Teko; font-size: 70px; color:#e5e5e5; font-weight: 500; text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);} 

.zone-service                                                               {position: relative; display:block; width:100%;  background:url('../img/fond/back_paternblue.png') repeat; padding: 80px 0px 0px 0px;}  
.zone-service .innerflex                                                    {width:var(--nav_contenair_p); max-width:var(--nav_contenair_m);  height:auto; margin:0 auto; display: flex; flex-direction: row; justify-content: space-between; align-content: center; align-items:flex-start; position: relative; margin: 0px auto 0px auto; }
.zone-service .innerflex .image-box img                                     {border-radius:7px; }
.zone-service .innerflex .texte-box h2                                      {text-transform: uppercase; font-family: Teko; font-size: 60px; color:var(--background_body1); line-height: 0.9em;}   
.zone-service .innerflex .texte-box h3                                      {text-transform: uppercase; font-family: Teko; font-size: 45px; color:var(--background_body1); line-height: 0.9em;}   
.zone-service .innerflex .texte-box h4                                      {text-transform: uppercase; font-family: Teko; font-size: 35px; color:var(--background_body1); line-height: 0.9em;}   
.zone-service .innerflex .tariflist                                         {width:100%; height:auto; min-height:420px;  display: flex; flex-direction: column; justify-content: space-between; align-items: center; border-radius: 7px; } 
.zone-service .innerflex .tariflist .tarifbox                               {width:100%; height:auto; min-height: 450px;  display: flex; flex-direction: row; justify-content: space-between; align-items: center; padding:30px 40px; gap: 5px; position: relative; overflow: hidden; transition: all 3s ease;}
.zone-service .innerflex .tariflist .tarifbox:before                        {content: ""; position: absolute; left: 45px; top: -3px; width: 170px; height: 6px; background: var(--color_theme_hv); border-radius: 7px; }
.zone-service .innerflex .tariflist .tarifbox:hover .righttext              {top:0px;}
.zone-service .innerflex .tariflist .tarifbox:hover:before                  {left: 0px; width: calc(75% - 90px);}
.zone-service .innerflex .tariflist .tarifbox .lefttext                     {width: calc(100% - 70px); padding:10px 35px;}   
.zone-service .innerflex .tariflist .tarifbox .lefttext h4                  {text-transform: uppercase; font-family: Teko; font-size: 45px; color:var(--background_body1); line-height: 0.9em;}   
.zone-service .innerflex .tariflist .tarif                                  {color:var(--color_gen); width:100%; text-align: center;}
.zone-service .innerflex .tariflist .tarif .price                           {font-family: Teko; font-size: 100px; font-weight:400; letter-spacing:2px; color:var(--background_body1); text-transform: uppercase; display: inline-block; margin-right: 5px;}
.zone-service .innerflex .tariflist .tarif .priceinfo                       {font-size:35px;}
.zone-service .innerflex .tariflist .lefttext .collection                   {column-count: 2; }
.zone-service .innerflex .tariflist .lefttext .collection .collection-item  {background: none !important; border: none !important; font-size: 14px; letter-spacing: -0.3px; line-height: 1.1em; }
.zone-service .innerflex .tariflist .righttext                              {position: relative; top: 50px; transition: all 1.85s ease;}
.zone-service .innerflex .tariflist .righttext p                            {font-size: 13px; color: #888; margin: 0px 0px 60px 0px; text-align: center;}
.zone-service .innerflex .tariflist .righttext img                          {width: 100%; height: auto; border-radius: 7px; margin: 0px 0px 20px 0px; display: block;}  
.zone-service .innerflex .tariflist .btncontact                             {border-radius:7px; font-family: Teko; text-transform: uppercase; font-size: 20px; line-height: 50px; position: relative; display: block; width: 300px; text-align: center; padding: 7px 0px; background: var(--color_theme_hv); overflow: hidden; color: var(--background_body1);}
.zone-service .innerflex .tariflist .btncontact:after                       {content: ""; position: absolute; left: 95%; top:0px; width: 100%; height: 100%; background:var(--background_body1); opacity: 0.2; border-radius: 7px; transition: all .3s ease;}
.zone-service .innerflex .tariflist .btncontact:hover span                  {color:#fff; position: relative; z-index: 5;}
.zone-service .innerflex .tariflist .btncontact:hover:after                 {opacity:1; top:0px; left:0px; z-index:4;}


.zone-service .innerlist                                                    {width:100%; height:auto; display: flex; flex-direction: column; align-content: center; align-items:flex-start; position: relative; padding:30px 10px; background: var(--background_body1); border-radius: 7px;}      
.zone-service .innerlist h3                                                 {text-transform: uppercase; font-family: Teko; font-size: 28px; color: #fefefe; line-height: 0.9em; margin: 5px 15px 30px auto;}   
.zone-service .innerlist .servicebox                                        {width:100%; height:auto; display: flex; flex-direction: row; justify-content: space-between; align-items: center;  padding: 5px 20px; transition: all .3s ease; line-height:35px; gap:5px; color:#fff; text-decoration: none; border-left:solid 5px var(--background_body1); transition: all 0.4s; border-radius: 7px;}
.zone-service .innerlist .servicebox:hover                                  {background:#000; color:#fff; text-decoration: none; border-left: solid 5px var(--color_theme_hv);}
.zone-service .innerlist .servicebox .miniexplain                           {font-family: Teko; font-size: 20px; color: #fff; text-transform: uppercase; text-align: left !important; letter-spacing: -0.1px; width: calc(100% - 20px); padding-left: 20px;}  
.zone-service .innerlist .servicebox .cptnumber                             {width: 35px; height: 30px; background: #f5f5f5; color: #666; text-align: center; border-radius: 50%; line-height: 23px; padding: 4px; font-size: 12px;} 
.zone-service .innerlist .shortline                                         {line-height:0.95em;}


.zone-service .innerhelp                                                    {width:100%; height:auto; display: flex; flex-direction: column; align-content: center; align-items:flex-start; position: relative; padding:30px 10px; background: var(--background_gen); border-radius: 7px; margin-top:20px;}      
.zone-service .innerhelp  h3                                                {text-transform: uppercase; font-family: Teko; font-size: 28px; color: var(--background_body1); line-height: 0.9em; margin: 5px 15px 10px auto;}   
.zone-service .innerhelp  h4                                                {text-transform: uppercase; font-family: Teko; font-size: 22px; color: var(--background_body1); line-height: 0.9em; margin: 5px 15px 10px auto;}   
.zone-service .innerhelp .helpbox                                           {width:100%; height:auto; display: flex; flex-direction: column; justify-content: space-between; align-items: center;  padding: 5px 20px; transition: all .3s ease; line-height:35px; gap:5px; color:var(--color_gen);}

.zone-service .innercpt                                                     {width:100%; height:auto; display: flex; flex-direction: column; align-content: center; align-items:flex-start; position: relative; padding:50px 30px; background: var(--background_gen);}      
.zone-service .innercpt  h3                                                 {text-transform: uppercase; font-family: Teko; font-size: 28px; color: var(--background_body1); line-height: 0.9em; margin: 5px auto 40px 0px;}   
.zone-service .innercpt  h4                                                 {text-transform: uppercase; font-family: Teko; font-size: 22px; color: var(--background_body1); line-height: 0.9em; margin: 5px auto 20px 0px;}   

.zone-service .innercps                                                     {width:100%; height:auto; display: flex; flex-direction: column; align-content: center; align-items:flex-start; position: relative; padding:50px 30px; background: var(--background_body1); color:var(--color_theme);}      
.zone-service .innercps  h3                                                 {text-transform: uppercase; font-family: Teko; font-size: 28px; color: var(--color_theme); line-height: 0.9em; margin: 5px auto 40px 0px;}   
.zone-service .innercps  h4                                                 {text-transform: uppercase; font-family: Teko; font-size: 22px; color: var(--color_theme); line-height: 0.9em; margin: 5px auto 20px 0px;}  

@keyframes move_photo           {to {transform:translate(0px,0px); opacity:1;}}


@media only screen and (max-width: 601px) {
    .width25,.width50, .width40, .width60                                   {width: 100% !important;}
    .bandeaumaster .inneraccueil .ttlBig-0                                  {font-size: 13vw;}
    .zone1 .innerflex                                                       {flex-direction: column !important;}
    .zone1 .innerflex  h2                                                   {font-size: 60px; margin-top: 50px;}
    .zone1 .innerflex .pl30                                                 {padding: 0px 10px !important;}
    .zone1 .innerflex .pr30                                                 {padding: 0px 10px !important;}
    .zone1 .innerflex .innerimg img                                         {width:100%;}
    .paralox h3                                                             {font-size: 50px;}
    .zone2 .innerflex                                                       {flex-direction: column !important;}
    .zone2 .innerflex  h2                                                   {font-size: 60px; margin-top: 50px;}
    .zone2 .innerflex .pl30                                                 {padding: 0px 10px !important;}
    .zone2 .innerflex .pr30                                                 {padding: 0px 10px !important;}
    .zone2 .innerflex .innerimg .img1                                       {margin:0px auto 0px auto; float:none;}   
    .zone2 .innerflex .innerimg img                                         {width:100%; margin:0px auto;}

    .zone3 .innerflex                                                       {flex-direction: column !important;}
    .zone3 .innerflex  h2                                                   {font-size: 60px; margin-top: 50px;}
    .zone3 .innerflex .pl30                                                 {padding: 0px 10px !important;}
    .zone3 .innerflex .pr30                                                 {padding: 0px 10px !important;}
    .zone3 .innerflex .innerimg .img1                                       {margin:0px auto 0px auto; float:none;}   
    .zone3 .innerflex .innerimg img                                         {width:100%; margin:0px auto;}


    .zone4 .innerflex .card                                                 {width: 95%; margin: 10px auto;}
        
}