html, body {
    height:100%;
}

.btn {
    color:#fff;
    background-color:#123459;
    border: solid 1px #123459 !important;
}

.btn:hover {
    color:rgb(42, 63, 84);
    background-color:#fff !important;
}

.btn-danger {
    color: #fff;
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
}

.btn-danger:hover {
    color: #dc3545 !important;
}

.bg-light-gray {
    background-color:#f1f2f3;
}

a.scrolltop {
    background: rgba(42, 63, 84, 0.6);
    z-index: 2;
}

a.scrolltop:hover {
    background-color: rgba(42, 63, 84, 1) !important;
    opacity: 1;
}

h2 {
    margin-bottom: 1rem;
    margin-top:2rem;
}

h3 {
    font-size: 1.25rem;
}

.table .thead-dark th {
    color: #fff;
    background-color: #123459;
    border-color: #123459;
}

.table td, .table th {
    padding:.25rem;    
    font-weight: 400;
}

.select2 {
    width: 100% !important;
    /* height: 50%; */
}

/*
.selection {
    height: 100%;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 1.5;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    padding: .15rem .5rem;
}
*/


.card {
    border: 1px solid rgba(0,0,0,.125) !important;
    border-radius: 5px !important;
    margin-bottom: 1rem !important;
}

.select2-container .select2-selection--single {
    /* height: 100%; */
    border-color: #ced4da;
    border-radius: .2rem;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    /* margin-top: 0;
    margin-left: 0; */
    font-size: .9rem;
    /* width: 1.9rem;
    right: 0;  
    top: .125rem; */
}

.select2-selection__rendered,
.select2-search__field,
.select2-results__option,
.select2-results__message {
    font-size: .9rem;
}

.jumbotron i.fa {
    color: #007bff;
}

.bt-none {
    border-top: unset !important;
}

.bb-none {
    border-bottom: unset !important;
}

/*********************************
 * HEADER
 ********************************/
.hero {
    height:100%;
    padding: 0;
}

.courtesy {
    background: rgb(42, 63, 84);
}

.hero .btn {
    background:#fff;
    color:#123459;
    border: solid 1px #fff
}

.hero .btn:hover {
    background:rgb(42, 63, 84);
    color:#fff;
}

.hero h1 {
    font-size: 40px;
}

.hero .logo {
    width: 150px;
    height: 150px;
    overflow: hidden;
    border-radius: 100%;
    margin: 0 auto;
    background-color: #fff;
    border: solid 2px #fff;
}

.hero .logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero .credits {
    /* position: absolute;
    right:0;bottom:0;     */
    text-align: center;
    padding:.8rem;
    /* background:rgba(0,0,0,0.2); */
    /* z-index: 1; */
}

.hero .credits a {
    color: #fff;
}

.fixed-hero {
    display: table;
    position: relative;    
    width: 100%;
    padding: 2rem;
    background: rgb(42,63,84);
}

.fixed-hero .logo {
    width: 100px;
    height: 100px;
    overflow: hidden;
    border-radius: 100%;
    border: solid 2px #fff;
    margin: 0 auto;
    background-color: #fff;
}

.fixed-hero .logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.fixed-hero p,
.fixed-hero h2 {
    color:#fff;
    margin-bottom: 0;
    margin-top:.5rem;
}

/*********************************
 * PROUCTS
 ********************************/

.banner {
    padding-top: 2rem;
    padding-bottom: 0;
}

.jumbotron-custom {
    margin-bottom: 0;
    margin-top:1rem;
    padding: 2rem;
}

.banner a.btn {
    color: #fff !important;
    font-weight: 400;
}

.banner a.btn:hover { 
    color: #123459 !important;
}

.jumbotron-custom .btn {    
    padding: .5rem 1rem;
    margin-top: -.3rem;
}

.jumbotron-custom p {
    margin: 0;
}

.products {
    margin-bottom: 3rem;
    position: relative;
}

h3.bg-light-gray {

}

.list-products {
    
}

.products h3 {
    margin:0;
    font-weight: 400;
    padding:.5rem;
    color: #363636;
}

.product-item {
    padding:1rem;
    border-bottom: solid 1px #f1f2f3;
    transition: all .3s linear;
    cursor:pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.product-item:hover {
    background: #f8f8f8;
}

.product-item:last-child {
    border-bottom: unset;
}

.product-item-picture {
    /*float:left;*/
    width: 80px;
    height: 80px;
    overflow:hidden;
    margin-bottom: 1rem;
}

.product-item-picture img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: .5rem;
}

 .product-item-info {
    /*float:left;*/
 }

 .product-item-info span {
     font-size: .8rem;
     color: #363636;
     /* display: block; */
 }

 .product-item-info h6 {
     margin:0;
 }

 .product-item-actions {
    float:right;
    padding-top:.5rem;
}

.product-item-actions .btn {
    padding: .25rem .5rem;
    font-size: .8rem;
    font-weight: 400;
}

/*********************************
 * CARRELLO
 ********************************/

.fab-carrello {
    display: none;
}

.carrello .product-details {
    list-style-type: none;
    padding-inline-start: 0;
    font-size: .75rem;
}

.carrello .pill-value {
    font-size: 1rem;
}

.carrello h5 {
    font-size:.75rem;
    font-weight: 400;
}

/*********************************
 * BOX RIEPILOGO
 ********************************/

.box-riepilogo-container {
    position:fixed;
    top:0; left:0;
    width: 100%;
    height: 100%;
    background:#fff;
    display: none;
    z-index:3;
    overflow: auto;
}

.box-riepilogo-container h3 {
    padding:.5rem;
}

.box-riepilogo {

}

.close-riepilogo {
    position: absolute;
    top: 0;
    right: 2rem;
    text-align: center;
    vertical-align: middle;
    background-color: #123459;
    color:#fff !important;
    font-weight: 200;
    border-radius: 100%;
    width: 2.5rem;
    height: 2.5rem;
    margin-right: .5rem;        
    margin-top: .5rem;
    transition: display .3s linear;
    padding:.25rem;
    cursor: pointer;
    font-size: 1.2rem;
}

th.progressivo,
td.progressivo {
    text-align:center;
    width:30px;
}

td.quantita, 
th.quantita {
    text-align:center;
    width:100px;
}

td.quantita .btn {
    padding: .25rem .5rem;
    font-weight: 400;
}

.box-conferma-ordine .list-group-item {
    padding: .5rem .75rem !important;
    font-size: .9rem;
}

td.quantita .form-control-sm/*, 
.input-group-sm > .form-control, 
.input-group-sm > .input-group-append > .btn, 
.input-group-sm > .input-group-append > .input-group-text, 
.input-group-sm > .input-group-prepend > .btn, 
.input-group-sm > .input-group-prepend > .input-group-text*/ {
    padding: 0;
    font-size: .75rem;
    line-height: 1.5;
    border-radius: .2rem;
}

td.quantita .input-product-qta {
    width: 100%;
    margin-left:.25rem;
    margin-right:.25rem;
}

/*********************************
 * BOX DATI UTENTE
 ********************************/

 .box-dati-utente-container {
    position:fixed;
    top:0; left:0;
    width: 100%;
    height: 100%;
    background:#fff;
    display: none;
    z-index:4;
    overflow: auto;
}

.box-dati-ordine-container h3,
.box-dati-utente-container h3 {
    padding:.5rem;
}

.box-dati-utente {

}

.close-dati-utente {
    position: absolute;
    top: 0;
    right: 2rem;
    text-align: center;
    vertical-align: middle;
    background-color: #123459;
    color:#fff !important;
    font-weight: 200;
    border-radius: 100%;
    width: 2.5rem;
    height: 2.5rem;
    margin-right: .5rem;        
    margin-top: .5rem;
    transition: display .3s linear;
    padding:.25rem;
    cursor: pointer;
    font-size: 1.2rem;
}

.form-dati-richiedente label {
    margin-top: .5rem;
    margin-bottom: 0;
}

.form-dati-richiedente .group-title {
    background: #123459;
    color:#fff;
    font-size:.85rem;
    font-weight: 400;
    padding: .25rem;
    margin:0;
}

.form-dati-richiedente label {
    font-size: .9rem;
}

label.error {
    margin-top: .125rem;
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
    width:100%;
    padding: .125rem .25rem;
    border-radius: .25rem;
    font-size: .8rem;
}

select.error,
input[type=text].error {
    border-color: #721c24;
}

.form-dati-richiedente .btn {
    font-size: .9rem;
    font-weight: 400;
    padding: .5rem 1rem;
}

.articolo-correlato {
    cursor: pointer;
}

.articolo-correlato .badge {
    font-size: .8rem;
    font-weight: 300;
}

/*********************************
 * BOX DATI UTENTE
 ********************************/

 .box-dati-defunto-container {
    position:fixed;
    top:0; left:0;
    width: 100%;
    height: 100%;
    background:#fff;
    display: none;
    z-index:4;
    overflow: auto;
}

.box-dati-defunto-container h3,
.box-dati-defunto-containercontainer h3 {
    padding:.5rem;
}

div.box-dati-defunto-picture > img {
    max-width:100%;
    max-height: 100%;
}

div.box-dati-defunto-dati span {
    display: block;
}

div.box-dati-defunto-articoli {

}

div.box-dati-defunto-articoli::after {
    content: "";
    clear: both;
}

div.box-dati-defunto-product {
    float: left;
}

div.box-dati-defunto-qta {
    float: right;
}

div.box-dati-defunto-qta .btn {
    padding: .25rem .5rem;
}

.box-dati-defunto {

}

.close-dati-utente {
    position: absolute;
    top: 0;
    right: 2rem;
    text-align: center;
    vertical-align: middle;
    background-color: #123459;
    color:#fff !important;
    font-weight: 200;
    border-radius: 100%;
    width: 2.5rem;
    height: 2.5rem;
    margin-right: .5rem;        
    margin-top: .5rem;
    transition: display .3s linear;
    padding:.25rem;
    cursor: pointer;
    font-size: 1.2rem;
}

/* .form-dati-richiedente label {
    margin-top: .5rem;
    margin-bottom: 0;
}

.form-dati-richiedente .group-title {
    background: #123459;
    color:#fff;
    font-size:.85rem;
    font-weight: 400;
    padding: .25rem;
    margin:0;
}

.form-dati-richiedente label {
    font-size: .9rem;
}

label.error {
    margin-top: .125rem;
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
    width:100%;
    padding: .125rem .25rem;
    border-radius: .25rem;
    font-size: .8rem;
}

select.error,
input[type=text].error {
    border-color: #721c24;
}

.form-dati-richiedente .btn {
    font-size: .9rem;
    font-weight: 400;
    padding: .5rem 1rem;
} */

/*********************************
 * BOX PAGAMENTO ORDINE
 ********************************/

 div.box-dati-ordine-container {
    margin-bottom: 3rem;
 }

div.box-dati-ordine-container .jumbotron {
    padding: 2rem;
}

div.box-dati-ordine-container .jumbotron p {
    margin: 0;
}

form.form-identificativo-ordine .btn {
    padding: .5rem 1rem;
    font-size: .9rem;
    font-weight: 400;
    border-radius: 1rem;
} 

form.form-identificativo-ordine input[type=text] {
    font-size: 1.2rem;
    font-weight: 600;
}

form.form-dati-richiedente div.file-upload-container {
    position: relative;
}

form.form-dati-richiedente input[type=file] {
    opacity:0;
    position: absolute;
    top:0;left:0;
    width:100%;
    height:100%;
}

form.form-dati-richiedente div.file-upload {
    height: 125px;
    border: dashed 1px #123459;
    background: rgba(42, 63, 84, 0.1);
    border-radius: 5px;
    display: table;
}


form.form-dati-richiedente div.file-upload-button {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    padding: 1rem;
}

form.form-dati-richiedente div.file-upload-button span {
    font-size: .9rem;
    display: block;
    margin-bottom: .5rem;
}

form.form-dati-richiedente div.file-info {
    padding: 1rem;
    display: none;
}

form.form-dati-richiedente div.file-dragover {
    background: rgba(42, 63, 84, 0.9) !important;
}

form.form-dati-richiedente div.file-dragover span {
    color: #fff;
}

form.form-dati-richiedente .file-info {
    
}

.btn-scarica-bollettino {
    padding: .25rem .5rem;
    font-size: .7rem;
}

/*********************************
 * FOOTER
 ********************************/

 .site-footer {
     box-shadow: 0 0 10px #ddd;
     position: fixed;
     bottom:0;
     width:100%;
     z-index:2;
 }

.site-footer,
.site-footer .bottom {
    background: #fff;
}

.site-footer .bottom { 
    padding:0;
}

.site-footer .copyright-text a,
.site-footer .copyright-text,
.site-footer .credits,
.site-footer .credits a {
    color: #123459;
    font-size:.75rem;
}

.site-footer p {
    opacity: unset;
}

.input-product-qta {
    width:100px;
}

.btn-sm {
    padding: .5rem .75rem;
}

@media (max-width: 1199.98px) {
    h3 {
        font-size: 1rem;
    }

    .container {
        margin:0;
        padding:9;
    }

    h3.bg-light-gray {
        margin-top: 1rem;
    }

    .table td, .table th {
        padding:.125rem;
        font-size:.75rem;
    }

    .hero .logo {
        width: 100px;
        height: 100px;
    }

    .hero h1 {
        font-size: 1.75rem;;
    }

    .hero .tagline {
        font-size: 1rem;
    }

    .hero .btn {
        padding: .5rem 1rem;
    }

    .hero .credits {
        z-index:1;
    }

    .fixed-hero {
        padding: 1rem;
    }
    
    .fixed-hero .logo {
        width: 60px;
        height: 60px;
    }
    
    .fixed-hero p {
        font-size: .75rem;
    }

    .fixed-hero h2 {
        font-size: 1.3rem;
    }

    .products {
        margin-bottom: 5rem;
    }

    /* .product-item-picture {
        float:none;
        margin:0 auto;
        text-align: center;
    }

    .product-item-info h6 { 
        margin-top:.5rem;
    }

    .product-item-info span,
    .product-item-info h6 {
        text-align:center;
        display: block;
    } */

    /* .product-item-xs-info {
        float:none;
    } */

    .product-item-xs-actions {
        float:none;
        text-align: center;        
    }

    .input-product-qta {
        width: 100px;
        margin: 0 auto;
    }

    .fab-carrello-show {
        display: unset;
    }

    .fab-carrello-badge-show {
        display: unset !important;
    }

    .fab-carrello-container {
        display: table;
        text-align: center;
        vertical-align: middle;
        background-color: #fff;
        border-radius: 100%;
        width: 2.5rem;
        height: 2.5rem;
        margin-right: .5rem;        
        margin-top: .5rem;
        box-shadow: 0 0 10px #aaa;
        transition: display .3s linear;
        padding:.25rem;
        position:relative;
    }

    .fab-carrello-badge {
        display:none;
        border-radius: 100%;
        background-color: #f00;
        color:#fff;
        width:1.1rem;
        height:1.1rem;
        font-size:.7rem;        
        font-weight: 600;
        position:absolute;
        top:-0.2rem; right:-0.2rem;
        text-align: center;
    }

    .fab-carrello {        
        position: fixed;
        top: 0;
        right: 0;        
        color: #123459 !important;
        font-size: 1.35rem;
        display: block;
    }

    .site-footer .credits {
        display: none;
    }

    .site-footer .copyright-text {
        font-size: .75rem;
    }
}

@media (min-width: 1200px) {
    .product-item {
        flex-direction: row;
        align-items: center;
        padding: .5rem;
    }

    .product-item-picture {
        margin-bottom: 0;
    }
}