* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

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

#paralax{



}








#paralax section{

height: 180px;

margin-right: 2%;
margin-left: 2%;
width: 96%;
margin-bottom: 0px;
margin-top: 0px;
animation-name: magic;
animation-duration:1.2s;


}



@keyframes magic {
    from {
       
        height: 180px;
     
    }
    to {
       
        height:150px;
  
    }


}

.title h2{

 background-image: url("../images/phare.jpg")!important;
 border-radius: 10px;
}

#container, #works, #page, #about {
  height: 100vh;
  width: 100%;
  position: relative;
}

#container .back-img {
  width: 100%;
  height: 100%;
  background-image: url("../images/v.jpg")!important;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  z-index: 1;
}

#container .nav-bar {
  position: fixed;
  z-index: 3;
  top: 0;
  left: 0;
  width: 100%;
  margin: 0 auto;
}

.nav-bar ul {
  padding: 20px;
  text-align: center;

}

.nav-bar ul li {
  display: inline-block;
  padding: 0 14px;
  font-family: helvetica;
  font-size: 1.7rem;

}

.nav-bar ul li a {
  text-transform: uppercase;
  text-decoration: none;
  color: black;
  background-color: red;

}

.nav-bar ul li:hover a {
  color: white;
}

#works .second-img {
  width: 100%;
  height: 100%;
  background-image: url("../images/pc.png");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  z-index: 3;
}

#page .third-img {
  width: 100%;
  height: 100%;
  background-image: url("../images/carte2.jpg");
  background-repeat:repeat;
  background-position: center center;


  position: absolute;
  z-index: 4;
}

#about .fourth-img {
  width: 100%;
  height: 100%;
  background-image: url("../images/pc1.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  position: absolute;
  z-index: 5;
}

#container .title, #works .title, #page .title, #about .title {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
}
#container .title h2, #works .title h2, #page .title h2, #about .title h2 {
  color: white;
  font-family: helvetica;
  font-weight: 700;
  font-size: 70px;
  letter-spacing: 2px;
}

.back-img, .second-img, .third-img, .fourth-img {
  background-attachment: fixed;
}