.xpu-enter {
    /*background-color: #d8d8d8;*/
}

.xpu-message {
    position: fixed;
    top:50px; left:0px; right:0px;
    padding: 10px 20px;
    background-color: rgba(45, 137, 189, 0.9);
    color: #ffffff;
    margin: auto;
    text-align: center;
    z-index: 2000;
}

.xpu-message-error {
    background-color: rgba(202, 0, 0, 0.8) !important;
}

/* Simple image edit */
.xpuedt-image-edit {
    position: fixed;
    top: 0px; left: 0px;
    background-color: rgba(0, 0, 0, 0.8);
    width: 100%;
    height: 100%;    
    z-index: 999999;
    overflow: hidden;
    text-align: center;
    vertical-align: middle;
    margin: auto;
    font-family: helvetica, sans-serif;
    font-size: 12px;
}

.xpuedt-settings {
    position: relative;
    background-color: #181818;
    padding: 10px;
    color: #ffffff;
}

.xpuedt-settings input[type='text'] {
    width: 35px;
    padding: 8px 6px;
    border: #484848 1px solid;
    border-radius: 3px;
    background-color: #282828;
    color: #ffffff;
    text-align: center;
}

.xpuedt-settings input[type='checkbox'] {
    vertical-align: middle;
}

.xpuedt-button {
    padding: 8px 6px;
    border-radius: 3px;
    text-decoration: none;
    margin-left: 5px;
    text-transform: uppercase;
    cursor: pointer;
    /*background-color: #999999;
    border: #333333 1px solid;*/
    background-color: #32a3a7;
    border: #78c7ca 1px solid;
    color: #ffffff;
    
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    transition: all 0.4s;
    -o-transition: all 0.4s;
}

.xpuedt-button:hover {
    background-color: #4dccd0;
    border: #7ddcdf 1px solid;
    color: #ffffff;
}

.xpuedt-button-inactive {
    background-color: #666666;
    border: #888888 1px solid;
}

.xpuedt-crop-resize {
}

.xpuedt-crop-props {
}

.xpuedt-panel {
    width: 100%;
    height: 100%;
    overflow: auto;
    box-sizing: border-box;
    position:relative;
    text-align:center;
}

.xpuedt-canvas {
    position: absolute;
    left:0px; right: 0px;
    overflow: hidden;
    margin: auto;
}

.xpuedt-image-info {
    position: absolute;
    top: 5px; right: 5px;
    background-color: rgba(0,0,0,0.8);
    color: #ffffff;
    padding: 5px;
}

.xpuedt-crop-rect {
    position: absolute;
    border: #32a3a7 1px dotted;
    background-color: rgba(220, 220, 220, 0.5);
    z-index: 999999;
    box-sizing: border-box;
}

.xpuedt-crop-resize {
    position: absolute;
    width: 10px; height: 10px;
    right: 0px; bottom: 0px;
    background-color: rgba(0, 0, 0, 0.5);
}

.xpuedt-message {
    position: fixed;
    top:0px; left:0px; right:0px;
    padding: 18px 20px;
    background-color: rgba(45, 137, 189, 0.9);
    color: #ffffff;
    margin: auto;
    text-align: center;
    font-size: 1.2em;
    z-index: 2000;
}

.xpuedt-message-error {
    background-color: rgba(202, 0, 0, 0.8) !important;
}

.xpuedt-progress-overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0px; left: 0px;
    background-image: url(../images/ajax-black.gif);
    background-repeat: no-repeat;
    background-position: center center;
    background-color: rgba(0, 0, 0, 0.2);
}

.xpuedt-filters {
    padding: 10px;
    position: fixed; 
    text-align:left;
    z-index: 10000;
    background-color: rgba(0, 0, 0, 0.2);
	height: 100%;
}

.xpuedt-filters ul {       
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}

.xpuedt-filters a {
    display: block;
    padding: 2px 15px 2px 10px;
    cursor: pointer;
    color: #ffffff;
    font-size: 13px;
}

.xpuedt-filters a:hover {
    text-decoration: underline;
}

.xpuedt-filters a.xpuedt-filter-selected {    
    text-decoration: underline;
}