.zone-slide                                         {width:100%; height:calc(var(--height-head-slide)); overflow: hidden; position:relative;}
.zone-slide .slide-contener                         {width:100%; height:calc(var(--height-head-slide)); margin: auto; overflow: hidden;}
.zone-slide .slide-contener .slide                  {width:100%; height:calc(var(--height-head-slide)); background-position:top center; background-size:110% auto; transition:all 2s ease-in-out;}
.zone-slide .slide-contener .slide:hover            {transform: scale(1.02);}

.zone_cat											{position:relative; width:calc(100% - 20px); height:auto; min-height:450px; z-index:1; display:flex;  padding:10px; margin:-80px auto 80px auto;}
.zone_cat .contener 								{position:relative; width:var(--width-contener); background:#fff; color:#353535; height:auto; min-height:450px; z-index:1;}
.zone_cat .contener .contener_photo                 {display:flex;  width:calc(100% - 20px); margin:10px; height:110px; overflow: hidden; }
.zone_cat .contener .contener_photo .photo          {width:165px; height:110px; box-sizing: border-box; margin-right:10px; overflow: hidden;}
.zone_cat .contener .contener_photo .photo img      {cursor: pointer; max-width: 100%; object-fit: cover; transition:all .2s ease-in-out;}
.zone_cat .contener .contener_photo .photo img:hover {transform: scale(1.1);}
.zone_cat .contener h1                              {width:100%; line-height:65px; font-size:22px; font-weight: normal; text-align:center; color:#222; padding:0px 10px 5px 10px; background:var(--background_gen);}
.zone_cat .contener .inner                          {display:flex; flex-wrap: wrap; width:100%; justify-content: space-between;}
.zone_cat .contener .inner .col                     {width:48%}
.zone_cat .contener .inner .col h2                  {line-height:65px; font-size:16px; font-weight: normal; color:#666;  padding:0px 0px 5px 10px;}
.zone_cat .contener .inner .col .zone-price         {display:flex; width:calc(100% - 20px); margin:10px; height:45px; overflow: hidden; justify-content: space-between;}
.zone_cat .contener .inner .col .zone-price .price  {font-size:20px; font-weight:300; color:#222; width:auto; background:var(--color_theme); padding:0px 20px; line-height:45px;}
.zone_cat .contener .inner .col .zone-price .detai  {font-size:11px; line-height:15px; text-align:right;}
.zone_cat .contener .inner .col .zone-info          {width:calc(100% - 20px); margin:0px 10px; font-size:13px; line-height: 30px; border-top:solid 1px #e5e5e5; display:flex; justify-content: space-between;}
.zone_cat .contener .inner .col .zone-info .colin   {width:48%;}
.zone_cat .contener .inner .col .zone-descript      {width:calc(100% - 20px); margin:0px 10px; font-size:13px; line-height: 30px; border-top:solid 1px #e5e5e5;}

.zone_cat .contener .inner .col .graph_dpe			{position:relative; width:270px; height:250px; background:url('../img/illustration/dpe_conso_energie.png');}
.zone_cat .contener .inner .col .graph_ges			{position:relative; width:270px; height:250px; background:url('../img/illustration/dpe_emission_ges.png');}
.zone_cat .contener .inner .col .signal-cursor-pos-a	{background-image: url("../img/boutons/dpe_cursor.png"); color: #FFFFFF; font-weight: bold; text-align:center; height: 25px; width: 54px; position: absolute; right: 60px; top:27px;  line-height:25px;}
.zone_cat .contener .inner .col .signal-cursor-pos-b	{background-image: url("../img/boutons/dpe_cursor.png"); color: #FFFFFF; font-weight: bold; text-align:center; height: 25px; width: 54px; position: absolute; right: 50px; top:57px;  line-height:25px;}
.zone_cat .contener .inner .col .signal-cursor-pos-c	{background-image: url("../img/boutons/dpe_cursor.png"); color: #FFFFFF; font-weight: bold; text-align:center; height: 25px; width: 54px; position: absolute; right: 40px; top:87px;  line-height:25px;}
.zone_cat .contener .inner .col .signal-cursor-pos-d	{background-image: url("../img/boutons/dpe_cursor.png"); color: #FFFFFF; font-weight: bold; text-align:center; height: 25px; width: 54px; position: absolute; right: 30px; top:117px; line-height:25px;}
.zone_cat .contener .inner .col .signal-cursor-pos-e	{background-image: url("../img/boutons/dpe_cursor.png"); color: #FFFFFF; font-weight: bold; text-align:center; height: 25px; width: 54px; position: absolute; right: 20px; top:147px; line-height:25px;}
.zone_cat .contener .inner .col .signal-cursor-pos-f	{background-image: url("../img/boutons/dpe_cursor.png"); color: #FFFFFF; font-weight: bold; text-align:center; height: 25px; width: 54px; position: absolute; right: 10px; top:177px; line-height:25px;}
.zone_cat .contener .inner .col .signal-cursor-pos-g	{background-image: url("../img/boutons/dpe_cursor.png"); color: #FFFFFF; font-weight: bold; text-align:center; height: 25px; width: 54px; position: absolute; right: 0px; top:207px; line-height:25px;}

.zone_cat .contener .contactus                      {color:#222; background:var(--color_theme); padding:4px 20px; width: max-content; margin:50px auto; text-align:center; transition:all 0.8s ease-in-out; display:block;}
.zone_cat .contener .contactus:hover                {color:#fff;background:#333; }



@media screen and (min-width:100px) and (max-width:639px)  {
    .zone-slide                                     {height: 225px;}
    .zone-slide .slide-contener                     {height: 225px;}
    .zone_cat                                       {margin: -40px auto 80px auto;}
    .zone_cat .contener                             {width:100%;}
    .zone_cat .contener .contener_photo             {height: 55px;}
    .zone_cat .contener .contener_photo .photo      {width: 82.5px; height: 55px;}
    .zone_cat .contener .inner .col                 {width:100%;}
}