diff --git a/cravat/websubmit/input-examples/hgvs.hg38.txt b/cravat/websubmit/input-examples/hgvs.hg38.txt
new file mode 100644
index 00000000..ff057be7
--- /dev/null
+++ b/cravat/websubmit/input-examples/hgvs.hg38.txt
@@ -0,0 +1,9 @@
+NM_000492.4:c.2046dup
+NM_007262.5:c.471_473del
+NM_004333.6:c.2128-10_2128-9insC
+NC_000001.11:g.7965348G>T
+NM_007294.4:c.4357+2T>A
+NM_000527.5:c.760C>T
+NM_000422.3:c.319G>A
+ENST00000231790.8:c.1A>T
+ENST00000618231.3:c.9G>C
\ No newline at end of file
diff --git a/cravat/websubmit/nocache/index.html b/cravat/websubmit/nocache/index.html
index 6b3267fb..a372522e 100644
--- a/cravat/websubmit/nocache/index.html
+++ b/cravat/websubmit/nocache/index.html
@@ -72,57 +72,48 @@
     <div id='submitcontentdiv'>
         <div id="submit-form">
             <div id='submit-variant-div' class='container'>
+                <div class='divbanner'></div>
                 <span class='divtitle'>Variants</span>
-                <table>
-                    <tr>
-                        <td>
+                <div class="flexcol">
+                    <label for="assembly-select" class="input-label">Genome:</label>
                             <div id='assembly-select-div'>
-                                Genome:
                                 <select id="assembly-select">
                                     <option value="hg38">hg38/GRCh38</option>
                                     <option value="hg19" selected=true>hg19/GRCh37</option>
                                     <option value="hg18">hg18/GRCh36</option>
                                 </select>
                             </div>
-                        </td>
-                    </tr>
-                    <tr>
-                        <td valign='top' class='variant-input-border-bottom' title="Upload file(s). Select multiple files using ctrl and shift keys">
-                                <br />
-                            <input type="file" name="input-file" id="input-file" multiple/>
-                            <label for="input-file">Add input files</label>
-                            <button id='clear_inputfilelist_button' class='butn' style='display: none;'>Clear file(s)</button>
+                        <span class='variant-input-border-bottom' title="Upload file(s). Select multiple files using ctrl and shift keys">
+                            <div class="flexrow">
+                                <input type="file" name="input-file" id="input-file" multiple/>
+                                <label for="input-file">Add input files</label>
+                                <button id='clear_inputfilelist_button' class='butn' style='display: none;'>Clear file(s)</button>
+                            </div>
                             <div id="mult-inputs-message" style="display: none; margin-top: 4px;">
                                 <div id="mult-inputs-list"></div>
                             </div>
-                        </td>
-                    </tr>
-                    <tr>
-                        <td valign='top' class='variant-input-border-bottom' style='text-align: left;'>
-                            <br />
-                            <div style='text-align: left;'>
-                                <textarea rows="3" id="input-text" style='' placeholder="Enter variants in a supported input format such as VCF or TSV, or type a list of the paths to input files in the server."></textarea>
+                        </span>
+                            <div class='or input-label'>OR</div>
+                            <div>
+                                <textarea rows="3" id="input-text" placeholder="Enter variants in a supported input format such as VCF or TSV, or type a list of the paths to input files in the server."></textarea>
                             </div>
                             <select id='submit-input-format-select' disabled style='display: none;'>
                                 <option value=''>Detect</option>
                             </select>
-                            <span style='font-size: 13px;'>Example:</span>
-                            <button value="vcf" class='butn input-example-button'>VCF</button>
-                            <button value="cravat" class='butn input-example-button'>TSV</button>
-                            <div class='or'>OR</div>
-                        </td>
-                    </tr>
-                    <tr>
-                        <td>
-                            <div style='margin-top: 14px;'>
-                                <span style='vertical-align: top;'>Note: </span>
+                            <div class="flexrow">
+                                <span class="input-label">Example:</span>
+                            </div>
+                            <div class="flexrow">
+                                <button value="vcf" class='butn input-example-button'>VCF</button>
+                                <button value="cravat" class='butn input-example-button'>TSV</button>
+                                <button value="hgvs" class='butn input-example-button'>HGVS</button>
+                            </div>
+                            <div class="flexcol">
+                                <span class="input-label">Note: </span>
                                 <textarea id='jobnoteinput' rows='1' placeholder='Enter a note for the analysis (optional)'></textarea>
                             </div>
-                        </td>
-                    </tr>
-                </table>
-                <div class='divbanner'></div>
-                <div class='chevrondiv'><div class='chevron chevron1to2'></div></div>
+                </div>
+                <div class='chevrondiv flexrow'>&nbsp;<div class='chevron chevron1to2'></div></div>
             </div>
   
             <div id='modchoose' class='container'>
@@ -147,10 +138,10 @@
                 <span class='divtitle'>Additional Analysis</span>
                 <div id='addtl-analysis-content'></div>
                 <div class='divbanner'></div>
+                <div class='chevrondiv'><div class='chevron chevron2to3'></div></div>
             </div>
+            <div class="annotate-container"><button id="submit-job-button" class='butn submit-annotate-button'>ANNOTATE</button></div>
         </div>
-        <div class='chevrondiv'><div class='chevron chevron2to3'></div></div>
-        <div style='text-align: center;'><button id="submit-job-button" class='butn submit-annotate-button'>ANNOTATE</button></div>
     </div>
 
     </td><td valign='top' style='padding-left: 5px; width: 100%;'>
diff --git a/cravat/websubmit/nocache/websubmit.css b/cravat/websubmit/nocache/websubmit.css
index 98ea3540..256b24a7 100644
--- a/cravat/websubmit/nocache/websubmit.css
+++ b/cravat/websubmit/nocache/websubmit.css
@@ -109,6 +109,10 @@ code {
     font-size: 13px;
 }
 
+.annotate-container {
+    margin-right: 10px;
+}
+
 .divtitle {
     font-family: sourcesanspro-bold;
     font-size: 22px;
@@ -119,11 +123,6 @@ code {
 }
 
 .or {
-    position: absolute;
-    top: -17px;
-    left: 30px;
-    padding-top: 5px;
-    padding-bottom: 5px;
     width: 26px;
     color: #4b4b4b;
 }
@@ -242,7 +241,17 @@ button {
 .variant-input-border-bottom {
     position: relative;
     border-bottom: 1px dotted #cbcbcb;
-    padding-bottom: 20px;
+    padding-top: 1em;
+}
+
+.flexcol {
+    display: flex;
+    flex-direction: column;
+}
+
+.flexrow {
+    display: flex;
+    flex-direction: row;
 }
 
 #submitcontentdiv {
@@ -250,11 +259,19 @@ button {
 }
 
 #jobnoteinput {
-    width: calc(100% - 44px);
+    width: calc(100% - 8px);
+    resize: vertical;
 }
 
 #input-text {
-    width: calc(100% + 40px);
+    width: calc(100% - 8px);
+    height: 4em;
+    transition: all ease .2s;
+    resize: vertical;
+}
+
+#input-text.input-text-selected {
+    height: 15em;
 }
 
 #refresh-jobs-table-btn {
@@ -517,19 +534,24 @@ input:checked + .slider:before {
 }
 
 .input-example-button {
-    width: 35px;
-    height: 23px;
+    min-width: 35px;
     font-size: 11px;
     background-color: #6e593a;
+    padding: 3px 6px;
+}
+
+.input-label {
+    font-size: 13px;
+    margin-top: 0.3em;
 }
 
 .submit-annotate-button {
     font-size: 24px; 
-    width: 391px;
+    width: 100%;
     padding: 9px;
     background-color: #de6342;
-    position: absolute;
-    left: 1px;
+    margin-left: 0;
+    margin-top: 1em;
 }
 
 .launch-button {
@@ -766,9 +788,6 @@ input:checked + .slider:before {
 }
 
 .chevron2to3 {
-  position: relative;
-  top: -30px;
-  left: 329px;
 }
 
 .chevron2to3:before {
@@ -908,8 +927,11 @@ input:checked + .slider:before {
 }
 
 #assembly-select-div {
-    width: fit-content;
-    padding: 2px;
+    width: 100%;
+}
+
+#assembly-select {
+    width: 100%;
 }
 
 .fileaddbutn {
diff --git a/cravat/websubmit/nocache/websubmit.js b/cravat/websubmit/nocache/websubmit.js
index f5299c4b..4c9c1c1b 100644
--- a/cravat/websubmit/nocache/websubmit.js
+++ b/cravat/websubmit/nocache/websubmit.js
@@ -1778,12 +1778,12 @@ function populatePackageVersions () {
 
 function onClickInputTextArea () {
     let input = document.getElementById('input-text');
-    input.rows = 20;
+    input.classList.add('input-text-selected')
 }
 
 function onBlurInputTextArea () {
     let input = document.getElementById('input-text');
-    input.rows = 1;
+    input.classList.remove('input-text-selected')
 }
 
 function resizePage () {