
.container {
    display: flex;
    justify-content: center; /* Centers horizontally */
    align-items: center;    /* Centers vertically */
    height: 100vh;          /* Ensures container takes full viewport height for vertical centering */\
}

.centered-box {
    width: 400px;
    height: 150px;
}
    
.center-text{
        text-align: center;
    }
 
.dotted {
 border-top: 2px dotted;
 border-bottom: none;
 width: 100%;
}

@font-face { font-family: "Snell"; src: url("/Fonts/snellroundhand_bold.otf") format("opentype");
}

h1 {
  font-family: "Snell";
  font-weight: normal;
}

body {
  background-color:hsla(0,0%,100%,1);
background-image:
radial-gradient(at 0% 99%, hsla(340,100%,81%,0.5) 0px, transparent 50%),
radial-gradient(at 100% 0%, hsla(340,100%,81%,0.5) 0px, transparent 50%),
radial-gradient(at 100% 100%, hsla(340,100%,81%,0.5) 0px, transparent 50%),
radial-gradient(at 0% 0%, hsla(340,100%,81%,0.5) 0px, transparent 50%);
 background-attachment: fixed;
  color: dimgray;
  font-family: Courier New, monospace	;
}

li {
  list-style-type: "✳ ";
}

/* Vinyl Showcase - www.kazimariusz.com */

  #vinyl-gallery * {
    all: unset;
  }
  
  #vinyl-gallery {
    all: initial;
    width: 100%;
    height: 230px;
    margin: 30px 0;
    display: flex;
    flex-direction: row;
    position: relative;
    margin-left: -6px;
  }
  
  #vinyl-gallery .vinyl {
    perspective: 500px !important;
    width: 18px;
    transition: width 0.5s;
  }
  
  #vinyl-gallery .vinyl:hover {
    width: 148px;
  }
  
  #vinyl-gallery img {
    transition: transform 0.5s, width 0.5s, height 0.5s, margin-top 0.5s;
    width: 180px;
    height: 180px;
    transform: rotateX(0deg) rotateY(25deg);
    transform-style: preserve-3d;
    border-radius: 4px;
    border: 2px solid rgba(0, 0, 0, 0.1);
  }
  
  #vinyl-gallery .vinyl:hover img {
    transform: rotateX(0deg) rotateY(10deg);
    width: 188px;
    height: 188px;
    margin-top: -2px;
  }
  
  #vinyl-gallery .title {
    display: block;
    visibility: hidden;
    position: absolute;
    bottom: 0px;
    text-align: center;
    width: 100%;
    padding-left: 6px;
  }
  
  #vinyl-gallery .vinyl:nth-child(n):hover + .title {
    visibility: visible;
  }

::selection {
  background-color: #FFD9E9; /* Sets the background color of the highlight */
  color: #000000; /* Sets the color of the selected text */

}