/*STILI COMMON LAYOUT BARRE LATERALI*/

.hideClass4MainSideBar{
}
.hideClass4ActionSideBar{
}
.sbcolor{
    background-color: #323232;
}

.centralContentContainer{
    height: 100%;
    width:100%;
}

.headerBarBase{
    display: none;
    height: 50px;
}

.headerBar{
    position:fixed;
    top:0px;
    left:0px;
    width:100%;
    z-index: 100;
    overflow:hidden;
}


.pnlRootCentralCntBase{
    height:100%;
    background-color: #ffffff;
    margin-bottom:30px;
    display:table; /*è importante perchè permette di scrollare alla pagine oltre la barra di dx*/
    float: left;
}



/*1°CASO: BARRE LATERALI WIDTH STANDARD********************/

.gmainsb{
    height:100%;
    z-index:70;
    position:fixed;
    top:0px;
    left:0px;
    width: 51px;
    transition: all 0.5s ease-in-out 0s;
}

.gactionsb{
    position:fixed;
    top:0px;
    right:0px;
    height:100%;
    z-index:70;
    width: 102px;
    transition: all 0.5s ease-in-out 0s;
}

.pnlRootCentralCnt{
    padding-left: 72px; /*gmainsb width + margine virtuale*/
    padding-right: 123px; /*gactionsb width + margine virtuale*/
}

.pnlRootCentralCntDim{
    width: calc(100% - 195px); /*195 = padding left + padding rigth*/
}

/*END******************************************************/

/*1.2 °CASO: BARRE LATERALI NASCOSTE********************/

.pnlRootCentralCntNoSidebars{
    padding-left: 0px;
    padding-right: 0px;
}

.pnlRootCentralCntDimNoSidebars{
    width: 100%;
}

/*END******************************************************/


/*2°CASO: BARRA ACTION SIDEBAR VERSIONE LARGE**************/
.gactionsbLarge{
    position:fixed;
    top:0px;
    right:0px;
    height:100%;
    z-index:70;
    width: 133px;
    /*    overflow-y: auto;  */
}


.pnlRootCentralCntLargeActionSb{
    padding-left: 72px; /*gmainsb width + margine virtuale*/
    padding-right: 154px; /*gactionsbLarge width + margine virtuale*/
}

.pnlRootCentralCntDimLargeActionSb{
    width: calc(100% - 226px); /*226 = padding left + padding rigth*/
}
/*END********************************************************/


/*3°CASO: BARRE LATERALI STANDARD + PANNELLO LATERALE INFO AZIENDA (SOLO MARKET, NB. NON FUNZIONA CON ACTION SIDEBAR LARGE VERSION)********************/
.cnyInfoPanel{
    position: fixed;
    top:0px;
    height:100%;
    background-color: #FFFFFF;
    width: 210px;
    right: 102px; /*gactionsb*/
    padding-right: 15px;
}

.pnlRootCentralCntCompanyInfo{
    padding-left: 72px; /*gmainsb width + margine virtuale*/
    padding-right: 15px;
    border-right: 15px solid #fff; /*gactionsbLarge width + margine virtuale*/
}

.pnlRootCentralCntDimCompanyInfo{
    width: calc(100% - 429px); /*378 = padding left + padding rigth + gactionsb + cnyInfoPanelWidth + cnyInfoPanelMarginRigth*/
    height: initial;
}
/*END********************************************************/



/*4° CASO: CONTENUTO CENTRALE SENZA MARGINE CON ACTION SB SHORT VERSION*/

.pnlRootCentralCntDimNoMargin_ActionSbShort{
    width: calc(100% - 153px); /* gactionsb + gmainsb*/
}

.pnlRootCentralCntNoMargin_ActionSbShort{
    padding-left: 51px;
    padding-right: 102px;
}

/*4.1° CASO: CONTENUTO CENTRALE SENZA MARGINE CON ACTION SB LARGE VERSION*/

.pnlRootCentralCntDimNoMargin_ActionSbLarge{
    width: calc(100% - 184px); /* gactionsbLarge + gmainsb*/
}

.pnlRootCentralCntNoMargin_ActionSbLarge{
    padding-left: 51px;
    padding-right: 133px;
}


/*END********************************************************/

/*5° CASO PANNELLO DI NOTIFICA CON SLIDER LATERERLA*/
.notifyBar {
    background: #515151;
    position: fixed;
    overflow-y: auto;
    z-index: 66;
}

.notifyBar-vertical {
    width: 230px;
    height: 100%;
    top: 0;
}

.cnyInfoPanel-push-toright{
    padding-right: 0px;
    right: -113px; /*calcolato con notifyBar_Width - cnyInfoPanel_Rigth*/
}

/* Vertical menu that slides from the left or right */
.notifyBar-left {
    left: -230px;
}
.notifyBar-left.notifyBar-open {
    left: 51px; /*dipende dalla dimensione della main sidebar*/
}



/* Push classes applied to the body */
.notifyBar-push {
    position: relative;
    left: 0;
}

.notifyBar-push-toright {
    overflow-x: hidden;
}

/* Transitions */

.notifyBar,
.notifyBar-push,
.cnyInfoPanel,
.cnyInfoPanel-push-toright{
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
}
/*END*/



/*modalità portrait pc scatta quando si scende sotto i 767 (disabilitare questa regola per togliere il portrait su pc)----------- */
@media only screen
and/*!Hack-YUI-Compressor-Problem*/(max-width : 767px) {
    .panelPopupSaveError{
        top: 50px!important;
    }

    .panelPopupSaveSuccess{
        top: 50px!important;
    }

    .headerBarBase{
        height: 50px;
        display: block;
    }

    .centralContentContainer{
        height: calc(100% - 50px);
    }

    /*1° caso */
    .gmainsb{
        top: 50px;
    }
    .gactionsb{
        top:50px;
    }
    .hideClass4MainSideBar{
        display: none;
    }
    .hideClass4ActionSideBar{
        display: none;
    }
    .pnlRootCentralCnt{
        padding-left: 10px;
        padding-right: 10px;
    }
    .pnlRootCentralCntDim{
        width: calc(100% - 20px);
    }


    /*end*/

    /*2° caso */
    .gactionsbLarge{
        top:50px;
    }

    .pnlRootCentralCntLargeActionSb{
        padding-left: 10px;
        padding-right: 10px;
    }

    .pnlRootCentralCntDimLargeActionSb{
        width: calc(100% - 20px);
    }


    /*end*/

    /*3° caso TODO*/
    .cnyInfoPanel{
        position: static;
        top:auto;
        right: auto;
        padding-right: 0px;
    }

    .pnlRootCentralCntCompanyInfo{
        padding-left: 10px;
        padding-right: 5px;
        border-right: 5px solid #fff;
    }

    .pnlRootCentralCntDimCompanyInfo{
        width: calc(100% - 20px);
    }
    /*end*/

    /*4° caso TODO*/
    .pnlRootCentralCntDimNoMargin_ActionSbShort{
        width: 100%;
    }
    .pnlRootCentralCntNoMargin_ActionSbShort{
        padding-left: 0px;
        padding-right: 0px;
    }
    /*end*/

    /*4.1° caso TODO*/
    .pnlRootCentralCntDimNoMargin_ActionSbLarge{
        width: 100%; /* gactionsbLarge + gmainsb*/
    }

    .pnlRootCentralCntNoMargin_ActionSbLarge{
        padding-left: 0px;
        padding-right: 0px;
    }
    /*end*/

    /*5° caso */
    .notifyBar-vertical {
        width: 230px;
    }

    .cnyInfoPanel-push-toright{
        padding-right: 0px;
        right: auto;
    }

    .notifyBar-left {
        left: -230px;
    }

    .notifyBar-left.notifyBar-open {
        left: 51px; /*dipende dalla dimensione della main sidebar*/
        top:50px; /*dipende dall'height di headerBarBase */
    }
    /*end */

}


/*lasciare hack per uicompressor----------- */
/* Smartphones (portrait and landscape) FINO IPHONE 6+----------- */
@media only screen
and/*!Hack-YUI-Compressor-Problem*/(min-device-width : 320px)
and/*!Hack-YUI-Compressor-Problem*/(max-device-width : 736px) {
    /* Styles */

    .headerBarBase{
        height: 40px;
        display: block;
    }
    .centralContentContainer{
        height: calc(100% - 40px);
    }

    /*1° caso */
    .gmainsb{
        top:40px;
    }
    .gactionsb{
        top:40px;
    }
    .hideClass4MainSideBar{
        display: none
    }
    ;
    .hideClass4ActionSideBar{
        display: none;
    }
    .pnlRootCentralCnt{
        padding-left: 5px;
        padding-right: 5px;
    }

    .pnlRootCentralCntDim{
        width: calc(100% - 10px);
    }
    /*end*/

    /*2° caso */
    .gactionsbLarge{
        top:40px;
    }

    .pnlRootCentralCntLargeActionSb{
        padding-left: 5px;
        padding-right: 5px;
    }


    .pnlRootCentralCntDimLargeActionSb{
        width: calc(100% - 10px);
    }
    /*end*/

    /*3° caso TODO*/
    .cnyInfoPanel{
        position: static;
        top:auto;
        right: auto;
        padding-right: 0px;
    }

    .pnlRootCentralCntCompanyInfo{
        padding-left: 5px;
        padding-right: 2.5px;
        border-right: 2.5px solid #fff;
    }

    .pnlRootCentralCntDimCompanyInfo{
        width: calc(100% - 10px);
    }
    /*end*/

    /*4° caso TODO*/
    .pnlRootCentralCntDimNoMargin_ActionSbShort{
        width: 100%;
    }

    .pnlRootCentralCntNoMargin_ActionSbShort{
        padding-left: 0px;
        padding-right: 0px;
    }
    /*end*/

    /*4.1° caso TODO*/
    .pnlRootCentralCntDimNoMargin_ActionSbLarge{
        width: 100%;
    }

    .pnlRootCentralCntNoMargin_ActionSbLarge{
        padding-left: 0px;
        padding-right: 0px;
    }

    /*5° caso */
    .notifyBar-left.notifyBar-open {
        top:40px; /*dipende dall'height di headerBarBase */
    }


}

/* Smartphones (landscape) ----------- da 321px in su attenzione qui possono entrare anche i PC (perchè non c'è la parola chiave device ma min-width)--> sul media screen dei PC sovrascrivere lo stile giusto */
@media only screen
and/*!Hack-YUI-Compressor-Problem*/(min-width : 321px) {
    /* Styles */
    .foo{
    }

}

/* Smartphones (portrait) ----------- da 0 a 321*/
@media only screen
and/*!Hack-YUI-Compressor-Problem*/(max-width : 414px) {
    /* Styles */
    .foo{
    }
}

/* tablet (portrait and landscape) ----------- */
@media only screen
and/*!Hack-YUI-Compressor-Problem*/(min-device-width : 768px)
and/*!Hack-YUI-Compressor-Problem*/(max-device-width : 1024px) {
    /* Styles */
    .foo{
    }
}

/* tablet (landscape) ----------- */
@media only screen
and/*!Hack-YUI-Compressor-Problem*/(min-device-width : 768px)
and/*!Hack-YUI-Compressor-Problem*/(max-device-width : 1024px)
and/*!Hack-YUI-Compressor-Problem*/(orientation : landscape) {
    /* Styles */
    .loginPopupClass{
        width: 80%;
    }
    .headerBarBase{
        display: none;
    }
    .centralContentContainer{
        height: 100%;
    }

    /*1° caso */
    .gmainsb{
        display: block;
        top: 0px;
    }
    .gactionsb{
        display: block;
        top: 0px;
    }
    .pnlRootCentralCnt{
        padding-left: 72px; /*gmainsb width + margine virtuale*/
        padding-right: 123px; /*gactionsb width + margine virtuale*/
    }
    .pnlRootCentralCntDim{
        width: calc(100% - 195px); /*195 = padding left + padding rigth*/
    }

    /*end */

    /*2° caso */
    .gactionsbLarge{
        display: block;
        top:0px;
    }

    .pnlRootCentralCntLargeActionSb{
        padding-left: 72px; /*gmainsb width + margine virtuale*/
        padding-right: 154px; /*gactionsbLarge width + margine virtuale*/
    }


    .pnlRootCentralCntDimLargeActionSb{
        width: calc(100% - 226px); /*226 = padding left + padding rigth*/
    }

    /*end */
    /*3° caso */
    .cnyInfoPanel{
        position: fixed;
        top:0px;
        right: 102px;
        padding-right: 15px;
        width: 210px;
    }

    .pnlRootCentralCntCompanyInfo{
        padding-left: 72px;
        padding-right: 15px;
        border-right: 15px solid #fff;
    }

    .pnlRootCentralCntDimCompanyInfo{
        width: calc(100% - 429px); /*408 = padding left + padding right + gactionsb + cnyInfoPanelWidth + cnyInfoPanelMarginRigth*/
    }
    /*end */
    /*4° caso */
    .pnlRootCentralCntDimNoMargin_ActionSbShort{
        width: calc(100% - 153px); /* gactionsb + gmainsb*/
    }

    .pnlRootCentralCntNoMargin_ActionSbShort{
        padding-left: 51px;
        padding-right: 102px;
    }

    /*end */

    /*4.1° caso */
    .pnlRootCentralCntDimNoMargin_ActionSbLarge{
        width: calc(100% - 184px); /* gactionsbLarge + gmainsb*/
    }

    .pnlRootCentralCntNoMargin_ActionSbLarge{
        padding-left: 51px;
        padding-right: 133px;
    }

    /*end */

    /*5° caso */
    .notifyBar-vertical {
        width: 230px;
    }

    .cnyInfoPanel-push-toright{
        padding-right: 0px;
        right: -113px; /*calcolato con notifyBar_Width - cnyInfoPanel_Rigth*/
    }

    .notifyBar-left {
        left: -230px;
    }
    .notifyBar-left.notifyBar-open {
        left: 51px; /*dipende dalla dimensione della main sidebar*/
    }
    /*end */


}

/* tablet (portrait) ----------- */
@media only screen
and/*!Hack-YUI-Compressor-Problem*/(min-device-width : 768px)
and/*!Hack-YUI-Compressor-Problem*/(max-device-width : 1024px)
and/*!Hack-YUI-Compressor-Problem*/(orientation : portrait) {
    /* Styles */
    .headerBarBase{
        height: 40px;
        display: block;
    }
    .centralContentContainer{
        height: calc(100% - 40px);
    }

    /*1° caso */
    .gmainsb{
        top: 40px;
    }
    .gactionsb{
        top:40px;
    }
    .hideClass4MainSideBar{
        display: none;
    }
    .hideClass4ActionSideBar{
        display: none;
    }

    .pnlRootCentralCnt{
        padding-left: 20px;
        padding-right: 20px;
    }
    .pnlRootCentralCntDim{
        width: calc(100% - 40px);
    }

    /*end*/

    /*2° caso */
    .gactionsbLarge{
        top:40px;
    }


    .pnlRootCentralCntLargeActionSb{
        padding-left: 10px;
        padding-right: 10px;
    }


    .pnlRootCentralCntDimLargeActionSb{
        width: calc(100% - 20px);
    }
    /*end*/

    /*3° caso TODO*/
    .cnyInfoPanel{
        position: static;
        top:auto;
        right: auto;
        padding-right: 0px;
        width: 210px;
    }

    .pnlRootCentralCntCompanyInfo{
        padding-left: 10px;
        padding-right: 5px;
        border-right: 5px solid #fff;
    }

    .pnlRootCentralCntDimCompanyInfo{
        width: calc(100% - 20px);
    }
    /*end*/

    /*4° caso TODO*/
    .pnlRootCentralCntDimNoMargin_ActionSbShort{
        width: 100%;
    }
    .pnlRootCentralCntNoMargin_ActionSbShort{
        padding-left: 0px;
        padding-right: 0px;
    }
    /*end*/

    /*4.1° caso TODO*/
    .pnlRootCentralCntDimNoMargin_ActionSbLarge{
        width: 100%; /* gactionsbLarge + gmainsb*/
    }

    .pnlRootCentralCntNoMargin_ActionSbLarge{
        padding-left: 0px;
        padding-right: 0px;
    }
    /*end*/

    /*5° caso */
    .notifyBar-vertical {
        width: 230px;
    }

    .cnyInfoPanel-push-toright{
        padding-right: 0px;
        right: auto;
    }

    .notifyBar-left {
        left: -230px;
    }

    .notifyBar-left.notifyBar-open {
        left: 51px; /*dipende dalla dimensione della main sidebar*/
    }
    /*end */




}



/*NOTE: da 776 a 1223 Vengono applicati gli style del 1024*/

/* Desktops and laptops ----------- */
@media only screen
and/*!Hack-YUI-Compressor-Problem*/(min-width : 1224px) {
    /* Styles */

    .headerBarBase{
        display: none;
    }
    .centralContentContainer{
        height: 100%;
    }

    /*1° caso */
    .gmainsb{
        display: block;
        width: 55px;
        top:0px;
    }
    .gactionsb{
        display: block;
        width: 122px;
        top:0px;
    }

    .pnlRootCentralCnt{
        padding-left: 84px;
        padding-right: 151px;
    }


    .pnlRootCentralCntDim{
        width: calc(100% - 235px);
    }


    /*end*/

    /*2° caso */
    .gactionsbLarge{
        display: block;
        width: 159px;
        top:0px;
    }


    .pnlRootCentralCntLargeActionSb{
        padding-left: 84px;
        padding-right: 180px;
    }



    .pnlRootCentralCntDimLargeActionSb{
        width: calc(100% - 264px);
    }


    /*end*/

    /*3° caso TODO*/
    .cnyInfoPanel{
        position: fixed;
        top:0px;
        width: 267px;
        right: 122px; /*gactionsb*/
        padding-right: 15px;
    }

    .pnlRootCentralCntCompanyInfo{
        padding-left: 84px;
        padding-right: 20px;
        border-right: 20px solid #fff;
    }

    .pnlRootCentralCntDimCompanyInfo{
        width: calc(100% - 528px); /*494 = padding left + padding rigth gactionsb + cnyInfoPanelWidth + cnyInfoPanelMarginRigth*/
    }
    /*end*/

    /*4° caso*/
    .pnlRootCentralCntDimNoMargin_ActionSbShort{
        width: calc(100% - 177px); /* gactionsb + gmainsb*/
    }
    .pnlRootCentralCntNoMargin_ActionSbShort{
        padding-left: 55px;
        padding-right: 122px;
    }

    /*end*/

    /*4.1° caso TODO*/
    .pnlRootCentralCntDimNoMargin_ActionSbLarge{
        width: calc(100% - 214px); /* gactionsbLarge + gmainsb*/
    }

    .pnlRootCentralCntNoMargin_ActionSbLarge{
        padding-left: 55px;
        padding-right: 159px;
    }
    /*end*/

    /*5° caso*/
    .notifyBar-vertical {
        width: 310px;
    }

    .cnyInfoPanel-push-toright{
        padding-right: 0px;
        right: -158px; /*calcolato con notifyBar_Width - cnyInfoPanel_Rigth*/
    }

    /* Vertical menu that slides from the left or right */
    .notifyBar-left {
        left: -310px;
    }
    .notifyBar-left.notifyBar-open {
        left: 55px; /*dipende dalla dimensione della main sidebar*/
    }
    /*end*/


}

/* Large screens ----------- */
@media only screen
and/*!Hack-YUI-Compressor-Problem*/(min-width : 1824px) {
    /* Styles */


    /*1° caso */
    .gmainsb{
        display: block;
        width: 82px;
        top:0px;
    }
    .gactionsb{
        display: block;
        width: 162px;
        top:0px;
    }

    .pnlRootCentralCnt{
        padding-left: 120px;
        padding-right: 202px;
    }
    .pnlRootCentralCntDim{
        width: calc(100% - 322px);
    }


    /*end*/

    /*2° caso */
    .gactionsbLarge{
        display: block;
        width: 190px;
        padding: 0px 11px;
        top:0px;
    }



    .pnlRootCentralCntLargeActionSb{
        padding-left: 120px;
        padding-right: 233px;
    }

    .pnlRootCentralCntDimLargeActionSb{
        width: calc(100% - 353px);
    }
    /*end*/

    /*3° caso TODO*/

    .cnyInfoPanel{
        position: fixed;
        top:0px;
        width: 357px;
        right: 162px; /*gactionsb*/
        padding-right: 15px;
    }

    .pnlRootCentralCntCompanyInfo{
        padding-left: 120px;
        padding-right: 25px;
        border-right: 25px solid #fff;
    }


    .pnlRootCentralCntDimCompanyInfo{
        width: calc(100% - 704px); /*654 = padding left + padding right +  gactionsb + cnyInfoPanelWidth + cnyInfoPanelMarginRigth*/
    }
    /*end*/

    /*4° caso*/
    .pnlRootCentralCntDimNoMargin_ActionSbShort{
        width: calc(100% - 244px); /* gactionsb + gmainsb*/
    }
    .pnlRootCentralCntNoMargin_ActionSbShort{
        padding-left: 81px;
        padding-right: 162px;
    }
    /*end*/

    /*4.1° caso TODO*/
    .pnlRootCentralCntDimNoMargin_ActionSbLarge{
        width: calc(100% - 293px); /* gactionsbLarge + gmainsb*/
    }

    .pnlRootCentralCntNoMargin_ActionSbLarge{
        padding-left: 81px;
        padding-right: 212px;
    }
    /*end*/

    /*5° caso*/
    .notifyBar-vertical {
        width: 360px;
    }

    .cnyInfoPanel-push-toright{
        padding-right: 0px;
        right: -158px; /*calcolato con notifyBar_Width - cnyInfoPanel_Rigth*/
    }

    /* Vertical menu that slides from the left or right */
    .notifyBar-left {
        left: -360px;
    }
    .notifyBar-left.notifyBar-open {
        left: 82px; /*dipende dalla dimensione della main sidebar*/
    }
    /*end*/
}