@charset "UTF-8";
/* CSS by Nathan Vinaimont | whoIam.be
   Feuille principale du site : structure + thème nuit (seul thème chargé).
   Compiler depuis la racine : sass assets/css/styles.scss assets/css/styles.css */
/*----------couleurs----------*/
:root {
  --topmain: #292933;
  --mainaccent: #44445b;
  --mainaccent2: #343442;
  --accent: #00abc5;
  --accent2: #7c7cb2;
  --accentCyan: #8ce4f1;
  --accentRed: #ef787a;
  --rulesRed: #f7a8a9;
  --blanc: #fff;
  --gris1: #ccc;
  --gris2: #aaa;
  --gris3: #777;
}

/*----------structure----------*/
/*----------typos----------*/
@font-face {
  font-family: "building";
  src: url("../fonts/building-webfont.eot");
  src: url("../fonts/building-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/building-webfont.woff2") format("woff2"), url("../fonts/building-webfont.woff") format("woff"), url("../fonts/building-webfont.ttf") format("truetype"), url("../fonts/building-webfont.svg#buildingcondensed_medium") format("svg");
  font-weight: medium;
  font-style: normal;
}
@font-face {
  font-family: "airamerica";
  src: url("../fonts/airamerica-webfont.eot");
  src: url("../fonts/airamerica-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/airamerica-webfont.woff2") format("woff2"), url("../fonts/airamerica-webfont.woff") format("woff"), url("../fonts/airamerica-webfont.ttf") format("truetype"), url("../fonts/airamerica-webfont.svg#airamericacondensed_medium") format("svg");
  font-weight: medium;
  font-style: normal;
}
@font-face {
  font-family: "kelson sans";
  src: url("../fonts/kelson_sans_bold-webfont.eot");
  src: url("../fonts/kelson_sans_bold-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/kelson_sans_bold-webfont.woff2") format("woff2"), url("../fonts/kelson_sans_bold-webfont.woff") format("woff"), url("../fonts/kelson_sans_bold-webfont.ttf") format("truetype"), url("../fonts/kelson_sans_bold-webfont.svg#kelson_sansbold") format("svg");
  font-weight: bold;
  font-style: normal;
}
@font-face {
  font-family: "kelson sans";
  src: url("../fonts/kelson_sans_light-webfont.eot");
  src: url("../fonts/kelson_sans_light-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/kelson_sans_light-webfont.woff2") format("woff2"), url("../fonts/kelson_sans_light-webfont.woff") format("woff"), url("../fonts/kelson_sans_light-webfont.ttf") format("truetype"), url("../fonts/kelson_sans_light-webfont.svg#kelson_sanslight") format("svg");
  font-weight: light;
  font-style: normal;
}
@font-face {
  font-family: "kelson sans";
  src: url("../fonts/kelson_sans_regular-webfont.eot");
  src: url("../fonts/kelson_sans_regular-webfont.eot?#iefix") format("embedded-opentype"), url("../fonts/kelson_sans_regular-webfont.woff2") format("woff2"), url("../fonts/kelson_sans_regular-webfont.woff") format("woff"), url("../fonts/kelson_sans_regular-webfont.ttf") format("truetype"), url("../fonts/kelson_sans_regular-webfont.svg#kelson_sansregular") format("svg");
  font-weight: regular;
  font-style: normal;
}
/*----------rest----------*/
* {
  padding: 0;
  border: 0;
  margin: 0;
  outline: 0;
  text-decoration: none;
  list-style: none;
  quotes: none;
  font-weight: lighter;
  font-family: "kelson sans", futura, "Times New Roman", Times, serif;
  font-size: 1em;
}

html {
  min-height: 100%;
}

body {
  width: 100%;
  font-size: 1em;
  font-weight: normal;
  font-style: normal;
}

H1 {
  width: 60%;
  margin: auto;
  padding: 0 10px;
  font: 3.5em airamerica;
  background: linear-gradient(135deg, #00abc5 0%, #7c7cb2 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

H2 {
  width: 58%;
  margin: auto;
  padding: 0 10px;
  font: 1.3em airamerica;
}

.middle {
  height: 50vh;
  display: grid;
  grid-template-rows: 1fr 4fr 2fr;
}

.indeed {
  display: inline-grid;
  width: 100%;
  grid-template-columns: 1fr 1fr;
}

.button, .button-red {
  margin: 20px;
  padding: 20px;
  border-radius: 15px;
  text-align: center;
  margin: auto;
  place-items: center;
}

.myH {
  font: 4em airamerica;
  text-align: left;
  transform: translate(-180px, 10px) rotate(-10deg);
  position: absolute;
}

.myH2 {
  font: 4em airamerica;
  text-align: left;
  transform: translate(120px, 20px) rotate(-10deg);
  position: absolute;
}

.tinyBody {
  width: 50%;
  margin: auto;
  float: center;
}

.tinyBody b {
  font-weight: bold;
  font-size: 1.1em;
}

.tinyBody2 {
  width: 50%;
  margin: auto;
  float: center;
  text-align: center;
}

.bigMenu {
  width: 100%;
}

.menu {
  width: 50%;
  margin: auto;
  font-size: 1.7em;
  text-align: right;
}

.solde2019 {
  width: 50%;
  margin: auto;
  float: center;
  text-align: center;
}

.solde2019b {
  width: 100%;
  margin: auto;
  text-align: center;
}

.bigRules {
  width: 100%;
  clear: both;
}

.bigRules2 {
  width: 100%;
  clear: both;
}

.log1 {
  font: 1em airamerica;
  opacity: 1;
}

.log2 {
  font: 1em airamerica;
  opacity: 0.85;
}

.log3 {
  font: 1em airamerica;
  opacity: 0.7;
}

.log4 {
  font: 1em airamerica;
  opacity: 0.55;
}

.log5 {
  font: 1em airamerica;
  opacity: 0.4;
}

.log6 {
  font: 1em airamerica;
  opacity: 0.25;
}

.log7 {
  font: 1em airamerica;
  opacity: 0.15;
}

.log8 {
  font: 1em airamerica;
  opacity: 0.08;
}

.link {
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
}

.link2 {
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
}

.link:hover {
  letter-spacing: 0.05em;
}

.link2:hover {
  letter-spacing: 0.05em;
}

.rules {
  width: 50%;
  margin: auto;
  font-weight: normal;
  text-align: center;
  position: relative;
}

.rules b {
  font-weight: bold;
  position: relative;
}

H3 {
  width: 100%;
  margin: auto;
  font-family: "kelson sans";
  text-align: center;
  font-size: 1.4em;
}

H4 {
  width: 100%;
  margin: auto;
  font-family: "kelson sans";
  text-align: center;
  position: relative;
}

H5 {
  width: 90%;
  font: 20em airamerica;
  text-align: center;
  transform: translate(50px, 80px) rotate(-10deg);
  position: absolute;
  z-index: -1000;
}

table {
  border-collapse: collapse;
  margin: auto;
  font-size: 1em;
}

.trhoraire {
  border-collapse: collapse;
  margin: auto;
}

td {
  width: 125px;
  text-align: center;
}

.tdipad {
  width: 225px;
  text-align: center;
}

.tdhoraire {
  width: 160px;
  text-align: center;
}

tr {
  border-bottom: 1px solid #bbb;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
}

tr:hover {
  font-size: 1.15em;
  font-weight: bold;
}

.trhoraire {
  font-size: 1em;
}

.trhoraire:hover {
  font-size: 1.35em;
  font-weight: bold;
}

.trhead {
  border-bottom: 0;
}

.trhead:hover {
  font-size: 1em;
  font-weight: normal;
}

.trfoot {
  border-bottom: 0;
}

.trfoot:hover {
  font-size: 1em;
  font-weight: normal;
}

.bigNum {
  width: 100%;
}

.num {
  width: 50%;
  margin: auto;
  font: 2em building;
  text-align: center;
}

.num:hover {
  animation: shake 0.08s ease-in-out infinite;
}

.strike {
  text-decoration: line-through;
}

.callme {
  width: 100px;
  height: 100px;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  animation: shake2 0.13s ease-in-out infinite;
  right: 0;
  position: absolute;
}

.center {
  display: grid;
  place-items: center;
  height: 100px;
}

#tbiphone, #tbgj, #tbga, #tbgs, #tbgn, #tbhp, #tbhm {
  width: auto;
  margin: 10px auto 10px;
  text-align: center;
  font-size: 1.5em;
}

#iphone, #gj, #ga, #gs, #gn, #hp, #hm {
  width: 130px;
  margin: 20px auto 40px;
  padding: 10px;
  border-radius: 15px;
  text-align: center;
  cursor: pointer;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
}

#iphone:hover, #gj:hover, #ga:hover, #gs:hover, #gn:hover, #hp:hover, #hm:hover {
  letter-spacing: 0.1em;
}

#tableiphone, #tablegj, #tablega, #tablegs, #tablegn, #tablehp, #tablehm {
  height: 148px;
  overflow: hidden;
  -webkit-transition-duration: 1s;
  transition-duration: 1s;
}

#tableiphone.open, #tablegj.open, #tablega.open, #tablegs.open, #tablegn.open, #tablehp.open, #tablehm.open {
  height: auto;
}

#myalert {
  padding: 20px;
  width: 100vw;
  height: 100vh;
  color: white;
  display: none;
  z-index: 111;
  position: fixed;
  top: 0;
  left: 0;
  -webkit-transition-duration: 1s;
  transition-duration: 1s;
}

#myalert.show {
  display: block;
  place-items: center;
}

#myalert2 {
  max-width: 40vw;
  min-height: 30vh;
  max-height: auto;
  padding: 10vh 10vw;
  border-radius: 15px;
  color: white;
  display: none;
  z-index: 111;
  position: fixed;
  top: 20vh;
  left: 20vw;
  transition: 1s;
}

#myalert2.show {
  display: block;
  place-items: center;
}

.closebtn {
  margin: -30px -60px 0 0;
  color: white;
  font-weight: bold;
  float: right;
  font-size: 2em;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

.closebtn:hover {
  color: black;
}

.insta {
  margin: 20px 0;
}

.faq-question {
  font-weight: bold;
  margin-top: 20px;
  cursor: pointer;
  padding: 10px;
  position: relative;
}

.faq-question:after {
  content: "+";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
}

.faq-answer {
  margin-top: 10px;
  padding-left: 20px;
  padding: 10px;
  display: none;
}

#beta-notice {
  background-color: #ffd700;
  padding: 10px;
  text-align: center;
}

::-webkit-scrollbar {
  display: none;
}

@keyframes shake {
  0% {
    transform: rotate(0deg);
  }
  33% {
    transform: rotate(-0.8deg);
  }
  66% {
    transform: rotate(0.8deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
@keyframes shake2 {
  0% {
    transform: rotate(0deg);
  }
  33% {
    transform: rotate(-5deg);
  }
  66% {
    transform: rotate(5deg);
  }
  100% {
    transform: rotate(0deg);
  }
}
.lan {
  margin: auto;
  font: 0.8em "kelson sans";
  text-align: center;
}

.lanLeft {
  margin: auto;
  font: 0.8em "kelson sans";
  text-align: left;
}

.serviceleft {
  width: 17%;
  float: left;
  clear: both;
}

.serviceright {
  width: 83%;
  float: right;
}

.services {
  max-width: 49%;
  height: auto;
  width: auto;
}

.copyright {
  width: 50%;
  font: 1.3em "kelson sans" caption;
  margin: auto;
  text-align: center;
  clear: both;
}

.space {
  display: inline-block;
}

.copyright a {
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
}

.copyright a:hover {
  letter-spacing: 0.1em;
}

.ph {
  margin: auto;
  font: 2.8em airamerica;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
}

.ph:hover {
  letter-spacing: 0.06em;
}

@media only screen and (max-width: 1000px) {
  H1 {
    width: 90%;
    font-size: 5em;
  }
  H2 {
    width: 90%;
    font-size: 2.5em;
  }
  H5 {
    width: 90%;
    font-size: 15em;
    transform: translate(20px, 200px) rotate(-10deg);
  }
  .myH {
    transform: translate(-80px, 10px) rotate(-10deg);
  }
  .myH2 {
    transform: translate(10px, 10px) rotate(-10deg);
  }
  .tinyBody {
    width: 90%;
    font-size: 2.2em;
  }
  .services {
    max-width: 99%;
    height: auto;
    width: auto;
  }
  .menu {
    width: 80%;
    font-size: 2.5em;
  }
  .header {
    width: 80%;
  }
  .phone {
    width: 80%;
  }
  .rules {
    width: 80%;
    font-size: 2.2em;
  }
  table {
    width: 90%;
    font-size: 1.8em;
  }
  .copyright {
    width: 100%;
    font-size: 1.8em;
  }
  #tableiphone, #tablegj, #tablega, #tablegs, #tablegn, #tablehp, #tablehm {
    height: 400px;
  }
  #iphone, #gj, #ga, #gs, #gn, #hp, #hm {
    font-size: 0.75em;
  }
  #myalert2.show {
    font-size: 0.75em;
  }
}
@media only screen and (max-width: 700px) {
  H1 {
    width: 95%;
    font-size: 3em;
  }
  H2 {
    width: 95%;
    font-size: 1.6em;
  }
  .tinyBody {
    width: 95%;
    font-size: 1.1em;
  }
  .menu {
    width: 95%;
    font-size: 1.3em;
  }
  .header {
    width: 95%;
  }
  .phone {
    width: 95%;
  }
  .rules {
    width: 95%;
    font-size: 1.1em;
  }
  table {
    width: 95%;
    font-size: 1em;
  }
  .copyright {
    width: 100%;
    font-size: 1.1em;
  }
}
/*----------thème nuit----------*/
html {
  background-color: #0d1117;
}

body {
  color: #aaa;
  background-color: #0d1117;
}

H1 {
  background: linear-gradient(135deg, #00abc5 0%, #7c7cb2 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

H2 {
  color: #f7a8a9;
}

.button {
  border: 2px solid #00abc5;
  background-color: #00abc5;
  color: #292933;
}

.button-red {
  border: 2px solid #f7a8a9;
  background-color: #f7a8a9;
  color: #292933;
}

.button a, .button-red a {
  color: #292933;
}

.button a:hover, .button-red a:hover {
  color: #292933;
}

.myH {
  color: #ef787a;
}

.myH2 {
  color: #f7a8a9;
}

.bigMenu {
  background: linear-gradient(135deg, #00abc5 0%, #7c7cb2 100%);
}

.menu {
  color: #0d1117;
}

.menu .link {
  color: #0d1117;
}

.menu .link:hover {
  color: #292933;
}

.bigRules {
  background: linear-gradient(135deg, #f7a8a9 0%, #7c7cb2 100%);
}

.bigRules2 {
  background-color: #f2373a;
}

.log1 {
  color: #00abc5;
  opacity: 1;
}

.log2 {
  color: #00abc5;
  opacity: 0.85;
}

.log3 {
  color: #00abc5;
  opacity: 0.7;
}

.log4 {
  color: #00abc5;
  opacity: 0.55;
}

.log5 {
  color: #00abc5;
  opacity: 0.4;
}

.log6 {
  color: #00abc5;
  opacity: 0.25;
}

.log7 {
  color: #00abc5;
  opacity: 0.15;
}

.log8 {
  color: #00abc5;
  opacity: 0.08;
}

.link {
  color: #00abc5;
}

.link:hover {
  color: #067383;
}

.rules {
  color: #fff;
}

/* Sur le bandeau dégradé, les liens en sombre comme dans le menu. */
.bigRules .link {
  color: #0d1117;
}

.bigRules .link:hover {
  color: #292933;
}

H3 {
  color: RED;
}

H4 {
  color: #eebdbe;
}

H5 {
  color: #30333e;
}

.tinyBody {
  background: linear-gradient(135deg, rgba(0, 171, 197, 0.08) 0%, rgba(124, 124, 178, 0.08) 100%), #0a0f14;
  border: 1px solid rgba(0, 183, 198, 0.15);
  border-radius: 18px;
  padding: 2rem;
  margin-bottom: 2rem;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

.tinyBody b {
  color: #ccc;
}

table {
  color: #aaa;
}

table:hover {
  color: #ccc;
}

.trhoraire {
  color: #777;
}

.tdouvert {
  background-color: #8ce4f1;
}

.tdfermé {
  background-color: #f7a8a9;
  color: #fff;
}

tr {
  border-bottom: 1px solid #bbb;
}

tr:hover {
  color: #00abc5;
}

.trhead {
  color: #ccc;
}

.trhead:hover {
  color: #ccc;
}

.trfoot {
  color: #ccc;
}

.trfoot:hover {
  color: #ccc;
}

.bigNum {
  background-color: #8ce4f1;
}

#myalert {
  background-color: #292933;
  opacity: 0.8;
}

#myalert2 {
  background-color: #8ce4f1;
}

#tbiphone, #tbgj, #tbga, #tbgs, #tbgn, #tbhp, #tbhm {
  background: linear-gradient(135deg, #00abc5 0%, #7c7cb2 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

#iphone, #gj, #ga, #gs, #gn, #hp, #hm {
  background: #343442;
  color: #7c7cb2;
}

.callme {
  background: #8ce4f1;
}

.bi2 {
  fill: #00abc5;
}

.lan {
  background: linear-gradient(135deg, #00abc5 0%, #7c7cb2 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.lanLeft {
  background: linear-gradient(135deg, #00abc5 0%, #7c7cb2 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.copyright {
  color: #ccc;
}

.copyright a {
  color: #aaa;
}

.ph {
  background: linear-gradient(135deg, #00abc5 0%, #7c7cb2 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.ph:hover {
  background: linear-gradient(135deg, #00abc5 0%, #7c7cb2 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.bi {
  fill: #00abc5;
}

.faq-question {
  background: linear-gradient(135deg, #00abc5 0%, #7c7cb2 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.faq-answer {
  background-color: rgba(140, 228, 241, 0.8);
  color: #44445b;
}

.faq-answer b {
  color: #067383;
}

.faq-answer a {
  color: #067383;
}

.faq-answer a:hover {
  color: #067383;
}

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