@import url(../fonts/stylesheet.css);
@import url(normalize.css);
@import url(fontawesome/css/all.min.css);

/*
Off-white #FFFEF4
Dark grey #202123
Depp violet #5823EE
Medium violet #9F9DF0
Light violet #D9D9F6
Bright yellow #FFFF33
Pastel yellow #FFFF99
*/


* {
  box-sizing: border-box;
  font-size: 15px;
}

img{max-width:100%;height:auto}

body {
  font-family: 'subjectivity-regular';
  background-color: #FFFEF4;
  color: #202123;
}
  h1{
    font-family: 'subjectivity-Super';
    color: #202123;
    font-size: 6.2em;
}
p{
  font-size: 1.2em;
}

/*Navbar*/
nav div {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

nav div a img {
  width: 80%;
}

nav button {
  padding: 0 !important;
  margin-right: 1.3em;
}

i {
  font-size: 2em;
}

.navbar{
  background-color: #FFFEF4 !important;
}

.nav-link {
  font-family: 'subjectivity-Super';
  color: #FFFEF4;
  font-size: 4.3em;
  text-align: center;
}
.nav-link:hover{
  color:#5823EE;
}

.navbar-toggler:focus{
  box-shadow: 0 0 0 0;
}

#navbarNav {
  background-color: #9F9DF0;
}

        /*Classes*/
/*Classes génériques*/
.bold{
  font-family: 'subjectivity-bold';
}
.super{
  font-family: 'subjectivity-Super';
}
.medium{
  font-family: 'subjectivity-medium'
}
.my-8{
  margin: 5em auto;
}

/*Classes spécifiques*/
.reaction1{
  width: 35%;
  rotate: -10deg;
}
.reaction2{
  width: 45%;
}



        /*ID*/
#faq-titre img{
  width: 35%;
  top: -1em;
  right: -2em;
  transform: scaleX(-1);
}

#faq-questions a img{
  width: 80%;
}
#faq-questions a img .w100{
    width: 100% !important;
}
/*Questions*/
#question3{
  height: 15em;
}



      /*Media query*/
/*tablette*/
@media(min-width:768px){
  h1{
    font-size: 8em;
}
  p{
    font-size: 1.5em;
}

/*Classes spécifiques*/
.reaction1{
  width: 20%;
  margin-left: 20px;
}
.reaction2{
  rotate: 15deg;
  width: 100%;
}
.reaction2 img{
  width: 20%;
}

  /*ID*/
#faq-titre img{
width: 25%;
right: 4em;
}
#faq-questions a img{
width: 50%;
}
#faq-questions a img.w80{
width: 60% !important;
}
/*Questions*/
#question1{
height: 15em;
}
#question5{
  height: 20em;
}
#question6 a img{
  width: 40%;
}
#question7{
  height: 5.5em;
}
#question7 a img.w80{
  width: 70% !important;
}
}

@media(min-width:992px){
  body{
    overflow-x: hidden;
  }

  /*Class spécifiques*/
  .reaction1{
    margin-top: 5em;
    margin-left: 4em;
  }

  /*ID*/
#faq-titre img{
width: 18%;
right: 6em;
}
#faq-questions a img{
width: 40%;
}
#faq-questions a img.w80{
width: 50% !important;
}
/*Questions*/
#question4 img{
  margin-right: 3em;
}
#question5{
  height: 15em;
}
#question6 img{
  margin-right: 1em;
}
#question6 a img{
  width: 35%;
}
#question7 a img.w80{
  width: 65% !important;
}
}

@media(min-width:1200px){
  #faq-questions a img{
  width: 35%;
}
#faq-questions a img.w80{
width: 45% !important;
}
#question6 a img{
  width: 30%;
}
#question7 a img.w80{
  width: 60% !important;
}
}