// Reset
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 12pt;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}
body {
  line-height: 1;
  -webkit-touch-callout: none;
    -webkit-user-select: none;
     -khtml-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  -webkit-tap-highlight-color: transparent;
}

ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

// Variables
$noir: #000;
$blanc: #fff;
$gris_fonce: #2d2d2d;
$gris_clair: #f5f5f5;
$violet: #472669;
$voilet_fonce: #3e215c;
$vert: #ade1b6;
$vert_fonce: #96cfae;

// bases communes
html{
  padding: 0;
  margin: 0;
  background-color: $blanc;
  font-size: 100%;
}
body{
  font-size: 2.5rem;
  text-size-adjust: none;
  -moz-text-size-adjust: none;
  -webkit-text-size-adjust: none;
  -ms-text-size-adjust: none;
}
body, div, ul, li, p{
  padding: 0;
  margin: 0;
  position: relative;
}
.appli{
  // height: 100%;
  text-align: center;
  font-family: 'Montserrat';
  font-weight: 600;
  color: $gris_fonce;
  h1{
    /*font-size: 3.125rem;*/
    font-size: 3.2rem;
    line-height: 60px;
  }
  a{
    text-decoration: none;
  }
  ul{
    li{
      list-style: none;
    }
  }
  .title{
    width: 100%;
  }
  .content{
    padding: 30px 40px;
  }
}
.clear{
  clear: both;
}
// Swipe
.swipe {
  overflow: hidden;
  visibility: hidden;
  position: relative;
  .swipe-wrap {
    overflow: hidden;
    position: relative;
    .element {
      float:left;
      width:100%;
      position: relative;
    }
  }
}
// Reset
@media (max-width: 640px) {
  * {
    box-sizing: border-box;
  }

  /* passer body (et tous les éléments de largeur fixe) en largeur automatique */

  body {
    width: auto;
    margin: 0;
    padding: 0;
  }

  /* fixer une largeur maximale de 100% aux éléments potentiellement problématiques */

  img,
  table,
  td,
  blockquote,
  code,
  pre,
  textarea,
  input,
  iframe,
  object,
  embed,
  video {
    max-width: 100%;
  }

  /* conserver le ratio des images */

  img {
    height: auto;
  }
}