/*$gris-blue          : $blue-biella;
$gris               : $blue-biella-75;
$rouge              : $blue-biella-75;
$blue-page-contenu  : $blue-biella;*/
/*
  This mixin can be used to set the object-fit:
  @include object-fit(contain);

  or object-fit and object-position:
  @include object-fit(cover, top);
*/
@font-face {
  font-family: "Bromello Regular";
  src: url("/build/css/font/bromello-Regular.ttf") format("truetype"), url("/build/css/font/bromello-Regular.otf") format("opentype");
}
@font-face {
  font-family: "Kapitales Regular";
  src: url("/build/css/font/Kapitales_EU_1-3b.ttf");
}
@font-face {
  font-family: "Pad Thai Regular";
  src: url("/build/css/font/padThai.ttf") format("truetype");
}
@font-face {
  font-family: "Paris Regular";
  src: url("/build/css/font/Paris.ttf") format("truetype");
}
@font-face {
  font-family: "New York , New York 2 Regular";
  src: url("/build/css/font/NewYork,NewYork2.ttf") format("truetype");
}
@font-face {
  font-family: "Summer Icons Regular";
  src: url("/build/css/font/Summer Icons.ttf") format("truetype");
}
@font-face {
  font-family: "Graffiti Tags";
  src: url("/build/css/font/Graffiti Tags.ttf") format("truetype");
}
@font-face {
  font-family: "Permanent Marker Regular";
  src: url("/build/css/font/PermanentMarker.ttf") format("truetype");
}
@font-face {
  font-family: "Trajan Pro 3 Bold";
  src: url("/build/css/font/Trajan Pro Bold.ttf") format("truetype");
}
@font-face {
  font-family: "Trajan Pro 3 Regular";
  src: url("/build/css/font/Trajan Pro Regular.ttf") format("truetype");
}
@font-face {
  font-family: "Galaxy Far Far Away Regular";
  src: url("/build/css/font/GalaxyFarFarAway-72oP.ttf") format("truetype");
}
@font-face {
  font-family: "FA Brands";
  src: url("/build/css/font/fa-brands-400.ttf") format("truetype");
}
@font-face {
  font-family: "FA Regular";
  src: url("/build/css/font/fa-regular-400.ttf") format("truetype");
}
@font-face {
  font-family: "FA Solid";
  src: url("/build/css/font/fa-solid-900.ttf") format("truetype");
}
body #tarteaucitronRoot button {
  min-height: initial;
  min-width: initial;
}
body #tarteaucitronRoot #tarteaucitronAlertBig {
  box-sizing: border-box;
  background-color: #43535a;
  padding: 30px 20px;
}
body #tarteaucitronRoot #tarteaucitronDisclaimerAlert {
  margin-right: auto;
}
@media (max-width: 767px) {
  body #tarteaucitronRoot #tarteaucitronDisclaimerAlert {
    margin-bottom: 1.5rem;
  }
}
@media (min-width: 768px) {
  body #tarteaucitronRoot.tarteaucitronBeforeVisible #tarteaucitronAlertBig {
    display: flex !important;
    align-items: center;
  }
  body #tarteaucitronRoot #tarteaucitronDisclaimerAlert {
    max-width: 70vw;
  }
}
body #tarteaucitronRoot .tarteaucitronDeny, body #tarteaucitronRoot #tarteaucitronCloseAlert {
  background-color: #fff;
  color: #43535a;
}
body #tarteaucitronRoot .tarteaucitronDeny .tarteaucitronCross::before {
  color: #43535a;
}
body #tarteaucitronRoot .tarteaucitronAsk .tarteaucitronCross::before {
  color: #fff;
}
body #tarteaucitronRoot #tarteaucitron #tarteaucitronServices #tarteaucitronAllAllowed,
body #tarteaucitronRoot #tarteaucitron #tarteaucitronServices #tarteaucitronAllDenied {
  background-color: grey;
  opacity: 1;
}
body #tarteaucitronRoot #tarteaucitronServices #tarteaucitronServices_mandatory .tarteaucitronLine button.tarteaucitronAllow,
body #tarteaucitronRoot #tarteaucitronServices .tarteaucitronIsAllowed .tarteaucitronAsk .tarteaucitronAllow,
body #tarteaucitronRoot #tarteaucitronServices .tarteaucitronIsDenied .tarteaucitronAsk .tarteaucitronDeny {
  background-color: #43535a;
}
body #tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronMainLine, body #tarteaucitronRoot #tarteaucitron #tarteaucitronServices [id=tarteaucitronInfo], body #tarteaucitronRoot #tarteaucitron #tarteaucitronServices .tarteaucitronTitle button {
  background-color: #43535a;
}

.tac_activate button {
  min-width: auto;
  min-height: auto;
}

.sass-loader1, .sass-loader2, .sass-test {
  margin: 100px;
  font-size: 2.5rem;
  width: 1.3em;
  height: 1.3em;
  border-radius: 50%;
  position: relative;
  color: transparent;
  animation: sassload1 3s infinite ease;
  transform: translateZ(0);
}

@keyframes sassload1 {
  0% {
    box-shadow: 0em 2.6em 0 0 #99335A, 1.8384776311em 1.8384776311em 0 0 #F64888, 2.6em 0em 0 0 #00a8cc, 1.8384776311em -1.8384776311em 0 0 #0090b3, 0em -2.6em 0 0 #005b79, -1.8384776311em -1.8384776311em 0 0 #e7e9ed, -2.6em 0em 0 0 #acb3c2, -1.8384776311em 1.8384776311em 0 0 #454d5d, 0em 2.6em 0 0 #99335A;
  }
  12.5% {
    box-shadow: 0em 2.6em 0 0 #F64888, 1.8384776311em 1.8384776311em 0 0 #00a8cc, 2.6em 0em 0 0 #0090b3, 1.8384776311em -1.8384776311em 0 0 #005b79, 0em -2.6em 0 0 #e7e9ed, -1.8384776311em -1.8384776311em 0 0 #acb3c2, -2.6em 0em 0 0 #454d5d, -1.8384776311em 1.8384776311em 0 0 #99335A, 0em 2.6em 0 0 #F64888;
  }
  25% {
    box-shadow: 0em 2.6em 0 0 #00a8cc, 1.8384776311em 1.8384776311em 0 0 #0090b3, 2.6em 0em 0 0 #005b79, 1.8384776311em -1.8384776311em 0 0 #e7e9ed, 0em -2.6em 0 0 #acb3c2, -1.8384776311em -1.8384776311em 0 0 #454d5d, -2.6em 0em 0 0 #99335A, -1.8384776311em 1.8384776311em 0 0 #F64888, 0em 2.6em 0 0 #00a8cc;
  }
  37.5% {
    box-shadow: 0em 2.6em 0 0 #0090b3, 1.8384776311em 1.8384776311em 0 0 #005b79, 2.6em 0em 0 0 #e7e9ed, 1.8384776311em -1.8384776311em 0 0 #acb3c2, 0em -2.6em 0 0 #454d5d, -1.8384776311em -1.8384776311em 0 0 #99335A, -2.6em 0em 0 0 #F64888, -1.8384776311em 1.8384776311em 0 0 #00a8cc, 0em 2.6em 0 0 #0090b3;
  }
  50% {
    box-shadow: 0em 2.6em 0 0 #005b79, 1.8384776311em 1.8384776311em 0 0 #e7e9ed, 2.6em 0em 0 0 #acb3c2, 1.8384776311em -1.8384776311em 0 0 #454d5d, 0em -2.6em 0 0 #99335A, -1.8384776311em -1.8384776311em 0 0 #F64888, -2.6em 0em 0 0 #00a8cc, -1.8384776311em 1.8384776311em 0 0 #0090b3, 0em 2.6em 0 0 #005b79;
  }
  62.5% {
    box-shadow: 0em 2.6em 0 0 #e7e9ed, 1.8384776311em 1.8384776311em 0 0 #acb3c2, 2.6em 0em 0 0 #454d5d, 1.8384776311em -1.8384776311em 0 0 #99335A, 0em -2.6em 0 0 #F64888, -1.8384776311em -1.8384776311em 0 0 #00a8cc, -2.6em 0em 0 0 #0090b3, -1.8384776311em 1.8384776311em 0 0 #005b79, 0em 2.6em 0 0 #e7e9ed;
  }
  75% {
    box-shadow: 0em 2.6em 0 0 #acb3c2, 1.8384776311em 1.8384776311em 0 0 #454d5d, 2.6em 0em 0 0 #99335A, 1.8384776311em -1.8384776311em 0 0 #F64888, 0em -2.6em 0 0 #00a8cc, -1.8384776311em -1.8384776311em 0 0 #0090b3, -2.6em 0em 0 0 #005b79, -1.8384776311em 1.8384776311em 0 0 #e7e9ed, 0em 2.6em 0 0 #acb3c2;
  }
  87.5% {
    box-shadow: 0em 2.6em 0 0 #454d5d, 1.8384776311em 1.8384776311em 0 0 #99335A, 2.6em 0em 0 0 #F64888, 1.8384776311em -1.8384776311em 0 0 #00a8cc, 0em -2.6em 0 0 #0090b3, -1.8384776311em -1.8384776311em 0 0 #005b79, -2.6em 0em 0 0 #e7e9ed, -1.8384776311em 1.8384776311em 0 0 #acb3c2, 0em 2.6em 0 0 #454d5d;
  }
  100% {
    box-shadow: 0em 2.6em 0 0 #99335A, 1.8384776311em 1.8384776311em 0 0 #F64888, 2.6em 0em 0 0 #00a8cc, 1.8384776311em -1.8384776311em 0 0 #0090b3, 0em -2.6em 0 0 #005b79, -1.8384776311em -1.8384776311em 0 0 #e7e9ed, -2.6em 0em 0 0 #acb3c2, -1.8384776311em 1.8384776311em 0 0 #454d5d, 0em 2.6em 0 0 #99335A;
  }
}
.sass-test {
  animation: sasstest 4s infinite ease;
}

@keyframes sasstest {
  0% {
    box-shadow: 0em 2.6em 0 0 #99335A, 1.528241656em 2.1034441854em 0 0 #F64888, 2.4727469424em 0.8034441854em 0 0 #00a8cc, 2.4727469424em -0.8034441854em 0 0 #0090b3, 1.528241656em -2.1034441854em 0 0 #005b79, 0em -2.6em 0 0 #99335A, -1.528241656em -2.1034441854em 0 0 #F64888, -2.4727469424em -0.8034441854em 0 0 #00a8cc, -2.4727469424em 0.8034441854em 0 0 #0090b3, -1.528241656em 2.1034441854em 0 0 #005b79, 0em 2.6em 0 0 #99335A;
  }
  10% {
    box-shadow: 0em 2.6em 0 0 #F64888, 1.528241656em 2.1034441854em 0 0 #00a8cc, 2.4727469424em 0.8034441854em 0 0 #0090b3, 2.4727469424em -0.8034441854em 0 0 #005b79, 1.528241656em -2.1034441854em 0 0 #99335A, 0em -2.6em 0 0 #F64888, -1.528241656em -2.1034441854em 0 0 #00a8cc, -2.4727469424em -0.8034441854em 0 0 #0090b3, -2.4727469424em 0.8034441854em 0 0 #005b79, -1.528241656em 2.1034441854em 0 0 #99335A, 0em 2.6em 0 0 #F64888;
  }
  20% {
    box-shadow: 0em 2.6em 0 0 #00a8cc, 1.528241656em 2.1034441854em 0 0 #0090b3, 2.4727469424em 0.8034441854em 0 0 #005b79, 2.4727469424em -0.8034441854em 0 0 #99335A, 1.528241656em -2.1034441854em 0 0 #F64888, 0em -2.6em 0 0 #00a8cc, -1.528241656em -2.1034441854em 0 0 #0090b3, -2.4727469424em -0.8034441854em 0 0 #005b79, -2.4727469424em 0.8034441854em 0 0 #99335A, -1.528241656em 2.1034441854em 0 0 #F64888, 0em 2.6em 0 0 #00a8cc;
  }
  30% {
    box-shadow: 0em 2.6em 0 0 #0090b3, 1.528241656em 2.1034441854em 0 0 #005b79, 2.4727469424em 0.8034441854em 0 0 #99335A, 2.4727469424em -0.8034441854em 0 0 #F64888, 1.528241656em -2.1034441854em 0 0 #00a8cc, 0em -2.6em 0 0 #0090b3, -1.528241656em -2.1034441854em 0 0 #005b79, -2.4727469424em -0.8034441854em 0 0 #99335A, -2.4727469424em 0.8034441854em 0 0 #F64888, -1.528241656em 2.1034441854em 0 0 #00a8cc, 0em 2.6em 0 0 #0090b3;
  }
  40% {
    box-shadow: 0em 2.6em 0 0 #005b79, 1.528241656em 2.1034441854em 0 0 #99335A, 2.4727469424em 0.8034441854em 0 0 #F64888, 2.4727469424em -0.8034441854em 0 0 #00a8cc, 1.528241656em -2.1034441854em 0 0 #0090b3, 0em -2.6em 0 0 #005b79, -1.528241656em -2.1034441854em 0 0 #99335A, -2.4727469424em -0.8034441854em 0 0 #F64888, -2.4727469424em 0.8034441854em 0 0 #00a8cc, -1.528241656em 2.1034441854em 0 0 #0090b3, 0em 2.6em 0 0 #005b79;
  }
  50% {
    box-shadow: 0em 2.6em 0 0 #99335A, 1.528241656em 2.1034441854em 0 0 #F64888, 2.4727469424em 0.8034441854em 0 0 #00a8cc, 2.4727469424em -0.8034441854em 0 0 #0090b3, 1.528241656em -2.1034441854em 0 0 #005b79, 0em -2.6em 0 0 #99335A, -1.528241656em -2.1034441854em 0 0 #F64888, -2.4727469424em -0.8034441854em 0 0 #00a8cc, -2.4727469424em 0.8034441854em 0 0 #0090b3, -1.528241656em 2.1034441854em 0 0 #005b79, 0em 2.6em 0 0 #99335A;
  }
  60% {
    box-shadow: 0em 2.6em 0 0 #F64888, 1.528241656em 2.1034441854em 0 0 #00a8cc, 2.4727469424em 0.8034441854em 0 0 #0090b3, 2.4727469424em -0.8034441854em 0 0 #005b79, 1.528241656em -2.1034441854em 0 0 #99335A, 0em -2.6em 0 0 #F64888, -1.528241656em -2.1034441854em 0 0 #00a8cc, -2.4727469424em -0.8034441854em 0 0 #0090b3, -2.4727469424em 0.8034441854em 0 0 #005b79, -1.528241656em 2.1034441854em 0 0 #99335A, 0em 2.6em 0 0 #F64888;
  }
  70% {
    box-shadow: 0em 2.6em 0 0 #00a8cc, 1.528241656em 2.1034441854em 0 0 #0090b3, 2.4727469424em 0.8034441854em 0 0 #005b79, 2.4727469424em -0.8034441854em 0 0 #99335A, 1.528241656em -2.1034441854em 0 0 #F64888, 0em -2.6em 0 0 #00a8cc, -1.528241656em -2.1034441854em 0 0 #0090b3, -2.4727469424em -0.8034441854em 0 0 #005b79, -2.4727469424em 0.8034441854em 0 0 #99335A, -1.528241656em 2.1034441854em 0 0 #F64888, 0em 2.6em 0 0 #00a8cc;
  }
  80% {
    box-shadow: 0em 2.6em 0 0 #0090b3, 1.528241656em 2.1034441854em 0 0 #005b79, 2.4727469424em 0.8034441854em 0 0 #99335A, 2.4727469424em -0.8034441854em 0 0 #F64888, 1.528241656em -2.1034441854em 0 0 #00a8cc, 0em -2.6em 0 0 #0090b3, -1.528241656em -2.1034441854em 0 0 #005b79, -2.4727469424em -0.8034441854em 0 0 #99335A, -2.4727469424em 0.8034441854em 0 0 #F64888, -1.528241656em 2.1034441854em 0 0 #00a8cc, 0em 2.6em 0 0 #0090b3;
  }
  90% {
    box-shadow: 0em 2.6em 0 0 #005b79, 1.528241656em 2.1034441854em 0 0 #99335A, 2.4727469424em 0.8034441854em 0 0 #F64888, 2.4727469424em -0.8034441854em 0 0 #00a8cc, 1.528241656em -2.1034441854em 0 0 #0090b3, 0em -2.6em 0 0 #005b79, -1.528241656em -2.1034441854em 0 0 #99335A, -2.4727469424em -0.8034441854em 0 0 #F64888, -2.4727469424em 0.8034441854em 0 0 #00a8cc, -1.528241656em 2.1034441854em 0 0 #0090b3, 0em 2.6em 0 0 #005b79;
  }
  100% {
    box-shadow: 0em 2.6em 0 0 #99335A, 1.528241656em 2.1034441854em 0 0 #F64888, 2.4727469424em 0.8034441854em 0 0 #00a8cc, 2.4727469424em -0.8034441854em 0 0 #0090b3, 1.528241656em -2.1034441854em 0 0 #005b79, 0em -2.6em 0 0 #99335A, -1.528241656em -2.1034441854em 0 0 #F64888, -2.4727469424em -0.8034441854em 0 0 #00a8cc, -2.4727469424em 0.8034441854em 0 0 #0090b3, -1.528241656em 2.1034441854em 0 0 #005b79, 0em 2.6em 0 0 #99335A;
  }
}
.sass-loader2 {
  animation: sassload2 5s infinite linear;
}

@keyframes sassload2 {
  0% {
    box-shadow: 0em 2.6em 0 0.2em #99335A, -1.528241656em 2.1034441854em 0 -1em #F64888, -2.4727469424em 0.8034441854em 0 -1em #00a8cc, -2.4727469424em -0.8034441854em 0 -1em #0090b3, -1.528241656em -2.1034441854em 0 -1em #005b79, 0em -2.6em 0 -1em #99335A, 1.528241656em -2.1034441854em 0 -1em #F64888, 2.4727469424em -0.8034441854em 0 -1em #00a8cc, 2.4727469424em 0.8034441854em 0 -0.5em #0090b3, 1.528241656em 2.1034441854em 0 0 #005b79, 0em 2.6em 0 0.2em #99335A;
  }
  10% {
    box-shadow: 0em 2.6em 0 0 #99335A, -1.528241656em 2.1034441854em 0 0.2em #F64888, -2.4727469424em 0.8034441854em 0 -1em #00a8cc, -2.4727469424em -0.8034441854em 0 -1em #0090b3, -1.528241656em -2.1034441854em 0 -1em #005b79, 0em -2.6em 0 -1em #99335A, 1.528241656em -2.1034441854em 0 -1em #F64888, 2.4727469424em -0.8034441854em 0 -1em #00a8cc, 2.4727469424em 0.8034441854em 0 -1em #0090b3, 1.528241656em 2.1034441854em 0 -0.5em #005b79, 0em 2.6em 0 0 #99335A;
  }
  20% {
    box-shadow: 0em 2.6em 0 -0.5em #99335A, -1.528241656em 2.1034441854em 0 0 #F64888, -2.4727469424em 0.8034441854em 0 0.2em #00a8cc, -2.4727469424em -0.8034441854em 0 -1em #0090b3, -1.528241656em -2.1034441854em 0 -1em #005b79, 0em -2.6em 0 -1em #99335A, 1.528241656em -2.1034441854em 0 -1em #F64888, 2.4727469424em -0.8034441854em 0 -1em #00a8cc, 2.4727469424em 0.8034441854em 0 -1em #0090b3, 1.528241656em 2.1034441854em 0 -1em #005b79, 0em 2.6em 0 -0.5em #99335A;
  }
  30% {
    box-shadow: 0em 2.6em 0 -1em #99335A, -1.528241656em 2.1034441854em 0 -0.5em #F64888, -2.4727469424em 0.8034441854em 0 0 #00a8cc, -2.4727469424em -0.8034441854em 0 0.2em #0090b3, -1.528241656em -2.1034441854em 0 -1em #005b79, 0em -2.6em 0 -1em #99335A, 1.528241656em -2.1034441854em 0 -1em #F64888, 2.4727469424em -0.8034441854em 0 -1em #00a8cc, 2.4727469424em 0.8034441854em 0 -1em #0090b3, 1.528241656em 2.1034441854em 0 -1em #005b79, 0em 2.6em 0 -1em #99335A;
  }
  40% {
    box-shadow: 0em 2.6em 0 -1em #99335A, -1.528241656em 2.1034441854em 0 -1em #F64888, -2.4727469424em 0.8034441854em 0 -0.5em #00a8cc, -2.4727469424em -0.8034441854em 0 0 #0090b3, -1.528241656em -2.1034441854em 0 0.2em #005b79, 0em -2.6em 0 -1em #99335A, 1.528241656em -2.1034441854em 0 -1em #F64888, 2.4727469424em -0.8034441854em 0 -1em #00a8cc, 2.4727469424em 0.8034441854em 0 -1em #0090b3, 1.528241656em 2.1034441854em 0 -1em #005b79, 0em 2.6em 0 -1em #99335A;
  }
  50% {
    box-shadow: 0em 2.6em 0 -1em #99335A, -1.528241656em 2.1034441854em 0 -1em #F64888, -2.4727469424em 0.8034441854em 0 -1em #00a8cc, -2.4727469424em -0.8034441854em 0 -0.5em #0090b3, -1.528241656em -2.1034441854em 0 0 #005b79, 0em -2.6em 0 0.2em #99335A, 1.528241656em -2.1034441854em 0 -1em #F64888, 2.4727469424em -0.8034441854em 0 -1em #00a8cc, 2.4727469424em 0.8034441854em 0 -1em #0090b3, 1.528241656em 2.1034441854em 0 -1em #005b79, 0em 2.6em 0 -1em #99335A;
  }
  60% {
    box-shadow: 0em 2.6em 0 -1em #99335A, -1.528241656em 2.1034441854em 0 -1em #F64888, -2.4727469424em 0.8034441854em 0 -1em #00a8cc, -2.4727469424em -0.8034441854em 0 -1em #0090b3, -1.528241656em -2.1034441854em 0 -0.5em #005b79, 0em -2.6em 0 0 #99335A, 1.528241656em -2.1034441854em 0 0.2em #F64888, 2.4727469424em -0.8034441854em 0 -1em #00a8cc, 2.4727469424em 0.8034441854em 0 -1em #0090b3, 1.528241656em 2.1034441854em 0 -1em #005b79, 0em 2.6em 0 -1em #99335A;
  }
  70% {
    box-shadow: 0em 2.6em 0 -1em #99335A, -1.528241656em 2.1034441854em 0 -1em #F64888, -2.4727469424em 0.8034441854em 0 -1em #00a8cc, -2.4727469424em -0.8034441854em 0 -1em #0090b3, -1.528241656em -2.1034441854em 0 -1em #005b79, 0em -2.6em 0 -0.5em #99335A, 1.528241656em -2.1034441854em 0 0 #F64888, 2.4727469424em -0.8034441854em 0 0.2em #00a8cc, 2.4727469424em 0.8034441854em 0 -1em #0090b3, 1.528241656em 2.1034441854em 0 -1em #005b79, 0em 2.6em 0 -1em #99335A;
  }
  80% {
    box-shadow: 0em 2.6em 0 -1em #99335A, -1.528241656em 2.1034441854em 0 -1em #F64888, -2.4727469424em 0.8034441854em 0 -1em #00a8cc, -2.4727469424em -0.8034441854em 0 -1em #0090b3, -1.528241656em -2.1034441854em 0 -1em #005b79, 0em -2.6em 0 -1em #99335A, 1.528241656em -2.1034441854em 0 -0.5em #F64888, 2.4727469424em -0.8034441854em 0 0 #00a8cc, 2.4727469424em 0.8034441854em 0 0.2em #0090b3, 1.528241656em 2.1034441854em 0 -1em #005b79, 0em 2.6em 0 -1em #99335A;
  }
  90% {
    box-shadow: 0em 2.6em 0 -1em #99335A, -1.528241656em 2.1034441854em 0 -1em #F64888, -2.4727469424em 0.8034441854em 0 -1em #00a8cc, -2.4727469424em -0.8034441854em 0 -1em #0090b3, -1.528241656em -2.1034441854em 0 -1em #005b79, 0em -2.6em 0 -1em #99335A, 1.528241656em -2.1034441854em 0 -1em #F64888, 2.4727469424em -0.8034441854em 0 -0.5em #00a8cc, 2.4727469424em 0.8034441854em 0 0 #0090b3, 1.528241656em 2.1034441854em 0 0.2em #005b79, 0em 2.6em 0 -1em #99335A;
  }
  100% {
    box-shadow: 0em 2.6em 0 0.2em #99335A, -1.528241656em 2.1034441854em 0 -1em #F64888, -2.4727469424em 0.8034441854em 0 -1em #00a8cc, -2.4727469424em -0.8034441854em 0 -1em #0090b3, -1.528241656em -2.1034441854em 0 -1em #005b79, 0em -2.6em 0 -1em #99335A, 1.528241656em -2.1034441854em 0 -1em #F64888, 2.4727469424em -0.8034441854em 0 -1em #00a8cc, 2.4727469424em 0.8034441854em 0 -0.5em #0090b3, 1.528241656em 2.1034441854em 0 0 #005b79, 0em 2.6em 0 0.2em #99335A;
  }
}
/* ne pas modifier */
.sass-loader3, .sass-loader-3:before, .sass-loader-3:after {
  border-radius: 50%;
}

.sass-loader3 span {
  color: transparent;
}

.sass-loader3 {
  font-size: 1.1rem;
  margin: 55px;
  position: relative;
  width: 10em;
  height: 10em;
  box-shadow: inset 0 0 0 1.5em;
  transform: translateZ(0);
  animation: sassload3color 10s infinite ease -1s;
}

.sass-loader3:before,
.sass-loader3:after {
  position: absolute;
  content: "";
  width: 5.2em;
  height: 10.2em;
  background: black;
}

.sass-loader3:before {
  border-radius: 10.2em 0 0 10.2em;
  top: -0.1em;
  left: -0.1em;
  transform-origin: 5.1em 5.1em;
  animation: sassload3 2s infinite ease 1.5s;
}

.sass-loader3:after {
  border-radius: 0 10.2em 10.2em 0;
  top: -0.1em;
  left: 5em;
  transform-origin: 0.1em 5.1em;
  animation: sassload3 2s infinite ease;
}

@keyframes sassload3 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes sassload3color {
  0% {
    color: #99335A;
  }
  20% {
    color: #F64888;
  }
  40% {
    color: #00a8cc;
  }
  60% {
    color: #0090b3;
  }
  80% {
    color: #005b79;
  }
  100% {
    color: #99335A;
  }
}
/* $data-famille, $font-name*/
body {
  margin: 0;
  min-height: 100vh;
  background: #0090b3 url("/build/images/common/kreaman/fond.jpg") no-repeat center center;
}
body main > .container {
  position: relative;
}
body button, body .btn {
  min-width: auto;
  min-height: auto;
}

p {
  margin: 0;
}

.container {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}

/*-----------------------*/
/*-----------------------*/
/*-------HEADER----------*/
/*-----------------------*/
/*-----------------------*/
header {
  width: 100%;
  height: 180px;
  background: transparent url("/build/images/common/kreaman/courbeseule.png") no-repeat right bottom;
  color: #fff;
}
header #header-wrapper {
  display: flex;
  justify-content: space-between;
  height: 100%;
  margin: 5px auto;
}
@media screen and (max-width: 1024px) and (min-width: 768px) {
  header #header-wrapper {
    height: 65%;
  }
}
header div#bloc-logos {
  display: flex;
  align-items: baseline;
  align-self: flex-start;
}
header div#bloc-logos .logo-exacompta {
  align-self: flex-end;
}
header div#bloc-logos p {
  font-size: 16px;
  padding-left: 20px;
}
@media screen and (max-width: 1024px) {
  header div#bloc-logos {
    align-items: center;
  }
  header div#bloc-logos .logo-kreaman {
    display: flex;
    align-items: baseline;
  }
  header div#bloc-logos .logo-kreaman p {
    text-align: right;
    padding-left: 0;
    padding-right: 2rem;
    -webkit-transform: rotate(2deg);
    -moz-transform: rotate(2deg);
    -ms-transform: rotate(2deg);
    -o-transform: rotate(2deg);
    transform: rotate(2deg);
  }
}
@media screen and (max-width: 768px) {
  header div#bloc-logos {
    width: 100%;
    justify-content: space-between;
    align-items: flex-start;
  }
  header div#bloc-logos .logo-kreaman {
    display: flex;
    flex-direction: column;
  }
}

nav {
  align-self: flex-end;
  transform: rotate(2deg);
}
nav ul {
  display: flex;
  justify-content: space-between;
}
nav ul li {
  position: relative;
  list-style: none;
  height: 100px;
  width: 140px;
  background: transparent url("/build/images/common/kreaman/rond.png") no-repeat center center;
  cursor: pointer;
}
nav ul li p, nav ul li div {
  position: absolute;
  transform: translate(-50%, -50%);
}
nav ul li p {
  top: 50%;
  left: 50%;
  font-size: 24px;
  font-weight: 700;
}
nav ul li div {
  width: 100%;
  text-align: center;
  top: 0;
  left: 50%;
  font-size: 16px;
  font-weight: 700;
}

@media screen and (max-width: 1024px) {
  nav {
    display: none;
  }
}
/*-----------------------*/
/*-----------------------*/
/*-------FOOTER----------*/
/*-----------------------*/
/*-----------------------*/
.flag {
  background-image: url("/build/images/common/pictos/flags.png");
  background-repeat: no-repeat;
  display: block;
  color: transparent;
}
.flag:hover {
  color: transparent;
  transform: scale(1.25);
}

.flag-de {
  width: 16px;
  height: 12px;
  background-position: -5px -5px;
}

.flag-en {
  width: 16px;
  height: 12px;
  background-position: -5px -27px;
}

.flag-es {
  width: 16px;
  height: 12px;
  background-position: -5px -49px;
}

.flag-fr {
  width: 16px;
  height: 12px;
  background-position: -5px -71px;
}

.flag-it {
  width: 16px;
  height: 12px;
  background-position: -5px -93px;
}

.flag-nl {
  width: 16px;
  height: 12px;
  background-position: -5px -115px;
}

footer {
  margin: 8rem 0 2rem;
}
footer div ul {
  display: flex;
  justify-content: flex-end;
  padding-left: 0;
}
footer div ul li:not(:last-child) {
  padding-right: 1rem;
}
footer div ul li ~ li {
  padding-left: 1rem;
  border-left: 1px solid #fff;
}
footer div.form_language ul li {
  display: flex;
  justify-content: center;
}
footer div.form_language ul li a {
  display: inline-block;
}
@media screen and (max-width: 575px) {
  footer div.form_language ul li {
    flex-grow: 1;
  }
}
footer div.page-links ul li a, footer div.page-links ul li a:hover, footer div.page-links ul li a:focus {
  text-decoration: none;
  color: #fff;
}
footer div.page-links ul li a:hover, footer div.page-links ul li a:active, footer div.page-links ul li a:visited, footer div.page-links ul li a:focus {
  font-weight: 700;
}
@media screen and (max-width: 575px) {
  footer div.page-links ul {
    flex-wrap: wrap;
    justify-content: space-around;
  }
  footer div.page-links ul li {
    padding: 0 0.5rem;
  }
  footer div.page-links ul li:first-child {
    width: 100%;
    text-align: center;
    order: 4;
    padding: 0.5rem 0;
  }
  footer div.page-links ul li:nth-child(2) {
    border-left: none;
  }
}

/*-----------------------*/
/*-----------------------*/
/*-------HOME------------*/
/*-----------------------*/
/*-----------------------*/
#home {
  position: relative;
}
#home #welcome, #home #choose {
  position: absolute;
  transform: translate(-50%, -50%);
  font-weight: 600;
  font-size: 1.4rem;
}
@media screen and (max-width: 992px) {
  #home #welcome, #home #choose {
    font-size: 1.2rem;
  }
}
@media screen and (max-width: 768px) {
  #home #welcome, #home #choose {
    font-size: 1rem;
  }
}
#home #welcome {
  width: 240px;
  height: 130px;
  top: 21%;
  left: calc(50% + 185px);
  color: #005B7B;
}
@media screen and (max-width: 992px) {
  #home #welcome {
    left: calc(50% + 175px);
    width: 210px;
  }
}
@media screen and (max-width: 768px) {
  #home #welcome {
    top: 25%;
    left: calc(50% + 125px);
    width: 180px;
  }
}
#home #choose {
  position: absolute;
  width: 220px;
  height: 130px;
  bottom: 31%;
  left: calc(50% + 150px);
  color: #fff;
}
@media screen and (max-width: 992px) {
  #home #choose {
    bottom: 28%;
  }
}
@media screen and (max-width: 768px) {
  #home #choose {
    bottom: 20%;
    left: calc(50% + 120px);
    width: 180px;
  }
}
#home #choose p {
  margin-bottom: 1rem;
}
#home #choose a {
  display: flex;
  justify-content: center;
  text-decoration: none;
}
#home #choose a button {
  min-width: unset;
  min-height: unset;
  padding: 0 5px;
  line-height: 50px;
  height: 50px;
  background-color: #0090b3;
  box-shadow: black 0 0 5px;
}
#home #choose a div {
  content: "";
  height: 50px;
  width: 25px;
  overflow: hidden;
  position: relative;
}
#home #choose a div:after {
  content: "";
  position: absolute;
  width: 33px;
  height: 33px;
  background-color: #0090b3;
  left: 0%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(-45deg);
  box-shadow: black 0 0 5px;
}
#home #choose a button {
  font: 300 3rem "Bromello Regular";
}
#home #choose a div {
  margin-left: 1rem;
  box-shadow: rgba(0, 0, 0, 0.3) -2px 0 0;
}

/*-----------------------*/
/*-----------------------*/
/*-------CONTACT---------*/
/*-----------------------*/
/*-----------------------*/
#page_contact h1 {
  text-align: center;
  color: #fff;
}
#page_contact p {
  color: #fff;
}

form[name=contact_kreaman] fieldset {
  display: flex;
  flex-direction: column;
}
form[name=contact_kreaman] fieldset input:not([type=checkbox]) {
  height: 35px;
  width: 65%;
  border-radius: 5px;
  box-shadow: none;
}
form[name=contact_kreaman] fieldset label {
  color: #fff;
  width: 30%;
  min-width: 100px;
}
form[name=contact_kreaman] fieldset div > label {
  text-align: right;
  padding-right: 1rem;
}
form[name=contact_kreaman] fieldset div > label:after {
  content: " :";
}
form[name=contact_kreaman] fieldset div > label.required:after {
  content: "* :";
}
form[name=contact_kreaman] fieldset textarea {
  width: 65%;
  height: 200px;
  border-radius: 5px;
  box-shadow: none;
}
form[name=contact_kreaman] fieldset div.form-group {
  display: flex;
  align-items: baseline;
}
form[name=contact_kreaman] fieldset div.form-group button {
  margin: auto;
  border-radius: 5px;
  box-shadow: none;
}
form[name=contact_kreaman] fieldset .form-group-margin {
  margin-left: 30%;
}
form[name=contact_kreaman] fieldset .form-group-margin label {
  order: 1;
  width: 65%;
  text-align: left !important;
}
form[name=contact_kreaman] fieldset .form-group-margin label:after {
  content: none;
}
form[name=contact_kreaman] fieldset .form-group-margin input {
  margin-right: 1rem;
}
form[name=contact_kreaman] fieldset > div ~ div {
  margin-top: 1.5rem;
}
form[name=contact_kreaman] fieldset #form-errors ul {
  background-color: #f33b52;
  padding: 1rem;
  margin-bottom: 0;
}
form[name=contact_kreaman] fieldset #form-errors ul li {
  font-weight: 700;
  color: #fff;
}

#contact_kreaman_product {
  display: flex;
  flex-wrap: wrap;
  width: 65%;
}
#contact_kreaman_product label {
  text-align: left;
  padding-left: 1rem;
  width: auto;
}
#contact_kreaman_product label:after {
  content: none;
}
#contact_kreaman_product .form-group {
  flex-basis: 350px;
}

/*-----------------------*/
/*-----------------------*/
/*------CATEGORIE--------*/
/*-----------------------*/
/*-----------------------*/
.back {
  display: inline-block;
  margin: 2rem 0;
}
.back a {
  display: flex;
  justify-content: center;
  text-decoration: none;
}
.back a button {
  min-width: unset;
  min-height: unset;
  padding: 0 5px;
  line-height: 50px;
  height: 50px;
  background-color: #fff;
  box-shadow: black 0 0 5px;
}
.back a div {
  content: "";
  height: 50px;
  width: 25px;
  overflow: hidden;
  position: relative;
}
.back a div:after {
  content: "";
  position: absolute;
  width: 33px;
  height: 33px;
  background-color: #fff;
  left: 100%;
  top: 50%;
  transform: translate(-50%, -50%) rotate(-45deg);
  box-shadow: black 0 0 5px;
}
.back a button {
  color: #0090b3;
  font-weight: 600;
}
.back a div {
  margin-right: 1rem;
  box-shadow: rgba(0, 0, 0, 0.3) 2px 0 0;
}

#grid-categories {
  margin-top: 6rem;
}
#grid-categories > div {
  display: flex;
  justify-content: center;
  align-items: center;
}
#grid-categories #kreaman {
  justify-content: flex-start;
}
#grid-categories #kreaman > div {
  position: relative;
  z-index: 1;
  height: 236px;
  width: 236px;
}
#grid-categories #kreaman > div img {
  max-width: none;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
}
#grid-categories #kreaman > div p {
  position: absolute;
  width: 125px;
  right: -120px;
  top: 0;
  color: #fff;
  font-weight: 500;
  font-size: 1.4rem;
}
#grid-categories #kreaman > div p.rose {
  top: 20px;
  right: -125px;
  font-size: 1.3rem;
  line-height: 1.1em;
  text-align: center;
}

.bloc {
  position: relative;
  width: 236px;
  height: 236px;
  background-color: white;
  border-radius: 50%;
}
.bloc.bleu {
  border: 3px solid #005b79;
}
.bloc.bleu .drop > div.title {
  background-color: #00a8cc;
}
.bloc.rose {
  border: 3px solid #99335A;
}
.bloc.rose .drop > div.title {
  background-color: #F64888;
}
.bloc:after, .bloc:before {
  content: "";
  position: absolute;
  width: 50%;
  height: 100px;
  z-index: -10;
}
.bloc:before {
  left: 50%;
  bottom: -5px;
  transform: translateX(-50%);
  width: 80%;
  height: 10px;
  background: #22778b;
  border-radius: 100%/10px;
  box-shadow: 0 0 5px #22778b, 0 0 10px rgba(34, 119, 139, 0.5019607843);
}
.bloc:hover {
  transform: scale(1.1);
}

.selected .bloc {
  border-color: #F64888;
}
.selected .bloc .drop > div.title {
  background-color: #99335A;
}

a.drop {
  display: block;
  text-decoration: none;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
}
a.drop:hover, a.drop:visited, a.drop:active {
  text-decoration: none;
}
a.drop > div.image {
  height: 75%;
  overflow: hidden;
}
a.drop > div.title {
  height: 25%;
  color: white;
}
a.drop > div.title > p {
  padding: 5px 25px 0;
  text-align: center;
  line-height: 1.1em;
  font-size: 1.2rem;
}

/*-----------------------*/
/*-----------------------*/
/*---LISTE ETIQUETTES----*/
/*-----------------------*/
/*-----------------------*/
#etiquettes_wrapper {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
  background-color: rgba(0, 168, 204, 0.4);
  /*-webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);*/
}
#etiquettes_wrapper > div {
  position: relative;
  padding: 1rem;
  background-color: #fff;
  border: 4px solid #99335A;
  border-radius: 10px;
}
#etiquettes_wrapper div.close {
  position: absolute;
  top: 0;
  right: 0;
  -webkit-transform: translate(50%, -50%);
  -moz-transform: translate(50%, -50%);
  -ms-transform: translate(50%, -50%);
  -o-transform: translate(50%, -50%);
  transform: translate(50%, -50%);
  background-color: #fff;
  width: 40px;
  height: 40px;
  border: 5px solid #99335A;
  border-radius: 50%;
}
#etiquettes_wrapper div.close span {
  position: absolute;
  top: 50%;
  left: 50%;
  content: "";
  display: block;
  height: 5px;
  width: 20px;
  background-color: #99335A;
}
#etiquettes_wrapper div.close span:first-child {
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
  -moz-transform: translate(-50%, -50%) rotate(45deg);
  -ms-transform: translate(-50%, -50%) rotate(45deg);
  -o-transform: translate(-50%, -50%) rotate(45deg);
  transform: translate(-50%, -50%) rotate(45deg);
}
#etiquettes_wrapper div.close span:last-child {
  -webkit-transform: translate(-50%, -50%) rotate(-45deg);
  -moz-transform: translate(-50%, -50%) rotate(-45deg);
  -ms-transform: translate(-50%, -50%) rotate(-45deg);
  -o-transform: translate(-50%, -50%) rotate(-45deg);
  transform: translate(-50%, -50%) rotate(-45deg);
}
#etiquettes_wrapper > div > p {
  color: #99335A;
}
#etiquettes_wrapper > div > p.message-no-perso {
  color: #005b79;
}
#etiquettes_wrapper .list-etiquettes {
  display: flex;
  margin-top: 1rem;
  width: 100%;
}
#etiquettes_wrapper .list-etiquettes ul ~ ul {
  margin-left: 1rem;
}
#etiquettes_wrapper .list-etiquettes li {
  display: flex;
  align-items: center;
  color: #fff;
  padding: 0.5rem 2rem 0.5rem 0.7rem;
  border-radius: 0.5rem;
  box-shadow: 0 0 3px 0 black;
}
#etiquettes_wrapper .list-etiquettes li ~ li, #etiquettes_wrapper .list-etiquettes li ~ ul {
  margin-top: 0.7rem;
}
#etiquettes_wrapper .list-etiquettes li > a, #etiquettes_wrapper .list-etiquettes li > a:hover {
  display: flex;
  justify-content: space-between;
  width: 100%;
  text-decoration: none;
  color: #fff;
}
#etiquettes_wrapper .list-etiquettes li > a span:first-child, #etiquettes_wrapper .list-etiquettes li > a:hover span:first-child {
  margin-right: 2rem;
}
#etiquettes_wrapper .list-etiquettes li:before {
  content: "";
  display: inline-block;
  margin-right: 0.7rem;
  border-top: solid transparent 8px;
  border-bottom: solid transparent 8px;
  border-left-width: 8px;
  border-left-style: solid;
}
#etiquettes_wrapper .list-etiquettes > ul {
  padding-left: 0;
  width: 100%;
}
#etiquettes_wrapper .list-etiquettes > ul > li {
  background-color: #F13B7E;
}
#etiquettes_wrapper .list-etiquettes > ul > li:before {
  border-left-color: #FA88B9;
}
#etiquettes_wrapper .list-etiquettes > ul > ul {
  padding-left: 0.7rem;
}
#etiquettes_wrapper .list-etiquettes > ul > ul > li {
  background-color: #FA88B9;
}
#etiquettes_wrapper .list-etiquettes > ul > ul > li:before {
  border-left-color: #F13B7E;
}

.popin-wait-container .fancybox-bg {
  opacity: 0.5;
}
.popin-wait-container .popin-wait {
  background-color: transparent;
}

/*-----------------------*/
/*-----------------------*/
/*---PERSONNALISATION----*/
/*-----------------------*/
/*-----------------------*/
.ui-slider .ui-slider-handle {
  min-width: 1.2em;
  width: auto;
  min-height: 1.2em;
  height: auto;
  padding: 2px;
  top: 50%;
  transform: translateY(-50%);
}

#perso-header {
  display: flex;
  align-items: center;
  padding: 0 2rem;
}
@media screen and (max-width: 1024px) {
  #perso-header {
    flex-wrap: wrap;
    justify-content: space-between;
  }
  #perso-header .product {
    width: 100%;
  }
  #perso-header .back, #perso-header #preview {
    order: 1;
  }
}
#perso-header .product {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
}
#perso-header .product h1 {
  display: inline-block;
  font-size: 2rem;
  line-height: 1.1em;
  padding-top: 20px;
  color: #fff;
  max-width: 575px;
}
#perso-header .product div {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100px;
  height: 100px;
  min-width: 100px;
  min-height: 100px;
  border: 3px solid #99335A;
  border-radius: 50%;
  background-color: #fff;
  overflow: hidden;
  margin-right: 1rem;
}
#perso-header .product div img {
  max-width: calc(100px - 6px);
  max-height: calc(100px - 6px);
}
#perso-header #preview {
  text-align: center;
}
#perso-header #preview button {
  color: #0090b3;
  font-weight: 600;
  box-shadow: #000 0 0 5px;
}

#no-perso-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  border: 5px solid #005b79;
  height: auto;
  max-width: 40vw;
  min-width: 300px;
  margin: 2rem auto 0.5rem;
  padding: 2rem;
}
#no-perso-wrapper p {
  color: #fff;
  font-weight: 600;
  font-size: 1.6rem;
}

#perso-wrapper {
  display: flex;
  flex-wrap: wrap;
  border: 5px solid #005b79;
  margin-top: 2rem;
}
#perso-wrapper #side {
  display: flex;
  color: #fff;
  width: 25%;
  height: 900px;
}
@media screen and (max-width: 1024px) {
  #perso-wrapper #side {
    width: 100%;
  }
}
#perso-wrapper #side .fa-regular {
  font-family: "FA Regular", serif;
}
#perso-wrapper #side .fa-solid {
  font-family: "FA Solid", serif;
}
#perso-wrapper #side .wrapper-tabs {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 61px;
  height: 100%;
  border: none;
  background-color: #00a8cc;
}
#perso-wrapper #side .wrapper-tabs div a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 61px;
  padding: 0;
  color: #fff;
  background-color: #00a8cc;
  font-weight: 700;
  font-size: 1.1rem;
}
#perso-wrapper #side .wrapper-tabs div a [class|=fa] {
  font-size: 2rem;
}
#perso-wrapper #side .wrapper-tabs div a:hover, #perso-wrapper #side .wrapper-tabs div a:active, #perso-wrapper #side .wrapper-tabs div a:visited, #perso-wrapper #side .wrapper-tabs div a:focus {
  text-decoration: none;
  background-color: #0090b3;
}
#perso-wrapper #side .wrapper-tabs div a.is-active {
  background-color: #0090b3;
  border: none;
}
#perso-wrapper #side .wrapper-tabs div.close a {
  position: relative;
}
#perso-wrapper #side .wrapper-tabs div.close a span {
  position: absolute;
  top: 50%;
  left: 50%;
  content: "";
  display: block;
  height: 3px;
  width: 20px;
  background-color: #fff;
}
#perso-wrapper #side .wrapper-tabs div.close a span:first-child {
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
  -moz-transform: translate(-50%, -50%) rotate(45deg);
  -ms-transform: translate(-50%, -50%) rotate(45deg);
  -o-transform: translate(-50%, -50%) rotate(45deg);
  transform: translate(-50%, -50%) rotate(45deg);
}
#perso-wrapper #side .wrapper-tabs div.close a span:last-child {
  -webkit-transform: translate(-50%, -50%) rotate(-45deg);
  -moz-transform: translate(-50%, -50%) rotate(-45deg);
  -ms-transform: translate(-50%, -50%) rotate(-45deg);
  -o-transform: translate(-50%, -50%) rotate(-45deg);
  transform: translate(-50%, -50%) rotate(-45deg);
}
#perso-wrapper h3 {
  display: flex;
  align-items: center;
  font-size: 1.4rem;
  font-weight: 400;
  padding: 0.5rem 1rem;
  margin-bottom: 0;
}
#perso-wrapper h3:before {
  content: "";
  display: inline-block;
  border-left: 12px solid #005b79;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  line-height: 1.4rem;
  margin-right: 1rem;
}
#perso-wrapper .selected > h3:before {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 16px solid #005b79;
  border-bottom: 0;
}

.wrapper-tools {
  display: flex;
  flex-direction: column;
  width: calc(100% - 61px);
}
.wrapper-tools .print-output {
  margin: 2rem 0;
}
.wrapper-tools .print-output label {
  display: flex;
}
.wrapper-tools .print-output label input {
  margin-right: 1.5rem;
  margin-left: 1.5rem;
}
.wrapper-tools .tools > div {
  padding: 0 1.5rem;
}

#tools-text ul.tabs-menu {
  padding-left: 0.7rem;
}
#tools-text ul.tabs-menu li.tabs-menu-item {
  display: inline-block;
  margin-bottom: -2px;
}
#tools-text ul.tabs-menu li.tabs-menu-item a.tabs-menu-link {
  color: #fff;
}
#tools-text ul.tabs-menu li.tabs-menu-item a.tabs-menu-link.is-active {
  color: #fff;
  border: 2px solid #fff;
  border-bottom-color: #0090b3;
}
#tools-text ul.tabs-menu li.tabs-menu-item a.tabs-menu-link:hover, #tools-text ul.tabs-menu li.tabs-menu-item a.tabs-menu-link:active {
  text-decoration: none;
}

.textzone div, .alignement > div div, .imagezone div, .fondzone div, .change-icon-zone div {
  display: flex;
  justify-content: space-around;
  margin: 1rem auto;
}
.textzone div button, .textzone div .btn, .alignement > div div button, .alignement > div div .btn, .imagezone div button, .imagezone div .btn, .fondzone div button, .fondzone div .btn, .change-icon-zone div button, .change-icon-zone div .btn {
  background-color: #F64888;
  color: #000;
  font-weight: 600;
}

div.copy {
  display: flex;
  justify-content: space-around;
  margin: 1rem auto;
}
div.copy button, div.copy .btn {
  background-color: #F64888;
  color: #000;
  font-weight: 600;
}

.alignement > div div {
  flex-wrap: wrap;
  width: 100%;
}
.alignement > div div button {
  flex-basis: calc(35px + 2 * 0.5rem);
  min-width: 35px;
  font-size: 1.6rem;
  margin: 0.5rem;
  padding: 0.7rem;
  display: inline-block;
  text-align: center;
}
.alignement > div div button .text-align {
  font-size: 1.8rem;
}
.alignement > div div select {
  border-radius: 5px;
  box-shadow: none;
  text-align: center;
}
.alignement > div .vertical-align-wrapper {
  justify-content: space-between;
}

.text-police form {
  display: flex;
  justify-content: space-between;
}
.text-police form > div {
  margin: 1rem;
}
.text-police form > div input, .text-police form > div select {
  text-align: center;
  box-shadow: none;
  border-radius: 5px;
}
.text-police form > div select {
  width: 170px;
}
.text-police form > div select#select-text-police option {
  font-family: var(--font-montserra);
}
.text-police form > div input {
  width: 70px;
}

.library ul {
  max-height: 250px;
  overflow-y: scroll;
  display: flex;
  flex-wrap: wrap;
  padding-left: 0;
}
.library ul li {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-basis: 25%;
  padding: 0.5rem;
}
.library ul li img {
  max-width: 50px;
}
.library ul li svg {
  width: 35px;
  position: absolute;
}

.select-img {
  padding-bottom: 2rem;
}
.select-img > div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.select-img > div:first-child {
  justify-content: center;
}
.select-img > div:nth-child(2) {
  display: block;
}
.select-img > div ~ div {
  margin-top: 1rem;
}
.select-img > div select {
  text-align: center;
  box-shadow: none;
  border-radius: 5px;
}
.select-img > div img {
  max-width: 100%;
  max-height: 150px;
}
.select-img div.image-shapes label {
  width: 150px;
}
.select-img div.image-shapes > div {
  display: flex;
  flex-wrap: wrap;
}
.select-img div.image-shapes button {
  background-color: #F64888;
  margin: 0.5rem;
}
.select-img div.image-shapes button .material-icons {
  width: 20px;
  display: inline-block;
}

.text-color, .fond-color, .border-color, .icon-color, .icon-stroke-color {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 1.5rem;
}
.text-color button, .fond-color button, .border-color button, .icon-color button, .icon-stroke-color button {
  background-color: #F64888;
  color: #000;
  font-weight: 600;
}
.text-color .color-picker, .fond-color .color-picker, .border-color .color-picker, .icon-color .color-picker, .icon-stroke-color .color-picker {
  width: 100%;
  margin: 0.7rem 0;
}
.text-color .color-picker > div, .fond-color .color-picker > div, .border-color .color-picker > div, .icon-color .color-picker > div, .icon-stroke-color .color-picker > div {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.text-color .color-picker > div input.input-color, .fond-color .color-picker > div input.input-color, .border-color .color-picker > div input.input-color, .icon-color .color-picker > div input.input-color, .icon-stroke-color .color-picker > div input.input-color {
  width: 4em;
  padding: 2px 0 2px 0.5rem;
  border-radius: 5px;
  box-shadow: none;
}
.text-color .color-picker > div .red, .text-color .color-picker > div .green, .text-color .color-picker > div .blue, .fond-color .color-picker > div .red, .fond-color .color-picker > div .green, .fond-color .color-picker > div .blue, .border-color .color-picker > div .red, .border-color .color-picker > div .green, .border-color .color-picker > div .blue, .icon-color .color-picker > div .red, .icon-color .color-picker > div .green, .icon-color .color-picker > div .blue, .icon-stroke-color .color-picker > div .red, .icon-stroke-color .color-picker > div .green, .icon-stroke-color .color-picker > div .blue {
  flex-grow: 1;
  margin: 0.7rem 1rem;
}
.text-color .color-picker > div .red .ui-slider-handle, .text-color .color-picker > div .green .ui-slider-handle, .text-color .color-picker > div .blue .ui-slider-handle, .fond-color .color-picker > div .red .ui-slider-handle, .fond-color .color-picker > div .green .ui-slider-handle, .fond-color .color-picker > div .blue .ui-slider-handle, .border-color .color-picker > div .red .ui-slider-handle, .border-color .color-picker > div .green .ui-slider-handle, .border-color .color-picker > div .blue .ui-slider-handle, .icon-color .color-picker > div .red .ui-slider-handle, .icon-color .color-picker > div .green .ui-slider-handle, .icon-color .color-picker > div .blue .ui-slider-handle, .icon-stroke-color .color-picker > div .red .ui-slider-handle, .icon-stroke-color .color-picker > div .green .ui-slider-handle, .icon-stroke-color .color-picker > div .blue .ui-slider-handle {
  width: 2.2em;
  text-align: center;
  line-height: 1em;
}
.text-color .color-picker > div .red .ui-slider-range, .fond-color .color-picker > div .red .ui-slider-range, .border-color .color-picker > div .red .ui-slider-range, .icon-color .color-picker > div .red .ui-slider-range, .icon-stroke-color .color-picker > div .red .ui-slider-range {
  background: #ef2929;
}
.text-color .color-picker > div .red .ui-slider-handle, .fond-color .color-picker > div .red .ui-slider-handle, .border-color .color-picker > div .red .ui-slider-handle, .icon-color .color-picker > div .red .ui-slider-handle, .icon-stroke-color .color-picker > div .red .ui-slider-handle {
  border-color: #ef2929;
}
.text-color .color-picker > div .green .ui-slider-range, .fond-color .color-picker > div .green .ui-slider-range, .border-color .color-picker > div .green .ui-slider-range, .icon-color .color-picker > div .green .ui-slider-range, .icon-stroke-color .color-picker > div .green .ui-slider-range {
  background: #8ae234;
}
.text-color .color-picker > div .green .ui-slider-handle, .fond-color .color-picker > div .green .ui-slider-handle, .border-color .color-picker > div .green .ui-slider-handle, .icon-color .color-picker > div .green .ui-slider-handle, .icon-stroke-color .color-picker > div .green .ui-slider-handle {
  border-color: #8ae234;
}
.text-color .color-picker > div .blue .ui-slider-range, .fond-color .color-picker > div .blue .ui-slider-range, .border-color .color-picker > div .blue .ui-slider-range, .icon-color .color-picker > div .blue .ui-slider-range, .icon-stroke-color .color-picker > div .blue .ui-slider-range {
  background: #729fcf;
}
.text-color .color-picker > div .blue .ui-slider-handle, .fond-color .color-picker > div .blue .ui-slider-handle, .border-color .color-picker > div .blue .ui-slider-handle, .icon-color .color-picker > div .blue .ui-slider-handle, .icon-stroke-color .color-picker > div .blue .ui-slider-handle {
  border-color: #729fcf;
}
.text-color .color-picker .color-picker-view, .fond-color .color-picker .color-picker-view, .border-color .color-picker .color-picker-view, .icon-color .color-picker .color-picker-view, .icon-stroke-color .color-picker .color-picker-view {
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 1.5rem auto;
}
.text-color .color-picker .color-picker-view .swatch, .fond-color .color-picker .color-picker-view .swatch, .border-color .color-picker .color-picker-view .swatch, .icon-color .color-picker .color-picker-view .swatch, .icon-stroke-color .color-picker .color-picker-view .swatch {
  width: 60px;
  height: 50px;
  background-image: none;
}
.text-color ul, .fond-color ul, .border-color ul, .icon-color ul, .icon-stroke-color ul {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  padding: 0 15px 0 0;
  height: 40px;
  overflow: hidden;
}
.text-color ul span.plus-colors, .fond-color ul span.plus-colors, .border-color ul span.plus-colors, .icon-color ul span.plus-colors, .icon-stroke-color ul span.plus-colors {
  position: absolute;
  right: 0;
  top: 0;
  color: #fff;
  font: 800 2rem var(--font-montserra);
  cursor: pointer;
}
.text-color ul.view-all, .fond-color ul.view-all, .border-color ul.view-all, .icon-color ul.view-all, .icon-stroke-color ul.view-all {
  height: auto;
}
.text-color ul.view-all span.plus-colors, .fond-color ul.view-all span.plus-colors, .border-color ul.view-all span.plus-colors, .icon-color ul.view-all span.plus-colors, .icon-stroke-color ul.view-all span.plus-colors {
  transform: rotate(180deg);
}
.text-color ul li, .fond-color ul li, .border-color ul li, .icon-color ul li, .icon-stroke-color ul li {
  flex-basis: calc(30px + 0.5rem);
  margin: calc(0.5rem / 2);
  display: inline-block;
  text-align: center;
}
.text-color ul li span, .fond-color ul li span, .border-color ul li span, .icon-color ul li span, .icon-stroke-color ul li span {
  display: inline-block;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  -webkit-text-stroke: 1px #99335A;
  font-size: 2.4rem;
  line-height: 30px;
}

#tools-fond > div {
  position: relative;
}
#tools-fond > div .opacite {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 10;
  background-color: rgba(67, 83, 90, 0.7);
}
#tools-fond > div .opacite p {
  max-width: 70%;
  text-align: center;
  font-size: 1.6rem;
  font-weight: 700;
}

#tools-shapes #shapes-list {
  display: flex;
  flex-wrap: wrap;
}
#tools-shapes #shapes-list .shape {
  width: 75px;
  padding: 1rem;
}
#tools-shapes #shapes-list .shape path {
  fill: white;
}

#tools-icones #new-icon ul.tabs-menu {
  padding-left: 0.7rem;
}
#tools-icones #new-icon ul.tabs-menu li.tabs-menu-item {
  display: inline-block;
  margin-bottom: -2px;
}
#tools-icones #new-icon ul.tabs-menu li.tabs-menu-item a.tabs-menu-link {
  color: #fff;
  padding: 0.5rem 1rem;
}
#tools-icones #new-icon ul.tabs-menu li.tabs-menu-item a.tabs-menu-link.is-active {
  color: #fff;
  border: 2px solid #fff;
  border-bottom-color: #0090b3;
}
#tools-icones #new-icon ul.tabs-menu li.tabs-menu-item a.tabs-menu-link:hover, #tools-icones #new-icon ul.tabs-menu li.tabs-menu-item a.tabs-menu-link:active {
  text-decoration: none;
}
#tools-icones #new-icon .tabs-content-item {
  margin-right: -15px;
}
#tools-icones #new-icon .icons {
  display: flex;
  flex-wrap: wrap;
  height: auto;
  max-height: 800px;
  margin-right: 15px;
  margin-bottom: 1rem;
}
#tools-icones #new-icon .icon {
  flex-grow: 1;
  display: inline-block;
  border: #005b79 2px solid;
  padding: 0.5rem;
  margin: 0 0.5rem 0.5rem 0;
  font-size: 4rem;
  text-align: center;
  cursor: pointer;
}
#tools-icones #new-icon .icon[data-family="Paris Regular"] {
  font-family: "Paris Regular", sans-serif;
}
#tools-icones #new-icon .icon[data-family="New York , New York 2 Regular"] {
  font-family: "New York , New York 2 Regular", sans-serif;
}
#tools-icones #new-icon .icon[data-family="Graffiti Tags Regular"] {
  font-family: "Graffiti Tags", sans-serif;
}
#tools-icones #new-icon .icon[data-family="Summer Icons Regular"] {
  font-family: "Summer Icons Regular", sans-serif;
}
#tools-icones #new-icon .icon[data-family="Galaxy Far Far Away Regular"] {
  font-family: "Galaxy Far Far Away Regular", sans-serif;
}
#tools-icones #edit-icon > ul {
  padding-left: 0.7rem;
}

#editor {
  flex-grow: 1;
  min-height: 900px;
  background-color: #ced4da;
}
#editor iframe {
  width: 100%;
  height: 100%;
}

/*-----------------------*/
/*-----------------------*/
/*--------PREVIEW--------*/
/*-----------------------*/
/*-----------------------*/
#popin_preview, #popin_message {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 2;
  background-color: rgba(0, 168, 204, 0.4);
  /*-webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);*/
  z-index: 11;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 100px;
  min-width: 200px;
}
#popin_preview > div, #popin_message > div {
  position: relative;
  padding: 1rem;
  background-color: #fff;
  border: 4px solid #005b79;
  border-radius: 10px;
}
#popin_preview div.close, #popin_message div.close {
  position: absolute;
  top: 0;
  right: 0;
  -webkit-transform: translate(50%, -50%);
  -moz-transform: translate(50%, -50%);
  -ms-transform: translate(50%, -50%);
  -o-transform: translate(50%, -50%);
  transform: translate(50%, -50%);
  background-color: #fff;
  width: 40px;
  height: 40px;
  border: 5px solid #005b79;
  border-radius: 50%;
}
#popin_preview div.close span, #popin_message div.close span {
  position: absolute;
  top: 50%;
  left: 50%;
  content: "";
  display: block;
  height: 5px;
  width: 20px;
  background-color: #005b79;
}
#popin_preview div.close span:first-child, #popin_message div.close span:first-child {
  -webkit-transform: translate(-50%, -50%) rotate(45deg);
  -moz-transform: translate(-50%, -50%) rotate(45deg);
  -ms-transform: translate(-50%, -50%) rotate(45deg);
  -o-transform: translate(-50%, -50%) rotate(45deg);
  transform: translate(-50%, -50%) rotate(45deg);
}
#popin_preview div.close span:last-child, #popin_message div.close span:last-child {
  -webkit-transform: translate(-50%, -50%) rotate(-45deg);
  -moz-transform: translate(-50%, -50%) rotate(-45deg);
  -ms-transform: translate(-50%, -50%) rotate(-45deg);
  -o-transform: translate(-50%, -50%) rotate(-45deg);
  transform: translate(-50%, -50%) rotate(-45deg);
}
#popin_preview .preview_title, #popin_message .preview_title {
  background-color: #00a8cc;
  padding: 2rem;
  margin-top: -1px;
  box-shadow: #000 0 1px 5px;
  border-top-left-radius: 5px;
}
#popin_preview .preview_title p, #popin_message .preview_title p {
  color: #fff;
  font-size: 1.6rem;
}
#popin_preview .preview_wrapper, #popin_message .preview_wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 3rem;
}
#popin_preview .preview_img, #popin_message .preview_img {
  width: 60vw;
  padding: 5px;
  height: 90vh;
  max-height: 550px;
  overflow: auto;
  text-align: center;
}
#popin_preview .preview_img img:not(.loader), #popin_message .preview_img img:not(.loader) {
  box-shadow: 0 0 5px #000;
  height: 100%;
  max-height: calc(60vw * 1.5);
  min-height: calc(60vw / 5);
  max-width: none;
}
#popin_preview .preview_link, #popin_message .preview_link {
  min-width: calc(100px + 2rem);
  max-width: calc(200px + 2rem);
  padding-left: 2rem;
  display: flex;
  flex-direction: column;
}
#popin_preview .preview_link button, #popin_message .preview_link button {
  white-space: normal;
  background-color: #005b79;
  color: #fff;
  padding: 1.5rem;
  box-shadow: #000 0 0 5px;
  width: 100%;
}
#popin_preview .preview_link button ~ button, #popin_preview .preview_link button ~ a, #popin_message .preview_link button ~ button, #popin_message .preview_link button ~ a {
  margin-top: 2rem;
}
#popin_preview .message_print_wrapper, #popin_message .message_print_wrapper {
  padding: 3rem;
  max-width: 90vw;
}
#popin_preview .message_print_wrapper ul, #popin_message .message_print_wrapper ul {
  list-style-type: disc;
}
#popin_preview .message_print_wrapper .loader, #popin_message .message_print_wrapper .loader {
  text-align: center;
  margin: 4rem auto 1.5rem;
}
#popin_preview .message_print_wrapper .loader img, #popin_message .message_print_wrapper .loader img {
  height: 150px;
}

/*# sourceMappingURL=kreaman.css.map */