@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300&display=swap');

body#landing-page {
    font-family: 'Poppins', sans-serif;
    overflow-y: scroll;
    background-color: rgb(250, 250, 250);
}

body#landing-page .navbar.navbar-dark {
    opacity: 0.9;
    animation: fadein .35s;
    /* Safari, Chrome and Opera > 12.1 */
    -webkit-animation: fadein2 .35s;
    /* Firefox < 16 */
    -moz-animation: fadein2 .35s;
    /* Internet Explorer */
    -ms-animation: fadein2 .35s;
    /* Opera < 12.1 */
    -o-animation: fadein2 .35s;
}

#collection .item {
    animation: fadein .35s;

    /* Safari, Chrome and Opera > 12.1 */
    -webkit-animation: fadein .35s;
    /* Firefox < 16 */
    -moz-animation: fadein .35s;
    /* Internet Explorer */
    -ms-animation: fadein .35s;
    /* Opera < 12.1 */
    -o-animation: fadein .35s;
}

#header-image-thumbnail {
    animation: fadein .35s;
    max-width: 100px;
    max-height: 35.75px;
}

#header-image {
    max-width: 200px;
    max-height: 100px;
}

a {
    text-decoration: none !important;
}

.blur {
    filter: blur(8px);
}

#collection .box {
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Old versions of Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
    background-color: white;
    height: 60px;
    box-shadow: 0 .125rem .25rem rgba(0, 0, 0, .075);
}

#collection .box:hover {
    cursor: pointer;
    filter: brightness(85%);
}

#collection .box:active {
    box-shadow: none !important;
    transform: translateY(.125rem);
}

#collection .box .title {
    margin-right: 18px;
    margin-left: 18px;
}

#collection .box img {
    max-width: 20px;
    margin-left: 18px;
    margin-right: -8px;
}

#collection .box.shape-rounded {
    border-radius: .375rem;
}

#collection .box.shape-pill {
    border-radius: 0rem;
}

#collection .box.shape-pill {
    border-radius: 1.375rem;
}

#collection .box.shape-prism {
    border-radius: 1.375rem 0.375rem 1.375rem 0.375rem;
}

#collection .box.shape-prism-reversed {
    border-radius: 0.375rem 1.375rem 0.375rem 1.375rem;
}

@keyframes fadein2 {
    from {
        opacity: 0;
    }

    to {
        opacity: 0.9;
    }
}

/* Firefox < 16 */
@-moz-keyframes fadein2 {
    from {
        opacity: 0;
    }

    to {
        opacity: 0.9;
    }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein2 {
    from {
        opacity: 0;
    }

    to {
        opacity: 0.9;
    }
}

/* Internet Explorer */
@-ms-keyframes fadein2 {
    from {
        opacity: 0;
    }

    to {
        opacity: 0.9;
    }
}

/* Opera < 12.1 */
@-o-keyframes fadein2 {
    from {
        opacity: 0;
    }

    to {
        opacity: 0.9;
    }
}

@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

/* Opera < 12.1 */
@-o-keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

#product-list-modal .product-detail .product-image {
    opacity: 1;
    max-height: 200px;
    transition: .2s ease;
    backface-visibility: hidden;
}

#product-list-modal .product-detail:hover {
    cursor: pointer;
}

#product-list-modal .product-detail:hover .product-image {
    filter: brightness(80%);
}