/*
 * Author : Mahmoud Nbet
 * Email : mahmoud.nb@gmail.com
 * plugin name : MN-File Upload jQuery Plugin
 * version : 1.0
**/

@charset "utf-8";


.fieldControl{ max-width:90%; width:460px; position:absolute; top:58%; left:50%; transform: translate(-50%,-50%); -webkit-transform: translate(-50%,-50%);}

.customFile{background: #DEDEDE; position: relative;font-size: 12px;  line-height: 33px; overflow: hidden;}
.customFile.radius{ border-radius:12px; }
.customFile:before{ content: attr(data-controlMsg);background-color: #285e7b; color: #FFF; padding: 2px 12px 0; float: left;  width: 180px;  text-align: center;  display: block; box-sizing: border-box; text-overflow: ellipsis;  white-space: nowrap;  overflow: hidden; transition: all 0.4s ease;}
.customFile:hover:before{ color: #41a1d4; background-color: #1b2c35; }
.customFile input{position: absolute;top: 0; left: 0;right: 0;z-index: 88888;width: 100%;height: 35px;cursor: pointer; opacity: 0!important; }
.customFile .selectedFile{ display: block; padding: 2px 10px 0; margin-left: 180px; box-sizing: border-box; text-overflow: ellipsis;  white-space: nowrap;  overflow: hidden; transform: translateX(0%); transition: all 0.4s ease 0.6s;}
/* transition TODO */
.customFile .selectedFile.inProgress{ transform: translateX(100%); transition: all 0.4s ease 0.6s;}

/* Right Btn */
.customFile[data-display=right]:before{float:right;}
.customFile[data-display=right] .selectedFile{margin: 0 180px 0 0;}

/* Vertical */
.customFile[data-display=vertical]:before{float:none; width:auto;}
.customFile[data-display=vertical] .selectedFile{margin: 0;}

/* Button */
.customFile[data-display=button]:before{float:none; width:auto;}
.customFile[data-display=button] .selectedFile{display:none;}