/* Winter */
.snow-bg {
   position: relative;
}

.snow-bg:after {
   content: '';
   display: block;
   position: absolute;
   z-index: 2;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   pointer-events: none;
   background-image: url('https://library.elementor.com/resources/christmas-snow-effect/s1.png'), url('https://library.elementor.com/resources/christmas-snow-effect/s2.png'), url('https://library.elementor.com/resources/christmas-snow-effect/s3.png');
    animation: snow 10s linear infinite;
}

@keyframes snow {
  0% {background-position: 0px 0px, 0px 0px, 0px 0px;}
  50% {background-position: 500px 500px, 100px 200px, -100px 150px;}
  100% {background-position: 500px 1000px, 200px 400px, -100px 300px;}
}

/* Catppuccin Theme */

@layer theme {
  :root {
    /* Background layers */
    --hx-color-dark: #24273a;  /* Base */
    --hx-color-neutral-900: #181926;
    --hx-color-neutral-800: #181926;

    /* Text colors */
    --hx-color-gray-100: #b8c0e0;         /* Text */
    --hx-color-neutral-200: #b8c0e0;
    --hx-color-gray-400: #6e738d;         /* Header */
    --hx-color-slate-100: #b8c0e0;


    /* Border colors */
    --hx-color-white: #cad3f5;

    /* Callout Box colors */
    --hx-color-blue-900: #8aadf4;
    --hx-color-blue-200: #b8c0e0;
    --hx-color-purple-900: #c6a0f6;
    --hx-color-purple-200: #f5bde6;
    --hx-color-red-900: #ed8796;
    --hx-color-red-200: #ee99a0;
  }
}