.custom-file-input {
    overflow       : hidden;
    position       : relative;
    border         : 1px solid #e1e1e1;
    display        : flex;
    align-items    : center;
    justify-content: space-between;
    height         : 60px;

    input[type="file"] {
        width   : 100%;
        height  : 100%;
        opacity : 0;
        position: absolute;
        top     : 0;
        left    : 0;
        z-index : 999;

        &:hover~.inputFileButton {
            cursor: pointer;
            color : customColor(secondary);

            .customIcon {
                color: customColor(secondary);
            }
        }
    }

    input[type="text"] {
        position   : absolute;
        width      : calc(100% - 120px);
        right      : 0;
        border     : none !important;
        padding    : 0 35px;
        font-family: 'GilroyMedium';
        font-size  : 11.09px;
        color      : rgba(23, 23, 23, 0.52);
    }

    .inputFileButton {
        display       : flex;
        flex-direction: column;
        color         : rgba(23, 23, 23, 0.52);
        align-items   : center;
        transition    : all .3s ease-in-out;
        width         : 120px;
        font-family   : 'GilroyBold';
        font-size     : 11.09px;
        height        : 45px;
        border-right  : 1px solid #e1e1e1;
        margin        : 0;
        border-radius : 0;

        .customIcon {
            transition: all .3s ease-in-out;
            color     : rgba(0, 0, 0, 0.37);
            font-size : 30px;
        }
    }

    .file-custom {
        font-family: 'GilroyBold';
        font-size  : 11.09px;
        color      : rgba(23, 23, 23, 0.52);
        display    : block;
        flex       : 1;
        padding    : 0 35px;
    }
}
@media screen and(max-width:768px) {
    .custom-file-input{
        margin:5px 0;
    }
}