﻿@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  src: url(https://fonts.gstatic.com/s/roboto/v20/KFOkCnqEu92Fr1MmgVxIIzc.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmSU5fBBc9.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/roboto/v20/KFOmCnqEu92Fr1Mu4mxP.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmEU9fBBc9.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url(https://fonts.gstatic.com/s/roboto/v20/KFOlCnqEu92Fr1MmWUlfBBc9.ttf) format('truetype');
}
@font-face {
  font-family: 'Josefin Sans';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/josefinsans/v16/Qw3PZQNVED7rKGKxtqIqX5E-AVSJrOCfjY46_DjQbMZhKg.ttf) format('truetype');
}
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  }
  100% {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  }
  100% {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  }
}
/* round loader */
@keyframes rotate {
  100% {
    transform: rotate(360deg);
  }
}
@keyframes dash {
  0% {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -35px;
  }
  100% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -124px;
  }
}
@keyframes color {
  100%,
  0% {
    stroke: #FF7900;
  }
  40% {
    stroke: #FF7900;
  }
  66% {
    stroke: #FF7900;
  }
  80%,
  90% {
    stroke: #FF7900;
  }
}
/* loader cubes */
@-webkit-keyframes sk-cubeGridScaleDelay {
  0%,
  70%,
  100% {
    -webkit-transform: scale3D(1, 1, 1);
    transform: scale3D(1, 1, 1);
  }
  35% {
    -webkit-transform: scale3D(0, 0, 1);
    transform: scale3D(0, 0, 1);
  }
}
@keyframes sk-cubeGridScaleDelay {
  0%,
  70%,
  100% {
    -webkit-transform: scale3D(1, 1, 1);
    transform: scale3D(1, 1, 1);
  }
  35% {
    -webkit-transform: scale3D(0, 0, 1);
    transform: scale3D(0, 0, 1);
  }
}
/* Change the white to any color ;) */
input {
  background-color: transparent;
}
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-transition-delay: 99999s;
}
.loginInput::-webkit-input-placeholder {
  color: rgba(0, 0, 0, 0.6) !important;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.loginInput::-moz-placeholder {
  color: rgba(0, 0, 0, 0.6) !important;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.loginInput:-ms-input-placeholder {
  color: rgba(0, 0, 0, 0.6) !important;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.loginInput::placeholder {
  color: rgba(0, 0, 0, 0.6) !important;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.loginInput::-webkit-input-placeholder {
  /* WebKit, Blink, Edge */
  color: rgba(0, 0, 0, 0.6) !important;
}
.loginInput:-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: rgba(0, 0, 0, 0.6) !important;
  opacity: 1 !important;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.loginInput::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: rgba(0, 0, 0, 0.6) !important;
  opacity: 1 !important;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}
.loginInput:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: rgba(0, 0, 0, 0.6) !important;
}
body.loginBody {
  font-size: 14px;
  font-size: 1.4rem;
  background-color: #eef1f7;
  min-height: 100vh;
}
body.loginBody .container-fluid {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
.loginBody {
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  font-family: 'Josefin Sans', sans-serif !important;
  background-size: 100% 100%;
  font-size: 18px !important;
  font-size: 1.8rem !important;
  /* CheckBox */
  /* on checked */
  /* End CheckBox */
  /*Container du btn LoginSubmit AjaxPanel*/
  /* --------------- Begin Loader -------------- */
  /* --------------- end Loader -------------- */
}
.loginBody .sectionLogin {
  min-height: 100vh;
  padding-top: 10vh;
  background: rgba(255, 255, 255, 0.5);
}
.loginBody .loginForm {
  font-size: inherit !important;
  text-align: center;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  -webkit-animation: fadeIn 2s ease 3s forwards;
  animation: fadeIn 2s ease 3s forwards;
}
.loginBody .loginFormCenter {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}
.loginBody .loginIcon {
  padding: 15px;
}
.loginBody .loginIcon img {
  max-width: 180px;
  height: auto;
}
.loginBody .loginRow {
  height: 45px;
  margin-top: 15px;
}
.loginBody .loginRow i {
  color: rgba(255, 255, 255, 0.9);
  vertical-align: middle;
}
.loginBody .loginRow input {
  font-size: 24px !important;
  font-size: 2.4rem !important;
}
.loginBody .loginRow input.loginInput {
  display: inline-block !important;
  height: 100% !important;
  font-weight: 300 !important;
  padding: 10px 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-bottom: 1px solid #E36911 !important;
  font-style: normal !important;
}
.loginBody .loginRow input.loginInput:focus {
  outline: 0 !important;
}
.loginBody .loginRow .RadInput.riSingle .riTextBox {
  border: none !important;
  border-bottom: 1px solid #E36911 !important;
  border-radius: 0 !important;
}
.loginBody [type="checkbox"]:not(:checked),
.loginBody [type="checkbox"]:checked {
  position: absolute;
  left: -9999px;
}
.loginBody [type="checkbox"]:not(:checked) + label,
.loginBody [type="checkbox"]:checked + label {
  position: relative;
  padding-left: 75px;
  cursor: pointer;
  color: #181818;
  line-height: 30px;
}
.loginBody [type="checkbox"]:not(:checked) + label:before,
.loginBody [type="checkbox"]:checked + label:before,
.loginBody [type="checkbox"]:not(:checked) + label:after,
.loginBody [type="checkbox"]:checked + label:after {
  content: '';
  position: absolute;
}
.loginBody [type="checkbox"]:not(:checked) + label:before,
.loginBody [type="checkbox"]:checked + label:before {
  left: 0;
  top: -3px;
  width: 65px;
  height: 30px;
  border: 1px solid #E36911;
  background: #ffffff;
  border-radius: 15px;
  -webkit-transition: background-color 0.2s;
  transition: background-color 0.2s;
}
.loginBody [type="checkbox"]:not(:checked) + label:after,
.loginBody [type="checkbox"]:checked + label:after {
  width: 20px;
  height: 20px;
  -webkit-transition: all 0.2s;
  transition: all 0.2s;
  border-radius: 50%;
  background: #E36911;
  top: 2px;
  left: 5px;
}
.loginBody [type="checkbox"]:checked + label:before {
  background: #E36911;
}
.loginBody [type="checkbox"]:checked + label:after {
  background: #FFFFFF;
  top: 2px;
  left: 40px;
}
.loginBody [type="checkbox"]:focus + label:before {
  -ms-box-sizing: border-box;
  box-sizing: border-box;
}
.loginBody .loginRow input:-webkit-autofill,
.loginBody .loginRow input:-webkit-autofill:hover,
.loginBody .loginRow input:-webkit-autofill:focus,
.loginBody .loginRow input:-webkit-autofill:active {
  -webkit-transition: background-color 5000s ease-in-out 0s;
  transition: background-color 5000s ease-in-out 0s;
}
.loginBody .loginForm .forgottenPassword {
  color: #181818;
}
.loginBody .loginForm .forgottenPassword > span {
  margin-right: 10px;
}
.loginBody .loginForm a {
  color: #181818;
  text-decoration: none;
  cursor: pointer;
}
.loginBody .loginForm a:hover {
  text-decoration: none;
}
.loginBody .chkRememberMe label {
  font-weight: 300;
  margin-bottom: 0px;
  height: 20px;
}
.loginBody .rememberRow {
  color: #181818;
  margin-top: 25px;
  text-align: left;
}
.loginBody .rememberRow input[type="checkbox"] {
  width: 15px;
  height: 15px;
  vertical-align: bottom;
}
.loginBody div[id*=btnConnexion] {
  text-align: right;
}
.loginBody .loginSubmit {
  outline: none !important;
  border: none !important;
  position: relative !important;
  padding: 8px 25px;
  margin-top: 40px !important;
  color: rgba(255, 255, 255, 0.9) !important;
  cursor: pointer !important;
  overflow: hidden !important;
  /*transition: width 0.3s 0.15s, font-size 0.1s 0.15s !important;*/
  background-color: #E36911 !important;
  border: 1px solid #E36911 !important;
  margin-bottom: 25px !important;
}
.loginBody .loginSubmit:hover {
  background: #E36B1B !important;
  border: 1px solid #E36B1B !important;
}
.loginBody .errorLoginLabel {
  color: red;
}
.loginBody .successLoginLabel {
  color: green;
}
.loginBody .loginLabel {
  color: white;
}
.loginBody .loginLabelSmall {
  color: white;
}
.loginBody .helpNewAccount {
  margin: 30px 0;
}
.loginBody .stagingNewAccount {
  margin-top: 15px;
}
.loginBody #spinningIcon {
  width: 40px;
  height: 40px;
  margin: 10px auto;
}
.loginBody #spinningIcon .sk-cube {
  width: 33%;
  height: 33%;
  background-color: #E36911;
  float: left;
  -webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
  animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
}
.loginBody #spinningIcon .sk-cube1 {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
.loginBody #spinningIcon .sk-cube2 {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
.loginBody #spinningIcon .sk-cube3 {
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}
.loginBody #spinningIcon .sk-cube4 {
  -webkit-animation-delay: 0.1s;
  animation-delay: 0.1s;
}
.loginBody #spinningIcon .sk-cube5 {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
.loginBody #spinningIcon .sk-cube6 {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
.loginBody #spinningIcon .sk-cube7 {
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
}
.loginBody #spinningIcon .sk-cube8 {
  -webkit-animation-delay: 0.1s;
  animation-delay: 0.1s;
}
.loginBody #spinningIcon .sk-cube9 {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
.loginBody .flags {
  margin-top: 15px;
  -webkit-transition: all 0.5s ease-in 0.2s;
  transition: all 0.5s ease-in 0.2s;
}
.loginBody .flags a {
  padding: 0 5px;
  color: #989898;
}
.loginBody .flags a:hover {
  color: #E36B1B;
}
.loginBody .loginInput {
  width: 100% !important;
}
.loginBody .errorNewAccount {
  color: red;
  display: none;
  text-align: center;
}
.loginBody .colorRed {
  color: red !important;
}
.loginBody #googleRecaptcha,
.loginBody .recaptcha-before {
  width: 300px;
  margin: 22px auto;
}
.loginBody .bodyclass h1 {
  margin: 0 !important;
}
.loginBody .loginSubmit_blue:hover {
  background: #00c5ec !important;
}
.loginBody #backgroundVideo {
  position: fixed;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -100;
  margin: auto;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  /* -webkit-transform: translateX(-55%) translateY(0) scale(1.05);
        -moz-transform: translateX(-55%) translateY(0) scale(1.05);
        -ms-transform: translateX(-55%) translateY(0) scale(1.05);
        -o-transform: translateX(-55%) translateY(0) scale(1.05);
        transform: translateX(-55%) translateY(0) scale(1.05);*/
}
.loginBody .g-recaptcha > div > div {
  margin: 10px auto;
}
.loginBody .colorRed {
  color: red !important;
}
.loginBody .colorGreen {
  color: #1AD51A !important;
}
.loginBody .clockWrapper {
  padding: 10px 0px;
  color: yellow;
}
@media screen and (max-width: 768px) {
  .loginBody .loginForm {
    width: 100% !important;
    padding: 0;
    -webkit-animation: fadeIn 1.5s ease 0.2s forwards;
    animation: fadeIn 1.5s ease 0.2s forwards;
  }
  .loginBody .loginRow input {
    font-size: 18px !important;
    font-size: 1.8rem !important;
  }
  .loginBody .sectionLogin {
    padding-top: 20px;
  }
  .loginBody .loginIcon img {
    max-width: 120px;
  }
  #backgroundVideo {
    display: none;
  }
}