/*

AUTOPREFIXER: https://autoprefixer.github.io/;

Modal fx: https://postare.github.io/bulma-modal-fx/;

html {

font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
font-size: 16px;
font-weight: normal;
line-height: 1.5;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
background: #fff;
color: #212121;
}
*/


/*------------------------------------*\
RESET
\*------------------------------------*/


/* https://meyerweb.com/eric/tools/css/reset/ 
v2.0b1 | 201101 
NOTE:WORK IN PROGRESS
USE WITH CAUTION AND TEST WITH ABANDON */


/* Palette generated by Material Palette - materialpalette.com/amber/deep-orange 

.dark-primary-color    { background: #FFA000; }
.default-primary-color { background: #FFC107; }
.light-primary-color   { background: #FFECB3; }
.text-primary-color    { color: #212121; }
.accent-color          { background: #FF5722; }
.primary-text-color    { color: #212121; }
.secondary-text-color  { color: #757575; }
.divider-color         { border-color: #BDBDBD; }

*/


/* colors triada: 
oca: #B3A317;
blau cel: #54E4FF;
rosa: #CC1B67;
rosa fosc: #B3205F;

complementaris:
oca: #B3A317 ;
blau: #2C05B3;
lilós: #663BFF;

*/


/* Definició de colors */

:root {
    --groc-corporatiu: #FFEB3B;
    --groc-50: #FFFDE7;
    --groc-100: #FFF9C4;
    --groc-200: #FFF59D;
    --groc-300: #FFF176;
    --groc-400: #FFEE58;
    --groc-500: #FFEB3B;
    --groc-600: #FDD835;
    --groc-700: #FBC02D;
    --groc-800: #F9A825;
    --groc-900: #F57F17;
    --groc-A100: #FFFF8D;
    --groc-A200: #FFFF00;
    --groc-A400: #FFEA00;
    --groc-A700: #FFD600;
    --vermell-oferta: #CC1B67;
    /* #e53935; */
    --oferta: #CC1B67;
    /* #e53935; */
    --vermell-alerta: #B3205F;
    /* #D50000 #DE0021 */
    --alerta: #B3205F;
    /* #D50000 #DE0021 */
    --exit: green;
    --color-alerta: #ab000d;
    --color-warning: #FF6F00;
    --color-success: #33691E;
    --rosa: #E91E63;
    /* rosa samarreta #ff298f */
    --rosa: #CC1B67;
    --negre: #212121;
    --gris: #757575;
    --gris-fosc: #363636;
    --gris-clar: #dddddd;
    --gris-inactiu: #c3c3c3;
    --gris-ultraclar: #f5f5f5;
    /*  --font-standard: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif; */
    --font-standard: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
    --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    /*--font-standard: 'Open Sans', Arial, Helvetica, sans-serif;*/
    --font-xsmall: 0.6rem;
    --font-small: 0.85rem;
    --font-normal: 1rem;
    /* 15px; */
    --font-medium: 1.25rem;
    --font-large: 1.5rem;
}

@media screen and (max-width: 768px) {
     :root {
        --font-medium: 1.25rem;
        --font-large: 1.5rem;
    }
}


/* ESTRUCTURA DE LA PÀGINA **************************/

body {
    align-items: flex-start;
    -ms-align-items: flex-start;
    display: flex;
    -ms-display: flex;
    flex-direction: column;
    -ms-flex-direction: column;
    flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    height: auto;
    min-height: 100vh!important;
}

body>header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    background-color: var(--groc-corporatiu);
    position: -webkit-sticky;
    position: sticky;
    top: 0;
    z-index: 30;
}

body>main {
    -webkit-box-flex: 1;
    flex: 1;
    -ms-flex: 1;
    /*overflow: hidden;*/
    /* el desactivo per poder posar sticky dins main; */
}

body>footer {
    -ms-flex-item-align: end;
    align-self: flex-end;
}


/* ordre estructura principal */

#barraAvisos {
    -webkit-box-ordinal-group: 1;
    -ms-flex-order: 0;
    order: 0;
    width: 100%;
}

body>header {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    width: 100%;
}

#barraBanner {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    width: 100%;
}

body>main {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    width: 100%;
}

#barraPeu {
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
    width: 100%;
}

#pre-footer {
    -webkit-box-ordinal-group: 6;
    -ms-flex-order: 5;
    order: 5;
    width: 100%;
}

body>footer {
    -webkit-box-ordinal-group: 7;
    -ms-flex-order: 6;
    order: 6;
    width: 100%;
}

body>header.ombra {
    -webkit-box-shadow: 0 0 .75rem rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 .75rem rgba(0, 0, 0, 0.15);
}

@media (max-width: 1023px) {
    body>header {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }
}

@media (max-width: 768px) {
    body.nofooter .footer,
    body.nofooter #pre-footer,
    body.nofooter #barraPeu {
        display: none;
    }
}


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

html {
    scroll-behavior: smooth;
}


/* correccions generals als estils de bulma */

a {
    color: var(--groc-900);
    /*color: #0062bd;*/
    transition: all 0.15s ease-in-out;
}

.breadcrumb a {
    color: var(--gris-fosc);
}

.tabs li.is-active a {
    color: var(--groc-900);
    border-bottom-color: var(--groc-900)
}

.title {
    font-size: var(--font-large);
    font-weight: 700
}

.subtitle {
    font-size: var(--font-medium);
    font-weight: normal;
    color: var(--negre)
}

.title,
.subtitle {
    line-height: 1.2em;
}

.notes {
    font-size: var(--font-small)
}

.text p {
    margin-bottom: .5em;
}

.text ul {
    margin: 0.5em 0 .75em;
    list-style: disc;
    padding-left: 1.5em;
}

.section {
    padding: 1.5rem 0.75rem;
}

.section.fonscolor {
    background-color: var(--groc-A100)
}

.section.fonsgris {
    background-color: var(--gris-ultraclar)
}

.modal {
    z-index: 1000
}

.level:not(:last-child) {
    margin-bottom: 1rem;
}

.level.is-mobile .level-left {
    display: block
}

.level-left,
.level-right {
    flex-shrink: initial;
}

.input.is-active,
.input.is-focused,
.input:active,
.input:focus,
.textarea.is-active,
.textarea.is-focused,
.textarea:active,
.textarea:focus,
.select select.is-active,
.select select.is-focused,
.select select:active,
.select select:focus {
    border-color: var(--groc-A700);
    box-shadow: 0 0 0 0.125em rgba(255, 235, 59, .25);
}

.select:not(.is-multiple):not(.is-loading)::after {
    border-color: var(--groc-900);
}

#fitxaTags .section {
    padding: 0;
}

input.is-danger+p.help,
input.is-danger+a+p.help {
    color: #ff3860;
}

.menu-list a.is-active {
    background-color: var(--groc-500);
    color: var(--negre);
}

@media screen and (max-width: 768px) {
    #fitxaTags .title:not(:last-child) {
        margin-bottom: 1rem;
    }
}


/* per fer clicable la icona dels input passwords */

.control.has-icons-right.clicable .icon {
    pointer-events: auto;
    cursor: pointer !important;
}

.field-body p:not(:first-of-type) {
    margin-top: 0;
}

#barramenu,
.hero.is-primary {
    background-color: var(--groc-corporatiu)
}

.hero-foot {
    background-color: var(--groc-500);
}

.hero-body {
    padding: 1rem 0 0;
}

#news .hero.is-primary {
    background-color: var(--gris-ultraclar)
}

@media screen and (min-width: 769px) {
    body:not(#home)>header {
        -webkit-box-shadow: 0 0 .75rem rgba(0, 0, 0, 0.15);
        box-shadow: 0 0 .75rem rgba(0, 0, 0, 0.15);
    }
    .hero.is-medium .hero-body {
        padding-bottom: 0;
        padding-top: 0.5rem;
    }
    .hero-body {
        padding: 3rem 1.5rem
    }
    .hero-foot {
        border-top: 2px solid white;
        margin-top: .5em
    }
}

#continguts {
    padding: 1rem 0;
}

@media all and (max-width: 1087px) {
    #continguts {
        padding: 1rem
    }
}

.principal p,
.principal h2,
.principal h3,
.principal h4 {
    margin-bottom: .5em;
}


/*
.is-size-1,
.is-size-2,
.is-size-3,
.is-size-4 { line-height: 110%; margin-bottom: 1em }

.is-size-5 { line-height: 110%; }


.principal h2,
.principal h3 {
  font-size: var(--font-medium); 
  color: var(--negre); }

  .principal ul li {list-style: disc; margin-left: 1em}

  .principal .producte-card ul li {margin: 0; line-height: 100%}
  .principal .producte-card h3 {margin: 0 1.5em .25em 0; font-weight: bold;}

  */


/*links genèrics */

.principal p a,
.principal ul a,
.principal label a,
.producte-info h3 a,
.producte-info h4 a,
.blog .subtitle a,
#videos h2 a,
#resultatsBlog .subtitle a,
.blog .content a {
    color: var(--gris-fosc);
    border-bottom: 2px solid var(--groc-500);
}

.principal p a:hover,
.principal ul a:hover,
.principal label a:hover,
.producte-info h3 a:hover,
.producte-info h4 a:hover,
.blog .subtitle a:hover,
#videos h2 a:hover,
#resultatsBlog .subtitle a:hover,
.blog .content a:hover {
    background-color: var(--groc-500);
    color: #111111;
}

#videos h2 a {
    font-weight: bold
}

.principal .tabs a:hover {
    background-color: transparent
}

.principal .tabs li:not(.is-active) a {
    border: none;
}

.breadcrumb ul li {
    margin: 0
}

.principal .breadcrumb a {
    padding: 0 .5em;
    border-bottom: none;
}


/*.breadcrumb:not(:last-child) {margin-bottom: 1rem} */

.breadcrumb,
.breadcrumb:not(:last-child) {
    margin-bottom: 1rem
}

.breadcrumb ul li.is-active a,
.notification a {
    border-bottom: none
}


/* quadres d'alerta */

.notification.is-warning {
    background-color: white;
    border: 2px solid var(--groc-500);
    color: var(--gris);
}

.notification.is-danger {
    background-color: white;
    border: 2px solid var(--alerta);
    color: var(--gris-fosc);
}

.notification.is-primary {
    background-color: var(--groc-500);
    border: 2px solid var(--groc-500);
    color: var(--negre);
}

.notification.petita {
    font-size: var(--font-small);
    margin-bottom: 1em;
    padding: 1em 2.5em 1em 1.5em;
}

#aviscookies.notification {
    background-color: var(--negre);
    color: var(--gris-ultraclar);
    border-radius: 0;
}

#avis18.notification {
    background-color: var(--groc-A400);
    color: var(--negre);
    border-radius: 0;
    margin-bottom: 0;
}

#aviscookies.notification strong {
    color: var(--groc-A400);
}

#avis18.notification strong {
    color: var(--alerta2);
}

#notificacionsEntrada {
    left: 0;
    position: fixed;
    right: 0;
    bottom: 0;
    z-index: 100;
    font-size: var(--font-small)
}

#notificacionsEntrada .material-icons {
    font-size: 1.5em;
    vertical-align: middle;
}

.box.is-warning {
    border: 2px solid var(--groc-500);
    box-shadow: none
}


/*.avis {color: green;}*/

.oferta,
.oferta strong {
    color: var(--alerta);
    font-weight: bold
}

.alerta,
.alerta strong {
    color: var(--alerta);
}

.success,
.success strong {
    color: var(--color-success);
}


/*
  .sticky {
    position: sticky;
    top: 7rem; 
  }
  */


/*botons */

.button {
    border-radius: 3px;
    transition: .1s ease-in-out;
    transition-property: color, background-color, border-color;
    background-color: transparent;
}

.button.is-primary {
    /* color: var(--negre);
  border-color: #FBC02D;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  font-weight: bold;
  color: #212121;
  background-color: #FFEE58;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#FFEE58), to(#FBC02D));
  background-image: -webkit-linear-gradient(top, #FFEE58, #FBC02D);
  background-image: -moz-linear-gradient(top, #FFEE58, #FBC02D);
  background-image: -ms-linear-gradient(top, #FFEE58, #FBC02D);
  background-image: -o-linear-gradient(top, #FFEE58, #FBC02D);
  background-image: linear-gradient(to bottom, #FFEE58, #FBC02D);
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr=#FFEE58, endColorstr=#FBC02D);
*/
}

.button.is-primary,
.button.is-secondary {
    font-weight: bold;
    border-width: 2px;
    border-radius: 5px
}

.button.is-primary {
    color: var(--negre);
    background: linear-gradient(#FFF176, #FFEB3B);
    border: 2px solid var(--groc-600);
}

.button.is-primary.is-active,
.button.is-primary:active,
.button.is-primary:hover {
    background-color: var(--groc-A400);
    border-color: var(--groc-A400);
    color: var(--negre);
}

.button.is-secondary {
    background-color: var(--negre);
    border: 2px solid #111111;
    color: var(--gris-ultraclar);
}

.button.is-secondary.is-active,
.button.is-secondary:active,
.button.is-secondary:hover {
    background-color: #111111;
    border-color: #111111;
}

@media screen and (max-width: 768px) {
    /* desconnectem el botó fixat al peu x UX */
    /*
  .boto-fixat-peu-mobile {
    display: block;
    position: fixed;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 10000;
    padding: 1rem;
    background: #fff;
    background-color: var(--groc-corporatiu);
    border-top: 1px solid var(--groc-A700);
}

.boto-fixat-peu-mobile input[type="checkbox"].material + label:before {
color: var(--gris);
}
*/
}


/* videos */

.flex-video {
    position: relative;
    padding-top: 25px;
    padding-bottom: 67.5%;
    height: 0;
    margin-bottom: 16px;
    overflow: hidden
}

.flex-video.widescreen {
    padding-bottom: 57.25%
}

.flex-video.vimeo {
    padding-top: 0
}

.flex-video iframe,
.flex-video object,
.flex-video embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

#videos .card {
    height: 100%;
}

.#videos .card-image figure {
    background-color: #FFF;
    position: relative;
}

.#videos .card-image figure:before {
    font-family: "Material Icons";
    content: 'zoom_in';
    font-size: 500%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    opacity: .8;
}


/* Mega menu ***********************************************************/

#catalegDropdown .pinterest {
    max-height: 500px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column wrap;
    flex-flow: column wrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

#catalegDropdown .ac {
    width: calc(100% /4);
}

#catalegDropdown .ac .ac-a {
    width: 90%;
}

@media screen and (max-width: 1023px) {
    #catalegDropdown .pinterest {
        display: block;
        max-height: none;
    }
    .navbar-dropdown .ac1r {
        font-size: var(--font-normal)
    }
}

.button i {
    margin-right: 0.25em;
}

.navbar.is-fixed-bottom,
.navbar.is-fixed-top {
    z-index: 100;
}

.navbar {
    background-color: var(--groc-500);
}

.ombra-navbar {
    -webkit-box-shadow: 3px 3px 5px 3px rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 3px 3px 5px 3px rgba(0, 0, 0, 0.1);
    box-shadow: 3px 3px 5px 3px rgba(0, 0, 0, 0.1);
}

.navbar-item.has-dropdown.is-active .navbar-link,
.navbar-item.has-dropdown:focus .navbar-link,
.navbar-item.has-dropdown:hover .navbar-link,
.navbar-start .navbar-item.has-dropdown.is-active .navbar-link,
.navbar-start .navbar-item.has-dropdown:hover .navbar-link,
.navbar-dropdown .navbar-item,
.navbar-dropdown.navbar-link {
    background-color: var(--negre);
    color: var(--gris-clar);
}

.navbar-dropdown .navbar-divider {
    background-color: var(--gris-fosc)
}

.navbar-end {
    font-size: var(--font-small)
}

.navbar-dropdown {
    border-top: 0;
}

.navbar-dropdown button.navbar-item {
    border: none;
    display: block;
    width: 100%;
    text-align: left;
}

.navbar-dropdown button.navbar-item:hover {
    cursor: pointer;
    background-color: #f5f5f5;
    color: #0a0a0a;
}

.navbar-link.is-active,
.navbar-link:hover,
a.navbar-item.is-active,
a.navbar-item:hover {
    background-color: var(--negre);
    color: var(--gris-clar);
}

#comandaTelefonica {
    background-color: var(--negre);
}

#comandaTelefonica .navbar-link {
    color: var(--groc-500);
}

#comandaTelefonica .material-icons {
    font-size: 1.5em
}

#iconesMobile .navbar-link.is-active,
#iconesMobile .navbar-link:hover,
#iconesMobile a.navbar-item.is-active,
#iconesMobile a.navbar-item:hover {
    color: var(--negre);
}

a.navbar-item {
    transition: background-color .2s ease-in, color .2s ease-in;
}

.navbar-end .navbar-link:hover {
    color: var(--negre);
}

.navbar-link i.fas {
    color: var(--gris-fosc);
    margin-right: .3em
}

.navbar-link:not(.is-arrowless)::after {
    border-color: var(--groc-900);
}

.navbar-end .navbar-link:not(.is-arrowless)::after {
    border-color: var(--negre);
}

.navbar-item,
.navbar-link {
    color: var(--negre);
}

.navbar-item.is-mega {
    position: static;
}

.navbar-item.is-mega .is-mega-menu-title {
    margin-bottom: 0;
    margin-top: 1rem;
    padding: .375rem .5rem;
    text-transform: uppercase;
    color: var(--groc-500);
}

.navbar-item.is-mega .is-mega-menu-title a {
    color: var(--groc-500);
}

.navbar-dropdown .navbar-item .is-mega .navbar-item {
    padding: 0
}

.is-mega .navbar-dropdown {
    background-color: var(--negre);
    padding-bottom: 1rem;
}

.is-mega a.navbar-item {
    color: var(--gris-clar);
    border-bottom: 2px solid var(--gris-fosc);
    display: block;
    line-height: 1.5;
    padding: .2rem .5rem;
    position: relative;
    overflow: hidden;
    text-overflow: ellipsis;
}

.is-mega a.navbar-item.es-oferta {
    background-color: var(--rosa);
    border-color: var(--rosa);
}

.is-mega a.navbar-item.es-oferta:before {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: var(--font-standard);
    content: '%';
    font-size: var(--font-medium);
    font-weight: 900;
    margin-right: .25em;
}


/* menu idiomes i divisa */

#barramenu1 .navbar-end .navbar-dropdown,
#barramenu1 .navbar-end .navbar-dropdown .navbar-item,
#barramenu1 .navbar-end .navbar-link:hover,
#barramenu1 .navbar-item.has-dropdown:hover .navbar-link {
    background-color: white;
    color: var(--negre);
    font-size: var(--font-small)
}


/* pq es vegin els menus al edge */

@media (min-width: 1024px) {
    .navbar-item.is-hoverable:hover .navbar-dropdown {
        display: block;
    }
}

@media screen and (max-width: 1023px) {
    #menuPrincipal {
        background-color: var(--negre);
        padding-top: .75rem;
        padding-bottom: .75rem;
    }
    #menuPrincipal .column {
        padding: 0 .75rem;
    }
    #menuPrincipal .navbar-item,
    #menuPrincipal .navbar-link {
        color: white;
        background-color: var(--negre);
    }
    #menuPrincipal .button {
        color: var(--gris-clar)
    }
    #menuPrincipal .button.is-selected {
        color: var(--negre)
    }
    #menuPrincipal .navbar-item {
        padding: 0.25rem 1rem;
        border-bottom: 1px solid var(--gris-fosc);
    }
    #menuPrincipal .navbar-item.has-dropdown {
        padding: 0;
    }
    #menuPrincipal .navbar-item.has-dropdown:last-child {
        margin-bottom: 1rem;
    }
    #menuPrincipal .navbar-item {
        border-bottom: 1px solid var(--gris-fosc);
    }
    #menuPrincipal .navbar-item.has-dropdown {
        border: none;
    }
    .navbar-dropdown {
        padding-top: 0;
    }
    .navbar-dropdown .navbar-item {
        padding: 0;
        margin: 0
    }
    .navbar-menu {
        padding: 0;
    }
    .navbar-item.is-mega .is-mega-menu-title {
        padding: 0.12rem 1rem;
    }
    #menuPrincipal .navbar-item.ofertes,
    #menuPrincipal .navbar-item.selectorLlavors,
    #menuPrincipal .navbar-item.elMeuCompte {
        padding: 0 1rem;
    }
    #menuPrincipal .navbar-item.ofertes:before,
    #menuPrincipal .navbar-item.selectorLlavors:before,
    #menuPrincipal .navbar-item.elMeuCompte:before {
        font-family: "Material Icons";
        /* abans Sharp */
        content: "local_offer";
        vertical-align: middle;
        margin-right: .125em;
        color: var(--oferta);
        font-size: 1.5rem;
    }
    #menuPrincipal .ac-a .navbar-item:last-child {
        border-color: none;
    }
    #menuPrincipal .navbar-item.selectorLlavors:before {
        content: "search";
        color: var(--groc-corporatiu);
    }
    #menuPrincipal .navbar-item.elMeuCompte:before {
        content: "person";
        color: var(--groc-corporatiu);
    }
}

@media screen and (min-width: 1088px) {
    .navbar-dropdown {
        background-color: var(--negre);
    }
}

.search-box input {
    cursor: pointer;
    width: 8rem;
    color: var(--gris);
    display: inline-block;
    border: 1px solid var(--groc-corporatiu);
    border-radius: 2px;
    font-size: .9rem;
    line-height: 2rem;
    padding: 0 .5rem 0 2rem;
    outline: none;
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
    background: #fff url(/static/img/lupa-cercador.svg) .6rem .5rem no-repeat;
    background-size: 1rem;
}


/* suggeriments en el botó de cerca */

#suggestions {
    display: none;
    position: absolute;
    top: 2.25rem;
    left: 1rem;
    display: inline-block;
    font-size: var(--font-small);
}

.navbar-item #suggestions img {
    width: fit-content;
    height: auto;
    max-height: 500px;
}

#searchresults {
    background-color: white;
    padding: 1em;
    width: 33vw;
    border-radius: 5px;
    -webkit-box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.1);
    line-height: 1.4em;
}

#searchresults a {
    top: 100%;
    left: 0;
    right: 0;
    display: block;
    padding: 0.2em 0;
    color: var(--negre);
}

#searchresults a:hover {
    color: #111;
}

#searchresults a:last-child {
    border-top: 1px solid var(--gris-clar);
    margin-top: 1em;
    padding: .5em 0 0;
    color: var(--groc-900);
}

#searchresults a:last-child:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "search";
    vertical-align: middle;
    margin-right: .1em;
    font-size: var(--font-normal);
}

#searchresults .menu-label {
    border-bottom: 1px solid var(--gris-clar);
    margin-bottom: 0.25em;
    padding-bottom: 0.25em;
    display: block;
}

#searchresults a.afinarCerca,
#searchresults a.correccioCerca,
#searchresults .infoCerca {
    display: flex;
    font-size: var(--font-small);
    font-style: oblique;
    color: var(--gris);
}

#searchresults a.afinarCerca,
#searchresults .campanyaCerca {
    padding: 0.5em;
    background-color: var(--groc-100);
    margin-bottom: 0.5em;
    border-radius: 3px;
}

#searchresults a.correccioCerca,
#searchresults a.afinarCerca strong {
    color: var(--groc-900);
}

#searchresults .campanyaCerca {
    background-color: var(--oferta);
    color: white;
    font-weight: 700;
}

a.afinarCerca:before,
a.correccioCerca:before,
.infoCerca:before,
.blogCerca:before,
.videoCerca:before,
.campanyaCerca:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "search";
    vertical-align: top;
    margin-right: .15em;
    color: var(--groc-900);
    font-weight: normal;
    font-size: 1.5em;
    font-style: normal;
    padding-top: .15em;
}

.infoCerca:before {
    content: "info";
    font-size: 1.25em;
    margin-right: .35em;
    padding-top: 0;
}

.blogCerca:before {
    content: "subject";
    font-size: 1.25em;
    color: var(--gris);
}

.videoCerca:before {
    content: "videocam";
    font-size: 1.25em;
    color: var(--gris);
}

.campanyaCerca:before {
    content: "local_offer";
    font-size: 1.25em;
    color: white;
}

#resultatscerca .notification a.campanyaCerca {
    text-decoration: none;
    color: var(--negre);
    font-weight: bold;
    font-size: var(--font-medium)
}

#resultatscerca .campanyaCerca:before {
    font-size: 1.25em;
    color: var(--oferta);
}

@media screen and (max-width: 768px) {
    #suggestions {
        left: 1rem;
        top: 2rem;
        margin-right: 4.1rem
    }
    #searchresults {
        width: 100%
    }
}

.pagResultatsCerca section {
    padding: 0.5rem 0;
}

.pagResultatsCerca>.container>h2.subtitle {
    margin-bottom: 1.5em;
    text-transform: uppercase;
    font-size: 1rem;
    color: var(--negre);
}

.pagResultatsCerca>.container>h2.subtitle:before {
    font-family: "Material Icons";
    content: "search";
    font-size: 150%;
    line-height: 100%;
    vertical-align: middle;
    text-transform: none;
    background-color: var(--groc-corporatiu);
    padding: 0.25em;
    color: var(--negre);
    font-weight: bold;
    margin-right: 0.33em;
    border-radius: 50%;
}

.pagResultatsCerca #llistatCategories .producte-info h4 a {
    font-weight: bold;
    font-size: var(--font-small);
}

.pagResultatsCerca .tags {
    justify-content: flex-start;
}

.pagResultatsCerca .notification a.campanyaCerca {
    text-decoration: none;
    color: var(--negre);
    font-weight: bold;
    font-size: var(--font-medium);
}

.pagResultatsCerca .campanyaCerca:before {
    font-size: 1.25em;
    color: var(--oferta);
}

#resultatscerca #videos h2.subtitle {
    font-size: var(--font-normal);
    margin-bottom: 1rem;
}

#resultatsBlog .subtitle {
    font-size: var(--font-normal);
    margin-bottom: 1rem;
}

#resultatsBlog .card {
    height: 100%;
    display: flex;
    flex-direction: column;
}

#resultatsBlog .card-footer {
    display: flex;
    justify-content: space-between;
    font-size: var(--font-small);
    border-top: 1px dotted var(--gris-clar);
    padding: 0.75rem 1.5rem 1rem;
    margin-top: auto;
    color: var(--gris);
}

#resultatsBlog .card-footer a {
    color: var(--gris);
    border-bottom: 2px solid transparent;
}

#resultatsBlog .card-footer a:hover {
    color: var(--negre);
    border-bottom: 2px solid var(--groc-500);
}


/* efecte acordió en menú principal, versió mobile */

@media screen and (min-width: 1024px) {
    #menuPrincipal .ac-a {
        height: auto !important;
    }
}

@media screen and (max-width: 1023px) {
    #menuPrincipal {
        max-height: calc(100vh - 3.25rem);
        overflow-y: auto;
    }
    #catalegDropdown .ac {
        width: 100%;
    }
    #catalegDropdown .ac .ac-a {
        width: 100%;
    }
    #catalegDropdown .ac {
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width: auto;
        border-bottom: 1px solid var(--gris-fosc);
    }
    #catalegDropdown .ac .ac-q {
        text-decoration: none;
        display: block;
        cursor: pointer;
        position: relative;
    }
    #catalegDropdown .ac .ac-q::after {
        /*   content: '\25bc';
    text-align: center;
    width: 1rem;
    right: 0rem;
    top: 50%;
    padding: 1rem;
    margin: 0 1rem;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    position: absolute;
    font-size: 1rem;
    color: white;
*/
        position: absolute;
        right: 0rem;
        top: 0%;
        margin: 0 1rem;
        font-family: 'Material Icons';
        content: 'keyboard_arrow_down';
        color: var(--groc-900);
        font-weight: normal;
        font-style: normal;
        font-size: 1.5rem;
        /* Preferred icon size */
        line-height: 1;
        text-transform: none;
        letter-spacing: normal;
        word-wrap: normal;
        white-space: nowrap;
        padding: 0.25rem 0;
        /* Support for all WebKit browsers. */
        -webkit-font-smoothing: antialiased;
        /* Support for Safari and Chrome. */
        text-rendering: optimizeLegibility;
        /* Support for Firefox. */
        -moz-osx-font-smoothing: grayscale;
        /* Support for IE. */
        font-feature-settings: 'liga';
    }
    #catalegDropdown .ac.is-active>.ac-q::after {
        content: 'keyboard_arrow_up';
        /* '\2013'; */
    }
    #catalegDropdown .ac .ac-a {
        overflow-y: scroll;
        -webkit-transition-property: all;
        transition-property: all;
        -webkit-transition-timing-function: ease;
        transition-timing-function: ease;
    }
    #catalegDropdown .ac.js-enabled>.ac-a {
        visibility: hidden;
    }
    #catalegDropdown .ac.is-active>.ac-a {
        visibility: visible;
        margin-bottom: 0rem;
    }
    #catalegDropdown .ac .title {
        margin: 0;
    }
    #catalegDropdown .ac .title a {
        display: block;
        padding: .25rem 0
    }
    /*
#catalegDropdown #ac-0 h3 {padding: .5rem 1rem .5rem; }
*/
    .is-mega .navbar-dropdown {
        padding-bottom: 0;
    }
}


/* Banner de text sota barra menu principal i barra Avisos Top ******************************************/

#barraBanner,
#barraAvisos {
    background-color: var(--rosa);
    /*color: var(--groc-500);*/
    color: white;
    padding: .5em .75rem;
    font-size: var(--font-small);
    text-align: center;
    overflow-x: hidden;
}

#barraAvisos {
    background-color: var(--negre);
    color: var(--gris-ultraclar);
    padding: 1rem;
}

#barraBanner strong,
#barraAvisos strong {
    font-weight: 900;
    color: inherit;
}

#barraBanner a,
#barraAvisos a {
    color: inherit;
}

#barraBanner .fiPromo {
    margin-left: .5em;
    color: white;
    opacity: .66;
    font-style: italic;
}

#barraBanner .fiPromo::before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "timer_off";
    margin-right: .25em;
    vertical-align: top;
    font-style: normal;
}


/* afegit per alinear verticalment el marquee */

#barraBanner .swiper-wrapper {
    align-items: center
}


/*
#cercadorTop { width: 100% }
#cercadorTop input { width: 100%; border-color: var(--groc-600); border-radius: 1px}
#cercadorTop .control.has-icons-left .icon {top: 1em} */

#menuPrincipal .control.has-icons-left .icon {
    height: 2.5rem;
}

#cercadorTop2 {
    width: 100%
}

#cercadorTop2 input {
    width: 100%;
    border-color: var(--groc-600);
    border-radius: 1px;
    border-top-left-radius: 50px;
    border-bottom-left-radius: 50px;
    padding-left: 1.5rem;
}

#cercadorTop2 .button {
    border-top-right-radius: 50px;
    border-bottom-right-radius: 50px;
    background-color: var(--groc-900);
    border-color: var(--groc-500);
    border-left: none;
    color: white;
}

#formSearch {
    margin-bottom: 0;
}

.navbar-brand,
.navbar-tabs,
.navbar,
.navbar>.container {
    min-height: 2.25rem
}

.navbar-item,
.navbar-link {
    line-height: 1.5;
    padding: .25rem .75rem;
}

#iconesMobile.navbar-item {
    width: calc(100% - 197px);
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

#iconesMobile .navbar-item:last-child {
    padding-right: 0
}


/*
#iconesMobile i {font-size: 1.33em}
*/

.navbar-burger span {
    height: 3px
}


/*text sota hamburguer*/

.navbar-burger span.titolmenu {
    font-size: .5rem;
    background-color: transparent;
    top: 32px;
    left: calc(50% - 9.5px)
}


/* num articles sobre icona carrito */

i.badge:after {
    content: attr(value);
    font-family: var(--font-standard);
    background: var(--rosa);
    font-size: 50%;
    padding: .1em .5em;
    border-radius: 999px;
    line-height: .75em;
    color: white;
    text-align: center;
    min-width: 2em;
    font-weight: normal;
    position: relative;
    left: -.75em;
    top: -1.33em;
    opacity: 0.85;
}


/*
.avisos i { color: var(--negre)}

.avisos i.badge:after{background-color: white; backcolor: var(--rosa); font-weight: bold; border: 1px solid var(--groc-800);}
*/

.container.estret {
    max-width: 768px;
    margin: 0 auto;
}

#barramenu1 {
    padding: .5rem 0 .25rem;
}

#barramenu1 .navbar-start {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
}

#barramenu2 .navbar {
    z-index: 20
}

@media screen and (max-width: 1023px) {
    #barramenu1 .navbar-menu {
        display: inherit;
        background-color: var(--groc-corporatiu)
    }
    #barramenu1,
    #barramenu1 .navbar-item {
        padding: 0;
    }
    #barramenu1 .navbar-item input {
        border: none;
    }
    #barramenu1 .control.has-icons-left .icon {
        /*color: var(--groc-A700);*/
    }
    .navbar-brand .navbar-item {
        padding-left: 0;
    }
    /*
#cercadorTop input {height: 2.5em}
#cercadorTop i {font-size: 1.25rem; }
*/
    /*
#cercadorTop2 {padding: 0;}

#cercadorTop2 input { 
  width: 100%; 
  border-radius: 0;
  padding-left: 1rem; 
  font-size: 1.25rem;
}
#cercadorTop2 .button {
  border-radius: 0;
  background-color: white;
  border: none;
  color: var(--gris);
  box-shadow: inset 0 1px 2px rgba(10,10,10,.1);
  font-size: 1.25rem;

}
*/
    #cercadorTop2 {
        padding: 0 .75rem .5rem;
    }
    .hero-body {
        padding: 0;
    }
}


/* Menu bancs ****************************************************/


/* menu bancs amb scroll */

#bancsDropdown {
    max-height: 85vh;
    overflow-y: auto;
}

ul.menubancs3 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    margin: 0;
}

ul.menubancs3 li {
    width: calc(100% / 5 - 1%);
    list-style: none;
    margin-right: 1%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

ul.menubancs3 li.destacat a {
    font-weight: bold;
    font-weight: normal;
    color: var(--groc-500);
}

ul.menubancs3 li.destacat a:hover {
    color: var(--negre);
}

ul.menubancs3 li.destacat a::before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "grade";
    margin-right: .25em;
    vertical-align: middle;
}

@media screen and (max-width: 1087px) {
    ul.menubancs3 li {
        /*flex: 1 0 calc(21%);*/
        width: 48%;
        list-style: none;
        margin-right: 1%;
    }
}


/* Menú filtres, versió mobile ********************************************* */

.modalMenuEMobile {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 990;
}

.modalMenuEMobile .overlay {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 995;
    background: rgba(0, 0, 0, 0.85);
}

.modalMenuEMobile .modal_content {
    z-index: 999;
    position: fixed;
    top: 0;
    left: 0;
    overflow-y: auto;
    background: #fff;
    padding: 1rem;
    /* box-shadow: 0 1px 5px rgba(0,0,0,0.7); */
    box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
    width: 75vw;
    height: 100%;
    min-width: 288px;
}

.modalMenuEMobile .modal_content .buttons_wrapper {
    padding: 20px;
}

.modalMenuEMobile .close_modal {
    position: absolute;
    right: 10px;
    top: 10px;
    cursor: pointer;
    font-size: 18px;
    opacity: 0.5;
    background: none;
    border: none;
    transition: opacity 0.2s ease;
}

.modalMenuEMobile .close_modal:hover {
    opacity: 0.9;
}

#menuFiltres .control {
    margin: 0 0 2rem
}

#menuFiltres input[type="radio"],
#menuFiltres input[type="checkbox"] {
    opacity: 0;
    position: absolute;
    left: -10000px;
}

#menuFiltres input[type="radio"]+.custom-label,
#menuFiltres input[type="checkbox"]+.custom-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 2px solid var(--gris-ultraclar);
}

#menuFiltres input[type="radio"]:checked+.custom-label,
#menuFiltres input[type="checkbox"]:checked+.custom-label {
    /* border-color: var(--groc-500); */
}

#menuFiltres input[type="radio"]+.custom-label:after,
#menuFiltres input[type="checkbox"]+.custom-label:after {
    font-family: 'Material Icons';
    content: 'check_box_outline_blank';
    font-size: 150%;
    color: var(--gris-clar);
    width: 1.5rem;
    line-height: 125%;
}

#menuFiltres input[type="radio"]:checked+label,
#menuFiltres input[type="checkbox"]:checked+label {
    color: var(--negre);
    /*background-color: var(--groc-A100)*/
}

#menuFiltres input[type="radio"]:checked+.custom-label:after,
#menuFiltres input[type="checkbox"]:checked+.custom-label:after {
    content: 'check_box';
    font-size: 150%;
    color: var(--negre);
}


/* el núm productes en gris */

#menuFiltres .custom-label span span,
aside .filtres li label span span {
    color: var(--gris);
    font-size: var(--font-xsmall);
}

aside .filtres .button {
    margin-top: .75rem;
}


/* 
#menuFiltres input[type="checkbox"] + .custom-label:after  { content: 'check_box_outline_blank'}
#menuFiltres input[type="checkbox"]:checked + .custom-label:after {content: 'check_box' } 
*/

.sticky-top {
    position: -webkit-sticky;
    position: sticky;
    top: 0
}

.sticky-bottom {
    position: -webkit-sticky;
    position: sticky;
    bottom: 0
}


/* menu filtres desktop *************************************************************************************/

aside .filtres {
    font-size: var(--font-small);
    position: -webkit-sticky;
    position: sticky;
    top: 7rem;
}

aside .filtres li {
    margin-bottom: .25em;
    padding-bottom: .25em;
    border-bottom: 1px dotted var(--gris-clar);
}

aside .filtres li:last-child {
    border-bottom: none;
}


/* menu categoria */

#menuCat .menu-list li a {
    padding: 0.25em 0;
}

#menuCat .menu-list li a:hover {
    background: none;
    color: var(--negre);
}


/* llistat filtres actius, previs al contingut */

.filtresActius {
    margin-bottom: 1rem;
    padding: 0 1.5%;
}


/* 4 blocs botiga inici home ************************************ */

#home-seccions-botiga a {
    display: block;
    padding: 0.75rem;
    height: 100%;
    background-color: var(--groc-corporatiu);
    color: var(--negre);
    transition: .2s ease;
}

#home-seccions-botiga a {
    color: var(--negre);
}

#home-seccions-botiga a:hover {
    background-color: var(--negre);
}

#home-seccions-botiga a:hover h3 {
    color: var(--groc-corporatiu);
}

#home-seccions-botiga a:hover p {
    color: var(--gris-ultraclar);
}

#home-seccions-botiga h3 {
    font-size: 2.25rem;
    font-size: 3vw;
    font-weight: 900;
    line-height: 100%;
    letter-spacing: -.05em;
    text-align: center;
    margin-bottom: 0.25rem;
}

#home-seccions-botiga p {
    font-size: var(--font-small);
}

p.home-intro {
    text-align: center;
    margin: 0 12.5%;
}

@media screen and (max-width: 768px) {
    #home-seccions-botiga h3 {
        font-size: 7vw;
    }
    #home-seccions-botiga.columns {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    #home-seccions-botiga .column {
        max-width: 50%;
        padding: 0.25rem;
    }
    p.home-intro {
        text-align: left;
        margin: 0;
    }
}


/* formulari subscripcioins home *****************************************/

#form-subscripcio-home {
    background-color: var(--negre);
    color: var(--gris-ultraclar);
    padding: 1rem;
    height: 100%;
}

#form-subscripcio-home .title {
    color: var(--gris-ultraclar);
    font-weight: 900;
    margin: 0;
}

#form-subscripcio-home a:hover {
    color: var(--groc-corporatiu);
}

#form-subscripcio-home .field {
    margin: .5rem 0;
}

#form-subscripcio-home input[type="checkbox"].material:hover+label,
input[type="radio"].material:hover+label {
    color: white;
}

#form-subscripcio-home input[type="checkbox"].material:checked+label:before {
    color: var(--groc-900);
}


/* footer ************************************************************************/

#pre-footer {
    background: url('/static/img/peu-growing-happiness.svg') bottom no-repeat;
    min-height: 100px;
    margin-top: 4rem;
}

.footer {
    background: var(--groc-corporatiu) url('/static/img/somriure-peu.svg') bottom no-repeat;
    padding: 3rem 1.5rem;
}

.footer,
.footer a {
    color: var(--negre)
}

.footer .content p,
.footer ul {
    margin: 0;
    padding: 0;
}

.footer ul li .material-icons {
    font-size: 1.25rem;
    font-family: 'Material Icons';
    /* abans Sharp */
    line-height: 1.5rem;
    vertical-align: middle;
}

.footer li {
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer li.footer-title,
.footer address {
    font-style: normal
}

.footer p.footer-title {
    margin-bottom: 1em
}

.footer hr {
    background-color: var(--groc-100);
    height: 1px
}

.icona::before {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    margin-right: 0.25em;
    line-height: 1.5rem;
    vertical-align: middle;
    font-size: 1.25rem
}

.email::before {
    font-family: 'Material Icons';
    /* abans Sharp */
    content: "email";
}

.horari::before {
    font-family: 'Material Icons';
    /* abans Sharp */
    content: "access_time";
}

.adreca::before {
    font-family: 'Material Icons';
    /* abans Sharp */
    content: "location_city";
}

.telefon::before {
    font-family: 'Material Icons';
    /* abans Sharp */
    content: "phone";
}

.peu-xarxes img,
.peu-targes img {
    height: 2rem;
}

.peu-targes {
    text-align: center;
}

.peu-xarxes {
    text-align: right;
}

@media (max-width: 768px) {
    .peu-xarxes {
        text-align: center;
    }
    #pre-footer {
        min-height: 50px;
        margin-top: 1rem;
    }
}


/* Llistat de productes *************************************************** */


/*
#ContenidorProductes {padding-top: 1rem;}
*/

.productes-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    padding: 30px 0 10px;
}

.productes-header h2 {
    margin: 0;
    line-height: 125%;
}

.productes,
.productes-cat {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    /*padding: 1%;
background-color: #F5F5F5; */
}

.producte-card {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    /*-webkit-box-flex: 1;
-ms-flex: 1 1 30%;
flex: 1 1 30%;*/
    width: calc(100% / 3 - 2%);
    background-color: #FFF;
    /*-webkit-box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.25);
box-shadow: 0px 0px 1px 0px rgba(0,0,0,0.25); */
    position: relative;
    /* per poder ubicar la cinta */
    border: 0px solid #ddd;
    border-radius: 3px;
    margin: 1%;
    -webkit-box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.1);
}

.destaquem .producte-card {
    margin: 0;
}

.productes.graella .producte-card,
#productes-recomendator .producte-card,
#bancs.productes.graella .producte-card,
#bancs .producte-card {
    width: calc(100% / 6 - 1%);
    margin: 0.5%;
    font-size: var(--font-small);
}


/* Microsoft Edge Browser 12+ (All) - @supports method */

@supports (-ms-ime-align:auto) {
    .productes.graella .producte-card,
    #productes-recomendator .producte-card,
    #bancs.productes.graella .producte-card,
    #bancs .producte-card {
        width: calc(100% / 6 - 1.01%);
    }
}

#bancs.productes.graella .producte-card,
#bancs .producte-card {
    width: calc(100% / 8 - 1%);
}


/*
#cargaResultats .productes.graella .producte-card { 
  width: calc(100% / 5 - 1%);
}
*/

.productes-cat s,
.destaquem s {
    font-weight: normal;
    color: var(--gris-fosc);
}

.productes-cat .preu,
.destaquem .preu {
    text-align: right
}


/*compte enrere i ofertes flash*/

.rellotge {
    background-color: var(--gris-ultraclar);
    color: var(--rosa);
    padding: .25em;
    margin-top: .5em;
    text-align: center;
    font-family: var(--font-family-monospace);
    border-radius: 3px;
    font-weight: 900;
}

.rellotge:before {
    font-family: 'Material Icons';
    /* abans Sharp */
    content: 'timer_off';
    font-size: 100%;
    line-height: 100%;
    vertical-align: middle;
    margin-right: 0.5em;
    color: var(--rosa);
    font-weight: 900
}

.producte-card.flash {
    background-color: var(--rosa);
    color: white;
}

.producte-card.flash .producte-imatge:after {
    border-bottom-color: var(--rosa);
}

.producte-card.flash a,
.producte-card.flash .producte-info a.mes-info,
.producte-card.flash ul.producte-preu-llista li span.oferta,
.producte-card.flash ul.producte-preu-llista li span.oferta s {
    color: white;
}

.productes-cat .producte-card.flash .cinta {
    background: white;
    color: var(--oferta);
}

@media screen and (max-width: 768px) {
    .productes.graella .producte-card,
    #productes-recomendator .producte-card,
    #bancs.productes.graella .producte-card,
    #bancs .producte-card,
    #llistatCategories .producte-card {
        width: calc(100% / 3 - 2%);
        margin: 1%;
    }
    .productes.carouselMobile {
        flex-wrap: nowrap;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        -ms-overflow-style: -ms-autohiding-scrollbar;
    }
    .productes.carouselMobile .producte-card {
        min-width: calc(100% / 3.5 - 1%);
        margin: 1%;
    }
}

@media screen and (max-width: 600px) {
    .productes.graella .producte-card,
    #productes-recomendator .producte-card,
    #bancs.productes.graella .producte-card,
    #bancs .producte-card,
    #llistatCategories .producte-card {
        width: calc(100% / 2 - 3%);
        margin: 1.5%;
    }
    .productes.carouselMobile .producte-card {
        min-width: calc(100% / 2.5 - 1%);
        margin: 1%;
    }
}


/* versió horitzonal categories */

.productes-cat {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    padding: .5rem;
    background-color: var(--gris-ultraclar);
}

.productes-cat .producte-card,
.destaquem .producte-card {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    width: calc(100% / 2 - 2%);
}

.destaquem .producte-card {
    width: 100%
}

@media screen and (max-width: 768px) {
    .productes-cat {
        padding: 0;
        background-color: transparent;
    }
    .productes-cat .producte-card {
        width: 100%;
    }
}


/* destacat a portada  en carousel versió mobile i fix en desktop */

.destaquem {
    padding: .5rem 1rem;
}

.destaquem .title {
    font-weight: 900;
    margin: 0 0 .75rem
}

@media screen and (max-width: 768px) {
    #form-subscripcio-home,
    .destaquem {
        padding: .5rem;
    }
}


/*
.carousel {
   display: flex;
   flex-wrap: nowrap;
   overflow-x: auto;
   -webkit-overflow-scrolling: touch;
   -ms-overflow-style: -ms-autohiding-scrollbar; 
}

.carousel .producte-card {

  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;

flex: 0 0 auto; 
width: calc(100% / 1.15);
}

.carousel .producte-imatge {max-width: 33%}
.carousel .producte-imatge:after {content: none}
.carousel .producte-info {font-size: var(--font-small); padding: 1rem;}
.carousel .oferta s {color: var(--gris) ; font-weight: normal}

.carousel .producte-card p {display: none; }




@media screen and (min-width: 769px) {

.carousel {
   display: flex;
   flex-wrap: nowrap;
   overflow-x: hidden;
   -webkit-overflow-scrolling: touch;
   -ms-overflow-style: -ms-autohiding-scrollbar; 
}

.carousel .producte-card {
width: calc(100%);
}

}

*/


/* caixa de producte en col dreta */

#coldreta .producte-card {
    width: auto;
}

#productes-ofertes {
    padding: 1%;
    /*  background: #FFEA00;
background: -webkit-linear-gradient(45deg, #FBC02D, #FFF176);
background: -o-linear-gradient(45deg, #FBC02D, #FFF176);
background: linear-gradient(45deg, #FBC02D, #FFF176);
background: #DE0021;
background: #212121;
background: #757575;
background: #FFDE03;
*/
    border-radius: 3px;
}


/* els dos primers de les ofertes a dues columnes 
#productes-ofertes .producte-card:first-child, 
#productes-ofertes .producte-card:nth-child(2) { 
-webkit-box-flex: 2; 
-ms-flex: 2 46%; 
flex: 2 46%;
}
*/

#llistatCategories .producte-card {
    /* 4columnes */
    /* -webkit-box-flex: 1;
-ms-flex: 1 1 23%;
flex: 1 1 23%; */
    width: calc(100% / 8 - 2%);
    font-size: var(--font-small)
}

span.no-traduccio {
    display: block;
    font-size: var(--font-small);
    background-color: var(--gris-ultraclar);
    padding: 0.5em;
    border: 1px solid var(--gris-clar);
    margin: .5em 0;
    border-radius: 3px
}

span.no-traduccio img {
    float: left;
    max-width: 18px;
    margin: 0.33em 0.33em 0 0
}


/* llistat subcategories a cat.php */

.section.subcategories {
    background-color: var(--gris-ultraclar);
    margin-bottom: 1rem;
    padding: 1rem;
    border-radius: 3px
}

.section.subcategories .subtitle {
    font-weight: bold;
    color: var(--negre);
    margin-bottom: 0;
}

#llistatCategories .producte-card {
    width: calc(100% / 4 - 1%);
    /*border: 1px solid var(--gris-clar);*/
    flex-direction: row;
}

#llistatCategories .producte-imatge {
    width: 80px;
    min-width: 80px;
    margin-bottom: 0;
}

#llistatCategories .producte-imatge:after {
    display: none
}

#llistatCategories figure {
    border: 0px solid var(--gris-fosc)
}

#llistatCategories .producte-info {
    padding: .5rem 1rem 1rem .5rem
}

#llistatCategories .producte-info h4 {
    margin: 0
}

#llistatCategories .producte-info h4 a {
    color: var(--gris-fosc);
    font-size: var(--font-normal);
    line-height: 1.33em;
    font-weight: bold
}

#llistatCategories .producte-info h4 a:hover {}

@media screen and (max-width: 768px) {
    #home #bancs .producte-card,
    #bancs .producte-card {
        width: calc(100% / 3 - 2%);
        margin: 1%;
    }
    #llistatCategories .producte-card {
        width: calc(100% / 2 - 2%);
        margin: 1%;
    }
}

@media screen and (max-width: 600px) {
    #home #bancs .producte-card,
    #bancs .producte-card {
        width: calc(100% / 2 - 3%);
        margin: 1.5%;
    }
    #llistatCategories .producte-card {
        width: 100%;
        margin: 1% 0;
    }
}

.producte-card img {
    width: 100%;
}

// productes sense estoc
.producte-card.disabled {
    color: var(--gris);
}

.producte-card.disabled .producte-info h4 a {
    color: var(--gris);
    border: none;
}

.producte-card.disabled .cinta {
    background-color: var(--gris-fosc)
}

.producte-card.disabled figure img {
    filter: grayscale(100%) opacity(.66);
}

.producte-card.disabled a.mes-info {
    color: var(--negre);
}

#tabDescripcio,
#fitxaCategoria .content,
.textColumnes {
    -webkit-columns: 2 360px;
    -moz-columns: 2 360px;
    columns: 2 360px;
}

#tabDescripcio p,
#fitxaCategoria .content p,
#tabDescripcio h3,
#fitxaCategoria .content h3 {
    orphans: 2;
    widows: 2;
}

#fitxaCategoria .bannercat img {
    margin-bottom: 1rem;
}

.llistatCategories2.tags {
    justify-content: center
}

.llistatCategories2 .tag {
    background-color: var(--groc-500);
    overflow-x: auto;
    text-overflow: ellipsis;
    justify-content: flex-start;
}

.llistatCategories2 .tag a {
    color: var(--gris-fosc);
    font-weight: bold;
}

.subcategories2 h2.subtitle {
    font-size: var(--font-small);
    text-transform: uppercase;
    color: var(--gris);
    margin: 1rem 0;
    text-align: center
}

.bannercat2 .column {
    padding-bottom: 0;
}

.logobanc .image img {
    max-height: 125px;
    width: auto
}

.logobanc .image img {
    margin: 0 auto;
}

.fonsbanerbanc h1 {
    text-align: center
}

@media screen and (min-width: 769px) {
    .bannercat2 {
        padding-left: .75rem;
        padding-right: .75rem;
        border-radius: 5px;
    }
    .fonsbanerbanc h1 {
        font-size: 3vw;
        font-weight: 900;
        color: var(--gris-fosc);
        text-align: right;
        line-height: 1;
    }
    .logobanc .image img {
        margin: 0;
    }
}

.logoCatBanc img {
    padding-right: 1.5rem;
}

#fitxaCategoria h1.title {
    margin-bottom: 0.25em;
}

.productes-cat {
    padding: 0;
    background-color: transparent;
}

.llistatCategories2 .tag {
    background-color: var(--groc-500);
    overflow-x: auto;
    text-overflow: ellipsis;
    justify-content: flex-end;
}

.llistatCategories2 a.tag {
    color: var(--gris-fosc);
    font-weight: bold;
}

.tabs:not(:last-child) {
    margin-bottom: 1rem;
}

.column.filtres {
    text-align: right;
}

#tabProductes .column {
    flex-basis: auto;
}

@media screen and (max-width: 768px) {
    .column.logoCatBanc {
        padding-bottom: 0;
        padding-top: .5em;
    }
    .logoCatBanc img {
        padding: 0;
        max-height: 25vh;
    }
    .tags {
        justify-content: flex-start
    }
    .llistatCategories2 .tag {
        background-color: var(--groc-500);
        overflow-x: auto;
        text-overflow: ellipsis;
        justify-content: flex-start;
    }
    .column.filtres {
        text-align: left;
        padding-top: 0;
    }
    #tabProductes .column {
        padding-bottom: 0;
    }
}

@media screen and (min-width: 769px) {
    #etiquetesCat .tags,
    #fitxaCategoria .tags {
        justify-content: flex-end
    }
}


/* retallem la imatge per fer-la quadrada */

.productes figure {
    width: 100%;
    height: 0;
    min-height: 1px;
    padding-bottom: 100%;
    position: relative;
}

.productes figure img {
    bottom: 0;
    height: 100%;
    left: 0;
    object-fit: cover;
    object-position: center;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}

#bancs.productes figure img {
    object-fit: scale-down;
}


/* triangle sobre la imatge en miniatura */

.producte-imatge {
    margin-bottom: -1rem;
}

.producte-imatge:after {
    content: "";
    width: 0;
    height: -1rem;
    border-top: .5rem solid transparent;
    border-left: .5rem solid transparent;
    border-right: .5rem solid transparent;
    border-bottom: .5rem solid white;
    position: relative;
    top: -1.65rem;
    left: .65rem;
    border-style: inset;
}

.destaquem .producte-imatge:after {
    content: none;
}

.destaquem .producte-imatge {
    margin-bottom: 0;
}

.producte-info {
    /*margin-top: auto;*/
    padding: 2.5% 7.5% 7.5%;
    text-align: left;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    height: 100%
}

.producte-info h3,
.producte-info h4,
.producte-info h5 {
    line-height: 1.25em;
    font-weight: bold;
}

.producte-info p {
    line-height: 1.25em;
    padding: .1em 0;
}

.producte-card p {
    margin: 0;
    padding: 0;
}

.productes-cat .producte-info p {
    line-height: 130%;
}

.producte-info p.categoria {
    text-transform: uppercase;
    margin: .5em 0 0;
}

.producte-info a {
    color: var(--negre);
}

.producte-info a.mes-info {
    color: var(--groc-900);
}

.producte-info a.mes-info:after {
    font-family: 'Material Icons';
    /* abans Sharp */
    content: 'chevron_right';
    vertical-align: bottom;
}

.producte-info p.preu {
    font-weight: bold;
    font-weight: bold;
    padding-top: .5em;
}

.producte-info h3,
.producte-info h4,
.producte-info h5,
.producte-info p.oferta {}

.producte-info p.avis .fa,
.producte-info p.oferta,
ul.producte-preu-llista li span.oferta {
    color: var(--oferta);
}

ul.producte-preu-llista {
    text-align: left;
    list-style: none;
    padding-left: 0;
    /*margin-top: 10px;*/
    padding-top: .5em;
}

ul.producte-preu-llista li.esgotat {
    color: var(--gris-inactiu);
}

ul.producte-preu-llista li.esgotat::before {
    border-color: var(--gris-inactiu);
}

@media screen and (max-width: 768px) {
    ul.producte-preu-llista {
        font-size: var(--font-small);
    }
}

.producte-footer {
    border-top: 1px solid var(--gris-clar);
    margin-top: .5em;
    padding-top: .5em;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.producte-footer a {
    color: var(--gris);
}

.producte-footer a:first-child {
    color: var(--groc-900);
}

#areaUsuari .producte-footer i {
    margin: 0
}


/* llistat en horitzontal de categories i destacat portada */

.productes-cat .producte-card .producte-imatge,
.destaquem .producte-card .producte-imatge {
    width: 30%;
    padding: 1%;
}

.productes-cat .producte-card .producte-info,
.destaquem .producte-card .producte-info {
    width: 70%;
    padding: 2.5% 5% 5% 2%;
    height: auto;
}


/* llistat de preus amb linia de punts: https://codepen.io/sarahmonster/pen/qOrQEv */

ul.producte-preu-llista li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    line-height: 100%;
}

ul.producte-preu-llista li::before {
    border-bottom: 1px dotted #999;
    content: "";
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: 1em;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    margin: 0 3px;
}

ul.producte-preu-llista li span:first-child {
    font-weight: bold;
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    padding-top: 0.25em;
    margin-left: auto;
}


/*
.producte-info ul.producte-preu-llista li span:nth-child(2){ 
color: #de0021;
width: 100%;
-webkit-box-ordinal-group: 5;
-ms-flex-order: 4;
order: 4;
} 
*/


/* preu tatxat */

ul.producte-preu-llista li del {
    width: 100%;
    text-align: right;
    color: #666;
    -webkit-box-ordinal-group: 5;
    -ms-flex-order: 4;
    order: 4;
}


/* cinta ofertes diagonal */

.contenidor-cinta {
    width: 110px;
    height: 110px;
    overflow: hidden;
    position: absolute;
    top: 0px;
    right: 0px;
}

.cinta {
    background-color: var(--oferta);
    color: #fff;
    font-weight: 900;
    text-align: center;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    position: relative;
    padding: 4px 0;
    top: 12px;
    right: -30px;
    width: 110px;
    z-index: 10;
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .3);
    box-shadow: 0 0 3px rgba(0, 0, 0, .3);
}

.cinta.novetat {
    background-color: #8BC34A;
}

.cinta.petit {
    font-size: 100%;
    padding: .25rem 0;
}

.cinta span {
    font-size: var(--font-xsmall);
    font-weight: normal
}

.producte-card .avis {
    font-size: var(--font-xsmall);
}


/* pàg resultats cerca  *********************************************************/

#resultatscerca section {
    padding: .5rem 0;
}

#resultatscerca .container>h2.subtitle {
    margin-bottom: 1.5em;
    text-transform: uppercase;
    font-size: 1rem;
    color: var(--negre);
}

#resultatscerca .container>h2.subtitle:before {
    font-family: 'Material Icons';
    /* abans Sharp */
    content: 'search';
    font-size: 150%;
    line-height: 100%;
    vertical-align: middle;
    text-transform: none;
    background-color: var(--groc-corporatiu);
    padding: 0.25em;
    color: var(--negre);
    font-weight: bold;
    margin-right: 0.33em;
    border-radius: 50%
}

.#resultatscerca #llistatCategories .producte-info h4 a {
    font-weight: bold;
    font-size: var(--font-small);
}

#resultatscerca #videos h2.subtitle,
#resultatsBlog .subtitle {
    font-size: var(--font-normal);
    margin-bottom: 1rem;
}

#resultatsBlog .card {
    height: 100%;
}


/*paginació *************************/

ul.pagination2 {
    margin-top: 40px;
    padding-left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.pagination2 li {
    display: inline-block;
    border-radius: 2px;
    text-align: center;
    vertical-align: top;
    height: 30px;
}

.pagination2 li a,
.pagination2 li span {
    color: #444;
    display: inline-block;
    font-size: var(--font-small);
    padding: 0 10px;
    line-height: 30px;
    border: none;
}

.pagination2 li.active {
    background-color: var(--groc-corporatiu);
}

.pagination2 li.active a {
    color: var(--negre);
}

.pagination2 li.disabled a,
.pagination2 li.disabled span {
    cursor: default;
    color: #999;
}

.pagination2 .material-icons {
    vertical-align: middle
}

@media ( max-width: 768px) {
    .producte-card {
        width: calc(100% / 3 - 2%);
    }
}

@media ( max-width: 600px) {
    .producte-card {
        width: calc(100% / 2 - 2%);
    }
}

@media ( max-width: 480px) {
    .productes {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        width: auto;
    }
    .producte-card {
        /*-webkit-box-flex: 1;
-ms-flex: 1 46%;
flex: 1 46%;*/
        width: calc(100% /2 - 2%);
    }
    .productes-cat .producte-card {
        -webkit-box-flex: column;
        -ms-flex: column;
        flex: column;
    }
    .producte-info {
        padding: 10px;
    }
    .producte-info h4 {
        margin: 0;
    }
    .productes-header {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .productes-header a {
        -ms-flex-item-align: start;
        align-self: flex-start;
    }
    .producte-info ul.producte-preu-llista {
        margin: 0;
    }
}


/* fem quadrades les miniatures dels llistats de categories */

.miniatures-quadrades .thumbnail a {
    display: block;
    width: 100%;
    height: 0;
    min-height: 1px;
    padding-bottom: 100%;
    position: relative;
    border-left: 10px solid white;
    border-right: 10px solid white;
}

.miniatures-quadrades .thumbnail a:first-child img {
    object-fit: contain;
    bottom: 0;
    height: 100%;
    left: 0;
    object-position: center;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    display: block;
}

.miniatures-quadrades .thumbnail .caption a {
    clear: both;
    display: inline-block;
    padding: 0;
    margin: 0;
}

.miniatures-quadrades .thumbnail .caption {
    padding-left: 0;
    padding-right: 0;
    padding-top: 5px;
}


/* fitxa producte pàgina de detall *******************************************/


/* heading */

.producteHeading {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: var(--font-large);
}

.producteHeading .title {
    margin: 0;
    line-height: 1em;
}

.producteHeading .botoWishlist .material-icons {
    line-height: 1;
    font-size: 2rem;
}

@media screen and (min-width: 769px) {
    .producteHeading .botoWishlist .material-icons {
        margin-right: 1rem;
    }
}

.producteHeading .ratings_stars {
    font-size: 100%
}


/* llistat de preus pàgina detall */

#llistaPreusProducte {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin-bottom: .5rem;
}

#llistaPreusProducte .contenidorFill {
    width: 100%;
}

#llistaPreusProducte .notes {
    font-size: var(--font-xsmall);
    color: inherit;
}

#llistaPreusProducte .preu {
    font-weight: bold;
    text-align: right;
}

#llistaPreusProducte input[type="radio"] {
    opacity: 0;
    position: absolute;
    left: -10000px;
}

#llistaPreusProducte input[type="radio"]+.radio-custom-label,
#llistaPreusProducte .simularadio {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 2px solid var(--gris-ultraclar);
    padding: 0.5rem 1rem;
    margin-bottom: .5rem;
    border-radius: 4px;
    cursor: pointer;
    color: var(--gris);
}

#llistaPreusProducte input[type="radio"]+.radio-custom-label:last-child {
    margin-bottom: 0
}

#llistaPreusProducte input[type="radio"]+.radio-custom-label:after {
    font-family: 'Material Icons';
    content: 'check';
    font-size: 150%;
    color: var(--gris-ultraclar);
    line-height: 100%;
    margin-left: 0.25em;
    font-weight: bold
}

#llistaPreusProducte input[type="radio"]:checked+.radio-custom-label:after {
    color: var(--groc-900);
    color: black;
}

#llistaPreusProducte input[type="radio"]:checked+.radio-custom-label {
    border-color: var(--groc-700);
    border-style: solid;
    color: #000000;
    /*background-color: var(--groc-200); */
    background-color: white
}


/* preu amb línia de punts */

#llistaPreusProducte .fill {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    line-height: 1;
    width: 100%;
}

#llistaPreusProducte .fill::before {
    border-bottom: 1px dotted #999;
    content: "";
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: 1em;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    margin: 0 .5em .15em;
}

#llistaPreusProducte .fill .preu {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    padding-top: 0.25em;
    margin-left: auto;
}

#llistaPreusProducte .avisos {
    font-size: var(--font-xsmall);
    margin-top: .25em;
}

#llistaPreusProducte s {
    font-weight: normal
}

.avis:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "error_outline";
    vertical-align: middle;
    margin-right: .25em;
    /*color: var(--alerta); */
    font-weight: normal;
}

.avis.info:before,
.avis.alerta:before {
    content: "info";
    color: var(--groc-900);
}

#llistaPreusProducte .descompte {
    color: var(--alerta);
    padding: 0 .25em;
    /*   margin: 0 .25em;
  color: white; 
  border-radius: 4px; 
  vertical-align: baseline;*/
    font-weight: normal
}

#llistaPreusProducte input[type="radio"][disabled]+label,
#llistaPreusProducte .simularadio {
    color: var(--gris);
    cursor: default;
}

#llistaPreusProducte input[type="radio"][disabled]+label .avis,
#llistaPreusProducte input[type="radio"][disabled]+label .avis:before,
#llistaPreusProducte .simularadio .avis {
    color: var(--gris);
}

#llistaPreusProducte input[type="radio"][disabled]+label .preu,
#llistaPreusProducte .simularadio .preu {
    color: var(--gris-clar);
}

#llistaPreusProducte input[type="radio"][disabled]+.radio-custom-label:after {
    content: "add_alert";
    color: var(--groc-900);
    cursor: pointer;
}

#llistaPreusProducte input[type="radio"][disabled]+label .fill::before,
#llistaPreusProducte .simularadio .fill::before {
    border-color: var(--gris-clar);
}

#llistaPreusProducte .simularadio .material-icons {
    font-size: 200%;
    color: var(--groc-900);
    margin-left: .5rem;
}

.botoComprarPeu {
    margin-bottom: 1rem;
}

.botoComprarPeu a.button:not(:last-child) {
    margin-bottom: 0.5em;
}

@media screen and (max-width: 768px) {
    #llistaPreusProducte .fill {
        display: inline;
    }
    #llistaPreusProducte .fill::before {
        display: none
    }
    #llistaPreusProducte .preu {
        text-align: left;
    }
    .botoComprarPeu {
        position: -webkit-sticky;
        position: sticky;
        bottom: 0;
        z-index: 20;
        margin-bottom: 0;
        padding-bottom: 0;
        padding-top: 0;
    }
    .column.botoComprarPeu {
        background-color: white;
        padding-top: 0;
        display: flex;
        justify-content: space-between;
    }
    .botoComprarPeu a:first-child {
        margin-right: 0.25em;
    }
    .botoComprarPeu a:last-child {
        margin-left: 0.25em;
    }
}

@media screen and (max-width: 1023px) {
    .boto-filtres-fixat {
        background-color: white;
        position: -webkit-sticky;
        position: sticky;
        top: 6rem;
        z-index: 20;
        padding: .75rem 0 0;
        margin: -1rem 0 1rem;
    }
}


/* estrelles valoració producte */

.rate_widget {
    display: flex;
    padding-top: .25rem;
}

.rate_widget div {
    margin-right: .2em;
}

.rate_widget .insertaaqui {
    margin-left: .2em;
    padding-top: .2em;
}

.estrelles {
    color: #ffc107;
    margin: 0.25rem 0 .5rem;
    font-size: 90%;
    padding: 0;
}

.ratings_stars {
    display: inline-block;
    font-family: 'Material Icons';
    font-size: 150%;
    cursor: pointer;
    line-height: 1;
    letter-spacing: -.25em;
}

.ratings_stars:before {
    content: "star_border"
}

.ratings_vote:before {
    content: "star"
}

.ratings_over:before {
    content: "star";
    color: var(--groc-900)
}

.total_votes {
    font-size: 11px;
    color: var(--gris)
}

.alerta-valoracio {
    cursor: auto;
    color: var(--gris);
}

ul.llistaPropietats {
    list-style: none;
    padding: 0;
}

ul.llistaPropietats li {
    padding-left: 1.3em;
}

ul.llistaPropietats li:before {
    content: "check_circle";
    font-family: 'Material Icons';
    display: inline-block;
    margin-left: -1.3em;
    /* same as padding-left set on li */
    width: 1.3em;
    /* same as padding-left set on li */
    color: var(--groc-700);
    vertical-align: middle;
}

#fitxaProducte {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 auto;
    display: -webkit-flex;
    /* Safari */
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

#fitxaProducte .galeria,
#fitxaProducte .producteInfo {
    -webkit-box-flex: 2;
    -ms-flex: 2;
    flex: 2;
}

#fitxaProducte .producteInfo {
    -webkit-box-flex: 4;
    -ms-flex: 4;
    flex: 4;
}

#fitxaProducte .producteInfo h1 {
    font-size: var(--font-large);
    line-height: 1.25em;
    padding-bottom: .25em;
    font-weight: 600
}

#fitxaProducte .producteInfo {
    padding-left: 2rem;
}

#fitxaProducte .galeria {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

#fitxaProducte .galeria figure {
    background-color: #FFF;
    position: relative;
    border: 0px solid #ddd;
    border-radius: 3px;
    margin: 1%;
}

#fitxaProducte .galeria figure:first-child {
    -webkit-box-flex: 1;
    -ms-flex: 1 100%;
    flex: 1 100%;
}

#fitxaProducte .galeria figure img {
    width: 100%;
    -webkit-box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.1);
}


/* fem miniatures quadrades */

#fitxaProducte .galeria figure:not(:first-child) {
    width: calc(100% / 4 - 2%);
    height: 0;
    min-height: 1px;
    padding-bottom: 24%;
    position: relative;
}

#fitxaProducte .galeria figure:not(:first-child) img {
    bottom: 0;
    height: 100%;
    left: 0;
    object-fit: cover;
    object-position: center;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}

#fitxaProducte .galeria figure:not(:first-child) figcaption {
    display: none
}

#fitxaProducte .galeria figcaption {
    color: var(--gris);
    font-size: var(--font-small);
    font-style: oblique;
    padding-top: 0.25em;
}

#fitxaProducte .galeriaMobile {
    display: none;
}

#fitxaProducte .material-icons {
    line-height: 1;
}

#fitxaProducte .notification {
    margin-bottom: 1em;
}

@media all and (max-width: 768px) {
    #fitxaProducte {
        display: block;
    }
    #fitxaProducte .producteInfo {
        padding-left: 0;
    }
    /*#fitxaProducte .galeria {display: none}
  #fitxaProducte .galeriaMobile { display: inherit; margin-bottom: 30px }*/
    #fitxaProducte .galeria figure:not(:first-child) {
        display: none
    }
    #fitxaProducte .galeria figure figcaption {
        display: none
    }
    #fitxaProducte .galeria figure img {
        box-shadow: none
    }
}


/* icona de lupa x ampliar imatge */

.miniaturaProducte {
    position: relative;
    text-align: center;
    color: white
}

.ObrirPhotoSwipe:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: 'zoom_in';
    font-size: 500%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    opacity: .8;
    z-index: 20;
}

.imatge-amb-logo {
    position: relative;
}

.contenidor-logo {
    max-width: 25%;
    overflow: hidden;
    position: absolute;
    bottom: -.5rem;
    right: 1rem;
    background-color: white;
    line-height: 0;
    padding: 0.25rem;
    border-radius: 2px;
    box-shadow: 3px 3px 3px 0px rgba(0, 0, 0, 0.5);
}

.contenidor-logo img {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none !important;
}


/*icona play sobre imatge card de videos 
#videos .card-image { 
  position: relative;
  text-align: center;
  color: white
}
*/

#videos .card-image a:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: 'play_circle_filled';
    font-size: 500%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: white;
    opacity: .8;
    text-shadow: 3px 3px 3px rgba(150, 150, 150, .5);
}


/* estils dels llistats dins la descripció de producte en la pàgina de detall, interior modals...  */

.textFormat h3,
.textFormat h2,
.content h2,
.content h3 {
    font-size: var(--font-medium);
    font-weight: normal;
    color: var(--negre);
    line-height: 1.2em;
}

.textFormat p {
    margin-bottom: 1em;
}

.textFormat ul,
.textbbdd ul {
    margin: 0.5em 0 .75em;
    list-style: disc;
    padding-left: 1.75em;
}

.textFormat ol,
.textbbdd ol {
    margin: 0.5em 0 .75em;
    padding-left: 1.75em;
}

.textFormat ul ::marker {
    color: var(--groc-corporatiu);
}


/* secció tags */

.tags a.label:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: 'check';
    line-height: 1;
    margin-right: 0.25em;
    vertical-align: middle;
    color: var(--groc-900);
}


/* tags categoria */

#etiquetesCat {
    padding: .5rem 1rem 1rem;
    background-color: var(--gris-ultraclar);
}

#etiquetesCat a.tag.is-dark:hover {
    text-decoration: none;
    background-color: #000000;
    ;
}

#etiquetesCat h3 {
    font-size: var(--font-normal);
}

@media all and (max-width: 768px) {
    #etiquetesCat {
        padding: 0;
        background: none;
    }
}

a.link-zona-enviament {
    display: block;
    margin: .5rem 0 .75rem;
    font-size: var(--font-small);
    text-align: center;
}

a.link-zona-enviament:before {
    font-family: "Material Icons";
    content: "public";
    margin-right: .25em;
    vertical-align: middle;
    font-size: 1.25em
}

.columnes-text {
    -webkit-columns: 3 150px;
    -moz-columns: 3 150px;
    columns: 3 150px;
    -webkit-column-gap: 2em;
    -moz-column-gap: 2em;
    column-gap: 2em;
}


/* Taula preus pàgina detall ********************************* 

#taulapreus {margin-bottom: 1.5rem;}
#taulapreus .boto,
#taulapreus .detallpreu {text-align: right}
#taulapreus .fill {padding: .5em .25rem; border-top: 1px solid var(--gris-clar);} 
#taulapreus .fill,
#taulapreus .descripcio {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  align-items: flex-end;
} 
#taulapreus .descripcio {width: 65%}
#taulapreus .boto {width: 33%}

#taulapreus .producte .avis {display: block; font-size: var(--font-small); }

#taulapreus .fill:nth-child(even) {background-color: var(--gris-ultraclar)}
#taulapreus .preu {font-weight: bold; font-size: var(--font-normal)}

#taulapreus .descompte {background-color: var(--oferta); font-weight: bold; color: white; border-radius: 3px; padding: 0 .25em; margin: 0 .25em;}

.desactivat {color: var(--gris)}


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


  #taulapreus .descripcio {
    flex-direction: column;
    align-items: flex-start;
  }
  #taulapreus .detallpreu {text-align: left}

  #taulapreus .descripcio {width: 50%; text-align: left}
  #taulapreus .boto {width: 48%}
}

*/


/* comentaris producte ************************************************ */

#reviews2 article {
    font-family: var(--font-standard);
    font-size: var(--font-normal);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    padding: 0 1rem 1rem 0;
}

#reviews2 article:not(:first-child) {
    border-top: 1px solid var(--gris-clar);
    padding: 1rem 1rem 1rem 0;
}

#reviews2 .icon::before {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

#reviews2 h3::after {
    font-family: "Material Icons";
    /* abans Sharp */
    font-weight: 400;
    font-size: 3rem;
    content: "comment";
    color: var(--gris-clar);
}

#reviews2 h3 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    font-size: var(--font-medium);
    font-weight: normal;
    margin-top: 0;
    margin-bottom: 1rem;
}

#reviews2 article::before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "account_circle";
    font-size: 300%;
    color: var(--gris-clar);
    padding-right: 2%;
    margin-top: -10px;
}

#reviews2 article.staff::before {
    content: url('https://media.alchimiaweb.com/avatar-comentaris.svg');
    width: 60px;
    height: 60px;
}

#reviews2 article.client::before {
    color: var(--groc-500);
}

#reviews2 article.comprador::before {
    color: var(--groc-800);
}

#reviews2 article.staff {
    border-top: none;
    margin-bottom: 1rem;
    margin-left: 1rem;
    padding-left: 1rem;
    background-color: var(--gris-ultraclar);
    color: var(--negre);
}

#reviews2 article a {
    color: var(--negre);
    text-decoration: underline;
}

.comentari {
    width: 100%;
}

.comentariHeader {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    width: 100%;
}

.comentariHeader div:first-child {
    font-weight: bold;
    display: flex;
    width: 100%;
}

.comentariHeader div:last-child {
    font-size: smaller;
    color: var(--gris);
    text-align: right;
    white-space: nowrap;
}

#reviews2 article.client .status {
    color: var(--gris);
    font-weight: normal;
    font-style: italic;
}

#reviews2 article.comprador .status {
    color: var(--groc-900);
    font-weight: normal;
    font-style: italic;
}

#reviews2 article.client .status,
#reviews2 article.comprador .status {
    padding-left: .5em;
    margin: 0 .5em;
    border-left: 1px solid var(--gris-clar);
}

#reviews2 article .data {
    white-space: nowrap;
}

@media all and (max-width: 600px) {
    #reviews2 article {
        padding: 1rem 0
    }
    .comentariHeader,
    .comentariHeader div:first-child {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
    #reviews2 article.client .status,
    #reviews2 article.comprador .status {
        padding-left: 0;
        margin-left: 0;
        border-left: none;
    }
    #reviews2 article.staff {
        margin-left: 5%;
        padding-left: 2%;
        padding-right: 2%;
    }
    #reviews2 article.staff::before {
        width: 55px;
        height: 55px;
    }
    .comentari {
        width: 100%;
    }
    .comentariHeader div:last-child {
        text-align: left
    }
    #reviews2 h3::after {
        font-size: 300%;
    }
}


/* bloc 4 avantatges de comprar a Alchimia  ************************* */

.blocAvantatges2 {
    font-family: var(--font-standard);
    font-size: var(--font-small);
    margin: 1rem 0 2rem;
}

.blocAvantatges2 ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    padding: 1% 2%;
    list-style: none;
    vertical-align: middle;
    border: 2px solid var(--gris-clar);
    border-radius: .25em;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.blocAvantatges2 ul li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    width: calc(100% / 4);
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    text-align: left;
    padding: 5px 10px;
    margin: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    line-height: 125%;
    border-right: 2px solid var(--gris-clar);
}

.blocAvantatges2 ul li:last-child {
    border: none;
}

#continguts .blocAvantatges2 ul li {
    margin-left: 0
}

.blocAvantatges2 li a {
    color: var(--gris-fosc);
    text-decoration: underline;
}

.blocAvantatges2 strong {
    color: var(--gris-fosc);
}

.blocAvantatges2 li::before {
    font-family: 'Material Icons';
    font-size: 2.5em;
    line-height: 125%;
    /*color:var(--groc-600);*/
    margin-right: 10px;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
}

.blocAvantatges2 li.regal::before {
    content: "card_giftcard";
}

.blocAvantatges2 li.segur::before {
    content: "security";
}

.blocAvantatges2 li.discret::before {
    content: "visibility_off";
}

.blocAvantatges2 li.transport::before {
    content: "local_shipping";
}

.blocAvantatges2.invers li {
    background-color: var(--gris-fosc);
}

.blocAvantatges2.invers li *,
.blocAvantatges2.invers li::before {
    color: var(--gris-ultraclar);
    font-weight: 400;
}

.hero-foot .blocAvantatges2 {
    margin: 0;
}

.hero-foot .blocAvantatges2 ul {
    border: none;
}

.hero-foot .blocAvantatges2 li {
    border-color: white;
    padding: 0 2%;
    color: var(--negre);
}

.hero-foot .blocAvantatges2 li::before {
    color: var(--negre);
}

.hero.is-primary {
    background-color: var(--groc-corporatiu)
}

@media all and (max-width: 600px) {
    .blocAvantatges2 ul,
    .hero-foot .blocAvantatges2 ul {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        border-radius: 10px;
    }
    #continguts .blocAvantatges2 li,
    .hero-foot .blocAvantatges2 li {
        width: calc(100% / 2);
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: center;
        padding: 2%;
        margin: 0;
    }
    .blocAvantatges2 li:nth-child(even) {
        border: none;
    }
    .blocAvantatges2 li:first-child,
    .blocAvantatges2 li:nth-child(2) {
        border-bottom: 2px solid var(--gris-clar);
    }
    .blocAvantatges2 li::before {
        margin: 0;
    }
    .hero-foot .blocAvantatges2 li:first-child,
    .hero-foot .blocAvantatges2 li:nth-child(2) {
        border-bottom: 2px solid white;
    }
    .hero-foot .blocAvantatges2 li {
        padding: 2%;
    }
}


/* botó llegir més descripció 
https://codepen.io/Idered/pen/AeBgF/ */

.read-more-state {
    display: none;
}

.read-more-target {
    opacity: 0;
    max-height: 0;
    font-size: 0;
    transition: .3s ease;
}

.read-more-state:checked~.read-more-wrap .read-more-target {
    opacity: 1;
    font-size: inherit;
    max-height: 999em;
}

.read-more-state~.read-more-trigger:before {
    content: '\2193 \00a0 Read more... ';
}

.read-more-state:checked~.read-more-trigger:before {
    content: '\2191 \00a0 Show less';
}

.read-more-trigger {
    cursor: pointer;
    display: inline-block;
    color: #666;
}


/* no mostrem el show less */

.read-more-state:checked~.read-more-trigger {
    display: none
}

form#formFitxaProducte {
    background-color: var(--gris-ultraclar);
    padding: 2em;
    margin-left: 1em;
    border: 1px solid var(--gris-clar);
    border-radius: 5px;
}

form#formFitxaProducte,
form#formFitxaProducte input,
form#formFitxaProducte textarea,
form#formFitxaProducte label,
form#formFitxaProducte h2,
form#formFitxaProducte p {
    font-family: var(--font-standard);
}

form#formFitxaProducte label {
    color: var(--gris-fosc);
    text-align: left;
    margin: 1rem .5rem 0 0;
}

form#formFitxaProducte .help {
    font-size: small;
    margin-left: .5rem;
}

form#formFitxaProducte button.button {
    padding: 1% 15%;
}

form#formFitxaProducte h2 {
    font-size: var(--font-normal);
    font-weight: normal;
    text-transform: none;
    margin-bottom: 1rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

form#formFitxaProducte #acceptacio {
    margin-bottom: 1rem;
}

form#formFitxaProducte .notification,
#formRevPost .notification {
    background-color: transparent;
    font-size: var(--font-small);
    border: 1px solid var(--alerta)
}

#formRevPost {
    margin-top: 2rem;
}

@media all and (max-width: 600px) {
    /*  form#formFitxaProducte h2::after { font-size: 250% } */
    form#formFitxaProducte {
        padding: 1.5em;
        margin-left: 0
    }
}


/* CART ******************************************************************* */

#cart {
    font-size: var(--font-normal);
    line-height: 1.25em;
}

#cart h3 {
    font-size: var(--font-medium);
    font-weight: normal;
    margin-bottom: .75em;
    color: var(--negre);
}

#cart h3 span {
    background-color: var(--gris);
    border-radius: 0.8em;
    -moz-border-radius: 0.8em;
    -webkit-border-radius: 0.8em;
    color: white;
    font-weight: bold;
    display: inline-block;
    line-height: 1.6em;
    margin-right: 5px;
    text-align: center;
    width: 1.6em;
}

#cart hr {
    border-color: var(--gris);
    margin: 1.5rem 0;
}

.cartResum {
    position: -webkit-sticky;
    position: sticky;
    top: 7.5rem;
}

.cartProductes article {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    border-bottom: 1px solid var(--gris-clar);
    padding: 1rem 0.5rem;
}

.cartProductes article:nth-child(even) {
    background-color: var(--gris-ultraclar)
}

.cartProductes article:last-child {
    border-bottom: none;
}

.cartProductes article div {
    margin-left: 1rem
}

.cartProductes article div:first-child,
.cartProductes article div.cartDescripcio div {
    margin-left: 0
}

.cartProductes .cartImatge {
    width: 80px;
}

.validar .button:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "check_circle";
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    text-decoration: inherit;
    font-size: 1.25em;
    vertical-align: middle;
    margin-right: .25em;
}

.validar input {
    box-shadow: none;
    border: 2px solid var(--groc-500);
}

.validar input:hover {
    border-color: var(--groc-600);
}


/* imatge quadrada */

#cart figure {
    width: 100%;
    height: 0;
    min-height: 1px;
    padding-bottom: 100%;
    position: relative;
}

#cart figure img {
    bottom: 0;
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}

.cartInfoProducte {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
}

.cartDescripcio {
    width: calc(70% - 2rem);
}

.cartQuantitat,
.cartCost {
    width: 15%;
    text-align: right;
}

.cartQuantitat .button i {
    margin: 0;
}

.cartQuantitat .button.is-small,
.cartQuantitat input.is-small {
    border: 1px solid var(--gris);
    width: 3em;
    border-radius: 0;
    text-align: center;
}

.cartQuantitat .button:first-child.is-small {
    border-radius: 3px 0 0 3px;
    border-right: none;
}

.cartQuantitat .button.is-small:last-child {
    border-radius: 0 3px 3px 0;
    border-left: none;
}

.cartQuantitat .has-addons {
    justify-content: flex-start;
}


/* Webkit browsers like Safari and Chrome */

input.remove-spin[type=number]::-webkit-inner-spin-button,
input.remove-spin[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}


/* For Firefox */

input.remove-spin[type='number'] {
    -moz-appearance: textfield;
}

.cartEliminar a {
    color: var(--gris);
}

.cartEliminar a:hover {
    color: var(--negre);
}

.cartProductes span.avis {
    font-size: var(--font-small);
    color: var(--alerta);
}

.cartProductes span.avis::before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "error";
    padding-right: .25em;
    vertical-align: middle;
}

.cartResum,
.opcionsCompraResum {
    padding: 1em;
    border: 10px solid var(--gris-ultraclar);
    margin-bottom: .5em;
}

.cartResum h3 {
    margin-top: 0;
}

.cartResum dl {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    margin: 0;
}

.cartResum dt,
.cartResum dd {
    box-sizing: border-box;
    margin: 0;
    padding: .75em .25em;
    border-bottom: 1px solid var(--gris-clar);
    font-weight: normal;
    line-height: 1.25em;
}

.cartResum dt {
    width: calc(60%);
}

.cartResum dd {
    width: calc(40%);
    text-align: right;
    font-weight: bold
}

.cartResum dt a:first-child {
    font-weight: bold
}

.cartResum dl dt:last-of-type,
.cartResum dl dd:last-child {
    background-color: var(--groc-A100);
}

.cartResum dl dd:last-child {
    font-weight: bold;
}

.cartResum a {
    color: var(--negre)
}

.cartDescripcio a {
    color: var(--negre);
    font-weight: bold
}

.catResum .descompte {
    color: var(--alerta);
}

.cartResum ul.notes {
    clear: both;
    padding: 0 0 1em 0.5em;
    margin: 1em 0;
    font-size: var(--font-small);
    list-style: none;
    border-bottom: 1px solid var(--gris-clar);
}

.cartResum ul.notes li {
    padding: 0;
    margin: 0;
}

.cartResum .label {
    color: var(--gris);
    font-weight: normal;
    text-align: left;
    margin-bottom: 0.25em;
}

.cartResum .avis,
.cartResum .descompte {
    color: var(--alerta);
}

.cartResum #showmapIni a {
    color: var(--groc-900);
    cursor: pointer;
}

.cartResum #showmapIni,
.cartResum #showmapFi {
    margin-bottom: 1rem
}

.cartResum .notification {
    font-size: var(--font-small)
}

.cartResum .notification .button {
    margin-top: 1em;
}

.cartHeader {
    text-align: center;
    background-color: var(--gris-ultraclar);
    padding: 1em;
    margin: 0 0 1em 0;
}

.opcionsCompraResum dl.llistaVertical {
    border: none;
    margin: 0;
    padding: 0 .5em;
}

dl.llistaVertical dt {
    font-weight: bold;
    border-top: 1px solid var(--gris-clar);
    margin-top: .5em;
    padding-top: .5em;
}

dl.llistaVertical dt:first-child {
    border-top: none;
    margin-top: 0;
}

.avisoscart {
    margin-top: 1.5rem;
}

.confirmar i {
    margin-left: .25em;
    color: var(--groc-500)
}

a.editar {
    font-size: var(--font-small)
}

a.editar:before {
    content: "edit";
    font-family: "Material Icons";
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    vertical-align: top;
    margin-right: .25em;
}

.promos-suggerides ul {
    padding-top: .5em;
}

.promos-suggerides ul li {
    margin-bottom: .25em;
}

.promos-suggerides ul li:before {
    content: "radio_button_unchecked";
    font-family: "Material Icons";
    font-style: normal;
    font-weight: normal;
    text-decoration: inherit;
    font-size: 1.33em;
    vertical-align: middle;
    margin-right: .25em;
}

.promos-suggerides ul li.tengui:before {
    content: 'check_circle';
}

.notification.promos-suggerides a {
    font-weight: bold
}

@media all and (max-width: 768px) {
    /*  #cart {padding-bottom: 10rem;} */
    .cartResum {
        position: static;
    }
    .cartInfoProducte,
    .cartContenidor {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .cartProductes {
        margin: 0;
    }
    .cartResum,
    .opcionsCompraResum {
        padding: 0;
        border: none;
    }
    .opcionsCompraResum dl.llistaVertical {
        padding: 0;
    }
    .cartProductes article div.cartInfoProducte div {
        margin-left: 0;
        width: 100%;
        text-align: left;
    }
    .cartQuantitat {
        width: auto;
        padding: .5em 0;
    }
}


/* steps procés compra  */

.steps {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 1.75rem;
}

.steps .steps-segment:not(:last-child) {
    -ms-flex-preferred-size: 1rem;
    flex-basis: 1rem;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -ms-flex-negative: 1;
    flex-shrink: 1;
}

.steps .steps-segment {
    position: relative;
}

.steps .steps-marker {
    background-color: var(--groc-500);
    color: var(--negre);
}

.steps .steps-marker {
    height: 2.5rem;
    width: 2.5rem;
    overflow: hidden;
}

.steps .steps-marker {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-radius: 50%;
    font-weight: 700;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
    z-index: 5;
}

.steps:not(.is-vertical) .steps-segment:not(:last-child):after {
    height: .4em;
    left: 1.76rem;
    right: -.24rem;
    top: calc(1.25rem - (.2em));
}

.steps .steps-segment:not(:last-child):after {
    content: " ";
    display: block;
    position: absolute;
}

.steps .steps-segment.is-active~.steps-segment .steps-marker {
    background-color: var(--gris-clar);
    color: rgba(0, 0, 0, 0.5);
}

.steps-segment.is-active~.steps-segment:after {
    background-color: var(--gris-clar);
}

.steps-segment.is-active:after {
    background-color: var(--gris-clar);
}

.steps-segment:after {
    background-color: var(--groc-500);
}

ul.radios {
    margin: 0;
    padding: 0;
}

ul.radios li {
    margin: 0;
    padding: 0;
    list-style: none;
    color: var(--gris);
}


/* notes que es despleguen al clicar el radio */

.radios label .notes,
.radios .notes2 {
    position: absolute;
    opacity: 0;
    /*transform: scale(.9);*/
    font-size: var(--font-small);
    padding-bottom: .5em;
    /* afegit x evitar scroll a banda */
    display: none;
}

.radios input[type="radio"]:checked+label .notes {
    display: block;
    position: static;
    opacity: 1;
    /*transform: scale(1);*/
    transition: transform .2s ease-in, opacity .3s ease-in;
}

.radios label .notes:before {
    font-family: "Material Icons";
    /* abans Sharp */
    /*content: "info";*/
    color: var(--groc-900);
    margin-right: .25em;
    vertical-align: text-top;
}

.radios input[type="radio"]:checked~.notes2 {
    display: block;
    position: static;
    opacity: 1;
    background-color: var(--gris-ultraclar);
    padding: 0 1em .5em 2.25rem;
    /*transform: scale(1);*/
    transition: transform .2s ease-in, opacity .3s ease-in;
}

.radios input[type="radio"]:checked~.notes2 ul li {
    margin-bottom: .5em;
}


/* Simplifiquem checkbox amb icona Google Material. Podriem substituir-ho x les anteriors  */

input[type=checkbox].material,
input[type=radio].material {
    border: 0;
    cursor: pointer;
    height: 1px;
    margin: 0;
    opacity: 0;
    position: absolute;
    width: 1px;
}

input[type="checkbox"].material+label,
input[type="radio"].material+label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    line-height: 1.25em;
    cursor: pointer;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    -webkit-transition-delay: 0.15s;
    -o-transition-delay: 0.15s;
    transition-delay: 0.15s;
}

input[type="checkbox"].material+label:before,
input[type="radio"].material+label:before {
    font-family: "Material Icons";
    content: "check_box_outline_blank";
    margin: 0 .15em 0 0;
    font-size: 1.5em;
    color: var(--gris-clar);
    line-height: 1;
    -webkit-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
    -webkit-transition-delay: 0.15s;
    -o-transition-delay: 0.15s;
    transition-delay: 0.15s;
}

input[type="radio"].material+label:before {
    content: "radio_button_unchecked";
}

input[type="checkbox"].material:hover+label,
input[type="radio"].material:hover+label {
    color: var(--negre);
}

input[type="checkbox"].material:hover+label:before,
input[type="radio"].material:hover+label:before {
    color: var(--groc-900);
}

input[type="checkbox"].material:checked+label:before {
    content: "check_box";
    color: var(--gris-fosc);
}

input[type="radio"].material:checked+label:before {
    content: "radio_button_checked";
    color: var(--gris-fosc);
}

input[type="checkbox"].material:disabled+label:before,
input[type="radio"].material:disabled+label:before,
input[type="checkbox"].material:hover:disabled+label:before,
input[type="radio"].material:hover:disabled+label:before {
    color: var(--gris-ultraclar);
}

input[type="radio"]:disabled.material+label,
input[type="radio"]:disabled.material:hover+label {
    color: var(--gris-clar);
}

input[type="radio"]:disabled.material+label .avis {
    font-size: var(--font-small);
    color: var(--alerta);
    line-height: 1.2em
}


/* versió amb imatge de radio o checkbox més gran */

input[type="checkbox"].material.gran+label:before,
input[type="radio"].material.gran+label:before {
    font-size: 200%;
    margin-top: -.2em;
}

input[type="checkbox"].material.gran+label,
input[type="radio"].material.gran+label {
    padding: .5em 0em .25em;
}

input[type="checkbox"].material.gran:checked+label,
input[type="radio"].material.gran:checked+label {
    background-color: var(--gris-ultraclar);
    color: var(--negre);
    padding-right: 1em
}


/* versió horitzontal per als regals */

ul.llistaRegals {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    margin: 1em 0;
    padding: 0;
    line-height: 120%;
    font-size: var(--font-small)
}

ul.llistaRegals li {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin: 0;
    width: calc(100% / 4.5 - .5%);
    list-style: none;
    padding: 0;
    margin: 0.25em;
}

ul.llistaRegals input[type="radio"] {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

ul.llistaRegals li label {
    display: block;
    height: 100%;
    border: 2px solid var(--gris-clar);
    border-radius: 3px;
    color: var(--gris);
    cursor: pointer;
}

ul.llistaRegals li label strong {
    color: var(--gris);
}

ul.llistaRegals label span {
    display: block;
    padding: 0.5em;
}

ul.llistaRegals input:checked+label {
    border-color: var(--groc-900);
    background-color: var(--groc-50);
    color: var(--negre);
}

ul.llistaRegals input:checked+label strong {
    color: var(--negre)
}

ul.llistaRegals figure {
    width: auto;
    height: 100px;
    margin-bottom: .1em;
}

ul.llistaRegals li.botoCarregaMes {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: var(--groc-500);
    color: var(--negre);
    color: red;
    text-align: center;
    color: var(--gris-fosc);
    cursor: pointer;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

ul.llistaRegals li.botoCarregaMes:hover {
    background-color: var(--groc-400);
    color: var(--negre);
}

@media screen and (min-width: 769px) {
    ul.llistaRegals {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }
    ul.llistaRegals li {
        width: calc(100% / 6 -1.5%);
        width: calc(100% / 6 - 7px);
    }
}

@media all and (max-width: 600px) {
    ul.llistaRegals li {
        width: calc(100% / 3.33);
    }
}


/* versió horitzontal per als regals */

ul.llistaRadioMiniatures input[type="radio"] {
    position: absolute;
    left: -10000px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

ul.llistaRadioMiniatures {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    margin: 1em 0;
    padding: 0;
}

ul.llistaRadioMiniatures li {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    margin: 0;
    padding: 0 1.5%;
    border-right: 1px dotted var(--gris-clar);
    width: calc(100% / 3.3 - 1.5%);
    list-style: none;
}

ul.llistaRadioMiniatures li {
    padding: 0 0.5em;
    margin: 0;
}

ul.llistaRadioMiniatures li input+span,
ul.llistaRadioMiniatures li input:checked+span+small {
    display: block;
}

ul.llistaRadioMiniatures li:not(:first-child) strong {
    color: inherit;
}

ul.llistaRadioMiniatures label {
    cursor: pointer;
    font-size: var(--font-normal);
    line-height: normal;
    color: var(--gris);
    width: 100%;
    line-height: 115%;
    font-size: var(--font-small)
}

ul.llistaRadioMiniatures figure {
    width: auto;
    height: 100px;
    margin-bottom: .25em;
}

ul.llistaRadioMiniatures input:checked+span {
    color: var(--negre);
    background-color: var(--groc-A100);
}

ul.llistaRadioMiniatures input+span+small {
    position: absolute;
    opacity: 0;
}

ul.llistaRadioMiniatures input:checked+span+small {
    padding: .5em .65em;
    display: block;
    position: static;
    opacity: 1;
    -webkit-transition: opacity .5s linear;
    -o-transition: opacity .5s linear;
    transition: opacity .5s linear;
    -webkit-transition-delay: 0.1s;
    -o-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

ul.llistaRadioMiniatures input+span:not(:empty) {
    padding: .5em .75em;
}

ul.llistaRadioMiniatures input[type="radio"]:checked+label:before {
    font-family: "Material Icons";
    content: "check_box_outline_blank";
    top: 0;
    color: red;
}

@media screen and (min-width: 769px) {
    ul.llistaRadioMiniatures {
        flex-wrap: wrap;
    }
    ul.llistaRadioMiniatures li {
        padding: 0;
        width: calc(100% / 7);
    }
    ul.llistaRadioMiniatures li:nth-child(7n) {
        border: none;
    }
}

@media all and (max-width: 600px) {
    ul.llistaRadioMiniatures li {
        padding: 0;
        width: calc(100% / 2.25);
    }
}


/* Modal (formulari login i menu esquerra filtres) *******************************************************************/

.modal-background {
    background-color: rgba(10, 10, 10, .75);
}

.modal-content {
    background-color: white;
    padding: 1.75rem;
    width: 100%;
    max-width: 436px;
    border-radius: 3px
}

#modal-login .modal-content,
#modal-create-account .modal-content {
    max-width: 436px;
    min-height: 200px;
}

#modal-login img.modal-logo,
#modal-create-account img.modal-logo {
    display: block;
    max-width: 133px;
    margin: 1rem auto .25rem;
}

#modal-error .modal-content {
    max-width: 436px
}

#modal-login p:last-child {
    font-weight: bold
}


/*
#modal-login .modal-content,
#modal-create-account .modal-content
form {padding: 1.75rem;}
*/

#modal-cart .icon {
    vertical-align: bottom;
}

#modal-content-cart span {
    font-weight: bold;
}

#modal-content-subs {
    border: 5px solid var(--groc-500);
    text-align: center;
}

#modal-content-subs:before {
    font-family: "Material Icons";
    content: "mail_outline";
    color: var(--groc-500);
    font-size: 400%;
    text-align: center;
    display: block;
    line-height: 1
}

#modal-alertes .modal-content {
    position: absolute;
    margin: .5rem auto;
    top: 0;
    border: 5px solid var(--alerta);
    display: flex;
    border-radius: 3px;
    vertical-align: middle;
    box-shadow: 0 2px 3px rgba(10, 10, 10, .1), 0 0 0 1px rgba(10, 10, 10, .1);
}

#modal-alertes .modal-content:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "notification_important";
    vertical-align: top;
    line-height: 1;
    margin-right: .5rem;
    color: var(--oferta);
    font-size: 2rem;
}

@media screen and (max-width: 768px) {
    .modal-content {
        width: 90%;
        margin: 5%;
        padding: 1.5rem;
        max-height: calc(100vh - 130px);
    }
    .modal-content hr {
        margin: 1rem 0;
    }
    #modal-menu-esq.modal {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }
    #modal-menu-esq .modal-content {
        width: 75vw;
        height: 100%;
        min-width: 288px;
        background-color: white;
        padding: 1rem;
        max-height: 100%;
        margin-left: 0;
        box-shadow: 0px 8px 10px -5px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
    }
    .is-large.modal-close {
        /*    height: 40px;
    max-height: 40px;
    max-width: 40px;
    min-height: 40px;
    min-width: 40px;
    width: 40px;*/
        background-color: rgba(255, 228, 59, 0.5);
        background-color: rgba(255, 255, 255, 0.5);
    }
    .is-large.modal-close:hover {
        background-color: rgba(255, 228, 59, 1);
        background-color: rgba(0, 0, 0, .8);
    }
}

@media screen and (max-width: 1023px) {
    .menu-dret .modal-content {
        width: 75vw;
        left: 10vw;
        height: auto;
        min-width: 288px;
        background-color: white;
        padding: 1.5rem 1rem 1rem;
        max-height: 100%;
        text-align: right;
    }
    .menu-dret .menu-label {
        margin-right: .75rem;
    }
}

@media screen and (max-width: 436px) {
    /*.modal-content {padding: 1rem;}*/
    #modal-login .modal-content,
    #modal-menu-esq .modal-content {
        height: 100%;
        max-height: 100%;
    }
    #modal-login .modal-close::after,
    .modal-close::before {
        background-color: #ccc;
    }
}

.modal-content .title {
    margin-bottom: 1rem
}


/* Selector de semillas *********************/

#selector {
    max-width: 768px;
    margin: 0 auto;
}

#selector h2 {}

#llistaSelector2 {
    -webkit-columns: 3;
    -moz-columns: 3;
    columns: 3;
}

#llistaSelector {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 2rem 0;
}

#llistaSelector li {
    width: calc(100% / 3 - 2%);
    margin-right: 1%
}

@media screen and (max-width: 768px) {
    #llistaSelector li {
        width: calc(100% / 2 - 1%)
    }
    #selector .button {
        position: -webkit-sticky;
        position: sticky;
        bottom: 0;
    }
}

@media screen and (max-width: 600px) {
    #llistaSelector li {
        width: calc(100% / 1);
        margin-right: 0
    }
}


/* AREA D'USUARI *******************************************************************/

#areaUsuari {
    background-color: var(--gris-ultraclar)
}

#areaUsuari .table {
    font-size: var(--font-small)
}

#areaUsuari .card {
    border-radius: 6px
}

#areaUsuari .subtitle {
    margin-bottom: .75rem;
}

#areaUsuari .box a .material-icons {
    color: var(--gris-fosc)
}

#areaUsuari .box a .material-icons:hover {
    color: var(--groc-900-fosc)
}

#menu-usuari figure {
    margin: 0 0 .5rem;
    text-align: center;
    font-variant: uppercase;
}

#menu-usuari figure img {
    border: 5px solid var(--groc-corporatiu);
}

#menu-usuari h3 {
    text-transform: uppercase;
    text-align: center
}

#menu-usuari .menu-list a:hover {
    background-color: var(--gris-clar);
    color: var(--negre);
}

#menu-usuari .menu-list a.is-active {
    background-color: var(--groc-corporatiu);
    color: var(--negre);
}

#menu-usuari ul li a:before,
#modal-menu-usuari ul li a:after {
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    font-family: "Material Icons";
    /* abans Sharp */
    width: 1.5em;
    text-align: center;
    vertical-align: middle;
    font-size: 1.25em
}

#menu-usuari ul li.icona-dashboard a:before {
    content: "dashboard";
}

#menu-usuari ul li.icona-avisos a:before {
    content: "notification_important";
}

#menu-usuari ul li.icona-dades a:before {
    content: "perm_contact_calendar";
}

#menu-usuari ul li.icona-social a:before {
    content: "people";
}

#menu-usuari ul li.icona-adreces a:before {
    content: "location_city";
}

#menu-usuari ul li.icona-descomptes a:before {
    content: "money_off";
}

#menu-usuari ul li.icona-cupons a:before {
    content: "local_offer";
}

#menu-usuari ul li.icona-devolucions a:before {
    content: "settings_backup_restore";
}

#menu-usuari ul li.icona-historial a:before {
    content: "assignment";
}

#menu-usuari ul li.icona-wishlist a:before {
    content: "favorite";
}

#menu-usuari ul li.icona-afiliat a:before {
    content: "card_membership";
}

#menu-usuari ul li.icona-configuracio a:before {
    content: "settings";
}

#menu-usuari ul li.icona-reviews a:before {
    content: "rate_review";
}

#menu-usuari ul li.icona-comments a:before {
    content: "mode_comment";
}

#menu-usuari ul li.icona-valoracions a:before {
    content: "star";
}

#menu-usuari ul li.icona-sortir a:before {
    content: "exit_to_app";
}

ul li.icona-sortir a {
    color: var(--alerta);
}

#modal-menu-usuari ul li.icona-dashboard a:after {
    content: "dashboard";
}

#modal-menu-usuari ul li.icona-avisos a:after {
    content: "notification_important";
}

#modal-menu-usuari ul li.icona-dades a:after {
    content: "perm_contact_calendar";
}

#modal-menu-usuari ul li.icona-social a:after {
    content: "people";
}

#modal-menu-usuari ul li.icona-adreces a:after {
    content: "location_city";
}

#modal-menu-usuari ul li.icona-descomptes a:after {
    content: "money_off";
}

#modal-menu-usuari ul li.icona-cupons a:after {
    content: "local_offer";
}

#modal-menu-usuari ul li.icona-devolucions a:after {
    content: "settings_backup_restore";
}

#modal-menu-usuari ul li.icona-historial a:after {
    content: "assignment"
}

#modal-menu-usuari ul li.icona-wishlist a:after {
    content: "favorite";
}

#modal-menu-usuari ul li.icona-afiliat a:after {
    content: "card_membership";
}

#modal-menu-usuari ul li.icona-configuracio a:after {
    content: "settings";
}

#modal-menu-usuari ul li.icona-reviews a:after {
    content: "rate_review";
}

#modal-menu-usuari ul li.icona-comments a:after {
    content: "mode_comment";
}

#modal-menu-usuari ul li.icona-valoracions a:after {
    content: "star";
}

#modal-menu-usuari ul li.icona-sortir a:after {
    content: "exit_to_app";
}


/*espaiat per les icones 
#areaUsuari i {margin-right: .25em;}
*/


/* menu mobile  */

.modal-menu-usuari .modal_content {
    z-index: 999;
    position: fixed;
    top: 0;
    right: 0;
    overflow-y: auto;
    background: #fff;
    padding: 1rem;
    /* box-shadow: 0 1px 5px rgba(0,0,0,0.7); */
    box-shadow: 0px -5px 10px 8px rgba(0, 0, 0, 0.2), 0px 16px 24px 2px rgba(0, 0, 0, 0.14), 0px 6px 30px 5px rgba(0, 0, 0, 0.12);
    width: 75vw;
    height: 100%;
    min-width: 288px;
}

#dashboard h2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

#dashboard h2 strong.oferta {
    color: var(--oferta);
    font-weight: bold
}

#dashboard .subtitle {
    margin-bottom: 1rem;
}

#dashboard .linkseccio {
    display: block;
    padding-top: .5em;
    margin-top: 1em;
    border-top: 1px solid var(--gris-clar);
}

#dashboard .is-primary .linkseccio {
    border-color: white;
}

#dashboard ul li {
    padding-bottom: 0.5em;
    margin-bottom: 0.5em;
    list-style: none;
}

#dashboard ul li p:not(:first-child) {
    font-size: var(--font-small)
}


/* missatges màrketing al peu del dahsboard usuari */

.bottomAreaUsuari {
    margin-top: 2rem;
    padding: 1rem 2rem;
    background-color: var(--negre);
    color: var(--gris-clar);
    border-radius: 6px;
    font-size: var(--font-small);
}

.bottomAreaUsuari a {
    color: var(--groc-corporatiu);
}

.bottomAreaUsuari strong {
    color: white;
    font-weight: 700
}

.bottomAreaUsuari .material-icons {
    font-size: 400%;
    color: var(--groc-corporatiu);
    margin-top: 1rem;
}

@media screen and (max-width: 768px) {
    .bottomAreaUsuari .columns:not(:last-of-type),
    .bottomAreaUsuari .column:not(:last-of-type) {
        border: none
    }
}

.liniapunts {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    line-height: 100%;
}

.liniapunts::before {
    border-bottom: 1px dotted #999;
    content: "";
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: 1em;
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
    margin: 0 3px;
}

.liniapunts span {
    font-weight: bold;
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    padding-top: 0.25em;
    margin-left: auto;
}

#dashboard .avis-cistella .subtitle,
#dashboard .avis-comanda .subtitle {
    margin-bottom: .5rem;
}

.avis-cistella .material-icons,
.avis-comanda .material-icons {
    background-color: var(--negre);
    color: var(--groc-500);
    font-size: 125%;
    padding: .33em;
    border-radius: 50px;
    vertical-align: middle;
}

#dashboard #returns .producte-card .button {
    margin-top: .5rem;
}

#dashboard #returns h3.subtitle {
    margin-bottom: .5rem;
}

#dashboard #returns .productes.graella {
    margin: 1rem 0 0 0;
}

#dashboard .productes.graella .producte-card {
    width: calc(100% / 5 - 1%);
}

#returns .productes.graella .producte-card {
    width: calc(100% / 6 - 1%);
}

@media screen and (max-width: 1024px) {
    #dashboard .productes.graella .producte-card {
        width: calc(100% / 3 - 1%);
    }
}

@media screen and (max-width: 768px) {
    #dashboard .productes.graella .producte-card,
    #returns .productes.graella .producte-card {
        width: calc(100% / 2 - 3%);
    }
}

#dashboard .productes.graella {
    margin-bottom: 1rem;
}

#adreces .card {
    /* border: 1px solid var(--gris-clar);
box-shadow: none; */
}

#adreces .card-footer {
    font-size: var(--font-small)
}

#adreces .predeterminada .card {
    border: 2px solid var(--groc-A700);
    background-color: var(--groc-100);
}

#adreces .predeterminada .card-footer-item,
#adreces .predeterminada .card-footer {
    border-color: var(--groc-A700);
    /* background-color: white;*/
}

#adreces .predeterminada .card ul:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "check_circle_outline";
    float: right;
    font-size: 200%;
    line-height: 1;
}

#adreces .disabled .card {
    border-color: var(--gris-ultraclar);
    background-color: var(--gris-ultraclar);
    color: var(--gris-clar);
}

#adreces .disabled ul li:first-child {
    color: var(--gris-clar);
}

#adreces ul li:first-child {
    font-weight: bold;
    color: var(--negre);
}

#descomptes dl {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    margin: 0;
}

#descomptes dt,
#descomptes dd {
    box-sizing: border-box;
    margin: 0;
    padding: .25em;
    border-bottom: 1px solid var(--gris-clar);
    font-weight: normal;
    line-height: 1.25em
}

#descomptes dt {
    width: calc(50% - .5em);
    text-align: right;
    font-weight: bold
}

#descomptes dd {
    width: calc(50% - .5em);
}

#cupons td,
#cupons th {
    text-align: center
}

#cupons td:first-child,
#cupons th:first-child {
    text-align: left
}

.token strong {
    background-color: var(--groc-corporatiu);
    padding: 0 .125em;
}

#history .miniatures,
#modal-albara .miniatures {
    margin-top: .5rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

#history .miniatures li,
#modal-albara .miniatures li {
    width: calc(100% / 8 - 1%);
    padding: 0;
    margin-right: 1%;
}


/* imatge quadrada */

#history figure,
#modal-albara figure {
    width: 100%;
    height: 0;
    min-height: 1px;
    padding-bottom: 100%;
    position: relative;
    margin-right: 1%;
}

#history figure img,
#modal-albara figure img {
    bottom: 0;
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}

#modal-albara .modal-content {
    max-width: 436px;
    min-height: 200px;
    background-color: white;
    padding: 1rem;
    font-size: var(--font-small)
}

#modal-albara h1:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "assignment";
    vertical-align: middle;
    margin-right: .25em;
    font-size: var(--font-large);
}

#modal-albara h3 {
    font-weight: bold;
    margin-top: 1em;
    color: var(--negre);
}

table#albara td:not(:first-child) {
    text-align: right
}

table#albara tr:last-child {
    font-weight: bold;
    background-color: var(--groc-A100)
}

#modal-albara .comentaris {
    font-style: italic;
}

@media screen and (max-width: 768px) {
    #areaUsuari.section {
        padding-top: 0;
    }
    #areaUsuari .columns {
        display: flex;
    }
    #areaUsuari .columns {
        display: flex;
        flex-direction: column;
    }
    #areaUsuari .column.is-one-fifth {
        position: -webkit-sticky;
        position: sticky;
        top: 6rem;
        z-index: 20;
        padding-top: 0;
    }
    #areaUsuari .navbar-menu {
        box-shadow: none;
        border-bottom: 0px solid white;
    }
    /* convertim el menú lateral en horitzontal + scroll */
    #menu-usuari .menu-list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        overflow: auto;
        margin: 0 -.75rem;
        -webkit-overflow-scrolling: touch;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        border-bottom: 1px solid var(--gris-clar);
        background-color: white;
        -webkit-box-shadow: 0 0 0.25em 0 rgba(10, 10, 10, .25);
        box-shadow: 0 0 0.25em 0 rgba(10, 10, 10, .25);
        background-color: var(--negre);
    }
    #menu-usuari .menu-list li {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    }
    #menu-usuari .menu-list a {
        background-color: var(--gris-fosc);
        color: var(--gris-ultraclar);
        border-radius: 0;
    }
    #menu-usuari .menu-list a:hover {
        background-color: var(--gris-fosc);
        color: var(--gris-ultraclar);
    }
    #menu-usuari .menu-list a.is-active {
        background-color: var(--groc-corporatiu);
        color: var(--negre);
    }
    #menu-usuari ul li a:before {
        display: none;
    }
}


/* Avisos */

#avisos article {
    align-items: flex-start;
    display: flex;
    text-align: left;
    flex-wrap: nowrap;
    padding: 0.5em .75em 0.75rem;
    margin: 0 0 .75em;
    background-color: white;
    border-radius: 3px;
    box-shadow: 0 0.5em 1em -0.125em rgba(10, 10, 10, 0.1), 0 0px 0 1px rgba(10, 10, 10, 0.02);
}

#avisos article .contingut {
    align-items: flex-start;
    display: flex;
    text-align: left;
    flex-wrap: nowrap;
    justify-content: space-between;
    width: 100%;
}

#avisos article .cosAvis,
#avisos article .icona {
    margin-right: .5rem
}

@media all and (max-width: 600px) {
    #avisos article .contingut {
        flex-wrap: wrap
    }
    #avisos article .cosAvis {
        margin: 0 0 0.5rem
    }
}

#avisos a {
    color: var(--gris-fosc);
}

#avisos .material-icons {
    background-color: var(--negre);
    color: white;
    font-size: 150%;
    padding: .25em;
    border-radius: 50px;
    vertical-align: middle;
}

#avisos article.destacat {
    background-color: var(--groc-A100);
    border-color: var(--groc-A400);
}

#avisos .avisoferta .material-icons {
    background-color: var(--rosa);
    color: white;
}

#avisos .success .material-icons {
    background-color: var(--color-success);
    color: white;
}

#avisos .disabled .material-icons {
    background-color: var(--gris-clar);
    color: white;
}

#avisos .disabled * {
    color: var(--gris);
}


/* comentaris i valoracions */

.columns.comentari {
    font-size: var(--font-small);
    padding-bottom: 1em;
    margin-bottom: 1em;
    border-bottom: 1px solid var(--gris-clar);
}

.columns.comentari:nth-child(2n) {
    background-color: #fafafa;
}

.respostaAlchimia {
    background-color: var(--groc-A100);
    color: var(--negre);
    padding: 0.5em 1em;
    margin-top: .5em;
}

@media (max-width: 768px) {
    #areaUsuari .columns.is-mobile {
        flex-direction: row;
    }
    .comentari .column.is-3 {
        padding-bottom: 0;
    }
}


/* Swiper home ************************************************************* */

.swiper-container {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.swiper-button-prev {
    background-image: none;
    left: 1rem;
    right: auto;
}

.swiper-button-next {
    background-image: none;
    right: 1rem;
    left: auto;
}

.swiper-button-prev:before,
.swiper-button-next:after {
    font-family: 'Material Icons';
    /* abans Sharp */
    font-weight: 600;
    content: "arrow_back_ios";
    font-size: 2rem;
    color: var(--gris);
    color: white;
    /*text-shadow: 4px 4px 2px rgba(0,0,0,0.9);*/
}

.swiper-button-next:after {
    content: "arrow_forward_ios";
}

.swiper-slide .container {
    padding-left: 10%;
    padding-right: 10%;
    height: auto;
}

.swiper-slide .titol {
    font-size: 3rem;
    line-height: 100%;
    font-weight: bold;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.25);
    margin-bottom: 1rem;
}

.swiper-slide .subtitol {
    font-size: 1.5rem;
    line-height: 1.75rem;
    margin-bottom: 1rem;
}

.swiper-slide .codi {
    font-size: 1.5em;
    font-family: var(--font-family-monospace);
    letter-spacing: .25em;
}

.swiper-slide {
    background-color: inherit
}


/* Galeria pàgina de detall versió mobile ****************************************************

https://idangero.us/swiper/ 
*/

.swiper-container {
    width: 100%;
    height: 100%;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    /* Center slide text vertically */
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
}

.swiper-pagination-bullet {}

#barraBanner .swiper-slide {
    font-size: var(--font-small);
    line-height: 1.2em
}


/* pàgina error 404 */

#error404 {
    background-color: var(--groc-800);
    text-align: center;
    color: white;
}

#error404 h3 {
    font-size: 500%;
    font-weight: bold;
}


/* format textos pàgines estàtiqus provinents de la bbdd */

.container.textbbdd {
    max-width: 768px
}

.container.textbbdd h3,
.container.textbbdd h4 {
    font-size: var(--font-medium);
    margin: 1.5rem 0 1rem;
    font-weight: 400;
    line-height: 1.25em;
    color: var(--negre);
}

.container.textbbdd p,
.container.textbbdd img {
    margin-bottom: 1em
}

.container.textbbdd .destacat {
    background-color: var(--gris-ultraclar);
    color: var(--negre);
    border: 0px solid var(--gris-clar);
    border-radius: 4px;
    padding: 1.25em;
    font-size: var(--font-medium);
    margin: 1.5em 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    line-height: 1.25;
}

.container.textbbdd .destacat:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "format_quote";
    font-size: 400%;
    line-height: 50%;
    margin-right: 1rem;
    color: var(--groc-900);
}

.img-25-dreta,
.img-50-dreta {
    float: right !important;
    margin: 0 0 0.5em 2%;
}

.img-25-esquerra,
.img-50-esquerra {
    float: left !important;
    margin: 0 2% 0.5em 0;
}

.img-25-dreta,
.img-25-esquerra {
    max-width: 23%
}

.img-50-dreta,
.img-50-esquerra {
    max-width: 48%
}


/* Caixes promo cogollo de la suerte */

.caixaPromo3 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-radius: 3px;
    padding: 2%;
    -webkit-box-shadow: 5px 5px 5px 0 rgba(0, 0, 0, .1);
    box-shadow: 5px 5px 5px 0 rgba(0, 0, 0, .1);
    background-color: var(--negre);
    color: var(--gris-clar);
    margin-bottom: 1.5rem;
    margin-top: -10px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.caixaPromo3 {
    background-color: var(--groc-A700);
    color: var(--negre);
    text-align: left;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row
}

.caixaPromo-titol {
    font-size: 150%;
    font-weight: 800;
    background: url(http://media.alchimiaweb.com/web/trebol.png) top left no-repeat;
    color: #fff;
    padding-left: 30px;
    line-height: 100%
}

.caixaPromo-intro {
    padding: 0 10px
}

.caixaPromo-codi {
    vertical-align: center
}

.caixaPromo-codi span {
    display: block;
    font-family: monospace;
    letter-spacing: .2em;
    font-weight: 700;
    background-color: #fff;
    color: #212121;
    padding: 5px 10px;
    border-radius: 3px;
    height: auto
}

.caixaPromo3 .caixaPromo-titol {
    background: url(http://media.alchimiaweb.com/web/buda-cogollo-100px.png) left center no-repeat;
    margin: -50px 0;
    padding: 50px 0 50px 110px
}

.caixaPromo3.columna {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 3% 7.5% 5%;
    margin: 60px 0 20px;
    text-align: center
}

.caixaPromo3.columna .caixaPromo-titol {
    background: url(http://media.alchimiaweb.com/web/buda-cogollo-100px.png) top center no-repeat;
    padding: 90px 0 0 0;
    margin: -50px 0 0 0
}

.caixaPromo3.columna .caixaPromo-intro {
    padding: 2.5% 0 5%
}

.cupoCerca .caixaPromo3 {
    box-shadow: none;
    margin-bottom: 0.5em
}

.cupoCerca .caixaPromo3 .caixaPromo-titol {
    font-size: var(--font-small)
}

.cupoCerca .caixaPromo3 .caixaPromo-titol {
    background-image: url(http://media.alchimiaweb.com/web/buda-cogollo-50px.png);
    padding-left: 60px;
}

@media all and (max-width:600px) {
    .caixaPromo-titol {
        background-position: center left
    }
    .caixaPromo-intro {
        padding: 10px 0
    }
    .caixaPromo3 {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 3% 7.5% 5%;
        margin: 60px 0 20px;
        text-align: center;
    }
    .caixaPromo3 .caixaPromo-titol {
        background: url(http://media.alchimiaweb.com/web/buda-cogollo-100px.png) top center no-repeat;
        padding: 90px 0 0 0;
        margin: -50px 0 0 0
    }
    .caixaPromo3 .caixaPromo-intro {
        padding: 2.5% 0 5%
    }
    .cupoCerca .caixaPromo3 {
        margin-top: -10px;
        padding: 2%;
        text-align: left;
    }
    .cupoCerca .caixaPromo3 .caixaPromo-titol {
        background: url(http://media.alchimiaweb.com/web/buda-cogollo-50px.png) left center no-repeat;
        margin: -50px 0;
        padding: 50px 0 50px 60px;
    }
}


/* pagina de regals */

#presents h3 {
    color: var(--alerta);
}


/* transportation */

#calcularTransport {
    max-width: 1023px;
    margin: 0 auto;
}

.resultatsTransport div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 1em;
    background-color: var(--gris-ultraclar);
    border-radius: 4px;
    margin-bottom: 1rem;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.resultatsTransport div h3 {
    width: 30%;
    min-width: 30%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    text-align: center;
    font-weight: bold;
    line-height: 1.15em;
    margin-right: 1rem;
    padding-right: 1rem;
    border-right: 1px solid var(--gris-clar);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.resultatsTransport div h3:before {
    font-family: "Material Icons";
    content: "local_shipping";
    font-size: 500%;
    line-height: 1;
    text-align: center;
    font-weight: normal;
}

.resultatsTransport div.puntopack h3:before {
    content: "store_mall_directory";
}

.resultatsTransport div.alertes h3:before {
    content: "error_outline";
}

.resultatsTransport div.alertes {
    background-color: var(--groc-corporatiu);
    color: var(--negre);
}

.resultatsTransport div.alertes h3 {
    border-color: white;
}


/* */

.resultatsTransport dl {
    width: 70%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.resultatsTransport dt,
.resultatsTransport dd {
    box-sizing: border-box;
    margin: 0;
    padding: .25em;
    border-bottom: 1px solid var(--gris-clar);
    font-weight: normal;
    line-height: 1.33em;
    vertical-align: bottom;
}

.resultatsTransport dt {
    width: calc(70%);
}

.resultatsTransport dd {
    width: calc(30%);
    text-align: right;
    font-weight: bold
}

.resultatsTransport dl dt:last-of-type,
.resultatsTransport dl dd:last-child {
    border: none;
}

.resultatsTransport dt+dd+dd.nota {
    background-color: var(--groc-500);
    padding: 0.25em .5em;
    margin-bottom: 1em;
}

.resultatsTransport dl dd.nota {
    color: var(--exit);
    width: 100%;
    text-align: left;
    font-weight: normal;
    font-size: var(--font-small)
}

.resultatsTransport dl dd.nota strong {
    color: inherit;
}

.resultatsTransport dl dd.nota:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "error_outline";
    vertical-align: top;
    margin-right: .25em;
    font-weight: normal;
}


/* */

.resultatsTransport ul {
    width: 70%;
}

.resultatsTransport li {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    border-top: 1px solid var(--gris-clar);
    padding-top: 0.25em;
    margin-top: 0.25em;
    flex-wrap: nowrap
}

.resultatsTransport div.alertes li {
    display: block;
    border-color: white;
}

.resultatsTransport li span {
    font-weight: bold
}

.resultatsTransport li:first-child {
    border: none;
}

.resultatsTransport li strong {
    color: inherit;
}

.resultatsTransport li.nota {
    align-items: flex-start;
    padding-top: 0;
    border: none;
    margin-bottom: 1em;
    color: var(--gris);
    font-size: var(--font-small);
    border: 2px dotted var(--groc-500);
    background-color: white;
    padding: 0.5em;
}

.resultatsTransport li.nota:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "info";
    margin-right: .25em;
    font-weight: normal;
    font-style: normal;
    color: var(--groc-900);
    font-size: 1.5em;
}

.resultatsTransport li.nota span {
    font-weight: normal
}

#calcularTransport .notification h3 {
    font-weight: bold;
}


/* input range slider */

.range {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.range span {
    font-size: var(--font-medium);
    font-weight: bold
}


/* http://danielstern.ca/range.css/ */

input[type=range].slider {
    -webkit-appearance: none;
    width: 100%;
    margin: 1rem;
}

input[type=range].slider:focus {
    outline: none;
}

input[type=range].slider::-webkit-slider-runnable-track {
    width: 100%;
    height: 8px;
    cursor: pointer;
    box-shadow: 0px 0px 0px rgba(255, 255, 255, 0), 0px 0px 0px rgba(255, 255, 255, 0);
    background: rgba(204, 204, 204, 0.67);
    border-radius: 8px;
    border: 0px solid #ffffff;
}

input[type=range].slider::-webkit-slider-thumb {
    box-shadow: 2px 2px 2px rgba(204, 204, 204, 0.67), 0px 0px 2px rgba(217, 217, 217, 0.67);
    border: 1px solid rgba(255, 255, 255, 0.57);
    height: 32px;
    width: 32px;
    border-radius: 100px;
    background: #ffeb3b;
    cursor: pointer;
    -webkit-appearance: none;
    margin-top: -12px;
}

input[type=range].slider:focus::-webkit-slider-runnable-track {
    background: rgba(204, 204, 204, 0.67);
}

input[type=range].slider::-moz-range-track {
    width: 100%;
    height: 8px;
    cursor: pointer;
    box-shadow: 0px 0px 0px rgba(255, 255, 255, 0), 0px 0px 0px rgba(255, 255, 255, 0);
    background: rgba(204, 204, 204, 0.67);
    border-radius: 8px;
    border: 0px solid #ffffff;
}

input[type=range].slider::-moz-range-thumb {
    box-shadow: 2px 2px 2px rgba(204, 204, 204, 0.67), 0px 0px 2px rgba(217, 217, 217, 0.67);
    border: 1px solid rgba(255, 255, 255, 0.57);
    height: 32px;
    width: 32px;
    border-radius: 100px;
    background: #ffeb3b;
    cursor: pointer;
}

input[type=range].slider::-ms-track {
    width: 100%;
    height: 8px;
    cursor: pointer;
    background: transparent;
    border-color: transparent;
    color: transparent;
}

input[type=range].slider::-ms-fill-lower {
    background: rgba(204, 204, 204, 0.67);
    border: 0px solid #ffffff;
    border-radius: 16px;
    box-shadow: 0px 0px 0px rgba(255, 255, 255, 0), 0px 0px 0px rgba(255, 255, 255, 0);
}

input[type=range].slider::-ms-fill-upper {
    background: rgba(204, 204, 204, 0.67);
    border: 0px solid #ffffff;
    border-radius: 16px;
    box-shadow: 0px 0px 0px rgba(255, 255, 255, 0), 0px 0px 0px rgba(255, 255, 255, 0);
}

input[type=range].slider::-ms-thumb {
    box-shadow: 2px 2px 2px rgba(204, 204, 204, 0.67), 0px 0px 2px rgba(217, 217, 217, 0.67);
    border: 1px solid rgba(255, 255, 255, 0.57);
    height: 32px;
    width: 32px;
    border-radius: 100px;
    background: #ffeb3b;
    cursor: pointer;
    height: 8px;
}

input[type=range].slider:focus::-ms-fill-lower {
    background: rgba(204, 204, 204, 0.67);
}

input[type=range].slider:focus::-ms-fill-upper {
    background: rgba(204, 204, 204, 0.67);
}

input[type="range"]:hover::-moz-range-track {
    background: var(--groc-500);
}


/***** Spinner carregant.... https://codepen.io/josephatR/pen/OdoGEY */

.contenidorSpinner {
    width: 100%;
    height: 30vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.spinner {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 5px solid var(--groc-corporatiu);
    background: transparent;
    border-top-color: #efef;
    border-bottom-color: #efef;
    border-left-color: var(--groc-corporatiu);
    -webkit-animation: spin 1.5s linear infinite;
    animation: spin 1.5s linear infinite;
    position: relative;
}

@-webkit-keyframes spin {
    0% {
        background: transparent;
        -webkit-transform: rotate(720deg);
        transform: rotate(720deg);
    }
}

@keyframes spin {
    0% {
        background: transparent;
        -webkit-transform: rotate(720deg);
        transform: rotate(720deg);
    }
}


/*
.read-more-wrap {
  max-height: 600px;
  overflow: hidden
}

.read-more-wrap-tot {
  max-height: inherit
}

#leermas {
  display: none;
  text-align: left;
  cursor: pointer;
  position: absolute;
  top: 1070px;
  height: 180px;
  width: 100%;
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjE3JSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjI4Ii8+CiAgICA8c3RvcCBvZmZzZXQ9IjYwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .28) 17%, rgba(255, 255, 255, 1) 60%, rgba(255, 255, 255, 1) 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(255, 255, 255, 0)), color-stop(17%, rgba(255, 255, 255, .28)), color-stop(60%, rgba(255, 255, 255, 1)), color-stop(100%, rgba(255, 255, 255, 1)));
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .28) 17%, rgba(255, 255, 255, 1) 60%, rgba(255, 255, 255, 1) 100%);
  background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .28) 17%, rgba(255, 255, 255, 1) 60%, rgba(255, 255, 255, 1) 100%);
  background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .28) 17%, rgba(255, 255, 255, 1) 60%, rgba(255, 255, 255, 1) 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, rgba(255, 255, 255, .28) 17%, rgba(255, 255, 255, 1) 60%, rgba(255, 255, 255, 1) 100%)
}

#leermas span {
  margin-top: 120px;
  display: inline-block;
  background-color: #fff;
  color: #212121;
  padding: 5px 50px;
  border-radius: 3px;
  transition-duration: .5s;
  border: 1px solid #ddd
}

#leermas span:hover {
  background-color: #f0f0f0;
  color: #111
}
*/

#carregaMesComandes,
#carregaMes {
    margin-top: 1rem;
}


/* BLOG *************************************************************************************************************************** */

@media screen and (min-width: 769px) {
    .section.blog {
        margin-top: .75rem
    }
    .blogContinguts {
        border-right: 1px solid var(--gris-clar);
        margin-right: 2rem;
        padding-right: 3rem;
    }
}

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


/* menu mobile */

.barraMenuBlogMobile {
    background-color: var(--negre);
    padding: 0.25em 1em;
    position: -webkit-sticky;
    position: sticky;
    top: 7rem;
}

.barraMenuBlogMobile a {
    color: var(--gris-clar);
}

.barraMenuBlogMobile a:hover {
    color: white
}

.barraMenuBlogMobile a:before {
    font-family: "Material Icons";
    content: "menu";
    font-size: 133%;
    margin-right: .25rem;
    line-height: 1;
    vertical-align: middle;
}

#modal-menuBlogMobile .menu-list a {
    padding: .25em .75em;
    /*border-top: 1px solid #dbdbdb;*/
}

#modal-menuBlogMobile .menu-list ul {
    margin-top: 0;
    padding-left: 0;
}

#modal-menuBlogMobile .menu-list ul a {
    border: none;
    font-style: oblique;
}

#modal-menuBlogMobile .menu-list li ul {
    margin-left: 1.5em
}


/* index */

#blogSidebar .menu-list a {
    padding: .25em .75em;
}

#blogSidebar .menu {
    margin-bottom: 2rem;
}

.blog.portada h2.subtitle,
.blog.categoria h2.subtitle,
.blog.manual h2.subtitle,
#resultatsBlog .subtitle {
    font-weight: bold;
    border-bottom: none;
    margin-bottom: 1rem;
}


/* .blog.portada h2.subtitle a,
*/

.blog.categoria h2.subtitle a
/*,
.blog.manual h2.subtitle a */

{
    border-bottom: none
}

.blog .metadades,
#resultatsBlog .metadades {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: var(--font-small);
    border-top: 1px solid var(--gris-clar);
    padding-top: .5em;
    margin-top: .5em;
}

.blog .metadades a {
    text-align: right;
}


/******************** inici canvis ****/

// .blog .card:not(.is-horizontal) {height: 100%}
.blog.portada .card {
    display: flex;
    flex-direction: column;
    width: 100%;
}

.blog.portada .card-footer {
    margin-top: auto;
    font-size: var(--font-small);
    padding: .5rem 0 2rem;
    justify-content: space-between;
    border-top: 1px dotted var(--gris-clar);
}

.blog .card-footer a {
    color: var(--gris);
}

.blog .card-footer a:hover {
    color: var(--negre);
    border-bottom: 2px solid var(--groc-500);
}

.blog .card-footer time {
    word-break: keep-all;
    color: var(--gris);
}

.blog.portada h2.subtitle {
    margin-bottom: .5rem;
}


/******************** fi canvis  ****/

.card .content {
    margin-bottom: 0;
}

.card .content p {
    margin-bottom: 0;
}

.blog .card figure img,
.blog.categoria article figure img,
#resultatsBlog article figure img {
    bottom: 0;
    height: 100%;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center;
    object-position: center;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}

#home .blog {
    margin-bottom: 1rem;
}

#home .blog h3.subtitle {
    font-size: var(--font-normal);
    font-weight: bold;
    margin-bottom: 1em;
}

#home .blog p {
    font-size: var(--font-small);
}

#home .blog .card {
    height: 100%
}

@media screen and (max-width: 768px) {
    .blog.portada article.card {
        width: 100%;
        margin: 0 0 2rem;
    }
}


/******************** inici canvis ****/


/* canvis sense el tile */

.llistat-posts-home {
    display: flex;
    flex-wrap: wrap;
}

.blog.portada .card {
    margin-bottom: 1rem;
    width: 100%;
    border: none;
    box-shadow: none;
}

.blog.portada .card-content {
    padding: 1rem 0;
}

@media only screen and (min-width: 1024px) {
    .blog.portada .card {
        width: calc(50% - 1.5rem);
        margin: 1rem 1.5rem;
    }
    .blog.portada .card:nth-child(odd) {
        margin-left: 0;
    }
    .blog.portada .card:nth-child(even) {
        margin-right: 0;
    }
    /*2 1rs posts amb foto amb gradient fosc al peu i text clar al damunt  */
    .pag1 .llistat-posts-home .card:nth-child(-n+2) {
        /*position:  relative;*/
        width: 100%;
        margin: 0 0 2rem;
    }
    .pag1 .llistat-posts-home .card:nth-child(-n+2) .card-content {
        position: absolute;
        bottom: 2rem;
        padding: 1.5rem;
    }
    .pag1 .llistat-posts-home .card:nth-child(-n+2) .subtitle {
        font-size: var(--font-large);
        margin-bottom: .75rem;
    }
    .pag1 .llistat-posts-home .card:nth-child(-n+2) .card-content,
    .pag1 .llistat-posts-home .card:nth-child(-n+2) .card-content a {
        color: var(--gris-ultraclar);
        color: white;
        text-shadow: 2px 2px 2px var(--gris-fosc);
    }
    .pag1 .llistat-posts-home .card:nth-child(-n+2) .card-content a:hover {
        color: #000;
        text-shadow: none
    }
    .pag1 .llistat-posts-home .card:nth-child(-n+2) .card-footer {
        background-color: #000;
        border: none;
        color: var(--gris);
        padding: 1rem 1.5rem;
    }
    .pag1 .llistat-posts-home .card:nth-child(-n+2) .card-footer a {
        color: var(--gris-inactiu);
        border: none;
    }
    .pag1 .llistat-posts-home .card:nth-child(-n+2) .card-footer a:hover {
        color: #000;
    }
    .pag1 .llistat-posts-home .card:nth-child(-n+2) figure.image::after {
        display: block;
        position: relative;
        background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0, #000000 100%);
        margin-top: -300px;
        height: 300px;
        width: 100%;
        content: '';
    }
    .pag1 .llistat-posts-home .card:nth-child(-n+2) .card-footer a,
    .pag1 .llistat-posts-home .card:nth-child(-n+2) .card-footer time {
        color: var(--gris-clar);
    }
    .pag1 .llistat-posts-home .card:nth-child(-n+2) .card-footer a:hover {
        color: var(--gris-ultraclar);
        border-bottom: 2px solid var(--groc-500);
    }
}

.section.blog.portada .blogContinguts .notification {
    background-color: transparent;
    padding: 0;
    margin-bottom: 1rem;
}

.section.blog.portada.pag1 .blogContinguts .notification {
    margin-bottom: 2rem;
}

.section.blog.portada .blogContinguts .notification .title {
    font-style: oblique;
    margin-bottom: 1.75rem;
}

.section.blog.portada .blogContinguts .notification .subtitle {
    font-size: var(--font-normal)
}

.section.blog.portada:not(.pag1) .blogContinguts .notification h1 {
    font-size: var(--font-small);
    font-weight: normal;
    margin-bottom: 0
}


/******************** fi canvis  ****/


/* post */

.entradaBlog .content figure {
    margin-left: 0;
    margin-right: 0
}

.entradaBlog .content figure.wp_imatge {
    margin: 0;
}

.entradaBlog .content figure figcaption {
    color: var(--gris);
    font-size: var(--font-small);
    margin: .5em 0 1.25em;
}


/*
.entradaBlog .size-large, 
.entradaBlog .size-full {
  width: 100%;
  height: auto;
  }
*/

.entradaBlog .all-columns {
    display: flex;
    justify-content: space-between;
    margin-bottom: 1rem;
}

.entradaBlog p:empty {
    display: none;
}

.entradaBlog h4 {
    font-size: var(--font-normal);
    font-weight: bold;
    font-style: normal;
}

.entradaBlog h4:before {
    content: "\2B24";
    margin-right: 0.33em;
    font-style: normal;
    font-weight: normal;
    color: var(--groc-500);
}


/* galeria */

.blog .content .my-gallery a {
    border: none;
}

.entradaBlog .my-gallery {
    display: flex;
    flex-wrap: wrap;
    margin: 0 0 1rem;
    padding: 0;
}

.entradaBlog .content .my-gallery figure {
    width: calc(100% / 4 - 2%);
    margin: 1%;
    -webkit-box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 5px 5px 5px 0px rgba(0, 0, 0, 0.1);
    font-size: var(--font-xsmall);
}

.entradaBlog .content .my-gallery figure figcaption {
    margin-bottom: 0.75em;
    font-size: var(--font-xsmall)
}

.entradaBlog .my-gallery figure a {
    display: block;
    width: 100%;
    height: 0;
    min-height: 1px;
    padding-bottom: 100%;
    position: relative;
}

.entradaBlog .my-gallery figure a img {
    bottom: 0;
    height: 100%;
    left: 0;
    object-fit: cover;
    object-position: center;
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
}

.entradaBlog table {
    margin: auto;
    border-collapse: collapse;
    overflow-x: auto;
    display: block;
    width: fit-content;
    max-width: 100%;
}


/* x desactivar mides fixades pel wp */

.entradaBlog table tr,
.entradaBlog table td {
    height: auto !important;
    width: auto !important;
    padding: .25em .5em !important;
}

.entradaBlog table * {
    font-size: var(--font-small)
}


/* related posts */

.section.related {
    padding-left: 0;
    padding-right: 0;
}

.section.related>h3 {
    margin-bottom: 1rem;
}

.related-posts {
    display: flex;
    flex-wrap: wrap;
}

.related-posts article {
    margin-bottom: 1rem;
    width: 100%;
}

.related-posts .subtitle {
    font-weight: bold;
    font-size: var(--font-normal)
}

.related-posts .card-content {
    padding: .5rem 1rem .75rem;
}

@media only screen and (min-width: 600px) {
    .related-posts article {
        width: calc(50% - 1rem);
        margin: .5rem;
    }
}

@media only screen and (min-width: 1024px) {
    .related-posts article {
        width: calc(100% / 3 - 1rem);
        margin: .5rem;
    }
}

#reviews2 form {
    margin-top: 2rem;
}

@media screen and (min-width: 769px) {
    .entradaBlog .content .my-gallery figure {
        width: calc(100% / 6 - 2%);
        margin: 1%;
    }
    /*
.entradaBlog .size-medium {
  float: left; 
  margin: 1rem 2rem -1rem 0;
  height: auto;
  }
*/
}


/* pàg categoria */

.entry-header .subtitle {
    margin-bottom: 1rem;
    font-size: var(--font-large)
}

.blog.categoria article footer {
    margin: 1rem 0 3rem;
}

.notification.descripcioCat {
    background-color: var(--gris-fosc);
    color: var(--gris-ultraclar);
    padding: 1rem 1.5rem;
    margin-bottom: 2rem;
    border-radius: .25rem;
}

.notification.descripcioCat h1 {
    margin-bottom: .25em;
    font-weight: bold;
    font-style: oblique;
    font-size: var(--font-large);
    line-height: 1em;
}

.blog.categoria figure {
    margin-bottom: 1.5rem;
}

.blog.categoria figure figcaption {
    background-color: rgba(0, 0, 0, 0.66);
    color: white;
    position: absolute;
    bottom: 0;
    padding: 0.25em 1em;
    font-size: var(--font-small);
}


/*evitem mostrar imatges en l'entradeta del post a la pàgina de categories */

.blog.categoria .entry-content .content img {
    display: none
}

.blog.categoria .entry-content .content h3 {
    font-size: var(--font-normal);
    font-weight: bold;
    margin-bottom: 1rem;
}


/* manual de cultivo */

.blog.manual .card:not(:last-child) {
    margin-bottom: 0.75rem;
}

#index-manual {
    background-color: var(--groc-500);
    padding: 1em;
    margin-bottom: 2rem;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border-radius: 3px;
}

#index-manual:before {
    font-family: "Material Icons";
    content: "menu_book";
    margin: 0 .5rem;
    color: white;
    font-size: 9rem;
    line-height: 1;
}

#index-manual .menu-list {
    -webkit-columns: 2;
    -moz-columns: 2;
    columns: 2;
}

#index-manual ul.menu-list li {
    margin-left: 1rem;
}

#index-manual ul.menu-list li a {
    border-bottom: 3px solid var(--groc-200);
}

#index-manual ul.menu-list li a:hover {
    background-color: var(--groc-200);
}

.blog.manual .menu-list a {
    padding: .25em .75em
}

#index-manual ul.menu-list li a.is-active {
    background-color: var(--gris-fosc);
    border-color: transparent;
    color: white;
}

.blog.manual h3.title:not(:first-of-type) {
    margin-top: 3rem;
}

.blog.manual h3.title a {
    color: var(--gris-fosc);
    font-weight: bold;
    font-style: oblique;
    background-color: var(--gris-fosc);
    color: white;
    border-radius: 0.25rem;
    padding: .5rem 1rem;
    margin-bottom: 1rem;
    display: flex;
    align-items: center
}

.blog.manual h3.title a span {
    background: white;
    border-radius: 0.8em;
    -moz-border-radius: 0.8em;
    -webkit-border-radius: 0.8em;
    color: var(--negre);
    display: block;
    font-weight: bold;
    line-height: 1.6em;
    margin-right: .5em;
    text-align: center;
    width: 1.6em;
    font-style: normal;
}

.blog.manual h3.title a:after {
    border: 10px dotted black;
    padding: 15px;
    background: lightblue;
    background-clip: padding-box;
}

@media screen and (min-width: 1024px) {
    .card.is-horizontal {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-preferred-size: 50ex;
        flex-basis: 50ex;
        -webkit-box-flex: 0;
        -ms-flex-positive: 0;
        flex-grow: 0;
        -ms-flex-negative: 1;
        flex-shrink: 1;
    }
    .card.is-horizontal .card-image {
        -webkit-box-flex: 2;
        -ms-flex: 2;
        flex: 2;
        -ms-flex-negative: 1;
        flex-shrink: 1;
    }
    .card.is-horizontal .card-image .image {
        display: block;
        position: relative;
        overflow: hidden;
        height: 100%;
        width: 100%;
    }
    .card.is-horizontal .card-image .image img {
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: center;
        object-position: center;
    }
    .card.is-horizontal .card-content {
        -webkit-box-flex: 3;
        -ms-flex: 3;
        flex: 3;
    }
}

@media screen and (max-width: 1023px) {
    #index-manual:before {
        display: none
    }
    #index-manual .menu-list {
        -webkit-columns: 1;
        -moz-columns: 1;
        columns: 1;
    }
    #index-manual ul.menu-list li {
        margin-left: 0;
    }
}


/* canvis manual cultivo, treiem ratlles.. */

.blog.manual .card {
    box-shadow: none;
}

.blog.manual .card:not(:last-child) {
    margin-bottom: 2.5rem;
}

.blog.manual h2.subtitle {
    margin-bottom: .5rem;
}

.blog.manual .card-content {
    padding: .75rem 0 0 0;
}

@media screen and (min-width: 1024px) {
    .blog.manual .card:not(:last-child) {
        margin-bottom: 3.5rem;
    }
    .blog.manual .card-content {
        padding: 0 0 0 1.5rem;
    }
    .blog.manual h3.title a {
        margin-bottom: 3rem
    }
}


/* post citat enmig d'un post */

.card.citaPost {
    font-size: var(--font-small);
    margin: 2rem 0;
    background-color: #ffffff;
    color: var(--negre);
    border-radius: 6px;
    border: 5px solid var(--groc-500);
    box-shadow: 3px 3px 6px rgba(50, 50, 50, .1);
}

.card.citaPost .subtitle {
    margin-bottom: 1rem;
}

.card.citaPost .subtitle a:before {
    font-family: "Material Icons";
    /* abans Sharp */
    content: "subject";
    vertical-align: top;
    margin-right: .15em;
    color: var(--gris);
    font-size: 1.25em;
    font-style: normal;
    padding-top: .15em;
}


/* ara enviem a tal país ************/

.araEnviemPais a {
    display: block;
    padding: 0 2.5% 2% 2.5%;
    border: 5px solid var(--groc-500);
    background-color: var(--groc-500);
    background-color: white;
    color: var(--negre);
    text-align: center;
}

.araEnviemPais a span:nth-child(2) {
    display: block;
    font-weight: 900;
    font-size: 2.8vw;
    line-height: 1;
}

.araEnviemPais a:before {
    font-family: "Material Icons";
    content: "local_shipping";
    color: var(--groc-600);
    font-size: 5em;
    line-height: 1;
    display: block;
}

.modal .araEnviemPais a {
    background-color: var(--groc-500)
}

.modal .araEnviemPais a:before {
    color: var(--negre);
}


/* en el manual de cultivo per veure el target del anchor sota la barra fixada */

 :target::before {
    content: "";
    display: block;
    height: 7rem;
    /* fixed header height*/
    margin: -7rem 0 0;
    /* negative fixed header height */
}

.tornarDalt {
    z-index: 30;
    position: fixed;
    bottom: 20px;
    right: 20px;
    background: rgb(0, 0, 0);
    background: rgba(0, 0, 0, 0.8);
    width: 50px;
    height: 50px;
    display: block;
    text-decoration: none;
    border-radius: 35px;
    -webkit-transition: all 0.5s linear;
    -o-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.tornarDalt i {
    color: #fff;
    margin: 0;
    position: relative;
    left: .55rem;
    top: .5rem;
    font-size: 2rem;
    -webkit-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.ocultar {
    opacity: 0;
}

.mostrar {
    opacity: 1;
}


/* faqs */

.accordion-faqs {
    margin-bottom: 4rem;
}

.accordion-faqs h3 {
    font-size: var(--font-normal);
    font-weight: bold
}

.accordion-faqs h2.subtitle {
    margin: 2rem 0 .5rem;
    font-weight: normal;
    font-size: var(--font-medium);
}

.accordion-faqs h2.subtitle:first-of-type {
    margin-top: 0;
}

.accordion-faqs h2.subtitle:before {
    font-family: 'Material Icons';
    content: 'trip_origin';
    color: var(--groc-500);
    font-weight: bold;
    font-style: normal;
    font-size: 1.75rem;
    /* Preferred icon size */
    line-height: 1;
    word-wrap: normal;
    white-space: nowrap;
    padding-right: .25rem;
    padding-bottom: 0rem;
    vertical-align: middle;
}

.accordion-faqs .ac {
    width: 100%;
}

.accordion-faqs .ac {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: auto;
    border-bottom: 2px solid var(--gris-clar);
}

.accordion-faqs .ac .ac-q {
    text-decoration: none;
    display: block;
    cursor: pointer;
    position: relative;
    padding: 0.5rem 2.5rem 0.5rem 0;
}

.accordion-faqs .ac .ac-q:focus {
    outline: none
}

.accordion-faqs .ac .ac-q::after {
    position: absolute;
    right: 0rem;
    top: 0.5rem;
    margin: 0 1rem;
    font-family: 'Material Icons';
    content: 'keyboard_arrow_down';
    color: var(--groc-900);
    font-weight: normal;
    font-style: normal;
    font-size: 1.5rem;
    /* Preferred icon size */
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    padding: 0;
    /* Support for all WebKit browsers. */
    -webkit-font-smoothing: antialiased;
    /* Support for Safari and Chrome. */
    text-rendering: optimizeLegibility;
    /* Support for Firefox. */
    -moz-osx-font-smoothing: grayscale;
    /* Support for IE. */
    font-feature-settings: 'liga';
}

.accordion-faqs .ac.is-active>.ac-q::after {
    content: 'keyboard_arrow_up';
}

.accordion-faqs .ac .ac-a {
    overflow-y: hidden;
    padding-right: 2.5rem;
}

.accordion-faqs .ac.js-enabled>.ac-a {
    visibility: hidden;
}

.accordion-faqs .ac.is-active>.ac-a {
    visibility: visible;
    margin: .0 0 1.5rem;
}

.accordion-faqs .ac .title {
    margin: 0;
}

.accordion-faqs .ac .title a {
    display: block;
    padding: .25rem 0
}

.menufaqs {
    position: -webkit-sticky;
    position: sticky;
    top: 7rem;
}