body {
    background-color:#F8F8F8;
    font-family: Arial, Helvetica, sans-serif;
    font-size:15px; font-size: 1.5vh;
    padding: 0;
    margin: 0;
    overflow:hidden;
}

body>div.desktop
{
    height:100vh;
}


div.desktop div.constructionMessage, div.desktop div.loadingMessage
{
    position:absolute;
    width:30%;
    left: 35%;
    top: 20%;
    border: 1px solid #CCC;
    background-color:white;
    text-align: center;
    padding: 2vh;
    border-radius: 2vh;
    -webkit-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.75);
}

div.desktop:not(.underConstruction) div.constructionMessage, div.desktop:not(.loading) div.loadingMessage
{
    display:none;
}


div.desktop div.constructionMessage>p:first-child, div.desktop div.loadingMessage>p:first-child
{
    font-size:200%;
    font-weight: bold;
}

div.desktop div.constructionMessage>p:last-child
{
    font-size:200%;
    font-weight: bold;
}


.hidden {display:none}
.bold {font-weight: bold}
.italic {font-style: italic}

body>div a, body>div a:not([href]):not([tabindex]) {
    text-decoration: underline; cursor: pointer; color: #139; padding: 4px;
    padding-left:0.5em;padding-right:0.5em;
    margin-bottom:0.5em;
}

body>div a:hover, body>div a:not([href]):not([tabindex]):hover {
    background-color:#28a745;
    border-radius: 5px;
    border-radius: .25rem;
    color:white;
}

body>div label {font-weight: normal}

body>div label input[type='checkbox'] {margin-left:0.5em;margin-right: 0.5em;}

div.btn-light {border: 1px solid #CCC}

ul.radio {list-style: none;}

body>div.desktop>div.notification
{
    background-color: rgba(0,0,0,0.8);
    color: rgba(255,255,255,0.8);
    font-size: 7vh;
    font-weight:bold;
    position: absolute;
    bottom: 1vh;
    right: 1vh;
    z-index: 999999;
    padding: 1vh;
}


div.eventChecker {position: absolute; top:0;right: 0}
div.eventListener {width:2vh;height:2vh;}
div.eventListener.paused {background-color:red; width:10vh;height:10vh;}


/* =============================
   icons  
   ============================= */
div.DesktopSnopDesktop>div.icons
{
    max-height:90vh;
    width: 300px;
    width: 36vh;
}

div.DesktopSnopDesktop>div.icons>div
{
    float:left
}

body>div div.icon
{
    font-size:3.5vh;
    margin:10px; margin:1vh; cursor:pointer;
    width:100px;height:100px;
    width:10vh; height:10vh;
    position:relative;
    background-color:#DD1541;
    border: 2px solid #A10F2E;
    padding:0;
    padding-top:3.5px;
    padding-top:0.4vh;
}

body>div div.icon.lighter
{
    background-color: #ED3F64;
}

body>div div.icon:hover
{
    background-color:#A10F2E;
    border-color:black;
}

body>div div.icon>div
{
    font-family: Arial, Helvetica, sans-serif;
    font-size:12px; font-size:1.2vh;
    position:absolute;bottom:4px;width:100%;
    text-align:center;left:0; width:100%;
    font-weight:lighter
}

body>div div.icon.small>div {
    font-size:12px; font-size:1.2vh;
    white-space: normal
}

body>div div.icon.selected {color:white; border:3px solid #933}
body>div div.icon.selectable {color:#DDD; border:0}


body>div div.icon select
{
    background-color: #DD1541; color:white; border:0;
    font-size:9px; font-size:0.9vh;
    width:100%;
    text-align: center;
}

/* =================================
   div.popup  (and div.window for x)
   ================================= */
body>div div.popup, body>div div.window, body>div div.Window
{
    border: 1px solid #AAA;
    border-radius:10px;
    border-radius:1vh;
    background-color:white;
}


div.popup.loading>div.body:before
{
    content: url("../vendor/kgcubed/kgcubed_greenfield/x/css/img/loading-cover.png");
    position:absolute;
    z-index:9999;
    top:calc(50% - 75px);
    left:calc(50% - 250px);
}

body>div div.popup, body>div div.window, body>div div.Window
{
    position:absolute;
}
body>div div.popup:not(.minimized):not(.maximized),
body>div div.window:not(.minimized):not(.maximized),
body>div div.Window:not(.minimized):not(.maximized)
{

    width:40%; top:25%; left:30%; right:30%;
    -webkit-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.75);
    box-shadow: 10px 10px 23px 0px rgba(0,0,0,0.75);
}


body>div div.popup>div.titleBar, body>div div.window>div.titleBar, body>div div.Window>div.titleBar
{
    background-color:#DD1541; position:relative;
    height:27px; height:2.7vh;
    padding:2px; padding:0.2vh;
    padding-left:6px; padding-left:0.6vh;
    color: white; font-weight:bold;
    font-size:15px; font-size: 1.5vh;
    border-top-left-radius:10px;border-top-left-radius:1vh;
    border-top-right-radius:10px;border-top-right-radius:1vh;
    border-top: 1px solid #A10F2E;
    border-left: 1px solid #A10F2E;
    border-right: 1px solid #A10F2E;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
body>div div.window>div.body>div.junk, body>div div.Window>div.body>div.junk
{
    height: 10vh;
    background-image: url('../vendor/kgcubed/kgcubed_greenfield/x/css/img/warning.png');
    background-size:10vh;
    background-repeat: no-repeat no-repeat;
    background-position:95%
}
body>div div.window>div.body>div.junk:before, body>div div.Window>div.body>div.junk:before
{
    content: "An error was returned by the server";
    color:red;
    font-size: 2vh
}

body>div div.window>div.body>div.junk *, body>div div.Window>div.body>div.junk *
{
    display:none
}
div.server-error *:hover
{
    font-size:16px
}
body>div div.popup div.closeButton, body>div div.window div.closeButton, body>div div.Window div.closeButton
{ background: url('img/close.png') }

body>div div.popup div.maxButton, body>div div.window div.maxButton, body>div div.Window div.maxButton
{ background: url('img/max.png') }

body>div div.popup div.minButton, body>div div.window div.minButton, body>div div.Window div.minButton
{ background: url('img/min.png') }

body>div div.popup.maximized div.maxButton, body>div div.window.maximized div.maxButton, body>div div.Window.maximized div.maxButton
{
    background: url('img/restore.png');
    background-size:contain;
    background-repeat: no-repeat no-repeat;
}

body>div div.popup div.maxButton,
body>div div.popup div.closeButton,
body>div div.window div.maxButton,
body>div div.window div.minButton,
body>div div.window div.closeButton,
body>div div.Window div.maxButton,
body>div div.Window div.minButton,
body>div div.Window div.closeButton
{
    width: 23px; height: 23px;
    width: 2.3vh; height: 2.3vh;
    background-size:contain;
    background-repeat: no-repeat no-repeat;
    float:right;
    cursor:pointer
}

div.minimizedWindowBar
{
    left:85px;
    left:8vh;
    width:calc( 100% - 85px );
    width:calc( 100% - 8vh );
    position:absolute;
    bottom:0;
    max-height:100%;
    overflow-y:auto;
    z-index:0
}

body>div div.window.minimized, body>div div.popup.minimized, body>div div.Window.minimized
{
    width:10vh;
    -webkit-box-shadow: 7px 7px 5px 0px rgba(0,0,0,0.75);
    -moz-box-shadow:  7px 7px 5px 0px rgba(0,0,0,0.75);
    box-shadow:  7px 7px 5px 0px rgba(0,0,0,0.75);
    position:relative;
    margin-bottom:20px;
    margin-bottom:2vh;
    margin-left:20px;
    margin-left:2vh;
    border-radius:4px;
    border-radius:0.4vh;
    float:left;
}

body>div div.popup.minimized>div.titleBar,
body>div div.window.minimized>div.titleBar,
body>div div.Window.minimized>div.titleBar
{
    font-size:60%;
    height:16px; height:1.6vh;
    padding:0.1vh;
    border-top-left-radius:4px;border-top-left-radius:0.4vh;
    border-top-right-radius:4px;border-top-right-radius:0.4vh;

}

body>div div.popup.minimized div.maxButton,
body>div div.window.minimized div.maxButton,
body>div div.window.minimized div.closeButton,
body>div div.window.minimized div.minButton,
body>div div.Window.minimized div.maxButton,
body>div div.Window.minimized div.closeButton,
body>div div.Window.minimized div.minButton
{
    display:none;
    height:1px;
}
body>div div.window.minimized>div.titleBar:hover>span, body>div div.Window.minimized>div.titleBar:hover>span
{
    display:none
}
body>div div.window.minimized>div.titleBar:hover>div.closeButton, body>div div.Window.minimized>div.titleBar:hover>div.closeButton
{
    height:13px;
    width:13px;
    height:1.3vh;
    width:1.3vh;
    display:inline
}

body>div div.window.minimized div.body, body>div div.Window.minimized div.body
{
    font-size:2%;
    padding: 0;
    height: 7vh;
    overflow: hidden;
    border-bottom-left-radius:4px;
    border-bottom-left-radius:0.4vh;
    border-bottom-right-radius:4px;
    border-bottom-right-radius:0.4vh;
    width:10vh;
}

body>div div.minimized>div.body>div.minimizedWindowCover
{
    height:100%;
    position:absolute;
    top:0;left:0;
    width:100%;
    z-index: 99999999;

}
body>div div.minimized>div.body>div.minimizedWindowCover:hover
{
    background: url('img/restore.png');
    background-size:contain;
    background-repeat: no-repeat no-repeat;
    background-color:#DD1541;
    background-position:center;
    cursor:pointer;

}

body>div div.window.minimized div.body div.icon,
body>div div.Window.minimized div.body div.icon,
body>div div.popup.minimized div.body div.icon
{
    height:8px;
    height:0.8vh;
    width:8px;
    width:0.8vh;
    margin:1px
}

body>div div.window.minimized div.body div.icon>div, body>div div.Window.minimized div.body div.icon>div
{
    font-size:1px;
}

body>div div.window.minimized div.kgcubed-grid div.scrollArea, body>div div.Window.minimized div.kgcubed-grid div.scrollArea
{
    background-color:#DDD
}
body>div div.window.minimized div.kgcubed-grid div.headerArea, body>div div.Window.minimized div.kgcubed-grid div.headerArea
{
    height:5px;
}
body>div div.window.minimized div.kgcubed-grid div.headerArea *, body>div div.Window.minimized div.kgcubed-grid div.headerArea *
{
    display:none
}

body>div div.window.minimized div.kgcubed-grid div.rowExpander, body>div div.Window.minimized div.kgcubed-grid div.rowExpander
{
    display:none
}


body>div div.popup.maximized {
    border-radius:0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow:none;
    border:0;
    width:100%;
    left:0;
    height:100%;
    top:0;
}
body>div div.popup.maximized>div { border-radius:0;border:0; }
body>div div.popup.maximized div.ui-resizable-handle {display:none}


body>div div.popup>div.body, body>div div.window>div.body, body>div div.Window>div.body
{
    position:relative;
    padding:12px; padding:1vh;
    font-size: 14px; font-size: 1.4vh;
    border-bottom-left-radius:10px;border-bottom-left-radius:1vh;
    border-bottom-right-radius:10px;border-bottom-right-radius:1vh;
}
body>div div.window>div.body div.btn, body>div div.Window>div.body div.btn
{font-size: 14px; font-size: 1.4vh; /* override bootstrap */}

body>div div.popup.aspect>div.body
{
    height: calc(100% - 27px);
    height: calc(100% - 2.7vh);
    border-bottom-right-radius:0px;
}
body>div div.popup.aspect
{
    border-bottom-right-radius:0px;
}

body>div div.popup:not(.autoheight)>.body,
body>div div.Window:not(.autoheight)>.body
{
    height: calc(100% -  27px);
    height: calc(100% -  2.7vh)
}


body>div div.popup.maximized {
    border-radius:0;
    -webkit-box-shadow: 0 0 0 0 rgba(0,0,0,0.75);
    -moz-box-shadow: 0 0 0 0 rgba(0,0,0,0.75);
    box-shadow:0 0 0 0 rgba(0,0,0,0.75);
    border:0;
}
body>div div.popup.maximized>div {
    border-radius:0;border:0;
}


/* =============================
   div.popupdialog
   ============================= */

body>div div.popupdialog div.buttons>table {margin-top:1em}
body>div div.popupdialog div.buttons,
body>div div.popupdialog div.buttons>table,
body>div div.popupdialog div.buttons td>div.btn
{
    width: 100%;
}

body>div div.popupdialog div.buttons td:not(:last-child) {padding-right: 5px; padding-right: 0.5vh}
body>div div.popupdialog div.buttons td:not(:first-child) {padding-left: 5px; padding-left: 0.5vh}


/* =============================
   div.uploadPopup
   ============================= */

body>div div.popup.uploadPopup select, body>div div.popup.downloadPopup select
{
    width:80%;
    margin-left:10%;
    margin-bottom:1em;
}

body>div div.popup.uploadPopup div.upload, body>div div.popup.downloadPopup div.download
{
    float:right; margin-bottom:12px; margin-bottom: 1vh
}

body>div div.popup.uploadPopup div.importExisting
{
    margin-left:8%;
}
body>div div.popup.uploadPopup div.importExisting span>input {
    width:5em;
    text-align:right;
    margin-left:2em;
    margin-right:0.2em;
    height:1.8em;
}
body>div div.popup.uploadPopup div.importExisting span>button
{
    height:2em;
}

span.fileinput-button.uploading {
    background-color: #CFC;
    background-image: url('img/uploading.gif');
    background-size: contain;
    background-repeat: no-repeat no-repeat;
    background-position: center;
}


/* =============================
   progress status
   ============================= */

body>div div.progress
{
    width:90%; margin-left: 5%;
    margin-top:15px; margin-top:1.5vh;
    margin-bottom:25px;margin-bottom:2.5vh;
    height: 35px; height: 3.5vh;
    border-radius: 5px; border-radius: 0.5vh;
    border: 1px solid #BBB;
    background-color: #EEE;
}

body>div div.progress>div
{
    height:100%;
    width:0%;
    background-color: green;
}

body>div div.progressShowDetail {display:none}
body>div div.progressShowDetail>label {cursor: pointer}
body>div div.progressShowDetail>label>input {margin: 5px; margin: 0.5vh}

body>div div.progressDetail {
    width: 100%;
    border: 1px solid #DDD;
    display: none;
    padding: 0.5em; padding-left:0;
    max-height: 75vh; overflow-y:auto
}

body>div div.progressDetail>ul>li {height: 1.5em}
body>div div.progressDetail>ul>li>span>i {color:green; font-size:80%;margin-left:0.7em; cursor:pointer}
body>div div.progressDetail>ul>li>span>div {
    float:right; height:1em; width:7em;
    border: 1px solid #AAA; margin-top:0.3em;
    margin-right:0.5em;
    background-color: #CCC;
}

body>div div.progressDetail>ul>li>span>div>div
{
    background-color: green;
    height: 100%;
}

/* =============================
   div.popup.userLogin
   ============================= */

body>div div.userLogin {min-width:20%}
body>div div.popup.userLogin:not(.popupdialog) table {width:80%; margin-left:10%; margin-top:10px ;margin-top:1vh}
body>div div.popup.userLogin table tr {height:3em}
body>div div.popup.userLogin>div:last-child>div {margin-top: 1em;width: 100%; height:4em;}
body>div div.userLogin div>div.btn {float:right;margin:10px ;margin:1vh;}
body>div div.popup.userLogin table input {width: 100%}
body>div div.popup.userLogin a {float:left; margin-top:1.6em}
body>div div.popup.userLogin.popupdialog input {width: 80%; margin:1em; margin-left: 10%; text-align: center}

body>div div.popup div.ldap
{
    position:absolute;
    width:2vh;height:2vh;
    top:0;
    right:0;
}

/* =============================
   div.popup.snopcycle
   ============================= */

body>div div.popup.snopcycle div.cycleSelect
{
    border-bottom: 1px solid #CCC;
    padding-bottom: 1.5em; height: 3vh;
}
body>div div.popup.snopcycle.minimized div.cycleSelect {display:none}
body>div div.popup.snopcycle div.cycleSelect select {width:100%}

body>div div.popup.snopcycle>div:last-child>div:last-child>div {padding:0}

body>div div.popup.snopcycle:not(.minimized) div.cycleDetail {height:70vh}

body>div div.popup.snopcycle:not(.minimized) div.cycleDetail div.dashboard
{
    height:48vh;
    overflow-y:auto;
    border:1px solid #EEE
}

body>div div.popup.snopcycle div.cycleDetail>div:first-child
{
    width:30%; float:left;border-right: 1px solid #CCC;height:100%
}


body>div div.popup.snopcycle div.cycleDetail div.icon.fa-trash-alt.delete-button
{
    height:4vh; width: 4vh;
}

body>div div.popup.snopcycle div.cycleDetail div.icon.fa-trash-alt.delete-button>div
{
    font-size:1vh;
    bottom: 0;
}

body>div div.popup.snopcycle div.cycleDetail div.cycleActionButtons
{
    position: absolute;
    bottom: 0;
    width: 30%;
    padding: 0.5vh;
    left:0;
}
body>div div.popup.snopcycle.minimized div.cycleDetail div.cycleActionButtons
{
    display:none
}

body>div div.popup.snopcycle:not(.popupdialog) table
{
    width:90%;
    margin-left:5%;
    margin-top: 1em
}

body>div div.popup.snopcycle table tr {height:2em}
body>div div.popup.snopcycle table th {text-align: right;padding: 4px}
body>div div.popup.snopcycle:not(.popupdialog) div.cycleDetail>div:first-child>table th
{
    width: 15%; font-size:85%
}

body>div div.popup.snopcycle table input,
body>div div.popup.snopcycle table select
{
    width: 100%; height: 1.6em
}

body>div div.popup.snopcycle div.cycleDetail div.dashboard>table tr {font-size:65%; line-height: 0}
body>div div.popup.snopcycle div.cycleDetail div.dashboard>table td {border: 1px solid #999; text-align:center; padding:0}
body>div div.popup.snopcycle div.cycleDetail div.dashboard>table td>i.fa-check {cursor:pointer; color:green}
body>div div.popup.snopcycle div.cycleDetail div.dashboard>table th {text-align:center; padding:0}

body>div div.popup.snopcycle div.cycleDetail>div:last-child {
    overflow:auto;
    max-height:100%;
}
body>div div.popup.snopcycle.minimized div.cycleDetail>div:last-child {
    overflow:hidden
}
body>div div.popup.snopcycle div.building
{
    width: 70px; width: 7vh;
    height: 70px; height: 7vh;
    text-align:center;
    padding-top: calc(3.5vh - 0.6em);
    font-weight:bold;
    color: #A10F2E;
    position:absolute;
    bottom: 0;
    right:0;
    cursor:pointer
}

/* ==============================
   div.popup.snoppartNumberValues
   ============================== */

body>div div.popup.snoppartNumberValues div.grid
{
    width: 100%; height:60vh; border: 1px solid black; margin-top:3.5em
}


/* =============================
   div.graph-holder
   ============================= */

div.graph-holder {position:relative; width:100%;height:100%;}

div.graph-legend {position:absolute;top:0%;left:0%; width:100%;height:7%; text-align:center}
div.graph-legend>div {display: inline-block;padding-top:calc(3.5% - 15px);padding-top:calc(3.5% - 1.5vh)}
div.graph-legend>div>div {float:left;margin-right: 1em}
div.graph-legend>div>div>div {float:left;width:15px; height:15px; width:1.5vh; height:1.5vh; margin-right:0.3em}
div.graph-legend>div>div>span {float:left; font-size:12px; font-size:1.2vh}

div.graph-layer {position:absolute;top:7%;left:0%; width:100%;height:93%}
div.graph-container {position:relative;height: 100%;}





/* =============================
   div.popup.snopgraphforecast
   ============================= */

body>div div.popup.snopgraphforecast>div.body {padding-left:0}

body>div div.popup.snopgraphforecast div.side-panel
{
    width: 10%;float:left;height:100%;padding:0
}

body>div div.popup.snopgraphforecast div.graph-holder
{
    width:90%;float:left; display:none
}

body>div div.popup.snopgraphforecast div.grid-holder
{
    width:90%;float:left; height: 100%
}
body>div div.popup.snopgraphforecast.maximized div.graph-holder {width:65%}

body>div div.popup.snopgraphforecast div.side-panel div.segmentFilter
{
    display:inline-block; vertical-align:top; overflow:hidden;
    border:1px solid #CCC;
    margin:5px; margin:0.5vh;
    margin-top: 0;
    width: calc( 100% - 1vh);
    border-radius: 5px; border-radius: 0.5vh;
}

body>div div.popup.snopgraphforecast div.side-panel div.segmentFilter select
{
    padding:10px; margin:-5px -20px -5px -5px;
    width: calc(100% + 25px);
    background-color: #EEE;
}

body>div div.popup.snopgraphforecast div.side-panel div.segmentFilter select option
{
    padding: 3px;padding: 0.3vh
}

body>div div.popup.snopgraphforecast div.grid-holder>div.kgcubed-grid
{
    height: calc(100% - 3em); margin-top:3em; border:0
}


body>div div.quarterColumn {background-color: #DDD; font-weight:bold}

body>div div.groupLevel10,
body>div div.groupLevel9,
body>div div.groupLevel8,
body>div div.quarterColumn.groupLevel10,
body>div div.quarterColumn.groupLevel9,
body>div div.quarterColumn.groupLevel8,
body>div div.quarterColumn.groupLevel7,
body>div div.quarterColumn.groupLevel6
{
    color:white
}


body>div div.popup.snopgraphforecast div.side-panel div.view-selector>p
{
    margin:0.5vh; margin-left:1em
}

body>div div.popup.snopgraphforecast div.side-panel div.view-selector label>span
{
    margin-left:0.5em
}
body>div div.popup.snopgraphforecast div.side-panel div.view-selector
{
    border:1px solid #CCC;
    border-radius: 5px; border-radius: 0.5vh;
    margin:5px;
    margin:0.5vh;
    margin-top:0;
    background-color: #EEE;
}

body>div div.popup.snopgraphforecast div.view-selector div
{
    width: calc(100% - 0.6vh);
    border: 1px solid #CCC;
    margin:0.3vh;
    padding:0.2vh;
    text-align: center;
    border-radius: 5px; border-radius: 0.5vh;
    background-color: #FFF;
    cursor: move; /* fallback if grab cursor is unsupported */
    cursor: grab;
    cursor: -moz-grab;
    cursor: -webkit-grab;
}

body>div div.popup.snopgraphforecast div.grid-holder div.grid-cover,
body>div div.popup.snopgraphforecast div.grid-holder div.refresh-cover
{
    position: absolute; height:calc(100% - 5vh);
    left:10%; z-index:100;
    top:40px; top:4vh;
    width:calc(90% - 10px); width:calc(90% - 1vh);
    background-color: rgba(255,255,255,0.6);
    font-size:200px; font-size:20vh;
    padding-top: calc(40% - 200px); padding-top: calc(40% - 20vh);
    text-align: center; color:rgba(0,0,0,0.4); font-weight: bold
}

div.kgcubed-grid div.toolbar div.button.viewDetail
{
    background-image: url('img/newWindow.png')
}

div.kgcubed-grid div.toolbar div.button.viewGraph
{
    background-image: url('img/graph.png')
}

div.kgcubed-grid div.toolbar div.button.add
{
    background-image: url('img/add.png')
}

div.kgcubed-grid div.toolbar div.button.delete
{
    background-image: url('img/font-awesome/trash-alt-regular-black.png')
}

div.kgcubed-grid div.toolbar div.button.download
{
    background-image: url('img/download.png')
}

div.kgcubed-grid div.toolbar div.button.schedule
{
    background-image: url('img/cogs-solid-black.png')
}

div.kgcubed-grid div.toolbar div.button.upload
{
    background-image: url('img/upload.png')
}

div.kgcubed-grid div.toolbar div.button.save
{
    background-image: url('img/save-solid.png');
}

div.kgcubed-grid div.toolbar div.button.refresh
{
    background-image: url('img/refresh-solid.png');
}

div.kgcubed-grid div.cell.decrease
{
    background-image: url('img/decrease.png');
    background-size: auto 60%;
    background-repeat: no-repeat;
    background-position: left;
}

div.kgcubed-grid div.cell.decrease.withComment
{
    background-image: url('img/commentDecrease.png');
}

div.kgcubed-grid div.cell.increase
{
    background-image: url('img/increase.png');
    background-size: auto 60%;
    background-repeat: no-repeat;
    background-position: left;
}

div.kgcubed-grid div.cell.increase.withComment
{
    background-image: url('img/commentIncrease.png');
}

div.kgcubed-grid div.cell.withComment:not(.increase):not(.decrease)
{
    background-size: auto 60%;
    background-repeat: no-repeat;
    background-position: left;
    background-image: url('img/comment.png');
}

div.kgcubed-grid div.cell.decrease.groupLevel1, div.kgcubed-grid div.cell.increase.groupLevel1, div.kgcubed-grid div.cell.commentBelow.groupLevel1, div.kgcubed-grid div.cell.withComment.groupLevel1
{background-color: rgba(0,0,0,0.05);}

div.kgcubed-grid div.cell.decrease.groupLevel2, div.kgcubed-grid div.cell.increase.groupLevel2, div.kgcubed-grid div.cell.commentBelow.groupLevel2, div.kgcubed-grid div.cell.withComment.groupLevel2
{background-color: rgba(0,0,0,0.1);}

div.kgcubed-grid div.cell.decrease.groupLevel3, div.kgcubed-grid div.cell.increase.groupLevel3, div.kgcubed-grid div.cell.commentBelow.groupLevel3, div.kgcubed-grid div.cell.withComment.groupLevel3
{background-color: rgba(0,0,0,0.15);}

div.kgcubed-grid div.cell.decrease.groupLevel4, div.kgcubed-grid div.cell.increase.groupLevel4, div.kgcubed-grid div.cell.commentBelow.groupLevel4, div.kgcubed-grid div.cell.withComment.groupLevel4
{background-color: rgba(0,0,0,0.2);}

div.kgcubed-grid div.cell.decrease.groupLevel5, div.kgcubed-grid div.cell.increase.groupLevel5, div.kgcubed-grid div.cell.commentBelow.groupLevel5, div.kgcubed-grid div.cell.withComment.groupLevel5
{background-color: rgba(0,0,0,0.25);}

div.kgcubed-grid div.cell.decrease.groupLevel6, div.kgcubed-grid div.cell.increase.groupLevel6, div.kgcubed-grid div.cell.commentBelow.groupLevel6, div.kgcubed-grid div.cell.withComment.groupLevel6
{background-color: rgba(0,0,0,0.3);}

div.kgcubed-grid div.cell.decrease.groupLevel7, div.kgcubed-grid div.cell.increase.groupLevel7, div.kgcubed-grid div.cell.commentBelow.groupLevel7, div.kgcubed-grid div.cell.withComment.groupLevel7
{background-color: rgba(0,0,0,0.35);}

div.kgcubed-grid div.cell.decrease.groupLevel8, div.kgcubed-grid div.cell.increase.groupLevel8, div.kgcubed-grid div.cell.commentBelow.groupLevel8, div.kgcubed-grid div.cell.withComment.groupLevel8
{background-color: rgba(0,0,0,0.4);}

div.kgcubed-grid div.cell.decrease.groupLevel9, div.kgcubed-grid div.cell.increase.groupLevel9, div.kgcubed-grid div.cell.commentBelow.groupLevel9, div.kgcubed-grid div.cell.withComment.groupLevel9
{background-color: rgba(0,0,0,0.45);}

div.kgcubed-grid div.cell.decrease.groupLevel10, div.kgcubed-grid div.cell.increase.groupLevel10, div.kgcubed-grid div.cell.commentBelow.groupLevel10, div.kgcubed-grid div.cell.withComment.groupLevel10
{background-color: rgba(0,0,0,0.5);}

div.kgcubed-grid div.cell.decrease.groupLevel11, div.kgcubed-grid div.cell.increase.groupLevel11, div.kgcubed-grid div.cell.commentBelow.groupLevel11, div.kgcubed-grid div.cell.withComment.groupLevel11
{background-color: rgba(0,0,0,0.55);}

div.kgcubed-grid div.cell.decrease.groupLevel12, div.kgcubed-grid div.cell.increase.groupLevel12, div.kgcubed-grid div.cell.commentBelow.groupLevel12, div.kgcubed-grid div.cell.withComment.groupLevel12
{background-color: rgba(0,0,0,0.6);}

div.kgcubed-grid div.cell.decrease.groupLevel13, div.kgcubed-grid div.cell.increase.groupLevel13, div.kgcubed-grid div.cell.commentBelow.groupLevel13, div.kgcubed-grid div.cell.withComment.groupLevel13
{background-color: rgba(0,0,0,0.65);}

div.kgcubed-grid div.cell.decrease.groupLevel14, div.kgcubed-grid div.cell.increase.groupLevel14, div.kgcubed-grid div.cell.commentBelow.groupLevel14, div.kgcubed-grid div.cell.withComment.groupLevel14
{background-color: rgba(0,0,0,0.7);}

div.kgcubed-grid div.cell.decrease.groupLevel15, div.kgcubed-grid div.cell.increase.groupLevel15, div.kgcubed-grid div.cell.commentBelow.groupLevel15, div.kgcubed-grid div.cell.withComment.groupLevel15
{background-color: rgba(0,0,0,0.75);}

div.kgcubed-grid div.cell.decrease.groupLevel16, div.kgcubed-grid div.cell.increase.groupLevel16, div.kgcubed-grid div.cell.commentBelow.groupLevel16, div.kgcubed-grid div.cell.withComment.groupLevel16
{background-color: rgba(0,0,0,0.8);}

div.kgcubed-grid div.cell.decrease.groupLevel17, div.kgcubed-grid div.cell.increase.groupLevel17, div.kgcubed-grid div.cell.commentBelow.groupLevel17, div.kgcubed-grid div.cell.withComment.groupLevel17
{background-color: rgba(0,0,0,0.85);}

div.kgcubed-grid div.cell.decrease.groupLevel18, div.kgcubed-grid div.cell.increase.groupLevel18, div.kgcubed-grid div.cell.commentBelow.groupLevel18, div.kgcubed-grid div.cell.withComment.groupLevel18
{background-color: rgba(0,0,0,0.9);}

div.kgcubed-grid div.cell.decrease.groupLevel19, div.kgcubed-grid div.cell.increase.groupLevel19, div.kgcubed-grid div.cell.commentBelow.groupLevel19, div.kgcubed-grid div.cell.withComment.groupLevel19
{background-color: rgba(0,0,0,0.95);}

div.kgcubed-grid div.cell.decrease.groupLevel20, div.kgcubed-grid div.cell.increase.groupLevel20, div.kgcubed-grid div.cell.commentBelow.groupLevel20, div.kgcubed-grid div.cell.withComment.groupLevel20
{background-color: #000;}


body>div div.popup.snopgraphforecast div.grid-holder div.refresh-cover
{
    display:none
}

body>div div.popup.snopgraphforecast div.grid-holder div.refresh-cover>div
{
    border: 1px solid black;color:white;background-color:green;
    height:150px;width:150px;
    height:15vh;width:15vh;
    font-size:100px;
    font-size:10vh;
    padding-top:10px;
    padding-top:1vh;
}



/* =============================
   div.popup.snopcycleadd
   ============================= */

body>div div.popup.snopcycleadd table {width:80%;margin-left:10%}
body>div div.popup.snopcycleadd table td {padding: 0.5vh}

body>div div.popup.snopcycleadd table td>input,
body>div div.popup.snopcycleadd table td>select
{
    width: 100%; height:1.6em
}

div.popup.snopcycleadd div.btn {width:30%; margin-top:1.5em}
div.popup.snopcycleadd div.btn-success {float: right}




/* =============================
   div.popup.errorwindow
   ============================= */

div.popup.errorwindow div.body>div
{
    color:#DD1541; background-color:#CCC; padding: 10px; padding: 1vh;
    border-radius: 10px;border-radius: 1vh;
    border: 2px solid black;
}

div.popup.errorwindow p {margin-top: 1em;text-align: right}

div.popup.errorwindow ul
{
    border:1px solid red; background-color:#666; color: #CCC;
    width:100%;
    padding: 10px; padding: 1vh;
    max-height: 250px; max-height: 25vh;
    overflow-y:auto;
    border-radius: 10px;border-radius: 1vh;
}
div.popup.errorwindow li {font-size:85%; margin-left: 1em}



/* =============================
   div.popup.snopcapacity
   ============================= */

body>div div.popup.snopcapacity div.view-selector
{
    height:100%;
    width:95px;width:9.5vh;
    border-right:1px solid #AAA
}
body>div div.popup.snopcapacity div.view-selector div.icon {float: left}

body>div div.popup.snopcapacity div.view-detail
{
    height:100%;
    position:absolute;
    top:10px;top:1vh;
    left:110px; left:11vh;
    width:calc(100% - 120px); width:calc(100% - 12vh);
}

body>div div.popup.snopcapacity div.view-detail>div
{ height:100%}

body>div div.popup.snopcapacity div.view-detail>div:not(.resources)
{
    display: none
}

body>div div.popup.snopcapacity div.grid-holder {
    margin-top: 3.5vh;
    height: calc(100% - 5vh)
}

body>div div.popup.snopcapacity div.grid-holder>div.kgcubed-grid {width: 100%;height:100%}


body>div div.popupdialog.snopcapacityresources.newCategory p:last-child {text-align: center}
body>div div.popupdialog.snopcapacityresources.newCategory p>input {width:80%;margin:1em}

body>div div.popupdialog.snopcapacityshifts.newShiftPattern p:last-child {text-align: center}
body>div div.popupdialog.snopcapacityshifts.newShiftPattern p>input {width:80%;margin:1em}


body>div div.grid-holder.snopcapacityshifts div.toolbar div.button.add {background-image: url('img/add.png') }




/* =======================================
   div.popup.snopcapacityutilisationdetail
   ======================================= */


body>div div.snopcapacityutilisationdetail div.body div.title
{
    font-weight: bold; font-size:120%; height: 30px; height: 3vh
}

body>div div.snopcapacityutilisationdetail div.body div.resources
{
    height: calc(40% - 15px);
    height: calc(40% - 1.5vh);
    position:relative;
}

body>div div.snopcapacityutilisationdetail div.body div.demand
{
    height: calc(60% - 15px);
    height: calc(60% - 1.5vh);
    position:relative;
}

body>div div.snopcapacityutilisationdetail div.body div.resources>div,
body>div div.snopcapacityutilisationdetail div.body div.demand>div
{
    position:absolute; width: 100%;
    height:calc(100% - 2.5em); bottom:0.5em
}

body>div div.snopcapacityutilisationdetailavailable.kgcubed-grid,
body>div div.snopcapacityutilisationdetaildemand.kgcubed-grid
{height: 100%;}


div.popup.downloadreadyDownloadReady p:last-child {text-align: right}


div.popup.siteproductsubFamilySubFamilies div.kgcubed-grid
{
    height: calc(100% - 3em);
    margin-top:3em;
}

/* =======================================
   div.popup.siteusersUserList
   ======================================= */
div.popup.siteusersUserList div.kgcubed-grid
{
    height: calc(100% - 3em);
    margin-top:3em;
}

div.popup.popupdialog.siteusersUserList.newUser table,
div.popup.popupdialog.siteusersUserList.newUser table select,
div.popup.popupdialog.siteusersUserList.newUser table input {width:100%}
div.popup.popupdialog.siteusersUserList.newUser table select {padding:3px}
div.popup.popupdialog.siteusersUserList.newUser p.error {color:red;text-align: center;margin:1em}

/* =======================================
   div.popup.userpasswordChangePassword
   ======================================= */
div.popup.userpasswordChangePassword table
{
    margin: 1em;
    margin-left:10%;
    width:80%;
}

div.popup.userpasswordChangePassword table input {width:15em}
div.popup.userpasswordChangePassword div.body>div {width:100%;}
div.popup.userpasswordChangePassword div.body>div>div {margin: 1em; float: right}


/* =======================================
   div.popup.elementcontrolsmultiSelectListMultiSelectList
   ======================================= */
div.elementcontrolsmultiSelectListMultiSelectList,
div.preferences
{
    border: 1px solid #666;
    padding: 5px; padding: 0.5vh
}

div.elementcontrolsmultiSelectListMultiSelectList>div {
    clear:both; position:relative; height: 1.8em
}
div.elementcontrolsmultiSelectListMultiSelectList>div>span {
    border: 1px solid #BBB; background-color:#F0F0F0;
    padding-left: 3px; padding-left: 0.3vh;
}
div.elementcontrolsmultiSelectListMultiSelectList>div>div:last-child {
    width: 2.5em;
    height: 100%;
    background-image: url('img/delete.png') ;
    background-size:contain;
    background-repeat: no-repeat no-repeat;
    background-position: right;
    cursor: pointer;
    float:left
}
div.elementcontrolsmultiSelectListMultiSelectList>div>div.add {
    background-image: url('img/add.png') ;
}
div.elementcontrolsmultiSelectListMultiSelectList>div>select,
div.elementcontrolsmultiSelectListMultiSelectList>div>span
{
    float:left;
    margin-top:0.2em;margin-bottom:0.2em;
    width: calc(100% - 2.5em - 10px); width: calc(100% - 2.5em - 1vh);
    margin-left:8px; margin-left:0.8vh;
}

div.popup.usersettingsUserSettings div.body > div
{
   width: 55%
}

div.popup.usersettingsUserSettings div.body div.UserAccessHistoryUserAccessHistory
{
    position:absolute;
    width: 44%;
    min-height: 98%;
    top:1%;
    left: 55.5%;
    border-left: 1px solid #CCC;
    padding: 1vh;
}

div.elementcontrolsmultiSelectListMultiSelectList p,
div.preferences p
{margin:0; font-weight:bold; color:#DD1541; margin:2px; margin: 0.2vh}

div.popup.usersettingsUserSettings div.elementcontrolsmultiSelectListMultiSelectList,
div.popup.usersettingsUserSettings div.preferences
{margin-bottom: 1em}

div.popup.usersettingsUserSettings > div.body > div:not(.preferences)
{
    max-height:20vh;
    overflow:auto
}

div.popup.usersettingsUserSettings > div.body > p:not(.unlocked) > a
{
    display:none
}

div.popup.usersettingsUserSettings > div.body > p.unlocked > span
{
    display:none
}

div.preferences>table
{
    width:98%;margin-left:1%;
}

div.preferences>table th
{
    color: #666;
    padding-top: 3px;
    padding-bottom: 3px;
}
div.preferences>table select
{
    width:100%;
    height: 1.6em;
}
div.preferences>table input
{
    width: 100%;
    height: 1.5em;
}

div.preferences>table input[type="checkbox"]
{
    width: auto;
    height: 1.5em;
}

div.preferences>table label
{
    margin-top: -7px;
    margin-left: -0.5em;
}

div.preferences>table label>input
{
    margin-top: 5px;
}

div.userlogoutLogout {position: absolute; bottom:5px; width: 8vh;height: 8vh; cursor:pointer}


div.snopforecastsubsidiaryfileFile p.downloadLink,
div.downloaduploadedFileDownload p.downloadLink
{
    text-align: right
}

div.snopforecastsubsidiaryfileFile table,
div.downloaduploadedFileDownload table
{
    width:90%; margin:5%
}

div.UploadSuccessfulUploadSuccessfulComponent div.body>div,

div.popup.uploadsuccessfulUploadSuccessful div.body
{
    min-height: 90px; min-height: 9vh;
    padding-left: 90px;padding-left: 9vh;
    background-image: url('img/font-awesome/info-circle-solid.png') ;
    background-size:auto 80%;
    background-size:auto 7vh;
    background-repeat: no-repeat no-repeat;
    background-position: 2%;
    background-position: 1vh;
}

div.UploadSuccessfulUploadSuccessfulComponent div.body>div{
    padding-top:21px;padding-top:3vh;
}
div.popup.uploadsuccessfulUploadSuccessful div.body>div
{
    margin-top:21px;margin-top:2.1vh;
}

div.popupdialog.snopcycle.writeToBudget ul.radio li {min-height: 1.8em}
div.popupdialog.snopcycle.writeToBudget ul.radio li input:not([type=radio]) {width: 5em; text-align: center}

div.snopforecastimportFromBudgetImportFromBudget div.body>p {font-weight:bold; height:1.2em; margin-bottom: 1em}
div.snopforecastimportFromBudgetImportFromBudget div.subsidiaries {height: calc(100% - 7em); overflow-y: auto; border:1px solid #CCC; background-color:white}
div.snopforecastimportFromBudgetImportFromBudget div.subsidiaries>p {margin:0}

div.snopforecastimportFromBudgetImportFromBudget div.buttons {position: absolute; bottom:0; width:100%; left:0; padding: 0.5vh}
div.snopforecastimportFromBudgetImportFromBudget div.buttons>div {width: 25%}
div.snopforecastimportFromBudgetImportFromBudget div.buttons>div:last-child {float:right}


/* ======================================= 
   div.popup.snopforecastdeviationMatrix  
   ======================================= */
div.popup.snopforecastdeviationMatrix div.body>div {width:100%;height:100%}
div.popup.snopforecastdeviationMatrix div.body>div>div.filter {width:100%; height:15%;}

div.popup.snopforecastdeviationMatrix div.body>div>div.filter div.filterSelector
{
    padding: 4px;
    border: 1px solid #999;
    display: inline-block;
    margin:2px;
    background-color:#AAA;
}

div.popup.snopforecastdeviationMatrix div.body>div>div.filter div.filterSelector>span
{
    color:white; font-weight: bold
}

div.popup.snopforecastdeviationMatrix div.body>div>div.columnSelection {
    width:95%; width:calc(100% - 5vh);
    height:5%;height:5vh;
    margin-left:5%;margin-left:5vh;
    background-color:#AAA;padding:3px;
    border-top-right-radius:40px;
    border-top-right-radius:4vh;
    border: 1px solid black; border-bottom: 0;
    text-align: center;
    padding-top: 20px;
    padding-top: 2vh;
}

div.popup.snopforecastdeviationMatrix div.body>div>div.rowSelection
{
    width:5%;
    width:5vh;
    height:80%;
    height:calc(85% - 5vh);
    float:left;background-color:#AAA;padding:3px;
    border-bottom-left-radius:40px;
    border-bottom-left-radius:4vh;
    border: 1px solid black; border-right: 0
}
div.popup.snopforecastdeviationMatrix div.body>div>div.rowSelection>select
{
    transform: rotate(270deg);
    position: absolute;
    top: 50%;
    left:-3vh;
}
div.popup.snopforecastdeviationMatrix div.body>div>div.matrix
{
    width:95%; width:calc(100% - 5vh);
    height:80%;
    height:calc(85% - 5vh);
    float:left; overflow:auto;background-color:#AAA;
    border-bottom: 1px solid black; border-right: 1px solid black
}

div.popup.snopforecastdeviationMatrix div.body>div>div.matrix>span {font-size: 500%; font-weight: bold; color: #BBB; text-align:center; top:45%; width:100%; position:absolute;}
div.popup.snopforecastdeviationMatrix div.body>div>div.matrix>table {min-width: 99%; background-color:white}
div.popup.snopforecastdeviationMatrix div.body>div>div.matrix>table th {border: 1px solid black; background-color:#EEE}
div.popup.snopforecastdeviationMatrix div.body>div>div.matrix>table>thead>th {text-align: center}
div.popup.snopforecastdeviationMatrix div.body>div>div.matrix>table td {border: 1px solid #DDD; text-align: center; cursor:pointer}
div.popup.snopforecastdeviationMatrix div.body>div>div.matrix>table td:last-child {border-right:1px solid black}
div.popup.snopforecastdeviationMatrix div.body>div>div.matrix>table>tbody>tr:last-child>td {border-bottom:1px solid black}
div.popup.snopforecastdeviationMatrix div.body>div>div.matrix>table td.missing {color: #999}

div.popup.snopforecastdeviationMatrix div.body>div>div.refresh {position: absolute; bottom: 2vh;right: 2vh; font-size: 200%; display:none}
div.popup.snopforecastdeviationMatrix div.body>div>div.refresh.visible {display:inline}

/* ========================================= 
   div.popup.snopforecastdeviationgraphGraph  
   ========================================= */

div.graphComponent {width: 100%;height: 100%}

div.graphComponent div.filters
{
    position: relative;
    width: 100%;
}

div.graphComponent div.filters:not(.noFilterControl)
{
    border-bottom: 1px solid #AAA;
    height: 20%;
}

div.graphComponent div.filters>input
{
    position: absolute;bottom: 5px; right:0
}

div.graphComponent div.graph {height:80%}
div.graphComponent.query div.graph {display:none}
div.graphComponent div.queries {display:none}
div.graphComponent.query div.queries {display:inline-block;height:80%;width: 100%}
div.graphComponent.query div.queries div:last-child {width: 100%}
div.graphComponent.query div.queries textarea {width: 100%; font-size:80%}
div.graphComponent div.filters>div {float: left}
div.graphComponent div.body>div.filters div>span
{
    color:white; font-weight: bold
}
div.graphComponent div.filters>div>label
{
    display: inline-block; float: left; clear:both; font-weight: bold; color: white
}
div.graphComponent div.filters div
{
    padding: 4px;
    border: 1px solid #999;
    display: inline-block;
    margin:2px;
    background-color:#AAA;
}

div.graphComponent div.filters>div>label>input {margin-right: 0.4em}

/* =================================================== 
    div.popup.snopforecastexternalExternalSalesWindow  
   =================================================== */

div.kgcubedxuigridgroupingGrouping>div
{
    width:96%; margin-left:2%; margin-top: 5px; margin-top: 0.5vh;
    border: 1px solid #999;
    padding:4px; padding: 0.4vh;
    border-radius: 5px;border-radius: 0.5vh;
    background-color: #F6F6F6;
    cursor: move;
    cursor: grab;
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

div.popup.snopforecastexternalExternalSalesWindow div.grouping
{
    float:left;width: 9%; margin-right: 1%
}

div.popup.snopforecastexternalExternalSalesWindow div.grid
{
    float:left;width: 90%; margin-top: 3em; height: calc(100% - 3em)
}

div.popup.snopforecastexternalExternalSalesWindow div.grid>.kgcubed-grid
{
    height: 100%
}

/* =================================================== 
    div.popup.snopforecastvalidationValidation  
   =================================================== */

div.popup.snopforecastvalidationValidation div.grid-options
{
    width: 18.5%;
    height:100%;
}

div.popup.snopforecastvalidationValidation div.grid-options div.grouping
{
    border: 1px solid #CCC;
    width: 100%;
}

div.popup.snopforecastvalidationValidation div.grid-options div.grouping>div:last-child
{
    margin-bottom:0.5vh
}

div.popup.snopforecastvalidationValidation div.grid-options div.otherOptions
{
    margin-top: 1em;
    width: 100%;
    border: 1px solid #CCC;
    padding: 1vh;
}

div.popup.snopforecastvalidationValidation div.grid-options div.otherOptions th
{
    padding-right:0.7vh;
}

div.popup.snopforecastvalidationValidation div.grid
{
    height:calc(100% - 4em);
    top: 3.5em;
    width:80%;
    left:19.5%;
    position:absolute;
}
div.popup.snopforecastvalidationValidation div.body.editingComment div.grid,
div.popup.snopforecastvalidationValidation.singleSubsidiary div.body div.grid
{
}



div.popup.snopforecastvalidationValidation div.kgcubed-grid div.cell.budget {border-left:1px solid black}
div.popup.snopforecastvalidationValidation.snoporderIntakesOrderIntake div.kgcubed-grid div.cell.budget
{border-left-color:#999}

div.popup.snopforecastvalidationValidation div.selectionInfo h1 {font-size: 140%; font-weight: bold; text-align: center}

div.popup.snopforecastvalidationValidation div.currentYear,
div.popup.snoporderIntakesOrderIntake div.cell.quarter
{background-color:#DDD}

div.popup.snoporderIntakesOrderIntake div.quarter.groupLevel10
{background-color:#CCC}

div.popup.snoporderIntakesOrderIntake div.quarter.groupLevel15
{background-color:black}

div.popup.snopforecastvalidationValidation div.currentYear,
div.popup.snoporderIntakesOrderIntake div.columnHeaderCell.quarter,
div.popup.snoporderIntakesOrderIntake div.groupHeaderCell.quarter
{background-color:#666; color:white}
div.popup.snoporderIntakesOrderIntake div.groupHeaderCell.quarter>div.headerCellColumnArea
{
    background-color:#AAA; color:black
}
div.popup.snoporderIntakesOrderIntake div.OrderIntakeCurrency
{
    width: 4em
}
div.popup.snoporderIntakesOrderIntake div.OrderIntakeWeeks
{
    width: 7em
}
div.popup.snoporderIntakesOrderIntake div.OrderIntakeCurrency,
div.popup.snoporderIntakesOrderIntake div.OrderIntakeWeeks
{float: left; margin-right: 1em;}

div.popup.snoporderIntakesOrderIntake div.OrderIntakeCurrency select,
div.popup.snoporderIntakesOrderIntake div.OrderIntakeWeeks select
{
    width: 100%;
}

div.popup.snoporderIntakesOrderIntake div.kgcubed-grid div.cell.unconfirmed
{
    color:#999;
}

div.snoporderIntakesOrderIntake div.kgcubed-grid div.toolbar div.button.save
{
    background-image:url('components/img/save-solid-black.png');
}

div.popup.snoporderIntakesOrderIntake div.body
div.SnopOrderIntakesCommentOrderIntakeForecastCommentComponent
{
    height:3.2em;
    width: calc(100% - 13.3em);
    float:left;
    border: 1px solid #999;
    margin-top: 1px;
    position: relative;
}

div.popup.snoporderIntakesOrderIntake div.body
div.SnopOrderIntakesCommentOrderIntakeForecastCommentComponent span
{
    display: inline-block;
    height: 100%;
    position: absolute;
    top:-2px;
    width: 100%;
}
div.popup.snoporderIntakesOrderIntake div.body.editingComment
div.SnopOrderIntakesCommentOrderIntakeForecastCommentComponent,
div.popup.snoporderIntakesOrderIntake.singleSubsidiary div.body
div.SnopOrderIntakesCommentOrderIntakeForecastCommentComponent
{
    height:18em
}

div.popup.snoporderIntakesOrderIntake div.body
div.SnopOrderIntakesCommentOrderIntakeForecastCommentComponent textarea
{
    height: 100%; width:100%; border:0;
    background-color: transparent;
    font-size: 85%;
}

div.popup.snoporderIntakesOrderIntake div.body.editingComment
div.SnopOrderIntakesCommentOrderIntakeForecastCommentComponent textarea,
div.popup.snoporderIntakesOrderIntake.singleSubsidiary div.body
div.SnopOrderIntakesCommentOrderIntakeForecastCommentComponent textarea
{
    font-size: 100%;
}

div.SnopOrderIntakesCommentOrderIntakeForecastCommentComponent div.saveComment
{
    position: absolute;
    width:4vh;
    height: 4vh;
    bottom: 0;
    right: 0;
    background-image: url(components/img/save-solid-black.png);
    background-size: contain;
    cursor: pointer
}
div.SnopOrderIntakesCommentOrderIntakeForecastCommentComponent div.saveComment:hover:before
{
    content: "save comment";
    position:absolute;
    left: -8em;
    top: 0.5vh;
    background-color: yellow;
    color:blue;
    font-weight: bold;
    font-style: italic;
    padding: 0.5vh;
    border-radius: 0.5vh;
}
div.SnopOrderIntakesCommentOrderIntakeForecastCommentComponent div.saveComment:hover
{
    background-color: yellow
}


div.popup.snopforecastvalidationValidation div.grid-options div.graph {cursor: pointer}

div.popup.snopforecastinternalProductQuantities div.grid-options>div.um,
div.popup.snopforecastinternalProductQuantities div.grid-options>div.rowTypeOptions
{
    border:1px solid #CCC;
    margin-top:0.5em
}
div.popup.snopforecastinternalProductQuantities div.grid-options>div.um label
{
    display:block; margin: 0.5em
}
div.popup.snopforecastinternalProductQuantities div.grid-options>div.um label>input
{
    margin-right:0.8em
}
div.popup.snopforecastinternalProductQuantities div.grid-options>div.rowTypeOptions>div:first-child>label
{
    margin-top:0.6em;
}

div.popup.snopforecastvalidationValidation div.graphComponent
{
    height:initial;
    margin-top:2em
}
div.popup.snopforecastexternalplanInvoicing div.xAxisTitle
{

    margin-top: -1.4em;
    text-align: center;
    font-weight: bold;
    border-top: 1px solid #BBB
}

div.popup.snopforecastexternalplanInvoicing div.selectionInfo
{
    overflow-y: auto;
    max-height: 40%
}

div.popup.snopforecastexternalplanInvoicing div.selectionInfo table {width:100%; margin-top: 1em}
div.popup.snopforecastexternalplanInvoicing div.selectionInfo th
{
    border-bottom: 1px solid #AAA
}

div.popup.snopforecastexternalplanInvoicing div.selectionInfo th,
div.popup.snopforecastexternalplanInvoicing div.selectionInfo td
{
    text-align: center; padding: 2px; width:33%
}

div.popup.snopforecastexternalplanInvoicing div.selectionInfo th:first-child,
div.popup.snopforecastexternalplanInvoicing div.selectionInfo td:first-child
{
    text-align: left; border-right: 1px solid #AAA;
}

div.popup.snopforecastexternalplanInvoicing div.selectionInfo th:last-child,
div.popup.snopforecastexternalplanInvoicing div.selectionInfo td:last-child
{
    text-align: right; border-left: 1px solid #AAA; padding:0; width:34%
}

div.popup.snopforecastexternalplanInvoicing div.selectionInfo td.commit:last-child
{
    background-color: #EEE; border: 1px solid black
}

div.popup.snopforecastexternalplanInvoicing.singleSubsidiary div.grouping {display: none}

div.popup.snopforecastexternalplanInvoicing div.kgcubed-grid div.toolbar:after {
    content:"* F/C = forecast";
    position: absolute;
    right:1vh;
    color:#ED3F64

}

div.popup.snopforecastexternalplanInvoicing .old
{
    color: #AAA;
}

div.cell.commentBelow
{

    background-image:url('img/commentBelow.png');
    background-size:contain;
    background-repeat: no-repeat no-repeat;
    background-position: left;
}

div.snopforecastexternalplangraphInvoicingGraph div.graph-container
{
    margin-top:2em
}

div.snopforecastsalesregionsCsoReport div.grid-options div.options
{
    border: 1px solid #CCC;
    margin-top: 7px; margin-bottom: 7px;
    margin-top: 0.7vh; margin-bottom: 0.7vh;
    padding: 1.5vh;
    padding:2%;
}

div.snopforecastsalesregionsCsoReport p.archive,
div.snopforecastinternalProductQuantities p.archive
{
    color:red
}

div.snopforecastsalesregionsCsoReport div.grid-options div.options>div
{
    float:right
}

div.snopforecastsalesregionsCsoReport div.grid-options div.options>div label
{
    margin-left:1.3em
}
/* ===================================================
    snoporderIntakesOrderIntake
   =================================================== */

div.popup.snopforecastvalidationValidation.snoporderIntakesOrderIntake div.grid-options
{
    display: none;
    width: 0%;
}

div.popup.snopforecastvalidationValidation.snoporderIntakesOrderIntake div.grid
{
    width:98.5%;
    left: 0.7%;
    height: calc(100% - 8em);
    top: 7.25em;
}

div.popup.snopforecastvalidationValidation.snoporderIntakesOrderIntake div.body.editingComment div.grid
{
    height: calc(100% - 23em);
    top:22em;
}


/* ============
   snop actuals
   ============ */

div.snopactualsActuals div.kgcubed-grid div.cell.quarter
{
    background-color:#F9F9F9;
    font-weight:bold
}

div.snopactualsActuals div.umOptions
{
    margin-top:1em; width: 100%; border:1px solid #CCC; padding: 10px; padding: 1vh;
}

div.snopactualsActuals div.umOptions>div { padding:2px; margin:0; height:1.6em }
div.snopactualsActuals div.umOptions>div>label>input { margin-left: 0.5em; margin-right: 0.7em }
div.snopactualsActuals div.umOptions select { margin-left:1em; font-size:90%; border:1px solid #999 }
div.popup.snopforecastvalidationValidation.snopactualsActuals div.grid-options { width: 13.5%; }
div.popup.snopforecastvalidationValidation.snopactualsActuals div.grid { width:85%; left:14.5%; }


/*  ============
    PN hierarchy 
    ============  */

div.SiteProductHierarchyProductHierarchy div.kgcubed-grid {
    width:100%;
    height:calc(100% - 6em);
    margin-top: 3em;
}


div.SiteProductHierarchyProductHierarchy.Window > div.body.loading > div.ComponentSearchBarSearchBar 
{
    visibility:hidden
}

/*  ===========
    Edit entity 
    ===========  */
div.entityEditEntity>table, div.entityEditEntity>div.error {width:94%; margin-left:3%; margin-top: 1.5em; margin-bottom: 3em; }
div.entityEditEntity>table td>input, div.entityEditEntity>table td>select {width:100%}
div.entityEditEntity>table th {text-align:left; height:3em}
div.entityEditEntity>div:not(.error) {margin-top:2em; margin-bottom: 1em}
div.entityEditEntity>div>div.btn {width: 6em; margin-left:3%; margin-right:3%}
div.entityEditEntity>div>div.btn-success {float:right}
div.entityEditEntity>div.error {border: 2px solid red; padding: 1vh; background-color: #F6F6F6; display:none}
div.entityEditEntity>div.error li {font-style: italic}
div.entityEditEntity>table tr.highlightError {background-color:yellow}

select.elementcontrolsselectSimpleSelect {padding:0.35em}



div.SnopPlanExcessWindowPlanExcessWindow.Window div.SnopPlanExcessGridPlanExcessGrid
{
    height: calc(100% - 3em);
    margin-top: 3em;
}


div.Window:not(.autoheight)>div.body
{
    height:calc(100% - 27px);
    height:calc(100% - 2.7vh);
}



div.Window.maximized {
    border-radius:0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow:none;
    border:0;
    width:100%;
    left:0;
    height:100%;
    top:0;
    position:absolute
}
div.Window.maximized>div { border-radius:0;border:0; }
div.Window.maximized div.ui-resizable-handle {display:none}




div.desktop.snop div.Window.loading div.body > div
{
    font-size:12vh;
    font-weight:bold;
    color: #DDD;
    text-align:center;
    position:absolute;
    top:calc(40% - 6vh);
    width:100%;
}

div.desktop.snop div.Window.loading div.titleBar > div.closeButton
{
    display:none
}

ul.radios li
{
    list-style:none
}

ul.radios li label > input:first-child
{
    margin-right:1em;
}

ul.radios li label > input:last-child
{
    margin-left:1em;
}


div.UtilLogJavascriptJavascriptExceptionLogger.debuggable
{
    background-color:#DDD;
    width:2vh;
    height:2vh;
    position:absolute;
    bottom:0;
    right:0
}


div.UtilLogJavascriptJavascriptExceptionLogger.debuggable.justClicked
{
    background-color:yellow;
    border: 1px solid black;
}


div.snopcycleadd p.unfrozen
{
    color:red;
    background-color:yellow; 
    padding: 1vh;
    text-align:center;
    font-weight:bold;
    border: 1px solid red;
}




/* temporary message, delete it later

div.desktop:after
{
    content:"system down due to implementation of new market segment structure";
    position:absolute;
    right:0;
    font-size: 300%;
}
div.desktop div.StatusImportWidgetImportStatusWidget, div.userLogin 
{
    display:none
}
 */