*,
*:before,
*:after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

#wrapper {
    margin:  auto;
    max-width: 80em;
}

#container {
    float: left;
    padding: 1em;
    width: 100%;
}

.clear{
    float:none;
    clear:both;
}

ol.organizational-chart,
ol.organizational-chart ol,
ol.organizational-chart li,
ol.organizational-chart li > div {
    position: relative;
}

    ol.organizational-chart,
    ol.organizational-chart ol {
        list-style: none;
        margin: 0;
        padding: 0;
    }

ol.organizational-chart {
    text-align: center;
}

    ol.organizational-chart ol {
        padding-top: 1em;
    }

        ol.organizational-chart ol:before,
        ol.organizational-chart ol:after,
        ol.organizational-chart li:before,
        ol.organizational-chart li:after,
        ol.organizational-chart > li > div:before,
        ol.organizational-chart > li > div:after {
            background-color: #b7a6aa;
            content: '';
            position: absolute;
        }

        ol.organizational-chart ol > li {
            padding: 1em 0 0 1em;
        }

    ol.organizational-chart > li ol:before {
        height: 1em;
        left: 50%;
        top: 0;
        width: 3px;
    }

    ol.organizational-chart > li ol:after {
        height: 3px;
        left: 3px;
        top: 1em;
        width: 50%;
    }

    ol.organizational-chart > li ol > li:not(:last-of-type):before {
        height: 3px;
        left: 0;
        top: 2em;
        width: 1em;
    }

    ol.organizational-chart > li ol > li:not(:last-of-type):after {
        height: 100%;
        left: 0;
        top: 0;
        width: 3px;
    }

    ol.organizational-chart > li ol > li:last-of-type:before {
        height: 3px;
        left: 0;
        top: 2em;
        width: 1em;
    }

    ol.organizational-chart > li ol > li:last-of-type:after {
        height: 2em;
        left: 0;
        top: 0;
        width: 3px;
    }

    ol.organizational-chart li > div {
        background-color: #fff;
        border-radius: 3px;
        min-height: 2em;
        padding: 0.5em;
    }
.primary.intestazione .testo{
    text-align:center;
   width:50%;
    margin:auto;
    float:unset;
    padding-left:0;
   
}
.primary.intestazione{
    position:relative;
    margin: auto;
    margin-bottom:15px;
    width: 70%;
    
}
    .primary.intestazione:before {
        bottom: 2em;
        height: 3px;
        left: -30%;
        width: 30%;
        background-color: #b7a6aa;
        content: '';
        position: absolute;
    }

    .primary.intestazione:after {
        background-color: #b7a6aa;
        content: '';
        position: absolute;
        bottom: calc(-140% - 3px);
        height: 180%;
        left: -30%;
        width: 3px;
    }
.righe_vert{
    display:none;
}

@media (max-width: 1023px) {
    .primary.intestazione:after {
        background-color: #b7a6aa;
        content: '';
        position: absolute;
        top: 100%;
        height: 150%;
        left: 50%;
        width: 3px;
    }
    .primary.intestazione:before{
        display:none
    }
}



@media only screen and (min-width: 64em) {



    .organizational-chart{
        margin-top: -22px !important;
    }
    .primary.intestazione:before {
        height: 1em !important;
        left: 50% !important;
        width: 3px !important;
        bottom: -1em !important;
        top: inherit !important;
    }

            .primary.intestazione:after {
                left: calc(14% + 3px); 
                bottom: -1em;
                height: 3px;
                width: calc(70% + 12px); 
                bottom: -1em !important;
                top: inherit !important;
            }

    .righe_vert {
        display: inline-block;
        border: 3px;
        border-top:0px;
        border-bottom:0px;
        border-color: #b7a6aa;
        border-style: solid;
        height:20px;
        width:50%;
        margin-left:25%;
    }
}

ol.organizational-chart li:before{

}
/*.primary.intestazione:after {
    content: '';
    width: 2px;
    height: 50px;
    background: #B7A6AA;
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -2px;
}

.div_riga {
    height: 3px;
    background: #B7A6AA;
    width: calc(50% + 1em + 3px);
    margin:auto;
    margin-top:0px;
}*/
/*** PRIMARY ***/
.primary {
    background: #282F52; /* Old browsers */
    background: -moz-linear-gradient(top, #282F52 0%, #365585 50%, #282F52 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #282F52 0%,#365585 50%,#282F52 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #282F52 0%,#365585 50%,#282F52 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#282F52', endColorstr='#282F52',GradientType=0 );
    border-radius: 10px !important;
    min-height: 100px !important;
    padding: 10px !important;
    -webkit-box-shadow: 5px 5px 25px -2px rgba(0,0,0,0.46);
    box-shadow: 5px 5px 25px -2px rgba(0,0,0,0.46);
}

.primary .img, .primary .testo{
    float:left;
}
.primary .testo {
    color:white;
    padding-left:20px;
}
    .primary .testo h1, .primary .testo p{
        text-align: left;
    }
    .primary .testo p {
        margin-bottom:0px;
        text-transform:uppercase;
    }
        .primary .img img {
        height: 80px;width:80px;
    }

    .primary .testo h1 {
        margin-top: 10px;
        margin-bottom: 0px;
    }


    ol.organizational-chart > li > div {
        margin-right: 1em;
    }

        ol.organizational-chart > li > div:before {
            bottom: 2em;
            height: 3px;
            right: -1em;
            width: 1em;
        }

        ol.organizational-chart > li > div:first-of-type:after {
            bottom: 0;
            height: 2em;
            right: -1em;
            width: 3px;
        }

        ol.organizational-chart > li > div + div {
            margin-top: 1em;
        }

            ol.organizational-chart > li > div + div:after {
                height: calc(100% + 1em);
                right: -1em;
                top: -1em;
                width: 3px;
            }

    /*** SECONDARY ***/
.secondaryA, .secondaryB, .secondaryC {
    border-radius: 10px !important;
    padding: 10px !important;
    width: 390px;
}

.secondaryA, .secondaryB, .secondaryC {
    background: #f9a800; /* Old browsers */
    background: -moz-linear-gradient(top, #f9a800 0%, #f7dead 50%, #f9a800 100%); /*FF3.6-15 */
    background: -webkit-linear-gradient(top, #f9a800 0%,#f7dead 50%,#f9a800 100%); /*Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #f9a800 0%,#f7dead 50%,#f9a800 100%); /*W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9a800', endColorstr='#f9a800',GradientType=0 );
    -webkit-box-shadow: 5px 5px 25px -2px rgba(0,0,0,0.46);
    box-shadow: 5px 5px 25px -2px rgba(0,0,0,0.46);
    /*background: #f90000;*/ /* Old browsers */
    /*background: -moz-linear-gradient(top, #f90000 0%, #ffb5b5 50%, #f90000 100%);*/ /* FF3.6-15 */
    /*background: -webkit-linear-gradient(top, #f90000 0%,#ffb5b5 50%,#f90000 100%);*/ /* Chrome10-25,Safari5.1-6 */
    /*background: linear-gradient(to bottom, #f90000 0%,#ffb5b5 50%,#f90000 100%);*/ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f90000', endColorstr='#f90000',GradientType=0 );*/
}

.secondaryB {
    /*background: #00d16c;*/ /* Old browsers */
    /*background: -moz-linear-gradient(top, #00d16c 0%, #a6eab1 50%, #00d16c 100%);*/ /* FF3.6-15 */
    /*background: -webkit-linear-gradient(top, #00d16c 0%,#a6eab1 50%,#00d16c 100%);*/ /* Chrome10-25,Safari5.1-6 */
    /*background: linear-gradient(to bottom, #00d16c 0%,#a6eab1 50%,#00d16c 100%);*/ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00d16c', endColorstr='#00d16c',GradientType=0 );*/
}


.secondaryC {
    /*background: #f9a800;*/ /* Old browsers */
    /*background: -moz-linear-gradient(top, #f9a800 0%, #f7dead 50%, #f9a800 100%);*/ /* FF3.6-15 */
    /*background: -webkit-linear-gradient(top, #f9a800 0%,#f7dead 50%,#f9a800 100%);*/ /* Chrome10-25,Safari5.1-6 */
    /*background: linear-gradient(to bottom, #f9a800 0%,#f7dead 50%,#f9a800 100%);*/ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9a800', endColorstr='#f9a800',GradientType=0 );*/
}

    .secondaryA h2, .secondaryB h2, .secondaryC h2 {
        font-weight: 900;
        margin-bottom: 0px;
        font-size: 29px;
        letter-spacing: -1px;
    }

    ol.organizational-chart > li > ol:before {
        left: inherit;
        right: 0;
    }

    ol.organizational-chart > li > ol:after {
        left: 0;
        width: 100%;
    }

    ol.organizational-chart > li > ol > li > div {
        background-color: #83e4e2;
    }

    /*** TERTIARY ***/
    ol.organizational-chart > li > ol > li > ol > li > div {
        background-color: #fd6470;
    }

.tertiary {
    background: #282F52; /* Old browsers */
    background: -moz-linear-gradient(top, #282F52 0%, #365585 50%, #282F52 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #282F52 0%,#365585 50%,#282F52 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #282F52 0%,#365585 50%,#282F52 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#282F52', endColorstr='#282F52',GradientType=0 );
    -webkit-box-shadow: 5px 5px 25px -2px rgba(0,0,0,0.46);
    box-shadow: 5px 5px 25px -2px rgba(0,0,0,0.46);
    border-radius: 10px !important;
    min-height: 100px !important;
    padding: 10px !important;
    width: 374px;
}
 .tertiary.tertiaryB {
    min-height: 100px !important;
}
    .tertiary.tertiaryB img {
        margin: auto 0;
    }
.elencoSecondaryB li:not(:last-child) {
    padding-bottom: 38.666px !important;
}


    .tertiary .img, .tertiary .testo {
        float: left;
    }

    .tertiary .testo {
        color: white;
        padding-left: 10px;
    }
        .tertiary .testo h3{
            margin-top:20px;
            margin-bottom:0px;
            font-size:20px;
        }
    .tertiary.tertiaryB .testo h3 {
        margin-top: 0px;
    }

        .tertiary .testo h3, .tertiary .testo p {
            text-align: left;
        }

        .tertiary .testo p {
            margin-bottom: 0px;
            text-transform: uppercase;
            font-size:12px;
        }

    .tertiary .img img {
        height: 80px;width:80px;
    }



    /*** QUATERNARY ***/
    ol.organizational-chart > li > ol > li > ol > li > ol > li > div {
        background-color: #fca858;
    }

    /*** QUINARY ***/
    ol.organizational-chart > li > ol > li > ol > li > ol > li > ol > li > div {
        background-color: #fddc32;
    }

/*** MEDIA QUERIES ***/
@media only screen and ( min-width: 64em ) {

    ol.organizational-chart {
        margin-left: -1em;
        margin-right: -1em;
    }

        /* PRIMARY */
        ol.organizational-chart > li > div {
            display: inline-block;
            float: none;
            margin: 0 1em 1em 1em;
            vertical-align: bottom;
        }

            ol.organizational-chart > li > div:only-of-type {
                margin-bottom: 0;
                width: calc((100% / 1) - 2em - 4px);
            }

            ol.organizational-chart > li > div:first-of-type:nth-last-of-type(2),
            ol.organizational-chart > li > div:first-of-type:nth-last-of-type(2) ~ div {
                width: calc((100% / 2) - 2em - 4px);
            }

            ol.organizational-chart > li > div:first-of-type:nth-last-of-type(3),
            ol.organizational-chart > li > div:first-of-type:nth-last-of-type(3) ~ div {
                width: calc((100% / 3) - 2em - 4px);
            }

            ol.organizational-chart > li > div:first-of-type:nth-last-of-type(4),
            ol.organizational-chart > li > div:first-of-type:nth-last-of-type(4) ~ div {
                width: calc((100% / 4) - 2em - 4px);
            }

            ol.organizational-chart > li > div:first-of-type:nth-last-of-type(5),
            ol.organizational-chart > li > div:first-of-type:nth-last-of-type(5) ~ div {
                width: calc((100% / 5) - 2em - 4px);
            }

            ol.organizational-chart > li > div:before,
            ol.organizational-chart > li > div:after {
                bottom: -1em !important;
                top: inherit !important;
            }

            ol.organizational-chart > li > div:before {
                height: 1em !important;
                left: 50% !important;
                width: 3px !important;
            }

            ol.organizational-chart > li > div:only-of-type:after {
                display: none;
            }

            ol.organizational-chart > li > div:first-of-type:not(:only-of-type):after,
            ol.organizational-chart > li > div:last-of-type:not(:only-of-type):after {
                bottom: -1em;
                height: 3px;
                width: calc(50% + 1em + 3px);
            }

            ol.organizational-chart > li > div:first-of-type:not(:only-of-type):after {
                left: calc(50% + 3px);
            }

            ol.organizational-chart > li > div:last-of-type:not(:only-of-type):after {
                left: calc(-1em - 3px);
            }

            ol.organizational-chart > li > div + div:not(:last-of-type):after {
                height: 3px;
                left: -2em;
                width: calc(100% + 4em);
            }

        /* SECONDARY */
        ol.organizational-chart > li > ol {
            display: flex;
            flex-wrap: nowrap;
        }

            ol.organizational-chart > li > ol:before,
            ol.organizational-chart > li > ol > li:before {
                height: 1em !important;
                left: 50% !important;
                top: 0 !important;
                width: 3px !important;
            }

            ol.organizational-chart > li > ol:after {
                display: none;
            }

            ol.organizational-chart > li > ol > li {
                flex-grow: 1;
                padding-left: 1em;
                padding-right: 1em;
                padding-top: 1em;
            }

                ol.organizational-chart > li > ol > li:only-of-type {
                    padding-top: 0;
                }

                    ol.organizational-chart > li > ol > li:only-of-type:before,
                    ol.organizational-chart > li > ol > li:only-of-type:after {
                        display: none;
                    }

                ol.organizational-chart > li > ol > li:first-of-type:not(:only-of-type):after,
                ol.organizational-chart > li > ol > li:last-of-type:not(:only-of-type):after {
                    height: 3px;
                    top: 0;
                    width: 50%;
                }

                ol.organizational-chart > li > ol > li:first-of-type:not(:only-of-type):after {
                    left: 50%;
                }

                ol.organizational-chart > li > ol > li:last-of-type:not(:only-of-type):after {
                    left: 0;
                }

                ol.organizational-chart > li > ol > li + li:not(:last-of-type):after {
                    height: 3px;
                    left: 0;
                    top: 0;
                    width: 100%;
                }
}


@media  ( max-width: 1399px ) {
    .primary, .tertiary {
        min-height: 70px !important;
        padding: 5px !important;
    }

        .tertiary.tertiaryB {
            min-height: 91.5px !important;
        }

    .primary .testo, .tertiary .testo {
        padding-left: 5px;
    }

    .primary .img img, .tertiary .img img, .tertiary .img img, .tertiary .img img {
        height: 60px;
        width: 60px;
    }

    .primary .testo h1 {
        font-size:23px;
        margin-top: 5px;
    }

    .secondaryA, .secondaryB, .secondaryC {
        width: auto !important;
    }
    .tertiary {
        width: auto !important;
    }

        .tertiary .testo h3 {
            margin-top: 15px;
            margin-bottom: 0px;
            font-size: 15px;
        }

        .tertiary .testo p {
            font-size: 10px;
        }

        .secondaryA h2, .secondaryB h2, .secondaryC h2{
            font-size:22px;
        }
}

@media ( min-width: 1000px ) and ( max-width: 1200px ) {
    .tertiary .testo p {
        font-size: 9px;
    }
}
@media ( max-width: 1023px ) {.tertiary.tertiaryB {
    min-height: 70px !important;
}
}
@media ( min-width: 478px ) and ( max-width: 999px ) {
    .tertiary .testo h3 {
        font-size: 18px;
        margin-top:10px;
    }
    .tertiary .testo p {
        font-size: 14px;
    }

}

@media ( min-width: 345px ) and ( max-width: 477px ) {
    .tertiary .testo h3 {

        font-size: 12px;
    }

    .tertiary .testo p {
        font-size: 9px;
    }

    .primary .testo h1 {
        font-size: 20px;
        margin-top: 5px;
    }
    
}

@media ( min-width: 0px ) and ( max-width: 344px ) {
    .tertiary .testo h3 {
        font-size: 12px;
    }

    .tertiary .testo p {
        font-size: 8.5px;
    }
    .primary .testo h1 {
        font-size: 16px;
        margin-top: 5px;
    }
}