body{
  padding: 0;
  margin: 0;
}
nav{
  padding: 0;
  margin: 0;
  background: rgb(0, 0, 0);
  display: flex;
  justify-content: space-around;
  height: 50px;
  align-items: center;
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  transition: 1s;
}
nav:hover {
  height: 100px;
  transition:1s;
  background: rgb(128, 128, 128);

}


.links{
  color: rgb(255, 255, 255);
  text-decoration: none;
  font-size: 25px;
  margin: 25px; 
  font-family: 'Carter One', cursive;
  transition: 1s;

}

.links:hover{
  color: rgb(248, 122, 122);
  background-color: rgba(255, 255, 255, 0.007);
  transition: 0.5s;
  text-decoration: underline;
}

.navbar-brand {
  text-decoration: none;
  color: yellow;
}


.NSIcestquoi {
  border-top: 2px solid rgb(255, 0, 0);
  border-bottom: 2px solid rgb(255, 0, 0);
  font-size: 65px; 
  font-weight: 900;
  padding: 25px;
  margin-left: 10%;
  margin-right: 10%;
  text-align: center;
  color: #ff0000;
  background-color: rgba(0, 0, 0, 0.726);
}

.linear-gradient {
  width: auto;
  height: auto;
  background: linear-gradient(rgba(0, 0, 0, 0.856),rgb(255, 249, 249),rgba(0, 0, 0, 0.856));
}
@font-face {  
  font-family: "Castoro";
  src: url("../ttf/Castoro-Regular.ttf");
}


/* différents paragraphe*/
.paragraphe1 {
  border-top: 3px solid rgb(0, 0, 0);
  background-image: url("../img/NYK.jpg");
  border-bottom: 1px solid black;

  /* hauteur minimum de l'image */
  min-height: 700px;

  /* effet parallax */
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  opacity:  100%;
  background-position: center;
  transition: 1s;
}


.paragraphe2 {
  border-top: 5px solid rgb(0, 0, 0);
  background-image: url("../img/1338362.png");
  border-bottom: 1px solid black;

  /* hauteur minimum de l'image */
  min-height: 700px;

  /* effet parallax */
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  opacity:  100%;
  background-position: center;
}

.paragraphe3 {
  border-top: 1px solid black;
  background: linear-gradient(rgb(0, 0, 0),rgb(255, 255, 255), red);
  border-bottom: 1px solid black;
  font-family: 'Castoro-regular', serif;
}
/* différents paragraphe*/



.pattern1 {
  background-color: #ff0000;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 800 800'%3E%3Cg %3E%3Ccircle fill='%23ff0000' cx='400' cy='400' r='600'/%3E%3Ccircle fill='%23c81708' cx='400' cy='400' r='500'/%3E%3Ccircle fill='%23931b0b' cx='400' cy='400' r='400'/%3E%3Ccircle fill='%2362190c' cx='400' cy='400' r='300'/%3E%3Ccircle fill='%23341307' cx='400' cy='400' r='200'/%3E%3Ccircle fill='%23000000' cx='400' cy='400' r='100'/%3E%3C/g%3E%3C/svg%3E");
  background-attachment: fixed;
  background-size: cover;
  min-height: 750px;
  justify-content: center;
}


.NSIcestquoi2 {
  border: 2px solid;
  border-color: rgb(234, 0, 255) rgb(234, 0, 255);
  font-size: 30px; 
  font-weight: 900;
  padding: 25px;
  margin-left: 5%;
  margin-right: 5%;
  text-align: center;
  color: #ffffff;
  background-color: rgba(0, 0, 0, 0.596);
  transition: 1s;
}
.NSIcestquoi2:hover {
  background-color: rgba(0, 0, 0, 0.89);
  transition: 2s;
}

.NSIcestquoi2:hover .gras1 {
  color: red;
  transition: 2s;
}

.NSIcestquoi3 {
  border: 2px solid rgb(255, 102, 0);
  font-size: 30px; 
  font-weight: bolder ;
  padding: 25px;
  margin-left: 5%;
  margin-right: 5%;
  text-align: center;
  color: #ffffff;
  background-color: rgba(0, 0, 0, 0.171);
  transition: 1s;
}

.NSIcestquoi3:hover {
  background-color: rgba(0, 0, 0, 0.856);
  transition: 2s;
  border: 2px solid red;
}

.NSIcestquoi4 {
  border: 2px solid rgb(255, 102, 0);
  font-size: 25px; 
  font-weight: bolder ;
  padding: 25px;
  margin-left: 5%;
  margin-right: 5%;
  text-align: center;
  color: #ffffff;
  background-color: rgb(0, 0, 0);
}






.parallax1 {
  /* chemin de l'image */
  background-image: url("../img/coding.jpg");

  /* hauteur minimum de l'image */
  min-height: 500px;

  /* effet parallax */
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
  opacity: 90%;
  background-position: center;
}

.scrolltop{
  font-size: 20px; 
  font-weight: bolder ;
  padding: 25px;
  text-align: center;
  color: #ffffff;
  background-color: black;
  transition: 1s;
}
.button1{
  text-align: center;
  background-color: black;
}

.scrolltop:hover {
  transition: 1s;
  background-color: grey;
}