/* FRM.LAYOUT | 99-MOD-CURRENCY.CSS | COPYRIGHT REFLECTLAB.COM */
/* DEFAULT 202002.15 [0210.RZE]*/

.control-drop-container {position: relative; width: 153px; height: 76px; margin-top: 5px; opacity: 1; background-color: rgba(0,0,0,0.025); border: 2px solid transparent; line-height: 72px; text-align: center; color: lightgrey; cursor: default;}
.control-drop-container.js_hover {background-color: rgba(0,0,0,0.08); border: 2px solid grey; color: grey;}
.control-drop-container .control-drop-file {position: absolute; top: 0; right: 0; bottom: 0; left: 0; opacity: 0;}

.control-image-container {margin-top: 5px;}
.control-image-container.js_filled {min-height: 173px;}
.page-main .form-field.field-control-comment {margin-left: 12px;}
.control-image-thumb, .control-image-container .ui-sortable-placeholder {width: 153px; height: 153px;}
.control-image-thumb, .control-image-container .ui-sortable-placeholder {position: relative; float: left; margin: 0 20px 20px 0; background-color: rgba(0,0,0,0.04); background-size: contain; background-position: center center; background-repeat: no-repeat;}
.control-image-container .control-image-preview-loading {top: calc(50% - 40px); left: calc(50% - 20px);}
.control-image-container .control-image-delete, .control-image-container .control-image-edit, .control-image-container .control-image-magnify, .control-image-container .control-image-check, .control-image-container .control-image-busy
{position: absolute; right: 2px; bottom: 2px; width: 28px; line-height: 29px; font-size: 1.1rem; cursor: pointer; background-color: rgba(255,255,255,0.7); opacity: 0; transition: opacity 0.6s;}
.control-image-container.js_disabled .control-image-delete, .control-image-container.js_disabled .control-image-edit {display: none;}
.control-image-container .control-image-busy {right: auto; bottom: auto; top: 2px; left: 2px; opacity: 1;}
.control-image-container .control-image-check, .control-image-container:not(.js_disabled) .control-image-magnify {right: 32px;}
.control-image-container .control-image-check {color: rgba(0,0,0,0.4);}
.control-image-container .control-image-thumb.js_selected .control-image-check {color: rgba(0,112,60,1.00);/*GRN*/}

/*.control-image-container .control-image-edit {right: 27px;}*/
/*.control-image-container .control-image-magnify {right: 52px;}*/
.js_fieldControl:hover .control-image-thumb:not(.js_busy) .control-image-check, .js_fieldControl:hover .control-image-thumb:not(.js_busy) .control-image-magnify, .js_fieldControl:hover .control-image-thumb:not(.js_busy) .control-image-edit, .js_fieldControl:hover .control-image-thumb:not(.js_busy) .control-image-delete {opacity: 1;}

.image-overlay {position: fixed; top: 0; right: 0; left: 0; bottom: 0; z-index: 300; background-color: rgba(45,42,38,0.70);/*BLCK*/}
.image-overlay .image-overlay-icon {font-size: 1.3rem;}
.image-overlay-loading {position: absolute; top: 10px; left: 10px; padding: 5px; background-color: rgba(255,255,255,0.70);font-size: 1.15rem;}
.image-overlay-close, .image-overlay-prev, .image-overlay-next {position: absolute; z-index: 220;}
.image-overlay-button {background-color: rgba(255,255,255,0.70); cursor: pointer; padding: 10px;}
.image-overlay-button:hover {background-color: rgba(255,255,255,1.00);}
.image-overlay-button.js_hidden {cursor: default; opacity: 0;}
.image-overlay-close {top: 0; right: 0; padding: 20px 20px 50px 50px;}
.image-overlay-prev {top: 200px; left: 0; padding: 50px 50px 50px 20px;}
.image-overlay-next {top: 200px; right: 0; padding: 50px 20px 50px 50px;}

.image-overlay-image {position: fixed; z-index: 199; background-size: contain; background-position: center center; background-repeat: no-repeat;}

/*GALLERY*/

.image-overlay-top {position: absolute; z-index: 220;}
.image-overlay-top {top: 0; right: 0; left: 0; padding: 20px 20px 0 20px;}

.image-overlay-search {margin-top: 5px; margin-right: 20px;}
.gallery-container {position: absolute; top: 80px; right: 20px; bottom: 0; left: 20px; overflow-x: hidden; overflow-y: scroll;}
.gallery-container .gallery-item {float: left; width: 220px; height: 220px; padding-right: 16px; padding-bottom: 16px;}
.gallery-container .gallery-item .gallery-image {width: 100%; height: 100%; background-color: rgba(255,255,255,0.6);}