.FACES-POPUP-DIALOG{
    display			: flex;
    flex-direction		: row;
    flex-wrap			: nowrap;
    justify-content		: center;
    align-content		: center;
    align-items			: center;
    width			: 100vw;
    height			: 100vh;
    overflow			: auto;    
    background-color		: rgba(0, 0, 0, .6);
    position			: fixed;
    left			: 0px;
    top				: 0px;
    padding			: 1%;
    border			: 5px solid transparent;
    margin			: 0px;
    z-index			: 9999999;
    cursor                      : zoom-out;
}
.FACES-POPUP-DIALOG-DOC-BODY-NOSCROLL{
    /*overflow: hidden;*/
}
.FACES-POPUP-DIALOG-HIDDEN{
    /*display                 : none;*/
    overflow                : hidden;
    border-width            : 0px;
    padding                 : 0px;
    height                  : 0px;
    width                   : 0px;
    top                     : 50vh;
    left                    : 50vw;
    opacity                 : 0;
    background-color        : rgba(255, 255, 255, .6);
    transition-property     : height, width ,   top , left  , opacity   , border-width  , padding   , background-color;
    transition-duration     : 0.4s  , 0.4s  ,   0.4s, 0.4s  , 1.6s      , 0.6s          , 0.6s      , 0.6s;
    transition-delay        : 0.4s  , 0.4s  ,   0.4s, 0.4s  , 0s        , 1s            , 1s        , 0s;
    
    
}
.FACES-POPUP-DIALOG-HIDDEN .FACES-POPUP-DIALOG-BODY{
    display                 : none;    
}
.FACES-POPUP-DIALOG .FACES-POPUP-DIALOG-BODY{
    max-height			: 100%;
    flex			: 0 1 auto;
    min-width			: 240px;
    overflow			: auto;
    display			: flex;
    flex-direction		: column;
    flex-wrap			: nowrap;
    justify-content		: flex-start;
    align-content		: center;
    align-items			: stretch;
    background			: transparent;
    padding			: 0px;
    cursor                      : initial;
    position                    : relative;
    
}

.FACES-POPUP-DIALOG.BODY-HEIGHT-MAXIMIZED .FACES-POPUP-DIALOG-BODY{
    height			: 100%;
    max-height			: 100%;
}
.FACES-POPUP-DIALOG-BODY .FACES-POPUP-DIALOG-HEADER{
    background			: #FFFFFF;
    flex			: 1 1 100%;
    width                       : inherit;
    display			: flex;
    flex-direction		: row;
    flex-wrap			: nowrap;
    justify-content		: space-between;
    align-content		: center;
    align-items			: stretch;
    border-bottom               : 1px solid #CCCCCC; 
    color			: #0e647d;
    font-weight			: normal;
    font-size			: 16px;
    padding			: 0px 0px 5px 5px;
    position			: relative;
    min-height			: 44px;
    overflow                    : hidden;
}


.FACES-POPUP-DIALOG-BODY .FACES-POPUP-DIALOG-HEADER-TEXT{    
    flex			: 1 1 auto;
    display			: flex;
    flex-direction		: row;
    flex-wrap			: wrap;
    justify-content		: flex-start;
    align-content		: center;
    align-items			: center;
    border-bottom		: 0px solid #AAAAAA;
    color			: #0e647d;
    font-weight			: normal;
    font-size			: 16px;
    padding			: 5px 5px 5px 5px;
    
}
.FACES-POPUP-DIALOG-BODY .FACES-POPUP-DIALOG-HEADER .FACES-POPUP-DIALOG-CLOSE-BUTTON{	
    position			: relative;
    flex			: 1 1 34px;
    width			: 34px;
    max-width                   : 34px;
    min-height			: 34px;
    
    cursor			: pointer;
    display			: flex;
    flex-direction		: row;
    flex-wrap			: wrap;
    justify-content		: center;
    align-content		: center;
    align-items			: center;
    color                       : #AA0000;
    font-weight                 : 900;
    font-size                   : 32px;
}


.FACES-POPUP-DIALOG.HEADLESS .FACES-POPUP-DIALOG-BODY .FACES-POPUP-DIALOG-CLOSE-BUTTON{	
    flex			: 1 1 34px;
    width			: 34px;
    max-width                   : 34px;
    min-height			: 34px;
    height                      : 34px;
    cursor			: pointer;
    display			: flex;
    flex-direction		: row;
    flex-wrap			: wrap;
    justify-content		: center;
    align-content		: center;
    align-items			: center;
    color                       : #AA0000;
    font-weight                 : 900;
    font-size                   : 32px;
    position                    : absolute;
    right                       : 0px;
    top                         : 0px;
    background                  : #FFFFFF;
    
    z-index: 100;
}
.FACES-POPUP-DIALOG.HEADLESS .FACES-POPUP-DIALOG-BODY .FACES-POPUP-DIALOG-CLOSE-BUTTON{	
    flex			: 1 1 34px;
    width			: 34px;
    max-width                   : 34px;
    min-height			: 34px;
    height                      : 34px;
    cursor			: pointer;
    display			: flex;
    flex-direction		: row;
    flex-wrap			: wrap;
    justify-content		: center;
    align-content		: center;
    align-items			: center;
    color                       : #AA0000;
    font-weight                 : 900;
    font-size                   : 32px;
    position                    : absolute;
    right                       : 0px;
    top                         : 0px;
    background                  : #FFFFFF;
    
    z-index: 100;
}
.FACES-POPUP-DIALOG-BODY .FACES-POPUP-DIALOG-CONTENT-UI {
    width			: auto;
    flex			: 1 1 auto;
    background			: #FFFFFF;
    padding			: 0.6vw 0.6vw 0.6vw 0.6vw;
    overflow			: auto;
    overflow-x                  : hidden;
    display			: flex;
    flex-direction		: row;
    flex-wrap			: wrap;
    justify-content		: flex-start;
    align-content		: flex-start;
    align-items			: flex-start;
}

.FACES-POPUP-DIALOG-BODY.HEADLESS .FACES-POPUP-DIALOG-CONTENT-UI {
    padding			: 0vw 0vw 0vw 0vw;
}

.FACES-POPUP-DIALOG-BODY .FACES-POPUP-DIALOG-CONTENT-UI .FACES-POPUP-DIALOG-VIEWPORT{
    width			: auto;
    flex			: 1 1 100%;
    background			: #FFFFFF;
    padding			: 0px 10px 10px 10px;
    display			: flex;
    flex-direction		: row;
    flex-wrap			: wrap;
    justify-content		: flex-start;
    align-content		: flex-start;
    align-items			: flex-start;
    cursor                      : initial;
}