* {
  margin: 0;
  padding: 0;
}




body {
  
  background: radial-gradient(circle, #0a3d62 20%, #000000 80%);
  color: white;
  height: 100vh; 
  line-height: 1.5;

  font-family: "Fira Code", monospace;



}

.main-div {

  width:  40vw;
  min-width: 150px;

  height: auto;
 
  padding: 2rem;
  background-color: rgb(34, 31, 31);
  border-radius: 30px;
  box-shadow: 0 20px 50px rgba(252, 252, 255, 0.2); 
  
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);  
  text-align: center;

  
}

.main-div h1 {
  font-size: clamp(1.5rem, 4vw, 3rem); 
  font-weight: bold;
}
.main-div p {
  font-size: clamp(1rem, 2.5vw, 1.5rem); 
  margin: 0.2rem 0;
}


#MainImage {

  width: 20vw;
  min-width: 120px;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  object-fit: cover;
  background-color: transparent; 
}



#BoxLinks a {



  color: #add8e6;
  text-decoration: none;
  font-weight: 600;
  transition: color 0.3s ease;
}

#BoxLinks a:hover {
  color: #fff;
}

#BoxLinks a {
  font-size: clamp(0.9rem, 2vw, 1.2rem);
  text-decoration: none;
  margin: 0 10px;
}
#BoxLinks a {
  white-space: nowrap;
}