﻿/** {
    --size-1: 600px;
    --size-2: 1000px;
    --colore-primario: #7A454A; 
    --colore-overlay: rgba(122, 69, 74, 0.5);
    --colore-primario-overlay: rgba(106, 69, 64, 0.5);
    --colore-primario_hover: #6a3c40;
    --colore-primario_testo: white;
    --colore-primario_disabled: #a7646a;
    --color-base: green;
    --btn-color-1: pink;
    --color-test: yellow;
    --border-1: 1px solid var(--colore-primario);
    --colore-footer: #4db8ff;
    --colore-btn: #007bff;
    --colore-bg: #F9F9F9;
    --colore-bg2: #BCC9B3;
    --colore-outprimary-text: #BCC9B3;
}*/

/** {
    --size-1: 600px;
    --size-2: 1000px;
    --colore-primario: #29215C;
    --colore-overlay: rgba(40, 32, 89, 0.5);
    --colore-primario-overlay: rgba(106, 69, 64, 0.5);
    --colore-primario_hover: #201947;
    --colore-primario_testo: white;
    --colore-primario_disabled: #BEBCCD;
    --color-base: green;
    --btn-color-1: pink;
    --color-test: yellow;
    --border-1: 1px solid var(--colore-primario);
    --colore-footer: #4db8ff;
    --colore-btn: #007bff;
    --colore-bg: #F9F9F9;
    --colore-bg2: #938FAB;
    --colore-outprimary-text: white;
}*/

/*AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA*/
/** {
    --size-1: 600px;
    --size-2: 1000px;
    --colore-primario: #7A454A;
    --colore-overlay: rgba(122, 69, 74, 0.5);
    --colore-primario-overlay: rgba(106, 69, 64, 0.5);
    --colore-primario_hover: #6a3c40;
    --colore-primario_testo: white;
    --colore-primario_disabled: #a7646a;
    --color-base: green;
    --btn-color-1: pink;
    --color-test: yellow;
    --border-1: 1px solid var(--colore-primario);
    --colore-footer: #4db8ff;
    --colore-btn: #007bff;
    --colore-bg: #F9F9F9;
    --colore-bg2: #BCC9B3;
    --colore-outprimary-text: #BCC9B3;
}*/

.btn-mgs {
    display: inline-block;
    font-weight: 400;
    /*color: #212529;*/
    color: !important white;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    /*padding: 0.375rem 0.75rem;*/
    padding: 0.02rem; /*0.2rem;*/
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.25rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

a.btn-mgs {
    color: !important yellow;
}

.btn-primary-mgs {
    background-color: var(--colore-primario); /*#7A454A;*/
    border-color: var(--colore-primario);
    color: var(--colore-primario_testo);
    /*!important var(--colore-primario);*/
}

a.btn-primary-mgs {
    text-decoration: none;
}
/*.btn-primary-mgs.disabled, .btn-primary-mgs:disabled {
        color: var(--colore-primario_testo);
        background-color: var(--colore-primario_disabled);
        border-color: var(--colore-primario_disabled);
    }*/
.btn-primary-mgs:hover {
    background-color: var(--colore-primario_hover); /*#7A454A;*/
    border-color: var(--colore-primario_testo);
    /*color: white;*/
    color: var(--colore-primario_testo);
    /*!important var(--colore-primario);*/
}

.btn-primary-mgs.disabled, .btn-primary-mgs:disabled {
    color: var(--colore-primario_testo);
    background-color: var(--colore-primario_disabled);
    border-color: var(--colore-primario_disabled);
    /*color: #fff;
    background-color: yellow;
    border-color: #007bff;*/
}

.btn-primary-mgs:not(:disabled):not(.disabled):active, .btn-primary-mgs:not(:disabled):not(.disabled).active,
.show > .btn-primary-mgs.dropdown-toggle {
    /*color: #fff;*/
    background-color: var(--colore-primario_hover);
    border-color: var(--colore-primario_testo);
}

    .btn-primary-mgs:not(:disabled):not(.disabled):active:focus, .btn-primary-mgs:not(:disabled):not(.disabled).active:focus,
    .show > .btn-primary-mgs.dropdown-toggle:focus {
        box-shadow: 0 0 0 0.2rem var(--colore-overlay);
        /*rgba(106, 69, 64, 0.5);*/
        /*var(--colore-primario-overlay);*/
        /*rgba(38, 143, 255, 0.5);*/
    }

.btn-outprimary-mgs {
    border-color: var(--colore-primario);
    color: var(--colore-primario);
}

    .btn-outprimary-mgs:hover {
        border-color: var(--colore-primario);
        background-color: var(--colore-primario_hover);
        color: var(--colore-primario_testo) !important;
    }

    .btn-outprimary-mgs:not(:disabled):not(.disabled):active, .btn-outprimary-mgs:not(:disabled):not(.disabled).active,
    .show > .btn-outprimary-mgs.dropdown-toggle {
        color: !important white;
        background-color: var(--colore-primario_hover);
        border-color: var(--colore-primario_testo);
        box-shadow: 0 0 0 0.2rem rgba(106, 69, 64, 0.5);
        /*var(--colore-primario-overlay);*/
    }

.btn-outprimary-mgsM {
    border-color: var(--colore-outprimary-text);
    color: var(--colore-outprimary-text);
    /*border-color: var(--colore-bg2);
    color: var(--colore-bg2);*/
    box-shadow: none;
}

    .btn-outprimary-mgsM:hover {
        border-color: var(--colore-bg2);
        background-color: var(--colore-primario_hover);
        color: !important white; /*var(--colore-primario_testo);*/
    }

    .btn-outprimary-mgsM:focus, .btn-outprimary-mgsM.focus {
        box-shadow: none; /*0 0 0 0.2rem var(--colore-overlay);*/
    }

    .btn-outprimary-mgsM:not(:disabled):not(.disabled):active, .btn-outprimary-mgsM:not(:disabled):not(.disabled).active,
    .show > .btn-outprimary-mgsM.dropdown-toggle {
        color: !important white;
        background-color: var(--colore-primario_hover);
        border-color: var(--colore-primario_testo);
    }

        .btn-outprimary-mgsM:not(:disabled):not(.disabled):active:focus, .btn-outprimary-mgsM:not(:disabled):not(.disabled).active:focus,
        .show > .btn-outprimary-mgsM.dropdown-toggle:focus {
            box-shadow: none;
            /*!important 0 0 0 0.2rem var(--colore-overlay);*/
            /*rgba(106, 69, 64, 0.5);*/
            /*var(--colore-primario-overlay);*/
            /*rgba(38, 143, 255, 0.5);*/
        }

.groupRadio {
    border-bottom-right-radius: 0.25rem !important;
    border-top-right-radius: 0.25rem !important;
}

.myHeaderText {
    color: var(--colore-primario);
}

.myInfoText::placeholder,
.myInfoText::-webkit-input-placeholder,
.myInfoText::-ms-input-placeholder {
    font-style: !important italic;
    color: lightgrey;
}

.headerText {
    font-size: 22px;
}
.filtroHeader {
    background-color: var(--colore-primario); /*#4db8ff;*/
    border: var(--border-1); /*1px solid #01579B;*/
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: white;
    text-align: center;
    /*border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;*/
    /*vertical-align: middle;*/
    /*margin-top: auto;
    margin-bottom: auto;
    height: auto;*/

    margin-right: auto;
    margin-left: auto;
    font-size: 22px;
}

.filtroBody {
    padding: 2px;
    padding-top: 15px;
    border: 1px solid var(--colore-primario); /*#01579B;*/
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    color: var(--colore-primario); /*#01579B;*/
    /*background-color: var(--color-test);*/
    /*margin-left: 5px;
        margin-right: 1px;
        margin-top: -1px;
        width: 99%;*/

    margin-right: 0px;
    margin-left: 0px;
}

.boxRadius {
    padding: 2px;
    border-radius: 5px;
    border: 1px solid rgba(0, 0, 0, 0.1); /*#01579B;*/
}

.boxRadius2 {
    padding: 2px;
    border-radius: 5px;
    border: 1px solid #01579B;
}

.filtroAll {
    padding: 2px;
    border: 1px solid #01579B;
    border-radius: 5px;
    color: var(--colore-primario); /*#01579B;*/
    /*background-color: var(--color-test);*/
    /*margin-left: 5px;
        margin-right: 1px;
        margin-top: -1px;
        width: 99%;*/
}

.footerContainer {
    width: 98%;
    height: 22px;
    position: fixed;
    bottom: 0px;
    display: normal;
    /*z-index: 1000;*/
    padding: 0px;
    margin: 0px;
    border-width: 0px;
    background-color: white;
}

.footerContainerPortale {
    width: -webkit-calc(100% - 200px);
    width: -moz-calc(100% - 200px);
    width: calc(100% - 200px);
}

.footerContainerPortaleMini {
    width: -webkit-calc(100%);
    width: -moz-calc(100%);
    width: calc(100%);
}

.footerHeader {
    width: 98%;
    height: 192px;
    background-color: var(--colore-bg2); /*#4db8ff;*/
    /*border-left: 1px solid #01579B;
    border-right: 1px solid #01579B;
    border-top: 1px solid #01579B;*/
    border-left: 1px solid var(--colore-primario);
    border-right: 1px solid var(--colore-primario);
    border-top: 1px solid var(--colore-primario);
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
    margin-top: 0px;
    padding: 0px;
    padding-top: 1px;
    /*z-index: 850;*/
}

.footerBase {
    width: 98%;
    height: 22px;
    background-color: #4db8ff;
    /*border-left: 1px solid #01579B;
    border-right: 1px solid #01579B;*/
    border-left: 1px solid var(--colore-primario);
    border-right: 1px solid var(--colore-primario);
    border-top: 1px solid white;
    border-bottom-left-radius: 25px;
    border-bottom-right-radius: 25px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
    margin-top: 0px;
    padding: 0px;
    padding-top: 1px;
    /*z-index: 950;*/
}

.footerRadius {
    width: 320px;
    height: 20px;
    background-color: white;
    border-top-left-radius: 25px;
    border-bottom-right-radius: 25px;
    margin-right: auto;
    margin-left: auto;
    margin-bottom: 0px;
    margin-top: 0px;
    text-align: center;
    color: #01579B;
    font-size: 12px;
}

.footerRadiusPortale {
    /*border-top-width: 1px;*/

    border-top: 1px solid #01579B;
    /*width: -webkit-calc(98% - 200px);
    width: -moz-calc(98% - 200px);
    width: calc(98% - 200px);*/
}

.footerSide {
    transition: all 1s, all 1s ease;
    /*background-color: red !important;*/
}

    .footerSide:hover {
        transition-delay: 0.5s;
        transform: translate(0, -150px);
    }

.my_form-group {
    font-weight: normal;
}

.cardMaxWidth {
    max-width: 300px;
    /*min-width: 300px;*/
}

.prezzo {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.valign-center {
    display: inline-flex;
    vertical-align: middle;
    align-items: center;
    justify-content: center;
}


/*.mi-16 {
    display: inline-flex;
    vertical-align: middle;
    align-items: center;
    justify-content: center;
    font-size: 16px;
}

.mi-18 {
    display: inline-flex;
    vertical-align: middle;
    align-items: center;
    justify-content: center;
    font-size: 18px;
}*/

.contenitore {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
}

.riga {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.headerPage {
    /*background-color: var(--colore-footer);*/ /*#4db8ff;*/
    background-color: var(--colore-bg2);
    border: var(--border-1); /*1px solid #01579B;*/
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color: var(--colore-primario);
    /*color: white;*/
    text-align: center;
    padding-left: 0px;
}
.bodyPage {
    width: 98%;
    min-width: 300px;
    /*margin: auto;*/
    /*margin-left: auto;
    margin-right: auto;*/
    margin: auto !important;
    overflow: auto;
}
/*si attiva quando la dimensione è minore di 1000px*/
@media (max-width: 1000px) {
    .headerPage {
        text-align: left;
        padding-left: 30px;
    }
    /*.bodyPage {
        margin-left: 10px;
    }*/
}
/*si attiva quando la dimensione è maggiore di 1000px*/
/*@media (min-width: 1000px) {
    .headerPage {
        text-align: left;
        padding-left: 30px;
    }

    .bodyPage {
        margin-left: 10px;
        ;
    }
}*/


/*PREFERITI*/
.preferiti {
    /*width: 130px;
    height: 195px;*/
    position: relative;
    display: inline-block;
    color: var(--colore-primario);
}

.img-top1 {
    color: var(--colore-primario);
}

.img-top2 {
    color: var(--colore-primario);
}

.preferiti .img-top1 {
    display: none;
    color: var(--colore-primario);
    /*position: absolute;
        top: 0;
        left: 0;
        z-index: 99;*/
}

.preferiti:hover .img-top1 {
    display: inline;
    color: var(--colore-primario);
}

.preferiti:hover .img-top2 {
    display: none;
    color: var(--colore-primario);
}
/*FINE PREFERITI*/






.cerca {
    max-width: 250px;
    margin: auto;
}


/*#divHeader {
    margin-left: auto;
    margin-right: auto;
}*/

@media (max-width: 575px) {
    .cerca {
        max-width: 760px;
        padding-top: 5px;
        align-content: flex-start;
    }
    /*.col-0 {
            display: none;
        }*/

}
@media (max-width: 1000px) {
    .filtroHeader {
        font-size: 18px;
    }
    .headerText {
        font-size: 18px;
    }
}


    /*.col-0 {
        display: none;
    }*/

    @media (min-width: 576px) /*darkcyan*/
    /*@media (max-width: 300px)*/
    {
        /*.col-0 {
            display: block;
        }*/
        /*@media only screen and (max-width: var(--size-1)) {*/
        /*#bodyNotVis {
        display: block;

    }

    #bodyVis {
        display: none;
    }*/

        /*.col-sm-0 {
            display: none;
        }*/
        #divHeader {
            max-width: var(--size-1);
            margin: auto;
            /*background-color: darkcyan;*/
        }

        #divLogo {
            display: -ms-flexbox !important;
            display: flex !important;
            -ms-flex-pack: center !important;
            justify-content: center !important;
        }

        .btn-menu {
            max-width: 160px;
            /*width: 200px;
        color: red;*/
        }

        .cerca {
            max-width: 760px;
            padding-top: 5px;
            align-content: flex-start;
        }

        .cerca-sm {
            align-content: flex-start;
        }
    }

    @media (min-width: 768px) /*PINK*/
    /*@media (min-width: 600px)*/
    {
        /*.col-0 {
            display: block;
        }*/
        /*@media only screen and (min-width: var(--size-1)) {*/
        #bodyNotVis {
            display: none;
        }

        #bodyVis {
            display: block;
        }

        #divHeader {
            max-width: 750px;
            margin: auto;
            background-color: pink;
        }

        #divLogo {
            display: -ms-flexbox !important;
            display: flex !important;
            -ms-flex-pack: center !important;
            justify-content: center !important;
        }

        .btn-menu {
            max-width: 160px;
            /*width: 200px;
        color: red;*/
        }

        .cerca {
            max-width: 990px;
            padding-top: 5px;
            align-content: flex-start;
            /*background-color: yellow;*/
        }
    }

    @media (min-width: 992px) /*RED*/
    /*@media (min-width: 1000px)*/
    {
        /*@media only screen and (min-width: var(--size-2)) {*/
        #divHeader {
            max-width: 1200px;
            background-color: red;
        }

        .btn-menu {
            max-width: 160px;
            /*width: 150px;
        color: white;*/
        }

        .cerca {
            padding-top: 0px;
            align-content: flex-start;
        }
    }

    .topnav {
        overflow: hidden;
        /*background-color: #333;*/
    }

        .topnav button {
            /*float: left;
        display: block;
        color: #f2f2f2;
        text-align: center;
        padding: 14px 16px;
        text-decoration: none;
        font-size: 17px;*/
        }

        /*.topnav a:hover {
            background-color: #ddd;
            color: black;
        }

        .topnav a.active {
            background-color: #4CAF50;
            color: white;
        }*/

        .topnav .icon {
            display: none;
        }

    @media screen and (max-width: 600px) {
        /*@media screen and (max-width: 600px) {*/
        .topnav button:not(:first-child) {
            display: none;
        }

        .topnav a.icon {
            float: right;
            display: block;
        }
    }

    @media screen and (max-width: 600px) {
        /*@media screen and (max-width: 600px) {*/
        .topnav.responsive {
            position: relative;
        }

            .topnav.responsive .icon {
                position: absolute;
                right: 0;
                top: 0;
            }

            .topnav.responsive a {
                float: none;
                display: block;
                text-align: left;
            }

        .myflex-column {
            -ms-flex-direction: column !important;
            flex-direction: column !important;
            height: 100px;
        }

        .myflex-column-h {
            height: 100px;
        }
    }


    @media (min-width: 500px) {
        .regHeadRow {
            color: var(--colore-primario);
            width: 130px;
        }

        .ordHeadRow {
            color: var(--colore-primario);
            width: 150px;
        }

        .headRowOrd {
            color: var(--colore-primario);
            width: 130px;
            text-align: left;
        }
        /*.regHeadRow2 {
        color: var(--colore-primario);
        width: 180px;
    }*/

    }

    @media (max-width: 500px) {
        .regHeadRow {
            color: var(--colore-primario);
            width: 100px;
            font-size: 12px;
        }

        .ordHeadRow {
            color: var(--colore-primario);
            width: 130px;
            font-size: 12px;
        }

        .headRowOrd {
            color: var(--colore-primario);
            width: 100px;
            text-align: left;
            font-size: 12px;
            padding-left: 2px !important;
        }

        .addCarelloNotVisibile {
            display: none;
        }
        /*.regHeadRow2 {
        color: var(--colore-primario);
        width: 150px;
        font-size: 12px;
    }*/


    }



    .btnLogout {
        color: darkred !important;
        background-color: yellow;
    }

        .btnLogout:hover {
            color: yellow !important;
            background-color: darkred;
        }



    .myContainer {
        width: 100%;
        padding-right: 15px;
        padding-left: 15px;
        margin-right: auto;
        margin-left: auto;
    }

    /*.col-0 .col-md-0 {
    display: block;
}*/
    @media (max-width: 576px) {
        /*.myContainer {
        max-width: 540px;
    }*/
        .col-0 {
            display: none;
        }
    }

    @media (min-width: 576px) {
        /*.myContainer {
        max-width: 540px;
    }*/
        /*.col-sm-0 {
        display: none;
    }*/
    }

    @media (max-width: 768px) {
        /*.myContainer {
        max-width: 540px;
    }*/
        .col-sm-0 {
            display: none;
            /*position: absolute;
        left: -80px;
        transition: 0.3s;*/
        }

        .myWrap {
            -ms-flex-wrap: wrap !important;
            flex-wrap: wrap !important;
        }

        .sizeOnWrap {
            width: 100% !important;
        }
    }

    @media (min-width: 768px) {
        /*.myContainer {
        max-width: 720px;
    }*/

    }

    @media (max-width: 992px) {
        /*.myContainer {
        max-width: 540px;
    }*/
        .col-md-0 {
            display: none;
        }
    }

    @media (min-width: 992px) {
        .myContainer {
            max-width: 960px;
        }
    }

    @media (min-width: 1200px) {
        .myContainer {
            max-width: 1140px;
        }
    }



    .progress2 {
        position: relative;
        height: 4px;
        display: block;
        width: 100%;
        background-color: #b7e4ff;
        border-radius: 2px;
        margin: 0.5rem 0 1rem 0;
        overflow: hidden;
    }

        .progress2 .determinate {
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            background-color: #0091ea;
            transition: width .3s linear;
        }

        .progress2 .indeterminate {
            background-color: #0091ea;
        }

            .progress2 .indeterminate:before {
                content: '';
                position: absolute;
                background-color: inherit;
                top: 0;
                left: 0;
                bottom: 0;
                will-change: left, right;
                animation: indeterminate 1.1s cubic-bezier(0.65, 0.815, 0.735, 0.395) infinite;
            }

    /*.progress2 .indeterminate:after {
            content: '';
            position: absolute;
            background-color: inherit;
            top: 0;
            left: 0;
            bottom: 0;
            will-change: left, right;
            animation: indeterminate-short 4.1s cubic-bezier(0.165, 0.84, 0.44, 1) infinite;
            animation-delay: 1.15s;
        }*/

    @keyframes indeterminate {
        0% {
            left: -35%;
            right: 100%;
        }

        60% {
            left: 100%;
            right: -90%;
        }

        100% {
            left: 100%;
            right: -90%;
        }
    }


    /*@keyframes indeterminate-short {
    0% {
        left: -200%;
        right: 100%;
    }

    60% {
        left: 107%;
        right: -8%;
    }

    100% {
        left: 107%;
        right: -8%;
    }
}*/

    /*@media screen and (min-width: 320px) and (max-width: 767px) and (orientation: landscape) {
    html {
        transform: rotate(-90deg);
        transform-origin: left top;
        width: 100vh;
        overflow-x: hidden;
        position: absolute;
        top: 100%;
        left: 0;
    }
}*/

    /*si attiva quando la dimensione è maggiore di 500*/
    /*@media (min-width: 500px) {
    .TestDivMenuPortale
    {
        display: none;
    }
}*/

    /*.BodySize {*/
    /*width: calc(100vw - )*/
    /*min-height: calc(100vh - 220px);
    padding-bottom: 50px;
}
@media (min-width: 1000px) {
    .sidenavP {
        width: 200px !important;
    }

    .BodySize {
        background-color: pink !important;
        margin-left: 220px;
    }
}*/

    /*si attiva quanto la dimensione è minore di 1000*/
    /*@media (max-width: 1000px) {
    .sidenavP {
        width: 50px !important;
    }

        .sidenavP .textBtn {
            display: none;
        }

    .BodySize {
        margin-left: 20px;
        background-color: red !important;
    }
}*/


    .MyBtnGridOrdine {
        border-radius: 5px;
        background-color: #1F4E79;
        /*font-size: 16px;*/
        cursor: pointer;
        /*border-color: #ff9800;*/
        color: white;
        width: 30px;
    }

        .MyBtnGridOrdine:hover {
            background-color: #04194F;
            color: white;
            /*color: #1F4E79;*/
        }

    .MyBtnGrid {
        /*border: 2px solid black;*/
        border-radius: 5px;
        background-color: #ffc107;
        /*padding: 14px 28px;*/
        /*padding: 2px 4px 2px 7px;*/
        /*font-size: 16px;*/
        cursor: pointer;
        /*border-color: #ff9800;*/
        color: #212529;
        width: 30px;
    }

        .MyBtnGrid:hover {
            /*color: #1F4E79;*/
            color: #212529;
            background-color: #e0a800;
            border-color: #d39e00;
        }
