@import url(/css/source_sans_pro.css);


:root {
  --color-white: #fff;
  --color-white-i: #dadada;
  --color-white-ii: #ebebeb;
  --color-black: #000;
  --color-primary: #f60;
  --color-secondary: #3c5a9a;
  --color-gray-i: #ccc;
  --color-gray-ii: #333;
  --color-gray-iii: #666;
  --color-gray-iiii: #f2f2f2;
  --color-blue-i: #162d50;
  --color-blue-ii: #1c3a7a;
  --color-blue-iiii: #2a406d;
  --color-blue-iii: #3e5c9a;
  --color-orange-i: #f70;
  --color-orange-ii: #fa0;
  --color-orange-iii: #df4600;
  --color-red: #f00;
}

/* Reset
------------------------------------------------------------------------------*/
html {
  font-size: 62.5%;
}
body {
  display: flex;
  flex-direction: column;
  font-size: 1.8rem;
  color: var(--color-secondary);
  font-family: "Source Sans Pro", arial, sans, helvetica;
  background: var(--color-white);
}
a {
  color: var(--color-primary);
  text-decoration: none;
}
a::-moz-focus-inner {
  border: 0;
}
button::-moz-focus-inner {
  border: 0;
}
ol, ul {
  list-style-type: none;
  margin: 0;
}

pre {
  color: black;
  padding: 1rem 2rem;
  margin: 1rem 1rem;
  border: 1px solid var(--color-gray-i);
  overflow-x: auto;
  font-size: 1.4rem;
}
@media all and (max-width: 768px) {
  pre {
    font-size: 80%;
    margin: 1rem 0.5rem;
  }
}

hr {
  border-top: 1px solid var(--color-white-i);
  border-left: none;
  border-right: none;
  border-bottom: none;
}

small {
  font-size: 1.2rem;
}

.text {
  color: var(--color-blue-i);
}
.text_upper {
  text-transform: uppercase;
}
.text_blue {
  color: var(--color-blue-i) !important;
}
.text_orange {
  color: var(--color-primary) !important;
}
.text_white {
  color: var(--color-white) !important;
}
.texte_gris {
  color: var(--color-gray-iii) !important;
}
.no_break {
  white-space: nowrap !important;
}
.text_dark_grey {
  color: var(--color-gray-ii) !important;
}
.text_red {
  color: var(--color-red) !important;
}

.border_blue {border-color: var(--color-secondary) !important}

/* Helpers
------------------------------------------------------------------------------*/
.alnl  {text-align: left}
.alnr  {text-align: right}
.alnc  {text-align: center}
.alncb {margin: 0 auto;}

.valnm {vertical-align: middle}

.block {display: block;}
.block_center {
  margin-left: auto;
  margin-right: auto;
}




.img {
  display: block;
  width: 100%;
}
.img_ib {
  display: inline-block;
  max-width: 100%;
}

.titre_page {
  padding: 4rem 1rem 2rem 1rem;
}
.liste_text {
  padding-left: 4rem;
  margin: 1.5rem 0;
  list-style-type: disc;
}
.liste_text li {
  padding: 0.2rem 0;
}
.list-ol {
  padding-left: 2rem;
  list-style-type: decimal;
  color: var(--color-gray-ii);
}

.pointer {
  cursor: pointer;
}

.upper
{
  text-transform: uppercase !important;
}
.lower {
  text-transform: none !important;
}



/* Alerts */
.alert {
  padding: 1.5rem 2rem;
  border: 1px solid #cfcfcf;
  background-color: rgba(231, 231, 231, 0.8);
  color: var(--color-gray-ii);
  border-radius: 0.2rem;
  margin: 1rem auto;
}
.alert-info {
  color: #131c31;
  background-color: rgba(210, 232, 251, 0.8);
  border-color: #85a5ef;
}
.alert-success {
  color: #003b00;
  background-color: rgba(213, 255, 213, 0.8);
  border-color: #85ff85;
}
.alert-danger {
  color: var(--color-orange-i);
  background-color: rgba(255, 227, 227, 0.8);
  border-color: #fdafaf;
}


/* Styles generales
------------------------------------------------------------------------------*/
.mt_xs { margin-top: 0.5rem; }
.mt_sm { margin-top: 1rem; }
.mt_2, .mt_md { margin-top: 2rem !important; }
.mt_md2 { margin-top: 3rem !important; }
.mt_4, .mt_lg { margin-top: 4rem !important; }
.mt_6 { margin-top: 6rem !important; }
.mt_xl { margin-top: 8rem; }
.mt_-1 { margin-top: -1rem !important; }
.mb_-1 { margin-bottom: -1rem !important; }

.ml_md { margin-left: 2rem; }


.pad_tb_sm-2 {padding: 0.3rem 0}
.pad_tb_sm {padding: 0.5rem 0}
.pad_tb {padding: 1rem 0}
.pad_tbxtra {padding: 2rem 0}
.pad_lr {padding: 0 1rem}
.pad_b_l {padding-bottom: 2rem}
.pad_b_xl {padding-bottom: 4rem}
.pad_b_0 {padding-bottom: 0 !important;}
.p_1 {padding: 1rem}
.p_2 {padding: 2rem}
.p_4 {padding: 4rem}
.p_6 {padding: 6rem}
.p_10 {padding: 10rem}
.p_l_1_s {padding-left: 1rem !important;}
.p_m_1_s {padding-left: 1rem !important;}
.p_l_2 {padding-left: 2rem;}
.p_l_4 {padding-left: 4rem;}
.p_l_6 {padding-left: 6rem !important;}
.p_t_1 {padding-top: 1rem;}
.p_t_4 {padding-top: 4rem;}
.p_t_8 {padding-top: 8rem;}
.p_t_8 {padding-top: 20rem;}
.p_b_8 {padding-bottom: 8rem;}
.p_b_10 {padding-bottom: 10rem;}
.p_lr_2 {padding-left: 2rem; padding-right: 2rem;}
.p_tb_2 {padding-top: 2rem; padding-bottom: 2rem;}
.p_tb_3 {padding-top: 3rem; padding-bottom: 3rem;}
.p_tb_4 {padding-top: 4rem; padding-bottom: 4rem;}
.p_r_2 {padding-right: 2rem;}
.p_r_4 {padding-right: 4rem !important;}
.p_r_6 {padding-right: 6rem !important;}

@media all and (max-width: 599px) {
  .p_l_1_s {
    padding-left: 0 !important;
  }
}
@media all and (max-width: 799px) {
  .p_m_1_s {
    padding-left: 0 !important;
  }
}

.txt_p {font-size: 1rem !important;}
.txt_mp {font-size: 1.2rem !important;}
.txt_m {font-size: 1.4rem !important;}
.txt_mg {font-size: 1.6rem !important;}
.txt_g {font-size: 2rem !important;}
.txt_xg {font-size: 3rem !important;}
.txt_xxg {font-size: 4rem !important;}

.fs_1p2 {font-size: 1.2rem;}
.fs_1p4 {font-size: 1.4rem;}
.fs_2 {font-size: 2rem !important;}
.fs_3 {font-size: 3rem;}
.fs_12 {font-size: 12rem !important;}

.fwb {font-weight: bold !important;}

.ln_h_0p6 {line-height: 0.6;}
.ln_h_1 {line-height: 1.5;}

.border_1px {border: solid 1px transparent !important}



@media all and (max-width: 480px) {
  .mt_xs_sm { margin-top: 0.5rem; }
  .mt_sm_sm { margin-top: 1rem; }
  .mt_md_sm { margin-top: 2rem; }
  .mt_lg_sm { margin-top: 4rem; }
  .mt_xl_sm { margin-top: 8rem; }
}
@media all and (max-width: 599px) {
  .mt_lg_md { margin-top: 4rem; }
}
@media all and (max-width: 799px) {
  .mt_xs_l { margin-top: 0.5rem; }
}

.disp_i_b {
  display: inline-block !important;
}
.disp_b {
  display: block !important;
}

.bg_light_grey {background-color: var(--color-white-ii);}
.bg_white {background-color: var(--color-white) !important;}

/*Boutons oranges*/
button, .bouton {
  padding: 1rem;
  border-radius: 4px;
  position: relative;
  margin: 5px 0 7px;
  font-size: 1.4rem;
  font-family: inherit;
/*   font-weight: bold; */
  color: white;
  background: var(--color-primary);
  transition: background 0.2s;
  cursor: pointer;
}
button:hover, .bouton:hover {
  background: var(--color-orange-i);
}
button:active, .bouton:active {
  top: 1px;
  background: var(--color-orange-ii);
}
.bouton {
  display: inline-block;
  text-decoration: none;
  text-align: center;
}
button.btn_sm, .bouton.btn_sm {
  padding: 0.1rem 1.5rem;
}
.bouton.bt_orange {
  color: var(--color-white);
}
.bouton.bt_orange:hover {
  color: var(--color-white);
}
.bouton.bt_bleu {
  color: var(--color-white);
  background: var(--color-secondary);
}
.bouton.bt_bleu:hover {
  color: var(--color-white);
}
.bouton_transparent {
  background-color: transparent;
  border: solid 1px var(--color-primary);
  color: var(--color-primary);
}
.bouton_transparent:hover {
  color: var(--color-white);
}
.bouton_disabled {
  background-color: var(--color-gray-i);
  cursor: default;
}
.bouton_disabled:hover {
  background-color: var(--color-gray-i);
}
.bouton_disabled:active {
  background-color: var(--color-gray-i);
  top: 0;
}

/******************************************************************************/
.btn {
  border-width: 1px;
  border-style: solid;
  padding: 0.5rem 1rem;
  border-radius: 3px;
  font-size: 1.6rem;
  position: relative;
}
.btn_block {
  width: 100%;
}
.btn:active {
  top: 0.1rem;
}
.btn.default:hover, .btn.btn_orange:hover, .btn.btn_bleu:hover  {
  color: var(--color-white);
}
.btn.default {
  background-color: var(--color-white);
  color: var(--color-secondary);
  border-color: var(--color-blue-iii);
}
.btn.btn_orange {
  background-color: var(--color-primary);
  color: var(--color-white);
  border-color: var(--color-orange-iii);
}
.btn.btn_bleu {
  background-color: var(--color-secondary);
  color: var(--color-white);
  border-color: var(--color-blue-ii);
}

/******************************************************************************/

/*Elements form*/
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea, select {
  max-width: 40rem;
  -webkit-transition: border-color 0.2s;
  -moz-transition: border-color 0.2s;
  transition: border-color 0.2s;
}
input[type="email"]:hover,
input[type="number"]:hover,
input[type="search"]:hover,
input[type="text"]:hover,
input[type="tel"]:hover,
input[type="url"]:hover,
input[type="password"]:hover,
textarea:hover, select:hover {
  border-color: #6083c3;
}
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus, select:focus {
  border-color: var(--color-primary);
}
form label {
  color: var(--color-secondary);
}

.color_blanc {
  color: var(--color-white) !important;
}

.fond_blanc {
  background-color: var(--color-white);
}
.fond_gris {
  background-color: var(--color-gray-iiii);
}

.contenu {
  line-height: 1.2;
  padding: 2rem 2rem 8rem 2rem;
  margin-top: 1rem;
  flex: 1 0 auto;
}

.contenu h1 {
  display: inline-block;/*firefox bug; met margin a l'exterior de super_container aussi*/
  margin-bottom: 4rem;
}

.contenu a {
  text-decoration: none;
  color: var(--color-primary);
  -webkit-transition: color 0.2s;
  -moz-transition: color 0.2s;
  transition: color 0.2s;
}
.contenu a:hover {
  color: var(--color-primary);
}


#scroll_top {
  display: none;
  width: 0px;
  height: 50px;
  position: fixed;
  bottom: 56px;
  right: 8px;
  z-index: 5;
  background: url("../images/scroll_top.png") 0 0 no-repeat;
  cursor: pointer;
  text-decoration: none;
}

.separateur, .separateur2 {
  display: inline-block;
  width: 1px; height: 240px;
  float: left;
  margin-left: -1px;
  background: var(--color-gray-i);
}
.separateur2 {
  height: 154px;
}
.add_separator:after {
  content: '';
  display: block;
  width: 1px;
  height: 100%;
  position: absolute;
  right: 0;
  top: 0;
  background-color: var(--color-gray-i);
}
@media (max-width: 799px) {
  .separateur, .separateur2 {
    display: none;
  }
  .add_separator:after {
    display: none;
  }
}
@media all and (min-width: 481px) and (max-width: 800px) {
  .separateur {
    height: 220px;
  }
}

/*  Validation du formulaire avec javascript */
.parsley-required, .parsley-type {
  color: var(--color-red);
  font-size: 1.4rem;
}

.parsley-error {
/*   border-color: var(--color-red) !important; */
/*   background: var(--color-gray-iiii); */
  box-shadow: 0 0 4px #f00;
}

/*Container general
------------------------------------------------------------------------------*/
.super_container {
  width: 100%;
  min-height: 100%;
/*   padding-bottom: 45rem; */
  position: relative;
/*   background: #222 url("../images/fond-accueil2.jpg") repeat-x; */
}



/*Entete
------------------------------------------------------------------------------*/
#navbar {
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 3;
}
@media all and (min-width: 800px) {
  #navbar {
    border-bottom: 1px solid var(--color-white-ii);
    background: rgba(235,235,235,0.9);
    box-shadow: inset 0 0 4px var(--color-white);
  }
}
@media (max-width: 799px) {
  #navbar {
    width: 45px; height: 45px;
    position: absolute;
    top: 15px; right: 15px;
    background: url("../images/menu2-gris.png?v=1") no-repeat;
  }
  #page_accueil #navbar {
    background-image: url("../images/menu2.png?v=2");
  }
  #navbar .container {
    width: auto;
    border: 1px solid var(--color-white-ii);
    position: absolute;
    right: 0; top: 45px;
    background: var(--color-white);
    box-shadow: 0 0 2rem -0.5rem var(--color-black);
  }
  .hover_menu .container {
    display: none;
  }
  .hover_menu:hover .container {
    display: block;
  }
}

#logo2 {
  display: none;
  width: 13rem; /*height: 10px;*/
  position: absolute;
  left: 0; top: 0.2rem;
}
#logo2 img {
  display: block;
  width: 100%;
  margin-top: 5px;
}
@media (max-width: 799px) {
  #logo2 {
    display: none;
  }
}


#menu {
  text-align: left;
  float: right;
  text-transform: uppercase;
}
#menu li a,
#menu > li > span {
  display: block;
  overflow: hidden;
  color: var(--color-secondary);
}
#menu > li {
  position: relative;
  display: inline-block;
  padding: 1.2rem 0.4rem;
}
#menu > li:hover > div {
  display: block;
}
#menu > li > div {
  display: none;
  position: absolute;
/*   min-width: 32rem; */
  padding-top: 1.4rem;
  left: 0;
  top: 90%;
}
.sous_menu > div > ul::before {
  display: block;
  width: 100%;
  height: 1.4rem;
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  background: url("../images/triangle.png") no-repeat 20% 0;
}
.sous_menu > div > ul {
  box-shadow: 0 0 2rem -0.5rem var(--color-black);
  border-top: solid 0.2rem var(--color-white);
  border-bottom: solid 0.2rem var(--color-white);
}
.sous_menu > div > ul > li > a {
  padding: 0.8rem;
  background-color: var(--color-white);
  white-space: nowrap;
}
#menu > li > div > ul > li:hover a {
  color: var(--color-white);
  background-color: var(--color-secondary);
}
.triangle_droite > ul::before {
  background-position: 94% 0 !important;
}
.triangle_gauche_30x > ul::before {
  background-position: 30% 0 !important;
}

.abs_right_0 {
  left: auto !important;
  right: 0 !important;
}
.abs_left_-60x {
  left: -60% !important;
  right: auto !important;
}

#menu li a span {
  position: relative;
  display: inline-block;
  -webkit-transition: -webkit-transform 0.3s;
  -moz-transition: -moz-transform 0.3s;
  transition: transform 0.3s;
}
#menu li a span::before {
  position: absolute;
  top: 100%;
  content: attr(data-hover);
  color: var(--color-primary);
  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
#menu li a:hover span {
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  transform: translateY(-100%);
}
#menu .sous_menu {
  padding-right: 1.6rem;
  background-position: right center;
  background-repeat: no-repeat;
}
@media (max-width: 799px) {
  #menu {
    float: none;
    overflow-y: scroll;
/*     max-height: 40rem; */
  }
  #menu > li {
    display: block;
  }
  #menu > li > div {
    display: block;
    position: static;
    padding-top: 0;
  }
  #menu > li > div > ul {
    box-shadow: none;
  }
  #menu > li > div > ul > li a {
    display: block;
  }
  #menu > li,
  #menu > li > div > ul > li a {
    padding-left: 1.2rem;
    padding-right: 1.2rem;
  }
  .sous_menu .abs_right_0 {
    left: 0 !important;
    right: auto !important;
  }
  #menu > li > div > ul::before {
    display: none;
  }
  #menu .sous_menu {
/*     height: 0; */
  }
  .sm_display_normal {
    padding: 0 !important;
  }
  .sm_display_normal > div > ul > li > a {
    padding: 0.8rem 0.4rem;
  }
  #menu .sous_menu.sm_display_normal > span {
    display: none;
  }
  .sous_menu {
    background: none !important;
  }
}





.top_bar {
  padding-bottom: 2rem;
}

@media all and (max-width: 799px) {
  .top_bar {
    padding-top: 0;
  }
}
@media all and (min-width: 800px) {
  .top_bar {
    padding-top: 5rem;
  }
}

#container_logo {
  display: inline-block;
  margin-top: 1rem;
  text-align: center;
  animation-duration: 0.5s;
  animation-name: logo;
}
@keyframes logo {
  from {
    margin-top: -40px;
    opacity: 0;
  }
  to {
    margin-top: 0;
    opacity: 1;
  }
}

@media all and (max-width: 799px) {
  #container_logo {
    margin-top: 2rem;
  }
}
#logo {
  display: block;
  height: 46px;
  vertical-align: middle;
  position: relative;
}
#logo img {
  width: 100%;
  max-width: 22rem;
}
#slogan {
  margin: 0 0 5px 0;
  padding: 0;
  font-size: 2.2rem;
  color: var(--color-secondary);
}
/* @media all and (min-width: 481px) and (max-width: 600px) { */
@media all and (max-width: 799px) {
  #logo {
    height: 4rem;
  }
  #container_logo {
    margin-right: 2rem;
  }
  #slogan {
    font-size: 1.8rem;
  }
}


#slogan span {
  color: var(--color-primary);
}
@media (max-width: 799px) {
  #logo img {
    width: 160px;
  }
  #logo {
    height: 36px;
  }
  #slogan {
    font-size: 1.6rem;
  }
}
#page_accueil #slogan, #page_accueil #slogan span {
  color: var(--color-white);
}

.entete_droite {
  padding: 2rem 0;
}
.entete_droite a {
  vertical-align: middle;
}
@media (max-width: 799px) {
  .entete_droite {
    text-align: center;
  }

}
.entete_droite #langues img {
  display: none;
  margin-left: 1rem;
  vertical-align: middle;
}

#langues {
  display: inline-block;
  position: relative;
  cursor: pointer;
  padding: 1rem 0.5rem;
}
.langues_hover ul {
  display: none;
}
.langues_hover:hover ul {
  display: block;
}
@media (max-width: 480px) {
  #langues {
    display: none;
  }
}


#langues ul {
  width: 16rem;
  padding: 0.4rem;
  position: absolute;
  top: 4rem; right: 0;
  z-index: 2;
  background: var(--color-white);
  box-shadow: 0 0 5px var(--color-black);
}
#langues ul li {
  display: block;
  text-align: left;
}
#langues ul li a {
  display: block;
  padding: 0.7rem 0.6rem 0.7rem 0.4rem;
  font-size: 1.6rem;
  color: var(--color-secondary);
  text-decoration: none;
}
#langues ul li a:hover {
  color: var(--color-primary);
}


/*Page accueil
------------------------------------------------------------------------------*/
.bg_accueil {
  width: 100%;
  height: 800px;
  position: absolute;
  left: 0;
  top: 0;
  background: var(--color-secondary) radial-gradient(ellipse, var(--color-secondary) 70%,  var(--color-blue-iiii));
  background-color: var(--color-secondary);
  z-index: -1;
}

.accueil_top {
  position: relative;
}
.accueil_top .container > div {
  min-height: 460px;
}
#img_tablette {
  width: 50%;
  margin-right: 20px;
  max-width: 530px;
  position: absolute;
  right: 50%;
  bottom: 0;
  background-image: url('../images/ombre_tablette.png');
  background-repeat: no-repeat;
  background-position: 120% 100%;
}
#img_tampon {
  display: block;
  width: 20%;
  position: absolute;
  left: -90px;
  top: -50px;
  z-index: 2;
}
#img_tampon img {
  width: 100%;
}
@media all and (max-width: 1200px) {
  #img_tampon {
    left: -60px;
    top: -40px;
  }
}
@media all and (max-width: 1100px) {
  #img_tampon {
    left: -40px;
    top: -40px;
  }
}
@media all and (max-width: 860px) {
  #img_tampon {
    left: -20px;
    top: -20px;
  }
}
@media all and (max-width: 768px) {
  #img_tampon {
    width: 34%;
    left: 0px;
    top: -40px;
  }
}
#texte_accueil_lander {
  margin: 2rem 0 6rem 52%;
  color: var(--color-white);
  width: 48%;
}
@media all and (max-width: 860px) {
  .accueil_top .container > div {
    min-height: 320px;
  }
  #texte_accueil_lander {
    margin: 1rem 0 2rem 52%;
  }
}
#texte_accueil_lander h1 {
  font-size: 3.2rem;
  font-weight: normal;
}
#texte_accueil_lander p {
  margin-top: 3rem;
  font-size: 1.8rem;
}
#icones_tous_commerces {
  margin-top: 3rem;
  font-size: 2.6rem;
}
#icones_tous_commerces img {
  max-width: 290px;
  margin-top: 1rem;
}

@media all and (max-width: 750px) {
  .accueil_top .container {
    width: 100%;
  }
  #img_tablette {
    display: block;
    width: 100%;
    position: static;
    margin: 0 auto;
  }
  #texte_accueil_lander {
    width: 100%;
    margin: 0;
    padding-top: 4rem;
    background: var(--color-white);
    color: var(--color-secondary);
    text-align: center;
  }
  #texte_accueil_lander h1 {
    margin: 0rem 6rem;
  }
  #icones_tous_commerces {
    padding: 2rem 0;
    color: var(--color-white);
    background-color: var(--color-secondary);
  }
  #icones_tous_commerces img {
    margin: 1rem auto 0 auto;
  }
}
@media all and (min-width: 751px) and (max-width: 830px) {
  #texte_accueil_lander h1 {
    font-size: 2.2rem;
  }
}


.bt_grand_orange {
  width: 60%;
  font-weight: 400;
  font-size: 1.6rem;
  padding: 1.4rem 0;
}
@media (max-width: 480px) {
  .bt_grand_orange {
    width: 80%;
  }
}


.section_accueil {
  padding: 2rem 0;
}
.section_accueil .colx12 {
  padding: 2.4rem 0;
}
.section_accueil .colx12 h3 {
  text-align: center;
  font-size: 3rem;
  margin-left: 3rem;
}
@media (max-width: 480px) {
  .section_accueil .colx12 {
    text-align: center;
  }
}
.section_accueil .ligne p {
  font-size: 2rem;
  padding-bottom: 2rem;
}


.ligne_bleue {
  background-color: var(--color-secondary);
  padding: 2rem 0;
  color: var(--color-white);
}
.ligne_bleue img {
  margin: 1rem 11%;
}
.ligne_bleue p {
  font-size: 1.8rem;
}

/*.fonctionnalites_accueil, */.materiel_accueil {
  background: var(--color-white);
}


.videos_accueil, .materiel_accueil {
  padding-bottom: 4rem;
}



/*  Texte */
.texte_accueil {
  padding: 3.6rem 0;
  background: var(--color-white-ii);
}
.texte_accueil h2 {
  margin: 1rem 0 2rem 0;
  font-size: 2rem;
}
.texte_accueil .colxs4 {
  padding: 0 1rem 2rem 2rem;
}
.texte_accueil .colxs4:first-child {
  border: none;
}
@media (max-width: 480px) {
  .texte_accueil .colxs4 {
    border-top: 1px solid var(--color-gray-i);
    padding-top: 2rem;
  }
  .texte_accueil .colxs4:first-child {
    padding-top: 0;
  }
}


/*  Sync ventes  */
#accueil_txt_sync_ventes {
  padding: 4rem 1rem 0 4rem;
}
@media (max-width: 799px) {
  #accueil_txt_sync_ventes {
    text-align: center;
    padding-bottom: 6rem;
    padding-left: 1rem;
  }
}


/*  Videos  */
.lien_video img {
  display: inline-block;
  width: 90%;
  max-width: 770px;
}
.lien_video strong {
  width: 100%;
  padding-left: 22%;
  margin-top: 1.5rem;
  display: inline-block;
  font-weight: normal;
  color: var(--color-secondary);
  text-align: left;
}


@media (max-width: 480px) {
/*  .videos_accueil .colx3, .videos_accueil .colx6 {
    margin-bottom: 2rem;
  }
  .videos_accueil .colx3 img, .videos_accueil .colx6 img {
    width: 60%;
  }*/
  .lien_video {
    margin-top: 0;
  }
}

.img_p_vente_accueil {
  max-width: 600px;
}

/*  Avis  */
.avis p {
  margin: 2rem 0 1rem;
}
#slider ol {
  margin-top: 1rem;
  text-align: center;
}
#slider ol li {
  display: inline-block;
  width: 4rem;
  height: 2rem;
  border: solid 1px #bbb;
  border-radius: 0.2rem;
  margin: 0.3rem;
  cursor: pointer;
}
#slider ol li.active {
  background-color: var(--color-gray-i);
}



/*  Fonctionnalites */
.fonctionnalites {
  border: solid 1px #353535;
  margin: 0 1rem;
  padding: 1.5rem;
}
.fonctionnalites > img {
  width: 100%;
}
.fonctionnalites > h4 {
  margin: 1rem 0;
}
@media (max-width: 800px) {
  .fonctionnalites {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
  }
}



/*  Contact */
.contact_accueil {
  padding: 3rem 0;
  background: var(--color-white-ii);
}
.telephones_accueil {
  background: url("../images/contact1.png") no-repeat center center;
}
.telephones_accueil > div {
  margin-top: 4rem;
  display: inline-block;
}
.telephones_accueil div div {
  margin-bottom: 1.6rem;
}
.telephones_accueil div a {
  color: var(--color-secondary);
  vertical-align: middle;
}
.telephones_accueil div img {
  vertical-align: middle;
}
.contact_accueil .colxm4 {
  min-height: 154px;
  font-size: 1.6rem;
}
@media (max-width: 600px) {
  .contact_accueil .colxm4 {
    padding: 2rem 0;
    border-bottom: 1px solid var(--color-gray-i);
    font-size: 2rem;
  }
  .contact_accueil .colxm4:last-child {
    border: none;
  }
  .telephones_accueil {
    padding-bottom: 6rem !important;
  }
  .telephones_accueil > div {
    margin-top: 4rem;
    display: inline-block;
  }
  .contact_accueil .separateur2 {
    display: none;
  }
}
.contact2_accueil {
  background: url("../images/contact2.png") no-repeat center center;
}

.contact2_accueil a, .contact3_accueil a {
  display: block;
  width: 100%;
  min-height: 154px;
}
.contact2_accueil a:hover span, .contact3_accueil a:hover span {
  color: var(--color-primary);
}
.contact2_accueil span, .contact3_accueil span {
  display: inline-block;
  width: 100%;
  position: absolute;
  left: 0; top: 50%;
  margin-top: -0.8rem;
  color: var(--color-secondary);
  -webkit-transition: color 0.2s;
  -moz-transition: color 0.2s;
  transition: color 0.2s;
}
.contact3_accueil {
  background: url("../images/contact3.png") no-repeat center center;
}


/*  Materiel  */
.materiel_accueil .colx12.desktop img, .materiel_accueil .colx12.phone img {
  width: 100%;
}
.materiel_accueil .colx12.desktop img {
  max-width: 980px;
}
.materiel_accueil .colx12.phone img {
  max-width: 550px;
}

/*  Tarifs  */
.tarifs_accueil {
  padding: 4rem 0 6rem 0;
  background-image: url('../images/fond-bleu.jpg');
  background-repeat: no-repeat;
  background-size: cover;
}
.tarifs_accueil > div {
  color: var(--color-white);
}
.tarifs_accueil > div > h3 {
  font-size: 3rem;
  margin: 2rem 0;
}
.tarifs_accueil > div > strong {
  font-size: 6rem;
  font-weight: normal;
}



/*Page fonctionnalites
------------------------------------------------------------------------------*/
#tableau_fonctionnalites2 {
  width: 100%;
  color: var(--color-gray-ii);
}

#tableau_fonctionnalites2 thead th img {
  display: inline-block;
  max-width: 150px;
}

#tableau_fonctionnalites2 .img_tab_func {
  margin-bottom: -2.8rem;
}
#tableau_fonctionnalites2 thead tr:first-child th {
  padding: 0;
}

#tableau_fonctionnalites2 thead tr:nth-child(2) th:nth-child(3) {
  width: 24%;
  height: 30px;
  border: solid 4px var(--color-primary);
  border-bottom: none;
  background-color: var(--color-secondary);
}


#tableau_fonctionnalites2 thead tr:nth-child(3) th {
  text-transform: uppercase;
  font-size: 18px;
}
#tableau_fonctionnalites2 thead tr:nth-child(3) th:first-child {
  height: 40px;
}
#tableau_fonctionnalites2 thead tr:nth-child(3) th:nth-child(2) {
  width: 18%;
  border-top: solid 4px #e5e5e5;
  border-left: solid 4px #e5e5e5;
  border-right: solid 4px var(--color-primary);
}
#tableau_fonctionnalites2 thead tr:nth-child(3) th:nth-child(3) {
  border-left: solid 4px var(--color-primary);
  border-right: solid 4px var(--color-primary);
  background-color: var(--color-secondary);
  font-size: 20px;
  color: var(--color-white);
}
#tableau_fonctionnalites2 thead tr:nth-child(3) th:nth-child(4) {
  width: 18%;
  border-top: solid 4px #e5e5e5;
  border-right: solid 4px #e5e5e5;
}

#tableau_fonctionnalites2 thead tr:nth-child(4) th:first-child {
  width: 40%;
  padding: 20px;
  background-color: var(--color-gray-iiii);
}
#tableau_fonctionnalites2 thead tr:nth-child(4) th:nth-child(2) {
  border-left: solid 4px var(--color-primary);
  border-right: solid 4px var(--color-primary);
  background-color: var(--color-secondary);
  vertical-align: top;
/*   text-transform: uppercase; */
  font-size: 20px;
  color: var(--color-white);
}
#tableau_fonctionnalites2 .prix_option_tab {
  font-size: 30px;
  font-weight: normal;
}
#tableau_fonctionnalites2 .mois_option_tab {
  text-transform: none;
}


#tableau_fonctionnalites2 tbody tr td {
  text-align: center;
}
#tableau_fonctionnalites2 tbody tr td:first-child {
  text-align: left;
}

#tableau_fonctionnalites2 tbody tr td img {
  width: 16%;
  min-width: 20px;
}
#tableau_fonctionnalites2 tbody tr td {
  padding: 10px;
  border-top: solid 1px #e5e5e5;
}
#tableau_fonctionnalites2 tbody tr td:first {

}
#tableau_fonctionnalites2 tbody tr td:first-child {
  background-color: var(--color-gray-iiii);
}
#tableau_fonctionnalites2 tbody tr td:nth-child(2) {
  border-left: solid 4px #e5e5e5;
}
#tableau_fonctionnalites2 tbody tr td:nth-child(3) {
  border-top-color: #6c89c6;
  background-color: var(--color-secondary);
  border-left: solid 4px var(--color-primary);
  border-right: solid 4px var(--color-primary);
  color: var(--color-white);
}
#tableau_fonctionnalites2 tbody tr td:nth-child(4) {
  border-right: solid 4px #e5e5e5;
}

#tableau_fonctionnalites2 tfoot tr:first-child td:nth-child(2) {
  height: 20px;
  border-top: solid 1px #e5e5e5;
  border-left: solid 4px #e5e5e5;
  border-right: solid 4px var(--color-primary);
}
#tableau_fonctionnalites2 tfoot tr:first-child td:nth-child(3) {
  border-top: solid 1px #6c89c6;
  border-right: solid 4px var(--color-primary);
  border-left: solid 4px var(--color-primary);
  background-color: var(--color-secondary);
}
#tableau_fonctionnalites2 tfoot tr:first-child td:nth-child(4) {
  border-top: solid 1px #e5e5e5;
  border-right: solid 4px #e5e5e5;
/*   border-bottom: solid 4px #e5e5e5; */
  border-left: solid 4px var(--color-primary);
}
#tableau_fonctionnalites2 tfoot tr:nth-child(2) td:nth-child(2) {
  border-top: solid 4px #e5e5e5;
  border-right: solid 4px var(--color-primary);
}
#tableau_fonctionnalites2 tfoot tr:nth-child(2) td:nth-child(4) {
  border-top: solid 4px #e5e5e5;
}
#tableau_fonctionnalites2 tfoot tr:nth-child(2) td:nth-child(3) {
  height: 30px;
  border: solid 4px var(--color-primary);
  border-top: none;
  background-color: var(--color-secondary);
}

#tableau_fonctionnalites2 .row_title_cat {
  background-color: var(--color-gray-iiii);
  font-weight: bold;
}
#tableau_fonctionnalites2 .row_title_cat td:nth-child(3) {
  background-color: #4d6089;
}



/*Page options
------------------------------------------------------------------------------*/
.option {
  padding: 5%;
  position: relative;
  margin: 4rem 0;
  box-shadow: 0 2px 10px var(--color-gray-i);
}
.option img {
  width: 50%;
  max-width: 220px;
  float: left;
  margin: 1rem 2rem 2rem;
}
.option h2 {
  margin: 1rem 0 2rem 0;
}
.option p {
  margin-top: 1rem;
}

@media all and (min-width: 800px) {
  .prix_option {
    color: var(--color-primary);
    width: 153px;
    height: 100px;
    position: absolute;
    top: 0px;
    right: -18px;
    background: transparent url("../images/prix_option.png") no-repeat;
  }
  .prix {
    position: absolute;
    top: 32px;
    left: 56px;
    font-size: 28px;
    color: var(--color-primary);
  }
  .text_prix {
    position: absolute;
    top: 68px;
    right: 8px;
    font-size: 11px;
    color: var(--color-primary);
  }
}
@media all and (max-width: 799px) {
  .prix_option {
    padding: 0.3rem 2rem;
    color: var(--color-white);
    background: var(--color-primary);
    text-align: right;
    font-size: 1.6rem;
  }
}

@media (max-width: 480px) {
  .option img {
    display: block;
    float: none;
    margin: 2rem auto;
  }
}


/*Page creation compte
------------------------------------------------------------------------------*/
/*.contenu form ligne {

}*/
.text_err, .err_form_contact {
  margin-left: 0.6rem;
  font-size: 1.4rem;
  color: var(--color-red);
}
.style_text_err {
  border-color: var(--color-red) !important;
}
.suggestion {
  color: var(--color-primary);
  cursor: pointer;
}
#form_creation_compte fieldset > .ligne > div:last-child > span, #contactform .text_err {
  display: block;
}


.form_section {

}
.form_section_header {
  border-bottom: solid 2px var(--color-gray-i);
}
.form_subsection_header {
  border-bottom: solid 2px var(--color-white-ii);
}
.form_section_body {}


/*Affichage_emails
------------------------------------------------------------------------------*/
.affichage_email {
  margin-left: 0px;
  padding: 0 0 0.2rem 0.8rem;
  border-left: solid 2px;
}

.affichage_email h4 {
  padding: 0;
  margin: 0;
}
.affichage_email .affichage_email_hiboutik_h4, .affichage_email .affichage_email_client_h4 {
  color: var(--color-primary);
  margin: 0 0 1rem 0;
}
.affichage_email_hiboutik_p, .affichage_email_client_p {
  color: #1a1a1a;
/*   font-size: 1.2rem; */
  margin: 1rem 0 4rem 1rem;
}
.affichage_email_hiboutik {
  border-color: var(--color-primary);
}
.affichage_email .affichage_email_client_h4 {
  color: #2a7fff;
}
.affichage_email_client_p {
  color: #808080;
}
.affichage_email_client {
  border-color: #2a7fff;
}


/*Page Avis clients
------------------------------------------------------------------------------*/
.avis_clients .ligne img {
  width: 40%;
  max-width: 100px;
  margin: 0 1%;
  vertical-align: top;
}
.avis_clients .avis_text {
  display: inline-block;
  width: 58%;
  font-size: 1.4rem;
}


/*Page Caise Enregistreuse
------------------------------------------------------------------------------*/
#logiciel_caisse_text, .logiciel_caisse_text {
  width: 60%;
  height: auto;
}
#logiciel_caisse_text ul, .logiciel_caisse_text ul {
  list-style-type: disc;
  padding: 1rem 0 1rem 4rem;
}
#image_pg_logiciel {
  width: 35%;
  max-width: 300px;
  position: absolute;
  top: 132px;
  right: 0;
  box-shadow: 0 0 7px var(--color-gray-ii);
}
@media (max-width: 480px) {
  #image_pg_logiciel {
    display: none;
  }
  #image_pg_logiciel_2 {
    width: 100%;
  }
  #logiciel_caisse_text, .logiciel_caisse_text {
    width: 100%;
  }
}
#image_pg_logiciel_2 {
  width: 60%;
  max-width: 500px;
  box-shadow: 0 0 7px var(--color-gray-ii);

}
#logiciel_caisse_text p, #logiciel_caisse_text ul, .logiciel_caisse_text p {
  color: var(--color-gray-ii);
}


/*Page Logiciel caisse
------------------------------------------------------------------------------*/
.lc_landing.entete_img {
  height: 500px;
  flex: 1 0 auto;
}
.lc_landing h1, .lc_landing p {
  display: inline;
  color: var(--color-white);
  line-height: 1.4;
  position: relative;
  top: 4rem;
  font-weight: bold;
  background-color: var(--color-gray-i);
}
.lc_landing p {
  padding: 0.2rem;
  font-weight: normal;
  margin-top: 1rem;
}
.lc_section_text {
  padding: 10rem 12rem;
}
.lc_section_text h2 {
  display: inline-block;
  vertical-align: middle;
/*   margin-left: 2rem; */
}
.lc_section_text .livicon-evo {
  width: 90px;
  height: 90px;
  display: inline-block;
  vertical-align: middle;
}
.lc_section_text p {
  color: var(--color-gray-ii);
}
@media (max-width: 480px) {
  .lc_section_text {
    padding: 4rem 3rem;
  }
}
@media all and (min-width: 481px) and (max-width: 600px) {
  .lc_section_text {
    padding: 4rem 6rem;
  }
}
@media all and (min-width: 601px) and (max-width: 1000px) {
  .lc_section_text {
    padding: 6rem 8rem;
  }
}


.container_grid {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
}
.grid_unit {
  flex-grow: 1;
}
.grid_unit-40 {
  width: 40%;
}
.grid_unit-50 {
  width: 50%;
}
.grid_unit-60 {
  width: 60%;
}
.flex_align_center {
  align-items: center
}
.grid_unit_header {
  display: flex;
  flex-direction: row;
  align-items: center
}
@media all and (max-width: 768px) {
  .grid_unit_header > h2 {
    font-size: 2.2rem;
  }
}
@media all and (max-width: 600px) {
  .grid_unit-40, .grid_unit-50, .grid_unit-60 {
    width: 100%;
  }
  .grid_unit_header > h2 {
    font-size: 3rem;
  }
}
@media (max-width: 480px) {
  .grid_unit_header > h2 {
    font-size: 2.8rem;
  }
}




/*  Page restaurant  */
#video_restauration {
  margin: 20px 0;
  display: block;
  text-align: center;
}
.text_page_commerce {
  color: var(--color-gray-ii);
}
.text_page_commerce ul {
  list-style-type: disc;
  padding: 1rem 0 1rem 4rem;
}


/* Page Presse
------------------------------------------------------------------------------*/
.page_presse {
  width: 100%;
  padding: 0px 0 20px 0;
  margin: 40px 0;
  border-bottom: solid 1px var(--color-gray-i);
  text-align: center;
}
.page_presse a {
  display: inline-block;
  margin: 12px 0 0 12px;
  padding: 0px;
  box-shadow: 2px 2px 5px var(--color-gray-i);
  -webkit-transition: box-shadow 0.8;
  -moz-transition: box-shadow 0.8;
  transition: box-shadow 0.8s;
}
.page_presse a:hover {
  box-shadow: 0px 0px 10px var(--color-primary);
}
.page_presse img {
  margin: 4px;
}
.page_presse h2 {
  text-align: center;
  font-size: 16px;
  background: var(--color-gray-i);
  padding: 2px 0;
  font-weight: bold;
}
#plaquette {
  margin: 40px 0 20px 0;
}
#plaquette img {
  margin: 0 0 -4px 0;
}


/*Page FAQ
------------------------------------------------------------------------------*/
#t_faq {
  padding-left: 40px;
  list-style-type: decimal;
  color: var(--color-primary);
}
.question_faq {
  padding-top: 50px;
  margin-top: -50px;
}
#t_faq a {
  -moz-transition: margin-left 0.3s, color 0.5s;
  -webkit-transition: margin-left 0.3s, color 0.5s;
  transition: margin-left 0.3s, color 0.5s;
}
#t_faq a:hover {
  margin-left: 5px;
  color: var(--color-primary);
}
#t_faq a:active {
  color: #f80 !important;
}
#t_faq a:visited {
  color: #d60;
}
.t_faq_inpage {
  color: var(--color-primary);
  margin-top: 10px;
  padding: 50px 0 20px 0;
}
.t_faq_inpage_h4 {
  margin: 10px 0;
  color:#777;
}
.t_faq_inpage_h4 + p {
  padding-left: 20px;
}


/*Page Contact
------------------------------------------------------------------------------*/
.tel_page_contact {
  padding: 1rem 0;
}
.tel_page_contact > div {
  text-align: left;
}
.tel_page_contact > div img {
  vertical-align: middle;
}
.tel_page_contact > div a {
  vertical-align: middle;
  color: var(--color-secondary);
}
@media (max-width: 599px) {
  .tel_page_contact > div {
    padding: 0.5rem 0;
  }
}
@media (max-width: 480px) {
  .tel_page_contact > div {
    text-align: left;
  }
}


/* Page parrainage
------------------------------------------------------------------------------*/
.parrainage_social_links img {
  display: block;
}
.parrainage_social_links span {
  display: inline-block;
  color: var(--color-secondary);
}


/* Le bas
------------------------------------------------------------------------------*/
.pied_page {
  width: 100%;
  padding-top: 1rem;
  position: relative;
  background-color: var(--color-gray-ii);
  color: var(--color-white);
}


.entete_bas {
  height: 4rem;
}
@media (max-width: 480px) {
  .entete_bas {
    height: 9rem;
  }
  #zagareli_gauche {
    position: relative;
    z-index: 2;
    margin-top: 5rem;
    text-align: center;
  }
  #zagareli_droite {
    text-align: center;
  }
}
@media all and (min-width: 481px) and (max-width: 799px) {
  #zagareli_gauche {
    padding-right: 6.4rem;
    text-align: right;
    font-size: 1.2rem;
  }
  #zagareli_droite {
    padding-left: 6.4rem;
    text-align: left;
    font-size: 1.2rem;
  }
}
@media (min-width: 800px) {
  #zagareli_gauche {
    padding-right: 6.4rem;
    text-align: right;
  }
  #zagareli_droite {
    padding-left: 6.4rem;
    text-align: left;
  }
}

#hibou_bas {
  width: 11.4rem;
  height: 11.4rem;
  position: absolute;
  top: -5rem;
  left: 50%;
  margin-left: -5.7rem;
  background: var(--color-gray-ii);
  text-align: center;
  padding-top: 10px;
  border-radius: 114px;
}
#hibou_bas img {
  width: 100%;
  max-width: 60px;
  margin-top: 16px;
}


.liens_pied_page h2 {
  display: inline-block;
  padding: 0.2rem 4rem 0.4rem 0.1rem;
  margin: 0.5rem 0;
  font-size: 1.5rem;
  text-transform: uppercase;
  border-bottom: solid 1px var(--color-white);
}


.liens_pied_page ul a {
  display: block;
  padding: 0.14rem 0;
  position: relative;
  font-size: 1.6rem;
  line-height: 1;
  color: var(--color-white);
  text-decoration: none;
}
#sitemap_liste a {
  position: relative;
}
#sitemap_liste > li {
  padding: 0.4rem 0;
}
.liens_pied_page ul a:before, #sitemap_liste a:before {
  content: "[";
  position: absolute;
  left: 0px;
  -webkit-transition: left 0.3s, opacity 0.3s;
  -moz-transition: left 0.3s, opacity 0.3s;
  transition: left 0.3s, opacity 0.3s;
  opacity: 0;
}
.liens_pied_page ul a:after, #sitemap_liste a:after {
  content: "]";
  margin-left: -5px;
  -wekit-transition: margin-left 0.3s, opacity 0.3s;
  -moz-transition: margin-left 0.3s, opacity 0.3s;
  transition: margin-left 0.3s, opacity 0.3s;
  opacity: 0;
}
.liens_pied_page ul a:hover::before, #sitemap_liste a:hover::before {
  left: -8px;
  opacity: 1;
}
.liens_pied_page ul a:hover::after, #sitemap_liste a:hover::after {
  margin-left: 3px;
  opacity: 1;
}
.liens_pied_page ul a:visited {
  color: var(--color-gray-i);
}
@media all and (min-width: 481px) and (max-width: 800px) {
  .liens_pied_page ul {
    padding: 0 0.5rem;
  }
}
@media all and (max-width: 799px) {
  .liens_pied_page {
    margin-top: 4rem;
  }
  .liens_pied_page:first-child {
    margin-top: 1rem;
  }
  .liens_pied_page ul li {
    padding: 0.5rem 0;
  }
}

.social_icons a {
  display: inline-block;
  width: 4rem;
  color: var(--color-white);
  margin: 0 1rem;
}




.bottom_bar {
  width: 100%;
  padding: 2rem 0;
/*   position: absolute; */
  bottom: 0;
  font-size: 1.2rem;
}
.bottom_bar a {
  display: inline-block;
}
.bottom_bar #sitemap {
  float: right;
}


.input_group {
  display: block;
  position: relative;
}



#page_legislation .contenu img {
  margin: 4rem auto;
  max-width: 800px;
}
#page_legislation .contenu h2 {
  margin: 5rem 0 1rem 0;
}
#page_legislation .contenu p {
  color: var(--color-gray-ii);
  margin-top: 1rem;
}
#page_legislation .contenu ul {
  padding-left: 4rem;
  margin-top: 1rem;
  color: var(--color-gray-ii);
  list-style-type: square;/* fallback */
  list-style-type: '- ';
}

.entete_img, .img_banner {
  height: 300px;
  background-size: cover;
  background-position: 50% 50%;
}

.img_banner {
  height: auto;
  position: relative;
}
.text_sur_img {
  color: var(--color-white);
  font-size: 3.2rem;
  font-family: 'Didact Gothic';
  padding: 180px 50% 182px 60px;
}
@media all and (max-width: 980px) {
  .text_sur_img {
    padding: 100px 50% 100px 60px;
  }
}
@media all and (max-width: 600px) {
  .text_sur_img {
    padding: 80px 50% 80px 30px;
  }
}


/* LOGIN */
#form_login {
  max-width: 40rem;
  border: 1px solid var(--color-gray-i);
  font-size: 1.8rem;
}
.container_input {
  display: table;
  width: 100%;
  border: 1px solid var(--color-gray-i);
}
.container_input > div {
  display: table-row;
}
.container_input > div > div {
  display: table-cell;
}
.container_input > div > div:first-child input {
  display: inline-block;
  width: 100%;
  border: none;
  box-shadow: none !important;
  font-size: inherit;
  color: var(--color-primary);
}

.shadow_1 {
  box-shadow: 0 0 4rem 1rem rgba(0, 0, 0, 0.1);
}
#rond_pg_paiement {
  width: 30rem;
  position: absolute;
  left: 0;
  top: 9rem;
}

/* section tarification*/
.h-pay_tarification {
  padding: 20rem 30rem !important;
}
@media all and (max-width: 1780px) {
  .h-pay_tarification {
    padding: 20rem 20rem !important;
  }
}
@media all and (max-width: 1580px) {
  .h-pay_tarification {
    padding: 20rem 15rem !important;
  }
}
@media all and (max-width: 1480px) {
  .h-pay_tarification {
    padding: 20rem 10rem !important;
  }
}
@media all and (max-width: 1340px) {
  .h-pay_tarification {
    padding: 20rem 5rem !important;
  }
  .img_responsive_1 {
    width: 60%;
  }
}
@media all and (max-width: 1280px) {
  .img_responsive_1 {
    width: 60%;
  }
}
@media all and (max-width: 799px) {
  .img_responsive_1 {
    display: none;
  }
  #rond_pg_paiement {
    top: 12rem;
    width: 20rem;
  }
}


.verifier_disponibilite, .btn_form_field {
  padding: 0.3rem 0.6rem;
  margin: 0 0 0 0.5rem;
  background: none;
  color: var(--color-gray-iii);
}
.btn_form_field {
  border: solid 1px var(--color-gray-iii);
  border-radius: 50%;
}
.btn_form_field:hover {
  background: var(--color-white);
  color: #ff2b2f;
  border-color: #ff2b2f;
}

.container_fixed {
  width: 100%;
  position: fixed;
  z-index: 999;
}
.pos_bottom {
  bottom: 0;
}

.cookie_alert {
  padding: 1rem 2rem;
  bottom: 0;
  background-color: rgba(255, 255, 255, 0.9);
  color: var(--color-secondary);
  border: 1px solid var(--color-secondary);
  border-radius: 1.5rem 1.5rem 0 0;
  box-shadow: 0 0 2rem -1rem black;
}

.animate_fade {
  animation: fade-out 0.5s ease-out forwards;
  overflow: hidden;
}
@keyframes fade-out {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
    height: 0;
  }
}


.form_navigation_section span {
  display: inline-block;
  padding: 2rem 3rem;
  border-radius: 4rem;
  border: solid 1px  var(--color-gray-i);
  font-size: 3rem;
  color: var(--color-gray-i);
  line-height: 1;
/*   cursor: pointer; */
}
.form_navigation_section_active span {
  color: var(--color-secondary);
  border-color: var(--color-secondary);
  box-shadow: 0 0 1rem -0.5rem var(--color-black);
  font-weight: bold;
/*   cursor: default; */
}
.form_navigation_hide {
  animation: hide_section 0.5s ease-out forwards;
}
@keyframes hide_section {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
.form_navigation_show {
  animation: show_section 0.5s ease-out forwards;
}
@keyframes show_section {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}


.animation_compte_cree {
  animation: compte-cree 1s ease-out forwards;
}
@keyframes compte-cree {
  from {
    opacity: 0;
    margin-top: 20px;
  }
  to {
    opacity: 1;
    margin-top: 0;
  }
}