.cropper-container {
position: relative;
overflow: hidden;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-tap-highlight-color: transparent;
-webkit-touch-callout: none;
}
.cropper-container img {
width: 100%;
height: 100%;
min-width: 0 !important;
min-height: 0 !important;
max-width: none !important;
max-height: none !important;
}
.cropper-modal,
.cropper-canvas {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.cropper-canvas {
background-color: #fff;
opacity: 0;
filter: alpha(opacity=0);
}
.cropper-modal {
background-color: #000;
opacity: .5;
filter: alpha(opacity=50);
}
.cropper-dragger {
position: absolute;
top: 10%;
left: 10%;
width: 80%;
height: 80%;
}
.cropper-viewer {
display: block;
width: 100%;
height: 100%;
overflow: hidden;
outline-width: 1px;
outline-style: solid;
outline-color: #69f;
outline-color: rgba(51, 102, 255, .75);
}
.cropper-dashed {
position: absolute;
display: block;
border: 0 dashed #fff;
opacity: .5;
filter: alpha(opacity=50);
}
.cropper-dashed.dashed-h {
top: 33.3%;
left: 0;
width: 100%;
height: 33.3%;
border-top-width: 1px;
border-bottom-width: 1px;
}
.cropper-dashed.dashed-v {
top: 0;
left: 33.3%;
width: 33.3%;
height: 100%;
border-right-width: 1px;
border-left-width: 1px;
}
.cropper-face,
.cropper-line,
.cropper-point {
position: absolute;
display: block;
width: 100%;
height: 100%;
opacity: .1;
filter: alpha(opacity=10);
}
.cropper-face {
top: 0;
left: 0;
cursor: move;
background-color: #fff;
}
.cropper-line {
background-color: #69f;
}
.cropper-line.line-e {
top: 0;
right: -3px;
width: 5px;
cursor: e-resize;
}
.cropper-line.line-n {
top: -3px;
left: 0;
height: 5px;
cursor: n-resize;
}
.cropper-line.line-w {
top: 0;
left: -3px;
width: 5px;
cursor: w-resize;
}
.cropper-line.line-s {
bottom: -3px;
left: 0;
height: 5px;
cursor: s-resize;
}
.cropper-point {
width: 5px;
height: 5px;
background-color: #69f;
opacity: .75;
filter: alpha(opacity=75);
}
.cropper-point.point-e {
top: 50%;
right: -3px;
margin-top: -3px;
cursor: e-resize;
}
.cropper-point.point-n {
top: -3px;
left: 50%;
margin-left: -3px;
cursor: n-resize;
}
.cropper-point.point-w {
top: 50%;
left: -3px;
margin-top: -3px;
cursor: w-resize;
}
.cropper-point.point-s {
bottom: -3px;
left: 50%;
margin-left: -3px;
cursor: s-resize;
}
.cropper-point.point-ne {
top: -3px;
right: -3px;
cursor: ne-resize;
}
.cropper-point.point-nw {
top: -3px;
left: -3px;
cursor: nw-resize;
}
.cropper-point.point-sw {
bottom: -3px;
left: -3px;
cursor: sw-resize;
}
.cropper-point.point-se {
right: -3px;
bottom: -3px;
width: 20px;
height: 20px;
cursor: se-resize;
opacity: 1;
filter: alpha(opacity=100);
}
.cropper-point.point-se:before {
position: absolute;
right: -50%;
bottom: -50%;
display: block;
width: 200%;
height: 200%;
content: " ";
background-color: #69f;
opacity: 0;
filter: alpha(opacity=0);
}
@media (min-width: 768px) {
.cropper-point.point-se {
width: 15px;
height: 15px;
}
}
@media (min-width: 992px) {
.cropper-point.point-se {
width: 10px;
height: 10px;
}
}
@media (min-width: 1200px) {
.cropper-point.point-se {
width: 5px;
height: 5px;
opacity: .75;
filter: alpha(opacity=75);
}
} .cropper-hidden {
display: none !important;
}
.cropper-invisible {
position: fixed;
top: 0;
left: 0;
z-index: -1;
width: auto !important;
max-width: none !important;
height: auto !important;
max-height: none !important;
opacity: 0;
filter: alpha(opacity=0);
}
.cropper-move {
cursor: move;
}
.cropper-crop {
cursor: crosshair;
}
.cropper-disabled .cropper-canvas,
.cropper-disabled .cropper-face,
.cropper-disabled .cropper-line,
.cropper-disabled .cropper-point {
cursor: not-allowed;
}.um-popup-overlay {
background: rgba(0,0,0, 0.7);
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 1999992;
}
.um-popup * {
-webkit-font-smoothing: antialiased !important;
-moz-osx-font-smoothing: grayscale !important;
}
.um-popup {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
position: fixed;
left: 50%;
top: 10%;
margin-left: -250px;
width: 500px;
background: #fff;
box-shadow: 0 1px 3px #111;
z-index: 1999993;
box-sizing: border-box;
overflow: auto;
color: #888;
padding: 0 !important;
-webkit-font-smoothing: antialiased !important;
-moz-osx-font-smoothing: grayscale !important;
}
.um-popup.loading {
background: #fff url(/wp-content/plugins/ultimate-member/assets/img/loading.gif) no-repeat center;
min-height: 100px;
}
.um-popup a {
outline: none !important;
} .um-modal-overlay {
background: rgba(0,0,0, 0.85);
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
z-index: 999999;
} .um-modal * {
-webkit-font-smoothing: antialiased !important;
-moz-osx-font-smoothing: grayscale !important;
}
.um-modal-hidden-content {
display: none;
}
.um-modal-close {
display: block;
position: fixed;
right: 0;
top: 0;
font-size: 24px;
text-decoration: none !important;
color: #fff !important;
padding: 0 10px;
}
.um-modal {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
position: fixed;
left: 50%;
display: none;
z-index: 1999993;
box-sizing: border-box;
bottom: -50px;
}
.um-modal.normal {width: 500px;margin-left: -250px;}
.um-modal.large {width: 730px;margin-left: -365px;}
.um-modal.small {width: 400px;margin-left: -200px;}
.um-modal-body {
min-height: 3px;
padding: 20px;
box-sizing: border-box;
width: 100%;
background: #fff;
-moz-border-radius: 0 0 3px 3px;
-webkit-border-radius: 0 0 3px 3px;
border-radius: 0 0 3px 3px;
}
.um-modal-body.photo {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1), 0px 0px 0px 1px rgba(255, 255, 255, 0.12) inset;
background: #888;
padding: 0;
}
.um-modal-body.photo img {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
display: block;
overflow: hidden;
opacity: 0;
}
.um-modal.loading .um-modal-body {
background: #fff url(/wp-content/plugins/ultimate-member/assets/img/loading.gif) no-repeat center;
min-height: 150px;
}
.um-modal div.um {
margin-bottom: 20px !important;
}
.um-modal-header {
-moz-border-radius: 3px 3px 0 0;
-webkit-border-radius: 3px 3px 0 0;
border-radius: 3px 3px 0 0;
height: 44px;
line-height: 44px;
color: #fff;
padding: 0 20px;
box-sizing: border-box;
font-size: 17px;
}
.um-modal-footer {
margin-top: 20px;
}
.um-modal-left {
float: left;
}
.um-modal-right {
float: right;
}
.um-modal-btn.disabled,
.um-modal-btn.disabled:hover {
opacity: 0.5;
cursor: default !important;
}
.um-modal-btn {
cursor: pointer !important;
line-height: 34px !important;
height: 34px;
display: inline-block;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
padding: 0 20px;
text-align: center;
color: #fff;
vertical-align: middle;
font-size: 14px;
box-sizing: border-box;
transition: 0.2s;
text-decoration: none !important;
}
a.um-modal-btn:visited {
color: #fff;
}
.um-modal-btn:hover {
background: #44b0ec;
color: #fff;
}
.um-modal-btn.alt {
color: #666;
background: #eee;
}
.um-modal-btn.alt:hover {
background: #e5e5e5;
}
.um-modal .um-single-image-preview.crop img{
float:left;
}