@font-face {
    font-family: AcornBold ;
    src: url(fonts/Acorn-Bold.otf);
}
@font-face {
    font-family: GTLight ;
    src: url(fonts/GT\ light.otf);
}

@font-face {
  font-family: AcornLight;
  src: url(fonts/Acorn-ExtraLight.otf);
}

html {
    height: 100%;
    width: 198vb;
}

body {
    height: 100%;
    width: 198vb;
    background-size: cover;
    background-attachment: fixed;
        background: linear-gradient(300deg,#000000,rgb(0, 12, 50));
        background-size: 120% 120%;
        animation: gradient-animation 12s ease infinite;
      
      @keyframes gradient-animation {
        0% {
          background-position: 0% 50%;
        }
        50% {
          background-position: 100% 50%;
        }
        100% {
          background-position: 0% 50%;
        }
      }
    }


h1 {
    position: relative;
    font-family: AcornBold;
    text-align: center;
    color:rgb(95, 132, 255);
    font-size: 100px;
    margin-top: 0px;
    padding-top: 100px;
 
}

p {
  margin-top: 0px;
  padding-top: 0px;
  text-align: center;
  color:rgb(188, 198, 255);
  font-family: "gt", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  font-size: 21px;
}

a {
    
    text-decoration-color: rgb(127, 129, 255);
}



.navBar {
    position: fixed;
    overflow: hidden;
    background-color: rgba(0, 2, 29, 0.63);
    height: 50px;
    width: 197vb;
    margin-top: 0px;
    border-radius: 50px;
    border-style:solid;
    border-width: 0.3px;
    border-color: rgba(0, 41, 177, 0.425);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    z-index: 9999;
    
}
.navBar a {
   font-family: GTLight;
   float: left;
   color: rgb(95, 132, 255) ;
   text-align: center;
   padding: 8px 30px;
   text-decoration: none;
   font-size: 30px;
}

.navBar a:hover {
    background-color: #9084ff34;
    color: rgb(188, 198, 255);
    border-radius: 150px;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.bg {
  background-image: url ('bg.jpg')
}

.home {
    text-align: center;
    margin-left: 635px;
}


/* .navBar .splitNav2 {
  background-color: #000132;
  margin-left: 439.6px !important;
  font-family: AcornLight;
  font-size: 35px;
  padding-bottom: 0px;
  border-style:solid;
    border-width: 0.3px;
    border-color: #0a1153;
    border-radius: 150px;
} */

.title1 {
  font-size: 115px;
  margin-bottom: 0px;
  padding-bottom: 8px;
}

.title2 {
  color: rgb(188, 198, 255);
  font-size: 45px;
  padding-top: 0px;
  margin-bottom: 0px;;
}

.container {
  display: flex;
}

.box1 {
  width: 35px;
  margin-left: 100px ;
  margin-right: 400px;
  margin-bottom: 100px;
  flex: 1;
  border: 1px solid #a69fff96;
  padding: 10px;
  margin-top: 50px;
  box-sizing: border-box;
  background-color: #00000046;
  border-radius: 50px;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.box2 {
  height: 400px;
  width: 35px;
  margin-right: 250px;
  margin-left: 80px;
  margin-bottom: 100px;
  flex: 1;
  border: 1px solid rgba(176, 175, 236, 0.637);
  padding: 10px;
  margin-top: 50px;
  box-sizing: border-box;
  background-color: #0f00005e;
  border-radius: 50px;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

.logo {
  height: 460px;
  width: 400px;
  align-items: center;
}