diff --git a/src/components/Order.vue b/src/components/Order.vue
new file mode 100644
index 0000000..767d519
--- /dev/null
+++ b/src/components/Order.vue
@@ -0,0 +1,175 @@
+<template>
+  <div class="rozkaz">
+    <OrderN v-if="orderType == 'N'" />
+    <OrderS v-if="orderType == 'S'"/>
+
+    <section class="info">
+      <table class="info-table">
+        <tbody>
+          <tr>
+            <td colspan="4">
+              <input type="text" v-model="info.stationName" />
+              <br />
+              stacja
+            </td>
+
+            <td colspan="3">
+              <input type="text" v-model="info.checkpointName" />
+              <br />
+              posterunek
+            </td>
+
+            <td colspan="2">
+              <input type="text" v-model="info.hour" />
+              <br />
+              godz.
+            </td>
+
+            <td colspan="1">
+              <input type="text" v-model="info.minutes" />
+              <br />
+              min.
+            </td>
+          </tr>
+
+          <tr>
+            <td colspan="5">
+              <input type="text" v-model="info.dispatcherName" />
+              <br />
+              dyżurny ruchu
+            </td>
+
+            <td colspan="5">
+              <input type="text" v-model="info.secondaryDispatcherName" />
+              <br />
+              z polecenia dyżurnego ruchu
+            </td>
+          </tr>
+        </tbody>
+      </table>
+    </section>
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent } from 'vue';
+import OrderN from '@/components/OrderN.vue';
+import OrderS from '@/components/OrderS.vue';
+import { useStore } from '@/store/store';
+
+export default defineComponent({
+  components: { OrderN, OrderS },
+
+  data() {
+    return {
+      orderType: 'S',
+    };
+  },
+
+  setup() {
+    const store = useStore();
+
+    return {
+      info: store.orderInfo,
+    };
+  },
+});
+</script>
+
+<style lang="scss">
+.rozkaz {
+  width: 500px;
+  background-color: white;
+  color: black;
+
+  padding: 0.5em;
+  box-shadow: 0 0 15px 2px white;
+
+  h2 {
+    margin: 0;
+    padding: 0;
+  }
+
+  .header {
+    padding: 0.5em;
+    border: 2px solid black;
+    border-bottom: none;
+  }
+}
+
+.flex-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: flex-end;
+}
+
+.flex-center {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+input {
+  max-width: 100px;
+  background-color: transparent;
+  outline: none;
+  border: none;
+
+  border-bottom: 2px dotted black;
+  font-size: 0.9em;
+  text-align: center;
+  color: black;
+}
+
+select {
+  margin-top: 0.5rem;
+  margin-right: 0.5rem;
+  font-size: 0.8rem;
+}
+
+.table-section {
+  table {
+    width: 100%;
+
+    td:first-child {
+      width: 10%;
+
+      text-align: center;
+      vertical-align: top;
+
+      font-weight: bold;
+    }
+
+    td {
+      padding: 0.35em;
+      text-align: justify;
+
+      line-height: 1.4em;
+    }
+  }
+
+  table,
+  td {
+    border: 2px solid black;
+    border-collapse: collapse;
+  }
+}
+
+table.info-table {
+  border-collapse: collapse;
+  width: 100%;
+  table-layout: fixed;
+
+  td {
+    border: 2px solid black;
+    border-collapse: collapse;
+    padding: 0.35em;
+  }
+
+  input {
+    max-width: 95%;
+  }
+
+  text-align: center;
+}
+</style>
diff --git a/src/components/OrderN.vue b/src/components/OrderN.vue
index a6b8b46..6f99c13 100644
--- a/src/components/OrderN.vue
+++ b/src/components/OrderN.vue
@@ -1,207 +1,159 @@
 <template>
-  <div class="rozkaz rozkaz-n">
-    <section class="header">
-      <h2 class="flex-center">
-        Rozkaz pisemny "N" nr
-        <input type="text" v-model="orderNo" />
-      </h2>
+  <section class="header">
+    <h2 class="flex-center">
+      Rozkaz pisemny "N" nr
+      <input type="text" v-model="order.header.orderNo" />
+    </h2>
 
-      <div class="flex-row">
-        dla pociągu nr <input type="text" v-model="trainNo" /> dnia <input type="text" v-model="date" />
-        {{ new Date().getUTCFullYear() }}r.
-      </div>
-    </section>
+    <div class="flex-row">
+      dla pociągu nr <input type="text" v-model="order.header.trainNo" /> dnia
+      <input type="text" v-model="order.header.date" /> {{ new Date().getUTCFullYear() }}r.
+    </div>
+  </section>
 
-    <section class="table-section">
-      <table class="options-table">
-        <tbody>
-          <tr>
-            <td>1</td>
-            <td>
-              Od <input type="text" v-model="row1.from" /> do <input type="text" v-model="row1.to" /> tor nr
-              <input type="text" v-model="row1.trackNo" /> jest zamknięty, ruch jednotorowy dwukierunkowy wprowadzono po
-              torze nr <input type="text" v-model="row1.trackNo2" />
-            </td>
-          </tr>
+  <section class="table-section">
+    <table class="options-table">
+      <tbody>
+        <tr>
+          <td>1</td>
+          <td>
+            Od <input type="text" v-model="order.row1.from" /> do <input type="text" v-model="order.row1.to" /> tor nr
+            <input type="text" v-model="order.row1.trackNo" /> jest zamknięty, ruch jednotorowy dwukierunkowy
+            wprowadzono po torze nr <input type="text" v-model="order.row1.trackNo2" />
+          </td>
+        </tr>
 
-          <tr>
-            <td>2</td>
-            <td>
-              <strong>ZEZWALAM</strong> po otrzymaniu
-              <select id="select-2a" v-model="row2.choice1">
-                <option value="option-2a-1" :checked="row2.choice1 == 'option-2a-1'">sygnału "Nakaz Jazdy"</option>
-                <option value="option-2a-2" :checked="row2.choice1 == 'option-2a-2'">tylko tego rozkazu pisemnego</option>
-              </select>
+        <tr>
+          <td>2</td>
+          <td>
+            <strong>ZEZWALAM</strong> po otrzymaniu
+            <select id="select-2a" v-model="order.row2.option1">
+              <option value="signal">sygnału "Nakaz Jazdy"</option>
+              <option value="order">tylko tego rozkazu pisemnego</option>
+            </select>
 
-              {{ row2.choice1 }}
+            <div style="margin-top: 0.5rem">
+              <input
+                type="radio"
+                name="section-2"
+                id="checkbox-2a"
+                value="checkbox-2a"
+                v-model="order.row2.checkbox"
+                :checked="order.row2.checkbox == 'checkbox-2a'"
+              />
 
-              <div style="margin-top: 0.5rem">
-                <input type="radio" name="section-2" id="checkbox-2a" />
-                <label for="checkbox-2a">
-                  przejechać obok wskazującego sygnał "Stój" semafora wyjazdowego <input type="text" /> i wyjechać w
-                  kierunku <input type="text" /> na tor szlakowy
-                  <select>
-                    <option value="lewy">lewy</option>
-                    <option value="prawy">prawy</option>
-                  </select>
-                  nr <input type="text" />
-                </label>
-              </div>
+              <label for="checkbox-2a">
+                przejechać obok wskazującego sygnał "Stój" semafora wyjazdowego <input type="text" /> i wyjechać w
+                kierunku <input type="text" /> na tor szlakowy
+                <select v-model="order.row2.option2">
+                  <option value="lewy">lewy</option>
+                  <option value="prawy">prawy</option>
+                </select>
+                nr <input type="text" />
+              </label>
+            </div>
 
-              <div style="margin-top: 0.5rem">
-                <input type="radio" name="section-2" id="checkbox-2b" />
-                <label for="checkbox-2b">
-                  z toru nr <input type="text" /> nie posiadającego semafora wyjazdowego wyjechać w kierunku
-                  <input type="text" /> na tor szlakowy
-                  <select>
-                    <option value="lewy">lewy</option>
-                    <option value="prawy">prawy</option>
-                  </select>
-                  nr <input type="text" />
-                </label>
-              </div>
-            </td>
-          </tr>
+            <div style="margin-top: 0.5rem">
+              <input
+                type="radio"
+                name="section-2"
+                id="checkbox-2b"
+                value="checkbox-2b"
+                v-model="order.row2.checkbox"
+                :checked="order.row2.checkbox == 'checkbox-2b'"
+              />
 
-          <tr>
-            <td>3</td>
-            <td>
-              <select>
-                <option value="jazda">Jazda</option>
-                <option value="popychanie">Popychanie</option>
-              </select>
-              pociągu odbędzie się w kierunku: <input type="text" /> do km <input type="text" /> skąd
-              <select>
-                <option value="pociąg">pociąg</option>
-                <option value="popychacz">popychacz</option>
-              </select>
-              ma wrócić po torze lewym nr <input type="text" /> najpóźniej o godz. <input type="text" /> min.
-              <input type="text" />
-            </td>
-          </tr>
+              <label for="checkbox-2b">
+                z toru nr <input type="text" /> nie posiadającego semafora wyjazdowego wyjechać w kierunku
+                <input type="text" /> na tor szlakowy
+                <select v-model="order.row2.option3">
+                  <option value="lewy">lewy</option>
+                  <option value="prawy">prawy</option>
+                </select>
+                nr <input type="text" />
+              </label>
+            </div>
+          </td>
+        </tr>
 
-          <tr>
-            <td>4</td>
-            <td>
-              <strong>WJAZD</strong> z toru szlakowego nr <input type="text" /> na
-              <select>
-                <option value="stację">stację</option>
-                <option value="posterunek odgałęźny">posterunek odgałęźny</option>
-              </select>
-              <input type="text" /> odbędzie się po otrzymaniu:
+        <tr>
+          <td>3</td>
+          <td>
+            <select v-model="order.row3.option1">
+              <option value="jazda">Jazda</option>
+              <option value="popychanie">Popychanie</option>
+            </select>
+            pociągu odbędzie się w kierunku: <input type="text" v-model="order.row3.direction" /> do km
+            <input type="text" v-model="order.row3.toKilometer" /> skąd
+            <select v-model="order.row3.option2">
+              <option value="pociąg">pociąg</option>
+              <option value="popychacz">popychacz</option>
+            </select>
+            ma wrócić po torze lewym nr <input type="text" v-model="order.row3.trackNo" /> najpóźniej o godz.
+            <input type="text" v-model="order.row3.untilHour" /> min.
+            <input type="text" v-model="order.row3.untilMin" />
+          </td>
+        </tr>
 
-              <div style="margin-top: 0.5rem">
-                <input type="radio" name="section-4" id="checkbox-4a" />
-                <label for="checkbox-4a">
-                  sygnału zastępczego "Sz" na osobnym urządzeniu ustawionym z
-                  <select>
-                    <option value="lewej">lewej</option>
-                    <option value="prawej">prawej</option>
-                  </select>
-                  strony toru
-                </label>
-              </div>
+        <tr>
+          <td>4</td>
+          <td>
+            <strong>WJAZD</strong> z toru szlakowego nr <input type="text" v-model="order.row4.trackNo" /> na
+            <select v-model="order.row4.optionStation">
+              <option value="stację">stację</option>
+              <option value="posterunek odgałęźny">posterunek odgałęźny</option>
+            </select>
+            <input type="text" v-model="order.row4.stationName" /> odbędzie się po otrzymaniu:
 
-              <div style="margin-top: 0.5rem">
-                <input type="radio" name="section-4" id="checkbox-4b" />
-                <label for="checkbox-4b">
-                  rozkazu pisemnego "N" (doręczonego lub przekazanego przez urządzenia łączności)
-                </label>
-              </div>
-            </td>
-          </tr>
+            <div style="margin-top: 0.5rem">
+              <input type="radio" name="section-4" id="checkbox-4a" value="checkbox-4a" v-model="order.row4.checkbox" />
+              <label for="checkbox-4a">
+                sygnału zastępczego "Sz" na osobnym urządzeniu ustawionym z
+                <select>
+                  <option value="lewej">lewej</option>
+                  <option value="prawej">prawej</option>
+                </select>
+                strony toru
+              </label>
+            </div>
 
-          <tr>
-            <td>5</td>
-            <td>
-              <strong>ZEZWALAM</strong> wjechać z toru szlakowego nr <input type="text" /> z kierunku
-              <input type="text" /> na
-              <select>
-                <option value="stację">stację</option>
-                <option value="posterunek odgałęźny">posterunek odgałęźny</option>
-              </select>
-              i przejechać obok sygnału "Stój" na <input type="text" />
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </section>
+            <div style="margin-top: 0.5rem">
+              <input type="radio" name="section-4" id="checkbox-4b" value="checkbox-4b" v-model="order.row4.checkbox" />
+              <label for="checkbox-4b">
+                rozkazu pisemnego "N" (doręczonego lub przekazanego przez urządzenia łączności)
+              </label>
+            </div>
+          </td>
+        </tr>
 
-    <section class="info">
-      <table class="info-table">
-        <tbody>
-          <tr>
-            <td colspan="4">
-              <input type="text" />
-              <br />
-              stacja
-            </td>
-
-            <td colspan="3">
-              <input type="text" />
-              <br />
-              posterunek
-            </td>
-
-            <td colspan="2">
-              <input type="text" />
-              <br />
-              godz.
-            </td>
-
-            <td colspan="1">
-              <input type="text" />
-              <br />
-              min.
-            </td>
-          </tr>
-
-          <tr>
-            <td colspan="5">
-              <input type="text" />
-              <br />
-              dyżurny ruchu
-            </td>
-
-            <td colspan="5">
-              <input type="text" />
-              <br />
-              z polecenia dyżurnego ruchu
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </section>
-  </div>
+        <tr>
+          <td>5</td>
+          <td>
+            <strong>ZEZWALAM</strong> wjechać z toru szlakowego nr <input type="text" v-model="order.row5.trackNo" /> z
+            kierunku <input type="text" v-model="order.row5.direction" /> na
+            <select v-model="order.row5.stationOption">
+              <option value="stację">stację</option>
+              <option value="posterunek odgałęźny">posterunek odgałęźny</option>
+            </select>
+            i przejechać obok sygnału "Stój" na <input type="text" v-model="order.row5.on" />
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </section>
 </template>
 
 <script lang="ts">
+import { useStore } from '@/store/store';
 import { defineComponent } from 'vue';
 
 export default defineComponent({
-  data() {
+  setup() {
+    const store = useStore();
+
     return {
-      orderNo: '',
-      trainNo: '',
-      date: '',
-
-      row1: {
-        from: '',
-        to: '',
-        trackNo: '',
-        trackNo2: '',
-      },
-
-      row2: {
-        choice1: 'option-2a-1',
-        choice2: '',
-
-      }
+      order: store.orderN,
     };
   },
 });
 </script>
-
-<style lang="scss" scoped>
-@import '../styles/rozkaz.scss';
-</style>
diff --git a/src/components/OrderS.vue b/src/components/OrderS.vue
index 922413b..e1345ac 100644
--- a/src/components/OrderS.vue
+++ b/src/components/OrderS.vue
@@ -1,18 +1,18 @@
 <template>
-  <div class="rozkaz rozkaz-n">
     <section class="header">
       <h2 class="flex-center">
         Rozkaz pisemny "S" nr
-        <input type="text" />
+        <input type="text" v-model="order.header.orderNo" />
       </h2>
 
       <div class="flex-row">
         dla
-        <select id="select-header">
+        <select id="select-header" v-model="order.header.for">
           <option value="pociągu">pociągu</option>
           <option value="manewru">manewru</option>
         </select>
-        nr <input type="text" /> dnia <input type="text" /> {{ new Date().getUTCFullYear() }}r.
+        nr <input type="text" v-model="order.header.trainNo" /> dnia <input type="text" v-model="order.header.date" />
+        {{ new Date().getUTCFullYear() }}r.
       </div>
     </section>
 
@@ -23,26 +23,28 @@
             <td>1</td>
             <td>
               zezwalam po otrzymaniu
-              <select id="select-1a">
+              <select id="select-1a" v-model="order.row1.option1">
                 <option value="sygnału">sygnału "nakaz jazdy"</option>
                 <option value="rozkazu">tylko tego rozkazu pisemnego</option>
               </select>
 
               <div style="margin-top: 0.5rem">
-                <input type="checkbox" name="section-1a" id="checkbox-1a" />
+                <input type="checkbox" name="section-1a" id="checkbox-1a" v-model="order.row1.checkbox1a" />
                 <label for="checkbox-1a">
-                  przejechać obok wskazującego sygnał "Stój" semafora wyjazdowego <input type="text" />
+                  przejechać obok wskazującego sygnał "Stój" semafora wyjazdowego
+                  <input type="text" v-model="order.row1.signal1" />
                   <br />
-                  drogowskazowego <input type="text" />
+                  drogowskazowego <input type="text" v-model="order.row1.signal2" />
                   <br />
                   (odnoszącego się do wyjazdu pociągu)
                 </label>
               </div>
               <hr />
               <div style="margin-top: 0.5rem">
-                <input type="checkbox" name="section-1b" id="checkbox-1b" />
+                <input type="checkbox" name="section-1b" id="checkbox-1b" v-model="order.row1.checkbox1b" />
                 <label for="checkbox-1b">
-                  wyjechać z toru nr <input type="text" /> nie posiadającego semafora wyjazdowego
+                  wyjechać z toru nr <input type="text" v-model="order.row1.trackNo" /> nie posiadającego semafora
+                  wyjazdowego
                 </label>
               </div>
             </td>
@@ -53,87 +55,43 @@
             <td>
               zezwalam przejechać obok wskazującego sygnał "Stój" semafora:
 
-              <div>- wjazdowego <input type="text" /></div>
+              <div>- wjazdowego <input type="text" v-model="order.row2.signal1" /></div>
               <div>
-                - drogowskazowego <input type="text" />
+                - drogowskazowego <input type="text" v-model="order.row2.signal2" />
                 <div>&nbsp;&nbsp;(odnoszącego się do wjazdu pociągu)</div>
               </div>
-              <div>- odstępowego <input type="text" /></div>
-              <div>- wjechać z zamkniętego toru nr <input type="text" /> nie posiadającego semafora wjazdowego</div>
+              <div>- odstępowego <input type="text" v-model="order.row2.signal3" /></div>
+              <div>
+                - wjechać z zamkniętego toru nr <input type="text" v-model="order.row2.trackNo" /> nie posiadającego
+                semafora wjazdowego
+              </div>
             </td>
           </tr>
 
           <tr>
             <td>3</td>
             <td>
-              Od <input type="text" /> do <input type="text" /> po torze nr <input type="text" /> ruch pociągów
+              Od <input type="text" v-model="order.row3.from" /> do <input type="text" v-model="order.row3.to" /> po torze nr <input type="text" v-model="order.row3.trackNo" /> ruch pociągów
               prowadzony jest w odstępie posterunków następczych. Wskazania semaforów sbl są nieważne. Zachować
               ostrożność od ostatniego semafora ze wskaźnikiem "W18". Szlak wolny, ostatni pociąg nr
-              <input type="text" /> przybył do <input type="text" /> o godzinie <input type="text" />
+              <input type="text" v-model="order.row3.trainNo" /> przybył do <input type="text" v-model="order.row3.arrivedTo" /> o godzinie <input type="text" v-model="order.row3.hour" />
             </td>
           </tr>
         </tbody>
       </table>
     </section>
-
-    <section class="info">
-      <table class="info-table">
-        <tbody>
-          <tr>
-            <td colspan="4">
-              <input type="text" />
-              <br />
-              stacja
-            </td>
-
-            <td colspan="3">
-              <input type="text" />
-              <br />
-              posterunek
-            </td>
-
-            <td colspan="2">
-              <input type="text" />
-              <br />
-              godz.
-            </td>
-
-            <td colspan="1">
-              <input type="text" />
-              <br />
-              min.
-            </td>
-          </tr>
-
-          <tr>
-            <td colspan="5">
-              <input type="text" />
-              <br />
-              dyżurny ruchu
-            </td>
-
-            <td colspan="5">
-              <input type="text" />
-              <br />
-              z polecenia dyżurnego ruchu
-            </td>
-          </tr>
-        </tbody>
-      </table>
-    </section>
-  </div>
 </template>
 
 <script lang="ts">
+import { useStore } from '@/store/store';
 import { defineComponent } from 'vue';
 
 export default defineComponent({
   setup() {
-    return {};
+    const store = useStore();
+    return {
+      order: store.orderS,
+    };
   },
 });
 </script>
-
-<style lang="scss" scoped>
-@import '../styles/rozkaz.scss';
-</style>
diff --git a/src/main.ts b/src/main.ts
index a92f228..0cada51 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,6 +1,6 @@
-import { createApp } from 'vue'
-import App from './App.vue'
-import router from './router'
-import store from './store'
+import { createApp } from 'vue';
+import App from './App.vue';
+import router from './router';
+import { createPinia } from 'pinia';
 
-createApp(App).use(store).use(router).mount('#app')
+createApp(App).use(router).use(createPinia()).mount('#app');
diff --git a/src/store/index.ts b/src/store/index.ts
deleted file mode 100644
index 5f05f19..0000000
--- a/src/store/index.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { createStore } from 'vuex'
-
-export default createStore({
-  state: {
-  },
-  mutations: {
-  },
-  actions: {
-  },
-  modules: {
-  }
-})
diff --git a/src/store/store.ts b/src/store/store.ts
new file mode 100644
index 0000000..865318b
--- /dev/null
+++ b/src/store/store.ts
@@ -0,0 +1,98 @@
+import { defineStore } from 'pinia';
+
+export const useStore = defineStore('store', {
+  state: () => {
+    return {
+      orderInfo: {
+        stationName: '',
+        checkpointName: '',
+        hour: '',
+        minutes: '',
+        dispatcherName: '',
+        secondaryDispatcherName: '',
+      },
+
+      orderN: {
+        header: {
+          orderNo: '',
+          trainNo: '',
+          date: '',
+        },
+
+        row1: {
+          from: '',
+          to: '',
+          trackNo: '',
+          trackNo2: '',
+        },
+
+        row2: {
+          option1: 'signal',
+          option2: 'lewy',
+          option3: 'lewy',
+          checkbox: 'checkbox-2a',
+        },
+
+        row3: {
+          option1: 'jazda',
+          option2: 'pociąg',
+
+          direction: '',
+          toKilometer: '',
+          trackNo: '',
+          untilHour: '',
+          untilMin: '',
+        },
+
+        row4: {
+          trackNo: '',
+          optionStation: 'stację',
+          stationName: '',
+          checkbox: 'checkbox-4a',
+        },
+
+        row5: {
+          trackNo: '',
+          direction: '',
+          stationOption: 'stację',
+          on: '',
+        },
+      },
+
+      orderS: {
+        header: {
+          orderNo: '',
+          trainNo: '',
+          for: 'pociągu',
+          date: '',
+        },
+
+        row1: {
+          option1: 'sygnału',
+          checkbox1a: false,
+          checkbox1b: false,
+          signal1: '',
+          signal2: '',
+          trackNo: '',
+        },
+
+        row2: {
+          signal1: '',
+          signal2: '',
+          signal3: '',
+          trackNo: '',
+        },
+
+        row3: {
+          from: '',
+          to: '',
+          trackNo: '',
+          trainNo: '',
+          arrivedTo: '',
+          hour: '',
+        },
+      },
+    };
+  },
+});
+
diff --git a/src/styles/rozkaz.scss b/src/styles/rozkaz.scss
index e1d8923..e69de29 100644
--- a/src/styles/rozkaz.scss
+++ b/src/styles/rozkaz.scss
@@ -1,97 +0,0 @@
-.rozkaz {
-  width: 500px;
-  background-color: white;
-  color: black;
-
-  padding: 0.5em;
-  box-shadow: 0 0 15px 2px white;
-
-  h2 {
-    margin: 0;
-    padding: 0;
-  }
-
-
-
-  .header {
-    padding: 0.5em;
-    border: 2px solid black;
-    border-bottom: none;
-  }
-}
-
-.flex-row {
-  display: flex;
-  justify-content: space-between;
-  align-items: flex-end;
-}
-
-.flex-center {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-
-input {
-  max-width: 100px;
-  background-color: transparent;
-  outline: none;
-  border: none;
-
-  border-bottom: 2px dotted black;
-  font-size: 0.9em;
-  text-align: center;
-  color: black;
-}
-
-select {
-  margin-top: 0.5rem;
-  margin-right: 0.5rem;
-  font-size: 0.8rem;
-}
-
-.table-section {
-  table {
-    width: 100%;
-
-    td:first-child {
-      width: 10%;
-
-      text-align: center;
-      vertical-align: top;
-
-      font-weight: bold;
-    }
-
-    td {
-      padding: 0.35em;
-      text-align: justify;
-
-      line-height: 1.4em;
-    }
-  }
-
-  table,
-  td {
-    border: 2px solid black;
-    border-collapse: collapse;
-  }
-}
-
-table.info-table {
-  border-collapse: collapse;
-  width: 100%;
-  table-layout: fixed;
-
-  td {
-    border: 2px solid black;
-    border-collapse: collapse;
-    padding: 0.35em;
-  }
-
-  input {
-    max-width: 95%;
-  }
-
-  text-align: center;
-}
diff --git a/src/views/Home.vue b/src/views/Home.vue
index 218e96a..86f78fb 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -1,17 +1,16 @@
 <template>
   <div class="home">
-    <OrderN />
-    <OrderS v-if="false" />
+    <Order />
   </div>
 </template>
 
 <script lang="ts">
-import OrderN from '@/components/OrderN.vue';
-import OrderS from '@/components/OrderS.vue';
 import { defineComponent } from 'vue';
+import Order from "@/components/Order.vue";
+
 
 export default defineComponent({
-  components: { OrderN, OrderS },
+  components: { Order },
 });
 </script>