@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: #5823EE;
  text-decoration: underline;
}
h1 a{
  font-size: 0.8em;
}


/*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*/
/* ID */
/*Animations*/
/*Media query*/
/*tablette*/
@media(min-width:768px){
  h1 a{
    font-size: 2em;
  }
}

/*petit desktop*/
@media(min-width:992px){
  body{
    height: 100vh;
    overflow: hidden;
  }
  h5{
    font-family: 'subjectivity-medium';
    font-size: 1em;
    color: #5823EE;
  }

  .navbar {
    padding: 0;}

  .circle{
    background-color: #D9D9F6;
    border-radius: 50%;
    height: 80px;
    width: 80px;
  }
  .cache{opacity: 0;
    transition: 0.2s;
}
  .showup{opacity: 1;}

  #linkedln{
    padding-top: 2.1em;
    padding-left: 0.7em;
  }
  #cv{
    padding-top: 2.1em;
    padding-left: 1.7em;
  }
}