/*************************

      Spinner

*************************/

:root {
    --size: 75px;
    --clr1: #EBCBFF;
    --clr3: #C0D9FF;
    --clr5: #A5FFF4;
    --animation-duration: 1150ms;
}


.spinner .spinner-item {
    --item-size: calc(var(--size) / 4);
    width: var(--item-size);
    height: var(--item-size);
    display: inline-block;
    margin: 0 3px;
    border-radius: 50%;
    border: 4px solid var(--clr-spinner);
    animation: spinner4 var(--animation-duration) ease-in-out infinite;
}
@keyframes spinner4 {
    0%, 100% {
        transform: translateY(75%);
    }
    50% {
        transform: translateY(-75%);
    }
}
.spinner .spinner-item:nth-child(1) {
    --clr-spinner: var(--clr5);
    animation-delay: calc(var(--animation-duration) / 6 * -1);
}
.spinner .spinner-item:nth-child(2) {
    --clr-spinner: var(--clr3);
    animation-delay: calc(var(--animation-duration) / 6 * -2);
}
.spinner .spinner-item:nth-child(3) {
    --clr-spinner: var(--clr1);
    animation-delay: calc(var(--animation-duration) / 6 * -3);
}


/*************************

      Header

*************************/
.header{
    background-color: #24232B !important;
}

.header .menu{
    display: flex !important;
    width: 100% !important;
    height: 30px;
}

.header .menu a{
    color: #FECB39 !important;
    flex-basis: 0;
    flex-grow: 1;
    flex-shrink: 1;
    display: block;
    border-right:  1px solid #FECB39;
    text-align: center;
    line-height: 1;
    height: 30px;
    padding: 0.5rem 0.5rem;
}

.header .menu a:hover{
    color: #FFE28F !important;
    background: transparent !important;
}

.header .menu a.is-active{
    color: #FFFFFF !important;
}

.header .menu a:last-child {
    border-right:  0px none;
    /*text-align: right;*/
}



/*************************

      Footer

*************************/
.footer{
    background-color: #24232B !important;
}

.footer .menu a{
    color: #fdfdfd !important;
}

.menu-list a:hover {
    background-color: transparent;
    color: #4a4a4a;
}

.menu-list a.is-active {
    background-color: transparent;
    color: #4a4a4a;
}


/*************************

      Helper

*************************/
.is-full-height{
    min-height: 100vh;
}

.is-full-height-percent{
    height: 100%;
}



.product-item figure a{
    align-items: center;
    display: inline-flex;
    justify-content: center;
}

.icon.is-very-large {
    align-items: center;
    display: inline-flex;
    justify-content: center;

    width: 70px;
    height: 70px;
    color: #0a0a0a;
    font-size: 61px;
}


.is-full-width{
    width: 100% !important;
}

.has-background-blue-bis {
    background-color: #f4f6fb !important;
}

.is-border-grey {
    border:1px #e3e3e3 solid !important;
}

.is-border-right-grey {
    border-right: 1px solid #e3e3e3;
}

.is-border-top-grey {
    border-top: 1px solid #e3e3e3;
}

.is-text-line {
    text-decoration: line-through;
}

.is-first-letter-capitalized::first-letter {
    text-transform: capitalize;
}

.is-rounded-8 img{
    border-radius: 8px;
}

.has-background-yellow {
    background-color: #FECB39 !important;
}

.has-background-yellow-bis {
    background-color: #FFE28F !important;
}

.img-32x32 img{
    height: 32px;
    width: 32px;
}

.is-yellow-height{
    height: 48px;
}


@media screen and (max-width: 768px) {

    .is-justify-content-start-mobile {
        justify-content: start !important;
    }

    .mt-6-mobile {
        margin-top: 1rem !important;
    }

    .mb-6-mobile {
        margin-bottom: 1rem !important;
    }

    .is-yellow-height{
        height: 111px;
    }

}

@media screen and (min-width: 769px), print {
    .is-yellow-height{
        height: 48px;
    }
}
@media screen and (min-width: 1024px) {
    .is-yellow-height{
        height: 48px;
    }
}

/*************************

     autoComplete

*************************/
.autoComplete_wrapper {
    width: 100%;
}


/*************************

     Product card

*************************/
.card.product-item{
    border: 1px solid #FECB39;
    border-radius: 8px;
}

.card.product-item  a,
.card.product-item  p{
    color: #24232B;
    font-size: 14px;
}


.card-image:first-child img {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.card.product-item  a.basket{
    border: 1px solid #FECB39;
    border-radius: 8px;
    display: block;
}

.card.product-item  a.basket figure {
    margin: 8px;
}

/*************************

        Category

*************************/
.navigation-category span,
.navigation-category a{
    font-size: 18px;
    color: #000000;

}

.navigation-category span{
    display: block;
    text-align: center;
    width: 24px;
    height: 26px;
    border: 1px solid #FECB39;
    border-radius: 4px;
}


/*************************

        Contacts

*************************/
.contacts a,
.contacts a:hover {
    color: #24232B;
}


footer .contacts p,
footer .contacts a,
footer .contacts a:hover {
    color: #F5F5F5;
}

/*************************

      Keen slider

*************************/

.arrow:hover{
    cursor: pointer;
}


/*************************

      Pagination

*************************/
.navigation.client .pagination-link.is-current {
    background-color: #FECB39;
    border-color: #FECB39;
    color: rgba(0,0,0,.7);
}

.pagination-link,
.pagination-next,
.pagination-previous {
    border-color: #FECB39;
    color: #363636;
    min-width: 2.5em;
}

/*************************

        Mmenu

*************************/
#menu {
    z-index: 1000;
}

#menu .mm-navbar{
    display: none;
}

#menu a{
    color: #FECB39 !important;
}

#menu a:hover{
    color: #FFE28F !important;
}


/*************************

        Bulma

*************************/
.has-text-custom-black,
.breadcrumb a {
    align-items: center;
    color: #222222;
    display: flex;
    justify-content: center;
    padding: 0 0.75em;
}

.has-text-custom-black:hover,
.breadcrumb a:hover {
    color: #000000;
}

.nowrap-text{
    white-space: nowrap;
}