body {
   font-family: "Poppins", var(--bs-font-sans-serif);
   /* background: #f8f8f8; */
   background: hsl(0deg 0% 94%);
   overflow-x: hidden;
}

h1.display-3{
   font-weight: 700;
}
h1, h2, h3, h4{
   font-weight: 700;
}
h3>small.small{
   font-size: 0.775em;
   position: relative;
   top: -2px;
}
.material-icon{
   margin-top: -4px;
}
.bg-primary{
   background: #427CFF !important;
}
.bg-secondary{
   background: #E2E3E6 !important;
}

.bg-mix h3{
   color: #fff;
   text-shadow: 0 8px 40px rgba(0,0,0,.75);
}
.bg-mix .badge.bg-secondary{
   background: rgb(226 227 230 / 75%) !important;
   backdrop-filter: blur(4px) saturate(150%);
}

.min-height {
   min-height: 700px;
}

.min-height-sm {
   min-height: 400px;
}

.img-contain{
   object-fit: contain;
   width: 100%;
   height: 100%;
}

.img-cover{
   object-fit: cover;
   width: 100%;
   height: 100%;
}

.img-rounded{
   border-radius: 16px;
}

.header-icon-lg{
   height: 64px;
   width: 64px;
   /* margin-top: 104px; */
   /* margin-bottom: 16px; */
}

.header-icon{
   height: 38px;
   width: 38px;
   border-radius: 8px;
   /* margin-top: -4px; */
}

.ratio-1x2 {
   --bs-aspect-ratio: 200%;
}

.ratio-9x16 {
   --bs-aspect-ratio: calc(16 / 9 * 100%);
}

.my-6{
   margin-top: 7rem!important;
   margin-bottom: 7rem!important;
}



/* .img-cover {
   object-fit: cover;
   width: 132%;
   height: 100%;
   margin-right: -380px;
   max-height: 400px;
} */
/* .memories-outer {
overflow-y: clip;
overflow-x: visible;
} */

/* .memories-inner {
width: 100%;
} */

.memory-container{
   transform: scale(.6);
   height: 232px;
}
@media (min-width: 578px){
   .memory-container{
      transform: scale(1);
      height: auto;
   }
}

.memory {
   width: 180px;
   transform-style: preserve-3d;
   z-index: 1;
   margin: 0 32px;
   /* margin-top: -100px; */
}


.memory.memory-right {
   margin-left: auto;
}
.memory .memory-preview{
   z-index: 2;
}
.memory .memory-preview img,
.memory .memory-preview div {
   background: #E2E3E6;
   border-radius: 16px;
   overflow: hidden;
   width: 180px;
   height: 300px;
   transform: translateZ(0px);
   box-shadow: 0 8px 16px rgba(13, 52, 140, .24);
   z-index: 3;
}
.memory .memory-preview video,
.memory .memory-preview img{
   object-fit: cover;
   z-index: 5;
   /* border-radius: 16px; */
}
.memory .memory-label {
   background: #427CFF;
   color: white;
   padding: 10px 16px;
   border-radius: 24px;
   text-align: center;
   width: 220px;
   margin-left: -20px;
   margin-top: -40px;
   transform: translateZ(2px);
   transform-style: preserve-3d;
   box-shadow: 0 8px 16px rgba(13, 52, 140, .24);
   z-index: 10;
}

.memory .memory-label .memory-title {
   opacity: 0.9;
   font-weight: 600;
   margin-top: 2px;
   margin-bottom: 0px;
   display: block;
   transform: translateZ(1px);
   z-index: 20;
}
.memory .memory-label .memory-date {
   opacity: 0.5;
   font-weight: 800;
   font-size: 70%;
   margin-bottom: 0;
   display: block;
   transform: translateZ(1px);
   z-index: 15;
}
.memory:hover .memory-label,
.memory:hover .memory-label .memory-title{
   transform: translateZ(10px);
}
.memory:hover .memory-label .memory-date{
   transform: translateZ(5px);
}

.opacity-90{
   opacity: 90%;
}
.opacity-80{
   opacity: 80%;
}
.opacity-70{
   opacity: 70%;
}
.opacity-60{
   opacity: 60%;
}
.opacity-50{
   opacity: 50%;
}
.opacity-40{
   opacity: 40%;
}
.opacity-30{
   opacity: 30%;
}
.opacity-20{
   opacity: 20%;
}
.opacity-10{
   opacity: 10%;
}
.opacity-00{
   opacity: 0%;
}

/* .memory {
   transform-style: preserve-3d;
   z-index: 1;
   margin: auto 8px;
}
.memory .memory-preview img,
.memory .memory-preview div {

   border-radius: 16px;
   overflow: hidden;
   transform: translateZ(0px);
   box-shadow: 0 8px 16px rgba(13, 52, 140, .24);
   width: 100px;
   height: 200px;
   margin: auto 24px;
}

.memory .memory-preview video,
.memory .memory-preview img{
   object-fit: cover;

}
.memory .memory-label {
   background: #427CFF;
   color: white;
   padding: 10px 16px;
   border-radius: 24px;
   text-align: center;
   margin-top: -40px;
   transform: translateZ(15px);
   transform-style: preserve-3d;
   box-shadow: 0 8px 16px rgba(13, 52, 140, .24);
   position: relative;
}
.memory .memory-label .memory-title {
   opacity: 0.9;
   font-weight: 700;
   margin-bottom: 2px;
   font-size: 70%;
   display: block;
   transform: translateZ(10px);
}
.memory .memory-label .memory-date {
   opacity: 0.5;
   font-weight: 700;
   font-size: 70%;
   margin-bottom: 0;
   display: block;
   transform: translateZ(6px);
}

@media (min-width: 720px){
   .memory{
      margin: auto 8px;
   }
   .memory .memory-preview img,
   .memory .memory-preview div{
      width: 196px;
      height: 300px;
   }
   .memory .memory-label {
      margin: -40px 0px 0;
   }
   .memory .memory-label .memory-title {
      font-size: 100%;
   }
} */
.bg-mix{
   background-image: url("/media/website-end.jpg");
   background-size: cover;
   background-position: 50% 50%;
   background-repeat: no-repeat;
}