html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

:focus {
    outline: -webkit-focus-ring-color auto 0px !important;
}

@font-face {
  font-family: "Nunito Light";
  src: url("../fonts/Nunito-Light.ttf") format("truetype");
}

@font-face {
  font-family: "Nunito";
  src: url("../fonts/Nunito-Regular.ttf") format("truetype");
}

@font-face {
  font-family: "Nunito Medium";
  src: url("../fonts/Nunito-Medium.ttf") format("truetype");
}

@font-face {
  font-family: "Nunito SemiBold";
  src: url("../fonts/Nunito-SemiBold.ttf") format("truetype");
}

@font-face {
  font-family: "Nunito Bold";
  src: url("../fonts/Nunito-Bold.ttf") format("truetype");
}

@font-face {
  font-family: "Nunito ExtraBold";
  src: url("../fonts/Nunito-ExtraBold.ttf") format("truetype");
}

@font-face {
  font-family: "Nunito Black";
  src: url("../fonts/Nunito-Black.ttf") format("truetype");
}

body {
  line-height: 1.4;
  font-family: "Nunito Light";
  font-size: .9rem;
  color: #435C74;
  margin: 0;
  padding: 0;
  background-color: #f5f7fa;
}

ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
div:after,
header:after,
footer:after,
nav:after,
ul:after {
    display: block;
    content: "";
    visibility: hidden;
    height: 0px;
    clear: both;
}
div, nav, header {
  box-sizing: border-box;
  /*overflow: auto;*/
}
main {
  position: relative;
  height: auto;
  width: auto;
  max-width: 1600px;
  padding: 30px 25px;
  margin: 0 auto;
}

p {
  font-family: "Nunito";
  margin: 0px;
  font-size: .9rem;
  color: #435C74;
}

p.white {
  color: #FFFFFF;
}

p.black {
  color: #000;
}

.p-20 {
  font-size: 20px;
}

.p-30 {
  font-size: 30px;
}

a {
  text-decoration: none;
  color: inherit;
  transition: all .3s;
  outline-style: none;
  outline: none;
}

a:focus,
a:active {
  outline: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

.link-bleu {
  font-family: 'Nunito Medium';
  color: #1C5191;
}

strong, .strong {
  font-family: "Nunito Bold";
}

.text-center {
  text-align: center !important;
}

.text-right {
  text-align: right !important;
}

.text-left {
  text-align: left !important;
}

.text-blanc {
  color: #fff !important;
}

.col {
  position: relative;
  float: left;
  min-height: 1px;
}

.col-2 {
  position: relative;
  float: left;
  width: 50%;
  min-height: 1px;
}

.col-3 {
  position: relative;
  float: left;
  width: 33.33%;
  min-height: 1px;
}

.col-4 {
  position: relative;
  float: left;
  width: 25%;
}

.col-2-3 {
  position: relative;
  float: left;
  width: 66.66%;
  height: auto;
}

.col-1-3 {
  position: relative;
  float: left;
  width: 33.33%;
  height: auto;
}

.col-1-4 {
  position: relative;
  float: left;
  width: 25%;
  height: auto;
}

.col-3-4 {
  position: relative;
  float: left;
  width: 75%;
  height: auto;
}

.col-left {
  padding-right: 10px;
}

.col-right {
  padding-left: 10px;
}

.col-center {
  padding-left: 10px;
  padding-right: 10px;
}

.pv-0 {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}

.pv-5 {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.pv-10 {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.pv-20 {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}

.pv-50 {
  padding-top: 50px !important;
  padding-bottom: 50px !important;
}

.pv-5 {
  padding-top: 5px;
  padding-bottom: 5px;
}

.pv-10 {
  padding-top: 10px !important;
  padding-bottom: 10px !important;
}

.pv-15 {
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}

.pv-20 {
  padding-top: 20px;
  padding-bottom: 20px;
}

.pv-30 {
  padding-top: 30px !important;
  padding-bottom: 30px !important;
}

.pv-40 {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.pv-50 {
  padding-top: 50px !important;
  padding-bottom: 50px !important;
}

.pv-70 {
  padding-top: 70px !important;
  padding-bottom: 70px !important;
}

.pv-75 {
  padding-top: 75px !important;
  padding-bottom: 75px !important;
}

.pv-100 {
  padding-top: 100px !important;
  padding-bottom: 100px !important;
}

.ph-10 {
  padding-left: 10px !important;
  padding-right: 10px !important;
}

.ph-15 {
  padding-left: 15px !important;
  padding-right: 15px !important;
}

.ph-20 {
  padding-left: 20px !important;
  padding-right: 20px !important;
}

.ph-75 {
  padding-left: 75px !important;
  padding-right: 75px !important;
}

.pt-200 {
  padding-top: 200px !important;
}

.pt-100 {
  padding-top: 100px !important;
}

.pt-75 {
  padding-top: 75px !important;
}

.pt-50 {
  padding-top: 50px !important;
}

.pt-30 {
  padding-top: 30px !important;
}

.pb-0 {
  padding-bottom: 0px !important;
}

.mb-0 {
  margin-bottom: 0px !important;
}

.mb-5 {
  margin-bottom: 5px !important;
}

.mb-10 {
  margin-bottom: 10px !important;
}

.mb-20 {
  margin-bottom: 20px !important;
}

.mb-25 {
  margin-bottom: 25px !important;
}

.mb-30 {
  margin-bottom: 30px !important;
}

.mb-40 {
  margin-bottom: 40px !important;
}

.mb-50 {
  margin-bottom: 50px !important;
}

.mb-60 {
  margin-bottom: 60px !important;
}

.mb-75 {
  margin-bottom: 75px !important;
}

.mb-100 {
  margin-bottom: 100px !important;
}

.mb-0 {
  margin: 0px !!important;
}

.mt-5 {
  margin-top: 5px;
}

.mt-10 {
  margin-top: 10px !important;
}

.mt-20 {
  margin-top: 20px !important;
}

.mt-30 {
  margin-top: 30px !important;
}

.mt-40 {
  margin-top: 40px !important;
}

.mt-50 {
  margin-top: 50px !important;
}

.mt-60 {
  margin-top: 60px !important;
}

.mt-100 {
  margin-top: 100px !important;
}

.bg-gris {
  background: #efefef;
}

.bg-blanc {
  background: #fff;
}

.v-align {
  position: absolute;
  top: 50%;
  left: 0px;
  width: 100%;
  height: auto;
  transform: translateY(-50%);
}

.row {
  position: relative;
  height: auto;
  width: auto;
  padding: 0px;
  margin: 0px;
}

.row-top-demandeurs {
  position: relative;
  height: auto;
  width: auto;
  padding: 0px;
  margin: 0px;
  border-bottom: #ccc solid 1px;
  padding: 3px 0px;
}

.row-top-demandeurs:last-of-type {
  border-bottom: none;
}

.row-title-form {
  position: relative;
  height: auto;
  width: auto;
  padding: 0px;
  font-family: 'Nunito SemiBold';
  font-size: 16px;
  color: #435C74;
  margin-bottom: 5px;
}

.row-field-form {
  position: relative;
  height: auto;
  width: auto;
  padding: 0px;
  margin-bottom:10px;
}

.row-submit-form {
  position: relative;
  height: auto;
  width: auto;
  padding: 0px;
  margin: 20px 0px 10px 0px;
}

.msg {
  position: absolute;
  height: auto;
  width: 100%;
  top: 0;
  left: 0;
  text-align: center;
  padding: 10px;
  font-family: 'Nunito SemiBold';
  font-size: .9rem;
  z-index: 9;
  transition: all .3s;
}

.msg.error {
  background-color: #CC0000;
  color: #FFFFFF;
}

.msg.ok {
  background-color: #28b463;
  color: #FFFFFF;
}

input[type="text"],
input[type="password"],
input[type="date"],
input[type="time"],
input[type="email"],
input[type="list"],
input[type="number"],
input[list] {
  position: relative;
  height: auto;
  width: 100%;
  border: #dbdbdb solid .5px;
  padding: 8px 12px;
  font-family: 'Nunito';
  font-size: .9rem;
  border-radius: 5px;
  box-sizing: border-box;
}

input[type="submit"] {
  position: relative;
  display: inline-block;
  height: auto;
  width: auto;
  border: none;
  padding: 8px 12px;
  font-family: 'Nunito';
  font-size: .9rem;
  color: #fff;
  border-radius: 5px;
  box-sizing: border-box;
  background-color: #154360;
  transition: all .3s;
  cursor: pointer;
}

input[type="submit"]:hover {
  background-color: #3498db;
}

input[type="button"] {
  position: relative;
  display: inline-block;
  height: auto;
  width: auto;
  border: none;
  padding: 8px 12px;
  font-family: 'Nunito';
  font-size: .9rem;
  color: #fff;
  border-radius: 5px;
  box-sizing: border-box;
  background-color: #154360;
  transition: all .3s;
  cursor: pointer;
}

input[type="button"]:hover {
  background-color: #3498db;
}

input[type="button"].delete {
  background-color: #d24a2d;
}

input[type="button"].delete:hover {
  background-color: #e95333;
}

input[type="button"].jaune {
  background-color: #FFC300;
  color: #435C74;
}

input[type="button"].jaune:hover {
  background-color: rgba(255, 195, 0, .6);
  color: #435C74;
}

input[type="button"].gris {
  background-color: #d7dbdd;
  color: #435C74;
}

input[type="button"].gris:hover {
  background-color: rgba(255, 195, 0, .6);
  color: #435C74;
}

input[type="button"].vert {
  background-color: rgba(46, 204, 113, 1);
}

input[type="button"].vert:hover {
  background-color: rgba(46, 204, 113, .6);
}

input[type="button"].rouge {
  background-color: rgba(255, 65, 24, 1);
}

input[type="button"].rouge:hover {
  background-color: rgba(255, 65, 24, .6);
}

textarea {
  position: relative;
  height: auto;
  width: 100%;
  box-sizing: border-box;
  padding: 15px;
  border-radius: 5px;

  font-family: 'Nunito';
  font-size: .9rem;
  border: #dbdbdb solid .5px;
}

select {
  position: relative;
  font-family: 'Nunito';
  font-size: .9rem;
  width: 100%;
  padding: 7px 10px;
  border: #dbdbdb solid .5px;
  box-sizing: border-box;
  border-radius: 5px;
}

.strong {
  font-family: 'Nunito Bold';
}

.link-reset {
  position: relative;
  font-family: 'Nunito';
  color: #3498db;
  font-size: .9rem;
  cursor: pointer;
  text-decoration: underline;
}

i {
  margin-right: 5px;
}

.small-text {
  font-size: .8rem;
}

.no-hover:hover {
  background: inherit;
}


/* --------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------- */
/* --------------------------------------------------------------------------------------- */

.log-out {
  position: absolute;
  bottom: 15px;
  left: 0;
  height: auto;
  width: 100%;
  text-align: center;
  font-family: 'Nunito SemiBold';
  color: #FFF;
  transition: all .3s;
}

.log-out:hover {
  color: #FFC300;
  cursor: pointer;
}

.box-connect {
  position: absolute;
  top: 50%;
  left: 50%;
  height: auto;
  width: 800px;
  transform: translate(-50%, -50%);
  background-color: #FFF;
  border-radius: 10px;
  padding: 100px 20px;
  box-shadow: 0px 0px 5px #ccc;
}

.logo-connect {
  position: relative;
  height: auto;
  width: auto;
  text-align: center;
  margin-bottom: 20px;
}

.logo-connect img {
  width: 125px;
}

.form-connect {
  position: relative;
  height: auto;
  width: 450px;
  margin: 20px auto 0;
}

.sidebar {
  position: fixed;
  left: 0;
  top: 0;
  height: 100%;
  width: 250px;
  background-color: #154360;
  z-index: 9;
}

.logo-sidebar {
  position: relative;
  height: auto;
  width: auto;
  text-align: center;
  padding: 20px 0;
  margin-bottom: 30px;
}

.logo-sidebar img {
  height: 75px;
  max-width: 80%;
}

.btn-hide-sidebar {
  position: absolute;
  bottom: 20px;
  left: 0;
  width: 100%;
  height: auto;

  font-family: 'Nunito SemiBold';
  color: #FFFFFF;
  text-align: center;
  cursor: pointer;
  transform: all .3s;
}

.btn-hide-sidebar:hover {
  color: #FFC300;
}

.btn-show-sidebar {
  display: none;
  position: absolute;
  bottom: 20px;
  left: 0;
  width: 100%;
  height: auto;

  font-family: 'Nunito SemiBold';
  color: #FFFFFF;
  text-align: center;
  cursor: pointer;
  transform: all .3s;
}

.btn-show-sidebar:hover {
  color: #FFC300;
}

ul.menu {
  position: relative;
  height: auto;
  width: auto;
  list-style: none;
}

.picto-li {
  margin-right: 5px;
}

.sub-li {
  float: right;
  font-size: .8rem;
  margin-top: 6px;
}

ul.menu li {
  position: relative;
  height: auto;
  width: auto;
  padding: 5px 20px;

  font-family: 'Nunito SemiBold';
  color: #FFFFFF;
  transition: all .3s;
  cursor: pointer;
}

ul.menu li:hover,
ul.menu li.active {
  color: #FFC300;
}

ul.menu li.sub {
  display: none;
  position: relative;
  height: auto;
  width: auto;
  padding: 5px 20px 5px 43px;

  font-family: 'Nunito';
  color: #FFFFFF;
  transition: all .3s;
  cursor: pointer;
}

ul.menu li.sub:hover,
ul.menu li.sub.active {
  color: #FFC300;
}

.container {
  position: relative;
  height: auto;
  width: auto;
  margin-left: 250px;
  padding: 90px 30px 30px 30px;
}

.fil-ariane {
  position: fixed;
  top: 0;
  left: 0;
  height: auto;
  width: 100%;
  font-family: 'Nunito';
  font-size: 14px;
  color: #626976;
  text-align: left;
  padding: 20px 30px;
  background-color: #fff;
  margin-left: 250px;
  z-index: 8;
  box-shadow: 0px 0px 5px #ccc;
}

.content {
  position: relative;
  height: auto;
  width: auto;
  padding: 20px;
  background-color: #fff;
  border-radius: 3px;
  border: #ccd1d1 solid 1px;
}

.content-ticket {
  padding: 0;
}

.h1-classic {
  position: relative;
  height: auto;
  width: auto;

  font-family: 'Nunito SemiBold';
  font-size: 20px;
  text-align: left;
}

.h2-classic {
  position: relative;
  height: auto;
  width: auto;

  font-family: 'Nunito SemiBold';
  font-size: 16px;
  text-align: left;
}

.h2-ticket {
  position: relative;
  height: auto;
  width: auto;
  padding: 10px 20px;
  border-bottom: #ccd1d1 solid 1px;;

  font-family: 'Nunito SemiBold';
  font-size: 16px;
  text-align: left;
}

.btn-services {
  position: relative;
  display: inline-block;
  height: auto;
  width: auto;
  background-color: #ededed;
  border-radius: 10px;
  padding: 20px;
  margin: 10px;

  font-family: 'Nunito';
  font-size: 1.2rem;

  transition: all .3s;
  cursor: pointer;
}

.btn-services i {
  margin-right: 10px;
}

.btn-services:hover {
  color: #FFC300;
  background-color: #435C74;
}

input[type="radio"].chx-service {
  display: none;
}

input[type="radio"].chx-service + label {
  position: relative;
  display: inline-block;
  height: auto;
  width: auto;
  max-width: 350px;
  background-color: #ededed;
  border-radius: 10px;
  padding: 6px 12px;
  margin-bottom: 10px;
  margin-right: 10px;

  font-family: 'Nunito';
  font-size: 1rem;

  transition: all .3s;
  cursor: pointer;
}

input[type="radio"].chx-service:checked + label {
  color: #FFC300;
  background-color: #435C74;
}

input[type="radio"].chx-service + label i {
  margin-right: 10px;
}

input[type="radio"].chx-service + label:hover {
  color: #FFC300;
  background-color: #435C74;
}

h1 {
  position: relative;
  height: auto;
  width: auto;
  font-family: 'Nunito SemiBold';
  font-size: 1.2rem;
  margin-bottom: 20px;
}

h2 {
  position: relative;
  height: auto;
  width: auto;
  font-family: 'Nunito SemiBold';
  font-size: 1.1em;
  margin-bottom: 20px;
}

.list {
  position: relative;
  height: auto;
  width: auto;
}

.line-list {
  position: relative;
  height: auto;
  width: auto;
  transition: all .3s;
  cursor: pointer;
  border-bottom: rgba(21, 67, 96, .3) solid 1px;
}

.line-list:hover {
  background-color: #efefef;
}

.no-hover:hover {
  background-color: transparent !important;
  cursor: default;
}

.line-entete {
  background-color: #154360;
  color: #ffffff !important;
  font-family: 'Nunito SemiBold';
}

.line-entete:hover {
  background-color: #154360;
}

.line-submit,
.row-submit {
  position: relative;
  padding: 10px 0px;
}

.line-submit:hover {
  background-color: #fff;
}

.line-border {
  border-bottom: rgba(21, 67, 96, 0.5) solid 1px;
}

.col-list {
  position: relative;
  float: left;
  height: auto;
  padding: 10px 10px;
}

.pastille {
  position: relative;
  display: inline-block;
  height: 13px;
  width: 13px;
  border-radius: 50%;
  margin: -2px 2px;
}

.coordo-demandeur {
  position: relative;
  height: auto;
  width: auto;
  border-top-right-radius: 3px;
  border-top-left-radius: 3px;
  background: #fbfbfb;
  padding: 10px;
}

.bulle-start {
  position: relative;
  float: left;
  height: auto;
  width: 70%;
  padding: 30px;
  background-color: #d4efdf;
  margin-left: 10px;
}

.bulle-start::after {
  content: '';
  position: absolute;
  top: 0;
  left: -10px;
  width: 20px;
  height: 20px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 20px solid #d4efdf;
  visibility: visible;
}

.bulle-start p {
  margin-bottom: 10px;
  word-break: break-word;
}

.bulle-solution {
  position: relative;
  float: right;
  height: auto;
  width: 70%;
  padding: 30px;
  background-color: #d4efdf;
  margin-right: 10px;
}

.bulle-solution img {
  max-width: 100%;
}


.bulle-solution::after {
  content: '';
  position: absolute;
  top: 0;
  right: -10px;
  width: 20px;
  height: 20px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 20px solid #d4efdf;
  visibility: visible;
}

.bulle-solution p {
  margin-bottom: 10px;
  word-break: break-word;
}

.bulle-left {
  position: relative;
  float: left;
  height: auto;
  width: 70%;
  padding: 30px;
  background-color: #eaecee;
  margin-left: 10px;
}

.bulle-left::after {
  content: '';
  position: absolute;
  top: 0;
  left: -10px;
  width: 20px;
  height: 20px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 20px solid #eaecee;
  visibility: visible;
}

.bulle-left p {
  margin-bottom: 10px;
  word-break: break-word;
}

.bulle-right {
  position: relative;
  float: right;
  height: auto;
  width: 70%;
  padding: 30px;
  background-color: #eaecee;
  margin-right: 10px;
}

.bulle-right img {
  max-width: 100%;
}

.bulle-right::after {
  content: '';
  position: absolute;
  top: 0;
  right: -10px;
  width: 20px;
  height: 20px;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-top: 20px solid #eaecee;
  visibility: visible;
}

.bulle-right p {
  margin-bottom: 10px;
  word-break: break-word;
}

.form-reponse {
  display: none;
  position: relative;
  height: auto;
  width: auto;
  margin: 10px;
  padding: 60px 20px 40px 20px;
  background-color: #efefef;
}

.form-solution {
  display: none;
  position: relative;
  height: auto;
  width: auto;
  margin: 10px;
  padding: 60px 20px 40px 20px;
  background-color: #d4efdf;
}

.btn-close-form {
  position: absolute;
  top: 20px;
  right: 20px;
  height: 20px;
  width: 20px;
  z-index: 5;
  cursor: pointer;
}

.row-file-form {
  position: relative;
  height: auto;
  width: auto;
  border: #ccc solid 1px;
  padding: 20px;
  text-align: center;
}

input[type="file"] {
  position: relative;
  display: inline-block;
}

.link-file-ticket {
  position: relative;
  float: left;
  height: auto;
  width: auto;
  padding: 6px;
  text-align: left;
  font-family: 'Nunito';
  font-size: .9rem;
  color: #FFF;
  background-color: #154360;
}


input[type="checkbox"].demo5 {
  display: none;
}

input[type="checkbox"].demo5 + label {
  box-sizing: border-box;
  display: inline-block;
  width: 2rem;
  height: 1rem;
  border-radius: 1.5rem;
  padding:2px;
  background-color: #c0ceda ;
  transition: all 0.5s ;
}

input[type="checkbox"].demo5 + label::before {
  box-sizing: border-box;
  display: block;
  content: "";
  height: calc(1rem - 4px);
  width: calc(1rem - 4px);
  border-radius: 50%;
  background-color: #fff;
  transition: all 0.5s ;
}

input[type="checkbox"].demo5:checked + label {
  background-color: #00B7E8 ;
}

input[type="checkbox"].demo5:checked + label::before {
  margin-left: 1rem ;
}

.dash-cat {
  position: relative;
  display: inline-block;
  height: 115px;
  width: 175px;
  vertical-align: top;
  margin: 5px;
  background: #ccc;
  color: #efefef;
}

.dash-cat-picto {
  position: absolute;
  top: 10px;
  right: 10px;
  height: 30px;
  width: 30px;
  text-align: center;
  z-index: 5;
}

.dash-cat-count {
  position: absolute;
  top: 10px;
  left: 10px;
  height: auto;
  width: 50%;
  font-family: 'Nunito Bold';
  font-size: 1.5rem;
  text-align: left;
}

.dash-cat-title {
  position: absolute;
  top: 50%;
  left: 0px;
  width: 100%;
  text-align: left;
  padding: 0px 10px;
  font-family: 'Nunito SemiBold';
}

.white-box {
  position: relative;
  height: auto;
  width: auto;
  background-color: #fff;
  border-radius: 3px;
  border: #ccc solid 1px;
  padding: 20px;
}

.top-demandeurs-box {
  position: relative;
  height: auto;
  width: auto;
  background-color: #fff;
  border-radius: 3px;
  border: #ccc solid 1px;
  padding: 20px;
}

/* ----------------------------------------- */
/* SYSTEME DE NOTATION SERVICE COMMUNICATION */
/* ----------------------------------------- */
.rating {
  direction: rtl; /* permet de survoler de gauche à droite */
  unicode-bidi: bidi-override;
  font-size: 2.5rem;
  display: inline-flex;
}

.rating input {
  display: none;
}

.rating label {
  color: #ccc;
  cursor: pointer;
  transition: color 0.2s;
}

.rating label:hover,
.rating label.active,
.rating label:hover ~ label {
  color: gold;
}

.rating input:checked ~ label {
  color: gold;
}

.rating label.no-hover {
  color: #ccc !important;
}

.rating.close label {
  cursor: default !important;
}

/* style for zoom licences */
.zoom-box {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  padding: 0px;
}

.days-zoom {
  flex: 1;
  border: #CCCCCC solid 1px;
  min-height: 600px;
  margin-right: 10px;
}

.days-zoom:last-of-type {
  margin-right: 0px;
}

.date-zoom {
  background-color: #154360;
  color: #FFFFFF;
  text-align: center;
  padding: 15px 0px;
}

.licence-zoom {
  position: relative;
  height: auto;
  width: auto;
  padding: 10px;
  background: #C4E1F2;
  margin: 10px;
}

.nom-licence-zoom {
  font-family: 'Nunito Bold';
}

.show-qrcode {
  position: relative;
  display: inline-block;
  height: auto;
  width: auto;
  text-align: center;
  /*border: #000000 solid 1px;*/
  padding: 5px 20px;
}

.etiquette {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 110px;
  width: 400px;
  transform: translate(-50%, -50%);
  background-color: #ffffff;
  text-align: center;
  /*border: #000000 solid 1px;*/
  overflow: hidden;
}

.etiquette-qrcode {
  position: relative;
  float: left;
  height: auto;
  width: 110px;
  text-align: center;
}

.etiquette-qrcode img {
  height: 110px;
}

.etiquette-infos {
  position: relative;
  float: left;
  height: 110px;
  width: 115px;
  text-align: center;
  font-family: 'Nunito Bold';
  line-height: 1;
  color: #000000;
  padding: 47px 10px;
  font-size: 1em;
}

.etiquette-logo {
  position: relative;
  float: right;
  height: 110px;
}

.etiquette-logo img {
  height: 75px;
  margin: 18px 15px;
}

.row-flex {
  display: flex;
}

.col-flex {
  flex: 1;
  width: 50%;
  padding: 20px;
  justify-content: center;
  align-items: center;
}

.encart-prets {
  position: relative;
  margin: 0 auto;
  width: 250px;
  padding: 20px;
}

.btn-grad {
  position: relative;
  display: inline-block;
  height: auto;
  width: 250px;
  margin: 0 auto;
  padding: 20px;

  font-family: 'Nunito SemiBold';
  color: #ffffff;
  text-transform: uppercase;

  transition: 0.5s;
  background-size: 200% auto;
  box-shadow: 0 0 20px #eee;
  outline: none;
  border: none;
  cursor: pointer;

  background-image: linear-gradient(to right, #314755 0%, #26a0da 51%, #314755 100%);
}

.btn-export {
  position: relative;
  display: inline-block;
  height: auto;
  width: auto;
  padding: 5px 10px;
  border-radius: 5px;
  background: #FFC300;
  cursor: pointer;
  transition: all .3s;
}

.btn-export:hover {
  background: rgba(255, 195, 0, .6);
}

/*.btn-grad:hover {
  background-position: right center;
  color: #fff;
  text-decoration: none;
}*/


/* ---------------------------- */
/* ELEMENTS MASQUES SUR DESKTOP */
/* ---------------------------- */
.header-mobile { display: none; }
.nav-mobile { display: none; }
.hide-on-desktop { display: none; }



/* ------------------------ */
/* POPUP MISE A JOUR PROFIL */
/* ------------------------ */
.box-popup-maj {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  height: auto;
  width: 60%;
  max-width: 850px;
  padding: 50px 20px;
  background: #ffffff;
  box-shadow: 0px 0px 3px #cccccc;
  border-radius: 5px;
  border: #cccccc solid 1px;
  z-index: 9;

  background-image: url('../img/bg-popup-2.png');
  background-position: center;
  background-size: cover;
}

.box-popu-maj-content {
  position: relative;
  height: auto;
  width: auto;
  max-width: 600px;
  margin: 0px auto;
}



@media (max-width: 800px) {

  /* ---------------------------- */
  /* ELEMENTS MASQUES SUR DESKTOP */
  /* ---------------------------- */
  .sidebar { display: none; }
  .hide-on-mobile { display: none; }
  .hide-on-desktop { display: block; }

  .content {
    padding: 20px 5px;
  }

  .box-connect {
    position: absolute;
    top: 50%;
    left: 50%;
    height: auto;
    width: 360px;
    transform: translate(-50%, -50%);
    background-color: #FFF;
    border-radius: 10px;
    padding: 100px 20px;
    box-shadow: 0px 0px 5px #ccc;
  }

  .form-connect {
    position: relative;
    height: auto;
    width: 100%;
    margin: 20px auto 0;
  }

  .header-mobile {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    background-color: #154360;
    padding: 10px 0;
    text-align: center;
    z-index: 8;
  }

  .btn-menu {
    position: absolute;
    top: 50%;
    left: 10px;
    height: auto;
    width: auto;
    transform: translateY(-50%);
  }

  .btn-menu img {
    width: 24px;
  }

  .nav-mobile {
    display: none;
    position: fixed;
    height: 100%;
    width: 100%;
    background-color: #154360;
    z-index: 9;
  }

  .btn-nav-mobile {
    position: absolute;
    top: 25px;
    left: 10px;
    height: 15px;
    width: 25px;
    z-index: 2;
  }

  .container {
    position: relative;
    height: auto;
    width: auto;
    margin-left: 0;
    padding: 70px 0px 30px 0px;
  }

  .fil-ariane {
    position: relative;
    height: auto;
    width: 100%;
    font-family: 'Nunito';
    font-size: 14px;
    color: #626976;
    text-align: left;
    padding: 20px 30px;
    background-color: #fff;
    margin-left: 0;
    z-index: 5;
    box-shadow: none;
  }

  .bulle-left,
  .bulle-right,
  .bulle-solution,
  .bulle-start {
    width: 96%;
  }

  .col-2 {
    float: none;
    width: auto !important;
  }

  .col-left, .col-right, .col-center {
    padding-left: 0px;
    padding-right: 0px;
  }

  .text-left-mobile {
    text-align: left !important;
  }

  .text-center-mobile {
    text-align: center !important;
  }

  .col-2-mobile {
    float: left !important;
    width: 50% !important;
  }

  .bt-fullwidth-on-mobile {
    width: 100% !important;
    margin: 5px 0px;
  }

}