diff --git a/public/css/app.css b/public/css/app.css
index 2aaad375c..b910f65c8 100644
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -739,4 +739,9 @@ input[type="number"] {
 
 .link .content-wrapper, .link  .right-side, .link  .main-footer {
     margin-left: inherit;
+}
+
+.col-md-6.input-group-invoice-text {
+    padding-left: 0;
+    padding-right: 0;
 }
\ No newline at end of file
diff --git a/public/js/app.js b/public/js/app.js
index 5a05259d0..f439f68c0 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -197,6 +197,8 @@ $(document).ready(function () {
 
         return true;
     });
+
+    $('.input-group-invoice-text select').select2();
 });
 
 function confirmDelete(form_id, title, message, button_cancel, button_delete) {
@@ -292,6 +294,22 @@ $(document).on('change', '.input-group-recurring #recurring_frequency', function
     }
 });
 
+$(document).on('change', '.input-group-invoice-text select', function () {
+    var invoice_text_custom = $(this).parent().parent().parent().find('input');
+
+    if ($(this).val() == 'custom') {
+        $(this).parent().parent().removeClass('col-md-12').addClass('col-md-6');
+
+        invoice_text_custom.parent().removeClass('hidden');
+
+        $(this).select2();
+    } else {
+        $(this).parent().parent().removeClass('col-md-6').addClass('col-md-12');
+
+        invoice_text_custom.parent().addClass('hidden');
+    }
+});
+
 function convertDateFormat(date, split_character) {
     var result = [];
     var formats = {
diff --git a/resources/views/partials/form/invoice_text.blade.php b/resources/views/partials/form/invoice_text.blade.php
index a479d8bea..d9a2d5af4 100644
--- a/resources/views/partials/form/invoice_text.blade.php
+++ b/resources/views/partials/form/invoice_text.blade.php
@@ -1,7 +1,7 @@
 @stack($name . '_input_start')
 
-<div class="{{ $col }} input-group-invoice_text">
-    <div class="form-group col-sm-10 {{ isset($attributes['required']) ? 'required' : '' }} {{ $errors->has($name) ? 'has-error' : ''}}">
+<div class="{{ $col }} input-group-invoice-text">
+    <div class="form-group col-md-12 {{ isset($attributes['required']) ? 'required' : '' }} {{ $errors->has($name) ? 'has-error' : ''}}">
         {!! Form::label($name, $text, ['class' => 'control-label']) !!}
         <div class="input-group">
             <div class="input-group-addon"><i class="fa fa-{{ $icon }}"></i></div>
@@ -10,7 +10,7 @@
         {!! $errors->first($name, '<p class="help-block">:message</p>') !!}
     </div>
 
-    <div class="form-group col-sm-2 {{ $errors->has('invoice_text_text') ? 'has-error' : '' }}">
+    <div class="form-group col-md-6 hidden {{ $errors->has('invoice_text_text') ? 'has-error' : '' }}">
         {!! Form::label($input_name, trans('settings.invoice.custom'), ['class' => 'control-label']) !!}
         {!! Form::text($input_name, $input_value, ['class' => 'form-control']) !!}
         {!! $errors->first($input_name, '<p class="help-block">:message</p>') !!}