/* MAIN */
html {
    overflow-x: hidden!important;
    height:100%;
}

.card {
    height: -webkit-max-content;
}

.body-loading {
    display: flex;
    height: 100%;
    width: 100%;
    align-content: center;
    align-items: center;
    text-align: center;
}

.body-loading .loading {
    text-align: center ;
    margin: auto;
    color: white
}

.imageRotateHorizontal {
    -moz-animation: spinHorizontal 1.5s infinite linear;
    -o-animation: spinHorizontal 1.5s infinite linear;
    -webkit-animation: spinHorizontal 1.5s infinite linear;
    animation: spinHorizontal 1.5s infinite linear;
}

@-moz-keyframes spinHorizontal {
    0% {
        transform: rotateY(0deg);
    }
    50% {
        transform:  rotateY(180deg) translateY(20px) scale(1.2,1.2);
        opacity: 0.5;
    }
    100% {
        transform: rotateY(360deg)
    }
}

@keyframes spinHorizontal {
    0% {
        transform: rotateY(0deg);
    }
    50% {
        transform:  rotateY(180deg) translateY(20px) scale(1.2,1.2);
        opacity: 0.5;
    }
    100% {
        transform: rotateY(360deg)
    }
}


@-ms-keyframes spinHorizontal {
    0% {
        transform: rotateY(0deg);
    }
    50% {
        transform:  rotateY(180deg) translateY(20px) scale(1.2,1.2);
        opacity: 0.5;
    }
    100% {
        transform: rotateY(360deg)
    }
}

@-o-keyframes spinHorizontal {
    0% {
        transform: rotateY(0deg);
    }
    50% {
        transform:  rotateY(180deg) translateY(20px) scale(1.2,1.2);
        opacity: 0.5;
    }
    100% {
        transform: rotateY(360deg)
    }
}

@-webkit-keyframes spinHorizontal {
    0% {
        transform: rotateY(0deg);
    }
    50% {
        transform:  rotateY(180deg) translateY(20px) scale(1.2,1.2);
        opacity: 0.5;
    }
    100% {
        transform: rotateY(360deg)
    }
}


body {
    font-family: 'Inter', sans-serif;
    height: 100%;
    font-weight: 400;
    background-color: #241f21;
    background-image: url(../img/background-ar.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
}

a {
    text-decoration: none !important;
    color: inherit;
}

p {
    margin-bottom: 0;
}

.container-fluid {
    /* padding-left: 30px; */
    /* padding-right: 30px;*/
}

.padd0 {
    padding: 0 !important;
}

/** GESTIONE MENU' MOBILE ANIMATO **/
.navbar-toggler {
    outline: none!important;
    border: none!important;
    background: transparent !important;
    box-shadow: none!important;
    margin-right: 42px;
}

.navbar-toggler:focus {
    background: transparent !important;
}

.navbar-toggler .icon-bar {
    background-color: #fff;
    transform: rotate(0deg) translate(0, 0);
    transition: ease all .2s;
}

.navbar-toggler .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px;
}

.navbar-toggler .icon-bar+.icon-bar {
    margin-top: 4px;
}

.icon-bar:nth-child(2) {
    width: 16px;
    transition: ease all .2s;
}

.navbar-toggler:hover>.icon-bar:nth-child(2) {
    width: 22px;
    transition: ease all .2s;
}

.navbar-toggler:active>.icon-bar:nth-child(2) {
    width: 22px;
    transition: ease all .2s;
}

.navbar-toggler:not(.collapsed) .icon-bar:nth-child(1) {
    transform: rotate(45deg) translate(5px, 4px);
    transition: ease all .2s;
}

.navbar-toggler:not(.collapsed) .icon-bar:nth-child(2) {
    opacity: 0;
    transition: ease all .2s;
}

.navbar-toggler:not(.collapsed) .icon-bar:nth-child(3) {
    transform: rotate(-45deg) translate(4px, -4px);
    transition: ease all .2s;
}

.menu-mobile .inner-container {
    background-color: rgb(29, 29, 27);
    width: 100%;
    padding: 10px 15px;
}

.menu-mobile .inner-container > div:not(:first-child) {
    margin: 10px 0px;
}

/** FINE GESTIONE **/

/* HEADER */
.totale-header {
    position: fixed;
    z-index: 10;
    transition: all 0.3s ease-in-out;
}


.main-header > .brands-container {
    display:flex;
    flex-wrap: nowrap;
    padding: 20px 0 20px 30px;
}

.totale-header.scrolled .main-header > .brands-container {
    padding: 5px 0 5px 15px;
}

.main-header .mobile-menu-container {
    display: none;
}

.totale-header.scrolled {
    background-color: #1d1d1b;
    -webkit-box-shadow: 0 5px 20px 0 rgba(0,0,0,0.5);
    box-shadow: 0 5px 20px 0 rgba(0,0,0,0.5);
    transition: all 0.3s ease-in-out;
}

.totale-header.scrolled .user-bar {
    display: none;
}

.totale-header.scrolled .main-header {
    border-bottom: 0;
    transition: all 0.5s ease-out;
}

.totale-header.scrolled .main-header .main-logo {
    height: 35px;
    transition: all 0.3s ease-in-out;
}

.totale-header.scrolled .main-header .loghi-gruppo {
    line-height: 35px;
    padding-top: 5px;
}

.totale-header.scrolled .main-header .loghi-gruppo img {
    height: 35px;
    /*margin-right: 40px;*/
}

.totale-header.scrolled .main-header .loghi-gruppo img:last-child {
    margin-right: 0;
}

.navbar-brand {
    height: 50px;
    border-right: 2px solid #0F86BE;
    padding-right: 20px;
    margin-right: 20px;
    padding-top: 5px;
}

.navbar-brand .main-logo {

}

.user-bar ~ .container-fluid {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.user-bar {
    text-align: right;
    height: 50px;
    line-height: 50px;
    padding-left: 30px;
    padding-right: 30px;
    background-color: #241f21;
}

.user-menu a {
    color: white;
    text-decoration: none !important;
    margin-right: 20px;
    display: inline-grid;
}

.user-menu a:last-child {
    margin-right: 0;
}

.user-icon {
    display: inline-flex;
    align-items: center;
}

.user-icon img {
    height: 20px;
    margin-right: 8px;
}

.main-header {
    background-color: rgba(36, 31, 33, 0.55);
}

.main-logo {
    height: 40px;
    transition: all 0.3s ease-in-out;
}

.loghi-gruppo {
    text-align: left;
}

.loghi-gruppo img {
    height: 50px;
    display: inline;
}

.loghi-gruppo img:last-child {
    margin-right: 0;
}

/* CONTENUTO */

.fascia-pre-lista {
    /*padding-bottom: 45px;*/
}

.fascia-pre-lista p {
    color: white;
    font-size: 15px;
    line-height: 40px;
    margin-bottom: 0;
}

.menu-utente {
    line-height: 40px;
    display: flex;
}

.menu-utente.desktop-menu-container a {
    color: white;
    font-size: 15px;
    padding: 0px 15px 10px 15px;
    transition: all 0.1s ease-in-out;
    border-bottom: 3px solid transparent;
}

.dropdown-item a {
    line-height: 30px;
    padding: 0;
}

.menu-utente.menu-mobile a {
    color: white;
    font-size: 15px;
    padding: 0;
    display: block;
    transition: all 0.1s ease-in-out;
    border-left: 5px solid transparent;
}

.menu-utente.desktop-menu-container a.active, .menu-utente.desktop-menu-container a:hover {
    transition: all 0.1s ease-in-out;
    transform: scale(1.02);
    border-bottom: 3px solid #0F86BE;
}

.menu-utente.menu-mobile a.active, .menu-utente.menu-mobile a:hover {
    transition: all 0.1s ease-in-out;
    border-left: 5px solid #0F86BE;
    padding-left: 15px;
    margin-left: 5px;
}

.contenitore-valore/*,
.contenitore-studio3a,
.contenitore-betobe,
.contenitore-peritia */{
    padding-top: 100px;
    padding-bottom: 45px;
    min-height: 100%;
}

.main-content-container > .contenitore-valore {
    padding-bottom: 0;
}

.legenda-loghi {
    display: inline-flex;
    flex-wrap: wrap;
}

.legenda-loghi .logo-legenda {
    margin: auto;
    margin-bottom: 10px;
}

.legenda-loghi .logo-legenda span {
    display: grid;
    border-radius: 100%;
    width: 25px;
    height: 25px;
    align-items: center;
    margin-right: 10px;
}

.logo-legenda {
    display: flex;
    align-items: center;
}

.logo-legenda img {
    height: 40px;
}

.legenda-loghi .logo-legenda[value='studio3a'] span {
    background-color: #eb7d00;
}

.legenda-loghi .logo-legenda[value='betobe'] span {
    background-color: #074875;
}

.legenda-loghi .logo-legenda[value='peritia'] span {
    background-color: #ffb914;
}

.blocco-testo h1 {
    font-size: 45px;
    color: white;
    font-weight: 400;
    line-height: 50px;
    margin-bottom: 30px;
}

.blocco-testo p {
    font-size: 15px;
    line-height: 19px;
    margin-bottom: 30px;
    color: white;
}

.blocco-testo hr {
    width: 40px;
    height: 3px;
    color: white;
    opacity: 1;
}

.lista-card .container-fluid {
    padding: 0;
}

.card-valore {
    border-radius: 10px;
    border: 0;
    transition: all 0.2s ease-in-out;
    margin-bottom: 24px;
}

.pratica-container:not([ruolo='segnalatore']) .card-valore:hover {
    transition: all 0.2s ease-in-out;
    transform: scale(1.02);
}

.card-valore .card-body {
    height: 100%;
    padding: 30px;
    display: flex;
    flex-direction: column;
}

.card-valore .card-text {
    font-size: 16px;
    color: #969696;
    text-decoration: none !important;
}

.card-valore .nome-sezione {
    font-size: 40px;
    font-weight: 500;
    height: 100%;
    color: black;
    /*position: absolute;
    bottom: 30px;
    margin-bottom: 0;
    */
    line-height: 40px;
}

.card-studio3a,
.card-betobe,
.card-peritia {
    border-radius: 10px;
    border: 0;
    transition: all 0.2s ease-in-out;
    margin-bottom: 24px;
}

.pratica-container[ruolo='segnalatore'] .card {
    cursor: auto!important;
    user-select: none!important;
}

.pratica-container:not([ruolo='segnalatore']) .card-studio3a:hover,
.pratica-container:not([ruolo='segnalatore']) .card-betobe:hover,
.pratica-container:not([ruolo='segnalatore']) .card-peritia:hover {
    transition: all 0.2s ease-in-out;
    transform: scale(1.02);
}

.card-studio3a .card-body,
.card-betobe .card-body,
.card-peritia .card-body {
    height: 100%;
    padding: 30px;
}

.card-studio3a .codice-pratica {
    font-size: 20px;
    color: #eb7d00;
    text-decoration: none !important;
}

.card-betobe .codice-pratica {
    font-size: 20px;
    color: #074875;
    text-decoration: none !important;
}

.card-peritia .codice-pratica {
    font-size: 20px;
    color: #ffb914;
    text-decoration: none !important;
}

.stato-pratica {
    font-size: 15px;
    text-decoration: none !important;
    font-weight: 500;
    position: absolute;
    top: 30px;
    right: 30px;
    display: inline-flex;
    align-items: flex-end;
}

.stato-pratica span {
    display: grid;
    border-radius: 100%;
    width: 13px;
    height: 13px;
    align-items: center;
    margin: auto 5px auto auto;
}

.stato-chiusa, [stato='IN LIQUIDAZIONE'].stato-pratica {
    color: #39b24a;
}

.stato-chiusa span, [stato='IN LIQUIDAZIONE'].stato-pratica span {
    background-color: #39b24a;
}

.stato-aperta, [stato='APERTA'].stato-pratica {
    color: #41a6ff;
}

.stato-aperta span, [stato='APERTA'].stato-pratica span {
    background-color: #41a6ff;
}

[stato='IN CAUSA'].stato-pratica {
    color:#ff4c4c;
}

[stato='IN CAUSA'].stato-pratica span {
    background-color:#ff4c4c;
}

.card-studio3a .nome-pratica,
.card-betobe .nome-pratica,
.card-peritia .nome-pratica {
    font-size: 25px;
    line-height: 30px;
    font-weight: 400;
    color: black;
    margin-top: 30px;
}

.card-valore .thumbnail {
    background-color: black;
}

.card-studio3a .thumbnail {
    background-color: #eb7d00;
}

.card-betobe .thumbnail {
    background-color: #074875;
}

.card-peritia .thumbnail {
    background-color: #ffb914;
}

.card-valore .thumbnail,
.card-studio3a .thumbnail,
.card-betobe .thumbnail,
.card-peritia .thumbnail {
    position: relative;
    min-height: 220px;
    overflow: hidden;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.card-valore .thumbnail img,
.card-studio3a .thumbnail img,
.card-betobe .thumbnail img,
.card-peritia .thumbnail img {
    position: absolute;
    left: 40%;
    top: 35%;
    height: 230px;
    -webkit-transform: translate(-57%,-18%);
    -ms-transform: translate(-57%,-18%);
    transform: translate(-57%,-18%);
}

.mod-vista {
    text-align: right;
}

.mod-vista img {
    display: inline-block;
    margin-left: 5px;
    height: 40px;
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.1s ease-in-out;
}

.mod-vista img:hover {
    transition: all 0.1s ease-in-out;
    transform: scale(1.08);
}

.bollino-lista {
    max-height: 100%;
    min-height: 60px;
    min-width: 10px;

    border-radius: 100px;
    display: none;
    margin-right: 25px;
}

.card-studio3a .bollino-lista {
    background-color: #eb7d00;
}

.card-betobe .bollino-lista {
    background-color: #074875;
}

.card-peritia .bollino-lista {
    background-color: #ffb914;
}

.info-pratica {
    margin-bottom: 20px;
    text-align: right;
}

.info-pratica .logo {
    height: 60px;
    margin-bottom: 35px;
}

.info-pratica .codice-pratica {
    font-size: 18px;
    color: white;
    display: block;
    border-bottom: 2px solid #eb7d00;
    /*padding: 8px 20px;*/
    /*border-radius: 100px;*/
}

.info-pratica .nome-pratica {
    color: white;
    font-weight: 400;
    font-size: 20px;
    line-height: 35px;
}

.info-pratica .stato-pratica {
    position: initial;
}

.menu-sez-pratica a, .menu-sez-pratica button {
    display: inline-block;
    background-color: white;
    font-size: 16px;
    padding: 10px 40px;
    margin-right: 5px;
    border-radius: 100px;
    font-weight: 500;
    transition: all 0.2s ease-in-out;
    color: white;
}

.menu-sez-pratica a:hover, .menu-sez-pratica button:hover {
    transition: all 0.2s ease-in-out;
    transform: scale(1.04);
}

.contenitore-box .container-fluid {
    padding: 0;
}

.box-pratica .titolo-sezione {
    color: white;
    display: flex;
    font-size: 18px;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 15px 30px;
}

.box-pratica table {
    background-color: white;
    font-size: 16px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    padding: 30px;
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
}

.box-pratica table tr td {
    line-height: 22px;
    border-bottom: 1px solid #bdbcbc;
    height: 45px;
}

.box-pratica table tr:last-child td {
    border-bottom: 0;
}

.box-pratica table tr td:first-child {
    color: black;
    width: 40%;
}

.box-pratica table tr td:nth-child(2) {
    width: 60%;
}

.lista-liquidazioni {
    background-color: white;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    padding: 30px;
    width: 100%;
}

.liquidazione {
    position: relative;
    margin-top: 25px;
    padding-bottom: 25px;
    border-bottom: 1px solid #bdbcbc;
}

.lista-liquidazioni .liquidazione:first-child {
    margin-top: 0;
}

.lista-liquidazioni .liquidazione:last-child {
    border-bottom: 0;
}

.liquidazione .importo {
    font-size: 30px;
    font-weight: 400;
    margin-bottom: 20px;
}

.liquidazione .data {
    position: absolute;
    right: 0;
    top: 0;
    font-weight: 500;
}

.liquidazione .descrizione {
    font-size: 16px;
    line-height: 25px;
    color: black;
}

.lista-allegati .container-fluid {
    padding: 0;
}

.lista-allegati .col-md-12 {
    margin-bottom: 10px;
}

.allegato {
    display: flex;
    background-color: white;
    padding: 12px 15px;
    border-radius: 10px;
    transition: all 0.2s ease-in-out;
    align-items: center;
    line-height: 20px;
    position: relative;
}

.allegato:hover {
    transition: all 0.2s ease-in-out;
    transform: scale(1.02);
}

.allegato > .tipo-mime-allegato {
    margin-right: 5px;
    text-align: center;
}

.allegato > p, .allegato > div {
    display: inline-block;
    font-size: 15px;
}

.allegato .categoria-allegato {

}

.allegato .nome-allegato {
    color: black;
}

.allegato .info-allegato {
    margin-left: auto;
    margin-right: 5px;
    display: inline-flex;
    flex-direction: column;
}


.caricamento-allegato {
    position: sticky;
    top: 0;
}

.caricamento-allegato .tasto-caricamento {
    float: right;
    width: 100%;
    padding: 20px 30px;
    color: white;
    border-radius: 100px;
    font-size: 16px;
    border: 0;
}

.caricamento-allegato .tasto-caricamento:hover {
    background-color: black !important;
    border: 0;
}

.caricamento-allegato .tasto-caricamento:focus {
    box-shadow: none !important;
}

.carica-documento .modal-content {
    background-color: transparent;
    border: 0;
}

.carica-documento .modal-header {
    background-color: transparent !important;
    display: initial;
    padding-left: 0;
    padding-right: 0;
    border: 0;
    text-align: center;
}

.carica-documento .modal-body,
.carica-documento .modal-footer {
    background-color: white;
}

.carica-documento .modal-body {
    padding: 50px;
    border-radius: 10px;
}

.carica-documento .modal-title {
    font-size: 45px;
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    color: white;
}

.carica-documento .btn-close {
    background-color: white !important;
    margin: -.5rem 0 -.5rem auto;
}

.carica-documento input,
.carica-documento select {
    height: 50px;
}

.carica-documento input:focus,
.carica-documento select:focus {
    box-shadow: none !important;
    border-color: #ced4da !important;
}

.carica-documento select {
    border-radius: 10px;
}

.carica-documento .form-control {
    line-height: 36px;
    border-radius: 10px;
}

.carica-documento form .btn-secondary {
    background-color: white;
}

.carica-documento form .btn-primary {
    color: white;
    border: 0;
}

.carica-documento form .col-md-6 {
    margin-top: 30px;
}

.carica-documento form button {
    width: 100%;
    border-radius: 100px;
    padding: 15px 20px;
}

.carica-documento form button:focus {
    box-shadow: none !important;
}

.carica-documento form .btn-secondary {
    color: #241f21;
    border: 2px solid #241f21;
}

.carica-documento form .btn-primary, .aggiungi-nota form .btn-primary {
    background-color: #241f21;
}

.ricerca input:focus,
.ricerca button:focus {
    box-shadow: none !important;
}

.ricerca input {
    border-radius: 100px !important;
    padding: 9px 20px !important;
    border: 0 !important;
}

.ricerca button {
    border: 0 !important;
    color: white !important;
    border-radius: 100px !important;
    padding: 9px 20px !important;
    margin-left: 5px !important;
}

/* clears the 'X' from Internet Explorer */
input[type=search]::-ms-clear {
    display: none; width : 0; height: 0;
}

input[type=search]::-ms-reveal {
    display: none; width : 0; height: 0;
}

/* clears the 'X' from Chrome */
input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
    display: none;
}

.lista-comunicazioni .container-fluid {
    padding: 0;
}

.lista-comunicazioni .col-md-12 {
    margin-bottom: 15px;
}

.lista-comunicazioni .comunicazione {
    background-color: white;
    display: block;
    position: relative;
    padding: 30px;
    border-radius: 10px;
}

.lista-comunicazioni .comunicazione .data-comunicazione {
    display: inline-block;
    width: 100%;
    margin-bottom: 25px;
    color: black;
    font-size: 15px;
    font-weight: 500;
}

.lista-comunicazioni .comunicazione .tipo-comunicazione {
    position: absolute;
    top: 30px;
    right: 30px;
    display: block;
    color: white;
    border-radius: 100px;
    font-size: 15px;
    padding: 5px 10px;
}

.filtro-comunicazioni {
    display: flex;
    flex-direction: row;
}

.filtro-comunicazioni .filtro-tipo-comunicazione {
    width: 150px;
    margin: auto 10px;
    padding: 5px 20px;
    border-radius: 100px;
    text-align: center;
    user-select: none;
   background-color: rgba(26, 30, 33, 0.30);

    cursor: pointer;
}


.filtro-comunicazioni .filtro-tipo-comunicazione:hover {
    background-color: rgba(0, 0, 0, 0.7);
}

.lista-comunicazioni .comunicazione .mittente-comunicazione {
    width: 45%;
}

.lista-comunicazioni .comunicazione .mittente-comunicazione,
.lista-comunicazioni .comunicazione .oggetto-comunicazione {
    display: inline-block;
    margin-bottom: 15px;
    color: black;
    font-size: 17px;
    vertical-align: top;
}

.lista-comunicazioni .comunicazione .mittente-comunicazione span,
.lista-comunicazioni .comunicazione .oggetto-comunicazione span {
    font-size: 15px;
}

.lista-comunicazioni .comunicazione .corpo-comunicazione {
    color: #969696;
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
}

.lista-comunicazioni .comunicazione .file-allegati {
    margin-top: 25px;
}

.lista-comunicazioni .comunicazione .file-allegati a {
    display: inline-block;
    color: white;
    margin-right: 5px;
    border-radius: 100px;
    padding: 10px 20px;
}

.lista-comunicazioni .comunicazione .file-allegati a:hover {
    background-color: black !important;
}

.comunicazione.tipologia-nota .corpo-comunicazione{
    white-space: pre-wrap;
}

.destinatario-lettera {
    /*box-shadow: 0 0 10px 1px lightgrey;*/
    color: darkgray;
    position: relative;
    text-align: right;
    border-left: 5px solid black;
    border-bottom: 1px solid lightgray;
    border-radius: 0 0 0 5px;
    padding: 5px;
}

.destinatario-lettera .tipo-destinatario-lettera {
    font-size: 14px;
    color: #a0a0a0;
    font-weight: 500;
    text-align: left;
}

.destinatario-lettera .specs {
    display: none;
}

.destinatario-lettera:hover .specs {
    display: block;

}

small.muted {
    user-select: none;
    color: grey;
}

.tasto-invio-msg {
    float: right;
    width: 100%;
    padding: 20px 30px;
    color: white;
    border-radius: 100px;
    font-size: 16px;
    border: 0;
    margin-bottom: 10px;
}

.tasto-invio-msg:hover {
    background-color: black !important;
    border: 0;
}

.tasto-invio-msg:focus {
    box-shadow: none !important;
    color: white;
}

.invia-messaggio .modal-content {
    background-color: transparent;
    border: 0;
}

.invia-messaggio .modal-header {
    background-color: transparent !important;
    display: initial;
    padding-left: 0;
    padding-right: 0;
    border: 0;
    text-align: center;
}

.invia-messaggio .modal-body,
.invia-messaggio .modal-footer {
    background-color: white;
}

.invia-messaggio .modal-body {
    padding: 50px;
    border-radius: 10px;
}

.invia-messaggio .modal-title {
    font-size: 45px;
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    color: white;
}

.invia-messaggio .btn-close {
    background-color: white !important;
    margin: -.5rem 0 -.5rem auto;
}

.invia-messaggio input,
.invia-messaggio select {
    height: 50px;
}

.invia-messaggio input:focus,
.invia-messaggio select:focus {
    box-shadow: none !important;
    border-color: #ced4da !important;
}

.invia-messaggio select {
    border-radius: 10px;
}

.invia-messaggio .form-control {
    line-height: 36px;
    border-radius: 10px;
}

.invia-messaggio form .btn-secondary {
    background-color: white;
}

.invia-messaggio form .btn-primary {
    color: white;
    border: 0;
}

.invia-messaggio form .col-md-6 {
    margin-top: 30px;
}

.invia-messaggio form button {
    width: 100%;
    border-radius: 100px;
    padding: 15px 20px;
}

.invia-messaggio form button:focus,
.invia-messaggio form textarea:focus {
    box-shadow: none !important;
    border-color: #ced4da !important;
}

.tasto-agg-nota {
    float: right;
    width: 100%;
    padding: 20px 30px;
    color: white;
    border-radius: 100px;
    font-size: 16px;
    border: 0;
}

.tasto-agg-nota:hover {
    background-color: black !important;
    border: 0;
}

.tasto-agg-nota:focus {
    box-shadow: none !important;
    color: white;
}

.aggiungi-nota .modal-content {
    background-color: transparent;
    border: 0;
}

.aggiungi-nota .modal-header {
    background-color: transparent !important;
    display: initial;
    padding-left: 0;
    padding-right: 0;
    border: 0;
    text-align: center;
}

.aggiungi-nota .modal-body,
.aggiungi-nota .modal-footer {
    background-color: white;
}

.aggiungi-nota .modal-body {
    padding: 50px;
    border-radius: 10px;
}

.aggiungi-nota .modal-title {
    font-size: 45px;
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    color: white;
}

.aggiungi-nota .btn-close {
    background-color: white !important;
    margin: -.5rem 0 -.5rem auto;
}

.aggiungi-nota input,
.aggiungi-nota select {
    height: 50px;
}

.aggiungi-nota input:focus,
.aggiungi-nota select:focus {
    box-shadow: none !important;
    border-color: #ced4da !important;
}

.aggiungi-nota select {
    border-radius: 10px;
}

.aggiungi-nota .form-control {
    line-height: 36px;
    border-radius: 10px;
}

.aggiungi-nota form .btn-secondary {
    background-color: white;
}

.aggiungi-nota form .btn-primary {
    color: white;
    border: 0;
}

.aggiungi-nota form .col-md-6 {
    margin-top: 30px;
}

.aggiungi-nota form button {
    width: 100%;
    border-radius: 100px;
    padding: 15px 20px;
}

.aggiungi-nota form button:focus,
.aggiungi-nota form textarea:focus {
    box-shadow: none !important;
    border-color: #ced4da !important;
}

.tasto-invio-msg {
    background-color: #241f21;
}

.tasto-invio-msg:focus {
    background-color: #241f21;
}

.invia-messaggio form .btn-secondary {
    color: #241f21;
    border: 2px solid #241f21;
}

.invia-messaggio form .btn-primary {
    background-color: #241f21;
}

.tasto-agg-nota {
    background-color: #241f21;
}

.tasto-agg-nota:focus {
    background-color: #241f21;
}

.aggiungi-nota form .btn-secondary {
    color: #241f21;
    border: 2px solid #241f21;
}



/* FOOTER */
.footer {
    background-color: #1d1d1b;
    padding-top: 30px;
    padding-bottom: 100px;
    font-size: 15px;
    border-bottom: 1px solid #939393;
}

.footer p,
.footer ul {
    color: white
}

.footer ul li:hover {
    color: #b0b0b0 !important;
}

.footer p a:hover {
    color: #b0b0b0 !important;
}

.footer ul li a:hover {
    color: #b0b0b0 !important;
}

.footer p span {
    color: #b0b0b0;
}

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

.logo-footer {
    height: 45px;
}

.social-footer svg {
    height: 17px;
    padding-right: 18px;
    fill: white;
    transition: all 0.1s ease-in-out;
}

.social-footer svg:hover {
    fill: #b0b0b0;
    transition: all 0.1s ease-in-out;
    transform: scale(1.1);
}

.copyright {
    background-color: #1d1d1b;
}

.copyright p {
    font-size: 15px;
    color: white;
    padding-top: 10px;
    padding-bottom: 10px;
}

.lista-pagamenti .container-fluid {
    padding: 0;
}

.card-pagamento {
    border-radius: 10px;
    border: 0;
    margin-bottom: 10px;
    display: inline-block;
    width: 100%;
    padding: 20px 25px;
    transition: all 0.2s ease-in-out;
}

.card-pagamento:hover {
    transition: all 0.2s ease-in-out;
    transform: scale(1.01);
}

.card-pagamento .importo {
    font-size: 20px;
    font-weight: 400;
    display: inline-block;
    color: white;
    border-radius: 100px;
    padding: 6px 12px;
    margin-right: 15px;
}


.card-pagamento.valore .importo {
    background-color: #241f21;
}

.card-pagamento.valore .tasto-scopri {
    color:  #0F86BE;
}

.card-pagamento.valore .btn-primary {
    background-color: #241f21;
    color: white;
}

.card-pagamento.studio3a .importo {
    background-color: #eb7d00;
}

.card-pagamento.betobe .importo {
    background-color: #074875;
}

.card-pagamento.peritia .importo {
    background-color: #ffb914;
}

.card-pagamento.studio3a .tasto-scopri {
    color: #eb7d00;
}

.card-pagamento.betobe .tasto-scopri {
    color: #074875;
}

.card-pagamento.peritia .tasto-scopri {
    color: #ffb914;
}

.blocco-nome {
    display: inline-block;
    vertical-align: middle;
}

.card-pagamento .nome {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 18px;
    font-weight: 500;
}

.tasto-scopri {
    font-weight: 500;
    font-size: 14px;
    display: block;
}

.card-pagamento .date {
    display: inline-block;
    float: right;
    vertical-align: middle;
    margin-top: 2px;
}

.card-pagamento .data-pagamento {
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 500;
}

.card-pagamento .data-spesa {
    margin-bottom: 0;
    font-size: 14px;
    font-weight: 500;
}

.card-pagamento .data-pagamento span,
.card-pagamento .data-spesa span {
    font-weight: 600;
}

.card-pagamento .collapsing {
    width: 100% !important;
}

.card-pagamento .descrizione {
    margin-bottom: 0;
    font-size: 14px;
    margin-top: 25px;
}

.card-fattura .date {
    border-left: 3px solid transparent;
    padding-left: 5px;
}

.card-fattura .date.non-pagata {
    border-left: 3px solid rgba(255,0,0,0.7);
}

.card-fattura .date.pagata {
    border-left: 3px solid rgba(0,128,0,0.7);
}

.spese-valore,
.spese-assistito,
.spese-totale,
.referente-container {
    background-color: rgba(36, 31, 33, 0.7);
    color: white;
    padding: 20px;
    border-radius: 10px;
    margin-bottom: 10px;
    position: relative;
}

.blocco-testo-fatture-e-pagamenti .spese-totale {
    text-align: center;
}

.spese-valore p,
.spese-assistito p,
.spese-totale p {
    font-size: 15px;
    margin-bottom: 0;
    font-weight: 500;
    color: #0F86BE;
}


.referente-container {
    margin-top: 50px;
    text-align: left;
}

.referente-container .dati-referente {
    margin-right: 150px;
}
.referente-container .immagine-referente {
    position: absolute;
    bottom: 0;
    right: -20px;;
}
.referente-container .immagine-referente img {
    width: 120px;
    max-height: 200px;
    object-fit: contain;
}

.referente-container .nome-referente{
    color: #0F86BE;
}

.spese-valore h1,
.spese-assistito h1,
.spese-totale h1 {
    font-size: 40px;
    margin-bottom: 5px;
    font-weight: 500;
}

.pdf-pagamenti {
    float: right;
    width: 100%;
    padding: 10px 40px;
    color: white !important;
    background-color: black;
    border-radius: 100px;
    font-size: 16px;
    border: 0;
    text-align: center;
    transition: all 0.1s ease-in-out;
}

.pdf-pagamenti:hover {
    transition: all 0.1s ease-in-out;
    transform: scale(1.02);
}

.riga-fattura {
    box-shadow: 0 1px 2px 0 grey;
    padding: 5px 0;
    margin-bottom: 5px;
}

.riepilogo-spese {
    margin-bottom: 24px;
}

.sottosegnalatori-pratiche-container {
    padding: 20px 0;
}

.sottosegnalatori-pratiche-container .contenitore-card {
    box-shadow: 0 0 7px -2px grey;
    margin-bottom: 10px;
}

.sottosegnalatori-pratiche-container .contenitore-card .card-body {
    padding: 5px 10px;
}


.assistito table tr td:first-child {
    width: 20%;
}

.contenitore-valore .box-pratica .titolo-sezione {
    background-color: black;
}

.contenitore-valore .box-pratica {
    margin-bottom: 24px;
}

.contenitore-valore .box-pratica form .form-control:focus {
    outline: 0;
    box-shadow: none !important;
    border: 1px solid #ced4da !important;
}

.box-pratica form, .box-pratica .box-pratica-inner-container {
    background-color: white;
    font-size: 16px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    padding: 30px;
}

.box-pratica form input[type="date"] {
    display: block;
    width: 100%;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}


.box-pratica form .form-check-input:focus {
    border-color: transparent !important;
    outline: 0;
    box-shadow: none !important;
}

.box-pratica form .form-check-input:checked {
    background-color: black;
    border-color: black;
}

.box-pratica .intro-cv {
    margin-bottom: 25px !important;
}

.box-pratica .lista-cv {
    margin-top: 20px;
    padding: 0 !important;
}

.filtro-cat-pagamenti, .filtro-cat-ruoli-pratica {
    margin-bottom: 24px;
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

.filtro-cat-pagamenti a, .filtro-cat-ruoli-pratica a {
    display: inline-block;
    background-color: #241f21;
    color: white;
    font-size: 16px;
    padding: 10px 40px;
    margin-right: 5px;
    border-radius: 100px;
    font-weight: 500;
    transition: all 0.2s ease-in-out;
}

.filtro-cat-pagamenti a:hover, .filtro-cat-ruoli-pratica a:hover {
    transition: all 0.2s ease-in-out;
    transform: scale(1.03);
}

.numero-pratiche {
    margin: 10px auto;
    text-align: center;
}

.numero-pratiche span {
    padding: 10px;
    background-color: white;
    border-radius: 10px 0 10px 0;
}

.login-form {
    outline: 0;
    max-width: 900px;
    margin: 60px auto 0 auto;
    background-color: white;
    border-radius: 12px 12px 10px 10px;
    box-shadow: 0 0 10px 1px lightgrey inset;
}

.login-form .modal-content {
    border-radius: 10px;
    border: 0;
}

.login-form .modal-dialog {
    max-width: 900px;
}

.login-form .login-header {
    padding: 20px 30px;
    background-color: #241f21;
    color: white;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.login-form .login-title {
    font-weight: 400;
    text-align: center;
    margin-bottom: 0;
}

.login-form .login-body {
    padding: 40px 30px;
}

.login-form form input:focus,
.login-form form input:active {
    box-shadow: none !important;
    border: 1px solid #ced4da;
}

.login-form .info-recupero {
    color: #979797;
    font-size: 15px;
    margin-bottom: 10px;
}

.login-form  form input[type="date"] {
    display: block;
    width: 100%;
    padding: .375rem .75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: .25rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

#registrazione_form,
#recupero_form {
    display: none;
}

.registrazione form button {
    margin-top: 30px !important;
}

.registrazione form .form-check-input:focus {
    border-color: transparent !important;
    outline: 0;
    box-shadow: none !important;
}

.registrazione form .form-check-input:checked {
    background-color: #241f21;
    border-color: #241f21;
}

.registrazione .modal-dialog {
    margin: 10rem auto;
}

/* GESTIONE COLORI STUDIO3A */

.contenitore-studio3a .menu-sez-pratica a, .contenitore-studio3a .menu-sez-pratica button {
    background-color: rgba(235, 125, 0, 0.7);
    color: white;
}

.contenitore-studio3a .menu-sez-pratica a.active,
.contenitore-studio3a .menu-sez-pratica a:hover,
.contenitore-studio3a .menu-sez-pratica a:focus,
.contenitore-studio3a .menu-sez-pratica button.active,
.contenitore-studio3a .menu-sez-pratica button:hover,
.contenitore-studio3a .menu-sez-pratica button:focus {
    background-color: rgba(235, 125, 0, 1);
}

.contenitore-betobe .menu-sez-pratica a, .contenitore-betobe .menu-sez-pratica button  {
    background-color: rgba(7, 72, 117, 0.7);
    color: white;
}

.contenitore-betobe .menu-sez-pratica a.active,
.contenitore-betobe .menu-sez-pratica a:hover,
.contenitore-betobe .menu-sez-pratica a:focus,
.contenitore-betobe .menu-sez-pratica button.active,
.contenitore-betobe .menu-sez-pratica button:hover,
.contenitore-betobe .menu-sez-pratica button:focus {
    background-color: rgba(7, 72, 117, 1);
}

.contenitore-peritia .menu-sez-pratica a, .contenitore-peritia .menu-sez-pratica button  {
    background-color: rgba(255, 185, 20, 0.7);
    color: white;
}

.contenitore-peritia .menu-sez-pratica a.active,
.contenitore-peritia .menu-sez-pratica a:hover,
.contenitore-peritia .menu-sez-pratica a:focus,
.contenitore-peritia .menu-sez-pratica button.active,
.contenitore-peritia .menu-sez-pratica button:hover,
.contenitore-peritia .menu-sez-pratica button:focus {
    background-color: rgba(255, 185, 20, 1);
}

.contenitore-valore .sezione-attiva,
.contenitore-studio3a .sezione-attiva,
.contenitore-betobe .sezione-attiva,
.contenitore-peritia .sezione-attiva {
    background-color: white !important;
    color: #241f21 !important;
}

.contenitore-studio3a .info-pratica .codice-pratica {
    border-bottom: 2px solid #eb7d00;
}

.contenitore-studio3a .box-pratica .titolo-sezione {
    background-color: #eb7d00;
}

.contenitore-studio3a .box-pratica table tr td:nth-child(2) {
    color: #eb7d00;
}

.contenitore-studio3a .liquidazione .importo {
    color: #eb7d00;
}

.contenitore-studio3a .liquidazione .data {
    color: #eb7d00;
}

.contenitore-studio3a .allegato .categoria-allegato {
    color: #eb7d00;
}

.contenitore-studio3a  .allegato .tipologia-allegato {
    color: #eb7d00;
}

.contenitore-studio3a .caricamento-allegato .tasto-caricamento {
    background-color: #eb7d00;
}

.contenitore-studio3a .carica-documento form .btn-secondary {
    color: #eb7d00;
    border: 2px solid #eb7d00;
}

.contenitore-studio3a .carica-documento form .btn-primary {
    background-color: #eb7d00;
}

.contenitore-studio3a .ricerca button {
    background-color: #eb7d00 !important;
}

.contenitore-studio3a .lista-comunicazioni .comunicazione .tipo-comunicazione,
.contenitore-studio3a .filtro-comunicazioni .filtro-tipo-comunicazione.active,
.contenitore-studio3a .filtro-comunicazioni .filtro-tipo-comunicazione:active {
    background-color: #eb7d00;
}

.contenitore-studio3a .lista-comunicazioni .comunicazione .mittente-comunicazione span,
.contenitore-studio3a .lista-comunicazioni .comunicazione .oggetto-comunicazione span {
    color: #eb7d00;
}

.contenitore-studio3a .tasto-invio-msg {
    background-color: #eb7d00;
}

.contenitore-studio3a .tasto-invio-msg:focus {
    background-color: #eb7d00;
}

.contenitore-studio3a .invia-messaggio form .btn-secondary {
    color: #eb7d00;
    border: 2px solid #eb7d00;
}

.contenitore-studio3a .invia-messaggio form .btn-primary {
    background-color: #eb7d00;
}

.contenitore-studio3a .tasto-agg-nota {
    background-color: #eb7d00;
}

.contenitore-studio3a .tasto-agg-nota:focus {
    background-color: #eb7d00;
}

.contenitore-studio3a .aggiungi-nota form .btn-secondary {
    color: #eb7d00;
    border: 2px solid #eb7d00;
}

.contenitore-studio3a .aggiungi-nota form .btn-primary {
    background-color: #eb7d00;
}

.contenitore-studio3a .lista-comunicazioni .comunicazione .file-allegati a {
    background-color: #eb7d00;
}

/* GESTIONE COLORI BE TO BE LEGAL */

.contenitore-betobe .info-pratica .codice-pratica {
    border-bottom: 2px solid #074875;
}

.contenitore-betobe .box-pratica .titolo-sezione {
    background-color: #074875;
}

.contenitore-betobe .box-pratica table tr td:nth-child(2) {
    color: #074875;
}

.contenitore-betobe .liquidazione .importo {
    color: #074875;
}

.contenitore-betobe .liquidazione .data {
    color: #074875;
}

.contenitore-betobe .allegato .categoria-allegato {
    color: #074875;
}

.contenitore-betobe  .allegato .tipologia-allegato {
    color: #074875;
}

.contenitore-betobe .caricamento-allegato .tasto-caricamento {
    background-color: #074875;
}

.contenitore-betobe .carica-documento form .btn-secondary {
    color: #074875;
    border: 2px solid #074875;
}

.contenitore-betobe .carica-documento form .btn-primary {
    background-color: #074875;
}

.contenitore-betobe .ricerca button {
    background-color: #074875 !important;
}

.contenitore-betobe .lista-comunicazioni .comunicazione .tipo-comunicazione,
.contenitore-betobe .filtro-comunicazioni .filtro-tipo-comunicazione.active,
.contenitore-betobe .filtro-comunicazioni .filtro-tipo-comunicazione:active {
    background-color: #074875;
}

.contenitore-betobe .lista-comunicazioni .comunicazione .mittente-comunicazione span,
.contenitore-betobe .lista-comunicazioni .comunicazione .oggetto-comunicazione span {
    color: #074875;
}

.contenitore-betobe .tasto-invio-msg {
    background-color: #074875;
}

.contenitore-betobe .tasto-invio-msg:focus {
    background-color: #074875;
}

.contenitore-betobe .invia-messaggio form .btn-secondary {
    color: #074875;
    border: 2px solid #074875;
}

.contenitore-betobe .invia-messaggio form .btn-primary {
    background-color: #074875;
}

.contenitore-betobe .tasto-agg-nota {
    background-color: #074875;
}

.contenitore-betobe .tasto-agg-nota:focus {
    background-color: #074875;
}

.contenitore-betobe .aggiungi-nota form .btn-secondary {
    color: #074875;
    border: 2px solid #074875;
}

.contenitore-betobe .aggiungi-nota form .btn-primary {
    background-color: #074875;
}

.contenitore-betobe .lista-comunicazioni .comunicazione .file-allegati a {
    background-color: #074875;
}

/* GESTIONE COLORI PERITIA */


.contenitore-peritia .info-pratica .codice-pratica {

    border-bottom:2px solid #ffb914;
}
.contenitore-peritia .box-pratica .titolo-sezione {
    background-color: #ffb914;
}

.contenitore-peritia .box-pratica table tr td:nth-child(2) {
    color: #ffb914;
}

.contenitore-peritia .liquidazione .importo {
    color: #ffb914;
}

.contenitore-peritia .liquidazione .data {
    color: #ffb914;
}

.contenitore-peritia .allegato .categoria-allegato {
    color: #ffb914;
}

.contenitore-peritia  .allegato .tipologia-allegato {
    color: #ffb914;
}

.contenitore-peritia .caricamento-allegato .tasto-caricamento {
    background-color: #ffb914;
}

.contenitore-peritia .carica-documento form .btn-secondary {
    color: #ffb914;
    border: 2px solid #ffb914;
}

.contenitore-peritia .carica-documento form .btn-primary {
    background-color: #ffb914;
}

.contenitore-peritia .ricerca button {
    background-color: #ffb914 !important;
}

.contenitore-peritia .lista-comunicazioni .comunicazione .tipo-comunicazione,
.contenitore-peritia .filtro-comunicazioni .filtro-tipo-comunicazione.active,
.contenitore-peritia .filtro-comunicazioni .filtro-tipo-comunicazione:active {
    background-color: #ffb914;
}

.contenitore-peritia .lista-comunicazioni .comunicazione .mittente-comunicazione span,
.contenitore-peritia .lista-comunicazioni .comunicazione .oggetto-comunicazione span {
    color: #ffb914;
}

.contenitore-peritia .tasto-invio-msg {
    background-color: #ffb914;
}

.contenitore-peritia .tasto-invio-msg:focus {
    background-color: #ffb914;
}

.contenitore-peritia .invia-messaggio form .btn-secondary {
    color: #ffb914;
    border: 2px solid #ffb914;
}

.contenitore-peritia .invia-messaggio form .btn-primary {
    background-color: #ffb914;
}

.contenitore-peritia .tasto-agg-nota {
    background-color: #ffb914;
}

.contenitore-peritia .tasto-agg-nota:focus {
    background-color: #ffb914;
}

.contenitore-peritia .aggiungi-nota form .btn-secondary {
    color: #ffb914;
    border: 2px solid #ffb914;
}

.contenitore-peritia .aggiungi-nota form .btn-primary {
    background-color: #ffb914;
}

.contenitore-peritia .lista-comunicazioni .comunicazione .file-allegati a {
    background-color: #ffb914;
}

.filtro-cat-container.sticky {
    position: sticky;
    top: 75px;
    background-color: rgba(32, 30, 30, 0.8);
    z-index: 5;
    padding: 10px;
}
/* MEDIA QUERIES */

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

    .box-pratica table tr td:first-child {
        width: 30%;
    }

    .box-pratica table {
        font-size: 16px;
    }

    .liquidazione {
        margin-top: 20px;
        padding-bottom: 20px;
    }

    .card-valore .thumbnail img,
    .card-studio3a .thumbnail img,
    .card-betobe .thumbnail img,
    .card-peritia .thumbnail img {
        left: 35%;
        top: 40%;
        height: 180px;
    }
}


.menu-sez-pratica .btn-back-to-list {
    float: left;
    cursor: pointer;
    background-color: rgba(105, 105, 105, 0.8)!important;
}


.menu-sez-pratica .btn-back-to-list:focus,
.menu-sez-pratica .btn-back-to-list:hover {
    background-color: rgba(105, 105, 105, 1) !important;
}


.password-validator li {
    position: relative;
}

.password-validator li::marker {
    display: none!important;
    content: ""!important;
}

.password-validator li i {
    position: absolute;
    left: -20px;
    top: 3px;
}

.password-validator li.password-validation-nok {
    color: #ff4a4a;
}
.password-validator li.password-validation-ok {
    color: darkgreen;
}


.claim-container {
    margin: 50px 0 200px 0;
    min-height: 300px;
    display: block;
    padding-top: 100px;
    width: 100%;
}

.claim {
    text-align: center;
    color: #ffffffc7;
    font-size: 16px;
    text-transform: uppercase;
    font-family: 'Lato',sans-serif;
    max-width: 600px;
    margin: auto;
    position: relative;
}


@media screen and (min-width: 1473px) and  (max-width: 1600px), screen and (max-width: 580px)
{
    .referente-container {
        margin-top: 200px;
    }

    .referente-container .immagine-referente {
        position: absolute;
        bottom:unset;
        left: 0;
        right: unset;
        width: 100%;
        text-align: center;
        margin: auto;
        height: 160px;
        top: -160px;
        overflow-y: hidden;
        z-index: -1;
    }
    .referente-container .dati-referente {
        margin-right: initial;
    }
}

@media screen and (min-width: 768px) and (max-width: 1472px){
    .container-fatture-e-pagamenti .blocco-testo-fatture-e-pagamenti {
        text-align: center;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
    }

    .container-fatture-e-pagamenti .blocco-testo-fatture-e-pagamenti h1 {
        width: 100%;
    }

    .container-fatture-e-pagamenti .blocco-testo-fatture-e-pagamenti hr {
        margin: 20px auto;
        width: 20%;
    }


    .container-fatture-e-pagamenti .section-description-container {
        width: 100%;
    }

    .container-fatture-e-pagamenti  .lista-pagamenti {
        width: 100%;
    }
}


@media screen and (max-width: 1472px) {
    .mod-vista img {
        margin-left: 0;
        margin-bottom: 5px;
    }

    .caricamento-allegato .tasto-caricamento,
    .tasto-invio-msg,
    .tasto-agg-nota {
        padding: 10px 10px;
    }

}

@media screen and (max-width: 1240px) {
    .box-pratica {
        margin-bottom: 20px;
    }

    .menu-utente a {
        margin-right: 25px;
    }

    .menu-sez-pratica a {
        font-size: 14px;
        padding: 10px 25px;
        margin-bottom: 10px;
    }
}

@media screen and (max-width: 769px){
    .main-header .loghi-gruppo {
        display: none;
    }

    .main-header .navbar-brand {
        border: 0
    }

    .main-header .loghi-gruppo .main-logo {
        max-height: 40px;
        max-width: 100px;
    }
}

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

    .menu-utente {
        line-height: 30px;
    }

    .menu-utente a {
        /*display: block;*/
    }

}

@media screen and (max-width: 820px){
    .menu-utente a {
        margin-right: 15px;
    }

    .filtro-cat-pagamenti a, .filtro-cat-ruoli-pratica a {
        margin-top: 15px;
    }
}


@media screen and (min-width: 770px) and (max-width: 1400px) {
    .loghi-gruppo {
        position: absolute;
        top: -40px;
        left: 30px;
        width: 50%;
    }

    .loghi-gruppo .main-logo {
        height: 30px;
    }

    .main-header .navbar-brand {
        border: 0
    }
}

@media screen and (min-width: 1001px) {
    #menuMobile {
        display: none;
    }
}

@media screen and (max-width: 1000px) {
    .user-bar {
        text-align: left;
        height: 45px;
        line-height: 45px;
    }

    .user-bar .user-menu a {
        font-size: 14px;
    }

    .user-bar .user-menu a:first-of-type {
        float: left;
    }

    .user-bar .user-menu a:last-of-type {
        float: right;
    }

    .totale-header.scrolled .user-bar {
        display: block;
    }

    .main-header .navbar-brand {
        text-align: left;
    }

    .main-header > .brands-container {
        display: block;
        padding: 15px 0 15px 15px;
    }

    .main-header .desktop-menu-container {
        display: none;
    }

    .main-header .mobile-menu-container {
        display: block;
    }

    .card-pagamento .date {
        float: left;
        vertical-align: top;
        margin-top: 15px;
    }

    .card-pagamento .collapse {
        margin-top: 80px;
    }

    .login-form .col-sm-4 {
        margin-bottom: 10px;
    }

    .no-mobile {
        display: none !important;
    }

    .legenda-loghi {
        margin-bottom: 30px;
    }

    .spese-valore,
    .spese-assistito,
    .spese-totale {
        margin-bottom: 10px;
    }

    .card-pagamento .nome {
        display: block;
        clear: both;
        margin-top: 20px;
    }

    .menu-utente {
        line-height: 40px;
    }

    .menu-utente a {
        display: inline;
    }

    .loghi-gruppo {
        text-align: left;
        margin-top: 20px;
        display: none;
    }

    .loghi-gruppo img {
        height: 40px;
        margin-right: 30px;
    }


    .fascia-pre-lista {
        padding-bottom: 0;
    }

    .card-valore .card-body .card-text {
        display: none;
    }

    .card-valore .card-body {
        padding: 20px 30px;
    }

    .card-valore .nome-sezione {
        font-size: 35px;
        position: inherit;
    }

    .card-valore .thumbnail,
    .card-studio3a .thumbnail,
    .card-betobe .thumbnail,
    .card-peritia .thumbnail {
        border-bottom-left-radius: 0;
        border-top-right-radius: 10px;
    }

    .footer {
        padding-bottom: 30px;
    }

    .footer .col-6 {
        margin-top: 20px;
    }

    .copyright p {
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .stato-pratica {
        top: 165px;
        right: 35px;
    }

    .card-studio3a .card-body,
    .card-betobe .card-body,
    .card-peritia .card-body {
        padding: 25px 30px;
    }

    .card-studio3a .nome-pratica,
    .card-betobe .nome-pratica,
    .card-peritia .nome-pratica {
        margin-top: 10px;
        font-size: 20px;
    }

    .card-valore .thumbnail,
    .card-studio3a .thumbnail,
    .card-betobe .thumbnail,
    .card-peritia .thumbnail {
        height: 140px;
    }

    .card-valore .thumbnail img,
    .card-studio3a .thumbnail img,
    .card-betobe .thumbnail img,
    .card-peritia .thumbnail img {
        left: 30%;
        top: 35%;
        height: 190px;
    }

    .legenda-loghi .logo-legenda {
        margin-top: 25px;
    }

    .legenda-loghi .logo-legenda {
        margin-right: 25px;
    }

    .legenda-loghi .logo-legenda span {
        width: 20px;
        height: 20px;
    }

    .logo-legenda img {
        height: 32px;
    }

    .blocco-testo h1 {
        margin-bottom: 10px;
    }

    .blocco-testo p {
        margin-bottom: 20px;
    }

    .blocco-testo {
        padding-bottom: 20px;
    }

    .mod-vista {
        text-align: left;
        padding-bottom: 20px;
    }

    .card.vista-lista .card-body .codice-pratica {
        margin-right: 40px;
    }

    .card-studio3a .nome-pratica,
    .card-betobe .nome-pratica,
    .card-peritia .nome-pratica {
        line-height: 24px;
    }

    .card.vista-lista .card-body .stato-pratica {
        display: none;
    }

    .menu-sez-pratica a, .menu-sez-pratica button {
        font-size: 14px;
        padding: 10px 16px;
    }

    .menu-sez-pratica {
        padding-top: 20px;
        padding-bottom: 20px;
    }

    .info-pratica .logo {
        height: 50px;
        margin-bottom: 25px;
        width: auto;
    }

    .info-pratica .codice-pratica {
        font-size: 15px;
    }

    .info-pratica .nome-pratica {
        font-size: 35px;
        line-height: 40px;
        margin-bottom: 15px;
    }

    .box-pratica {
        margin-bottom: 20px;
    }

    .box-pratica .titolo-sezione {
        font-size: 16px;
        padding: 10px 30px;
    }

    .box-pratica table {
        font-size: 16px;
        padding: 30px 30px;
    }

    .lista-liquidazioni {
        padding: 30px 30px;
    }

    .liquidazione .descrizione {
        font-size: 14px;
        line-height: 22px;
    }

    .liquidazione {
        padding-bottom: 15px;
    }

    .ricerca {
        margin-bottom: 30px;
    }

    .caricamento-allegato .tasto-caricamento {
        margin-bottom: 30px;
    }

    .tasto-agg-nota {
        margin-bottom: 30px;
    }

    .carica-documento .modal-title,
    .invia-messaggio .modal-title,
    .aggiungi-nota .modal-title {
        font-size: 35px;
    }

    .carica-documento form .col-md-6,
    .invia-messaggio form .col-md-6,
    .aggiungi-nota form .col-md-6 {
        margin-top: 10px;
        padding-left: 0;
        padding-right: 0;
    }

    .carica-documento form #selezione_documento,
    .invia-messaggio form #selezione_documento,
    .aggiungi-nota form #selezione_documento {
        margin-bottom: 20px;
    }

    .section-description-container {
        text-align: center;
    }

    .section-description-container hr {
        margin: 20px auto;
    }


    .blocco-testo-fatture-e-pagamenti {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-around;
    }

    .blocco-testo-fatture-e-pagamenti > h1 {
        width: 100%;
    }

    .blocco-testo-fatture-e-pagamenti .spese-totale:first-of-type {
        max-width: 600px;
        width: 90%;
        padding: 10px;
    }

    .blocco-testo-fatture-e-pagamenti .spese-totale:first-of-type > .importo {
        font-size: 30px;
    }


    .blocco-testo-fatture-e-pagamenti .spese-totale:not(:first-of-type) {
        max-width: 40%;
        padding: 10px;
    }

    .blocco-testo-fatture-e-pagamenti .spese-totale:not(:first-of-type) > .importo {
        font-size: 16px;
    }



    .filtro-cat-container.sticky {
        position: sticky;
        background-color: rgba(32, 30, 30, 0.8);
        z-index: 5;
        padding: 0 0 10px 0;
        top: 186px;
        width: calc(100% + 24px);
        margin-left: -12px;
        margin-right: -12px;
    }

    .filtro-cat-container a {
        font-size: 10px;
        padding: 10px 15px;
        margin-top: 10px;
    }

    .section-description-container.sticky {
        padding-top: 20px;
        position: sticky;
        top: 120px;
        z-index: 2;
        background-color: rgba(32, 30, 30, 0.8);
    }

    .section-description-container.sticky .blocco-testo,  .section-description-container.sticky .numero-pratiche {
        display: none;
    }

    .section-description-container.sticky .ricerca {
        margin-block-end: 1em;
    }

    .section-description-container.sticky #input_ricerca {
        font-size: 10px;
        line-height: 1;
    }

    .lista-comunicazioni .comunicazione .mittente-comunicazione, .lista-comunicazioni .comunicazione .oggetto-comunicazione {
        width: 100%;
    }

}

.btn-primary.disabled, .btn-primary:disabled {
    color: #fff;
    background-color: #0F86BE;
    border-color: #0F86BE;
}

.nav-link:focus, .nav-link:hover {
    color: white;
}

.specific-description {
    display: none;
}


.dropdown-item .specific-description {
    display: none;
}

/*
.dropdown-item:hover .specific-description {
    display: block;
}

.dropdown-item:hover .generic-description {
    display: none;
}
*/

.nav-item .dropdown-item:active {
    background-color: transparent;
}

.sidenav-view-agenda iframe {
    width: 100%;
    height: calc(100% - 100px);
}


.btn-close-agenda {
    color: white;
    background-color: #241f21;
    box-shadow: 0 0 2px 0 white;
}


.btn-close-agenda:hover, .btn-close-agenda:active, .btn-close-agenda:focus, .btn-close-agenda.active  {
    color: #fff;
    background-color: #0F86BE;
}

.accordion-item {
    background-color: transparent!important;
    border: none !important;
}

.accordion-button.collapsed::after {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}


.allegato.cliccable.hovered {
    background-color: rgba(15, 134, 190, 0.34);
}

.allegato.cliccable.hovered > * {
    color: white!important;
}


.allegato.cliccable.hovered .text-muted {
    color: white!important;
}

footer {
    margin-top: 30px;
}

.fi {
    min-height: max(100% , 1em);
}