@font-face {
    font-family: 'CeraGR-RegularItalic';
    src: url('./fonts/CeraGR-RegularItalic.woff2')format('woff2'), url('./fonts/CeraGR-RegularItalic.woff')format('woff');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'CeraStencilGR';
    src: url('./fonts/CeraStencilGR-Black.woff2')format('woff2'), url('./fonts/CeraStencilGR-Black.woff')format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencilGR';
    src: url('./fonts/CeraStencilGR-Bold.woff2')format('woff2'), url('./fonts/CeraStencilGR-Bold.woff')format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Cera';
    src: url('./fonts/Cera-Light.woff2')format('woff2'), url('./fonts/Cera-Light.woff')format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'CeraGR';
    src: url('./fonts/CeraGR-LightItalic.woff2')format('woff2'), url('./fonts/CeraGR-LightItalic.woff')format('woff');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'CeraPRO';
    src: url('./fonts/CeraPRO-LightItalic.woff2')format('woff2'), url('./fonts/CeraPRO-LightItalic.woff')format('woff');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'CeraStencilCY';
    src: url('./fonts/CeraStencilCY-Black.woff2')format('woff2'), url('./fonts/CeraStencilCY-Black.woff')format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencil';
    src: url('./fonts/CeraStencil-Light.woff2')format('woff2'), url('./fonts/CeraStencil-Light.woff')format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Cera';
    src: url('./fonts/Cera-LightItalic.woff2')format('woff2'), url('./fonts/Cera-LightItalic.woff')format('woff');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'CeraCY';
    src: url('./fonts/CeraCY-Black.woff2')format('woff2'), url('./fonts/CeraCY-Black.woff')format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'CeraCY-RegularItalic';
    src: url('./fonts/CeraCY-RegularItalic.woff2')format('woff2'), url('./fonts/CeraCY-RegularItalic.woff')format('woff');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'CeraStencilCY';
    src: url('./fonts/CeraStencilCY-Medium.woff2')format('woff2'), url('./fonts/CeraStencilCY-Medium.woff')format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'CeraPRO';
    src: url('./fonts/CeraPRO-Medium.woff2')format('woff2'), url('./fonts/CeraPRO-Medium.woff')format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'CeraCY';
    src: url('./fonts/CeraCY-Bold.woff2')format('woff2'), url('./fonts/CeraCY-Bold.woff')format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'CeraGR';
    src: url('./fonts/CeraGR-Light.woff2')format('woff2'), url('./fonts/CeraGR-Light.woff')format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'CeraGR';
    src: url('./fonts/CeraGR-Bold.woff2')format('woff2'), url('./fonts/CeraGR-Bold.woff')format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Cera-RegularItalic';
    src: url('./fonts/Cera-RegularItalic.woff2')format('woff2'), url('./fonts/Cera-RegularItalic.woff')format('woff');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Cera';
    src: url('./fonts/Cera-MediumItalic.woff2')format('woff2'), url('./fonts/Cera-MediumItalic.woff')format('woff');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'CeraStencil';
    src: url('./fonts/CeraStencil-Medium.woff2')format('woff2'), url('./fonts/CeraStencil-Medium.woff')format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'CeraGR';
    src: url('./fonts/CeraGR-BoldItalic.woff2')format('woff2'), url('./fonts/CeraGR-BoldItalic.woff')format('woff');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'CeraStencilCY';
    src: url('./fonts/CeraStencilCY-Thin.woff2')format('woff2'), url('./fonts/CeraStencilCY-Thin.woff')format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencilPRO';
    src: url('./fonts/CeraStencilPRO-Black.woff2')format('woff2'), url('./fonts/CeraStencilPRO-Black.woff')format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Cera';
    src: url('./fonts/Cera-BlackItalic.woff2')format('woff2'), url('./fonts/Cera-BlackItalic.woff')format('woff');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'CeraCY';
    src: url('./fonts/CeraCY-Light.woff2')format('woff2'), url('./fonts/CeraCY-Light.woff')format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencilPRO';
    src: url('./fonts/CeraStencilPRO-Bold.woff2')format('woff2'), url('./fonts/CeraStencilPRO-Bold.woff')format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'CeraGR';
    src: url('./fonts/CeraGR-BlackItalic.woff2')format('woff2'), url('./fonts/CeraGR-BlackItalic.woff')format('woff');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'CeraCY';
    src: url('./fonts/CeraCY-BoldItalic.woff2')format('woff2'), url('./fonts/CeraCY-BoldItalic.woff')format('woff');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'CeraGR';
    src: url('./fonts/CeraGR-ThinItalic.woff2')format('woff2'), url('./fonts/CeraGR-ThinItalic.woff')format('woff');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'CeraPRO';
    src: url('./fonts/CeraPRO-Regular.woff2')format('woff2'), url('./fonts/CeraPRO-Regular.woff')format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencil';
    src: url('./fonts/CeraStencil-Thin.woff2')format('woff2'), url('./fonts/CeraStencil-Thin.woff')format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencilGR';
    src: url('./fonts/CeraStencilGR-Regular.woff2')format('woff2'), url('./fonts/CeraStencilGR-Regular.woff')format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencilCY';
    src: url('./fonts/CeraStencilCY-Regular.woff2')format('woff2'), url('./fonts/CeraStencilCY-Regular.woff')format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CeraCY';
    src: url('./fonts/CeraCY-Thin.woff2')format('woff2'), url('./fonts/CeraCY-Thin.woff')format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'CeraPRO';
    src: url('./fonts/CeraPRO-BlackItalic.woff2')format('woff2'), url('./fonts/CeraPRO-BlackItalic.woff')format('woff');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'CeraPRO';
    src: url('./fonts/CeraPRO-ThinItalic.woff2')format('woff2'), url('./fonts/CeraPRO-ThinItalic.woff')format('woff');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'CeraStencil';
    src: url('./fonts/CeraStencil-Regular.woff2')format('woff2'), url('./fonts/CeraStencil-Regular.woff')format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencilGR';
    src: url('./fonts/CeraStencilGR-Medium.woff2')format('woff2'), url('./fonts/CeraStencilGR-Medium.woff')format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Cera';
    src: url('./fonts/Cera-Thin.woff2')format('woff2'), url('./fonts/Cera-Thin.woff')format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'CeraGR';
    src: url('./fonts/CeraGR-Thin.woff2')format('woff2'), url('./fonts/CeraGR-Thin.woff')format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'Cera';
    src: url('./fonts/Cera-Bold.woff2')format('woff2'), url('./fonts/Cera-Bold.woff')format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'Cera';
    src: url('./fonts/Cera-Medium.woff2')format('woff2'), url('./fonts/Cera-Medium.woff')format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencilPRO';
    src: url('./fonts/CeraStencilPRO-Thin.woff2')format('woff2'), url('./fonts/CeraStencilPRO-Thin.woff')format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencilPRO';
    src: url('./fonts/CeraStencilPRO-Regular.woff2')format('woff2'), url('./fonts/CeraStencilPRO-Regular.woff')format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CeraGR';
    src: url('./fonts/CeraGR-Regular.woff2')format('woff2'), url('./fonts/CeraGR-Regular.woff')format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CeraPRO';
    src: url('./fonts/CeraPRO-Black.woff2')format('woff2'), url('./fonts/CeraPRO-Black.woff')format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Cera';
    src: url('./fonts/Cera-ThinItalic.woff2')format('woff2'), url('./fonts/Cera-ThinItalic.woff')format('woff');
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: 'CeraStencilGR';
    src: url('./fonts/CeraStencilGR-Thin.woff2')format('woff2'), url('./fonts/CeraStencilGR-Thin.woff')format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'CeraGR';
    src: url('./fonts/CeraGR-Medium.woff2')format('woff2'), url('./fonts/CeraGR-Medium.woff')format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'CeraPRO';
    src: url('./fonts/CeraPRO-Bold.woff2')format('woff2'), url('./fonts/CeraPRO-Bold.woff')format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'CeraPRO';
    src: url('./fonts/CeraPRO-BoldItalic.woff2')format('woff2'), url('./fonts/CeraPRO-BoldItalic.woff')format('woff');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'CeraStencilCY';
    src: url('./fonts/CeraStencilCY-Light.woff2')format('woff2'), url('./fonts/CeraStencilCY-Light.woff')format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'CeraCY';
    src: url('./fonts/CeraCY-MediumItalic.woff2')format('woff2'), url('./fonts/CeraCY-MediumItalic.woff')format('woff');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'CeraPRO';
    src: url('./fonts/CeraPRO-MediumItalic.woff2')format('woff2'), url('./fonts/CeraPRO-MediumItalic.woff')format('woff');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'CeraStencilCY';
    src: url('./fonts/CeraStencilCY-Bold.woff2')format('woff2'), url('./fonts/CeraStencilCY-Bold.woff')format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'CeraCY';
    src: url('./fonts/CeraCY-BlackItalic.woff2')format('woff2'), url('./fonts/CeraCY-BlackItalic.woff')format('woff');
    font-weight: 900;
    font-style: italic;
}

@font-face {
    font-family: 'CeraGR';
    src: url('./fonts/CeraGR-Black.woff2')format('woff2'), url('./fonts/CeraGR-Black.woff')format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencil';
    src: url('./fonts/CeraStencil-Black.woff2')format('woff2'), url('./fonts/CeraStencil-Black.woff')format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'CeraCY';
    src: url('./fonts/CeraCY-Medium.woff2')format('woff2'), url('./fonts/CeraCY-Medium.woff')format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Cera';
    src: url('./fonts/Cera-BoldItalic.woff2')format('woff2'), url('./fonts/Cera-BoldItalic.woff')format('woff');
    font-weight: bold;
    font-style: italic;
}

@font-face {
    font-family: 'CeraStencilGR';
    src: url('./fonts/CeraStencilGR-Light.woff2')format('woff2'), url('./fonts/CeraStencilGR-Light.woff')format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'CeraGR';
    src: url('./fonts/CeraGR-MediumItalic.woff2')format('woff2'), url('./fonts/CeraGR-MediumItalic.woff')format('woff');
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: 'Cera';
    src: url('./fonts/Cera-Black.woff2')format('woff2'), url('./fonts/Cera-Black.woff')format('woff');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencilPRO';
    src: url('./fonts/CeraStencilPRO-Medium.woff2')format('woff2'), url('./fonts/CeraStencilPRO-Medium.woff')format('woff');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencilPRO';
    src: url('./fonts/CeraStencilPRO-Light.woff2')format('woff2'), url('./fonts/CeraStencilPRO-Light.woff')format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'CeraPRO';
    src: url('./fonts/CeraPRO-Thin.woff2')format('woff2'), url('./fonts/CeraPRO-Thin.woff')format('woff');
    font-weight: 100;
    font-style: normal;
}

@font-face {
    font-family: 'CeraCY';
    src: url('./fonts/CeraCY-LightItalic.woff2')format('woff2'), url('./fonts/CeraCY-LightItalic.woff')format('woff');
    font-weight: 300;
    font-style: italic;
}

@font-face {
    font-family: 'Cera';
    src: url('./fonts/Cera-Regular.woff2')format('woff2'), url('./fonts/Cera-Regular.woff')format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CeraStencil';
    src: url('./fonts/CeraStencil-Bold.woff2')format('woff2'), url('./fonts/CeraStencil-Bold.woff')format('woff');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'CeraCY';
    src: url('./fonts/CeraCY-Regular.woff2')format('woff2'), url('./fonts/CeraCY-Regular.woff')format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'CeraPRO';
    src: url('./fonts/CeraPRO-Light.woff2')format('woff2'), url('./fonts/CeraPRO-Light.woff')format('woff');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'CeraPRO-RegularItalic';
    src: url('./fonts/CeraPRO-RegularItalic.woff2')format('woff2'), url('./fonts/CeraPRO-RegularItalic.woff')format('woff');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'CeraCY';
    src: url('./fonts/CeraCY-ThinItalic.woff2')format('woff2'), url('./fonts/CeraCY-ThinItalic.woff')format('woff');
    font-weight: 100;
    font-style: italic;
}

/* GLABALS ---------------------------------------- */

* {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    --color-primary: rgb(0, 89, 160);
    --color-secondary: #f196c6;
    --color-third: #8ad1e7;
    --color-fourth: #c3acc6;
    --color-hover: rgb(245, 182, 199);
    --color-text: rgb(102, 107, 110);
    --color-grey: rgb(197, 189, 184);
}

.vh-50 {
    min-height: 50vh !important
}

.vh-75 {
    min-height: 75vh !important
}


/* Tipografia ---------------------------------------- */
body {
    font-family: 'CeraPRO', sans-serif;
    font-weight: normal;
    font-style: normal;
}

.stencil,
.navbar-brand {
    font-family: 'CeraStencilPRO', sans-serif;
    font-weight: 500;
    font-size: 3.5rem;
}

.navbar-brand-small {
    font-family: 'CeraStencilPRO', sans-serif;
    font-weight: 500;
    font-size: 1.5rem;
    line-height: .5;
    margin-right: -65px
}

.navbar-text {
    text-transform: uppercase;
    font-size: 0.8rem;
    line-height: 1.3;
    font-weight: 500;
}

.nav-link {
    text-transform: uppercase;
    font-size: 0.9rem;
    font-weight: 500;
}

.card-title {
    font-weight: bold;
}

.news-cat-list li {
    border-top: 1px solid rgb(216, 216, 216);
    padding: 0.5rem 0;
}

.news-cat-list li:last-child {
    border-bottom: 1px solid rgb(216, 216, 216);
}

.lista-corsi li {
    border-top: 1px solid rgb(216, 216, 216);
}

.stencil {
    font-family: 'CeraStencilPRO', sans-serif;
    font-weight: 500;
}

article h1 {
    font-weight: 500;
    font-size: 3rem;
}

article h3 {
    font-weight: 300;
}

.article-body p {
    font-size: large;
    line-height: 1.8;
}

h1,
h2 {
    font-weight: 700 !important
}

.titolo {
    text-transform: capitalize
}

.bold {
    font-weight: 700 !important
}

footer .stencil {
    font-size: 1rem !important
}


@media screen and (max-width: 768px) {
    article h1 {
        font-weight: 500;
        font-size: calc(1.375rem + 1.5vw) !important
    }
}





/* IMMAGINI ---------------------------------------- */

.lazyload,
.lazyloading {
    opacity: 0;
}

.lazyloaded {
    opacity: 1;
    transition: opacity 300ms;
}

.img__container {
    position: relative;
    overflow: hidden;
}

.img__container:before {
    display: block;
    width: 100%;
    content: "";
    padding-bottom: 66%;
    height: 0;
}

.img__fit {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    font-family: "object-fit: cover, object-position: center center";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

.promozione .img__fit,
.pin_container .img__fit,
.card__soluzione .img__fit,
.card__listino .img__fit,
.card__promozione .img__fit {
    -o-object-fit: contain;
    object-fit: contain !important;
}

.card__promozione .img__fit {
    object-position: left center !important;
    -o-object-position: left center !important;
}

.card__listino .img__container:before,
.card__promozione .img__container:before,
.promozione .img__container:before {
    padding-bottom: 120% !important
}

.card__listino img {
    border: 1px solid silver
}

.scadute img {
    -moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
}



/* Colori ---------------------------------------- */


body {
    color: var(--color-text);
}

.bwt-blue {
    color: var(--color-primary);
}

.bwt-pink {
    color: var(--color-secondary);
}

.bwt-grey {
    color: var(--color-grey);
}

a,
a:visited {
    color: var(--color-primary);
}

a:hover {
    color: rgb(245, 182, 199);
    text-decoration: none;
}

a:hover svg {
    stroke: rgb(245, 182, 199);
}

.card {
    background-color: transparent;
}

.bg-grey {
    background-color: rgb(232, 232, 232);
}

.bg-blue-bwt {
    background-color: var(--color-primary);
}

footer a,
footer a:visited,
footer a:active {
    color: rgb(102, 107, 110);
}

footer a:hover {
    color: var(--color-primary);
}

a:hover,
a:hover svg {
    transition: all 0.2s ease-in-out;
}

.card-title a {
    color: rgb(102, 107, 110);
}

.card-title a:hover {
    color: var(--color-primary);
}

.rete-agente {
    background-color: rgba(0, 89, 160, 0.2);
}





/* Nav ---------------------------------------- */

.nav-item:first-child>.nav-link {
    padding-left: 0;
}

.sticky.is-sticky {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 1000;
    width: 100%;
    background-color: white;
    transition: 0.2s ease-in-out;
    -webkit-box-shadow: 0px 7px 18px 0px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0px 7px 18px 0px rgba(0, 0, 0, 0.2);
    box-shadow: 0px 7px 18px 0px rgba(0, 0, 0, 0.2);
}

.navbar-nav {
    transform: translateX(0px);
    transition: .5s ease-in-out;
    transition-delay: .2s;
}

body.home .sticky.is-sticky .navbar-nav,
.sticky.wbrand .navbar-nav {
    transform: translateX(100px);
    transition: .5s ease-in-out;
}

.sticky-brand {
    position: absolute;
    opacity: 0;
    transition: .2s ease-in-out;
}

body.home .sticky.is-sticky .sticky-brand,
.sticky.wbrand .sticky-brand {
    position: absolute;
    opacity: 1;
    transition: .2s ease-in-out;
    transition-delay: .4s;
}

main {
    margin-top: 0px !important
}

body.home main {
    margin-top: inherit !important
}

.hamburger.is-active .hamburger-inner {
    transform: rotate(-90deg)
}

.hamburger-inner,
.hamburger-inner:after,
.hamburger-inner:before {
    height: 2px;
    width: 30px;
    background-color: var(--color-primary)
}

.hamburger-box {
    width: 30px
}

.hamburger--arrow.is-active .hamburger-inner:before {
    transform: translate3d(-8px, -1px, 0) rotate(-45deg) scaleX(.7);
}

.hamburger--arrow.is-active .hamburger-inner:after {
    transform: translate3d(-8px, 1px, 0) rotate(45deg) scaleX(.7);
}

.hamburger-inner:before {
    top: -6px
}

.hamburger-inner:after {
    bottom: -6px
}

.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner:after,
.hamburger.is-active .hamburger-inner:before {
    background-color: var(--color-secondary)
}

.navbar-brand-small_h {
    opacity: 0;
}

.is-sticky .navbar-brand-small_h {
    opacity: 1
}


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

    body.home .sticky.is-sticky .navbar-nav,
    .sticky.wbrand .navbar-nav {
        transform: translateX(0px);
    }

    .nav-item {
        padding: 0.5rem 0rem;
        border-bottom: 1px solid rgb(216, 216, 216);
    }

    header .list-inline-item {
        display: block
    }

    header .list-inline-item a {
        text-transform: uppercase;
        font-size: 0.9rem;
        font-weight: 500;
        padding: 0.8rem 0px;
    }

    header .nav-item.list-inline-item {
        padding: 0.8rem 0px;
    }

    header .list-inline-item:not(:last-child) {
        margin-right: 0px
    }

    .user-in-navbar:after {
        content: 'Profilo'
    }

    .navbar-brand-small {
        opacity: 1;
        margin-right: 0px
    }
}



/* Card ---------------------------------------- */

.card,
.card-footer,
.card-img,
.card-img-top {
    border: none;
    border-radius: 0;
}

.card-footer {
    background-color: transparent;
}

.b-right {
    border-right: 1px solid rgb(216, 216, 216);
}

.card:hover.card-img,
.card:hover.card-img-top {
    -webkit-filter: opacity(.6);
    filter: opacity(.6);
    transition: 0.3s ease-in-out;
}

#listini.card-img-top {
    box-shadow: 0px 7px 18px 0px rgba(0, 0, 0, 0.2);
}

.card__prodotto .card-text p {
    font-size: 80% !important
}




/* Bottoni ---------------------------------------- */

.btn {
    border-radius: 1.5rem;
    padding: 0.375rem 1.25rem !important
}

.btn-outline-primary {
    color: var(--color-primary);
    border-color: var(--color-primary);
}

.btn-outline-primary:hover {
    border-color: var(--color-primary);
    background-color: var(--color-primary);
}

.btn-sm {
    padding: .4rem.6rem.25rem.6rem;
}

.btn-primary {
    background-color: var(--color-primary);
    border-color: var(--color-primary)
}




/* Tabelle ---------------------------------------- */

#listings.table td,
#listings.table th {
    padding: 3rem 0.75rem;
}





/* HOME ---------------------------------------- */

.landing {
    background: url(./back-landing.jpg) no-repeat 70% 40%;
    background-size: contain
}

@media screen and (max-width: 768px) {
    .landing {
        background: none
    }
}


/* Map ---------------------------------------- */

#map {
    overflow: hidden;
    height: 50vh;
}

#rete .rete--results {}

#listings tr.active {
    background-color: var(--color-hover)
}

#listings td p {
    margin-bottom: 0px !important
}

#listings .td--1 {
    width: 5vw
}

#listings .td--2 {
    width: 33vw
}

#listings .td--3 {
    width: 35vw
}

#listings .td--4 {
    width: 15vw
}

#listings .td--5 {
    width: 12vw;
    text-align: center
}

.mapboxgl-popup-content {
    padding: 20px !important;
}

.agent__name,
.mapboxgl-popup-content {
    font-family: 'Cera';
    text-transform: uppercase
}

.mapboxgl-ctrl-geocoder--suggestion,
.mapboxgl-ctrl-geocoder--input {
    font-family: 'Cera' !important
}

.mapboxgl-popup-content h6 {
    color: var(--color-primary);
    font-weight: bold
}

.agent__name {
    font-weight: 700;
    color: var(--color-primary)
}

#agent__result p {
    margin-bottom: 0px
}

.geocode--container {
    position: relative
}

.geocoder {
    position: absolute;
    z-index: 5;
    min-width: 100%
}


.filter-group {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
}

.pt-6 {
    padding-top: 4rem !important
}

.span_pseudo,
.chiller_cb span:before,
.chiller_cb span:after {
    content: "";
    display: inline-block;
    background: #fff;
    width: 0;
    height: 0.2rem;
    position: absolute;
    transform-origin: 0%0%;
}

.chiller_cb {
    position: relative;
    height: 2rem;
    display: flex;
    align-items: center;
}

.chiller_cb input {
    display: none;
}

.chiller_cb input:checked~span {
    background: #fd2727;
    border-color: #fd2727;
}

.chiller_cb.check__rivenditorespecializzato input:checked~span {
    background: var(--color-secondary);
    border-color: var(--color-secondary);
}

.chiller_cb.check__grossista input:checked~span {
    background: var(--color-primary);
    border-color: var(--color-primary);
}

.chiller_cb.check__centrovenditaricambi input:checked~span {
    background: var(--color-third);
    border-color: var(--color-third);
}

.chiller_cb.check__concessionario input:checked~span {
    background: var(--color-fourth);
    border-color: var(--color-fourth);
}

.chiller_cb input:checked~span:before {
    width: 1rem;
    height: 0.15rem;
    transition: width 0.1s;
    transition-delay: 0.3s;
}

.chiller_cb input:checked~span:after {
    width: 0.4rem;
    height: 0.15rem;
    transition: width 0.1s;
    transition-delay: 0.2s;
}

.chiller_cb input:disabled~span {
    background: #ececec;
    border-color: #dcdcdc;
}

.chiller_cb input:disabled~label {
    color: #dcdcdc;
}

.chiller_cb input:disabled~label:hover {
    cursor: default;
}

.chiller_cb label {
    padding-left: 2rem;
    position: relative;
    z-index: 2;
    cursor: pointer;
    margin-bottom: 0;
    line-height: 0.9
}

.chiller_cb span {
    display: inline-block;
    width: 1.2rem;
    height: 1.2rem;
    border: 2px solid#ccc;
    position: absolute;
    left: 0;
    transition: all 0.2s;
    z-index: 1;
    box-sizing: content-box;
}

.chiller_cb span:before {
    transform: rotate(-55deg);
    top: 1rem;
    left: 0.37rem;
}

.chiller_cb span:after {
    transform: rotate(35deg);
    bottom: 0.35rem;
    left: 0.2rem;
}

.easy-autocomplete {
    width: 100% !important
}

.easy-autocomplete input {
    width: 100%;
}

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

    #listings .td--1 {
        width: 5vw
    }

    #listings .td--2 {
        width: 90vw
    }

}


/* Badge ---------------------------------------- */

.badge {
    padding: .7em 1em;
    font-size: 100%;
    border-radius: 2rem;
}

.round {
    display: inline-block;
    height: 30px;
    width: 30px;
    line-height: 30px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    background-color: black;
    color: #FFF;
    text-align: center;
    font-weight: 500;
}

/* Sticky ---------------------------------------- */
.sticky-top {
    z-index: 999;
}

.sticky-120 {
    top: 120px;
}












.pin__type--area {
    position: absolute
}

.pin__icon--add,
.pin__type--area {
    cursor: pointer;
    transition: all .35s;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    -webkit-box-pack: center;
    justify-content: center;
    text-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    -webkit-box-align: center;
    align-items: center
}

.pin__type {
    width: 30px;
    height: 30px;
    background: #65affa;
    color: #ffffff;
    -webkit-border-radius: 15px;
    -moz-border-radius: 15px;
    border-radius: 15px;
    line-height: 30px;
}

@media screen and (max-width: 768px) {
    .pin__type {
        width: 24px;
        height: 24px;
        line-height: 22px;
    }
}

.pin__size--small {
    width: 24px;
    height: 24px;
    line-height: 22px;
    font-size: 10px
}

.pin__size--medium {
    width: 32px;
    height: 32px;
    line-height: 30px;
    font-size: 16px
}

.pin__size--large {
    width: 48px;
    height: 48px;
    line-height: 46px;
    font-size: 18px
}

.pin__popup,
.pin__title {
    position: absolute
}

.pin__title:before,
.pin__popup:before {
    content: "";
    position: absolute
}

.pin__title {
    white-space: nowrap;
    background: #fff;
    left: 50%;
    -webkit-transform: translateX(-50%) scale(0);
    transform: translateX(-50%) scale(0);
    top: -webkit-calc(-100% - 10px);
    top: calc(-100% - 10px);
    padding: 5px 30px;
    font-size: 14px;
    transition: transform .35s
}

.pin__title:before {
    border: 6px solid transparent;
    border-top: 6px solid #fff;
    bottom: -12px;
    left: calc(50% - 6px);
    left: -webkit-calc(50% - 6px)
}

.pin__size--small+.pin__title {
    top: calc(-100% - 15px);
    top: -webkit-calc(-100% - 15px)
}

.pin__size--large+.pin__title {
    top: -100%
}

.pin__type--area .pin__title {
    top: -50px
}

.pin__type:not(.pin__opened):hover .pin__title {
    -webkit-transform: translateX(-50%) scale(1);
    transform: translateX(-50%) scale(1)
}

.popup__title {
    padding: 10px 15px;
    font-size: 16px
}

.popup__content {
    padding: 15px
}

.popup__title+.popup__content {
    border-top: 2px solid #f2f2f2
}

.popup__content iframe {
    width: 100%;
    height: 100%
}

.popup__content--product {
    text-align: center;
    background: #fff
}

.popup__content--product>* :not(:last-child) {
    margin-bottom: 10px
}

.pin__popup .popup__content--product h3 {
    font-size: 15px;
    color: #222;
    margin-top: 0;
    margin-bottom: 10px;
    text-transform: none
}

.popup__content--product>span {
    font-size: 14px;
    display: block;
    line-height: 1;
    color: #878787
}

.popup__content--product>span ins {
    background: 0 0;
    color: #c60f02;
    text-decoration: none
}

.popup__content--product>div {
    border-top: 1px solid #ddd;
    margin: 0 -15px
}

.popup__content--product>div form {
    display: inline-block;
    width: 50%;
    padding: 12px 0 0;
    height: auto;
    line-height: 1
}

.popup__content--product>div a,
.popup__content--product>div button.action.primary {
    display: inline-block;
    width: 50%;
    color: #222;
    padding: 12px 0 0;
    margin: 0;
    background: 0 0;
    box-shadow: none;
    border: 0;
    font-weight: 400;
    height: auto;
    line-height: 1;
    text-decoration: none
}

.popup__content--product>div button.action.primary {
    width: 100%;
    padding: 0;
    margin-top: -2.5px
}

.popup__content--product>div a:hover {
    background: 0 0;
    color: #222
}

.pin__popup_text_content {
    background: #fff;
    color: #878787
}

.pin__popup_text_content .popup__title {
    color: #2b2b2b
}

.pin__popup_text_content .popup__content {
    line-height: 23px
}

.popup__content--product .old-price .price-label {
    display: none
}

.popup__content--product .old-price .price {
    text-decoration: line-through
}

.popup__content .price-box .price {
    color: #333
}

.popup__content .price-box .minimal-price .price-label {
    color: #878787
}

.popup__content .price-box .special-price {
    margin-right: 10px
}

.popup__content .price-box .old-price .price {
    color: #878787
}

.pin__image:before {
    background: 0 0 !important
}

.pin__type.pin__type--area {
    background: rgba(0, 0, 0, 1) !important
}

.pin__type.pin__type--area .pin-label a {
    color: #fff !important;
    transition: all .3s ease-in-out;
    font-weight: bold
}

.pin__type.pin__type--area:hover {
    background: #000 !important
}

.pin__popup .popup__content {
    padding: 0
}

.pin__popup .popup__content .price-box .price {
    font-size: 13px
}

.pin__opened .pin__popup img,
.pin__popup img {
    width: 100%;
    display: block;
    height: auto !important
}

.pin__opened .pin-label {
    transform: rotate(45deg)
}

.pin__popup .popup__content--product h3 {
    padding: 0 10px;
    font-size: 11px;
    text-transform: lowercase
}

.pin__popup .popup__content--product .price-label {
    display: none
}

.popup__content--product>div {
    margin-left: 0;
    margin-right: 0;
    border-top: 1px solid #eee
}

.popup__content--product>div form {
    padding: 12px 0;
    border-left: 1px solid #eee;
    box-sizing: border-box;
    display: none
}

.popup__content--product>div a,
.popup__content--product>div button.action.primary {
    text-transform: lowercase;
    font-size: 10px;
    padding: 12px 0;
    font-family: "Kissuomo";
    letter-spacing: -.03em;
    font-weight: 400
}

.popup__content--product>div a:hover,
.popup__content--product>div button.action.primary:hover {
    color: #111
}

.pin__title {
    color: #878787;
    line-height: 25px
}




/***	FORM	******************************************/

.search-form {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1100;
    white-space: nowrap;
    text-align: center;
    background: var(--color-primary);
}

.search-form:after {
    content: '';
    display: inline-block;
    vertical-align: middle;
    height: 100%;
}

.lte-ie8 .search-form:after {
    *display: inline;
}

.search-form__fieldset {
    display: inline-block;
    position: relative;
    vertical-align: middle;
    margin: 0;
    border: 0;
    padding: 0;
    width: 65.78483%;
}

.lte-ie8 .search-form__fieldset {
    *display: inline;
}

@media(min-width:1024px)and(max-width:1279px) {
    .search-form__fieldset {
        width: 65.9751%;
    }
}

@media(min-width:768px)and(max-width:1023px) {
    .search-form__fieldset {
        width: 65.74586%;
    }
}

@media(max-width:767px) {
    .search-form__fieldset {
        width: 87.5%;
    }
}

.search-form__fieldset:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: -8px;
    margin-top: -8px;
    width: 32px;
    height: 32px;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkBAMAAAATLoWrAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAJFBMVEUAAAD///////////////////////////////////////8AAAC0t6v7AAAACnRSTlMAAWwHm7acbWu3qosOSQAAAAFiS0dEAIgFHUgAAAAJcEhZcwAAFiUAABYlAUlSJPAAAAChSURBVCjPbdLBDYMwDAVQoyzAoWIBFkCVfOiRGbgxAiMwCudWqv6UTYWDjfw5RMJ+gcS2SDdKeJ59XR6fySNlnUW6DYuHFO9eBsBZWYFZdsCZ1pevvODsj2q+HM7U0s4MSWB6JRu7kDMNPzpZQI1FZCwiYzd0shtqLCJjEbEQ2Zg/Tw6Rj0oulK9NipNLSAqd20GaRlpLBoCMCRkmMnJ5MH8416iVgCMM/wAAAABJRU5ErkJggg==")var(--color-primary);
    background-size: 16px 16px;
    pointer: cursor;
    border: 8px solid var(--color-primary);
}

@media(max-width:1023px) {
    .search-form__fieldset .container {
        position: absolute;
        width: 87.5%;
        left: 0;
        padding: 33%6.25%;
    }

    .search-form__fieldset .container:after {
        position: absolute;
        top: calc(47%+8px);
        right: calc(6.25%-8px);
        margin-top: 0;
    }
}

@media(max-width:767px) {
    .search-form__fieldset .container:after {
        top: calc(47%-8px);
    }
}

.search-cancel {
    width: 40px;
    height: 40px;
    position: absolute;
    z-index: 1;
    right: 15px;
    top: calc(33%+30px);
    pointer: cursor;
}

.search-form__field {
    display: block;
    margin: 0 auto;
    border: 0;
    border-bottom: 2px solid #f5f5f7;
    padding: 5px 0;
    width: 100%;
    font: bold 50px/1 'CeraPRO', sans-serif;
    background: none;
    color: #fff;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    appearance: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
}

@media(max-width:767px) {
    .search-form__field {
        font: bold 20px/1'CeraPRO', sans-serif;
    }
}




/***	MASTER CILLIT	******************************************/

#master-cillit input[type='text'] {
    border-radius: 1.5rem;
}

.progress-bar {
    position: absolute;
    height: 30px;
    border-right: 2px solid silver;
    background-color: transparent !important
}

.progress {
    background-image: -webkit-linear-gradient(left, rgb(0, 89, 160), rgb(245, 182, 199));
    background-image: -moz-linear-gradient(left, rgb(0, 89, 160), rgb(245, 182, 199));
    background-image: -ms-linear-gradient(left, rgb(0, 89, 160), rgb(245, 182, 199));
    background-image: -o-linear-gradient(left, rgb(0, 89, 160), rgb(245, 182, 199));
    background-image: linear-gradient(left, rgb(0, 89, 160), rgb(245, 182, 199));
    overflow: inherit !important;
    border-radius: 0px !important
}


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

    .w-50 {
        width: 100% !important
    }

}