@import url('https://fonts.googleapis.com/css2?family=Dancing+Script:wght@400..700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');
body{
  user-select: none;
}
h1,h2,h3,h4 {
  font-family: "Dancing Script", cursive;
  text-align: center;
  color: white;
  font-weight: 500;
  font-size: 50px;
  transition: color 0.4s ease-in-out;
}
.navbar{
  height: 10vh;
  border-bottom: 1px solid white;
  position:sticky;
  top: 10px;
  z-index: 999;
  background: transparent;
}
.navbar>img{
  position: absolute;
  right: 12px;
  top: 23px;
  width: 20px;
}
.video-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  z-index: -1;
}

.video-container>#video-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-height: 100%;
  min-width: 100%;
  width: auto;
  height: auto;
  z-index: -1;
}

/* // stage one  */

.stage {
  width: 600px;
  height: 600px;
  position: relative;
  margin-top: 200px;
}

.stage,
.ring,
.stage .img {
  /* overflow:hidden; */
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  user-select: none;
}

.stage .container,
.stage .ring,
.stage .img,
.stage svg {
  position: absolute;
}

.stage .container {
  perspective: 2000px;
  width: 300px;
  height: 400px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

/* -------------second gallery-------------- */

.heading2,.heading3,.heading4,.heading5 {
  margin-top: 500px;
}
.stage6{
  height: 100vh;
  margin-top: 0px;
}
.heading6{
  margin-top: 500px;
  font-family: "Ubuntu", sans-serif;
}
.stage6>.container{
  width: 81%;
  height: 100%;
  margin-top: 10px;
  margin-bottom: 200px;
  padding-bottom: 200px;
  padding: 20px;
  align-items: center;
  font-size: 18px;
  line-height: 25px;
  display: flex;
  flex-direction: column;
  background-color:azure;
  border-radius: 8px;
  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}

.stage6>.container .center-text{
  font-weight: bold;
}
.stage6 .text-copyright{
  text-decoration: underline;
  padding: 7px 0;
}
.stage6 .text-bototm{
  padding: 10px 0;
  text-transform: uppercase;
  text-align: center;
  font-size: 15px;

}
.stage6 .container img{
  width: 340px;
  height: 300px;
  object-fit: contain;
}
