@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,900italic,900,700italic,700,500italic,500,400italic,300italic);
html,
body {
  width: 100%;
  height: auto;
  height: 100%;
  /* min-height: 100%; */
  /* max-height: 100%; */
  color: #014760;
  font-size: 12px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

html {
  background-color: #FFF;
  background-image: url(img/bg_pattern.jpg);
  position: relative;
  background-position: top right;
  background-attachment: fixed;
  background-size: initial;
  background-repeat: repeat;
}

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  font-family: 'Roboto', sans-serif !important;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.logPass {
    padding: 1em;
    display: inline-block;
    background-color: #2a909e;
    cursor: pointer;
    margin: 1em;
}

::-webkit-scrollbar {
  width: 12px;
  height: 12px;
  transition: all 1s;
  opacity: .5;
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 2px rgba(10, 70, 94, 0.37);
  border-radius: 0;
  /* background-color: rgba(80, 80, 80, 0.26); */
}

::-webkit-scrollbar-thumb {
  border-radius: 19px;
  background-color: rgba(42, 144, 158, 0.79);
  -webkit-box-shadow: 0px 4px 6px rgb(26, 97, 121);
}


.uppercase {
  display: inline !important;
  text-transform: uppercase;
}

.fileAriane {
  color: #2A909E;
  background-color: #FFF;
  width: auto;
  display: none;
  padding: .4em;
}

.fileAriane a,
.fileAriane a:visited {
  font-weight: bold;
  color: #2A909E;
}

.fileAriane strong {
  color: #DB1665;
}


/* SLIDER jquery+++++++++++++++++++++++++++++++++++++++++++*/

span.ui-slider-handle {
  width: 25px;
  height: 25px;
  background-color: rgb(34, 145, 156);
  display: inline-block;
  position: absolute;
  border-radius: 100%;
  top: -12px;
  margin-left: -15px;
  box-shadow: rgba(255, 255, 255, 0) 0 0 91px 45px;
  outline: none;
  box-sizing: content-box;
  transition: border .4s cubic-bezier(0.74, 0.24, 0.68, 1.71);
  transition-property: border, background-color, box-shadow;
  z-index: 2;
}

span.ui-slider-handle:hover {
  background-color: #FFF;
  box-shadow: rgb(34, 145, 156) 0 0 0 5px;
  /* top: -30px; */
  /* margin-left: -30px; */
}

div#slider-range {
  width: 88%;
  height: 2px;
  background-color: rgb(255, 255, 255);
  border-radius: 10px;
  display: block;
  margin: 2em 0;
  position: relative;
  margin-left: 6%;
  margin-bottom: 4em;
}

input#amount {
  display: none;
}

.ui-slider-range.ui-widget-header.ui-corner-all {
  /* display: inline; */
  height: 8px;
  background-color: rgba(255, 255, 255, 1);
  /* border-radius: 12px; */
  position: absolute;
  top: -3px;
}


/* SLIDER jquery+++++++++++++++++++++++++++++++++++++++++++*/

pre {
  background-color: #0C1312;
  box-shadow: #000 0px 16px 46px inset;
  color: rgb(0, 255, 206);
  font-family: monospace !important;
  text-shadow: #000 -2px 7px 8px;
  /* background-image: url(http://p1.pichost.me/i/34/1568969.jpg); */
  background-size: cover;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  position: relative;
  /* top: 0; */
  /* height: 100%; */
  /* width: 100%; */
  z-index: 3;
  padding: 1em;
  line-break: normal !important;
  width: 100vw;
  max-width: 100vw;
  word-break: break-all;
  white-space: break-spaces;
}

pre * {
    word-break: break-all;
    line-break: anywhere;
}

pre hr {
    background-color: #206F60;
    margin: 1em 0;
    width: 100%;
}

pre:before {content: '';position: absolute;top: 0;bottom: 0;}

pre::before {
  content: '';
  background-image: url(https://blogimg.goo.ne.jp/user_image/75/4c/35dc4b0be13688ef52ee29527cc1028c.png);
  background-image : url(https://d2v9y0dukr6mq2.cloudfront.net/video/thumbnail/E6xpS0jFxik7ugje7/videoblocks-advance-motion-graphic-futuristic-user-interface-head-up-display-screen-with-hologram-city-buildings-and-digital-data-telemetry-information-display-for-digital-background-computer-desktop-display-screen_r4ug2f13z_thumbnail-full01.png);
  background-image : url(https://devonblog.com/wp-content/uploads/2017/09/codeblauw.jpg);
  background-image: url(img/matrixBG.svg);
  background-size: cover;
  background-repeat: repeat;
  /* background-attachment: fixed; */
  background-position: center;
  position: absolute;
  top: 0;
  height: 100%;
  width: 100%;
  opacity: 0.5;
  z-index: -1;
  display: block;
  -webkit-filter: blur(1px);
}

fieldset {
  padding: 0 1em;
  border: none;
  -webkit-margin-start: 0;
  -webkit-margin-end: 0;
  -webkit-padding-before: 0;
  -webkit-padding-start: 0;
  -webkit-padding-end: 0;
  -webkit-padding-after: 0;
}

.speed,
input[type="submit"] {
  transition: all .4s;
}

.slow,
body,
a,
input,
textarea,
select,
label {
  transition: all .8s;
}

.trou {
  display: none;
}

li {
  display: inline-block;
  /* width: 100%; */
  /* padding: .4em; */
}

.waitingBar {
  background-image: url(img/waitingBar.gif) !important;
  /* width:100%; */
  /* height: 4px; */
  /* background-repeat: no-repeat; */
  background-size: 102%;
  background-position: center center !important;
  background-color: #FFF !important;
  color: transparent !important;
}

textarea {
  font-family: sans-serif;
}

h1,
h2,
h3 {
  font-weight: 900;
  /* margin-top: 1.2em; */
  margin-bottom: .8em;
}

.favorisBlock {
  text-align: center;
  margin-top: 2em;
}

h1.titrePage {
  text-align: center;
  margin-top: 1em;
  text-transform: uppercase;
  width: 100% !important;
}

.caps {
  text-transform: uppercase;
}

hr {
  background-color: rgba(0, 0, 0, 0);
  border-style: solid;
  border-width: -4px;
  width: 80%;
  margin: 1em auto;
  color: rgba(0, 0, 0, 0.2);
  border-radius: 100%;
}

a {
  color: #FFFFFF;
}

a.btAction {
  padding: .4em;
  margin: .4em;
  color: #FFF !important;
  background-color: #C91F66 !important;
  box-shadow: rgba(0, 0, 0, 0.25) 6px 6px 0;
  width: auto;
  display: inline-block;
}

.btAction em {
  font-weight: normal;
  font-size: .8em;
  text-align: right !important;
  width: 100%;
  display: inline-block;
}

a {
  text-decoration: none;
  font-weight: bold;
}

a.GmapIcon {
  background-image: url(http://icon-park.com/imagefiles/location_map_pin_home_purple-200x235.png);
  width: 2em;
  height: 2em;
  display: inline-block;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  top: .5em;
}

a:hover {
  /* text-decoration: underline; */
  font-weight: bold;
  /* color: #FFFFFF; */
}

.menuAdm a:hover {
  text-decoration: none;
}

.alert {
  border: rgb(255, 0, 48) 1px solid;
  color: white;
  text-align: center;
  padding: 0.5em;
  /* border-radius: 5px; */
  margin: 1em;
  background-color: rgb(231, 17, 74);
  font-style: italic;
  box-shadow: rgb(207, 17, 118) 0 0 12px;
  position: relative;
}

.alert:before {
  content: '!';
  color: #FF4274;
  height: 1em;
  display: inline-block;
  font-size: 3em;
  line-height: 1em;
  font-weight: bolder;
  position: absolute;
  left: 0.1em;
  top: 0em;
  bottom: inherit;
  vertical-align: top;
}

.alert a,
.alert a:visited {
  color: #FFFEFE;
  padding: .2em .4em;
  /* border-radius: 0.2em; */
  margin-right: -0.3em;
}

.alert .bt {
  background-color: #23919C !important;
  box-shadow: rgba(0, 0, 0, 0.4) 4px 4px 0;
}

.OK {
  border: rgba(18, 255, 104, 0.44) 1px solid;
  color: white;
  text-align: center;
  padding: 0.5em;
  border-radius: 5px;
  /* margin: 1em; */
  background-color: rgba(41, 157, 126, 0.75);
  font-style: italic;
  box-shadow: rgb(42, 158, 127) 0 0 12px;
  border-bottom: #A4FF00 3px solid;
  position: fixed;
  width: 100%;
  left: 0;
  transition: all 1s ease;
}

.OK a {
    color: #FFF !important;
    text-decoration: underline;
}

.overFlow {
  overflow: auto;
  line-height: 1em;
  width: 100%;
  height: 100px;
  /* border: #555 1px solid; */
  /* box-shadow: rgba(68, 85, 102, 1) 5px 4px 0px inset; */
  padding: 1em;
  resize: vertical;
  display: block;
}

.bgImg {
  -webkit-background-size: contain;
  background-size: contain;
  background-position: center center;
  background-repeat: no-repeat;
  /* background-color: #FFF; */
}

input, textarea, select,.selectQCM_label {
  padding: 8px;
  font-size: 1.2em;
  margin: 4px;
  border: 1px solid #e9eae5;
  border-width: 6px;
  border-bottom-width: 0;
  outline: 0px solid #10FF89;
  background-color: #FFFFFF;
  color: #7B7B7B;
  -webkit-appearance: none;
  border-radius: 0;
}

select, .selectQCM_label {
  background-image: url(img/Croissant.png);
  background-position: right 0.6em top 0.3em;
  background-repeat: no-repeat;
  background-size: 2em;
}

.selectQCM_label.used .unselectAllbt {
    /* background: #6115334f; */
    background-image: url(img/closeIcon_FAT_FFF.svg);
    background-image: url(img/close-button.png);
    background-image: url(img/pochoir_close_bt.svg);
    display: inline-block;
    position: absolute;
    right: 2em;
    top: -0.2em;
    background-size: 1.6em;
    background-repeat: no-repeat;
    background-position: center;
}

.selectQCM_label:not(.used) .unselectAllbt {
    display: none;
}

.selectQCM_label.used,select.used {
    background-color: #c91f66 !important;
}

input[type="color"] {
  width: 3em;
  height: 100%;
  padding: 0;
}

input[name="prenom"] {
  text-transform: capitalize;
}

input[name="nom"] {
  /* text-transform: uppercase; */
}

input[type="submit "] {
  background: #c91f66;
}

input:focus,
textarea:focus,
select:focus {
  padding: 8px;
  /* font-size: 1.4em; */
  margin: 4px;
  border: 6px solid #C91F66;
  border-bottom-width: 0;
  background-color: #FFFFFF;
  color: #C91F66;
}

select,
input[type='submit'] {}

input[type="submit"],
.bt {
  background-color: #C91F65 !important;
  box-shadow: rgba(0, 0, 0, 0) 0px 0px 12px;
  border-width: 0;
  padding: 0.2em 2em;
  color: #FFF !important;
  display: inline-block;
  width: 100%;
  cursor: pointer;
  transition: all .4s ease;
}

input.bt.activateProgr {
  box-shadow: rgba(0, 0, 0, 0.51) 4px 4px 0;
}

input.bt.supprProgr {
  box-shadow: rgba(0, 0, 0, 0.51) 4px 4px 0;
  width: 100%;
  margin: 0 !important;
}

.left30 .bt {
  width: 100%;
}

input[type="submit"]:hover,
.bt:hover {
  background-color: #FFF;
  color: rgba(85, 85, 85, 0.83);
  box-shadow: rgba(0, 0, 0, 0.46) 6px 6px 0;
  /* padding-top: 0.2em; */
  /* padding-bottom: 0.6em; */
  text-decoration: none;
}

input[type='file'] {
  border: #C7C7C7 4px dashed;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  max-width: 100%;
  opacity: -0.8;
  height: 100%;
  padding: 1em;
  margin: 0 !important;
  z-index: 2;
  background-color: rgba(255, 255, 255, 0.45);
  color: #C91F66;
  text-shadow: #000 0 0 12px;
  /* border-radius: 12px; */
  box-shadow: #555 -4px 4px 0 inset;
}

input[type='file']:hover {
  opacity: 1;
}

.fileinput:hover .labelFile {
  opacity: 0;
}

input[type='radio'],
input[type='checkbox'] {
  min-width: 12px !important;
  width: 12px !important;
  display: inline-block !important;
}

input[type=radio] {
  display: none !important;
}

input[type=radio] +label {
  display: inline-block;
  border: rgba(82, 102, 68, 0.2) 2px solid;
  padding: 0 12px;
  margin-right: 12px;
  line-height: 33px;
  cursor: pointer;
  box-shadow: #555 -4px 4px 0 inset;
}

input[type=radio] +label:hover {
  border: #FFF 2px solid;
}

input[type=radio]:checked +label {
  background-color: #FFF;
  color: rgb(201, 31, 102);
}

input[type=checkbox] {
  display: none !important;
}

input[type=radio]:checked +label,
input[type=checkbox]:checked + label.dontKnowLabel {
  background-color: #FFF;
  color: rgb(201, 31, 102);
  box-shadow: #555 -4px 4px 0;
}

.radioWrapper {
  /* border: #555 1px solid; */
  text-align: center;
  margin-top: 1em;
  margin-bottom: 1em;
}

select {
  text-align: center !important;
  /* padding: 8px 0 8px 20px; */
}


/* Forulaire de connexion */

.wrapperPourCePutainDeSafariDeMerde {
  width: 50%;
  max-width: 600px;
  margin: 0 auto;
  height: 100%;
  display: table;
  text-align: center;
  vertical-align: bottom;
  position: relative;
}

.connectBlock {
  padding: 24px;
  margin: 12px;
  background-color: #014760;
  color: #FFF;
  /* max-width: 500px; */
  min-width: 350px;
  width: 100%;
  height: 80%;
  margin: 0 auto;
  /* left: 50%; */
  /*transform-origin: center;
     transform: translateX(-50%);*/
  /*/left: 50%;/*/
  bottom: 0;
  position: absolute;
  border: 2px solid rgba(0, 0, 0, 0.53);
  text-align: center;
  padding-bottom: 4em;
  vertical-align: bottom;
}

.connectBlock .OK {
    top: 0;
}

form.connectForm .inputWrapper {
  width: 46%;
  margin: 1em 1%;
  display: inline-block;
  min-width: 16em;
  position: relative;
}

.inputWrapper input {
  width: 100%;
}

form.connectForm .inputWrapper:nth-child(2) {
  text-align: right;
}

.placeholder {
  text-align: left;
  display: inline-block;
  position: absolute;
  top: -1em;
  left: 1em;
}

form.connectForm .inputWrapper:nth-child(3) {
  text-align: left;
}

span.recuPassBt {
  cursor: pointer;
}

span.recuPassBt:hover {
  font-weight: bolder;
}


/* Forulaire de connexion */

.note {
  background-image: url(img/rate.png);
  height: 1em;
  width: 5em;
  font-size: 1.3em;
  background-repeat: no-repeat;
  background-position: top center;
  display: inline-block;
  background-size: cover;
  margin-top: 0.6em;
}

.note.note0 {
  background-position-Y: -0.1em;
}

.note.note1 {
  background-position-Y: -1.1em;
}

.pageRecherhceLot .noteGlobale.note.note1 {
  background-size: cover;
  /* height: 0.8em; */
  /* background-position-y: -2.3em; */
  /* background-size: 1.6rem !important; */
}

.pageRecherhceLot .noteGlobale.note {
  width: 5em;
  height: 1em;
}

.note.note2 {
  background-position-Y: -2.2em;
}

.note.note3 {
  background-position-Y: -3.4em;
}

.note.note4 {
  background-position-Y: -4.495em;
}

.boolean {
  width: 2em;
  height: 2em;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  display: inline-block;
}

.boolean.boolean0 {
  /* background-color: red; */
  background-image: url(img/false.png);
}

.boolean.boolean1 {
  /* background-color: green; */
  background-image: url(img/true.png);
}

.actable.boolean.boolean1,.actable.boolean.boolean0 {
    background-position: top center!important;
    width: 6em;
    background-size: 1.5em;
    height: 1.4em;
    margin-bottom: -0.3em;
}
.actable.boolean.boolean0 {
  background-size: 1.2em;
}
.allotement.boolean1 {
  background-image: url(img/Allotement.png);
  position: relative;
  top: -.2em;
}

span.dataDetailLot.boolean.allotement.boolean1 {
    top: initial;
    height: 3em;
    background-position: left;
}

.note.note5 {
  background-position-Y: -5.5em;
}

@media screen and (max-width:800px) {
  body {
    text-align: center;
    /*/background-color: #101010;
         font-size: 11px;/*/
  }
  input {
    width: 100%;
    margin: 4px auto;
    display: inline-block;
  }
  /* Forulaire de connexion */
  .connectBlock {
    /* border: 1px solid transparent; */
    width: 90vw;
    /* min-width: initial; */
    /* max-width: none; */
    margin: 0 auto;
    margin-bottom: 0;
    /* display: inline-block; */
    /* min-height: 50%; */
    /* position: relative !important; */
    /* border: 0; */
    /* margin: 0 auto; */
    /* transform: translateX(0px); */
    /* left: 0; */
    /* text-align: center; */
    left: 0;
    display: inline-block;
    height: auto;
    min-height: 40em;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  .wrapperPourCePutainDeSafariDeMerde {
    width: 100vw;
    text-align: center;
  }
  .connectBlock * {
    /* max-width: 100%; */
    /* min-width: initial; */
    /* display: inline-block; */
    /* margin: 0; */
    /* position: relative; */
    /* left: initial; */
    /* right: initial; */
    /* top: initial; */
    /* bottom: initial; */
    height: auto;
  }
  form.connectForm {
    min-width: initial;
    width: 100%;
    max-width: initial;
    margin: 0;
    position: relative;
    height: auto;
  }
  .connectBlock input {}
  /* Forulaire de connexion */
}

body {
  font-size: 12px;
}

@media screen and (max-width:1600px) {
  body {
    /* font-size: 14px; */
  }
}

@media screen and (max-width:1400px) {
  body {
    font-size: 12px;
  }
}

@media screen and (max-width:800px) {
  html {
    font-size: 10px;
  }

  ::-webkit-scrollbar,::-webkit-scrollbar-track,
::-webkit-scrollbar-thumb 
{
/*   display:none !important; */
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 2px rgba(10, 70, 94, 0.37);
  border-radius: 0;
  /* background-color: rgba(80, 80, 80, 0.26); */
}

::-webkit-scrollbar-thumb {
  border-radius: 19px;
  background-color: rgba(42, 144, 158, 0.79);
  -webkit-box-shadow: 0px 4px 6px rgb(26, 97, 121);
}
}
/**/