/* Base styles */
body {
      background-color: black; /* Set background color to black */
      display: flex;
      justify-content: center; /* Center horizontally */
      align-items: center; /* Center vertically */
      height: 100vh; /* Full viewport height */
      margin: 0; /* Remove default margin */
      padding: 0; /* Remove default padding */
        overflow: hidden;}
    
    /* Container styles */
    .container {
      background-color: rgb(19, 17, 17); /* Box background color */
      width: 300px; /* The size you want the box to be */
      padding: 20px;
      box-shadow: 0 0 10px rgba(0.4, 0.4, 0, 0.9); /* Optional; add shadow for better visibility */
      border-radius: 10px; /* Optional; for rounded edges */
      display: flex;
      flex-direction: column;
      align-items: center; /* Center content vertically within container */
      justify-content: flex-start; /* Optional; center the text inside */
    }
    .container .image{background-image: url(avatar-jessica.jpeg);
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center;
      width: 80px;
      height: 80px;
      border-radius: 50%;
      margin-bottom: 15px;}   

.text-content p{margin: 5px 0;
                text-align: center;} /*Spacing between elements*/

.name{color: white;
      font-size: 18px;
      }

.location{color: rgb(189, 240, 88);
font-size: 14px;}

.about{color: white;
       font-size: small;}

.link-box{background-color: rgb(61, 60, 60);
          color: white;
          font-family: 'Inter', sans-serif;
           text-decoration: none; /*remove underline for links*/
          padding: 10px 15px;
          margin: 8px 0;
          width: 80%;
          text-align: center;
          border-radius: 5px;
          margin-bottom: 13px;}

          .link-box:hover{background-color: greenyellow;}