/* Definizione delle variabili per i colori */
:root {
    --color-text-default: #53585a;
    --color-highlight: #9d2135;
    --color-background-default: #d9d9d9;
    --color-text-white: #ffffff;
    --color-link-hover: #ffffff;
    --color-background-salute: #73d8ef;
    --color-background-famiglia: #fdb62a;
    --color-background-tempo-libero: #69d371;
    --color-border: #53585a;
    --color-white: #ffff;
}

/* CSS Custom per loghi della Navbar */

nav .sec-brand-container {
    position: absolute;
    left: 200px !important;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 200px;
    height: auto;
}

nav .ter-brand-container {
    position: absolute;
    left: 450px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 200px;
    height: auto;
}

/* Nuova query media per nascondere i loghi sotto i 900px */
@media (max-width: 1000px) {
    nav .sec-brand-container,
    nav .ter-brand-container {
        display: none;
    }
}

/* CSS Custom per Menu della Navbar */

nav .nav-menu-container ul li a {
    color: var(--color-text-default);
}

nav .nav-menu-container ul li a:hover {
    color: var(--color-highlight) !important;
}

/* CSS Custom per Bottoni "Convenzionati" E "Area Riservata" Marca Solidale */

.bcc-button {
    background-color: var(--color-highlight);
    border: none;
}

nav .nav-menu-container ul li a.bcc-button.bcc-button-green {
    background-color: var(--color-highlight);
    border: none;
}

/* CSS Custom per box "nata su iniziativa Banca" e relativo Hover bottone */

.initial-claim {
    background-color: var(--color-background-default);
}

.initial-claim p {
    color: var(--color-text-default);
    font-size: 1.4rem;
}

.bcc-button.bcc-button-outline-white {
    color: var(--color-text-default);
    background-color: transparent;
    border: 1px solid var(--color-text-default);
}

.bcc-button.bcc-button-outline-white:hover {
    color: #ffffff;
    background-color: var(--color-highlight);
    border: none;
}

/* CSS Custom box "I nostri servizi" e relativo hover bottoni */

.bcc-button.bcc-button-outline {
    color: var(--color-text-default);
    background-color: transparent;
    border: 1px solid var(--color-text-default);
}

.bcc-button.bcc-button-outline:hover {
    color: #ffffff;
    background-color: var(--color-highlight);
    border: none;
}

/* CSS Custom per griglia quote associative */

.bcc-button.bcc-button-white {
    color: #ffff;
    background-color: var(--color-highlight);
    border : none;
}

.how-to-join {
    background-color: var(--color-background-default);
}

.how-to-join .table.price-table tbody tr.white-row td p {
    color: var(--color-highlight);
}

.how-to-join .table.price-table tbody tr td h2 {
    font-weight: 700;
    font-size: 2.4rem;
    color: var(--color-highlight);
}

.how-to-join .table.price-table tbody tr.white-row td {
    color: var(--color-text-default);
    border-right-color: var(--color-text-default);
}

.how-to-join h4, .how-to-join h5, .how-to-join p {
    color: var(--color-text-default);
}

.t-quote {
    color: var(--color-text-default) !important;
}

/* CSS Custom per Footer e Footer Bottom */

footer {
    background-color: var(--color-background-default);
    margin-top: 6rem;
    position: relative;
    z-index: 4;
}

footer ul li a {
    color: var(--color-text-default);
}

footer ul li a:hover {
    color: var(--color-highlight);
}

.footer-bottom {
    background-color: var(--color-text-default);
    position: relative;
    z-index: 4;
}

/* CSS Custom per colore Fonts*/


h5.sottotitolo {
    color: var(--color-text-default);
}

h5.documenti-scaricabili {
    color: var(--color-text-default);
}

h4 {
    color: var(--color-highlight);
}

.t-blue {
    color: var(--color-text-default) !important;
}

p.h4 {
    color: var(--color-text-default);
    font-weight: 600;
}

p.h5 {
    font-weight: 700;
    color: var(--color-text-default);
}

.our-services h5, .our-services p {
    color: var(--color-text-default);
}

.table.intern-table tbody tr td a {
    color: var(--color-text-default);
}

/*CSS Custom per area Salute e Benessere */

hr.linea-bianca {
    color: white;
    height: 4px;
}

a.area-campagne{
    text-decoration: none !important;
}

a.area-campagne:hover{
    color: var(--color-text-default) !important;
    text-decoration: underline !important;
}

h4.area-campagne:hover{
    color: var(--color-text-default) !important;
    text-decoration: underline !important;
}

.box-area-salute {
    border: none;
    background-color: var(--color-background-salute);
}

.box-area-salute, .box-area-salute h4 {
    color: #ffffff;
}

.box-area-salute a, .box-area-salute a:hover {
    color: #ffffff;
    text-decoration: underline;
}

.area-salute {
    background-color: var(--color-background-salute);
}

.t-white-title {
    color: #ffff !important;
}

/*CSS Custom per area Famiglia */

hr.linea-bianca {
    color: white;
    height: 4px;
}

a.area-famiglia{
    text-decoration: none !important;
}

a.area-famiglia:hover{
    color: var(--color-text-default) !important;
    text-decoration: underline !important;
}

h4.area-famiglia:hover{
    color: var(--color-text-default) !important;
    text-decoration: underline !important;
}

.box-area-famiglia {
    border: none;
    background-color: var(--color-background-famiglia);
}

.box-area-famiglia, .box-area-famiglia h4 {
    color: #ffffff;
}

.box-area-famiglia a, .box-area-famiglia a:hover {
    color: #ffffff;
    text-decoration: underline;
}

.area-famiglia {
    background-color: var(--color-background-famiglia);
}

.t-white-title {
    color: #ffff !important;
}

/*CSS Custom per area Tempo Libero */

hr.linea-bianca {
    color: white;
    height: 4px;
}

a.area-tempo-libero{
    text-decoration: none !important;
}

a.area-tempo-libero:hover{
    color: var(--color-text-default) !important;
    text-decoration: underline !important;
}

h4.area-tempo-libero:hover{
    color: var(--color-text-default) !important;
    text-decoration: underline !important;
}

.box-area-tempo-libero {
    border: none;
    background-color: var(--color-background-tempo-libero);
}

.box-area-tempo-libero, .box-area-tempo-libero h4 {
    color: #ffffff;
}

.box-area-tempo-libero a, .box-area-tempo-libero a:hover {
    color: #ffffff;
    text-decoration: underline;
}

.area-tempo-libero {
    background-color: var(--color-background-tempo-libero);
}

.t-white-title {
    color: #ffff !important;
}

/* CSS Custom per Breadcrumbs */

.breadcrumbz ul li {
    display: inline-block;
    font-size: 0.8rem;
    color: var(--color-text-default);
    font-weight: 700;
    position: relative;
}

.breadcrumbz ul li:first-child a {
    color: var(--color-text-default);
}

/* CSS Custom per Titoli e Sottotitoli sezioni Chi Siamo e Accordion*/

.table.intern-table tbody tr td h3 {
    color : var(--color-text-default);
    font-weight: 600;
    -webkit-transition: 0.3s all ease-in-out;
    -o-transition: 0.3s all ease-in-out;
    transition: 0.3s all ease-in-out;
}

.table.intern-table tbody tr td p {
    color : var(--color-text-default);
    font-size: 1rem;
    -webkit-transition: 0.3s all ease-in-out;
    -o-transition: 0.3s all ease-in-out;
    transition: 0.3s all ease-in-out;
}

.intern-accordion .accordion-item .accordion-header h3 button {
    text-decoration: none;
    font-size: 1.4rem;
    color: var(--color-text-default);
    font-weight: 600;
    -webkit-transition: 0.3s all ease-in-out;
    -o-transition: 0.3s all ease-in-out;
    transition: 0.3s all ease-in-out;
}

.intern-accordion .accordion-body {
    padding-left: 120px;
    background-color: var(--color-highlight);
    color: var(--whitetext);
}

.intern-accordion .accordion-body a {
    background-color: var(--color-highlight);
    text-decoration: underline;
    font-weight: bold;
    color: var(--whitetext);
}

.intern-accordion .accordion-body a:hover {
    color: var(--color-text-default);
}

.intern-accordion .accordion-item:not(:last-child) .accordion-header {
    border-bottom: 1px solid var(--color-highlight);
}

/* CSS Custom per Titolo pagina Mutuasalus*/

h4.titolo-mutuasalus {
    color: var(--color-text-default);
    font-weight: 600;
}

.bcc-button:hover {
    color: var(--color-text-default);
    background-color: var(--whitetext);
    padding: 10px 20px;
    border-radius: 20px;
    border: 1px solid var(--color-text-default);
}

/* CSS Custom per pagina Come diventare Socio*/

h2.come-testo {
    color: var(--color-highlight);
}

h5.come-testo {
    color: var(--color-highlight);
}

h5.come-testo:hover {
    color: var(--color-text-default);
}

/* CSS Custom per Index Ricerca Convenzionati */

.btn.choice-button.active {
    background-color: var(--color-highlight) !important;
    color: var(--whitebutton);
    outline: none;
    box-shadow: none;
}

button.btn.choice-button {
    text-align: left;
    background-color: var(--whitetext);
    width: 100%;
    border-radius: 30px;
    color: var(--color-text-default);
    font-weight: 600;
}

button.btn.choice-button:hover {
    text-align: left;
    background-color: var(--whitetext);
    width: 100%;
    border-radius: 30px;
    color:var(--color-background-default) ;
    font-weight: 600;
}

.bcc-select-container .bootstrap-select > .dropdown-toggle {
    background-color: var(--color-highlight) !important;
    color: var(--whitetext);
    border: 1px solid var(--bluetext);
    border-radius: 30px;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    font-size: 1rem;
    padding-left: 30px;
    width: 100% !important;
}


.bcc-select-container .bootstrap-select .dropdown-menu li a {
    border: 1px solid  var(--color-highlight) !important;
}

.bcc-select-container .bootstrap-select .dropdown-menu.show {
    background-color: var(--color-highlight);
    border: 1px solid var(--color-highlight);
    border-radius: 30px;
    color: var(--whitetext) !important;
}

.bcc-select-container .dropdown-item.active span, .bcc-select-container .dropdown-item:hover span, .bcc-select-container .dropdown-item:active span {
    color: var(--color-text-default) !important;
}

/* CSS Custom per pagina risultati convenzionati  */

.badge.badge-pill.badge-light.small {
    background-color: var(--color-highlight) !important;
}

.bcc-button.bcc-button-green {
    background-color: var(--color-highlight);
    border: 1px solid var(--color-highlight);
}

.bcc-button.bcc-button-green:hover {
    color: var(--color-text-default)!important;
}

.filter-trigger-container a.bcc-button.bcc-button-blue:hover {
    background-color: white;
    color: var(--color-highlight);
    border-color: var(--color-highlight);
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
    text-transform: uppercase;
}

.aside-convenzionati {
    background-color: var(--color-highlight) !important;
}

.left-filter-container .left-filter-wrapper .accordion.intern-accordion .accordion-item .accordion-body {
    padding-left: 20px;
    background-color: var(--color-text-default);
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
}

h4 a {
    color: var(--color-text-default);
}

h4 a:hover {
    color: var(--color-highlight);
}


.res2-container .res2-wrapper .address-container ul li {
    margin-left: 20px;
    color: var(--color-text-default);
}

.res2-container .res2-wrapper .address-container ul a i {
    color: var(--color-text-default) !important;
    position: absolute;
    top: 4px;
    left: 0;
    -webkit-transition: 0.3s all ease-in-out;
    -o-transition: 0.3s all ease-in-out;
    transition: 0.3s all ease-in-out;
}

.res2-container .res2-wrapper .address-container ul a {
    color: var(--color-highlight);
    -webkit-transition: 0.3s all ease-in-out;
    -o-transition: 0.3s all ease-in-out;
    transition: 0.3s all ease-in-out;
}

.intern-accordion.convenzionati-accordion {
    background-color: var(--color-highlight) !important;
    border: 1px solid var(--color-highlight);
    border-radius: 30px;
}

.left-filter-container {
    width: 20%;
    position: fixed;
    z-index: 9999;
    height: 100%;
    background-color: var(--color-highlight) !important;
    left: -19%;
    top: 0;
    overflow-y: scroll;
    -webkit-transition: .25s all ease-out;
    -o-transition: .25s all ease-out;
    transition: .25s all ease-out;
}

.intern-accordion {
    border: 1px solid var(--color-highlight);
    border-radius: 30px;
}

.badge.badge-pill {
    background-color: var(--color-highlight) !important;
}

.s-con-container ul.main-list li a {
    color: var(--color-text-default) !important;
}

.s-con-container ul.main-list li {
    color: var(--color-text-default) !important;
    position: relative;
    margin-bottom: 20px;
}

.s-con-container ul.main-list .mail:before {
    content: "\f0e0";
    position: absolute;
    top: 0;
    left: -30px;
    color: var(--color-text-default) !important;
    font-family: 'Font Awesome\ 5 Free';
    font-weight: 900;
}

.s-con-container ul.main-list .address:before {
    content: "\f3c5";
    position: absolute;
    top: 0;
    left: -30px;
    color: var(--color-text-default) !important;
    font-family: 'Font Awesome\ 5 Free';
    font-weight: 900;
}

.s-con-container ul.main-list .telephone:before {
    content: "\f3cd";
    position: absolute;
    top: 0;
    left: -30px;
    color: var(--color-text-default) !important;
    font-family: 'Font Awesome\ 5 Free';
    font-weight: 900;
}

.s-con-container ul.main-list .web:before {
    content: "\f0c1";
    position: absolute;
    top: 0;
    left: -30px;
    color: var(--color-text-default) !important;
    font-family: 'Font Awesome\ 5 Free';
    font-weight: 900;
}

/* CSS Custom per SpazioSalute BCC */
/*
.bordato-oro {
    border: 5px solid var(--color-background-salute);
}

.bordato-oro .titolo {
    position:relative;
    left: -5px;
    top: -36px;
    background-color: var(--color-background-salute) ;

}

.bordato-oro .titolo h4 {
    color: #fff;
    width: auto;
    transform:translate(0,10%);
}

ul.rounded-list {
    list-style-type: disc;
    margin-top: -10px;
    margin-left: 30px;
    color: #115ca8;
}
*/

/* CAROUSEL */
/* medium - display 2  */
@media (min-width: 768px) {

    .carousel-inner .carousel-item-right.active,
    .carousel-inner .carousel-item-next {
        transform: translateX(50%);
    }

    .carousel-inner .carousel-item-left.active,
    .carousel-inner .carousel-item-prev {
        transform: translateX(-50%);
    }
}

/* large - display 3 */
@media (min-width: 992px) {

    .carousel-inner .carousel-item-right.active,
    .carousel-inner .carousel-item-next {
        transform: translateX(16.5%);
    }

    .carousel-inner .carousel-item-left.active,
    .carousel-inner .carousel-item-prev {
        transform: translateX(-16.5%);
    }
}

@media (max-width: 768px) {
    .carousel-inner .carousel-item>div {
        display: none;
    }

    .carousel-inner .carousel-item>div:first-child {
        display: block;
    }
}

.carousel-inner .carousel-item.active,
.carousel-inner .carousel-item-next,
.carousel-inner .carousel-item-prev {
    display: flex;
}

.carousel-inner .carousel-item-right,
.carousel-inner .carousel-item-left {
    transform: translateX(0);
}

span.slider-name, span.slider-title {
    display: block;
    position: absolute;
    color: #fff;
    left: 2vw;
}

span.slider-name {
    font-weight: 900;
    bottom: 4vw;
    font-size: 1.2vw;
}

span.slider-title {
    font-weight: 100;
    bottom: 2.5vw;
    font-size: 1.0vw;
}


/* SLIDER */



section#slider {
    width: 100%;
}

section#slider span.nowrap {
    white-space: nowrap;
}

section#slider .slider-wrapper {
    padding: 0;
}

section#slider .scroll-wrapper {
    width: 100%;
    overflow-x: hidden;
}

section#slider ul {
    padding: 0;
    width: max-content;
    margin-right: 0;
    margin-left: 0;
    margin-bottom: 0;
}

section#slider li.slider {
    display: inline-block;
    position: relative;
    width: 24.6vw;
}

section#slider li.slider img {
    margin: 5px 10px 0 0;
    display: block;
    height: auto;
    max-width: 100%;
}

section#slider span.slider-name, span.slider-title {
    display: block;
    position: absolute;
    color: #fff;
    left: 2vw;
}

section#slider span.slider-name {
    font-weight: 900;
    bottom: 4vw;
    font-size: 1.5vw;
}

section#slider span.slider-title {
    font-weight: 100;
    bottom: 2.5vw;
    font-size: 1.3vw;
}

section#slider .more-slider {
    padding: 1vh 5% 0;
}

section#slider .more-slider h4 {
    font-family: 'Playfair Display', serif;
    color: #5896b0;
    font-weight: 500;
    font-size: 3vw;
    padding: 35px 0 25px 0px;
    margin-bottom: 0;
    margin-top: 8px;
}

section#slider .more-slider p {
    padding-bottom: 2vh;
}

section#slider .slide-controls {
    color: #5896b0;
    font-weight: 300;
}

section#slider .slide-controls span.slider-previous {
    margin-right: 75px;
}

section#slider .slide-controls i {
    font-size: 26px;
}

section#slider .more-slider a.button {
    border: 1px solid #5896b0;
    max-width: 200px;
    color: #5896b0;
    margin-top: 6vw;
}

section#slider .more-slider a.button:hover {
    color: #fff;
}

section#slider .more-slider a.button:before {
    background: #5896b0;
}

/*** Media Queries ***/

@media (max-width: 991px) {
    section#slider .more-slider {
        padding: 1vh 3% 0;
    }

    section#slider .more-slider h4 {
        font-size: 5vw;
        padding: 0 0 15px 0;
    }

    section#slider .slider-wrapper {
        width: 50%;
    }

    section#slider .content {
        padding: 35px;
    }

    section#slider .more-slider a.button {
        margin-top: 4vw;
        max-width: 175px;
        font-size: 15px;
        padding: 5px 0;
    }
}

@media (max-width: 768px) {
    section#slider .area {
        padding-right: 0;
        padding-left: 0;
    }

    section#slider .slider-wrapper {
        width: 100%;
    }

    section#slider .scroll-wrapper {
        overflow-x: scroll;
        -webkit-overflow-scrolling: touch;
    }

    section#slider li.slider {
        width: 49.2vw;
    }

    section#slider span.slider-title {
        bottom: 3.5vw;
        font-size: 3.3vw;
    }

    section#slider span.slider-name {
        bottom: 7vw;
        font-size: 3.5vw;
    }

    section#slider .more-slider h4 br, section#slider .slide-controls {
        display: none;
    }

    section#slider .more-slider a.button {
        margin-top: 0;
    }

    section#slider {
        padding-bottom: 0;
        margin-left: 0;
    }

    section#slider .more-slider {
        padding-left: 0;
    }

    section#slider .more-slider h4 {
        font-size: 7vw;

    }
}