html,
body {
    height: 100%;
}

html {

}

body {
    /*zoom: 80%;*/
}

:root {
    --brand-blue: #418fde;
    --brand-blue-light: #73ade7;
    --brand-blue-dark: #257bd3;
    --brand-yellow: #b6e73e;
    --brand-yellow-light: #d0f084;
    --brand-yellow-lighter: #e4f6b8;
    --brand-red: #de4141;
}

.wrap .btn-blue { background: var(--brand-blue); color: #fff; }
.wrap .bg-brand-blue { background: var(--brand-blue); }
.wrap .bg-brand-blue-dark { background: var(--brand-blue-dark); }
.wrap .bg-brand-blue-light { background: var(--brand-blue-light); }
.wrap .bg-brand-yellow { background: var(--brand-yellow); }
.wrap .bg-brand-yellow-light { background: var(--brand-yellow-light); }
.wrap .bg-brand-yellow-lighter { background: var(--brand-yellow-lighter); }
.wrap .bg-brand-red { background: var(--brand-red); }
.wrap .text-brand-blue { color: #418fde; }
.wrap .text-brand-blue-dark { color: #257bd3; }
.wrap .text-brand-blue-light { color: #73ade7; }
.wrap .text-brand-yellow { color: #e76f3e; }
.wrap .text-brand-red { color: #de4141; }

.wrap {
    word-break: break-word;
}

.footer {
    background-color: #f3f3f3;
    color: #333;
    border-top: 1px solid #ddd;
    padding: 30px 0 40px 0;
}
.footer a, .footer a:hover { color: #3eb6e7; }
.footer h4 { text-transform: uppercase; font-weight: 200; margin-bottom: 20px; }

.wrap {
    min-height: 100%;
    height: auto;
    margin: 0 auto -410px;
    padding: 0 0 410px;
}

.footer {
    min-height: 410px;
}

.wrap > .container-lg {
    padding: 10px 15px 30px 15px;
}


ul {
    list-style-position: inside;
    padding-left: 0;
}

.warranty {
    display: list-item;
    margin: -16px 0 16px 0;
    list-style-position: inside;
    padding-left: 0;
}

.wrap .btn.btn-blue {
    background-color: #3eb6e7;
    color: #fff;
}
.wrap .btn.btn-white-blue {
    color: #3eb6e7;
    border-color: #3eb6e7;
    background-color: #fff;
}

.ui-front.ui-autocomplete {
    z-index: 1060; /*more than z-index for modal = 1050*/
}
.ui-autocomplete.ui-widget {
    font-size: .8rem;
}
.search-bar .btn { height: 1.95rem;}
.search-bar {margin-top: 4px; margin-right: 5px;}
#sub-navbar-custom .search-bar {margin: 0; }
.icon-menu-items { text-transform: uppercase; font-weight: 600; }
@media (min-width: 992px) {
    .icon-menu-items { order: 1; }
    .search-bar .input-group > .form-control { }
    /*.search-bar .btn , .search-bar .form-control{ padding: 0 !important; line-height: 1 !important;}*/
}

#navbar-custom { padding: 16px; border-bottom: 1px solid #3eb6e7; border-top: 1px solid #3eb6e7; z-index: 1040; }
#navbar-custom .navbar-toggler-icon {  }

#navbar-custom {
    background-color: #fff;
}

/* change the link color */
#navbar-custom .navbar-nav .nav-link {
    color: rgba(0,0,0,.8);
    text-transform: uppercase;
    font-weight: 500;
}
/* change the color of active or hovered links */
#navbar-custom .nav-item .nav-link.active,
#navbar-custom .nav-item .nav-link:hover {
    color: #3eb6e7;
}


/* change the link color */
#sub-navbar-custom .navbar-nav .nav-link {
    color: rgba(255,255,255,.8);
}
/* change the color of active or hovered links */
#sub-navbar-custom .nav-item .nav-link.active,
#sub-navbar-custom .nav-item .nav-link:hover {
    color: #ffffff;
}




#navbar-custom .dropdown-menu { border-radius: 0; padding: 0; }
#navbar-custom .dropdown-item.active, #navbar-custom .dropdown-item:active {
    background-color: #3eb6e7;
    color: #fff;
}



#sub-navbar-custom { text-transform: uppercase; font-weight: 600; font-size: 14px; }
#sub-navbar-custom .navbar-toggler { color: #fff; text-transform: uppercase; border: none; padding: 2px 0; font-size: 16px; }
/*#34bad5*/


.wrap .container > div > h1,
.wrap .container-md > div > h1,
.wrap .container-lg > div > h1,
.wrap .container-lg > div > div > div > div > div > h1 { color: #3eb6e7; padding: 0; font-weight: 600; font-size: x-large; text-transform: uppercase; text-align: center; }
.wrap .container-lg > div > div > div > div > h1 { text-align: left; padding: 0 0 15px 0; }

.wrap .container > div > h2, .wrap .container-md > div > h2, .wrap .container-lg > div > h2, .wrap .container-lg > div > div > div > div > div > h2 { color: #3eb6e7; padding: 0; font-weight: 600; font-size: large; text-transform: uppercase; text-align: center; }
.wrap .container-lg > div > div > div > div > h2 { text-align: left; padding: 0 0 15px 0; }

.wrap a:not(.btn) {
    color: #3eb6e7;
}

@media (min-width: 992px) {
    .wrap .container > div > h1, .wrap .container-md > div > h1, .wrap .container-lg > div > h1 { padding: 30px 250px; }
    #sub-navbar-custom-collapse { margin: 0 -.5rem; }
    #sub-navbar-custom { padding: 0; }
}


.bg-red { background-color: #3eb6e7; color: #fff; }


.bg-light-gray, .bg-light-gray a, .bg-light-gray a:hover { background-color: #aaa; color: #111; text-decoration: none; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4);  }
.bg-dark-black, .bg-dark-black a, .bg-dark-black a:hover { background-color: #111; color: #aaa; text-decoration: none; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4); }

/* temp */

.bd-highlight {
    background-color: rgba(86,61,124,.15);
    border: 1px solid rgba(86,61,124,.15);
}


/* CONTACT */

.site-contact .contact-attribute { margin-top: 10px; }
.contact-attribute > svg { margin-right: 10px; }
.contact-attribute:last-child {margin-bottom: 30px; }

/* PAGE */

.site-page .description {}

.site-page .description h1, .site-page .description h2, .site-page .description h3 { margin: 30px 0; text-transform: uppercase; font-weight: 400; }
.site-page .description th { text-align: center; color: #3eb6e7; padding: 10px; text-transform: uppercase; border: 1px solid #bbb; }
.site-page .description td { padding: 10px; border: 1px solid #bbb; }


/* PRODUCTS AND CATEGORIES (i.e index) */

/*.category-listing .inner-category {*/
/*    bottom: 32px;*/
/*}*/
/*@media (min-width: 992px) {*/
/*    .category-listing .inner-category {*/
/*        bottom: 60px;*/
/*    }*/
/*}*/
.category-item h5.card-title {
    text-align: center;
}
.category-item { overflow: hidden;}
.category-item .card-img-top {
    width: 100%;
    height: auto;
}

.category-item a.category-title {
    width: calc(100% + 40px);
    height: calc(100% + 40px);
    text-align: center;
    font-weight: 900;
    text-decoration: none;
    margin: -20px;

    text-transform: uppercase;

    display: flex;
    flex-direction: column;

    justify-content: end;
}
/*.category-item a.category-title:hover .dummy-hover {*/
/*    flex-grow: .5;*/
/*}*/

.category-item a.category-title span {

    /*flex: 1;*/
    /*max-height: fit-content;*/
    background: #418fde99;
    color: #fff;
    display: block;
    padding: 6px;
    font-size: .8rem;
    border-radius: 0 0 3px 3px;
}

.category-item .dummy-hover {
    flex: 0;
    transition: flex .5s ease;
}


@media (min-width: 992px) {
    .category-item a.category-title span {
        font-size: 1rem;
        padding: 16px 6px;
    }
    .category-item h5.card-title {
        font-size: 1.625rem;
    }
}

.category-listing img {
    background: rgb(255,255,255);
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(223,223,223,1) 100%);
}
.main-product-photo { background: #fafafa; }

#price-display s { color: #999; margin-right: 5px;}


.product-item .model-price-block { overflow: hidden; }
.product-item .model-price-block .product-model { border: 2px solid black; padding-left: 10px; padding-right: 10px; }


.select2-container--krajee-bs4 .select2-selection--single {
    height: 38px;
    overflow: hidden;
}

/*.category-listing h5 { text-transform: uppercase; font-size: 18px;}*/


.footer .contact-attribute > svg { color: #3eb6e7; }

.footer .social-network-block { margin: 20px -15px; }
.footer .social-network { font-size: 32px; color: #666; background: #ddd; text-decoration: none; margin: 0 15px; display: inline-block; padding: 5px 10px 5px 10px; width: 62px; text-align: center; border-radius: 3px;  }
.footer .social-network:hover { color: #fff; }

.footer .card-columns {
    column-count: 2;
}

@media (min-width: 992px) {
    .text-center-lg { text-align: center; }
    .text-right-lg { text-align: right; }
}


.pswp__bg {
    background-color: #fff;
}


/* product slider */

.carousel-products {
    margin-top: 20px;
}

.carousel-products .slick-track
{
    display: flex !important;
}

.carousel-products .slick-slide
{
    height: inherit !important;
}

.carousel-products .slick-slide {
    margin: 0 5px;
}
/* the parent */
.carousel-products .slick-list {
    margin: 0 -5px;
}

.carousel-products .card-body {
    padding: 0 .5rem;
}
.carousel-products .card-title {
    font-size: .5em;
    margin-bottom: .5em;
}
.carousel-products .tag-block, .main-items .tag-block, .main-items .made-in { position: absolute; }


.carousel-products a.card-title-item {
    font-weight: 400;
    text-decoration: none;
    font-size: .75rem;
    line-height: 1rem;
    height: 2rem;
    overflow: hidden;
    margin-bottom: .5em;
    color: var(--brand-blue);
    display: block;
}
.carousel-products .price-from {
    overflow: hidden;
    white-space: nowrap;
    font-size: .6em;
    margin-bottom: 0.75rem;
}


/* products & category list */

.category-listing a.card-title {
    text-align: center;
    background: #418fde99;
    color: #fff;
    display: block;
    padding: 6px;
    font-size: .8rem;
    border-radius: 0 0 3px 3px;
    text-decoration: none;
}

.main-items a.card-title-item {
    display: block;
    font-weight: 400;
    text-decoration: none;
    font-size: 1rem;
    color: var(--brand-blue);
}
.main-items .card-body-item {
    padding: .4em .6rem .5em .6rem;
}
.main-items a.btn-view-item {
    text-transform: uppercase;
    text-decoration: none;
    background-color: var(--brand-blue-dark);
    color: #fff;
    font-weight: bold;
    font-size: .7rem;
    padding: .4rem .6rem .3rem .6rem;
    border-radius: 3px;
    text-wrap: nowrap;
    word-break: keep-all;
    margin-left: 3px;
}
.main-items .model-price-block {
    font-size: .75rem;
    line-height: 1rem;
}

@media (min-width: 992px) {
    .main-items .card-title-item {
        font-weight: 500;
        font-size: 1.2rem;
    }
    .main-items .card-body-item {
        padding: .7em 1.25rem .9em 1.25rem;
    }
    .main-items .btn-view-item {
        padding: .5em 1.5em .6em 1.5em;
        font-size: 1.2rem;
    }


    .main-items .model-price-block {
        font-size: 1rem;
        line-height: 1.2rem;
    }
}





.main-items .made-in {
    right: 0; top: 0;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    background-color: #fff;
    /*border: 1px solid #eee;*/
    border-right: 0;
    padding: 3px 5px 0 7px;
    /*box-shadow: 0 0 5px #ddd;*/
    color: #777;
    line-height: .9rem;
}


.product-data .made-in {
    border-radius: 5px;
    background-color: #fff;
    /*border: 1px solid #eee;*/
    padding: 2px 8px 1px 8px;
    /*box-shadow: 0 0 5px #ddd;*/
    color: #777;
    line-height: .9rem;
}

.main-items .made-in .made-in-text {
    letter-spacing: .12rem;
    text-align: justify;
    text-transform: uppercase;
    font-size: .5rem;
}

.main-items .made-in .fi {
    width: 5em;
    height: .5em;
    border: 1px solid #eaecf0;
    background-size: cover;
    font-size: 1rem;
    line-height: .8rem;
}


.product-data .made-in .made-in-text {
    letter-spacing: .13rem;
    text-align: justify;
    text-transform: uppercase;
    font-size: .5rem;
}

.product-data .made-in .fi {
    width: 5em;
    height: .5em;
    border: 1px solid #eaecf0;
    background-size: cover;
    font-size: 1rem;
    line-height: .8rem;
}

.main-items .in-stock-item {
    /* text-uppercase  py-2*/
    text-transform: uppercase;
    padding: .3em .6rem .2em .6rem;
    border-top: 1px solid rgba(0, 0, 0, 0.125);
    font-size: .7rem;
}

@media (min-width: 992px) {
   .main-items .made-in {
        padding: 7px 10px 4px 10px;
        top: 0;
    }
    .product-data .made-in {
        margin-top: 1rem;
    }
    .main-items .made-in .fi, .product-data .made-in .fi {
        width: 6em;
        height: .5em;
        margin-top: 3px;
    }

    .main-items .made-in .made-in-text, .product-data .made-in .made-in-text {
        font-size: .6rem;
        letter-spacing: .12rem;
    }


    .main-items .in-stock-item {
        padding: .3em 1.25rem .3em 1.25rem;
        font-size: .85rem;
    }
}


.main-items .discount-tag, .main-items .sale-tag, .main-items .free-delivery-tag { padding: .1em .5em .1em .5em; font-weight: 500; font-size: .7em; text-transform: uppercase; }
.carousel-products .discount-tag, .carousel-products .sale-tag, .carousel-products .free-delivery-tag { text-transform: uppercase; box-shadow: 1px 1px 3px #999; margin-bottom: 8px; border-radius: 0 5px 5px 0; float: left; clear: left;}
.main-items .discount-tag, .main-items .sale-tag, .main-items .free-delivery-tag { text-transform: uppercase; box-shadow: 1px 1px 3px #999; margin-bottom: 8px; border-radius: 0 5px 5px 0; float: left; clear: left;}
.carousel-products .discount-tag { padding: .05em .6em .1em .4em; font-size: .6em; font-weight: 600; }
.main-items .discount-tag { padding: .05em .6em .1em .4em; font-size: .6em; font-weight: 600; }
.carousel-products .sale-tag, .carousel-products .free-delivery-tag { padding: .1em .5em .1em .5em; font-size: .5em; display: none; }
.category-listing .sale-tag, .category-listing .free-delivery-tag { padding: .1em .5em .1em .5em; font-size: .5em; }

.discount-tag {
    background: var(--brand-yellow-light); color: #000;
}
.products-container-scroll .discount-tag {
    background: rgba(0, 0, 0, .9); color: #fff;
}

.sale-tag {
    background: var(--brand-yellow-lighter); color: #333;;
}
.free-delivery-tag {
    background: var(--brand-yellow-lighter); color: #333;
}
.non-discounted-price {
    font-size: .8em;
    color: #999;
    font-weight: lighter;
}

.main-items .card-body, .main-items .card-footer { padding: .5rem; }
.main-items .card {
    border: none;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1) !important;
}


.carousel-products .slick-slide img {
    margin: 5px 0;
}





.product-data { display: flex; flex-direction: column; }

.product-data .product-description { z-index: 1; }
.product-data .buy-block { z-index: 2; }



.product-item .product-listing {
    height: calc(100% - 30px);
    position: relative;
}

.product-name { white-space: nowrap; margin-right: 1rem;}
.product-model { color: #999; font-size: 0.8rem; white-space: nowrap; }
.product-model:before {
    content: '';
}
.product-model:after {
    content: '';
}

@media
only screen and ( min-resolution: 2dppx)  and (min-width: 320px){
    .carousel-products .free-delivery-tag {
        font-size: .4em;
    }
}

@media
only screen and ( min-resolution: 3dppx)  and (min-width: 320px){
    .carousel-products .free-delivery-tag {
        top: 130px;
        font-size: .4em;
    }
}


@media (min-width: 667px) {
    .product-data > .buy-block {
        order: 2;
    }
}

@media (min-width: 992px) {

    .carousel-products .free-delivery-tag {
        top: 190px;
    }

    .main-items .card-body, .main-items .card-footer { padding: 1.25rem; }

    .carousel-products .slick-slide {
        margin: 0 15px;
    }
    /* the parent */
    .carousel-products .slick-list {
        margin: 0 -15px;
    }

    .carousel-products .card-body {
        padding: .25rem .75rem;
    }
    /*.carousel-products .tag-block, .main-items .tag-block { padding-top: 10px; }*/


    .carousel-products .card-title, .carousel-products .discount-tag, .carousel-products .sale-tag, .carousel-products .free-delivery-tag, .carousel-products .price-from { font-size: .7em }
    .category-listing .sale-tag, .category-listing .free-delivery-tag { padding: .2em .7em .2em .7em; font-size: .7em; }

    .main-items .discount-tag { font-size: 1rem }


    .category-listing .card-title { min-height: 64px; }
    .product-listing .card-title { min-height: 48px; }

}


.card-footer .sizes-block { position: absolute; width: calc(100% - 16px); bottom: -10px; z-index: 1; }

@media (min-width: 992px) {
    .card-footer .sizes-block { position: absolute; width: calc(100% - 38px); bottom: 4px; z-index: 1; }
}


#overlay {
    position: fixed; /* Sit on top of the page content */
    display: none; /* Hidden by default */
    /*display: flex;*/
    align-items: center;
    width: 100%; /* Full width (cover the whole page) */
    height: 100%; /* Full height (cover the whole page) */
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0,0,0,0.5); /* Black background with opacity */
    z-index: 2000; /* Specify a stack order in case you're using a different order for other elements */
}

#loader { display: none; }
#loader .loader-ellips__dot { background: #111; }

div.required > label:after {
    content: " *";
    color: #dc3545;
}




.stars-wrap {
    width: 250px;
    height: 50px;
    background: #fff;

    border-radius: 10px;
}
.stars {
    width: fit-content;
    margin: 0 0;
    cursor: pointer;
}
.star {
    color: gold !important;
}
.rate {

    height: 50px;
    margin-left: -5px;
    padding: 5px;
    font-size: 25px;
    position: relative;
    cursor: pointer;
}
.rate input[type="radio"] {
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,0%);
    pointer-events: none;
}
.star-over::after {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    font-size: 16px;
    content: "\f005";
    display: inline-block;
    color: silver;
    z-index: 1;
    position: absolute;
    top: 17px;
    left: 10px;
}

.rate:nth-child(1) .face::after {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 512 512'><path d='M464 256A208 208 0 1 0 48 256a208 208 0 1 0 416 0zM0 256a256 256 0 1 1 512 0A256 256 0 1 1 0 256zM174.6 384.1c-4.5 12.5-18.2 18.9-30.7 14.4s-18.9-18.2-14.4-30.7C146.9 319.4 198.9 288 256 288s109.1 31.4 126.6 79.9c4.5 12.5-2 26.2-14.4 30.7s-26.2-2-30.7-14.4C328.2 358.5 297.2 336 256 336s-72.2 22.5-81.4 48.1zM144.4 208a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm192-32a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'/></svg>");
}
.rate:nth-child(2) .face::after {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 512 512'><path d='M464 256A208 208 0 1 1 48 256a208 208 0 1 1 416 0zM256 0a256 256 0 1 0 0 512A256 256 0 1 0 256 0zM176.4 240a32 32 0 1 0 0-64 32 32 0 1 0 0 64zm192-32a32 32 0 1 0 -64 0 32 32 0 1 0 64 0zM184 328c-13.3 0-24 10.7-24 24s10.7 24 24 24H328c13.3 0 24-10.7 24-24s-10.7-24-24-24H184z'/></svg>");
}
.rate:nth-child(3) .face::after {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 512 512'><path d='M464 256A208 208 0 1 0 48 256a208 208 0 1 0 416 0zM0 256a256 256 0 1 1 512 0A256 256 0 1 1 0 256zm177.6 62.1C192.8 334.5 218.8 352 256 352s63.2-17.5 78.4-33.9c9-9.7 24.2-10.4 33.9-1.4s10.4 24.2 1.4 33.9c-22 23.8-60 49.4-113.6 49.4s-91.7-25.5-113.6-49.4c-9-9.7-8.4-24.9 1.4-33.9s24.9-8.4 33.9 1.4zM144.4 208a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm192-32a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'/></svg>");
}
.rate:nth-child(4) .face::after {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 512 512'><path d='M464 256A208 208 0 1 0 48 256a208 208 0 1 0 416 0zM0 256a256 256 0 1 1 512 0A256 256 0 1 1 0 256zm349.5 52.4c18.7-4.4 35.9 12 25.5 28.1C350.4 374.6 306.3 400 255.9 400s-94.5-25.4-119.1-63.5c-10.4-16.1 6.8-32.5 25.5-28.1c28.9 6.8 60.5 10.5 93.6 10.5s64.7-3.7 93.6-10.5zM144.4 208a32 32 0 1 1 64 0 32 32 0 1 1 -64 0zm192-32a32 32 0 1 1 0 64 32 32 0 1 1 0-64z'/></svg>");
}
.rate:nth-child(5) .face::after {
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 512 512'><path d='M464 256A208 208 0 1 0 48 256a208 208 0 1 0 416 0zM0 256a256 256 0 1 1 512 0A256 256 0 1 1 0 256zm130.7 57.9c-4.2-13.6 7.1-25.9 21.3-25.9H364.5c14.2 0 25.5 12.4 21.3 25.9C369 368.4 318.2 408 258.2 408s-110.8-39.6-127.5-94.1zm86.9-85.1l0 0 0 0-.2-.2c-.2-.2-.4-.5-.7-.9c-.6-.8-1.6-2-2.8-3.4c-2.5-2.8-6-6.6-10.2-10.3c-8.8-7.8-18.8-14-27.7-14s-18.9 6.2-27.7 14c-4.2 3.7-7.7 7.5-10.2 10.3c-1.2 1.4-2.2 2.6-2.8 3.4c-.3 .4-.6 .7-.7 .9l-.2 .2 0 0 0 0 0 0c-2.1 2.8-5.7 3.9-8.9 2.8s-5.5-4.1-5.5-7.6c0-17.9 6.7-35.6 16.6-48.8c9.8-13 23.9-23.2 39.4-23.2s29.6 10.2 39.4 23.2c9.9 13.2 16.6 30.9 16.6 48.8c0 3.4-2.2 6.5-5.5 7.6s-6.9 0-8.9-2.8l0 0 0 0zm160 0l0 0-.2-.2c-.2-.2-.4-.5-.7-.9c-.6-.8-1.6-2-2.8-3.4c-2.5-2.8-6-6.6-10.2-10.3c-8.8-7.8-18.8-14-27.7-14s-18.9 6.2-27.7 14c-4.2 3.7-7.7 7.5-10.2 10.3c-1.2 1.4-2.2 2.6-2.8 3.4c-.3 .4-.6 .7-.7 .9l-.2 .2 0 0 0 0 0 0c-2.1 2.8-5.7 3.9-8.9 2.8s-5.5-4.1-5.5-7.6c0-17.9 6.7-35.6 16.6-48.8c9.8-13 23.9-23.2 39.4-23.2s29.6 10.2 39.4 23.2c9.9 13.2 16.6 30.9 16.6 48.8c0 3.4-2.2 6.5-5.5 7.6s-6.9 0-8.9-2.8l0 0 0 0 0 0z'/></svg>");
}
.face {
    opacity: 0;
    position: absolute;
    width: 35px;
    height: 35px;
    background: #007bff;
    border-radius: 5px;
    top: -35px;
    left: 2px;
    transition: 0.2s;
    pointer-events: none;
}
.face::before {
    content: '';
    background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' fill='%23007bff' viewBox='0 0 512 512'><path d='M182.6 470.6c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-9.2-9.2-11.9-22.9-6.9-34.9s16.6-19.8 29.6-19.8H288c12.9 0 24.6 7.8 29.6 19.8s2.2 25.7-6.9 34.9l-128 128z'/></svg>");
    background-size: cover;
    width: 1em;
    height: 1em;
    display: inline-block;
    z-index: 1;
    position: absolute;
    left: 10px;
    bottom: -9px;
}
.face::after {
    display: inline-block;
    color: #fff;
    z-index: 1;
    position: absolute;
    left: 5px;
    top: 5px;
    background-size: cover;
    width: 1em;
    height: 1em;
    content: '';
}

.rate:hover .face {
    opacity: 1;
}



.blog-title {
    font-size: 1.125rem;
    margin-top: 20px;
    font-weight: 600;
}

.blog-date {
    color: #999;
    font-size: .9rem;
}

.blog-picture picture {
    max-width: 100%;
}