diff --git a/ayanova/src/App.vue b/ayanova/src/App.vue
index 1118da1c..19eae651 100644
--- a/ayanova/src/App.vue
+++ b/ayanova/src/App.vue
@@ -88,16 +88,16 @@
     </v-app-bar>
     <v-content>
       <v-container container--fluid fill-height>
-        <v-layout justify-center>
+        <v-row justify-center>
           <transition name="fade" mode="out-in" @after-leave="afterLeave">
             <router-view class="view"></router-view>
           </transition>
-        </v-layout>
+        </v-row>
       </v-container>
     </v-content>
     <v-footer v-if="!isAuthenticated">
-      <v-layout>
-        <v-flex primary py-2 text-center white--text xs12>
+      <v-row>
+        <v-col primary py-2 text-center white--text xs12>
           <div>
             <a href="https://ayanova.com" target="_blank">
               <span class="white--text caption"
@@ -105,8 +105,8 @@
               >
             </a>
           </div>
-        </v-flex>
-      </v-layout>
+        </v-col>
+      </v-row>
     </v-footer>
   </v-app>
 </template>
diff --git a/ayanova/src/components/HelloWorld.vue b/ayanova/src/components/HelloWorld.vue
index 7d5de946..9b0aafc2 100644
--- a/ayanova/src/components/HelloWorld.vue
+++ b/ayanova/src/components/HelloWorld.vue
@@ -1,20 +1,20 @@
 <template>
   <v-container>
-    <v-layout text-center wrap>
-      <v-flex xs12>
+    <v-row text-center wrap>
+      <v-col xs12>
         <v-img
           :src="require('../assets/logo.svg')"
           class="my-4"
           contain
           height="200"
         ></v-img>
-      </v-flex>
-      <v-flex mb-6 v-if="this.formReady">
+      </v-col>
+      <v-col mb-6 v-if="this.formReady">
         <h1 class="display-2 font-weight-bold mb-4">
           {{ lt("Welcome") }}
         </h1>
-      </v-flex>
-    </v-layout>
+      </v-col>
+    </v-row>
   </v-container>
 </template>
 
diff --git a/ayanova/src/components/custom-fields-control.vue b/ayanova/src/components/custom-fields-control.vue
index 0d179f90..7b7fd019 100644
--- a/ayanova/src/components/custom-fields-control.vue
+++ b/ayanova/src/components/custom-fields-control.vue
@@ -14,9 +14,9 @@
     <hr /> -->
 
     <div>
-      <v-layout align-center justify-left row wrap>
+      <v-row align-center justify-left row wrap>
         <template v-for="item in this.$store.state.formCustomTemplate[formKey]">
-          <v-flex v-if="item.type" :key="item.fld" xs12 sm6 lg4 xl3 px-2>
+          <v-col v-if="item.type" :key="item.fld" xs12 sm6 lg4 xl3 px-2>
             <div v-if="item.type === 'currency'">
               CURRENCY CONTROL HERE
             </div>
@@ -48,9 +48,9 @@
                 >UNKNOWN CUSTOM CONTROL TYPE: {{ item.type }}</span
               >
             </div>
-          </v-flex>
+          </v-col>
         </template>
-      </v-layout>
+      </v-row>
     </div>
   </div>
 </template>
diff --git a/ayanova/src/components/date-time-control.vue b/ayanova/src/components/date-time-control.vue
index b014b72d..af3a2c08 100644
--- a/ayanova/src/components/date-time-control.vue
+++ b/ayanova/src/components/date-time-control.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
-    <v-layout row wrap v-if="!readonly">
-      <v-flex xs6>
+    <v-row row wrap v-if="!readonly">
+      <v-col xs6>
         <v-dialog v-model="dlgdate" persistent lazy full-width width="290px">
           <template v-slot:activator="{ on }">
             <v-text-field
@@ -20,8 +20,8 @@
             <v-btn flat color="primary" @click="dlgdate = false">Close</v-btn>
           </v-date-picker>
         </v-dialog>
-      </v-flex>
-      <v-flex xs6>
+      </v-col>
+      <v-col xs6>
         <v-dialog v-model="dlgtime" persistent lazy full-width width="290px">
           <template v-slot:activator="{ on }">
             <v-text-field
@@ -39,8 +39,8 @@
             <v-btn flat color="primary" @click="dlgtime = false">OK</v-btn>
           </v-time-picker>
         </v-dialog>
-      </v-flex>
-    </v-layout>
+      </v-col>
+    </v-row>
     <v-text-field
       v-if="readonly"
       v-model="formatDateTime"
diff --git a/ayanova/src/components/inventorypartassemblytop.vue b/ayanova/src/components/inventorypartassemblytop.vue
index d0f10082..87b8b9ac 100644
--- a/ayanova/src/components/inventorypartassemblytop.vue
+++ b/ayanova/src/components/inventorypartassemblytop.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-flex xs12 md4>
+  <v-col xs12 md4>
     <v-card class="elevation-5 transparent">
       <v-card-text class="text-center">
         <v-icon x-large color="secondary">fa-heart</v-icon>
@@ -14,7 +14,7 @@
         est vitae tellus bibendum tincidunt. Suspendisse potenti.
       </v-card-text>
     </v-card>
-  </v-flex>
+  </v-col>
 </template>
 
 <script>
diff --git a/ayanova/src/components/inventoryparttop.vue b/ayanova/src/components/inventoryparttop.vue
index 01bc9e32..e12acd07 100644
--- a/ayanova/src/components/inventoryparttop.vue
+++ b/ayanova/src/components/inventoryparttop.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-flex xs12 md4>
+  <v-col xs12 md4>
     <v-card class="elevation-5 transparent">
       <v-card-text class="text-center">
         <v-icon x-large color="secondary">fa-cannabis</v-icon>
@@ -14,7 +14,7 @@
         est vitae tellus bibendum tincidunt. Suspendisse potenti.
       </v-card-text>
     </v-card>
-  </v-flex>
+  </v-col>
 </template>
 
 <script>
diff --git a/ayanova/src/components/inventorypotop.vue b/ayanova/src/components/inventorypotop.vue
index 6677e108..a58bcf62 100644
--- a/ayanova/src/components/inventorypotop.vue
+++ b/ayanova/src/components/inventorypotop.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-flex xs12 md4>
+  <v-col xs12 md4>
     <v-card class="elevation-5 transparent">
       <v-card-text class="text-center">
         <v-icon x-large color="secondary">fa-crow</v-icon>
@@ -14,7 +14,7 @@
         est vitae tellus bibendum tincidunt. Suspendisse potenti.
       </v-card-text>
     </v-card>
-  </v-flex>
+  </v-col>
 </template>
 
 <script>
diff --git a/ayanova/src/components/inventorywarehousetop.vue b/ayanova/src/components/inventorywarehousetop.vue
index c0af9204..97d3933d 100644
--- a/ayanova/src/components/inventorywarehousetop.vue
+++ b/ayanova/src/components/inventorywarehousetop.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-flex xs12 md4>
+  <v-col xs12 md4>
     <v-card class="elevation-5 transparent">
       <v-card-text class="text-center">
         <v-icon x-large color="secondary">fa-heart </v-icon>
@@ -14,7 +14,7 @@
         est vitae tellus bibendum tincidunt. Suspendisse potenti.
       </v-card-text>
     </v-card>
-  </v-flex>
+  </v-col>
 </template>
 
 <script>
diff --git a/ayanova/src/components/inventorywidgetlist.vue b/ayanova/src/components/inventorywidgetlist.vue
index 3cd383cc..55ca27d5 100644
--- a/ayanova/src/components/inventorywidgetlist.vue
+++ b/ayanova/src/components/inventorywidgetlist.vue
@@ -1,6 +1,6 @@
 <template>
-  <v-layout column wrap class="my-12" align-center v-if="this.formState.ready">
-    <v-flex xs12 mt-1 mb-2 v-if="formState.errorBoxMessage">
+  <v-row column wrap class="my-12" align-center v-if="this.formState.ready">
+    <v-col xs12 mt-1 mb-2 v-if="formState.errorBoxMessage">
       <v-alert
         ref="errorbox"
         v-show="formState.errorBoxMessage"
@@ -12,8 +12,8 @@
         outline
         >{{ formState.errorBoxMessage }}</v-alert
       >
-    </v-flex>
-    <v-flex xs12 md12>
+    </v-col>
+    <v-col xs12 md12>
       <div v-if="this.formState.ready">
         <v-toolbar flat>
           <v-toolbar-title>
@@ -83,8 +83,8 @@
           </template>
         </v-data-table>
       </div>
-    </v-flex>
-  </v-layout>
+    </v-col>
+  </v-row>
 </template>
 
 <script>
diff --git a/ayanova/src/components/tag-picker.vue b/ayanova/src/components/tag-picker.vue
index c35f132d..563ee8c4 100644
--- a/ayanova/src/components/tag-picker.vue
+++ b/ayanova/src/components/tag-picker.vue
@@ -14,16 +14,16 @@
   >
     <template slot="no-data" v-if="tagSearchEntry">
       <v-container>
-        <v-layout row>
-          <v-layout justify-center>
+        <v-row row>
+          <v-row justify-center>
             <v-chip color="primary" text-color="white" class="display-1">
               {{ this.normalizeTag(tagSearchEntry) }}</v-chip
             >
             <v-btn large icon @click="addTag()">
               <v-icon large color="success">fa-plus-circle</v-icon>
             </v-btn>
-          </v-layout>
-        </v-layout>
+          </v-row>
+        </v-row>
       </v-container>
     </template>
   </v-autocomplete>
diff --git a/ayanova/src/components/underconstruction.vue b/ayanova/src/components/underconstruction.vue
index 5e1aca23..725a8612 100644
--- a/ayanova/src/components/underconstruction.vue
+++ b/ayanova/src/components/underconstruction.vue
@@ -1,9 +1,9 @@
 <template>
   <v-container>
-    <v-layout>
-      <v-flex xs12>
+    <v-row>
+      <v-col xs12>
         <v-img :src="require('../assets/underconstruction.svg')"></v-img>
-      </v-flex>
-    </v-layout>
+      </v-col>
+    </v-row>
   </v-container>
 </template>
diff --git a/ayanova/src/views/About.vue b/ayanova/src/views/About.vue
index 06ec24be..2a8f9292 100644
--- a/ayanova/src/views/About.vue
+++ b/ayanova/src/views/About.vue
@@ -1,6 +1,6 @@
 <template>
-  <v-layout row v-if="this.formState.ready">
-    <v-flex xs12 mt-1 mb-2 v-if="formState.errorBoxMessage">
+  <v-row row v-if="this.formState.ready">
+    <v-col xs12 mt-1 mb-2 v-if="formState.errorBoxMessage">
       <v-alert
         ref="errorbox"
         v-show="formState.errorBoxMessage"
@@ -12,8 +12,8 @@
         outline
         >{{ formState.errorBoxMessage }}</v-alert
       >
-    </v-flex>
-    <v-flex>
+    </v-col>
+    <v-col>
       <v-card id="aboutinfocard">
         <v-subheader>{{ lt("ClientApp") }}</v-subheader>
         <div>
@@ -129,8 +129,8 @@
 
         <v-divider class="mt-6"></v-divider>
       </v-card>
-    </v-flex>
-  </v-layout>
+    </v-col>
+  </v-row>
 </template>
 
 <script>
diff --git a/ayanova/src/views/inventory-widget-edit.vue b/ayanova/src/views/inventory-widget-edit.vue
index ffc90617..86672d93 100644
--- a/ayanova/src/views/inventory-widget-edit.vue
+++ b/ayanova/src/views/inventory-widget-edit.vue
@@ -1,9 +1,9 @@
 <template>
-  <v-layout v-if="this.formState.ready">
-    <v-flex>
+  <v-row v-if="this.formState.ready">
+    <v-col>
       <v-form ref="form">
-        <v-layout align-center justify-left row wrap>
-          <v-flex xs12 mt-1 mb-2>
+        <v-row align-center justify-left row wrap>
+          <v-col xs12 mt-1 mb-2>
             <v-alert
               ref="errorbox"
               v-show="formState.errorBoxMessage"
@@ -15,8 +15,8 @@
               outline
               >{{ formState.errorBoxMessage }}</v-alert
             >
-          </v-flex>
-          <v-flex xs12 sm6 lg4 xl3 px-2>
+          </v-col>
+          <v-col xs12 sm6 lg4 xl3 px-2>
             <v-text-field
               v-model="obj.name"
               :readonly="this.formState.readOnly"
@@ -32,8 +32,8 @@
               ref="name"
               @change="onChange('name')"
             ></v-text-field>
-          </v-flex>
-          <v-flex xs12 sm6 lg4 xl3 px-2>
+          </v-col>
+          <v-col xs12 sm6 lg4 xl3 px-2>
             <v-text-field
               v-model="obj.serial"
               :readonly="this.formState.readOnly"
@@ -46,8 +46,8 @@
               ref="serial"
               @change="onChange('serial')"
             ></v-text-field>
-          </v-flex>
-          <v-flex xs12 sm6 lg4 xl3 px-2>
+          </v-col>
+          <v-col xs12 sm6 lg4 xl3 px-2>
             <v-text-field
               v-model="obj.count"
               :readonly="this.formState.readOnly"
@@ -65,9 +65,9 @@
               @change="onChange('count')"
               type="number"
             ></v-text-field>
-          </v-flex>
+          </v-col>
 
-          <v-flex xs12 sm6 lg4 xl3 px-2>
+          <v-col xs12 sm6 lg4 xl3 px-2>
             <v-text-field
               v-model="obj.dollarAmount"
               :readonly="this.formState.readOnly"
@@ -83,9 +83,9 @@
               @change="onChange('dollarAmount')"
               type="number"
             ></v-text-field>
-          </v-flex>
+          </v-col>
 
-          <v-flex xs12 sm6 lg4 xl3 px-2>
+          <v-col xs12 sm6 lg4 xl3 px-2>
             <gz-date-time-picker
               :label="lt('WidgetStartDate')"
               v-model="obj.startDate"
@@ -94,9 +94,9 @@
               :error-messages="form().serverErrors(this, 'startDate')"
               @change="onChange('startDate')"
             ></gz-date-time-picker>
-          </v-flex>
+          </v-col>
 
-          <v-flex xs12 sm6 lg4 xl3 px-2>
+          <v-col xs12 sm6 lg4 xl3 px-2>
             <gz-date-time-picker
               :label="lt('WidgetEndDate')"
               :rules="[form().datePrecedence(this, 'startDate', 'endDate')]"
@@ -106,8 +106,8 @@
               ref="endDate"
               @change="onChange('endDate')"
             ></gz-date-time-picker>
-          </v-flex>
-          <v-flex xs12 sm6 lg4 xl3 px-2>
+          </v-col>
+          <v-col xs12 sm6 lg4 xl3 px-2>
             <v-checkbox
               v-model="obj.active"
               :readonly="this.formState.readOnly"
@@ -117,8 +117,8 @@
               required
               @change="onChange('active')"
             ></v-checkbox>
-          </v-flex>
-          <v-flex xs12 sm6 lg4 xl3 px-2>
+          </v-col>
+          <v-col xs12 sm6 lg4 xl3 px-2>
             <v-select
               v-model="obj.roles"
               :items="pickLists.roles"
@@ -135,9 +135,9 @@
               required
               @change="onChange('roles')"
             ></v-select>
-          </v-flex>
+          </v-col>
 
-          <v-flex xs12 px-2>
+          <v-col xs12 px-2>
             <v-textarea
               v-model="obj.notes"
               :readonly="this.formState.readOnly"
@@ -147,9 +147,9 @@
               @change="onChange('notes')"
               auto-grow
             ></v-textarea>
-          </v-flex>
+          </v-col>
 
-          <v-flex xs12 px-2>
+          <v-col xs12 px-2>
             <gz-tag-picker
               :label="lt('Tags')"
               v-model="obj.tags"
@@ -158,9 +158,9 @@
               :error-messages="form().serverErrors(this, 'tags')"
               @change="onChange('tags')"
             ></gz-tag-picker>
-          </v-flex>
+          </v-col>
 
-          <v-flex xs12 px-2>
+          <v-col xs12 px-2>
             <gz-custom-fields
               :formKey="formCustomTemplateKey"
               v-bind:value.sync="obj.customFields"
@@ -170,13 +170,13 @@
               @change="onChange('customFields')"
             ></gz-custom-fields>
             <!-- v-model="obj.customFields" -->
-          </v-flex>
-        </v-layout>
+          </v-col>
+        </v-row>
         <!-- <v-layout align-left justify-center row wrap mt-12>
-          <v-flex xs6 sm4> FORMtags: {{ obj.tags }} </v-flex>
-        </v-layout> -->
+          <v-col xs6 sm4> FORMtags: {{ obj.tags }} </v-col>
+        </v-row> -->
         <!-- <v-layout align-left justify-center row wrap mt-12>
-          <v-flex xs6 sm4>
+          <v-col xs6 sm4>
             READY: {{ formState.ready }}
             <br />
             LOADING: {{ formState.loading }}
@@ -187,11 +187,11 @@
             <br />
             READONLY: {{ formState.readOnly }}
             <br />
-          </v-flex>
-        </v-layout>-->
+          </v-col>
+        </v-row>-->
       </v-form>
-    </v-flex>
-  </v-layout>
+    </v-col>
+  </v-row>
 </template>
 
 <script>
diff --git a/ayanova/src/views/inventory.vue b/ayanova/src/views/inventory.vue
index 9150d280..b4bce28a 100644
--- a/ayanova/src/views/inventory.vue
+++ b/ayanova/src/views/inventory.vue
@@ -1,8 +1,6 @@
 <template>
-  <!-- <v-flex xs12>
-  <v-container grid-list-xl>-->
-  <v-layout row wrap align-top v-if="this.formState.ready">
-    <v-flex xs12 mt-1 mb-2 v-if="formState.errorBoxMessage">
+  <v-row row wrap align-top v-if="this.formState.ready">
+    <v-col xs12 mt-1 mb-2 v-if="formState.errorBoxMessage">
       <v-alert
         ref="errorbox"
         v-show="formState.errorBoxMessage"
@@ -14,13 +12,13 @@
         outline
         >{{ formState.errorBoxMessage }}</v-alert
       >
-    </v-flex>
+    </v-col>
     <WidgetList />
     <WarehouseTop />
     <POTop />
     <PartTop />
     <PartAssemblyTop />
-    <v-flex xs12 md4>
+    <v-col xs12 md4>
       <v-card class="elevation-0 transparent">
         <v-card-text class="text-center">
           <v-icon x-large color="accent">fa-lightbulb</v-icon>
@@ -35,10 +33,8 @@
           Aliquam eu est vitae tellus bibendum tincidunt. Suspendisse potenti.
         </v-card-text>
       </v-card>
-    </v-flex>
-  </v-layout>
-  <!-- </v-container>
-  </v-flex>-->
+    </v-col>
+  </v-row>
 </template>
 
 <script>
diff --git a/ayanova/src/views/log.vue b/ayanova/src/views/log.vue
index 74046c10..4bff7c7c 100644
--- a/ayanova/src/views/log.vue
+++ b/ayanova/src/views/log.vue
@@ -1,6 +1,6 @@
 <template>
-  <v-layout row v-if="this.formState.ready">
-    <v-flex xs12 mt-1 mb-2 v-if="formState.errorBoxMessage">
+  <v-row row v-if="this.formState.ready">
+    <v-col xs12 mt-1 mb-2 v-if="formState.errorBoxMessage">
       <v-alert
         ref="errorbox"
         v-show="formState.errorBoxMessage"
@@ -12,11 +12,11 @@
         outline
         >{{ formState.errorBoxMessage }}</v-alert
       >
-    </v-flex>
-    <v-flex>
+    </v-col>
+    <v-col>
       <v-textarea v-model="logText" full-width readonly auto-grow></v-textarea>
-    </v-flex>
-  </v-layout>
+    </v-col>
+  </v-row>
 </template>
 
 <script>
diff --git a/ayanova/src/views/login.vue b/ayanova/src/views/login.vue
index 8424aec5..f86a1a78 100644
--- a/ayanova/src/views/login.vue
+++ b/ayanova/src/views/login.vue
@@ -1,21 +1,21 @@
 <template>
   <v-container container--fluid>
-    <v-layout row wrap>
-      <v-flex xs12 class="hidden-sm-and-down text-center" mt-12 ml-12 pl-12>
+    <v-row row wrap>
+      <v-col xs12 class="hidden-sm-and-down text-center" mt-12 ml-12 pl-12>
         <v-img
           :src="require('../assets/logo.svg')"
           class="my-4"
           contain
           height="200"
         ></v-img>
-      </v-flex>
-      <v-flex xs12 class="hidden-md-and-up text-center">
+      </v-col>
+      <v-col xs12 class="hidden-md-and-up text-center">
         <v-img :src="require('../assets/logo.svg')" contain height="64"></v-img>
-      </v-flex>
-      <v-flex xs12 sm6 offset-sm3 mt-4>
+      </v-col>
+      <v-col xs12 sm6 offset-sm3 mt-4>
         <form>
-          <v-layout column>
-            <v-flex>
+          <v-row column>
+            <v-col>
               <v-text-field
                 name="username"
                 v-model="input.username"
@@ -32,8 +32,8 @@
                 v-focus
                 v-on:keyup.enter="onEnterUserName"
               ></v-text-field>
-            </v-flex>
-            <v-flex>
+            </v-col>
+            <v-col>
               <v-text-field
                 name="password"
                 v-model="input.password"
@@ -45,16 +45,16 @@
                 :error="errorBadCreds"
                 v-on:keyup.enter="login"
               ></v-text-field>
-            </v-flex>
-            <v-flex class="text-center" mt-1>
+            </v-col>
+            <v-col class="text-center" mt-1>
               <v-btn color="primary" v-on:click="login()">
                 <v-icon>fa-sign-in-alt</v-icon>
               </v-btn>
-            </v-flex>
-          </v-layout>
+            </v-col>
+          </v-row>
         </form>
-      </v-flex>
-    </v-layout>
+      </v-col>
+    </v-row>
   </v-container>
 </template>
 
diff --git a/ayanova/src/views/notfound.vue b/ayanova/src/views/notfound.vue
index caa3e630..5abdb0e3 100644
--- a/ayanova/src/views/notfound.vue
+++ b/ayanova/src/views/notfound.vue
@@ -1,15 +1,15 @@
 <template>
   <v-container>
-    <v-layout justify-center>
-      <v-flex xs12>
+    <v-row justify-center>
+      <v-col xs12>
         <div class="text-center">
           <v-icon color="red" size="100">fa-dragon</v-icon>
           <div class="headline">
             {{ "404 - " + window.$gz.locale.get("ErrorAPI2010") }}
           </div>
         </div>
-      </v-flex>
-    </v-layout>
+      </v-col>
+    </v-row>
   </v-container>
 </template>