@font-face {
  font-family: GravityFont;
  src: url(./MonumentExtended-Regular.otf);
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: GravityFont;
}
html,
body {
  height: 100%;
  width: 100%;
  background-color: black;
  color: #fff;
  transition: all cubic-bezier(0.19, 1, 0.22, 1) 1s;
}

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

.d-flex {
  display: flex;
  align-items: center;
  justify-content: center;
}

.d-flex-c {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}

.loader {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
  width: 100%;
  height: 100vh;
  gap: 2vw;
  justify-content: start;
  background-color: #000;
}

.text-loader {
  font-size: 2rem;
  opacity: 0;
}

.text-23 {
  margin-left: 10vw;
}

.text-63 {
  margin-left: 15vw;
}

.text-97 {
  margin-left: 12vw;
}
.text-10 {
  margin-left: 2vw;
}

/* -------Loading-part-end */

/* ---- nav part -start--- */
.fixed-p {
  position: fixed;
  width: 100%;
  height: 100vh;
  /* background-color: orange; */
}

.flex-p-content {
  transition: all cubic-bezier(0.19, 1, 0.22, 1) 1s;
}

.cntr-p,
.cntr-p2 {
  text-align: center;
  z-index: 999;
  font-size: 1.2rem;
}

.nav {
  margin-top: 3vh;
  gap: 2vw;
}

.nav a {
  text-decoration: underline;
  z-index: 999;
  font-size: 1.2rem;
  color: #fff;
}

.section {
  width: 100%;
  height: 100vh;
  font-size: 3rem;
}

.heading-text {
  font-size: 14rem;
}

#one-text {
  position: absolute;
  top: 120%;
}

.section-img {
  position: relative;
  margin-left: 35%;
  width: 30%;
  height: 100vh;
  /* background-image: url(https://.unsplash.com/photo-1718573577441-61fb326c1517?q=80&w=1974&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D); */
  background-attachment: fixed;
  background-position: center;
  background-size: 42%;
  background-repeat: no-repeat;
  z-index: 99999;
  cursor: pointer;
}

#img-one {
  background-image: url(./one.jpg);
}

#img-two {
  background-image: url(./two.jpg);
}

#img-three {
  background-image: url(./three.jpg);
}
#img-four {
  background-image: url(./four.jpg);
}

#img-five {
  background-image: url(./five.jpg);
}
#img-six {
  background-image: url(./six.jpg);
}
#img-seven {
  background-image: url(./seven.jpg);
}