@import url('https://fonts.googleapis.com/css?family=Text+Me+One&display=swap');

@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 200;
  src: local('Source Sans Pro ExtraLight Italic'), local('SourceSansPro-ExtraLightItalic'), url(../font/SourceSansPro-ExtraLightItalic.woff2) format('woff2'), url(../font/SourceSansPro-ExtraLightItalic.svg#SourceSansPro-ExtraLightItalic) format('svg');
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 300;
  src: local('Source Sans Pro Light Italic'), local('SourceSansPro-LightItalic'), url(../font/SourceSansPro-LightItalic.woff2) format('woff2'), url(../font/SourceSansPro-LightItalic.svg#SourceSansPro-LightItalic) format('svg');
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 200;
  src: local('Source Sans Pro ExtraLight'), local('SourceSansPro-ExtraLight'), url(../font/SourceSansPro-ExtraLight.woff2) format('woff2'), url(../font/SourceSansPro-ExtraLight.svg#SourceSansPro-ExtraLight) format('svg');
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 300;
  src: local('Source Sans Pro Light'), local('SourceSansPro-Light'), url(../font/SourceSansPro-Light.woff2) format('woff2'), url(../font/SourceSansPro-Light.svg#SourceSansPro-Light) format('svg');
}


@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 400;
  src: local('Source Sans Pro Regular'), local('SourceSansPro-Regular'), url(../font/SourceSansPro-Regular.woff2) format('woff2'), url(../font/SourceSansPro-Regular.svg#SourceSansPro-Regular) format('svg');
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 400;
  src: local('Source Sans Pro Regular Italic'), local('SourceSansPro-Italic'), url(../font/SourceSansPro-Italic.woff2) format('woff2'), url(../font/SourceSansPro-Italic.svg#SourceSansPro-Italic) format('svg');
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: normal;
  font-weight: 700;
  src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), url(../font/SourceSansPro-Bold.woff2) format('woff2'), url(../font/SourceSansPro-Bold.svg#SourceSansPro-Bold) format('svg');
}
@font-face {
  font-family: 'Source Sans Pro';
  font-style: italic;
  font-weight: 700;
  src: local('Source Sans Pro Bold Italic'), local('SourceSansPro-BoldItalic'), url(../font/SourceSansPro-BoldItalic.woff2) format('woff2'), url(../font/SourceSansPro-BoldItalic.svg#SourceSansPro-BoldItalic) format('svg');
}


@font-face {
  font-family: 'Roboto Condensed';
  font-style: italic;
  font-weight: 300;
  src: local('Roboto Condensed Light Italic'), local('RobotoCondensed-LightItalic'), url(../font/RobotoCondensed-LightItalic.woff2) format('woff2'), url(../font/RobotoCondensed-LightItalic.svg#RobotoCondensed-LightItalic) format('svg');
}
@font-face {
  font-family: 'Roboto Condensed';
  font-style: italic;
  font-weight: 400;
  src: local('Roboto Condensed Italic'), local('RobotoCondensed-Italic'), url(../font/RobotoCondensed-Italic.woff2) format('woff2'), url(../font/RobotoCondensed-Italic.svg#RobotoCondensed-Italic) format('svg');
}
@font-face {
  font-family: 'Roboto Condensed';
  font-style: italic;
  font-weight: 700;
  src: local('Roboto Condensed Bold Italic'), local('RobotoCondensed-BoldItalic'), url(../font/RobotoCondensed-BoldItalic.woff2) format('woff2'), url(../font/RobotoCondensed-BoldItalic.svg#RobotoCondensed-BoldItalic) format('svg');
}
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 300;
  src: local('Roboto Condensed Light'), local('RobotoCondensed-Light'), url(../font/RobotoCondensed-Light.woff2) format('woff2'), url(../font/RobotoCondensed-Light.svg#RobotoCondensed-Light) format('svg');
}
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto Condensed'), local('RobotoCondensed-Regular'), url(../font/RobotoCondensed-Regular.woff2) format('woff2'), url(../font/RobotoCondensed-Regular.svg#RobotoCondensed-Regular) format('svg');
}
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 700;
  src: local('Roboto Condensed Bold'), local('RobotoCondensed-Bold'), url(../font/RobotoCondensed-Bold.woff2) format('woff2'), url(../font/RobotoCondensed-Bold.svg#RobotoCondensed-Bold) format('svg');
}


*{
	box-sizing:border-box;
}

html {
	margin:0; padding:0;
	width:100%;
	height:100%;
}

body {
    font-size: 100%; /* HELP to keep font-size indentical on all browser iOS and android ! */
}

body {
	margin:0; padding:0;
	background : #ffffff;
	font-size: 16px;
	line-height: 18px;
	color : black;
	width:100%;
	height:100%;
	font-family: 'Source Sans Pro', sans-serif
}

#JS_we_are_on_mobile_phone { display:none;}
.hide_on_not_mobile { display:none;}

form {margin:0; padding:0;}

label, input, textarea, select, button { 
  font-family: 'Source Sans Pro', sans-serif; font-size:18px;
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
}
select {color:#000000;}
select::-ms-expand {
    display: none;
}

input[type="checkbox"],input[type="radio"] {
    -webkit-appearance:normal;
    -moz-appearance:normal;
    appearance:normal;  
}

input:focus, select:focus         { outline:none; }

label {
  font-size: 14px;
  color: #333;
  text-transform: uppercase;
  width: 100%;
  float: left;
  line-height: 28px;
}

select, input, textarea {
  border:0;
  border-bottom: 1px solid #e5e5e5;
  font-style: italic;
  width: 100%;
  padding: 6px;
  float: right;
  background-color: #ffffff;
}

select {
  padding-right: 20px;
  background-image: url(../img/bottom.png);
  background-position: right 50%;
  background-repeat: no-repeat;
}

select.mini_select { width:50px;  }
label.label_mini_select { width:calc(100% - 60px); line-height: 33px; white-space: nowrap; }

#member_birth_y { width:28%; }
#member_birth_m { width:48%; margin-right:2%; }
#member_birth_d { width:20%; margin-right:2%; }

/* START --- SPECIFIK CLASS FOR checkbox style */

/* Cachons la case à cocher */
input[type="checkbox"]:not(:checked),
input[type="checkbox"]:checked {
  position: absolute;
  left: -9999px;
  visibility: hidden;
}
 
/* on prépare le label */
input[type="checkbox"]:not(:checked) + label,
input[type="checkbox"]:checked + label {
  position: relative; /* permet de positionner les pseudo-éléments */
  /* padding-left: 25px; /* fait un peu d'espace pour notre case à venir */
  cursor: pointer;    /* affiche un curseur adapté */
}

input[type="checkbox"].align_left:not(:checked) + label.align_left,
input[type="checkbox"].align_left:checked + label.align_left {
  padding-left: 30px;
  box-sizing: border-box;
}

/* Aspect des checkboxes */
/* :before sert à créer la case à cocher */
input[type="checkbox"]:not(:checked) + label:before,
input[type="checkbox"]:checked + label:before {

  content: '';
  position: absolute;
  right:0; top: 3px;
  width: 18px; height: 18px; /* dim. de la case */
  border: 2px solid  #cccccc;/*009fe3*/
  /*background: #f8f8f8;*/
  border-radius: 3px; /* angles arrondis */
  /*box-shadow: inset 0 1px 3px rgba(0,0,0,.3); /* légère ombre interne */

  /*background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
  */
  background:#ffffff;
}


input[type="checkbox"]:checked + label:before {
  border: 2px solid  #35b2c3;/*009fe3*/
  transition: border .2s; /* on prévoit une animation */
}

input[type="checkbox"].align_left:not(:checked) + label.align_left:before,
input[type="checkbox"].align_left:checked + label.align_left:before {
   left:0;
}
 
/* Aspect général de la coche */
input[type="checkbox"]:not(:checked) + label:after,
input[type="checkbox"]:checked + label:after {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  opacity: 0;
  content: '';
  position: absolute;
  width: 8px;
  height: 4px;
  background: transparent;
  top:9px;
  right: 5px;
  border: 3px solid #35b2c3;
  border-top: none;
  border-right: none;

  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
  transition: all .2s; /* on prévoit une animation */
}
/* Aspect général de la coche */
input[type="checkbox"].align_left:not(:checked) + label.align_left:after,
input[type="checkbox"].align_left:checked + label.align_left:after {
  left: 5px;
}


/* Aspect si "pas cochée" */
input[type="checkbox"]:not(:checked) + label:after {
  opacity: 0; /* coche invisible */
  /*transform: scale(0); /* mise à l'échelle à 0 */
}
/* Aspect si "cochée" */
input[type="checkbox"]:checked + label:after {
  opacity: 1; /* coche opaque */
  /*transform: scale(1); /* mise à l'échelle 1:1 */
}

/*- --- -*/

/* aspect désactivée */
input[type="checkbox"]:disabled:not(:checked) + label:before,
input[type="checkbox"]:disabled:checked + label:before {
  box-shadow: none;
  border-color: #bbb;
  background-color: #ddd;
  opacity: 0.5;
}
/* styles de la coche (si cochée/désactivée) */
input[type="checkbox"]:disabled:checked + label:after {
  color: #999;
  opacity: 0.5;
}
/* on style aussi le label quand désactivé */
input[type="checkbox"]:disabled + label {
  color: #aaa;
}
 
/* aspect au focus de l'élément */
input[type="checkbox"]:checked:focus + label:before,
input[type="checkbox"]:not(:checked):focus + label:before {
  /*border: 1px dotted blue;*/
}



input[type="checkbox"].brico_deliver:not(:checked) + label:before,
input[type="checkbox"].brico_deliver:checked + label:before {
left:0; top: -2px;
}
input[type="checkbox"].brico_deliver:not(:checked) + label:after,
input[type="checkbox"].brico_deliver:checked + label:after {
left:6px; top: 4px;
}

input[type="checkbox"].main_doe_ck:not(:checked) + label:before,
input[type="checkbox"].main_doe_ck:checked + label:before {
left:0; top: -2px;
}
input[type="checkbox"].main_doe_ck:not(:checked) + label:after,
input[type="checkbox"].main_doe_ck:checked + label:after {
left:6px; top: 4px;
}



select.member_abo_activated_green { background-color: #a4c408; background-image:url(../img/bottom_white.png);
    color: #ffffff;
    font-weight: bold; }
select.member_abo_activated_red { background-color: #e8505b; background-image:url(../img/bottom_white.png);
    color: #ffffff;
    font-weight: bold; }
/* END --- SPECIFIK CLASS FOR checkbox style */



.page-footer, .page-wrap:after {
  /*height: 280px; */
}
.page-footer {
  background: #35b2c3;
  border-top:1px solid #ffffff;
    /*z-index: 10;
    position: relative;*/
    position: relative;
     color:#ffffff;
}

.page-footer-container {
  width:960px; margin:0 auto; padding-top:20px; padding-bottom:20px;
  /*padding-left: 320px;*/
 /* font-size: 0.8rem;
  line-height: 1.5em;*/
}
.page-footer-ico-container {
  float:right;
  width:140px;
  margin-right:-5px;
}

.page-footer-col-container {
  float:left;
  width: calc(100% - 160px);
  /*font-size: 0.8rem;*/
  color:#ffffff;
}

.page-footer-col-container h3 { font-size:26px; color:#f1ff12; text-transform: uppercase; font-weight:normal;}

.page-footer-col-left-a {
  float:left;
  width:calc(33.33% - 0px);
  padding-right:20px;
  border-right: 1px solid #64d0de;
  min-height:270px;
}

.page-footer-col-left-b {
  float:left;
  width:calc(33.33% - 0px);
  padding-left:20px;
  padding-right:20px;
  border-right: 1px solid #64d0de;
  min-height:270px;
}

.page-footer-col-left-c {
  float:right;
  width:calc(33.33% - 0px);
  padding-left:20px;
  min-height:270px;
  
}

.page-footer-col-left-a ul, .page-footer-col-left-b ul, .page-footer-col-left-c ul{
  margin:0; padding:0;
}

.page-footer-col-left-a li, .page-footer-col-left-b li, .page-footer-col-left-c li{
  list-style-type: none; 
  border-bottom:1px solid #ffffff;
  padding-bottom:5px; margin-bottom:5px;
}

.page-footer-col-left-a li a, .page-footer-col-left-b li a, .page-footer-col-left-c li a,
.page-footer-col-left-a li a:active, .page-footer-col-left-b li a:active, .page-footer-col-left-c li a:active,
.page-footer-col-left-a li a:visited, .page-footer-col-left-b li a:visited, .page-footer-col-left-c li a:visited,

.page-footer-col-left-a a, .page-footer-col-left-b a, .page-footer-col-left-c a,
.page-footer-col-left-a a:active, .page-footer-col-left-b a:active, .page-footer-col-left-c a:active,
.page-footer-col-left-a a:visited, .page-footer-col-left-b a:visited,  .page-footer-col-left-c a:visited{
  color:#ffffff;
  text-decoration: none;
    border-bottom: 1px solid #64d0de;
    padding-bottom: 7px;
    margin-bottom: 7px;
    display: block;
}

.page-footer-col-left-a li a:hover, .page-footer-col-left-b li a:hover,  .page-footer-col-left-c li a:hover,
.page-footer-col-left-a a:hover, .page-footer-col-left-b a:hover, .page-footer-col-left-c a:hover{
  color:#ffffff;
  text-decoration: underline;
}

.ico_fb,
.ico_yt,
.ico_instagram,
.ico_gmap {
  float:right; width:60px; height:60px; background-size:30px; background-repeat: no-repeat; background-position: center;
  background-color: #ffffff; border-radius: 6px;margin:5px;
}
.ico_fb { background-image:url(../img/fb_grey.svg); }
.ico_yt { background-image:url(../img/twitter_grey.svg); background-size:34px }
.ico_instagram { background-image:url(../img/linkedin_grey.svg); background-size:26px; }
.ico_gmap { background-image:url(../img/gmap_grey.svg); }
.ico_fb:hover { background-image:url(../img/fb_red.svg); }
.ico_yt:hover { background-image:url(../img/twitter_red.svg); background-size:34px }
.ico_instagram:hover { background-image:url(../img/linkedin_red.svg); background-size:26px; }
.ico_gmap:hover { background-image:url(../img/gmap_red.svg); } 

.antispam {width:100px; float:left; text-align: center; font-size:23px; font-weight:bold; height: 36px; line-height:36px; border:1px solid #cccccc;}
.antispam span:nth-child(odd) {display:none;}
.contact_map { display:inline-block; width:100%; height:240px; background: #ffffff url(../img/map_ee.jpg) no-repeat center; background-size: cover; border: 1px solid #999999; margin-bottom:10px;}

.class24sur24{ 
    background: #a4c408;
    display: inline-block;
    color: #ffffff;
    padding: 11px;
    border-radius: 13px;
}

.homepage_mazout_extra_box_item {
    width: 100%;
    min-height: 80px;
    background: #eeeeee url(../src/icon_type_fenetre/cuve-a-mazout-extra.png) no-repeat 15px center;
    background-size: 60px;
    margin-bottom: 10px;
    padding-left: 90px;
    border-radius: 6px;

    text-decoration: none;
    display: block;
    color:  #000000;
}
.homepage_mazout_extra_box_item_title {
    font-size: 20px;
    float: left;
    padding-top: 15px;
}
.homepage_mazout_extra_box_item_price {

    font-size: 25px;
    float: right;
    padding-top: 26px;
    text-align: right;
    font-weight: bold;
    padding-right: 25px;
    color: #35b2c3;

}
.homepage_mazout_extra_box_item_price_abo {
    text-align: right;
    padding-right: 25px;
    padding-bottom: 20px;
    font-weight: bold;
    /* font-size: 25px; */
    color: #a4c408;
}
.homepage_mazout_extra_box_item_price_abo_price {
  font-size: 25px; 
}


.home_page_day_prices_mazout_extra_contact_page .homepage_mazout_extra_box_item  {
  background-color: #ffffff;
}


/* ----------------- SLIDE SHOW --------------- */

.col_full_width_all_other_pages {
  position:relative;
  width:100%; height: 450px;
  /*margin-top:70px;*/
  background-color: #eeeeee;
  text-align: center;
}

.col_full_width {
  position:relative;
  width:100%; height:600px;  
  margin-top:70px;
  background-color: #eeeeee;
}

.col_full_width_slide {
  opacity:0;
  width:100%; height:600px;  
  position:absolute;
  top:0; left:0; right:0; bottom:0; 
  -webkit-transition: opacity 0.9s ease-in-out;
    -moz-transition: opacity 0.9s ease-in-out;
    transition: opacity 0.9s ease-in-out;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    pointer-events : none;
}
.col_full_width_slide_1 {
  background-image: url(../img/slider-1.jpg);
}
.col_full_width_slide_2 {
  background-image: url(../img/slider-2.jpg);
}
.col_full_width_slide_3 {
  background-image: url(../img/slider-3.jpg);
}
.col_full_width_slide_4 {
  background-image: url(../img/slider-4.jpg);
}
.col_full_width_slide_active {
  opacity:1;
  pointer-events : auto;
}

.col_full_width_slide_filter_dark {
  width:100%; height:600px;  
  position:absolute;
  top:0; left:0; right:0; bottom:0; z-index:6;
  /*background-color: rgba(47,29,25,0.2);  */
  background-color: rgba(0,0,0,0.5);  
  background-color: rgba(0,0,0,0.2); 
}

.col_full_width_slide_in {
  /*pointer-events : auto;*/
  font-size: 2rem;
  color: #ffffff;
  /*font-family: 'Text Me One', sans-serif;*/
  letter-spacing: .8px;
  text-shadow: 1px 1px 2px #000000;
  margin: auto;
  width:60%;
  /*margin-left:15%;
  padding-left:15%;
  padding-right:15%;*/
  position:relative;
  line-height: normal;
  z-index:7;
}

.col_full_width_slide_in_big_title {
  font-size: 2.5rem;
  font-weight:normal;
  text-transform: uppercase;
  line-height: normal;
}

.col_full_width_slide_in_btn, .col_full_width_slide_in_btn:hover, .col_full_width_slide_in_btn:visited, .col_full_width_slide_in_btn:active,
.basic_btn, .basic_btn:hover, .basic_btn:visited, .basic_btn:active 
 {
  padding:10px;  padding-left:15px;  padding-right:15px;  background-color: #a4c408; display:inline-block;
  color: #ffffff;
  /*text-shadow: 1px 1px 2px #000000;*/
  text-decoration: none;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  /*-webkit-box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.75);
  -moz-box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.75);
  box-shadow: 2px 2px 0px 0px rgba(0,0,0,0.75);*/
  cursor:pointer;
  text-shadow: none;
  /*font-family: 'Text Me One', sans-serif;*/
  border:1px solid #a4c408;
      font-size: 26px;
}
.col_full_width_slide_in_btn { display:inline-block; margin-top:20px;}
.basic_btn_baf { border:1px solid #D69948; }

.basic_btn_margin_top { margin-top:20px;}
.basic_btn_white_bg { background-color: #ffffff; }
.basic_btn_white_bg:hover {border:1px solid #ffffff;}

.basic_btn_baf:hover { background-color: #D69948;  }

.col_full_width_slide_ariane_container {
  width:100%; height:30px;  
  position:absolute;
  left:0; right:0; bottom:0; 
  opacity: 0.9; z-index:7;
}
.col_full_width_slide_ariane_bullet {
  display: inline-block; background-color: #ffffff; width:14px; height:14px; 
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  margin-left:10px; margin-right:10px;
  box-shadow: 0px 0px 0px 5px rgba(255,255,255,0.3); 
  border:2px solid #ffffff;  
  cursor:pointer;    
}
.col_full_width_slide_ariane_bullet_active {
  background-color: #a4c408 ;
}

.col_full_width_slide_navig_left {
  width:40px; height:40px;  
  position:absolute;
  left:20px; top:50%; margin-top: 10px; 
  background-color: #ffffff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  margin-left:10px; margin-right:10px;
  box-shadow: 0px 0px 0px 5px rgba(255,255,255,0.3); 
  border:2px solid #ffffff;  
  opacity: 0.9; 
  background-image: url(../img/back.svg);
  background-position: 45% 50%;
    background-repeat: no-repeat;
    background-size: 60%;
    cursor:pointer;
    z-index:7;
 }
.col_full_width_slide_navig_right { 
  width:40px; height:40px;  
  position:absolute;
  right:20px; top:50%; margin-top: 10px; 
  background-color: #ffffff;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  margin-left:10px; margin-right:10px;
  box-shadow: 0px 0px 0px 5px rgba(255,255,255,0.3); 
  border:2px solid #ffffff; 
  opacity: 0.9;  
  background-image: url(../img/next.svg);
  background-position: 55% 50%;
    background-repeat: no-repeat;
    background-size: 60%;
    cursor:pointer;
    z-index:7;
}


/* TOOL TIPS */
.tool_tips {
    line-height: 37px;
    width: 40px;
    height: 40px;
    border-radius: 4px;
    display: inline-block;
    vertical-align: middle;
    background: #fceb7b;
    border: 1px solid #999999;
    color: #000000;
    font-weight: normal;
    font-size: 23px;
    text-align:center;
}
.tool_tips_content {
  display:none; width:0; height:0;
}
.tool_tips_before{
  display: inline-block;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 5px 5px 5px 0;
  border-color: transparent #999999 transparent transparent;
  margin-left:5px;
}

#NEW_ACC_member_pass,
#NEW_ACC_member_pass_verif,
#NEW_ACC_member_pass_clear,
#NEW_ACC_member_pass_verif_clear,
#RESCUE_member_pass,
#RESCUE_member_pass_verif,
#RESCUE_member_pass_clear,
#RESCUE_member_pass_verif_clear,
#member_pass,
#member_pass_verif,
#member_pass_clear,
#member_pass_verif_clear,
#filter_client_pro { 
  width: calc(100% - 40px); 
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  -webkit-border-top-left-radius: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -moz-border-radius-topleft: 4px;
  -moz-border-radius-bottomleft: 4px;
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
}


#NEW_ACC_member_pass_clear,
#NEW_ACC_member_pass_verif_clear,
#RESCUE_member_pass_clear,
#RESCUE_member_pass_verif_clear,
#member_pass_clear,
#member_pass_verif_clear  {display:none}

#comment_pass_validation,
#comment_pass_verif_validation,
#NEW_ACC_comment_pass_validation,
#NEW_ACC_comment_pass_verif_validation,
#RESCUE_comment_pass_validation,
#RESCUE_comment_pass_verif_validation {
  position:absolute;
  top: 31px;
  width: 200px;
  left: 99%;
  display: none;
}

#comment_pass_validation b,
#comment_pass_verif_validation b,
#NEW_ACC_comment_pass_validation b,
#NEW_ACC_comment_pass_verif_validation b,
#RESCUE_comment_pass_validation b,
#RESCUE_comment_pass_verif_validation b { 
  float: left;
  width: 17px;
  height: 40px;
  background-image: url(../img/infobulle_arrow.svg);
  background-repeat: no-repeat;
  background-position: left 10px;
  background-size: 20px;
}

#comment_pass_validation span,
#comment_pass_verif_validation span,
#NEW_ACC_comment_pass_validation span,
#NEW_ACC_comment_pass_verif_validation span,
#RESCUE_comment_pass_validation span,
#RESCUE_comment_pass_verif_validation span {
  float:left;
  width: calc(100% - 17px);
  background-color: #fdf294;
  padding: 15px;
  -webkit-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
  -moz-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
  box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
  border-left:2px solid #35b2c3;
}

a.fake_btn_float_right { float:right;}


a.fake_btn_side_end {
  width:40px;
  float:right;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 0px;
  -webkit-border-top-right-radius: 4px;
  -webkit-border-bottom-right-radius: 4px;
  -moz-border-radius-topright: 4px;
  -moz-border-radius-bottomright: 4px;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  padding: 6px;
  background-color: #35b2c3;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 18px;
  line-height: normal;
  text-decoration: none;
}

a.fake_btn_view {  
  background-image: url(../img/view.svg);
  background-repeat: no-repeat;
  background-position: center; 
  background-size: 28px;
}

a.fake_btn_view_off {  
  background-image: url(../img/view_off.svg);
  background-repeat: no-repeat;
  background-position: center; 
  background-size: 28px;
}


.clear { clear:both;}

#website_header {
  width:100%;
  background:#35b2c3;
  /*min-height:730px;*/
  min-height:100px;
  position:relative;
}
.main_menu {
  position:fixed;
  width:100%;
  top:0;
  left:0;
  right:0;
  height:100px;
  background:#2a9faf;
  z-index:990;
}
.main_menu_in {
  width:960px;
  margin:0 auto;
  margin-top: 15px;
}
.main_menu_logo {
  background: url(../img/easyenergylogowhite.svg) no-repeat center left;
  background-size: contain;
  width:250px;
  height:60px;
  float:left;
}
.main_menu_content {
  float:right;
  width: calc(100% - 280px);
  text-align:right;
}
.main_menu_content ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.main_menu_content ul li {display:inline-block; position:relative; padding:0; text-align:center; cursor:pointer; background-color: transparent; font-weight:bold; color:#ffffff; background:rgba(255,255,255,0); transition-property: background; border-radius:6px; transition-duration: 0.3s; transition-delay: 0.15s;}
.main_menu_content ul li a {text-decoration: none;  color:#ffffff; display:inline-block; padding-left:10px; padding-right:10px;  position:relative; padding-top:25px;  padding-bottom:30px; }

.main_menu_content ul ul { display: none; position:absolute; width:720px; /*margin-top:30px;*/ left:-320px; background-color: #ffffff; text-align:left; border-radius:6px; box-shadow: 0px 0px 16px 0px rgba(0,0,0,0.25);}



.main_menu_content ul ul:before {
   content: "";
   display: block;
   position: absolute;
   left: 350px;
   top: -10px;
   border-bottom: 10px solid #ffffff;
   border-left: 10px solid transparent;
   border-right: 10px solid transparent;
}


/* special case for last sub (member tools)*/
.main_menu_content ul .user_logged  ul {right:0; left:auto;}
.main_menu_content ul .user_logged  ul:before {
  left:auto;
  right: 20px;
}

.main_menu_content ul ul li { display: inline-block; margin:0; margin:5px; width:calc(50% - 10px); min-height:104px; vertical-align: top; color:#000000;   padding:0; font-weight:bold; text-align:left; position: relative; }
.main_menu_content ul ul li a { display:block; text-decoration: none; color:#000000; padding:20px; padding-left:80px; position: relative;}


.main_menu_content ul ul li:hover { background:#eeeeee;}
.main_menu_content ul ul li:first-child {
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
} 
.main_menu_content ul ul li:last-child {   
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}


.main_menu_content ul li:hover  {
  
  background:rgba(255,255,255,0.15);
  transition-delay: 0s;
}
/* HOVEr IS replaced by Click in JAVASCRIPT */
/*.main_menu_content ul li:hover ul  {
  display: block;
}*/

.highlight_this_menu {background: rgb(164,196,8) !important;
background: linear-gradient(180deg, rgba(164,196,8,1) 40%, rgba(42,159,175,1) 90%) !important; transition-delay: 0s !important; transition-property: none !important; transition-duration: none !important;}
.highlight_this_menu:hover { background: rgb(164,196,8) !important;  border-radius: 6px !important;  }
.highlight_this_submenu {
  font-weight: bold;
  color: #a4c408 !important;
}

.menu_item_comment {display: block; margin-top:10px; color:#666666; font-weight:normal;}
.menu_item_image {position: absolute; top:25px; left:20px; width:50px; height:50px; background-position: center; background-repeat: no-repeat; background-size: 40px}

.hello_word_menu {position: absolute; display: block; top: 8px; left: 12px; font-size: 12px; color:#ffffff; }
.mobile-menu-item-label .hello_word_menu { color:red; position: relative; color: #606060; top:0px; left: 0px; text-transform:none; }

.main_banner {padding-top:130px; width:960px; margin:0 auto; text-align: center; height:710px; padding-bottom:50px;}
.main_banner_title, h1.main_banner_title  { 
   margin:0;
  font-size: 50px;
  color: #ffffff;
  width: 40%;
  text-transform: uppercase;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  line-height: normal;
  text-align: left;
  color:#a4c408;
  background: -webkit-linear-gradient(45deg, #a4c408, #f1ff12 80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: bold; 
  float:left;


}
.main_banner_sub_title {
  margin-top:30px;
  font-size: 24px;
  text-transform: none;
  color:#ffffff;
  background: -webkit-linear-gradient(#ffffff, #ffffff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: normal;
}
.main_banner_visual {
  background: url(../img/ee.png) no-repeat top center;
  background-size: contain;
  width: 60%;
  height:600px;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  float:right;
}

.come-in-left {
  opacity:0;
  transform: translate(-150px, -50%);
  animation: come-in-left 0.8s ease forwards;

}
.come-in-left:nth-child(odd) {
  animation-duration: 0.6s; /* So they look staggered */
}

@keyframes come-in-left {
  to { transform: translate(0,-50%); opacity:1; }
}

.come-in-right {
  opacity:0;
  transform: translate(150px, -50%);
  animation: come-in-right 0.8s ease forwards;

}
.come-in-right:nth-child(odd) {
  animation-duration: 0.6s; /* So they look staggered */
}

@keyframes come-in-right {
  to { transform: translate(0,-50%); opacity:1; }
}


.related_faq_container_global {
  width:100%;
  border-top:1px solid #666666; min-height:200px;
  margin-top:100px;
}
.related_faq_container_visual {
    border-radius: 20px;
    border: 1px solid #666666;
    /* min-height: 200px; */
    margin: 0 auto;
    margin-top: -60px;
    width: 120px;
    height: 120px;
    background: #ffffff url(../img/faq.svg) no-repeat center 0px;
    background-size: 110%;
    float: right; }
.related_faq_container_title {
  font-size: 30px;
    width: 100%;
    text-transform: uppercase;
    margin-top: 30px;
    margin-bottom: 20px;
    line-height: normal;
}
.related_faq_container_negative_margin {/* margin-left:-10px; margin-right:-10px; width: calc(100% + 20px);*/}
.related_faq_container {
  /*width:calc(50% - 20px);
  margin:10px;*/
  width: 100%;
  margin-bottom:10px;
  padding:20px;
  /*float:left;*/
  padding-right: 10px;
  background: #eeeeee;
  border-right: 5px solid #cccccc;
}
.related_faq_question { 
font-weight:bold;
cursor:pointer;
padding-right:40px;
background: url(../img/arrow-down-right-margin-grey.svg) no-repeat right center;     background-size: 30px;
}
.related_faq_response { padding-top:15px;
display:none;}

.banner_commune_livraison {
  width: 100%;
    min-height: 340px;
  background: #eeeeee url(../img/comm_mazout_a.png) no-repeat center;
  background-size: 300px;
  position: relative;
}

.banner_contrat_energie, .banner_contrat_energie_home { 
  width: 960px;
    min-height: 500px;
    position: relative;
    background: #ffffff url(../img/abonnement_visu.svg) no-repeat -263px 24px;
    background-size: 1138px;
    border-bottom: 1px solid #333333;
    margin:  0 auto;
    margin-top: -20px; 

display: flex;
justify-content: right; /* align horizontal */
align-items: center; /* align vertical */

  }
.banner_contrat_energie_stripe { 
    font-size: 32px;
    line-height: normal;
    width: 36%;
  }



.banner_contrat_energie_home_stripe_title1, h2.banner_contrat_energie_home_stripe_title1 {
  margin:0;
  font-size: 40px;
                color: #ffffff;
                text-transform: uppercase;
                text-align: center;
                color: #a4c408;
font-weight: normal;
              }
.banner_contrat_energie_home_stripe_title2 {font-size: 30px; font-weight:bold;margin-top:20px}
.banner_contrat_energie_home_stripe_title3 {font-size: 18px;margin-top:5px}

.banner_groupage { min-height: 580px;
  background: #ffffff url(../img/groupage.svg) no-repeat center 23px;
    background-size: 72%; 
justify-content: center;
    align-items: end;
}
.banner_groupage_stripe { 
  font-size: 32px;
  line-height: normal;
  width: 80%;
  text-align: center;
  padding-bottom: 30px;
}

.banner_a_propos { min-height: 480px;
  background: #ffffff url(../img/group-pana.svg) no-repeat center 23px;
    background-size: 150%;
justify-content: center;
    align-items: normal;
}
.banner_a_propos_stripe { 
  font-size: 32px;
  line-height: normal;
  width: 80%;
  text-align: center;
  padding-top: 70px;
}

.banner_contact { 
  background: transparent url(../img/group-pana.svg) no-repeat center 70px;
width: 100%;
    min-height: 420px;
    background-size: 115%;
justify-content: center;
    align-items: normal;
}
.banner_contact_stripe { 
  font-size: 32px;
  line-height: normal;
  width: 80%;
  text-align: center;
  padding-top: 30px;
}

.banner_parrainage { 
  min-height: 530px;
  background: #ffffff url(../img/sponsor.svg) no-repeat right 21px;
  background-size: 58%;
  justify-content: left;
  align-items: center;
}

.banner_parrainage_stripe { 
  font-size: 32px;
  line-height: normal;
  width: 41%;
  text-align: center;
  padding-left: 20px;
}

.main_col_parrainage {
padding-left:50%; background:url(../img/sponsor_2.svg) no-repeat  30px center; background-size: 400px; }


.banner_installation_de_sonde {
  min-height: 530px;
  background: #ffffff url(../img/sonde.svg) no-repeat right 21px;
  background-size: 80%;
  justify-content: left;
  align-items: center;
}

.banner_installation_de_sonde_stripe {
  font-size: 32px;
  line-height: normal;
  width: 41%;
  text-align: center;
  padding-left: 20px;
}

.banner_installation_de_borne_de_recharge {
  min-height: 369px;
  background: #ffffff url(../img/borne.svg) no-repeat right -66px;
  background-size: 80%;
  justify-content: left;
  align-items: normal;
}

.banner_installation_de_borne_de_recharge_stripe {
  font-size: 32px;
  line-height: normal;
  width: 65%;
  text-align: center;
  padding-left: 20px;
  padding-top: 72px;
}

.banner_drive_in {
  min-height: 430px;
  background: #ffffff url(../img/drive_in.svg) no-repeat right -30px;
  background-size: 80%;
  justify-content: left;
  align-items: normal;
}

.banner_installation_de_drive_in_stripe {
  font-size: 32px;
  line-height: normal;
  width: 65%;
  text-align: center;
  padding-left: 20px;
  padding-top: 72px;
}

.banner_adblue {
  min-height: 430px;
  background: #ffffff url(../img/adblue.svg) no-repeat right -7px;
  background-size: 77%;
  justify-content: left;
  align-items: normal;
}

.banner_adblue_stripe {
  font-size: 32px;
  line-height: normal;
  width: 45%;
  text-align: center;
  padding-left: 20px;
  padding-top: 72px;
}

.banner_pellet {
  min-height: 430px;
  background: #ffffff url(../img/pellets.svg) no-repeat left -7px;
  background-size: 77%;
  justify-content: right;
  align-items: normal;
}

.banner_pellet_stripe {
  font-size: 32px;
  line-height: normal;
  width: 45%;
  text-align: center;
  padding-right: 20px;
  padding-top: 52px;
}

.banner_energies_de_chauffage {
  min-height: 430px;
  background: #ffffff url(../img/combustible_choice.svg) no-repeat 40px -7px;
  background-size: 49%;
  justify-content: right;
  align-items: center;
}

.banner_energies_de_chauffage_stripe {
  font-size: 32px;
  line-height: normal;
  width: 45%;
  text-align: center;
  padding-right: 20px;
  padding-top: 0px;
}

.banner_energies_de_roulage {
  min-height: 430px;
  background: #ffffff url(../img/carburant_choice.svg) no-repeat 40px -7px;
  background-size: 76%;
  justify-content: right;
  align-items: start;
}

.banner_energies_de_roulage_stripe {
  font-size: 32px;
  line-height: normal;
  width: 45%;
  text-align: center;
  padding-right: 20px;
  padding-top: 55px;
}





.banner_livraison_a_domicile {width: 100%; min-height: 710px; position: relative; background: #eeeeee  url(../img/bg_home_delivery.jpg) no-repeat center; background-size: 1180px;}
.banner_livraison_sur_chantier {width: 100%; min-height: 710px; position: relative; background:#eeeeee  url(../img/bg_chantier_delivery.jpg) no-repeat center; background-size: 1180px;}

.banner_livraison_a_domicile_col_container { width:1078px; margin: 0 auto; padding-left:40px; padding-right:40px;  padding-top:500px; text-align:center; font-size:23px;font-family: 'Source Sans Pro', sans-serif; line-height:26px; text-transform:uppercase }
.banner_livraison_a_domicile_col_A {width:calc(33.33% - 100px); margin-left:0px; margin-right:100px; float:left; height:100px; padding-left:0px; padding-right:0px; color:#ffffff; }
.banner_livraison_a_domicile_col_B {width:calc(33.33% - 0px); margin-left:0px; margin-right:0px; float:left; height:100px; padding-left:35px; padding-right:35px; color:#ffffff; }
.banner_livraison_a_domicile_col_C {width:calc(33.33% - 100px); margin-left:100px; margin-right:0px; float:left; height:100px; padding-left:0px; padding-right:0px; color:#ffffff;}
.banner_livraison_a_domicile_col_txt {}
/* ---- devis --- */
.rayon_action_nok, .rayon_action_ok {
  display:none;
  width:100%;
  text-align: left;
  padding:20px;
  padding-left:60px;
  background-position: center left;
  background-repeat: no-repeat;
  background-size: 40px;
}
.rayon_action_nok {background-image: url(../img/nok.png); }
.rayon_action_ok {background-image: url(../img/ok.png); }
.rayon_action_nok span, .rayon_action_ok span { font-weight:bold; display: block; font-size: 18px;}

#co_res, #co_res_NEW_ACC, #co_res_tank, #co_res_tank_in_devis, #co_res_inv_add, #co_res_inv_add_in_devis, #co_res_invoice, #co_res_for_groupe {
  width: 100%;
  height: 120px;
  background: #ffffff;
  position: absolute;
  z-index: 100;
  padding: 10px;
  border:1px solid #cccccc;
  -webkit-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
  -moz-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
  box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
  display:none;
  overflow-y : scroll;
}

.co_res_line {
  padding:7px; border-bottom: 1px solid #cccccc;
  display: block; text-decoration: none; color: #000000;

}
.co_res_line:hover {
  background: #35b2c3; color:#ffffff;
}

.pay_solution_container { margin-top:20px; text-align: center}
.pay_solution_item { display:inline-block; width:30%; text-align: center}
.pay_solution_label_container { display:inline-block;}
.pay_solution_order_total_container { display:inline-block; background:#a4c408; padding:10px; margin-left:10px; border-radius:6px; color:#FFFFFF; font-weight:bold; font-size:18px }


/* ----- avatar -- */

.avatar_container{border: 2px solid #ffffff; width:70px; height:70px; display:inline-block; margin-right:7px;margin-top:7px; background-color: #ffffff; border-radius:4px; background-position: center; background-repeat: no-repeat; background-size: 80% }
.avatar_container_selected {border: 2px solid #35b2c3;}
/* --- CURVE --- */

.stats_banner {padding-top:50px; padding-bottom:50px; width:960px; margin:0 auto; text-align: center; }
.stats_banner_title, h3.stats_banner_title  { 
  margin:0;
  font-size: 40px;
  color: #ffffff;
  width: 100%;
  text-transform: uppercase;
  line-height: normal;
  text-align: left;
  color:#a4c408;
  font-weight: normal;
}
.stats_banner_sub_title {
  margin-bottom:30px;
  font-size: 18px;
  text-transform: none;
  color:#000000;
}

#weight_curve_force_scroll_left_placeholder {width:960px; height:370px}
#sonde_histo_conso_placeholder {width:960px; height:280px}
#weight_curve_force_scroll_left {width:960px; overflow-y: hidden; vertical-align:top; overflow-x: scroll; padding-top:10px; padding-bottom:0px; margin: 0 auto; border-left: 1px solid #cccccc;}
#weight_curve_force_scroll_left_in {width:auto;}

.curve_label_point{
    cursor:pointer;
    position:absolute; 
    width:60px; 
    height:38px; 
    line-height:38px; 
    text-align: center;  
    background-color:#a0c64c; 
    -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; 
    padding:0;
    color:#ffffff; font-weight: bold;
    -webkit-transition: width  0.2s, padding 0.2s, background-color 0.2s; /* Safari 3.1 to 6.0 */
    transition: width  0.2s, padding 0.2s, background-color 0.2s;
    z-index:9; 
    font-size:14px;
    /*border:2px solid white;*/
}
.curve_label_point .curve_label_point_extention {
    display:none;
    box-sizing: initial;
    text-align: left;  
    width: 282px;
}
.curve_label_point_pressed { 
    white-space: nowrap;
    /*background-color:red !important; */
    width: 276px; padding-left:15px; padding-right:10px;
    z-index:10; 
}

.curve_label_point_icon_rapport {
   width:45px; height: 45px; border-radius: 45px;  background: #ffffff url(../img/loupe.svg) no-repeat center; background-size: 66%; z-index:12; 
}

.curve_label_point_bg {
  width: 100px;
  text-align: center;
  position: absolute;
  top: -99px;
  bottom: -37px;
  /*background: #eeeeee;
  border-right: 1px solid #eeeeee;
  border-left: 1px solid #eeeeee;*/
  margin-left: -10px;
  background: linear-gradient(#eeeeee, #eeeeee) no-repeat center/1px 100%;
}

.curve_label_point_pressed.curve_label_point_weight, .curve_label_point_product_price_off_down_2000 {background-color: #35b2c3 !important; }
.curve_label_point_pressed.curve_label_point_masse_grasse, .curve_label_point_product_price {background-color: #a4c408 !important; }

.curve_label_point_pressed .curve_label_point_extention { display: inline-block;    vertical-align: top;}
.curve_label_point_pressed .curve_label_point_icon_rapport { position: absolute; right: 6px; top: 6px; }


/* --- END CURVE --- */







/*--- commun template all other page */


.main_col { padding-top:50px; padding-bottom:50px; width:960px; margin:0 auto; text-align: left;  }
.mail_col_title, h1.mail_col_title {
    font-size: 40px;
    width: 100%;
    text-transform: uppercase;
    line-height: normal;
    text-align: left;
    color: #a4c408;
    margin:0;
    font-weight:normal;
}

.mail_col_title_h2, h2.mail_col_title_h2 {
    font-size: 30px;
    width: 100%;
    line-height: normal;
    text-align: left;
    margin:0;
    font-weight:normal;
}


.col_bon_a_savoir { border-radius:10px; border: 1px solid #eeeeee;  padding:30px; margin-top:50px; padding-left:280px; 
background-color:#eeeeee; background-position: 50px center; background-repeat:  no-repeat; background-size:160px;
}
.col_bon_a_savoir_contrat_energie {background-color: #ffffff; background-image: url(../img/contrat_appro.svg); background-position: left center; background-size: 46%; padding:0; padding-left: 46%;}
.col_bon_a_savoir_installation_de_borne_de_recharge {background-color: #ffffff; background-image: url(../img/batterie.svg); background-position: 67px -20px; background-size: 33%; padding:0; padding-left: 46%;}
.col_bon_a_savoir_pellet {background-color: #ffffff; background-image: url(../img/drive_in_bas.svg); background-position: 0px -20px; background-size: 46%; padding:0; padding-left: 46%;}
.col_bon_a_savoir_energie_chauff {background-color: #ffffff; background-image: url(../img/group-pana.svg); background-position: -100% 35%; background-size: 82%; padding:0; padding-left: 46%;}


.col_bon_a_savoir_contrat_energie_txt { background: #eeeeee; padding:30px }
.col_bon_a_savoir_projet_vert {background-color: #eeeeee; background-image: url(../img/logo_plantC.svg); background-position: 100px center; background-size: 280px; padding:30px; padding-left: 46%;}

.col_bon_a_savoir_commune_livraison {background-color: #ffffff; background-image: url(../img/comm_mazout_c.png); background-position: left center; background-size: 46%; padding:0; padding-left: 46%;}


.mail_col_title_bon_a_savoir, h2.mail_col_title_bon_a_savoir {
    font-size: 30px;
    width: 100%;
    text-transform: uppercase;
    line-height: normal;
    text-align: left;
    color: #000000;
    font-weight: normal;
    margin:0;
}

/*  tree banner */

.tree_banner_bg {background: #ffffff;  }
.tree_banner {padding-top:50px; padding-bottom:50px; width:960px; margin:0 auto; text-align: center; line-height: normal;  }
.tree_banner_title { 
  margin: 0;
  color:#35b2c3; 
  font-size: 40px;

    width: 100%;
    text-transform: uppercase;
    line-height: normal;
    text-align: left;
font-weight: normal;
  }

.tree_visual_hook { background: url(../img/plant.png) no-repeat center bottom;
    background-size: contain;
    width: 100%;
    height: 450px;
    margin: 0 auto; text-align:left; margin-top:0px }
.tree_visual_hook_dedicated_page { border-bottom:1px solid #cccccc;  }

.tree_visual_hook_txt_container { width:100%; padding-top:0px }

.tree_visual_hook_txt_big { margin-top:15px; font-size: 45px;
    color: #666666;
    width: 100%;
    text-transform: uppercase; }
.tree_visual_hook_txt_small { margin-top:10px; font-size: 26px; font-weight:normal;
    color: #333333;
    width: 100%;
    /*text-transform: uppercase; */}
.tree_visual_hook_btn { 
  /*margin-top:15px;*/
    border: 1px solid #a4c408;
    background: #a4c408;
    color: #ffffff;
    border-radius: 6px;
    text-decoration: none;
    text-align: center;
    width: auto;
    box-sizing: border-box;
    font-size: 18px;
    padding: 20px;
    padding-top: 12px;
    padding-bottom: 13px;
    padding-left: 46px;
    background-image: url(../img/next.png);
    background-repeat: no-repeat;
    background-position: 9px center;
    background-size: 26px; }

/* num counter */

.numCounter {
  display: inline-block;
  height: 80px;
  line-height: 80px;
  text-shadow: 0 0 2px #666666;
  font-weight: bold;
  white-space: normal;
  font-size: 50px;

}

.numCounter > div {
  display: inline-block;
  vertical-align: top;
  height: 80px;
}

.numCounter > div > b {
  display: inline-block;
  width: 48px;
  height: 80px;
  margin: 0 3px;
  border-radius: 6px;
  text-align: center;
  background: #666666;
-webkit-box-shadow: inset 3px 2px 7px 2px rgba(0,0,0,0.32); 
box-shadow: inset 3px 2px 7px 2px rgba(0,0,0,0.32);
  overflow: hidden;
}

.numCounter > div > b::before {
  content: ' 0 1 2 3 4 5 6 7 8 9 ';
  display: block;
  word-break: break-all;
  -webkit-transition: 0.5s cubic-bezier(0.75, 0.15, 0.6, 1.15), text-shadow 150ms;
  transition: 0.5s cubic-bezier(0.75, 0.15, 0.6, 1.15), text-shadow 150ms;
}

.numCounter > div > b.blur {
  text-shadow: 2px 1px 3px rgba(0, 0, 0, 0.5), 
               0 0.1em 2px rgba(102, 102, 102, 0.6), 
               0 0.3em 3px rgba(102, 102, 102, 0.3), 
               0 -0.1em 2px rgba(102, 102, 102, 0.6), 
               0 -0.3em 3px rgba(102, 102, 102, 0.3);
}

.numCounter > div > b[data-value="1"]::before { margin-top: -80px; }
.numCounter > div > b[data-value="2"]::before { margin-top: -160px;}
.numCounter > div > b[data-value="3"]::before { margin-top: -240px;}
.numCounter > div > b[data-value="4"]::before { margin-top: -320px;}
.numCounter > div > b[data-value="5"]::before { margin-top: -400px;}
.numCounter > div > b[data-value="6"]::before { margin-top: -480px;}
.numCounter > div > b[data-value="7"]::before { margin-top: -560px;}
.numCounter > div > b[data-value="8"]::before { margin-top: -640px;}
.numCounter > div > b[data-value="9"]::before { margin-top: -720px;}

.numCounter > div:nth-last-child(3n)::before {
  content: ",";
  display: inline;
  font-size: 1.1em;
  /*opacity: .6;*/
  color: #666666;
}


.numCounter {
  /*overflow: hidden;*/
  /*padding: .4em;*/
  text-align: center;
 
  /*border-radius: 16px;
  background: black;*/
}
.numCounter b {
  color:#ffffff;
}



.tbl_choice_container {text-align:center; padding-top:30px;}
.tbl_choice_container_col_A {box-sizing: content-box; background:#eeeeee; padding:20px; min-height:200px; float:left; width:calc(33.33% - 60px); border-radius:6px}
.tbl_choice_container_col_C {box-sizing: content-box; background:#eeeeee; padding:20px; min-height:200px; float:right; width:calc(33.33% - 60px); border-radius:6px}

.tbl_choice_container_col_D {box-sizing: content-box; background:#eeeeee; padding:20px; min-height:200px; float:left; width:calc(50% - 60px); border-radius:6px}
.tbl_choice_container_col_E {box-sizing: content-box; background:#eeeeee; padding:20px; min-height:200px; float:right; width:calc(50% - 60px); border-radius:6px}


.tbl_choice_container_col_B  {overflow:hidden; position:relative; box-sizing: content-box; background:#a4c408; padding:35px; min-height:200px; float:left; width:calc(33.33% - 60px); margin-left:15px; margin-right:10px; border-radius:6px; border: 0px solid #a4c408; margin-top: -15px;}
.tbl_choice_container_col_B_deco {background: #c0e410;
                width: 800px;
                height: 800px;
                position: absolute;
                top: -51%;
                left: -49%;
                border-radius: 500px}
.tbl_choice_container_col_B_triangle {width: 0;
              height: 0;
              border-style: solid;
              border-width: 0 140px 140px 0;
              border-color: transparent #ffffff transparent transparent;
              position: absolute;
              top: 5px;
              right: 5px;}
.tbl_choice_container_col_B_medal {    width: 90px;
    height: 90px;
    background: url(../img/best-seller.svg) no-repeat center;
    background-size: 70px;
              position: absolute;
              top: 0;
              right: 0;}
.tbl_choice_container_col_illu {position: relative;z-index:10; font-weight: bold;
                background-repeat:  no-repeat ;
                background-position: center top;
                background-size: 90px;
                min-height: 160px;
                padding-top: 115px;
                font-size: 25px; border-bottom:1px solid #cccccc}
.tbl_choice_container_col_desc {position: relative; z-index:10;
                min-height: 80px;
                border-bottom:0px solid #cccccc;  padding-top:20px; padding-bottom:20px;}
.tbl_choice_container_col_avantages {position: relative; z-index:10;

                min-height: 360px; overflow:hidden;
                padding-top:20px; padding-bottom:20px;    background: #ffffff; text-align:left; padding: 10px; border-radius: 4px;     border: 5px solid #ffffff;
}
.tbl_choice_container_col_avantages_carburant {position: relative; z-index:10;

                min-height: 150px; overflow:hidden;
                padding-top:20px; padding-bottom:20px;    background: #ffffff; text-align:left; padding: 10px; border-radius: 4px;     border: 5px solid #ffffff;
}
.tbl_choice_container_col_avantages_title {font-weight: bold;
                  text-align: center;
                  padding-bottom: 10px;
                  background: #eeeeee;
                  margin-top: -10px;
                  margin-left: -10px;
                  margin-right: -10px;
                  padding-top: 10px;
                  margin-bottom: 10px;}
.tbl_choice_container_col_avantages_item {padding-top:5px; padding-bottom:5px; border-bottom:1px solid #eeeeee}

/*-- order banner  */

.order_visual_hook { background: url(../img/hook_commande.png) no-repeat left center;
    background-size: 730px;
    width: 100%;
    height: 395px;
    margin: 0 auto; text-align:left; margin-top:50px }

.order_visual_hook_txt_container { width:300px; margin-left: 650px; padding-top:30px }
.order_visual_hook_logo {  background: url(../img/easyenergylogowhite.svg) no-repeat center;
    background-size: 80%;
    width: 200px;
    height: 60px;
    border-radius:6px; border:1px solid #ffffff }
.order_visual_hook_txt_big { margin-top:15px; font-size: 45px;
    color: #ffffff;
    width: 100%;
    text-transform: uppercase; }
.order_visual_hook_txt_small { margin-top:10px; font-size: 20px; font-weight:bold;
    color: #ffffff;
    width: 100%;
    text-transform: uppercase; }
.order_visual_hook_btn { 
  margin-top:15px;
    display: inline-block;
    border: 1px solid #35b2c3;
    background: #35b2c3;
    color: #ffffff;
    border-radius: 6px;
    text-decoration: none;
    text-align: center;
    width: auto;
    box-sizing: border-box;
    font-size: 18px;
    padding: 20px;
    padding-top: 12px;
    padding-bottom: 13px;
    padding-left: 46px;
    background-image: url(../img/next.png);
    background-repeat: no-repeat;
    background-position: 9px center;
    background-size: 26px; }


.order_banner_bg {background: #a4c408;  }
.order_banner, .order_banner___hook {padding-top:50px; padding-bottom:50px; width:960px; margin:0 auto; text-align: center; line-height: normal;  }
.order_banner_title, h3.order_banner_title { 
  margin:0;
  font-size: 40px;
  color: #ffffff;
  width: 100%;
  text-transform: uppercase;
  line-height: normal;
  text-align: left;
  font-weight: normal;
}
.order_banner_sub_title {
  margin-bottom:30px;
  font-size: 18px;
  text-transform: none;
  color:#000000;
}

.order_basket_container {
    background: #ffffff;
    padding: 20px;
    float: left;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}

.order_admin_tools_on {
    background: #fce66a;
    padding: 20px;
    float: right;
    -webkit-border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}
.order_module { width:960px; background:#ffffff; padding:30px; border-radius:6px; position:relative; overflow-y:hidden; min-height:440px; transition: height 0.3s; -webkit-border-radius: 6px;
    -webkit-border-top-left-radius: 0;
    -moz-border-radius: 6px;
    -moz-border-radius-topleft: 0;
    border-radius: 6px;
    border-top-left-radius: 0;}
.order_total_container{
    display: inline-block;
    padding-top: 5px;
    padding-bottom: 5px;
}
.order_total_qty_container {
    display: inline-block;
    padding-top: 5px;
    padding-bottom: 5px;
    /*margin-left: 20px;*/
    margin-right: 20px;
    padding-left: 20px;
    margin-right: 20px;
    padding-right: 20px;
    border-right: 1px solid #cccccc;
    /*border-left: 1px solid #cccccc;*/
}
.order_total_qty_container{  top: 35px; }
.order_total_container{  top: 65px; }



.order_steps_container {
  width:80%;  text-align: center; margin:0 auto;margin-top:20px; margin-bottom:30px;
}
.order_steps_container_dot {
  width:40px; height:40px; line-height:40px; background: #cccccc; border-radius:6px; display:inline-block; font-size: 20px; font-weight:bold; color:#666666;
}
.order_steps_container_line {
  width:40px; height:21px; border-bottom:2px solid #cccccc; display:inline-block; vertical-align: top; margin-left:-4px; margin-right:-4px;
}
.order_steps_container_dot_done { background: #a4c408; color:#ffffff; }
.order_steps_container_line_done { border-bottom:2px solid #a4c408; }
.order_steps_container_dot_current { background: #35b2c3; color:#ffffff; }
.order_steps_container_line_current { border-bottom:2px solid #35b2c3; }

.order_all_slide_container {
  width:100%; /*height:400px;*/ overflow-x:hidden;
  /*scroll-behavior: smooth; position: relative;*/
}
.order_all_slide_container_extended {
  width:800%; /*height:350px;*/ position: relative;
}
.order_all_slide {
  width:12.5%; display:inline-block;  position: relative;
  /*top: 50%;
  transform: translateY(-50%);*/
  vertical-align: top;
  overflow-y:hidden;
  height:auto;
}

#order_client_corporate_domain_container, #order_client_id_groupage_container { display:none; }

#product_qty_container { display:none; white-space: nowrap;}

.option_qty_arrow {
    width: 0;
    display: inline-block;
    height: 0;
    border-style: solid;
    border-width: 10px 10px 10px 0;
    border-color: transparent #35b2c3 transparent transparent;
    margin-left: -10px;
    margin-top: 60px;
}
.option_qty_container {    
    text-align:left; transition: all 0.3s ease-in-out; opacity:1; white-space: nowrap;  display:inline-block; width:140px; height:140px;  margin: 4px; border-radius:6px;  ; border: 1px solid #35b2c3; background: #35b2c3;}
.option_qty_container_hide { width:0; opacity:0; margin-left: -20px; }

.option_style_css {display:block; position:relative; vertical-align:top; width:300px; text-align:center; margin: 0 auto;}
.need_help { width:100px; height:50px; display: block; float:left; background: #ffffff url(../img/help.png) no-repeat center; background-size: contain; margin-left:10px;border: 1px solid #35b2c3;
    border-radius: 6px; cursor:pointer; }

.order_all_slide_left_visual { float:left; width:200px; height:200px; background: #ffffff url(../img/ee_step_1.png) no-repeat top center; background-size: 66%; }
.order_all_slide_right_form { float:right; width:calc(100% - 200px); text-align:left; min-height:250px;}
.order_product_item_container {text-align:center; margin-bottom:20px;}
.order_product_item {width:140px; height:140px; margin:4px; border-radius:6px; display: inline-block; text-align: center; vertical-align: top; border:2px solid transparent; background:#eeeeee; padding:10px; position: relative; cursor: pointer;}
.order_product_item_selected{border:2px solid #35b2c3;}
.order_product_item_canot_be_selected{opacity: 0.35}
.order_product_item_image {width:100%; height:80px; background-position: center; background-repeat: no-repeat; background-size: 60px;     display: block;}

.order_product_item_mini {width: 80px; height: 80px; }
#order_client_pro_refill_citerne .order_product_item_image {background-image: url(../img/oil-tank.png)}
#order_client_pro_refill_machine .order_product_item_image {background-image: url(../img/bulldozer.png)}
#order_client_pro_refill_one_shot .order_product_item_image {background-image: url(../img/calendar_one_shot.png)}
#order_client_pro_refill_frequence .order_product_item_image {background-image: url(../img/calendar_frequence.png)}


#order_client_you_are_single .order_product_item_image {background-image: url(../img/politician.png)}
#order_client_you_are_group .order_product_item_image {background-image: url(../img/groupe.png); background-size:94px}
#order_client_you_are_company .order_product_item_image {background-image: url(../img/construction-worker.png)}
.order_product_item_label {display:flex; justify-content:center; align-items:center; width:100%;height:30px;vertical-align: middle}
/*.order_product_item_container .order_product_item:last-child { border:0;}*/
.order_all_slide_title {
  font-size: 30px;
  line-height: normal;
}

.class_top_sale:before {
    content: "";
    display: inline-block;
    width: 50px;
    height: 50px;
    border-radius:50px;
    background-color: #ffffff;
    background-image: url(../img/best-seller.svg);
    background-repeat: no-repeat;
    background-position:center;
    background-size:40px;
    position: absolute;
    left: 44px;
    top: -30px;
}

.order_all_slide_form { margin-top:20px;}
.order_all_slide_form label {font-weight: normal; display:inline-block; width:30%; float:none; font-size: 17px; text-transform: none;}
.order_all_slide_form input, .order_all_slide_form select {font-weight: bold;
  display: inline-block;
  width: 30%;
  padding: 10px;
  border: 1px solid #666666;
  border-radius: 3px;
  min-height: 45px;
  float:none;
}
.order_all_slide_form select { padding-right: 30px };

/*select { 
  background:  url(../img/arrow-down-sign-to-navigate.png) no-repeat right 15px center;;
  background-size:16px;
  padding-right:40px;
} */

#label_order_qty_produit{ width:20%;}
#order_qty_produit { width:20%;}
#order_qty_produit_other { width:12%; opacity:1; transition: width 0.5s ease-in-out;   }
.order_qty_produit_other_hide {width:0 !important; opacity:0 !important;}
#label_order_qty_produit_res { width:38%;}
#label_order_qty_produit_res_tot { padding:10px; border:1px solid #eeeeee; background-color: #eeeeee; display: inline-block; margin-left:20px;}
.order_all_slide_container_footer { width: 100%; margin-top:20px;}

.label_order_qty_option{ display:none !important }
.order_all_slide_form input.order_qty_option { position: absolute;
    left: 50%;
    top: 15px;
    margin-left:-20px;
    width: 40px; text-align: center }
.label_order_qty_option_res { position: absolute;
    right: 5px; left: 5px;
    line-height: 48px;   text-align: center;  top: 51px;}
.label_order_qty_option_res_tot { 

    position: absolute;
    bottom: 0;
    left: 5px;
    right: 5px;
    line-height: 40px;
    width: auto;
    bottom: 8px;
    border-radius: 4px;
    background: #35b2c3;
    border: 1px solid #ffffff;
     text-align: center;
     color: #ffffff;
    font-weight: bold;

 }

input[type=button] { display: inline-block; padding: 10px;
    border: 1px solid #35b2c3; background:#35b2c3; color:#ffffff; border-radius:6px;
    text-decoration: none;
    text-align: center;
    width: auto;
    float: right;
    box-sizing: border-box;
    font-size: 18px;
    padding: 20px;
    padding-top: 12px;
    padding-bottom: 13px;
    padding-left: 46px;
    background-image: url(../img/next.png);
    background-repeat: no-repeat;
    background-position: 9px center;
    background-size: 26px;
    cursor:pointer;
  }

input[type=button].back_arrow { 
    border: 1px solid #35b2c3;
    float: left;
    padding-left: 0;
    background-color: #ffffff;
    background-image: url(../img/back.png);
    background-position: center;
    background-size: 15px;
    overflow: hidden;
    width: 46px;
    white-space: nowrap;
    text-indent: 40px;
  }

input[type=button].add_sign { 
    display:inline-block; 
    float:none;
    border: 1px solid #35b2c3;
    color: #35b2c3;
    background-color: #ffffff;
    background-image: url(../img/add.png);
    background-size: 19px;
    background-position: 14px center;
  }

input[type=button].kdo_sign { 
    display:inline-block; 
    float:none;
    border: 1px solid #35b2c3;
    color: #35b2c3;
    background-color: #ffffff;
    background-image: url(../img/cadeau.png);
    background-size: 32px;
    background-position: 7px center;
  }


input[type=button].btn_margin_top { 
    margin-top:20px;
  }

input[type=button].btn_mini { 
    padding:10px;
    padding-top: 8px;
    padding-bottom: 8px;
    background-image: none;
    margin-top:10px;
    float:none;
    display:block;
    width:100%;
  }
    

input[type=button].inline { display: inline-block; float:none;}

input[type=button].orange { background-color: #fa692a; border: 1px solid #fa692a; background-image: url(../img/close_white.svg); background-size:22px; }
input[type=button].remove_inv_add_go, input[type=button].remove_tank_go { float:left; }

.myspace_menu {
  width:150px;
  height:150px;
  display: block;
  float:left;
  background-color:#eeeeee;
  margin-right:5px;
  margin-bottom:5px;
  background-size: 50%;
  background-repeat: no-repeat;
  background-position:center 20px ;
  position:relative;
}  
.myspace_menu span { height:56px; text-align:center; display: block; width:100%; padding:10px; position: absolute; bottom:0px; font-size: 14px; font-weight : bold; color:#000000;}

.calendar_legende_container {text-align: center; font-size: 18px; margin-top: 10px;}
.order_calendar_container, .frequence_calendar_container { float:left; width:calc(100% - 100px);}
.frequence_calendar_container { float:none; width:100% }
.order_calendar_container_nav_mobile_container  {display:none;}
.order_calendar_container_nav_left {float:left; width:50px; height:208px; }
.order_calendar_container_nav_right {float:left; width:50px; height:208px; }
.order_calendar_nav_left { width:40px; height:208px; margin:0 auto; position: relative; top: 50%; transform: translateY(-50%); background:#35b2c3 url(../img/arrow-white-left.png) no-repeat center; background-size:16px; border-radius:6px;  }
.order_calendar_nav_right { width:40px; height:208px; margin:0 auto; position: relative; top: 50%; transform: translateY(-50%); background:#35b2c3 url(../img/arrow-white-right.png) no-repeat center; background-size:16px; border-radius:6px;  }
.order_calendar_day, .frequence_calendar_day { width:calc(16.66% - 1px); float:left; min-height:208px; border-right: 1px solid #cccccc; }
.frequence_calendar_day {min-height: auto; width:calc(20% - 1px);}
.order_calendar_day:first-child, .frequence_calendar_day:first-child { width:calc(16.66% - 2px); border-left: 1px solid #cccccc;}
.order_calendar_day_gone, .frequence_calendar_day_gone { opacity:0.6;}
.order_calendar_day_label, .frequence_calendar_day_label { width:100%; padding-top:20px; padding-bottom:20px; font-weight:bold; }
.order_calendar_day_morning, .frequence_calendar_day_full { width:calc(100% - 8px); background: #eeeeee; height: 62px; margin:4px; padding-top:16px; }
.order_calendar_day_afternoon { width:calc(100% - 8px); background: #eeeeee; height: 62px; margin:4px; margin-top:0; margin-bottom:0; padding-top:16px; }
.order_calendar_day_morning_saturday, .order_calendar_day_tomorrow { background :#ffc457;}

.order_calendar_dispo, .frequence_calendar_dispo {position:relative; width:calc(100% - 20px); background-color:#a4c408; background-image: url(../img/arrow-white-right.png); background-repeat: no-repeat; background-position: center; background-size:16px; border-radius:60px; height:32px;  margin:0 auto;  }
.order_calendar_dispo_start, .frequence_calendar_dispo_start { float:left; font-weight:bold; color:#ffffff; line-height: 30px; margin-left:10px;}
.order_calendar_dispo_end, .frequence_calendar_dispo_end { float:right; font-weight:bold; color:#ffffff; line-height: 30px; margin-right:10px;}
.order_calendar_dispo_gone, .frequence_calendar_dispo_gone { background:#bbbbbb; color:#666666; font-weight:bold; line-height: 30px;}

.order_calendar_day_bloc_selected .order_calendar_dispo, .frequence_calendar_day_bloc_selected .frequence_calendar_dispo { background-color: #35b2c3; }

.frequence_start_date_container, .frequence_end_date_container, .frequence_type_date_container { margin-bottom:10px; }

.order_info_cuve_col_left { width: calc(50% - 1px); float:left; border-left:1px solid #cccccc; height:208px; text-align:left;}
.order_info_cuve_col_right { width: calc(50% - 1px); float:right; height:208px; text-align:left;}
.input_raw label, .input_raw select, .input_raw input { width:48%; }
.input_raw label.label_full_width { width:100%; }
.order_all_slide_form input.input_full_width  { width:100%; }
.order_all_slide_form textarea {  
  width: 100%;
  padding: 10px;
  border: 1px solid #666666;
  border-radius: 3px;
  min-height: 100px;
  } 



.recap_header_container, .recap_raw_container {text-align: left;background:  #eeeeee; border-top: 1px solid #bbbbbb; padding: 5px; font-weight: bold; min-height: 40px;}
.recap_raw_container {background:  none; font-weight: normal;}
.recap_raw_container:last-child { border-bottom: 1px solid #bbbbbb; }
.recap_raw_container_option { border-top:1px dashed #cccccc;}
.recap_col_edition {float: left; width: 80px; height:30px;}
.recap_raw_container_option .recap_col_edition {border: 5px solid #ffffff; margin-top: -8px; }
.recap_col_float {float: left;width:  calc(100% - 80px); padding-top: 5px; pointer-events: none;}
.recap_col_float_admin {float: none; width:  100% ;}
.recap_col_produit {float: left; width: 50%; padding-right: 5px;}
.recap_col_qty {float: left; width: 15%; white-space: nowrap;}
.recap_col_fois {float: left; width: 5%; text-align: center;}
.recap_col_price_per_unit {float: left; width: 15%; white-space: nowrap;}
.recap_col_prix {float: left; width: 15%; text-align: right; white-space: nowrap;  }

.edit_product { cursor:pointer; display:inline-block; width:30px; height:30px; margin-right:3px;background: #35b2c3 url(../img/pencil_white.svg) no-repeat center; background-size:22px;border-radius: 4px; }
.remove_product { cursor:pointer; display:inline-block; width:30px; height:30px; background: #fa692a  url(../img/close_white.svg) no-repeat center; background-size:22px;border-radius: 4px; }

/* Connecion login / password box herited from ANT */

.modal{
    display:none;
    position:fixed;
    z-index:998;
    top:0; left:0; right:0; bottom:0;
    background: rgba(0,0,0,0.35);
    animation: fadein 0.2s linear forwards;
}

.agenda_modal_loading {
  display:none;
  background: #ffffff;
  color: white;
  position: fixed;
  top: 50%;
  left: 50%;
  margin-right: -50%;
  transform: translate(-50%, -50%);
  -webkit-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
  -moz-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
  box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
  border-radius: 6px;
  border: 1px solid #cccccc;
  width:60px;
  z-index:1000;
  background-image: url(../img/loader_blue_light.svg);
  background-position: center;
  background-size: 30px;
  background-repeat: no-repeat;
  width:50px;
  height:50px;
}

.commun_modal, .commun_modal_tooltips, .commun_modal_date_picker_start, .commun_modal_date_picker_end {  
    z-index:999;
    display:none;
    background: #ffffff;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    -webkit-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
    -moz-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
    box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
    border-radius: 6px;
    border: 1px solid #cccccc;
    width:600px;
}

.commun_modal_date_picker_start, .commun_modal_date_picker_end { 
  width: auto;
}

.commun_modal_tooltips_in { 
  position:relative;
}

.commun_modal_tooltips_msg {
    max-height:400px;
    min-height:100px;
    overflow-y: auto;
    padding-top:20px;
    padding-bottom:50px;
}

.commun_modal_tooltips_msg img{
  width: 265px;
  display: inline-block;
  vertical-align: top;
}

.commun_modal_tooltips_fade {
  position:absolute;
  bottom:0; left:0; right:0;
  height: 60px;
  border-radius: 6px;

  pointer-events: none;

  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+78&0+0,1+77 */
  background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,1) 77%, rgba(255,255,255,1) 78%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 77%,rgba(255,255,255,1) 78%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,1) 77%,rgba(255,255,255,1) 78%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */


}


.commun_modal_msg, .commun_modal_msg_free_ammount, .commun_modal_msg_add_promocode {
  margin-top: 20px;
}

.tooltip_img_container {
  text-align:center;
}





.box_title {
  cursor:pointer;
  color: #000000;
  padding: 20px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-topright: 5px;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
  font-family: 'Roboto Condensed', sans-serif;
  text-transform: uppercase;
  font-size: 18px;
  background: #eeeeee url(../img/cancel_padding.svg) no-repeat  right center;
  background-size: 41px;
  margin:-20px;
  margin-bottom:0;
}
.box_title_white {
  background: #ffffff url(../img/cancel_padding.svg) no-repeat  right center;
  background-size: 41px;
}

.login_box_container {  
    z-index:998;
    display:none;
    background: #ffffff;
    color: white;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    -webkit-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
    -moz-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
    box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
    border-radius: 6px;
    border: 1px solid #cccccc;
    width:300px;
}

/* ------ ANIM SHAKE ------- */

.bo_shake_no {
  animation: shake 1s cubic-bezier(.36,.07,.19,.97) both;
  transform: translate3d(-50%, -50%, 0);
  backface-visibility: hidden;
  perspective: 1000px;
}

@keyframes shake {
  10%, 90% {
    transform: translate3d(calc(-50% - -4px), -50%, 0);
  }
  
  20%, 80% {
    transform: translate3d(calc(-50% - 8px), -50%, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(calc(-50% - -16px), -50%, 0);
  }

  40%, 60% {
    transform: translate3d(calc(-50% - 16px), -50%, 0);
  }
}

.create_account_box_container, .commun_modal_free_ammount, .commun_modal_promocode, .commun_modal_order_by_ammount, .modal_groupage_qty, .modal_groupage_client_prospet, .modal_promocode_invit_parrainage, .create_delivery_address_box_container, .create_invoicing_address_box_container {  
    z-index:998;
    display:none;
    background: #eeeeee;
    position: fixed;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    padding: 20px;
    -webkit-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
    -moz-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
    box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23);
    border-radius: 6px;
    border: 1px solid #cccccc;
    width:600px;
}

.create_account_box_container_col {
  float:left;
  width:50%;
  padding-right:20px;
  border-right: 1px solid #cccccc;
  margin-top: 20px;
}
.create_account_box_container_col_right {
  float:left;
  width:50%;
  padding-left:20px;
  margin-top: 20px;
}

.create_account_box_container_col_make_full {
  float:none;
  width:100%;  
  padding-right:0px;
  padding-left:0px;
  border: 0;
}

.input_row {
    /*border-bottom: 1px solid #eeeeee;*/
    margin: 0;
    padding-top: 4px;
    padding-bottom: 4px;

    margin-bottom: 10px;
    border-bottom: 1px solid #cccccc;
}

.input_row_mobile_phone_2  {
  margin-bottom: 20px;
}

.input_row_compact {
  margin-bottom: 0px;
}

.input_row_title {
  font-weight: bold; 
  font-size:16px;
  font-family: 'Source Sans Pro', sans-serif;
  text-transform: uppercase;
  margin-bottom:10px;
}

.input_row_title_bigger {
  font-family: 'Roboto Condensed', sans-serif;
  text-transform: uppercase;
  font-size: 18px;
}

.input_comment {
  font-weight:italic; font-size:11px; margin-top:3px;
}


/* ----------------------------------------- LOGIN BOX ------------------------------------------- */

.group            { 
    position:relative; 
    margin-top:45px; 
}

.group:first-child,.group_no_top_margin {
    margin-top:25px; 
}

#login_box input:not([type=button]) {
  font-style:normal;        
  font-size:18px;
  padding:10px 10px 10px 5px;
  display:block;
  width:100%;
  float:none;
  border:none;
  border-radius:0;
  background:#ffffff;
  border-bottom:1px solid #666666;
}
#login_box input:not([type=button]):focus         { outline:none; }

/* LABEL ======================================= */
#login_box label                {
  color:#999;
  font-size:18px;
  font-weight:normal;
  position:absolute;
  pointer-events:none;
  left:5px;
  top:10px;
  width:100%;
  line-height: normal;
  padding-top: 0px;
  padding-bottom: 0px;
  background:#ffffff;
  float:none;
  transition:0.2s ease all; 
  -moz-transition:0.2s ease all; 
  -webkit-transition:0.2s ease all;
}

/* active state */
#login_box input:not([type=button]):focus ~  label {
  top:-20px;
  font-size:12px;
  color:#a4c408;
}

#login_box input:not([type=button]):valid ~ label {
  top:-20px;
  font-size:12px;
  color:#999;
}

/* BOTTOM BARS ================================= */
.bar    { position:relative; display:block; width:100%; }
.bar:before, .bar:after     {
  content:'';
  height:2px; 
  width:0;
  bottom:0px; 
  position:absolute;
  background:#a4c408; 
  transition:0.2s ease all; 
  -moz-transition:0.2s ease all; 
  -webkit-transition:0.2s ease all;
}
.bar:before {
  left:50%;
}
.bar:after {
  right:50%; 
}

/* active state */
#login_box input:focus ~ .bar:before, #login_box input:focus ~ .bar:after {
  width:50%;
}

/* HIGHLIGHTER ================================== */
.highlight {
  position:absolute;
  height:60%; 
  width:100px; 
  top:25%; 
  left:0;
  pointer-events:none;
  opacity:0;
}

/* active state */
#login_box input:focus ~ .highlight {
  -webkit-animation:inputHighlighter 0.3s ease;
  -moz-animation:inputHighlighter 0.3s ease;
  animation:inputHighlighter 0.3s ease;
}

/* ANIMATIONS ================ */
@-webkit-keyframes inputHighlighter {
    from { background:#a4c408; }
  to    { width:0; background:transparent; }
}
@-moz-keyframes inputHighlighter {
    from { background:#a4c408; }
  to    { width:0; background:transparent; }
}
@keyframes inputHighlighter {
    from { background:#a4c408; }
  to    { width:0; background:transparent; }
}

/* PREVENT CHROMe ADDING COLOR ON AUTOFILL */

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active  {
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}



/* load quotes */

#my_quotes { text-align: left;}
.myspace_quote_line { text-align: left; white-space: nowrap; width:100%; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background:#eeeeee; margin-top:10px; }
.myspace_quote_line_header { text-align: left; font-weight:bold; background: #cccccc}
.myspace_quote_line_tool { float:right; width: 40px; }
.myspace_quote_line_desc {  padding:8px; float:left; width: calc(100% - 40px);  }
.myspace_quote_line_filter {  padding:1px;  }

.myspace_quote_line_desc_client_name { float:left; width:39%; margin-right:1%; overflow:hidden;}
.myspace_quote_line_desc_client_tel { float:left; width:49%; margin-right:1%; overflow:hidden;}

.myspace_quote_line_desc_order_id { float:left; width:19%; margin-right:1%; overflow:hidden;}
.myspace_quote_line_desc_order_date { float:left; width:19%; margin-right:1%; overflow:hidden; }
.myspace_quote_line_desc_order_number_product { float:left; width:19%; margin-right:1%; overflow:hidden; 
    background-image: url(../img/tot_devis_client.svg), url(../img/tot_devis_pro_wait.svg);
    background-repeat: no-repeat, no-repeat;
    background-position: top left, bottom left;
    background-size: 17px;
    padding-left:20px; 
}
.myspace_quote_line_desc_order_total_tvac { float:left; width:19%; margin-right:1%; overflow:hidden; 
    background-image: url(../img/tot_devis_client.svg), url(../img/tot_devis_pro_wait.svg);
    background-repeat: no-repeat, no-repeat;
    background-position: top left, bottom left;
    background-size: 17px;
    padding-left:20px;
}
.myspace_quote_line_desc_order_total_tvac_pro_done, .myspace_quote_line_desc_order_number_product_pro_done {
    background-image: url(../img/tot_devis_client.svg), url(../img/tot_devis_pro.svg);
}
.myspace_quote_line_desc_order_total_tvac_pro_wl, .myspace_quote_line_desc_order_number_product_pro_wl {
    background-image: url(../img/tot_devis_client.svg);
}
.myspace_quote_line_desc_order_state { float:left; width:19%; margin-right:1%; white-space: normal; }
.myspace_quote_line_tool_detail {
    border: 0;
    background-color: #35b2c3;
    color: #ffffff;
-webkit-border-top-right-radius: 4px;
-webkit-border-bottom-right-radius: 4px;
-moz-border-radius-topright: 4px;
-moz-border-radius-bottomright: 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
    text-decoration: none;
    transition: background-color 400ms ease-out;
    -webkit-transition: background-color 400ms ease-out;
    -moz-transition: background-color 400ms ease-out;
    -o-transition: background-color 400ms ease-out;
    font-family: 'Roboto Condensed', sans-serif;
    text-transform: uppercase;
    font-size: 18px;
    padding-top: 17px;
    padding-bottom: 17px;
    background-image: url(../img/next.png);
    background-repeat: no-repeat;
    background-position: 5px center;
    background-size: 26px;
    width: 40px;
    display: block;
    border-left:3px solid #ffffff;
}

.myspace_quote_line_tool_detail:hover {
  background-color: #e3420c;
}

/* quote details */

.force_this_driver_booking {display:block; padding:5px; background:#eeeeee; margin-top: 2px; margin-bottom: 2px; border-radius:4px; cursor: pointeur}
.force_this_driver_booking_selected { background-color: #35b2c3; color:#ffffff }

.my_space_evo_devis, .my_space_evo_groupage {
  width:100%;
  min-height: 140px;
  text-align: center;
  padding-top:30px;
  /*background:#eeeeee;*/
}
.agenda_navigation_tab, .my_space_evo_devis_tab, .my_space_evo_groupage_tab {
  display:inline-block;
  width:120px;
  height:100px;
  text-align: center;
  pointer-events: auto;
  /*background:#ffffff;*/
  text-decoration: none;
  position:relative;
  vertical-align: top;
}
.agenda_navigation_tab{
  height:56px;
}
.my_space_evo_devis_tab, .my_space_evo_groupage_tab {
  width:130px;
}

.agenda_navigation_line, .my_space_evo_devis_line, .my_space_evo_groupage_line{
  position:absolute;
  width:100%; height:21px; border-bottom:1px dashed #666666;
  left:50%;
}
.agenda_navigation_line {
  height:11px;
}
/*.agenda_navigation_line_done {
  border-bottom:1px solid #a0c64c;
}*/
.agenda_navigation_tab_round, .my_space_evo_devis_tab_round, .my_space_evo_groupage_tab_round {
  display:block;
  width:40px; height:40px; line-height:37px;
  margin:0 auto;
  background:#eeeeee;
  border:1px  dashed #666666;
  border-radius:40px;
  color:#666666;
  position:relative;
}
.agenda_navigation_tab_round {
  display:block;
  width:20px; height:20px; 
  margin:0 auto;
  background:#eeeeee;
  border:1px  solid #666666;
  border-radius:40px;
  color:#666666;
  position:relative;
  text-indent: 20px;
  overflow:hidden;
}
.agenda_navigation_tab_label, .my_space_evo_devis_tab_label, .my_space_evo_groupage_tab_label {
  display:block;
  width:120px; height:40px;
  color:#666666;
  margin-top:10px;
  font-weight:bold;
}
.my_space_evo_devis_tab_label, .my_space_evo_groupage_tab_label {
  width:130px; 
  height:60px;
  overflow: hidden;
  padding-left:5px; padding-right:5px;
}


.agenda_navigation_tab_done .agenda_navigation_tab_round, .my_space_evo_devis_tab_done .my_space_evo_devis_tab_round, .my_space_evo_groupage_tab_done .my_space_evo_groupage_tab_round {
  background:#a0c64c;
  border:1px solid #a0c64c;
  color:#ffffff;
}
.agenda_navigation_tab_done .agenda_navigation_tab_label, .my_space_evo_devis_tab_done .my_space_evo_devis_tab_label, .my_space_evo_groupage_tab_done .my_space_evo_groupage_tab_label {
  color:#a0c64c;
}
.agenda_navigation_tab_active .agenda_navigation_tab_round, .my_space_evo_devis_tab_active .my_space_evo_devis_tab_round, .my_space_evo_groupage_tab_active .my_space_evo_groupage_tab_round {
  background:#009fe3;
  border:2px solid #009fe3;
  color:#ffffff;
}
.agenda_navigation_tab_active .agenda_navigation_tab_label, .my_space_evo_devis_tab_active .my_space_evo_devis_tab_label, .my_space_evo_groupage_tab_active .my_space_evo_groupage_tab_label {
  color:#009fe3;
}
.agenda_navigation_tab_done > .agenda_navigation_line, .my_space_evo_devis_tab_done > .my_space_evo_devis_line , .my_space_evo_groupage_tab_done > .my_space_evo_groupage_line{
  border-bottom:1px solid #666666;
}

/* Quote details -- box next step */

#entire_calendar_warning_adjust { display:none;}

#recap_content_next_step_bg, .class_recap_content_next_step_bg {
  min-height: 230px; position:relative; background-color: #ffffff; background-image: url(../img/perso_1.svg); background-repeat: no-repeat; background-position:left bottom; padding: 20px; background-size: contain;
  border-bottom:1px solid #cccccc;
}
.recap_content_next_step_bg_mobile {
    height: 140px;
    width: 140px;
    position: relative;
    background-color: #eeeeee ;
    background-image: url(../img/perso_1.svg);
    background-repeat: no-repeat ;
    background-position: center;
    background-size: 90px;
    border-radius: 140px;
    float: right;
    margin-top: -111px;
  display:none;
}

#recap_content_next_step_bg.recap_content_next_step_perso_0, .recap_content_next_step_bg_mobile.recap_content_next_step_perso_0 {
  background-image: url(../img/perso_0.svg);
}
#recap_content_next_step_bg.recap_content_next_step_perso_1, .recap_content_next_step_bg_mobile.recap_content_next_step_perso_1 {
  background-image: url(../img/perso_1_b.svg);
}
#recap_content_next_step_bg.recap_content_next_step_perso_2, .recap_content_next_step_bg_mobile.recap_content_next_step_perso_2 {
  background-image: url(../img/perso_2.svg);
}
#recap_content_next_step_bg.recap_content_next_step_perso_3, .recap_content_next_step_bg_mobile.recap_content_next_step_perso_3 {
  background-image: url(../img/perso_3.svg);
}
#recap_content_next_step_bg.recap_content_next_step_perso_4, .recap_content_next_step_bg_mobile.recap_content_next_step_perso_4 {
  background-image: url(../img/perso_4.svg);
}
#recap_content_next_step_bg.recap_content_next_step_perso_5, .recap_content_next_step_bg_mobile.recap_content_next_step_perso_5 {
  background-image: url(../img/perso_5.svg);
}
.recap_content_next_step_arrow_shadow {
  width: 0;height: 0;z-index:8; border-style: solid; border-width: 20px 20px 20px 0; border-color: transparent #cccccc transparent transparent; position: absolute; bottom:100px; left: 186px
}
.recap_content_next_step_arrow {
  width: 0;height: 0;z-index:11; border-style: solid; border-width: 20px 20px 20px 0; border-color: transparent #ffffff transparent transparent; position: absolute; bottom:100px; left: 188px
}
#recap_content_next_step, .class_recap_content_next_step {
  position:relative; z-index:10; -webkit-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23); -moz-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23); box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.23); background:#ffffff; padding:0px; margin-left:180px; border-radius:10px; padding:20px;
  min-height:96px; border:1px solid #cccccc; margin-top: 40px;
}


.poseur_card_logo, .recap_chantier_content_delivery  {
  width: calc(50% - 10px);
  min-height:200px;
  background: #ffffff url(../src/pro/no-photo.png) no-repeat center;
  background-size: contain;
  border-radius: 4px;
  border-right: 1px solid #cccccc;
  float: left;
}

.recap_chantier_content_delivery  {
  background:none;
  border-radius: 0;
}

.poseur_card_intel, .recap_chantier_content_billing {
  width: calc(50% - 10px);
  float: right;
  min-height:200px;
} 

.pdf_line {
  background: #ffffff; padding: 10px; text-align: left; border-bottom: 1px solid #cccccc; margin-bottom: 5px;
}
.pdf_line_inactive {
  opacity: 0.35;
}
.pdf_line_label {
  width: calc(100% - 83px); float:left; padding-top:3px
}
.specific_btn_donwload_PDF {
  display: inline-block;
  width:40px;
  height:45px;
  background-repeat: no-repeat;
  background-position: top center;
  background-image: url(../img/pdf.svg);
  cursor:pointer;
}

.recap_facturation_line { background: #ffffff; padding: 10px; text-align: left; border-bottom: 1px solid #cccccc; margin-bottom: 5px; }
.recap_facturation_line_ref_mollie {float:left; width:25%; white-space: nowrap; overflow: hidden }
.recap_facturation_line_ref_mollie_bis {float:left; width:15%; overflow: hidden}
.recap_facturation_line_added {float:left; width:25%; overflow: hidden; }
.recap_facturation_line_amount {float:left; width:15%; text-align: right}
.recap_facturation_line_status {float:left; width:20%; text-align: right}



/* upload file class */ 

.gallery_bar {
  width: 1px;
  height: 5px;
  background: #35b2c3;
  text-align: center;
  transition-duration: 0.5s;
  transition-timing-function: ease;

}
.gallery_bar_container {
  width: 1px;
  height: 7px;
  padding:1px;
  background: #cccccc;
  max-width:302px; margin-bottom:10px;
  width:100%;
  overflow:hidden;
}

.gallery_item_line {
  width:100%; padding:10px; background:#ffffff; margin-top:5px; border-bottom:1px solid #cccccc; overflow-x: hidden;
}
.gallery_item_pic {
  border:1px solid #cccccc; float:left; width:120px; height:100px;  line-height:100px; font-size:20px; font-weight:bold; text-transform:uppercase; text-align:center; color:#ffffff; text-decoration: none; overflow-x: hidden;
}
.gallery_item_text {
  position:relative; float:right; width:calc(100% - 140px); height:100px;
}
.remove_work_zone_item {
  cursor:pointer; display:inline-block; width:30px; height:30px; background: #fa692a  url(../img/close_white.svg) no-repeat center; background-size:22px;border-radius: 4px;
  position:absolute; bottom:0; right:0
}

input[type=button].gallery_save {
    float: right;
    width: 100px;
    text-align: center;
    background-image: none;
    padding: 6px;
    border-radius: 6px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

/*  ----- listing tanks */

#delivery_item_list, #invoicing_devis_item_list { margin-top: 20px; }
.delivery_item, .invoicing_devis_item {
  overflow: hidden;
  width:calc(25% - 10px);
  height:150px;
  border:1px solid #cccccc;
  position:relative; float:left; margin:5px;
  background: #eeeeee url(../img/marker_map_icon.svg) no-repeat center 5px; background-size: 40px;color:#000000; text-decoration: none;
}

.delivery_item_add, .invoicing_devis_item_add { background: #ffffff url(../img/add.png) no-repeat center 35px; background-size: 35px; border:1px solid #35b2c3; color:#35b2c3; font-weight:bold  }
.delivery_item_intels, .invoicing_devis_item_intels {display:block; position:absolute; padding:10px;bottom:0px; left:0; right:0;; background: #ffffff; text-align: center;  }
.delivery_item_selected, .invoicing_devis_item_selected { border:1px solid #35b2c3; color:#35b2c3; }

#tank_item_list, #invoicing_item_list { margin:-5px;}
.tank_item, .invoicing_item {
  overflow: hidden;
  width:calc(25% - 10px);
  height:180px;
  border:1px solid #cccccc;
  position:relative; float:left; margin:5px;
  background: #eeeeee url(../img/tankt.png) no-repeat center 20px; background-size: 60px;color:#000000; text-decoration: none;
}
.invoicing_item { background-image: url(../img/invoice_address.png) }
.tank_item_intels, .invoicing_item_intels {overflow:hidden; display:block; position:absolute; padding:10px;bottom:0px; left:0; right:0;; background: #ffffff; text-align: left; padding-left: 55px; }
.tank_item_id, .invoicing_item_id { display:block; overflow:hidden;   }
.tank_item_ad, .invoicing_item_ad { display:block; overflow:hidden;  font-weight:bold; }
.tank_item_city, .invoicing_item_city { display:block; overflow:hidden;  font-weight:bold; }
.tank_map_marker, .invoicing_item_map_marker {     display: block;
    position: absolute;
    top: 0px;
    left: 0;
    right: 0;
background: url(../img/marker_map_icon.svg) no-repeat 10px bottom;

    background-size: 37px;
    height: 161px;}

.tank_map_marker_with_sonde {
background: url(../img/marker_map_icon.svg) no-repeat 10px bottom, url(../img/thermostat.png) 95% 10px no-repeat;
background-size: 37px, 30px;
}

.delivery_invoice_item_intels_gradient {
  position:absolute; left:0; right:0; top:50px; bottom:0;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,ffffff+100&0+0,1+100 */
background: -moz-linear-gradient(left, rgba(255,255,255,0) 05%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, rgba(255,255,255,0) 50%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, rgba(255,255,255,0) 50%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */

}






.FAQ_chapters { clear:both; 
  background: #2a9faf url(../img/arrow-down-right-margin.svg) no-repeat right center ;
  background-size: 30px;
  font-weight: bold; font-size:20px; padding:10px; color:#ffffff; margin-top:10px; cursor: pointer;
  display:inline-block; width:100%; border: 10px solid #eeeeee; 
}

.FAQ_chapters_content { padding:20px; padding-top:0; padding-bottom:15px; display:none; background:#eeeeee;}
.FAQ_chapters_categorie {font-weight:bold; font-size:20px; padding-top:20px; padding-bottom:20px; clear:both; color : #2a9faf;}
.FAQ_left_col {display:inline-block; vertical-align: top; width:50%; border-right: 1px solid #cccccc; padding-right:20px; margin-top:10px; margin-bottom:10px; }
.FAQ_left_col_full {width:100%; margin-top:10px; margin-bottom:10px; }
.FAQ_right_col {display:inline-block; vertical-align: top; width:50%; border-left: 1px solid #cccccc; padding-left:20px; margin-top:10px; margin-bottom:10px; margin-left:-1px;}
.FAQ_question { font-weight: bold; margin-bottom:5px; margin-top:15px; font-style: italic; }
.FAQ_reponse { margin-bottom:10px; }


.comment_client_container {width:calc(100% + 36px); overflow-y: hidden; overflow-x: hidden; white-space: nowrap; margin-left:-20px;}
.comment_client_box {  width:33.33%; padding-left:20px; padding-right:20px; height:200px; display:inline-block; vertical-align: top; white-space: normal;}
.comment_client_box_in { position:relative; background: #ffffff; border-radius: 4px; padding:20px; height:200px;}
.comment_txt{ text-align:center; font-style: italic; }
.comment_sign { position:absolute; left:0; right:0; bottom:10px; padding-top:6px;text-align:center; border-top:1px solid #eeeeee; font-size:13px; color:#333333; }

.comment_prev  { float:left; text-align:left; display:block; color:#35b2c3 ; margin-top:15px;}
.comment_next { float:right; text-align:right; display:block; color:#35b2c3 ; margin-top:15px;}


.star_container { width:160px; height:30px; float:right; position:relative; }
.star_container_color { width:145px; height:30px; background: #f5d442 ; position: absolute; left:0;  }
.star {     position: relative; z-index:1; width:32px; height:30px; float:left; background: url(../img/star_rating.svg) no-repeat center; background-size: auto 30px;}


.my_abo_page_container_cagnotte_visu {width:100%; background:#eeeeee;margin-bottom:10px;}
.my_abo_page_container_cagnotte_visu_left_col {float:left; width:50%; height:215px; background: #eeeeee url(../img/cagnotte.svg) no-repeat center -111px; background-size: 130%}
.my_abo_page_container_cagnotte_visu_right_col {float:right; width:50%; height:215px;background: #eeeeee}
.my_abo_page_container_cagnotte_visu_right_col_bulle {padding:30px; background:#ffffff; border-radius:10px; }
.my_abo_page_container_cagnotte_visu_right_col_bulle_title {font-size:45px; min-height:40px; margin-bottom:10px; border-bottom:1px solid #cccccc}

/* ------- MENU DESKTOP AND MOBILE MENU ----------------- */


.main-col-menu-mobile { width:0px; overflow-x: hidden; text-align: left;
z-index:1000;
font-size:18px;
color: #606060;
/*font-family: 'Text Me One', sans-serif;*/
/*font-weight:bold;*/
/*letter-spacing: .8px;*/
text-transform: uppercase;
overflow-x: hidden;
position:fixed; 
top:0; 
right:0; 
top:74px;
/*bottom:0px;*/
height: calc(100% - 70px);
background-color:#ffffff;
transition-property: all;
transition-duration: .5s;
transition-timing-function: cubic-bezier(0, 1, 0.5, 1);

}

.main-col-menu-mobile a, .main-col-menu-mobile a:visited, .main-col-menu-mobile a:active, .main-col-menu-mobile a:hover {color: #606060;}

.menu_mobile_trigger {
  display:none;
  position: absolute;
    top: 19px; left: 15px;
   height:38px; width:38px; margin:0 auto; line-height: 38px;}
.menu_mobile_trigger_ico{cursor: pointer; display:block; height:38px; width:38px; /*background-image: url(../img/trigger_menu.png); background-repeat: no-repeat; background-position: center; background-color: #434343;*/ }


.mobile-menu-items { visibility: hidden}

.mobile-menu-item {width: 400px;visibility: visible; position: relative; border-bottom:1px solid #cccccc; background-color:#eeeeee; background-image:url(../img/next.svg); background-size: 20px; background-position: 98% 50%; background-repeat:no-repeat;}
.mobile-menu-item:first-child {border-top:0px solid #cccccc;}
/*.mobile-menu-item:last-child {border-bottom:0px solid #cccccc;}*/
.mobile-menu-item-label {float:left;width:362px;padding:10px; background-color:#ffffff; box-sizing:border-box;}
.mobile-menu-item-arrow {cursor:pointer; float:right;width:38px; padding-top:10px;padding-bottom:10px;  position: absolute; top: 0; bottom: 0; right: 0;}
.mobile-menu-item-label-back {float:left; width:362px;padding:10px; text-align:left;background-color:#ffffff; }
.mobile-menu-item-arrow-back {cursor:pointer; float:left;width:38px;background-image:url(../img/back.svg); background-size: 20px; background-position: center; background-repeat:no-repeat;padding-top:10px;padding-bottom:10px;}
.mobile-menu-item-label a, .mobile-menu-item-label-back a  {text-decoration:none; }

.mobile-menu-item-label-no-sub {width:400px;}

.menu_mobile_modal {
  opacity:0;
    transition: opacity 0.5s;
    -webkit-transition: opacity 0.5s; /* Safari */
  z-index:999;background-color: rgba(0, 0, 0, 0.6); position: fixed; top:0; bottom:0; right:0; left:0; 
  pointer-events: none;
}
.menu_mobile_modal_active {
  opacity:1;
}


/* Icon 4 */

#nav-icon4 {
  width: 33px;
  height: 33px;
  position: relative;
  margin: 0px auto;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
  margin-top: 6px;
}

#nav-icon4 span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: #ffffff;
  border-radius: 5px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}


#nav-icon4 {
}

#nav-icon4 span:nth-child(1) {
  top: 0px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

#nav-icon4 span:nth-child(2) {
  top: 10px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

#nav-icon4 span:nth-child(3) {
  top: 20px;
  -webkit-transform-origin: left center;
  -moz-transform-origin: left center;
  -o-transform-origin: left center;
  transform-origin: left center;
}

#nav-icon4.open span:nth-child(1) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  top: -1px;
  left: 6px;
}

#nav-icon4.open span:nth-child(2) {
  width: 0%;
  opacity: 0;
}

#nav-icon4.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  top: 22px;
  left: 6px;
}

/* groupage calendar */

.groupage_cal_nav_barr, .groupage_cal_nav_barr_return { width:100%; background-color:#eeeeee; border-bottom:1px solid #cccccc }
.groupage_cal_nav_barr_prev { float: left; background: url(../img/arrow-left.png) no-repeat center; background-size: 26px; width:40px; height:40px; margin:3px; }
.groupage_cal_nav_barr_date { float: left;font-size:20px; line-height:43px; text-align:center; width: calc(100% - 92px) }
.groupage_cal_nav_barr_next { float: right; background: url(../img/arrow-right.png) no-repeat center; background-size: 26px; width:40px; height:40px; margin:3px; }

.groupage_calendar_event { 
  background: #ffffff; 
  background: #ffffff url(../img/logo_sign_EE.png) no-repeat 9px 11px;
  background-size: 38px;
  padding-left: 50px;
  width:100%; min-height:46px; margin-top:3px;padding-bottom: 3px; border-bottom:1px solid #cccccc  }

.groupage_calendar_event_no_ico {
  background: #ffffff; 
  padding-left: 0px;
}

.groupage_calendar_event_past { opacity:0.5; }
.groupage_calendar_event_day_box { float: left; width:76px; height:46px; text-align: center; padding-top:5px; font-size:20px; font-weight:bold; border:1px solid #35b2c3; color :#35b2c3 }
.groupage_calendar_event_day_box span {font-size:16px; font-weight:normal; color:#000000}
.groupage_calendar_event_label_box { float: left; width:  calc(100% - 236px); padding: 3px; padding-left: 15px; padding-right: 15px;}
.groupage_calendar_event_button_box { float: right; width:160px; }

.groupage_calendar_event_button { 
  
    display: inline-block;
    border: 1px solid #35b2c3;
    background: #35b2c3;
    color: #ffffff;
    border-radius: 6px;
    text-decoration: none;
    text-align: center;
    width: 100%;
    box-sizing: border-box;
    font-size: 18px;
    padding: 20px;
    padding-top: 12px;
    padding-bottom: 13px;
    padding-left: 46px;
    background-image: url(../img/next.png);
    background-repeat: no-repeat;
    background-position: 9px center;
    background-size: 26px; }


.groupage_client_prospet_link, .groupage_client_prospet_link_red {
    color: #ffffff;
    padding: 5px;
    display: inline-block;
    background: #35b2c3;
    text-decoration: none;
    border-radius: 6px;
    padding-right: 10px;
    padding-left: 10px;
    margin-top: 5px;
}
.groupage_client_prospet_link_red { background: #d35072; }


/* sonde */

.container_all_sonde_box { border:1px solid #cccccc; margin-top:20px; overflow:hidden } 

.gauge {
  width:100%; min-height:300px; position: relative; padding-top:50px;
}
.gauge-container {
  width: 400px;
  height: 200px;
  position: absolute;
  top: 35%;
  left: 50%;
  overflow: hidden;
  text-align: center;
  transform: translate(-50%, -50%);
}
.gauge-a {
  z-index: 7;
  position: absolute;
  background-color: #a4c408;
  width: 400px;
  height: 200px;
  top: 0%;
  border-radius: 250px 250px 0px 0px;
}
.gauge-b {
  z-index: 20;
  position: absolute;
  background-color: #ffffff;
  width: 250px;
  height: 125px;
  top: 75px;
  margin-left: 75px;
  margin-right: auto;
  border-radius: 250px 250px 0px 0px;
}
.gauge-cache {
  z-index: 21;
  position: absolute;
  background: url(../img/cache_gauge_white.png) no-repeat center;
  background-size:cover;
  width: 400px;
  height: 200px;
}
.gauge-c {
  z-index: 22;
  position: absolute;
  border-top: 3px solid  #333333;
  width: 400px;
  height: 200px;
  top: 200px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 0px 0px 200px 200px;
  transform-origin: center top;
  transition: all 1.5s ease-in-out;
}

.gauge-c-white {
  z-index: 20;
  position: absolute;
  background-color: #eeeeee;
  width: 400px;
  height: 200px;
  top: 200px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 0px 0px 200px 200px;
  transform-origin: center top;
  transition: all 1.5s ease-in-out;
}
.gauge-d {
    z-index: 23;
    position: absolute;
    background-color: #333333;
    width: 180px;
    height: 100px;
    top: 110px;
    margin-left: 110px;
    margin-right: auto;
    border-radius: 180px 180px 0px 0px;
}


.gauge-c-red {
  z-index: 10;
  position: absolute;
  background-color: #ff0000;
  width: 400px;
  height: 200px;
  top: 200px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 0px 0px 200px 200px;
  transform-origin: center top;
  transform:rotate(.05turn);
}

.gauge-c-orange {
  z-index: 9;
  position: absolute;
  background-color: #ff7c00;
  width: 400px;
  height: 200px;
  top: 200px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 0px 0px 200px 200px;
  transform-origin: center top;
  transform:rotate(.10turn);
}

.gauge-c-yellow {
  z-index: 8;
  position: absolute;
  background-color: #f1f202;
  width: 400px;
  height: 200px;
  top: 200px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 0px 0px 200px 200px;
  transform-origin: center top;
  transform:rotate(.15turn);
}

/*.gauge-container:hover .gauge-c, .gauge-container:hover .gauge-c-white {  transform:rotate(-.4turn); }*/

.gauge-data {
    z-index: 30;
    color: #ffffff;
    font-size: 30px;
    position: absolute;
    width: 400px;
    height: 200px;
    top: 135px;
    margin-left: auto;
    margin-right: auto;
    transition: all 1s ease-out;
}

#tank_current_litrage {
    display: block;
    font-size: 23px;
    width: 100px;
    margin: 0 auto;
    margin-top: 11px;
    padding-top: 8px;
    border-top: 1px solid #666666;
}

#tank_sonde_when,
#tank_sonde_MaxVolume,
#tank_sonde_DeviceID_span,
#tank_sonde_status,
#tank_sonde_Battery,
#tank_sonde_Temperature,
#tank_sonde_Wifi {
  font-weight:bold;
}

.sonde_view_col { float:left; width:calc( 33.33% - 1px); padding:20px; border-right:1px solid #eeeeee; min-height: 200px; text-align: center}
.sonde_view_col_r { float:right; width:33.33%; padding:20px; min-height: 200px; text-align: center}

.tank_sonde_Temperature_ico{   width: 100%;
    height: 80px;
    margin-top: 20px;
    background: url(../img/temp.png) no-repeat center;
    background-size: contain;
  }

.tank_sonde_Battery_ico {   width: 100%;
    height: 80px;
    margin-top: 20px;
    background: url(../img/battery_100.png) no-repeat center;
    background-size: contain;
  }

.tank_sonde_Battery_ico_75{  
    background: url(../img/battery_75.png) no-repeat center;
    background-size: contain;
}
.tank_sonde_Battery_ico_50{  
    background: url(../img/battery_50.png) no-repeat center;
    background-size: contain;
}
.tank_sonde_Battery_ico_25{  
    background: url(../img/battery_25.png) no-repeat center;
    background-size: contain;
}
.tank_sonde_Battery_ico_0{  
    background: url(../img/battery_0.png) no-repeat center;
    background-size: contain;
}


.tank_sonde_Wifi_ico{   width: 100%;
    height: 80px;
    margin-top: 20px;
    background: url(../img/wifi.png) no-repeat center;
    background-size: contain;
  }

.tank_sonde_Battery_label, .tank_sonde_Temperature_label, .tank_sonde_Wifi_label { margin-top:20px; text-align: center;
    font-size: 20px;
    line-height: 23px; }

.we_are_on_smartphone { display: none }

/* ---------------------------------------------- RESPONSIVE ADJUSTMENTS -------------------------------- */

  /* #Big screen (+ 1280)
  ================================================== */
    @media only screen and (min-width: 1200px) {

      .page-footer-container {
        /*width:1280px; margin:0 auto;*/
        /*padding-left: 320px;*/
      }

      .col_full_width_slide_navig_left {
        left: calc(50% - 630px);
      }
      .col_full_width_slide_navig_right {
        left: calc(50% + 570px);
      }

      .col_full_width, .col_full_width_slide, .col_full_width_slide_filter_dark { height:780px;}

    }

  /* #Tablet (Portrait)
  ================================================== */
    /* iPad in portrait & landscape */  
    @media only screen and (min-device-width : 768px) and (max-device-width : 1024px)  {

      .main_col {width: 728px; margin: 0 auto;}


.main_banner {width:728px; height:510px; padding-bottom:50px;}
.main_banner_title, h1.main_banner_title{ 
  font-size: 40px;
  width: 50%;
  top: 50%;
  transform: translateY(-50%);
}
.main_banner_sub_title {
  margin-top:30px;
  font-size: 24px;
}
.main_banner_visual {
  width: 50%;
  height:400px;
  top: 50%;
  transform: translateY(-50%);
}

.stats_banner { width:728px; }
#weight_curve_force_scroll_left_placeholder, #sonde_histo_conso_placeholder   {width:728px;}
#weight_curve_force_scroll_left  {width:728px; }



/*  tree banner */


.tree_banner {width:728px; }
.tree_banner_title { font-size: 26px}
.tree_visual_hook { height: 420px; }
.tree_visual_hook_txt_container { width:100%; padding-top:0px }
.tree_visual_hook_txt_small { font-size: 20px; }





.order_banner, .order_banner___hook {padding-top:50px; padding-bottom:50px; width:728px; }
.order_banner_title {font-size:26px; }

.order_visual_hook { 
    background-size: 550px;
    height: 360px;
    margin-top:20px; background-position: -50px center; }

.order_visual_hook_txt_container { margin-left: 430px; padding-top:20px }
.order_visual_hook_logo {   }
.order_visual_hook_txt_big { font-size: 40px; }
.order_visual_hook_txt_small {font-size: 20px; }
.order_visual_hook_btn { }



.order_calendar_container, .frequence_calendar_container { float:none; width:100%;}
.order_calendar_day, .order_calendar_day:first-child, .frequence_calendar_day, .frequence_calendar_day:first-child {width: 100%; border: 0; border-bottom: 1px solid #cccccc; padding-bottom: 3px; margin-bottom: 3px; min-height:auto;}
.order_calendar_day_label, .frequence_calendar_day_label { width: 100%; }
.order_calendar_day_morning, .frequence_calendar_day_full {width: calc(50% - 2px); float: left; margin:0;  }
.frequence_calendar_day_full {width: 100%; float: none;}
.order_calendar_day_afternoon { width: calc(50% - 2px); float: right ; margin:0; }

.order_calendar_container_nav_left { display:none; }
.order_calendar_container_nav_right { display:none; }

.order_calendar_container_nav_mobile_container {display:block;}
.order_calendar_container_nav_mobile_left { float:left; width:calc(50% - 2px);  background:#35b2c3; padding:4px; border-radius:6px;  }
.order_calendar_container_nav_mobile_right { float:right; width:calc(50% - 2px); background:#35b2c3; padding:4px; border-radius:6px; }
.order_calendar_nav_left { width:100%; height:40px; color:#ffffff; line-height: 39px; margin:0 auto; position: relative; top: 0; transform: none; background: url(../img/arrow-white-left.png) no-repeat center left; background-size:16px;  }
.order_calendar_nav_right { width:100%; height:40px; color:#ffffff; line-height: 39px; margin:0 auto; position: relative; top: 0; transform: none; background: url(../img/arrow-white-right.png) no-repeat center right; background-size:16px;   }




.order_module { width:728px;padding:30px; }
.order_steps_container { width:90%; }
/*.order_product_item { width:100px; height:120px; }*/
/*.order_product_item_image {height:60px; background-size: 40px;}*/
/*#order_client_you_are_group .order_product_item_image {background-size:74px}*/

.recap_header_container, .recap_raw_container { height:auto;  }
.recap_col_produit { width:40%; }
.recap_col_price_per_unit { width:20%; }
.recap_col_prix { width:20%; }

.tank_item, .invoicing_item {
  width:calc(33.33% - 10px);
  height:180px;
}


      .my_abo_page_container_cagnotte_visu_left_col {background-position: center -50px; }



      .banner_livraison_a_domicile {min-height: 570px; background-position: top center; background-size: 780px; }
      .banner_livraison_a_domicile_col_container { width:760px; padding-left:16px; padding-right:16px;  padding-top:340px; font-size:42px;}
      .banner_livraison_a_domicile_col_A {width:calc(33.33% - 50px); margin-right:50px; padding-left:25px;   }
      .banner_livraison_a_domicile_col_B { }
      .banner_livraison_a_domicile_col_C {width:calc(33.33% - 50px); margin-left:50px; padding-right:25px; }
      .banner_livraison_a_domicile_col_txt { font-size:23px; display: block; margin-top: 100px; color:#000000; }

      .banner_contrat_energie, .banner_contrat_energie_home {
          width: 768px;
          min-height: 406px;
          background: #ffffff url(../img/abonnement_visu.svg) no-repeat -222px 24px;
          background-size: 902px;}
      .banner_contrat_energie_stripe {
      font-size: 30px;
      width: 41%;
      padding-right: 20px;  text-align: right}
      .banner_contrat_energie_home_stripe_title1 {font-size: 40px; text-align: right}
      .banner_contrat_energie_home_stripe_title2 {font-size: 25px; font-weight:bold;margin-top:20px}
      .banner_contrat_energie_home_stripe_title3 {font-size: 18px;margin-top:5px}

      .banner_groupage { min-height: 490px;
        background: #ffffff url(../img/groupage.svg) no-repeat center 23px;
        background-size: 72%; 
        justify-content: center;
        align-items: end;
      }



      .banner_parrainage { 
        min-height: 430px;
        background: #ffffff url(../img/sponsor.svg) no-repeat right 23px;
        background-size: 58%;
        justify-content: left;
        align-items: center;
      }

      .banner_parrainage_stripe { 
        font-size: 30px;
        width: 41%;
        padding-left: 0px;
      }

      .main_col_parrainage {
      background:url(../img/sponsor_2.svg) no-repeat left  center; background-size: 350px; }


      .banner_installation_de_sonde {
          min-height: 430px;
          background: #ffffff url(../img/sonde.svg) no-repeat right 23px;
          background-size: 80%;
          justify-content: left;
          align-items: center;
      }

      .banner_installation_de_sonde_stripe { 
        font-size: 30px;
        width: 41%;
        padding-left: 0px;
      }
      .banner_drive_in {
          min-height: 390px;
          background: #ffffff url(../img/drive_in.svg) no-repeat right 23px;
          background-size: 80%;
          justify-content: left;
          align-items: normal;
      }

      .banner_installation_de_drive_in_stripe { 
        font-size: 30px;
        width: 59%;
        padding-left: 20px;
      }


      .banner_adblue {
        min-height: 340px;
        background: #ffffff url(../img/adblue.svg) no-repeat right -7px;
        background-size: 77%;
        justify-content: left;
        align-items: normal;
      }

      .banner_adblue_stripe {
        font-size: 30px;
        width: 45%;
        padding-left: 20px;
        padding-top:40px;
      }

      .banner_pellet {
          min-height: 340px;
          background: #ffffff url(../img/pellets.svg) no-repeat -26px -7px;
          background-size: 77%;
          justify-content: right;
          align-items: normal;
      }

      .banner_pellet_stripe {
          font-size: 30px;
          width: 45%;
          padding-right: 10px;
          padding-top: 40px;
      }



      .banner_energies_de_chauffage {
        min-height: 340px;
        background: #ffffff url(../img/combustible_choice.svg) no-repeat 40px -7px;
        background-size: 49%;
        justify-content: right;
        align-items: center;
      }

      .banner_energies_de_chauffage_stripe {
        font-size: 30px;
        width: 45%;
        padding-right: 50px;
        padding-top: 0px;
      }


      .banner_energies_de_roulage {
        min-height: 340px;
        background: #ffffff url(../img/carburant_choice.svg) no-repeat 40px -7px;
        background-size: 86%;
        justify-content: center;
        align-items: start;
      }

      .banner_energies_de_roulage_stripe {
        font-size: 30px;
        width: 90%;
        padding-right: 0;
        padding-top: 40px;
      }


      .banner_installation_de_borne_de_recharge {
        min-height: 330px;
        background: #ffffff url(../img/borne.svg) no-repeat right -50px;
        background-size: 87%;
        justify-content: left;
        align-items: normal;
      }

      .banner_installation_de_borne_de_recharge_stripe {
        font-size: 30px;
        width: 65%;
        padding-left: 0px;
        padding-top: 60px;
      }



      .banner_a_propos { min-height: 430px;
        background: #ffffff url(../img/group-pana.svg) no-repeat center 23px;
        background-size: 150%; 
        justify-content: center;
        align-items: normal;
      }

      .banner_a_propos_stripe { 
        font-size: 30px;
        line-height: normal;
        width: 80%;
        text-align: center;
        padding-top: 30px;
      }

      .banner_contact { 
    /*background: transparent url(../img/group-pana.svg) no-repeat center 88px;
     min-height: 359px;*/
     background: transparent url(../img/group-pana.svg) no-repeat center 10px;
     min-height: 300px;
    width: 100%;
   
    background-size: 115%;
    justify-content: center;
    align-items: normal;
      }
      .banner_contact_stripe { 
        font-size: 32px;
        line-height: normal;
        width: 80%;
        text-align: center;
        padding-top: 30px;
      }

      .col_bon_a_savoir_installation_de_borne_de_recharge { background-position: 0px -20px; background-size: 49%; padding:0; padding-left: 46%;}
      .col_bon_a_savoir_pellet {background-position: 0px 20px; background-size: 46%; padding:0; padding-left: 46%;}
      .col_bon_a_savoir_energie_chauff {    background-position: -200px center; background-size: 100%;}
      .col_bon_a_savoir_projet_vert {background-position: 50px center; background-size: 240px; }





      .page-footer-container { width:768px; padding-left:20px; }
      .page-footer-ico-container { margin-right:20px;}
      .col_full_width_slide_in { width:100%; margin-left:0; padding-left:20px; padding-right:20px; }
      .col_full_width_slide_navig_left {left: 20px;     top: auto;bottom: 26px;}
      .col_full_width_slide_navig_right {right: 20px;    top: auto;bottom: 26px; }
      .col_full_width_slide_ariane_container { width: 100%; left: 0px; height:56px;}

      #website_header {
        min-height:74px;
      }

      .main_menu {
        height:74px;
        z-index:1000;
      }
      .main_menu_in {
        width:100%;
      }
      .main_menu_logo {
        float:right; margin-right:15px; width:200px; background: url(../img/easyenergylogowhite.svg) no-repeat top right; margin-top: -3px;
      }
      .main_menu_content {display:none;}
      .menu_mobile_capsule {
        width:768px; 
        position: absolute;
        top: 24px;
        left: 50%;
        margin-left: -384px;
      }

      .menu_mobile_trigger {display:block;} 
      .mobile-menu-item {width: 400px; visibility: visible; position: relative; border-bottom:1px solid #cccccc; background-color:#eeeeee; background-image:url(../img/next.svg); background-size: 20px; background-position: 98% 50%; background-repeat:no-repeat; background-size: 20px;}
      .mobile-menu-item:first-child {border-top:0px solid #cccccc;}
      /*.mobile-menu-item:last-child {border-bottom:0px solid #cccccc;}*/
      .mobile-menu-item-label {float:left;width:362px;padding:10px; background-color:#ffffff; box-sizing:border-box;}
      .mobile-menu-item-arrow {cursor:pointer; float:right;width:38px; padding-top:10px;padding-bottom:10px;  position: absolute; top: 0; bottom: 0; right: 0;}
      .mobile-menu-item-label-back {float:left; width:362px;padding:10px; text-align:left;background-color:#ffffff; }
      .mobile-menu-item-arrow-back {cursor:pointer; float:left;width:38px;background-image:url(../img/back.svg); background-size: 20px; background-position: center; background-repeat:no-repeat;padding-top:10px;padding-bottom:10px;}
      .mobile-menu-item-label a, .mobile-menu-item-label-back a  {text-decoration:none;}

      .mobile-menu-item-label-no-sub {width:400px;}
      .menu_mobile_visible {
        width:400px; 
      }

      #comment_pass_validation,
      #comment_pass_verif_validation,
      #NEW_ACC_comment_pass_validation,
      #NEW_ACC_comment_pass_verif_validation,
      #RESCUE_comment_pass_validation,
      #RESCUE_comment_pass_verif_validation {
        position:relative;
        top: 0;
        width: 100%;
        left: 0;
      }

      #comment_pass_validation b,
      #comment_pass_verif_validation b,
      #NEW_ACC_comment_pass_validation b,
      #NEW_ACC_comment_pass_verif_validation b,
      #RESCUE_comment_pass_validation b,
      #RESCUE_comment_pass_verif_validation b { 
        float: none;
        width: 0;
        height: 0;
        background: none;
        display:none;
      }

      #comment_pass_validation span,
      #comment_pass_verif_validation span,
      #NEW_ACC_comment_pass_validation span,
      #NEW_ACC_comment_pass_verif_validation span,
      #RESCUE_comment_pass_validation span,
      #RESCUE_comment_pass_verif_validation span {
        float:left;
        width: 100% ;
        background-color: #fdf294;
        padding: 15px;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        border-left:0px solid #35b2c3;
      }


      .comment_client_box { width: 50%;}

      .class_top_sale:before {

          left: 95px;
          top: -8px;
      }


    }
    /* iPad in landscape */  
    @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) { 
    }

  /*  #Mobile (Portrait)
  ================================================== */
    @media only screen and (max-width: 767px) {
      .page-footer, .page-wrap:after {
        /*height: 500px; */
      }
      .avatar_container{width:calc(33.33% - 7px); background-size: 70% }

      .main_col {width: 320px; margin: 0 auto;}


.main_banner {width:320px; height:510px; padding-bottom:50px; position: relative;}


.main_banner_title, h1.main_banner_title { 
  position:absolute;
  width:100%; float:none;
  font-size: 26px;
  top: 439px;
  transform: none;
  text-align: center;
  z-index: 10;

}
.main_banner_sub_title {
  margin-top:30px;
  font-size: 24px;
  display:none;
}
.main_banner_visual {
  position:absolute;
  width:100%; float:none;
  height:300px;
  top: 225px;
  transform: none;
  z-index: 9;
}

.stats_banner { width:320px; padding-top: 40px;  }
.stats_banner_title { font-size:30px;  }
#weight_curve_force_scroll_left_placeholder, #sonde_histo_conso_placeholder {width:320px;}
#weight_curve_force_scroll_left {width:320px;}
#weight_curve_force_scroll_left_in{width:200%;}



.homepage_mazout_extra_box_item {

}
.homepage_mazout_extra_box_item_title {
    font-size: 18px;
    float;none;
    padding-top: 10px;
}
.homepage_mazout_extra_box_item_price {

    font-size: 22px;
    float: none;
    padding-bottom: 5px;
    text-align: left;
    font-weight: bold;
    padding-right: 0;

}

.homepage_mazout_extra_box_item_price_abo {
   text-align: left;
}
.homepage_mazout_extra_box_item_price_abo_price {
   font-size: 22px;
}


/* double col modal  */

.commun_modal {
  width:300px;
}


.create_account_box_container, .create_delivery_address_box_container, .create_invoicing_address_box_container {  
    position: absolute;
    top: 100px;
    left: 50%;
    margin-right: 0%;
    margin-left: -150px;
    transform: none;
    padding: 20px;
    width:300px;
}

.commun_modal_free_ammount, .commun_modal_promocode, .commun_modal_order_by_ammount, .modal_groupage_qty, .modal_groupage_client_prospet {
    position: fixed;
    width:300px;
}

.create_account_box_container_col {
  float:none;
  width:100%;
  padding-right:0px;
  border: 0;
  margin-top: 0px;
}
.create_account_box_container_col_right {
  float:none;
  width:100%;
  padding-left:0px;
  margin-top: 23px;
}


/* goupage calendar */

.groupage_calendar_event { margin-top: 30px}
.groupage_calendar_event_day_box { float: left;  text-align: center; font-size:20px; font-weight:bold; border:1px solid #35b2c3; color :#35b2c3 }
.groupage_calendar_event_day_box span {font-size:16px; font-weight:normal; color:#000000}
.groupage_calendar_event_label_box { float: left; width:  calc(100% - 76px); padding: 3px; padding-left: 15px; padding-right: 15px; margin-bottom:5px;}
.groupage_calendar_event_label_box_myspace { float: none; clear:both; width:100%; padding:5px; }
.groupage_calendar_event_button_box { float: none; clear:both; width:100%; margin-top:3px; }



/*  tree banner */


.tree_banner {width:320px; }
.tree_banner_title { font-size: 30px}
.tree_visual_hook { height: 420px; }
.tree_visual_hook_txt_container { width:100%; padding-top:0px }
.tree_visual_hook_txt_small { font-size: 20px; }
.tree_visual_hook_dedicated_page { height: 320px; border-bottom:1px solid #cccccc;  }

.numCounter > div > b {width: 39px; margin: 0 1px; }

.order_banner, .order_banner___hook {padding-top:0px; padding-bottom:0px; width:100%;  }
.order_banner___hook {    padding: 20px;padding-top: 30px;}


.order_banner_title {font-size:26px; display:none; }

.order_visual_hook { width: 320px;
    background-size: 127%;
    background-position: center bottom;
    height: 520px; margin-top:0; }

.order_visual_hook_txt_container { margin-left: 0; padding-top: 0;}
.order_visual_hook_logo {   }
.order_visual_hook_txt_big { font-size: 40px; margin-top:25px; }
.order_visual_hook_txt_small {font-size: 20px; margin-top:25px; }
.order_visual_hook_btn { margin-top:25px; }

.order_module { width:100%;padding:15px;border-radius:0; }

.order_steps_container { width:90%; margin-top:10px; }
.order_all_slide { transform:none; top:0; padding: 10px;}
.order_all_slide_left_visual { float:none; width: 70px; height: 70px; background-size: cover; margin: 0 auto; margin-top:0px; margin-bottom:5px;}
.order_all_slide_right_form { width:100%;}
.order_all_slide_title { font-size: 26px; text-align: center}
.order_all_slide_form { text-align: center}
.order_all_slide_container_footer { padding:10px; margin-top:0; background:#ffffff; border-top:1px solid #eeeeee; position:fixed; bottom:0;}
.co_res_line { text-align: left;}
.order_product_item { width:calc(50% - 10px); /*height:120px;*/ }
.order_product_item_image {/*height:60px; background-size: 40px;*/}
#order_client_you_are_group .order_product_item_image {background-size:74px}

.order_product_item_mini {width: 80px; height: 80px;}

.order_steps_container_dot {width:12px; height:12px; overflow:hidden;}
.order_steps_container_line { width:20px; height:11px;}
.order_basket_container, .order_tva_rate_container, .order_total_qty_container, .order_total_container, .order_admin_tools_on{display:none;}
#product_qty_container, .option_qty_container { white-space: normal;}

#label_order_qty_produit{ width: 100%; font-weight: bold; margin-bottom: 15px;}
#order_qty_produit { width: 50%; margin: 0 auto;}
#order_qty_produit_other { width: 40%; transition: width 0.5s ease-in-out, padding 0.5s ease-in-out;   }
.order_qty_produit_other_hide {width:0 !important; opacity:0 !important; padding:0 !important;}
#label_order_qty_produit_res { width: 100%; margin-top: 15px;}

#order_client_id_groupage_label, #order_client_corporate_domain_label { width: 100%; font-weight: bold; margin-bottom: 15px;}
#order_client_id_groupage, #order_client_corporate_domain { width: 50%; }

.order_calendar_container, .frequence_calendar_container { float:none; width:100%;}
.order_calendar_day, .order_calendar_day:first-child, .frequence_calendar_day, .frequence_calendar_day:first-child {width: 100%; border: 0; border-bottom: 1px solid #cccccc; padding-bottom: 3px; margin-bottom: 3px; min-height:auto;}
.order_calendar_day_label, .frequence_calendar_day_label { width: 100%; }
.order_calendar_day_morning, .frequence_calendar_day_full {width: calc(50% - 2px); float: left; margin:0;  }
.frequence_calendar_day_full {width: 100%; float: none;}
.order_calendar_day_afternoon { width: calc(50% - 2px); float: right ; margin:0; }

.order_calendar_container_nav_left { display:none; }
.order_calendar_container_nav_right { display:none; }

.calendar_legende_container {text-align: left;}
.order_calendar_container_nav_mobile_container {display:block;}
.order_calendar_container_nav_mobile_left { float:left; width:calc(50% - 2px);  background:#35b2c3; padding:4px; border-radius:6px;  }
.order_calendar_container_nav_mobile_right { float:right; width:calc(50% - 2px); background:#35b2c3; padding:4px; border-radius:6px; }
.order_calendar_nav_left { width:100%; height:40px; color:#ffffff; line-height: 39px; margin:0 auto; position: relative; top: 0; transform: none; background: url(../img/arrow-white-left.png) no-repeat center left; background-size:16px;  }
.order_calendar_nav_right { width:100%; height:40px; color:#ffffff; line-height: 39px; margin:0 auto; position: relative; top: 0; transform: none; background: url(../img/arrow-white-right.png) no-repeat center right; background-size:16px;   }

#rdv_creneau_recap { display:block;}
.recap_header_container, .recap_raw_container { height:auto; padding-top: 10px; padding-bottom:10px; }
.recap_col_edition {float: right;
    text-align: right;
    margin-bottom: -20px;}
.recap_col_float {width:100%;}
.recap_col_produit{float:none; padding-bottom:5px;}
.recap_col_qty { width:17%; }
.recap_col_fois { width:8%; }
.recap_col_price_per_unit { width:30%; }
.recap_col_prix { width:45%; }

.recap_header_container .recap_col_edition { display: none; }
.recap_header_container .recap_col_float { font-weight:normal; }
.recap_col_produit { font-weight:bold; }
.recap_raw_container_option .recap_col_edition { display:none;}
.recap_raw_container_option .recap_col_produit  { width:100%; }
.recap_raw_container_option .recap_col_float { padding-top:0;}

.recap_col_float_admin .recap_col_produit  { width:100%; }

.pay_solution_container { width:100%;}
.pay_solution_item { display:block; width:100%; text-align: center; margin-top:30px;}
.pay_solution_label_container { display:block; width:80%; margin:0 auto;}
.pay_solution_order_total_container { margin-left:0px; margin-top: 10px; }

.my_space_evo_devis, .my_space_evo_groupage {
  width: calc(100% + 56px);
  overflow-x: scroll;
  overflow-y: hidden;
  margin-left: -28px;
  margin-right: -28px;
  height:155px;
  margin-bottom:20px;
}
.my_space_mobile_evo_line_all_parts { width:1350px;}
.my_space_mobile_evo_line_parts { width: 675px; float: left; text-align: left; }

.my_space_mobile_evo_line_all_parts_by_myself, .my_space_mobile_evo_line_all_parts_groupage, .my_space_mobile_evo_line_all_parts_wl { width:675px; }
#recap_content_next_step .commun_btn, .class_recap_content_next_step .commun_btn { width:100%; text-align: left; margin-top:10px}

#recap_content_next_step_bg, .class_recap_content_next_step_bg {
  min-height: auto; background: none; padding: 0px; border:0;
}
.class_recap_content_next_step_bg { 
  margin-top:60px; margin-bottom:10px;
}
.class_recap_content_next_step {
  margin-left:0;
}
.recap_content_next_step_bg_mobile {
  display:block;
}
.recap_content_next_step_arrow_shadow {
  display:none 
}
.recap_content_next_step_arrow {
  display:none 
}
#recap_content_next_step, .recap_content_next_step {
  -webkit-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23); 
  -moz-box-shadow: 0px 0px 15px 1px rgba(0,0,0,0.23); 
  box-shadow: 0px 0px 9px 1px rgba(0,0,0,0.23); 
  background:#ffffff; padding:0px; margin-left:0px;
  border-radius:10px; padding:20px;
}
.poseur_card_logo, .recap_chantier_content_delivery { width:100%; float: none; border:0; padding-bottom:20px; border-bottom:1px solid #cccccc;}
.poseur_card_intel, .recap_chantier_content_billing {
    width: 100%;
    float: none;
    min-height: auto;
    margin-top: 20px;
    border:0;
  }
.recap_facturation_line_ref_mollie {display:none; }
.recap_facturation_line_ref_mollie_bis {display:none;}
.recap_facturation_line_added {width:35%; height:18px;}
.recap_facturation_line_amount {width:40%;}
.recap_facturation_line_status {width: 25%;
    overflow: hidden;
    padding-left: 5px;
    white-space: nowrap;
}

.tank_item, .invoicing_item {
  width:100%;
  height:180px;
}


.delivery_item, .invoicing_devis_item {
  width:100%;
  background-position: 10px center; background-size: 40px;
  display: block;
  height: auto;
  min-height: 62px;

}
.delivery_item_add, .invoicing_devis_item_add { background-position: 14px center; background-size: 35px;  }
.delivery_item_intels, .invoicing_devis_item_intels {margin-left: 60px; text-align: left; position: relative;  }


.my_abo_page_container_cagnotte_visu_left_col {float:none; width:100%; height:150px; background-position: center -50px  }
.my_abo_page_container_cagnotte_visu_right_col {float:none; width:100%; height:auto;}
.my_abo_page_container_cagnotte_visu_right_col_bulle {padding:30px; background:#ffffff; border-radius:10px; }
.my_abo_page_container_cagnotte_visu_right_col_bulle_title {font-size:30px;}

input[type="button"].js_request_order_edition, input[type="button"].js_request_order_delivered, input[type="button"].js_request_order_clotured { width:100%; margin-top:10px;}
input[type="button"].remove_inv_add_go, input[type="button"].remove_tank_go { 
    width: 50px;
    overflow: hidden;
    padding-left: 0;
    background-position: center;
    text-indent: 100px;
}
      .tbl_choice_container_col_A,
      .tbl_choice_container_col_C,
      .tbl_choice_container_col_D,
      .tbl_choice_container_col_E,
      .tbl_choice_container_col_B { width:100%; margin:0; float:none; margin-bottom:20px; box-sizing: border-box;}
      .tbl_choice_container_col_avantages, .tbl_choice_container_col_avantages_carburant {  min-height: auto }

      .related_faq_container_title { font-size: 26px; }

      .banner_livraison_a_domicile_scroller_on_mobile_phone { width:100%; overflow-x: scroll; }
      .banner_livraison_a_domicile {width:820px; min-height: 485px; background-position: top center; background-size: 780px; }
      .banner_livraison_a_domicile_col_container { width:750px; padding-left:16px; padding-right:16px;  padding-top:330px; font-size:32px;  line-height: 20px;}
      .banner_livraison_a_domicile_col_A {width:calc(33.33% - 44px); margin-right:44px; padding-left:20px;   }
      .banner_livraison_a_domicile_col_B { padding-left:20px; padding-right:20px; }
      .banner_livraison_a_domicile_col_C {width:calc(33.33% - 44px); margin-left:44px; padding-right:20px; }
      .banner_livraison_a_domicile_col_txt { font-size:18px; }


      .banner_contrat_energie, .banner_contrat_energie_home {
          width: 320px;
          min-height: 471px;
          background: #ffffff url(../img/abonnement_visu.svg) no-repeat center 161px;
          background-size: 729px;
          display: block; 
          justify-content: normal; 
          align-items: center; }
      .banner_contrat_energie_home {
          min-height: 635px;
          background: #ffffff url(../img/abonnement_visu.svg) no-repeat center 320px;
          background-size: 729px;
          margin-top:0;
      }

      .banner_contrat_energie_stripe {
          width: 100%;
          text-align: center;
          padding-top: 50px;
          font-size: 30px;
      }
      .banner_contrat_energie_home_stripe_title1 {font-size: 30px; text-align: center}
      .banner_contrat_energie_home_stripe_title2 {font-size: 22px; font-weight:bold;margin-top:10px}
      .banner_contrat_energie_home_stripe_title3 {font-size: 18px;margin-top:5px}

      .banner_groupage { 
        min-height: 453px;
        background: #ffffff url(../img/groupage.svg) no-repeat center 23px;
        background-size: 110%;
        display: flex;
          justify-content: center;
          align-items: end;
        padding-top: 270px;
      }

      .banner_groupage_stripe { 
        font-size: 30px;
          line-height: normal;
          width: 100%;
          text-align: center;
          padding-bottom: 30px;
        }

      .banner_a_propos { 
        min-height: 350px;
        background: #ffffff url(../img/group-pana.svg) no-repeat center 95px;
        background-size: 230%;
        display: flex;
          justify-content: center;
          align-items: normal;
        padding-top:0px;
      }

      .banner_a_propos_stripe { 
        font-size: 30px;
          line-height: normal;
          width: 100%;
          text-align: center;
          padding-top: 30px;
        }

        .class24sur24{ margin-top:10px;}

        .banner_contact { 
/*background: transparent url(../img/group-pana.svg) no-repeat center 187px;
min-height: 381px;*/
background: transparent url(../img/group-pana.svg) no-repeat center 13px;
min-height: 216px;
    width: 100%;
    
    background-size: 185%;
      justify-content: center;
          align-items: normal;
      }
      .banner_contact_stripe { 
        font-size: 30px;
        line-height: 30px;
        width: 100%;
        text-align: center;
        padding-top: 30px;
      }

      .banner_parrainage { 
        min-height: 475px;
        background: #ffffff url(../img/sponsor.svg) no-repeat center 199px;
        background-size: 95%;
        justify-content: left;
        align-items: center;
      }

      .banner_parrainage_stripe { 
        font-size: 30px;
        width: 100%;
        padding-top: 40px;
        padding-left:0;
      }

      .main_col_parrainage {
        min-height: 800px;
      background:url(../img/sponsor_2.svg) no-repeat bottom  center; background-size: 350px; padding:0;}


      .banner_installation_de_sonde {
        width: 320px;
        min-height: 500px;
        background: #ffffff url(../img/sonde.svg) no-repeat right 220px;
        background-size: 419px;
        display: block;
        justify-content: normal;
        align-items: center;
      }

      .banner_installation_de_sonde_stripe { 
        font-size: 30px;
        width: 100%;
        padding-top: 40px;
        padding-left:0;
      }

      .banner_installation_de_borne_de_recharge {
        width: 320px;
        min-height: 276px;
        background: #ffffff url(../img/borne.svg) no-repeat right 80px;
        background-size: 107%;
        justify-content: left;
        align-items: normal;
      }

      .banner_installation_de_borne_de_recharge_stripe {
        font-size: 30px;
        width: 100%;
        padding-left: 0px;
        padding-top: 40px;
      }

      .banner_drive_in {
        width: 320px;
        min-height: 380px;
        background: #ffffff url(../img/drive_in.svg) no-repeat right 173px;
        background-size: 107%;
        justify-content: left;
        align-items: normal;
      }

      .banner_installation_de_drive_in_stripe {
        font-size: 30px;
        width: 100%;
        padding-left: 0px;
        padding-top: 40px;
      }

      .banner_adblue {
        width: 320px;
        min-height: 352px;
        background: #ffffff url(../img/adblue.svg) no-repeat right 150px;
        background-size: 107%;
        justify-content: left;
        align-items: normal;
      }

      .banner_adblue_stripe {
        font-size: 30px;
        width: 100%;
        padding-left: 0px;
        padding-top:40px;
      }

      .banner_pellet {
        width: 320px;
        min-height: 380px;
        background: #ffffff url(../img/pellets.svg) no-repeat right 180px;
        background-size: 107%;
        justify-content: right;
        align-items: normal;
      }

      .banner_pellet_stripe {
        font-size: 30px;
        width: 100%;
        padding-left: 0px;
        padding-top:40px;
      }

      .banner_energies_de_chauffage {
        width: 320px;
        min-height: 380px;
        background: #ffffff url(../img/combustible_choice.svg) no-repeat center 140px;
        background-size: 81%;
        justify-content: right;
        align-items: center;
      }

      .banner_energies_de_chauffage_stripe {
        font-size: 30px;
        width: 100%;
        padding-left: 10px;
        padding-top: 40px;
      }


      .banner_energies_de_roulage {
        width: 320px;
        min-height: 380px;
        background: #ffffff url(../img/carburant_choice.svg) no-repeat center 140px;
        background-size: 109%;
        justify-content: right;
        align-items: center;
      }

      .banner_energies_de_roulage_stripe {
        font-size: 30px;
        width: 100%;
        padding-left: 0px;
        padding-right: 0px;
        padding-top: 40px;
      }

      .tree_banner_contrat_energie { margin-bottom:0; padding-bottom: 0;}
      .tree_visual_hook_contrat_energie {min-height:300px; height:300px;}

      .col_bon_a_savoir {  padding:15px; padding-top:200px; 
      background-position: center 20px; background-size:160px;
      }
      .col_bon_a_savoir_contrat_energie, .col_bon_a_savoir_commune_livraison {background-position: center top; background-size: 240px; padding:0; padding-top: 250px;}
      .col_bon_a_savoir_installation_de_borne_de_recharge { background-position: center top; background-size: 88%; padding: 0; padding-top: 250px;}
      .col_bon_a_savoir_pellet {background-position: center top; background-size: 88%; padding:0; padding-top: 200px;}
      .col_bon_a_savoir_energie_chauff {  background-position: center top;  background-size: 178%; padding: 0; padding-top: 202px;}

      .col_bon_a_savoir_contrat_energie_txt {  padding:15px }
        .col_bon_a_savoir_projet_vert {background-position: center 30px; background-size: 250px; padding:30px; padding-top: 200px;}

      .page-footer_hide { display:none;}

      .page-footer-container { width:100%; padding-left:20px; padding-right: 20px;   font-size: 1rem; line-height: 1.5em;}
      .page-footer-col-container {width:100%;}
      .page-footer-col-left-a, .page-footer-col-left-b, .page-footer-col-left-c {width: 100%; float: none; border:0; margin-top:20px; padding:0; min-height: auto}
      .page-footer-ico-container { width:100%; float:none;}
      .ico_fb, .ico_yt, .ico_instagram, .ico_gmap {  display: inline-block; float: none; margin:0; margin-right:10px; margin-bottom:10px; }

      .col_full_width, .col_full_width_slide, .col_full_width_slide_filter_dark { height:280px;}
      .col_full_width_slide_in {font-size: 26px;padding-left:20px; padding-right:20px;}
      .col_full_width_slide_in_big_title {font-size: 30px}

      .col_full_width_slide_in { width:100%; margin-left:0; }
      .col_full_width_slide_navig_left {left: 5px;     top: auto;bottom: 16px;}
      .col_full_width_slide_navig_right {right: 5px;    top: auto;bottom: 16px; }
      .col_full_width_slide_ariane_container { width: 100%; left: 0px; height:44px;}

      #website_header {
        min-height:74px;
      }
      .main_menu {
        height:74px;
        z-index:1000;
      }
      .main_menu_in {
        width:100%;
      }
      .main_menu_logo {
        float:right; margin-right:15px; width:200px; background: url(../img/easyenergylogowhite.svg) no-repeat top right; margin-top: -3px;
      }
      .menu_mobile_capsule {
        width:320px; 
        position: absolute;
        top: 24px;
        left: 50%;
        margin-left: -160px;
      }

      .main_menu_content {display:none;}
      .menu_mobile_trigger {display:block;} 

      .mobile-menu-item {width: 280px;visibility: visible; position: relative; border-bottom:1px solid #cccccc; background-color:#eeeeee; background-image:url(../img/next.svg); background-size: 20px; background-position: 96.5% 50%; background-repeat:no-repeat;}
      .mobile-menu-item:first-child {border-top:0px solid #cccccc;}
      /*.mobile-menu-item:last-child {border-bottom:0px solid #cccccc;}*/
      .mobile-menu-item-label {float:left;width:242px;padding:10px; background-color:#ffffff;box-sizing:border-box;}
      .mobile-menu-item-arrow {cursor:pointer; float:right;width:38px; padding-top:10px;padding-bottom:10px;  position: absolute; top: 0; bottom: 0; right: 0;}
      .mobile-menu-item-label-back {float:left; width:242px;padding:10px; text-align:left;background-color:#ffffff; }
      .mobile-menu-item-arrow-back {cursor:pointer; float:left;width:38px;background-image:url(../img/back.svg); background-size: 20px;  background-position: center; background-repeat:no-repeat;padding-top:10px;padding-bottom:10px;}
      .mobile-menu-item-label a, .mobile-menu-item-label-back a  {text-decoration:none; }

      .mobile-menu-item-label-no-sub {width:280px;}
      .menu_mobile_visible {
        width:280px; 
      }


      .FAQ_left_col {display:block; vertical-align: top; width:100%; border-right: 0px solid #cccccc; padding-right:0px;  }
      .FAQ_right_col {display:block; vertical-align: top; width:100%; border-left: 0px solid #cccccc; padding-left:0px;  margin-left:0px;}

      .comment_client_box { width: 100%;}

      #comment_pass_validation,
      #comment_pass_verif_validation,
      #NEW_ACC_comment_pass_validation,
      #NEW_ACC_comment_pass_verif_validation,
      #RESCUE_comment_pass_validation,
      #RESCUE_comment_pass_verif_validation {
        position:relative;
        top: 0;
        width: 100%;
        left: 0;
      }

      #comment_pass_validation b,
      #comment_pass_verif_validation b,
      #NEW_ACC_comment_pass_validation b,
      #NEW_ACC_comment_pass_verif_validation b,
      #RESCUE_comment_pass_validation b,
      #RESCUE_comment_pass_verif_validation b { 
        float: none;
        width: 0;
        height: 0;
        background: none;
        display:none;
      }

      #comment_pass_validation span,
      #comment_pass_verif_validation span,
      #NEW_ACC_comment_pass_validation span,
      #NEW_ACC_comment_pass_verif_validation span,
      #RESCUE_comment_pass_validation span,
      #RESCUE_comment_pass_verif_validation span {
        float:left;
        width: 100% ;
        background-color: #fdf294;
        padding: 15px;
        -webkit-box-shadow: none;
        -moz-box-shadow: none;
        box-shadow: none;
        border-left:0px solid #35b2c3;
      }

      .myspace_quote_line_desc_order_id { width:48%;}
      .myspace_quote_line_desc_order_date { display:none;}
      .myspace_quote_line_desc_order_number_product { display:none;}
      .myspace_quote_line_desc_order_total_tvac { width:48%;}
      .myspace_quote_line_desc_order_state { display:none;}


      .frequence_start_date_container input, .frequence_start_date_container label { width:80%;}
      .frequence_end_date_container input, .frequence_end_date_container label { width:80%;}
      .frequence_type_date_container select, .frequence_type_date_container label { width:80%;}

      .we_are_on_smartphone { display: block }

      .class_top_sale:before {

          left: 114px;
          top: -8px;
      }

      .container_all_sonde_box { border: 0; } 
      #weight_curve_force_scroll_left {border-left: 1px solid #cccccc !important;}
      .sonde_view_col, .sonde_view_col_r { float:none; width:100%; border: 0;  border-bottom:1px solid #eeeeee; }


      input[type=button].back_arrow { 
        margin-left:50px;
      }

      .cfGMLl {
        left:7px !important;
        bottom:12px !important;
      }


    }


  /* #Mobile (Landscape)
  ================================================== */
    @media only screen and (min-device-width : 0px) and (max-device-width : 1023px) and (min-aspect-ratio: 13/9) {

    }


.col_full_width_small_height {
  height:450px;  
}

.col_full_width_small_height .col_full_width_slide_in {
  /*padding-top:60px;*/
}

.suspension_mollie {
  opacity: 0.3; pointer-events:none
}

.cookies {
  position: fixed;
    bottom: 20px;
    left: 20px;
    background: #ffffff url(../img/cookie.png) 5px center no-repeat;
    background-size: 25px;
    text-decoration: none;
    padding: 8px;
    padding-left: 35px;
    border-radius: 6px;
    color: #333333;
    z-index: 100;
    box-shadow: 1px 1px 9px 5px rgb(0 0 0 / 20%);
    white-space: nowrap;
}
.cookies_shorten {
  width:36px;
  overflow: hidden;
      color: transparent;
  padding-left: 0px;
}

data-cookiefirst-button
/* overwrite de cookies first */
.cookiefirst-root button[data-cookiefirst-action="accept"],
.cookiefirst-root button[data-cookiefirst-button="primary"],
.cookiefirst-root button[data-cookiefirst-action="secondary"] {
    background-color: #a4c408 !important;
    border-color: #a4c408 !important;
}

.cookiefirst-root button[data-cookiefirst-action="save"], 
.cookiefirst-root button[data-cookiefirst-action="primary"],
.cookiefirst-root button[data-cookiefirst-action="adjust"],
.cookiefirst-root button[data-cookiefirst-button="secondary"] {
    background-color: #35b2c3 !important;
    border-color: #35b2c3 !important;
}

.cookiefirst-root a, .cookiefirst-root button[data-cookiefirst-accent-color] {
  color : #2a9faf !important;
}




.cookiefirst-root button[data-cookiefirst-action="accept"] .cf1y60 { font-weight:bold; }

 button[data-cookiefirst-action="reject_second"], button[data-cookiefirst-action="reject"] {display:none;}
 .cf3l36:nth-child(2) { display:none;} 

.cf2DrG {
    width: 320px !important;
    height: 258px !important;
    position: fixed !important;
    top:0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    margin: auto !important;

    padding-top: 0 !important;
    outline: 9999px solid rgba(0,0,0,0.6); /* pseudo modal effect */
}

.cf2L3T {
  flex: 0 0 100% !important;
  max-width: 100% !important;
}

.cf1QhF, .cf3Tgk {
  margin-top: 15px !important;
  white-space: nowrap !important;
}

.cf2MAH {
  flex: 0 0 50% !important;
  max-width: 50% !important;
}


 /*.cookiefirst-root {
--banner-font-family: inherit !important;
--banner-width: 100% !important;
--banner-bg-color: red !important;
--banner-shadow: 10% !important;--banner-text-color: rgba(0,0,0,1) !important;
--banner-outline-color: rgba(255,82,0,1) !important;
--banner-accent-color: rgba(13,86,201,1) !important;
--banner-text-on-accent-bg: #fff !important;
--banner-border-radius:0 !important;
--banner-widget-border-radius: 0 !important;
--banner-btn-primary-text:rgba(255,255,255,1) !important;
--banner-btn-primary-bg:rgba(13,86,201,1) !important;
--banner-btn-primary-border-color:rgba(13,86,201,1) !important;
--banner-btn-primary-border-radius:4px !important;
--banner-btn-primary-hover-text:rgba(13,86,201,1) !important;
--banner-btn-primary-hover-bg:rgba(0,0,0,0) !important;
--banner-btn-primary-hover-border-color:rgba(13,86,201,1) !important;
--banner-btn-primary-hover-border-radius:4px !important;
--banner-btn-secondary-text:rgba(255,255,255,1) !important;
--banner-btn-secondary-bg:rgba(13,86,201,1) !important;
--banner-btn-secondary-border-color:rgba(13,86,201,1) !important;
--banner-btn-secondary-border-radius:4px !important;
--banner-btn-secondary-hover-text:rgba(13,86,201,1) !important;
--banner-btn-secondary-hover-bg:rgba(0,0,0,0) !important;
--banner-btn-secondary-hover-border-color:rgba(13,86,201,1) !important;
--banner-btn-secondary-hover-border-radius:4px !important;
}*/