/*  ----------------------> */
/*  --   MISC Croppie   --> */
/*  ----------------------> */

@media (max-width: 575.98px) {
  .c-sm-width-100 {
	max-width: 100% !important;  
  }
  .container-pl-0-sm {
		padding-left: .45em !important;
	}
	.div-w-sm-100p {
		width: 100% !important;
	}

}

@media (min-width:576px) and (max-width:767.98px) {
    .c-md-width-40 {
    max-width: 40% !important;  
  }
}

@media (min-width: 768px) {
  .c-lg-width-40 {
	max-width: 40% !important;  
  }
}

@media (min-width: 576px) {
  .div-w-md-200  {
	width: 200px !important;  
  }
}


.initiallyHidden {
	display: none;
}

.hide{display:none!important}

/*  ------------------------> */
/*  --   logo Croppie   --> */
/*  ------------------------> */

.upload-logo .upload-logo-wrap,
.upload-logo.ready .upload-msg {
    display: none;
}
.upload-logo.ready .upload-logo-wrap {
    display: block;
}

.upload-logo .LGO-preview {
	display: none;
}

.upload-logo.ready .LGO-preview {
    display: block;   
	margin: 0 auto;
	align-items: center;
}

.upload-logo-wrap {
    /* width: 100%; */
	max-width: 240px;
    max-height: 150px;
    margin: 0 auto;
}

.upload-logo .container {
	width: 100%; 
    margin-left: 0px;
    padding-left: 0px; 
}

.LGO-pic-img {
	border: solid 4px #e2e2e2;
}

.LGO-pic-img:hover {
	border: solid 4px #e2e2e2;
}


.LGO-pic-mini-envelope {
	position: absolute; 
	margin-top: 80px; 
	margin-left: 115px;
}

.LGO-pic-mini-envelope-mobile {
	position: absolute; 
	margin-top: 70px; 
	margin-left: 40px;
}

.LGO-pic-mini {
/*	border: solid 0px #e2e2e2;  */
	border: solid 3px rgba(256, 256, 256, 0.7);
}

.LGO-pic-mini:hover {
	border: solid 0px #ffffff;
}

.LGO-pic-mini-overlay {
	border: solid 3px transparent;
	opacity: 0.1 ;
	width: 55px;
	height: 55px;
	margin-top: -3px;
	margin-left: -3px;		
}

.LGO-pic-mini-overlay:hover {
	opacity: 0.6;
	border: solid 3px transparent;
	margin-top: 0px;
	margin-left: 0px;		
}

.LGO-pic-mini-overlay-rotate {
	border: solid 3px transparent;
	opacity: 0.7;
	width: 55px;
	height: 55px;
	margin-top: -3px;
	margin-left: -3px;	
}




/*  ------------------------> */
/*  --   Croppie General  --> */
/*  ------------------------> */

.upload-msg {
    text-align: center;
    padding: 40px;
    font-size: 20px;
    color: #aaa;
    max-width: 240px;
    margin: 50px 0;	
    border: 1px solid #aaa;
}
#cropped-result {
  margin-top:25px;
}



/*  -------------------------------> */
/*  --   Main Vertical Croppie   --> */
/*  -------------------------------> */

.upload-vert .upload-vert-wrap,
.upload-vert.ready .upload-msg {
    display: none;
}
.upload-vert.ready .upload-vert-wrap {
    display: block;
}

.upload-vert .VERT-preview {
	display: none;
}

.upload-vert.ready .VERT-preview {
    display: block;   
	margin: 0 auto;
	align-items: center;
}

.upload-vert-wrap {
    /* width: 100%; */
	width: 300px;
    height: 150px;
    margin: 0 auto;
}

.upload-vert .container {
	width: 100%; 
/*    margin-left: 0px;
    padding-left: 0px; */
}

.VERT-pic-img {
	border: solid 4px #e2e2e2;	
}

.VERT-pic-img:hover {
	border: solid 4px #e2e2e2;
}


.VERT-pic-mini-envelope {
	position: absolute; 
	margin-top: 355px; 
	margin-left: 165px;
}

.VERT-pic-mini-envelope-mobile {
	position: absolute; 
	margin-top: 115px; 
	margin-left: 10px;
}

.VERT-pic-mini {
	border: solid 3px rgba(256, 256, 256, 0.7);
}

.VERT-pic-mini:hover {
	border: solid 0px #ffffff;
}

.VERT-pic-mini-overlay {
	border: solid 3px transparent;
	opacity: 0.1 ;
	width: 55px;
	height: 55px;
	margin-top: -3px;
	margin-left: -3px;
}

.VERT-pic-mini-overlay:hover {
	opacity: 0.6;
	border: solid 3px transparent;
	margin-top: 0px;
	margin-left: 0px;	
}

.VERT-pic-mini-overlay-rotate {
	border: solid 3px transparent;
	opacity: 0.7;
	width: 55px;
	height: 55px;
	margin-top: -3px;
	margin-left: -3px;	
}