body {

  .transparent-bg-container::before {
  content: "";
  background-image: url('white.jpg');
  background-position: center;
  position:fixed;
  top: 0%; left: 30%; width: 40%; height: 100%;
  opacity: 0.55; /* Adjust transparency (0.0 to 1.0) */
  z-index: -1; /* Places image behind text */
          background-color: black;
    color:black;
  }

  dialog {
   border: none;
   border-radius: 8px;
   padding: 20px;
   box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    }


h1,p,h2,h3{
  flex: 0%;
  text-align: justify;
  text-align-last: center;
  margin: 15px auto;
  width: 800px;
}

        
background-image: url("sick.png");
  background-size: cover;
  background-attachment: fixed; /* This keeps the image from scaling with text */
  background-position: center;
  background-repeat: no-repeat; /* Keeps the image fixed when scrolling (optional) */
  z-index: -5;
  
  
  
  text-align: center;
  justify-content: -40%;
         
    
    
       a:link {
        color: darkblue;
      }
      
      a:hover {
        color: rebeccapurple;
      }
           
      a:visited {
        color: blue;
      }
      
      a:active {
        color: mediumpurple;
      }

}