body {
    font-family: "Inter", sans-serif;
}

.closedHeader {
    height: 0px !important;
    top: 0px !important;
    left: 0px !important;
}

.force-layout-fill {
    /*szp
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    */
    top: 0 !important;
    width: 100vw;
    height: 100vh;
}


div#global {
    width: 100%;
    height: 100%;
    border: 0px;
    margin-left: auto;
    margin-right: auto;
}

div#left {
    width: 30%;
    height: 100%;
    float: left;
}

div#right {
    width: 69%;
    float: left;
    margin: 0 auto;
    margin-left: 2px;
}

div#rightOrdersSent {
    float: left;
    width: 70%;
    box-shadow: -4px 0 10px grey;
    -webkit-box-shadow: -4px 0 10px grey;
    -moz-box-shadow: -4px 0 10px grey;
    z-index: 50;
}

/* szp restyle 
div#rightOrdersSentGlobalContainer {
    position: absolute;
    width: 30%;
    right: 0px;
    top: 0px;
    bottom: 300px;
    overflow: auto;
    box-shadow: -3px 0 10px grey;
    -webkit-box-shadow: -3px 0 10px grey;
    -moz-box-shadow: -3px 0 10px grey;
}
 */

div#rightOrdersSentContainer {
    width: 100%;
    box-shadow: inset 0 -5px 10px -5px grey;
    -webkit-box-shadow: inset 0 -5px 10px -5px grey;
    -moz-box-shadow: inset 0 -5px 10px -5px grey;
}

div#productFamiliesGlobal {
    width: 100%;
}


/* Pane configuration */
.left.layout-col {
    width: 268px;
    transition: all 0.5s ease;
    background-color: #4D4D4D;
    box-shadow: 5px 0px 5px #4D4D4D
}

.right.layout-col {
    left: 268px;
    right: -268px;
    transition: all 0.5s ease;
}

.left.layout-col-state-show {
    width: 268px;
    transition: all 0.5s ease;
    /*background-color: #4D4D4D;*/
}

.left.layout-col-state-hidden {
    width: 0px;
    transition: all 0.5s ease;
}

.right.layout-col-state-show {
    left: 268px;
    right: -268px;
    transition: all 0.5s ease;
    box-shadow: -4px 0 10px grey;
    -webkit-box-shadow: -4px 0 10px grey;
    -moz-box-shadow: -4px 0 10px grey;
}

.right.layout-col-state-hidden {
    left: 0px;
    right: 0px;
    transition: all 0.5s ease;
}

.header.layout-row {
    height: 60px;
    /*line-height: 60px;*/
    border-right: 1px solid #484848;
}

.body.layout-row {
    top: 60px;
    bottom: 0px; /* 50px */
}

.footer.layout-row {
    height: 0; /* 50px */
    bottom: 0;
    line-height: 0; /* 50px*/
}

.shadow-layer {
    z-index: 999;
    box-shadow: none;
    background: gray;
    opacity: 0.5;
}


/*.animate-show {
    opacity: 0.5;
}

    .animate-show.ng-hide-add.ng-hide-add-active,
    .animate-show.ng-hide-remove.ng-hide-remove-active {
        -webkit-transition: opacity ease 0.5s;
        transition: opacity ease 0.5s;
    }

    .animate-show.ng-hide {
        /*line-height: 0;*/
/*opacity: 0;*/
/*padding: 0 10px;*/
/*}*/



/*.animate-show.ng-hide-add.ng-hide-add-active,
.animate-show.ng-hide-remove.ng-hide-remove-active {
  -webkit-transition: all linear 0.5s;
  transition: all linear 0.5s;
}

.animate-show.ng-hide {
  line-height: 0;
  opacity: 0;
  padding: 0 10px;
}*/

/*.layout-row-state-expand {
    left: 0 !important;
    top: 0 !important;
    transition: all 0.5s ease;
}

.layout-row-state-hidden {
    height: 0 !important;
    transition: all 0.5s ease;
}*/

/* --- */

/*#leftPanel.ui-show {
            width: 200px;
        }

        #leftPanel.ui-hide {
            width: 0px;
        }

        #rightPanel.ui-show {
            left: 200px;
            right: 0;
        }

        #rightPanel.ui-hide {
            left: 0px;
            right: 0px;
        }*/


/*.example-show-setup, .example-hide-setup {
            -webkit-transition: all linear 0.5s;
            -moz-transition: all linear 0.5s;
            -ms-transition: all linear 0.5s;
            -o-transition: all linear 0.5s;
            transition: all linear 0.5s;
        }

        .example-show-setup {
            line-height: 0;
            opacity: 0;
            padding: 0 10px;
        }

        .example-show-start.example-show-start {
            line-height: 20px;
            opacity: 1;
            padding: 10px;
            border: 1px solid black;
            background: white;
        }

        .example-hide-setup {
            line-height: 20px;
            opacity: 1;
            padding: 10px;
            border: 1px solid black;
            background: white;
        }

        .example-hide-start.example-hide-start {
            line-height: 0;
            opacity: 0;
            padding: 0 10px;
        }*/