@font-face {
font-family: pixel;
src: url(https://dl.dropbox.com/s/kmhe7d3n18vdz5e/w95fa.woff?dl=0);
}

@font-face {
font-family: 'Matcha Cih';
src: url('fonts/matcha_cih/Matcha Cih.ttf');
}


@font-face {
font-family: sour-gummy;
src: url(fonts/Sour_Gummy/static/SourGummy-Medium.ttf);
}


.ad{
  border-width: 1px;
  border-style: solid;
  border-color: white;
  background-color: black;
  border-radius: 20px;
  background-repeat: repeat;
  margin-left: 899px;
  margin-top: 30px;
  width: 780px;
  position: auto;
  left: 1px;
  height: 100px;
  z-index: 5;
  }

  .nav-links{
    font-family: 'sour-gummy';
    margin-top: 16px;
 margin-left: 200px;
 list-style: none;
    display: flex;
    gap: 17px;
    font-size: 1.3em;

  
    /* Unvisited link */
a:link {
  color: #FF0000; /* Red */
  text-decoration: none;
   content: "•";     /* Insert custom shape (e.g., bullet point) */
  color: black;  /* Customize the color */
}

/* Visited link */
a:visited {
  color: #00FF00; /* Green */
  text-decoration: none;
}

/* Mouse over link */
a:hover {
  color: #FF00FF; /* Hot pink */
  text-decoration: none;
}

/* Selected/clicked link */
a:active {
  color: #0000FF; /* Blue */
  text-decoration: none;
}

  }
  .box-navi{
     border-width: 1px;
  border-style: solid;
  border-color: white;
  border-image: url("https://i.imgur.com/ROjUrNz.gif") 5 fill round;          
  background-repeat: repeat;
  margin-top: 90px;
  margin-left: 50px;
  width: 1700px;
  position: relative;
  left: auto;
  height: 50px;
  z-index: 5;
  
  }
 .logo-img {
  /* Set a specific width; height: auto maintains aspect ratio */
  width: 200px; 
  height: auto;
  
  /* Optional styling */
  display: outside;
   position: absolute;
  top: -70px; /* Moves it above the container top */
  left: 10px;
  z-index: 9;
  border-radius: 0px; /* Rounds corners if desired */
  transition: transform 0.3s ease; /* Adds a smooth hover effect */
}

.logo-img:hover {
  transform: scale(1.05); /* Slightly enlarges logo on hover */
}

.site-button{
border-width: 1px;
  border-style: solid;
  border-color: black;
  background-image: url('IMG LINK HERE');
  background-repeat: repeat;
  width: 500px;
  position: relative;
  margin-top: 99px;
  margin-left: 40px;
  left: 1px;
  height: 100px;
  z-index: 5;
}
.download-btn {
  background-color: #007bff;
  color: white;
  padding: 10px 20px;
  margin-top: 10px;
  margin-left: 220px;
  text-decoration: none;
  border-radius: 5px;
  display: inline-block;
}
.bio-box{
  border-width:7px;
  border-style:solid;
  border-image: url("https://i.imgur.com/ROjUrNz.gif") 6 fill round;          
  margin: auto;
  margin-top: -200px;
  margin-left: -19200px;
  margin-right: -10px;
  width: 500px;
  height: 400px;
  position: absolute;
  z-index: 4;
  }
  
  .log-box{
        overflow: scroll;
      padding: 1rem;
      margin-left: 60px;
      margin-top: 20px;
      height:540px;
      width:400px;
  border: 1px solid #a1a1a1;
  border: 2px inset;
  border-radius: 0px 6px 6px 6px;
  background: white;
    }

    #container::-webkit-scrollbar {
      width: 0;
      /* remove scrollbar space */
      background: transparent;
      /* to make scrollbar invisible */
    }

    #container::-webkit-scrollbar-thumb {
      background: transparent;
    }
    .shrine-1{
      border-width:7px;
  border-style:solid;
  border-image: url("https://i.imgur.com/ROjUrNz.gif") 6 fill round;          
  margin: auto;
  margin-top: -200px;
  margin-left: -19200px;
  margin-right: -10px;
  width: 300px;
  height: 160px;
  position: absolute;
  z-index: 4;
      }
    
.shrine-2{
      border-width:7px;
  border-style:solid;
  border-image: url("https://i.imgur.com/ROjUrNz.gif") 6 fill round;          
  margin: auto;
  margin-top: -200px;
  margin-left: -19200px;
  margin-right: -10px;
  width: 300px;
  height: 160px;
  position: absolute;
  z-index: 4;
      }
   .blog-box{
      border-width:7px;
  border-style:solid;
  border-image: url("https://i.imgur.com/ROjUrNz.gif") 6 fill round;          
  margin: auto;
  margin-top: -325px;
  margin-left: 700px;
  margin-right: -10px;
  width: 500px;
  height: 400px;
  position: absolute;
  z-index: 4;
     }
     .nav-links li:not(:last-child)::after {
  content: "❤︎"; /* Unicode for a bullet dot. You can use emojis or other shapes */
  color: black;     /* Customize the shape's color */
  margin: 0 12px;     /* Adjust spacing between links */

    
    
     }
 footer {
  text-align: center;
  padding: 20px;
  background-color: #333;
  color: white;
  height: 120px;
  width: 1850px;
  margin-top: 500px;
}