﻿/*#||###############################################*/
/*# STILI MULTISCHERMO #############################*/
/*#||###############################################*/
/*#|DETTAGLIO SEDE|#################################*/
/*#||###############################################*/
.dettaglio_sede { }
    /*#||###############################################*/
    /*#|APERTURA|#######################################*/
    .dettaglio_sede .apertura { margin-bottom: 3rem; }
        .dettaglio_sede .apertura .media { }
            .dettaglio_sede .apertura .media img { }
        .dettaglio_sede .apertura .title { }
        .dettaglio_sede .apertura .brand { display: block; position: relative; flex: 0 1 calc(100%/10); aspect-ratio: 10/5.5; }
            .dettaglio_sede .apertura .brand img { width: 70%; height: 70%; object-fit: contain; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); }
    /*#||###############################################*/
    /*#|CONTATTI|#######################################*/
    .dettaglio_sede .card_contatti { margin-bottom: 3rem; }
        .dettaglio_sede .card_contatti h2 { margin-bottom: 1rem; }
        .dettaglio_sede .card_contatti .bkg_clr_bw_fff { }
            .dettaglio_sede .card_contatti .bkg_clr_bw_fff .flx_itm {border-right: solid 1px #ccc; height: inherit; display: flex; justify-content: center; align-items: center; }
                .dettaglio_sede .card_contatti .bkg_clr_bw_fff .flx_itm:last-child {border-right-color: transparent; }
                .dettaglio_sede .card_contatti .bkg_clr_bw_fff .flx_itm a { text-align: center;  }
                .dettaglio_sede .card_contatti .bkg_clr_bw_fff .flx_itm a * { display: block; }
                    .dettaglio_sede .card_contatti .bkg_clr_bw_fff .flx_itm a i { margin-bottom: 0.5rem;  }
                    .dettaglio_sede .card_contatti .bkg_clr_bw_fff .flx_itm a span { }
    /*#||###############################################*/
    /*#|ORARI|##########################################*/
    .dettaglio_sede .orari { margin-bottom: 3rem; }
        .dettaglio_sede .orari .flx_itm { }
            .dettaglio_sede .orari .flx_itm i { flex: 0 1 5%; margin-top: 0.6rem; }
            .dettaglio_sede .orari .flx_itm p { flex: 0 1 95%; }
                .dettaglio_sede .orari .flx_itm p * { display: block; }
                .dettaglio_sede .orari .flx_itm p strong { }
                .dettaglio_sede .orari .flx_itm p span { }
/*#||###############################################*/

/*#||###############################################*/
/*--------------------------------------------------*/
/*#||###############################################*/
/*- STILI Comuni: tutti gli schermi DESKTOP --------*/
@media (min-width: 769px) {
    /*#||###############################################*/
    /*#|APERTURA|#######################################*/
    .dettaglio_sede .apertura { margin-top: 10rem; padding-top: 9rem; }
        .dettaglio_sede .apertura .media { height: 18rem; position: absolute; top: 0; left: 50%; transform: translate(-50%,-50%); aspect-ratio: 1/1; border-radius: 50%; overflow: hidden; border: solid 3px #fff; box-shadow: 0 0 0.8rem rgba(0,0,0,0.25); }
    /*#||###############################################*/
}
/*#||###############################################*/
/*- STILI Comuni: tutti gli schermi PORTABLE -------*/
@media (max-width: 768px) {
    /*#||###############################################*/
}
/*#||###############################################*/
/*--------------------------------------------------*/
/*#||###############################################*/
/*- STILI ESCLUSIVI GRANDI SCHERMI -----------------*/
@media (min-width: 1281px) {
    /*#||###############################################*/
}
/*#||###############################################*/
/*- STILI SCHERMI MEDI --------------------------*/
@media (min-width: 1025px) and (max-width: 1280px) {
    /*#||###############################################*/
}
/*#||###############################################*/
/*- STILI PICCOLI SCHERMI --------------------------*/
@media (min-width: 769px) and (max-width: 1024px) {
    /*#||###############################################*/
}
/*#||###############################################*/
/*- STILI TABLET -----------------------------------*/
@media (min-width: 481px) and (max-width: 768px) {
    /*#||###############################################*/
    .dettaglio_sede .apertura { margin-top: 11rem; padding-top: 9rem; }
        .dettaglio_sede .apertura .media { height: 18rem; position: absolute; top: 0; left: 50%; transform: translate(-50%,-50%); aspect-ratio: 1/1; border-radius: 50%; overflow: hidden; border: solid 3px #fff; box-shadow: 0 0 0.8rem rgba(0,0,0,0.25); }
        .dettaglio_sede .apertura .brand { flex: 0 1 calc(100%/4); }
    /*#||###############################################*/
    .dettaglio_sede .orari .flx_itm.d_flx { justify-content: start; }
    .dettaglio_sede .orari .flx_itm i {  margin-bottom: 0.6rem; }
    /*#||###############################################*/
}
/*#||###############################################*/
/*- STILI MOBILE -----------------------------------*/
@media (max-width: 480px) {
    /*#||###############################################*/
    .dettaglio_sede .apertura { margin-top: 1rem; }
        .dettaglio_sede .apertura .media { position: relative; width: 100%; height: auto; aspect-ratio: 1/1; border-radius: 1.5rem 1.5rem 0 0; overflow: hidden; }
            .dettaglio_sede .apertura .media:after { content: ''; display: block; position: absolute; bottom: 0; left: 0; width: 100%; height: 50%; background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 100%); }
        .dettaglio_sede .apertura .title {  }
        .dettaglio_sede .apertura .brand { flex: 0 1 calc(100%/3); }
    /*#||###############################################*/
    .dettaglio_sede .card_contatti .bkg_clr_bw_fff .flx_itm { border-right: none; border-bottom: solid 1px #ccc; }
    .dettaglio_sede .card_contatti .bkg_clr_bw_fff .flx_itm:last-child { border-bottom-color: transparent; }
    /*#||###############################################*/
}
/*--------------------------------------------------*/
