.bg-ac1 {
    background-color: #102C57;
}

.bg-ac2 {
    background-color: #DAC0A3;
    opacity: 1;
}

.bg-ac3 {
    background-color: #EADBC8;
}

.bg-white {
    background-color: whitesmoke;
}

.bg-glass {
/* From https://css.glass */
background: rgba(255, 255, 255, 0.07);
border-radius: 16px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(3.7px);
-webkit-backdrop-filter: blur(3.7px);
}

.bg-glass-trending {
/* From https://css.glass */
background: rgba(255, 255, 255, 0);
border-radius: 16px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(0px);
-webkit-backdrop-filter: blur(0px);
border: 1px solid rgba(255, 255, 255, 1);
}

.bg-glass-light {
    background: rgba(255, 255, 255, 0.82) !important ;
    border-radius: 16px !important ;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1) !important ;
    backdrop-filter: blur(13.6px) !important ;
    -webkit-backdrop-filter: blur(13.6px) !important ;
    border: 1px solid rgba(255, 255, 255, 0.3) !important ;
}

.bg-glass-dark {
    background: rgba(10, 9, 9, 0.72) !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1) !important;
    backdrop-filter: blur(6.5px) !important;
    -webkit-backdrop-filter: blur(6.5px) !important;
    border: 1px solid rgba(10, 9, 9, 1) !important;
}

/* .bg-glass-profile {
    background: rgba(255, 255, 255, 0.42);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(16.1px);
    -webkit-backdrop-filter: blur(16.1px);
} */

.bg-glass-cases {
    /* From https://css.glass */
    background: rgba(255, 255, 255, 0.42);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(16.1px);
    -webkit-backdrop-filter: blur(16.1px);
}

.bg-glass-case {
/* From https://css.glass */
background: rgba(255, 255, 255, 0.01);
border-radius: 16px;
box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
backdrop-filter: blur(8.4px);
-webkit-backdrop-filter: blur(8.4px);
border: 1px solid rgba(255, 255, 255, 0.01);
}

.bg-glass-ac2 {
    background: rgba(218, 192, 163, 0.72);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(16.1px);
    -webkit-backdrop-filter: blur(16.1px);
    border: 1px solid rgba(218, 192, 163, 0.01);
}
/* .bg-glass-ac2 {
    background: rgba(218, 192, 163, 0.72);
    border-radius: 16px;
    box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
    backdrop-filter: blur(16.1px);
    -webkit-backdrop-filter: blur(16.1px);
    border: 1px solid rgba(218, 192, 163, 0.01);
} */

.img-fluid {
    border-radius: 10px;
}

/* @media (max-width: 768px) {
    .container {
        max-width: 90vw;
    }
    body  {
        background-color: #2d4459;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .container {
        max-width: 85vw;
    }
    body  {
        background:
            radial-gradient(ellipse at top, #2d4459 , transparent),
            radial-gradient(ellipse at bottom, #2d4459 , transparent);
    }
}

@media (min-width: 1025px) {
    .container {
        max-width: 80vw;
    }
    body  {
        background:
            radial-gradient(ellipse at top, #2d4459 , transparent),
            radial-gradient(ellipse at bottom, #2d4459 , transparent);
    }
} */

@media (max-width: 768px) {
    .container {
        max-width: 90vw;
    }
    body  {
        background-color: #3c6ca8;
    }
}

@media (min-width: 769px) and (max-width: 1024px) {
    .container {
        max-width: 85vw;
    }
    body  {
        background-color: #3c6ca8;
    }
}

@media (min-width: 1025px) {
    .container {
        max-width: 80vw;
    }
    body  {
        background-color: #3c6ca8;
    }
}